
.node--type-support-ticket .field.field--name-field-ai-response-resource {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(20px);
  border-radius: 24px;
  box-shadow: 0 10px 25px rgba(102, 126, 234, 0.15);
  max-width: 800px;
  width: 100%;
  overflow: hidden;
  border: 1px solid #03A9F4;
  margin: 30px 0;
  position: relative;
}
.node--type-support-ticket .field--name-field-ai-response-resource::before {
  content: '';
  position: absolute;
  top: 12px;
  left: 32px;
  width: 64px;
  height: 64px;
  background-image: url(../images/robot-avatar@2x.png);
  background-size: cover;
  background-position: center;
  border-radius: 50%;
  border: 3px solid rgba(255, 255, 255, 0.9);
  z-index: 10;
}

.node--type-support-ticket .field--name-field-ai-response-resource > .field__label {
  background: linear-gradient(270deg, #4facfe 0%, #00f2fe 100%);
  color: var(--color-white);
  padding: 24px 32px;
  font-weight: 600;
  font-size: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  position: relative;
  padding-left: 120px;
  text-shadow: 0 0 3px rgba(0,0,0,.3);
  letter-spacing: 2px;
}
.node--type-support-ticket .field--name-field-ai-response-resource > .field__label::after {
  display: none;
}
.node--type-support-ticket .field--name-field-ai-response-resource > .field__item {
  background: var(--color-white);
  padding: 32px;
  color: #374151;
  line-height: 1.7;
}
.node--type-support-ticket .field--name-field-ai-response-resource .field__item p,
.node--type-support-ticket .field--name-field-ai-response-resource .field__item ul,
.node--type-support-ticket .field--name-field-ai-response-resource .field__item ol {
  font-size: 1rem;
}
.node--type-support-ticket .field--name-field-ai-response-resource .field__item p:empty {
  margin: 0;
}
.node--type-support-ticket .field--name-field-ai-response-resource .field__item li::marker {
  color: inherit;
}
.node--type-support-ticket .field--name-field-ai-response-resource .field__item .alert {
  margin: 0 0 24px;
  font-size: 1rem;
  border-left-width: 8px;
}
.node--type-support-ticket .field.field--name-field-ai-response-resource .field__item :last-child {
  margin-bottom: 0;
}
.node--type-support-ticket .field.field--name-field-ai-response-resource .field {
  margin-bottom: 24px;
}
.node--type-support-ticket .field--name-field-related-resources {
  display: none;
}
.node--type-support-ticket .field.field--name-field-ai-response-resource .field--name-field-related-resources {
  display: block;
}

/* 載入中時隱藏實際內容 */
.node--type-support-ticket .field--name-field-ai-response-resource:not(.is-loaded) .field__item {
  display: none;
}
/* 載入中時顯示載入動畫 */
.node--type-support-ticket .field--name-field-ai-response-resource:not(.is-loaded) {
  position: relative;
  min-height: 600px;
}
/* 只使用 ::after 實現完整載入動畫 */
.node--type-support-ticket .field--name-field-ai-response-resource:not(.is-loaded)::after {
  content: '';
  position: absolute;
  top: 122px; /* 跳過 field__label 的高度 */
  left: 32px;
  right: 32px;
  height: 400px;
  background:
    /* Shimmer 光澤層 */
    linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,0.6) 50%,
        transparent 100%
    ),
    /* 警告框區域 */
    linear-gradient(90deg, #fff3cd 0%, #fff3cd 100%),
    /* 文字行背景 */
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%),
    linear-gradient(90deg, #e9ecef 0%, #e9ecef 100%);
  background-size:
    200% 100%,    /* Shimmer 光澤 */
    100% 60px,    /* 警告框 */
    90% 16px,     /* 文字行 1 */
    85% 16px,     /* 文字行 2 */
    75% 16px,     /* 文字行 3 */
    88% 16px,     /* 文字行 4 */
    80% 16px,     /* 文字行 5 */
    70% 16px,     /* 文字行 6 */
    82% 16px,     /* 文字行 7 */
    60% 16px,     /* 文字行 8 */
    90% 16px,     /* 文字行 9 */
    75% 16px,     /* 文字行 10 */
    100% 100%;    /* 底色 */
  background-position:
    -200% 0,      /* Shimmer 初始位置 */
    0 0,          /* 警告框 */
    20px 80px,    /* 文字行 1 */
    20px 106px,   /* 文字行 2 */
    40px 132px,   /* 文字行 3 */
    40px 158px,   /* 文字行 4 */
    20px 184px,   /* 文字行 5 */
    40px 210px,   /* 文字行 6 */
    40px 236px,   /* 文字行 7 */
    20px 262px,   /* 文字行 8 */
    0 288px,      /* 文字行 9 */
    20px 314px,   /* 文字行 10 */
    0 0;          /* 底色 */
  background-repeat: no-repeat;
  animation: shimmer 2s infinite ease-in-out;
}
/* Shimmer 動畫 */
@keyframes shimmer {
  0% {
    background-position: -200% 0, 0 0, 20px 80px, 20px 106px, 40px 132px, 40px 158px, 20px 184px, 40px 210px, 40px 236px, 20px 262px, 0 288px, 20px 314px, 0 0;
  }
  100% {
    background-position: 200% 0, 0 0, 20px 80px, 20px 106px, 40px 132px, 40px 158px, 20px 184px, 40px 210px, 40px 236px, 20px 262px, 0 288px, 20px 314px, 0 0;
  }
}
/* 載入完成後的漸入動畫 */
.node--type-support-ticket .field--name-field-ai-response-resource.is-loaded .field__item {
  animation: fadeIn 0.5s ease-in-out;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}