/* ============================================================
   AI 이미지 툴 — Azure Blue 테마 오버라이드
   (docs/색상컨셉03.html · Azure Blue 원본 팔레트)

   적용 범위:
   - 탭 스트립/탭/툴 영역 등 공용 크롬과 제목 카드(.aimg-model-header)는
     모든 탭에 무조건 적용.
   - 탭 "본문" 색상은 .ai-tool-body.ai-azure-content 안에서만 적용한다.
     → 전체 갤러리(gallery-all)·블로그 AI이미지(blog-image) 탭은 이 클래스를
       붙이지 않으므로 본문 내부는 기존 색상을 유지하고, 제목 카드만 바뀐다.
   기존 색상 정의는 그대로 두고 이 파일이 마지막에 로드되어 덮어쓴다.
   ============================================================ */

.ai-tabs-wrap {
  --az-bg: #F5EEDF;
  --az-surface: #FCF7EC;
  --az-surface-alt: #ECE2CE;
  --az-primary: #3A6EA4;
  --az-primary-deep: #2A5179;
  --az-secondary: #8FA06B;
  --az-accent: #F2C03E;
  --az-ink: #243240;
  --az-muted: #6E7178;
  --az-border: #E4D9C3;
}

/* ===== 공용 크롬 (모든 탭) ===== */
.ai-tabs-wrap {
  background: var(--az-surface);
  border-color: var(--az-border);
  border-radius: 0;           /* 탭 외곽 카드: 둥근 모서리 → 직각 */
}

.ai-tab-strip {
  background: var(--az-surface-alt);
  border-bottom-color: var(--az-border);
}

/* 비활성 탭: 안은 주변 배경색(트랙)과 동일, 윤곽선은 활성 탭 내부색과 동일하게 밝게 */
.ai-tab {
  color: var(--az-muted);
  background: transparent;
  border-color: var(--az-surface);
}

.ai-tab:hover {
  color: var(--az-ink);
  background: #FFFDF6;
  border-color: var(--az-primary);
}

.ai-tab.active {
  background: var(--az-surface);
  color: var(--az-primary);
  border-color: var(--az-primary);
  box-shadow: 0 1px 3px rgba(42, 81, 121, 0.18);
}

/* ===== 제목 카드 (모든 탭 — 제외 탭 포함) ===== */
.ai-tabs-wrap .aimg-model-header {
  color: #FCF7EC;
  background: linear-gradient(135deg, var(--az-primary) 0%, var(--az-primary-deep) 100%);
  border-color: var(--az-primary-deep);
}

.ai-tabs-wrap .aimg-model-header .apose-model-sub {
  color: rgba(252, 247, 236, 0.82);
}

/* ===== 탭 본문 (themed 탭만) ===== */
.ai-tool-body.ai-azure-content {
  background: var(--az-bg);
}

/* 카드/표면 */
.ai-azure-content .aimg-card,
.ai-azure-content .ai-placeholder-card,
.ai-azure-content .apose-select-card,
.ai-azure-content .apose-option-card,
.ai-azure-content .apose-i2i-section,
.ai-azure-content .ageneral-settings-selectors {
  background: #fff;
  border-color: var(--az-border);
}

.ai-azure-content .aimg-result-wrap {
  background: var(--az-surface-alt);
  border-color: var(--az-border);
}

/* 텍스트/라벨/제목 */
.ai-azure-content .aimg-label,
.ai-azure-content .apose-option-card h3,
.ai-azure-content .apose-select-card .aimg-label,
.ai-azure-content .ai-tool-title {
  color: var(--az-ink);
}

.ai-azure-content .apose-option-card p,
.ai-azure-content .apose-static-help,
.ai-azure-content .aimg-file-name {
  color: var(--az-muted);
}

.ai-azure-content .apose-settings-summary-card .apose-summary-line,
.ai-azure-content .apose-settings-summary-card .apose-summary-line strong {
  color: var(--az-ink);
}

/* 입력 컨트롤 */
.ai-azure-content .apose-select,
.ai-azure-content .apose-select-card-input,
.ai-azure-content .aimg-textarea,
.ai-azure-content .aimg-file-input {
  border-color: var(--az-border);
  color: var(--az-ink);
}

.ai-azure-content .apose-select:focus,
.ai-azure-content .apose-select-card-input:focus,
.ai-azure-content .aimg-textarea:focus,
.ai-azure-content .aimg-file-input:focus {
  border-color: var(--az-primary);
  box-shadow: 0 0 0 3px rgba(58, 110, 164, 0.15);
}

/* 보조(아웃라인) 버튼 */
.ai-azure-content .aimg-translate-btn,
.ai-azure-content .aimg-modal-btn-add,
.ai-azure-content .ageneral-prompt-icon-btn {
  border-color: var(--az-primary);
  color: var(--az-primary);
  background: var(--az-surface);
}

.ai-azure-content .aimg-translate-btn:hover,
.ai-azure-content .aimg-modal-btn-add:hover,
.ai-azure-content .ageneral-prompt-icon-btn:hover {
  background: var(--az-primary);
  color: #FCF7EC;
}

/* 주요(채움) 버튼 — 생성 등 */
.ai-azure-content .essay-btn {
  background-color: var(--az-primary);
}

.ai-azure-content .essay-btn:hover {
  background-color: var(--az-primary-deep);
}

/* 모드 라디오 / 도움 배지 */
.ai-azure-content .apose-mode-radio-label.is-active {
  background: var(--az-primary);
  box-shadow: 0 2px 8px rgba(42, 81, 121, 0.22);
}

.ai-azure-content .apose-help-badge {
  background: #EEF4FA;
  border-color: #CFE0EF;
  color: var(--az-primary-deep);
}

.ai-azure-content .apose-preview-wrap.has-image,
.ai-azure-content .aimg-preview-wrap.has-image {
  border-color: var(--az-primary);
}

/* 모달 (themed 탭의 본문 내 모달) */
.ai-azure-content .aimg-modal-content {
  background: var(--az-surface);
}

.ai-azure-content .aimg-modal-header {
  background: var(--az-surface-alt);
  border-bottom-color: var(--az-border);
}

.ai-azure-content .aimg-modal-header .modal-title {
  color: var(--az-primary-deep);
}

.ai-azure-content .aimg-modal-footer {
  border-top-color: var(--az-border);
}

.ai-azure-content .apose-settings-modal-body {
  background: var(--az-surface);
}

/* ============================================================
   색상 다양화 — 팔레트 전체(secondary 올리브 / accent 골드 포함) 활용
   ============================================================ */

/* 활성 탭 상단 골드 라인 */
.ai-tab.active {
  box-shadow: inset 0 3px 0 var(--az-accent), 0 1px 3px rgba(42, 81, 121, 0.18);
}

/* 제목 카드 골드 좌측 액센트 + 골드 하단 라인 */
.ai-tabs-wrap .aimg-model-header {
  border-left: 4px solid var(--az-accent);
  border-bottom: 3px solid var(--az-accent);
}

/* 옵션/모델 카드: 상단 컬러 바를 primary → secondary → accent 로 순환 */
.ai-azure-content .apose-option-card,
.ai-azure-content .apose-select-card {
  border-top: 3px solid var(--az-primary);
}
.ai-azure-content .apose-option-card:nth-child(3n+2),
.ai-azure-content .apose-select-card:nth-child(3n+2) {
  border-top-color: var(--az-secondary);
}
.ai-azure-content .apose-option-card:nth-child(3n),
.ai-azure-content .apose-select-card:nth-child(3n) {
  border-top-color: var(--az-accent);
}
.ai-azure-content .apose-option-card:nth-child(3n) h3 {
  color: var(--az-primary-deep);
}
.ai-azure-content .apose-option-card:nth-child(3n+2) h3 {
  color: var(--az-secondary);
}

/* 도움 배지 — 골드 톤 */
.ai-azure-content .apose-help-badge {
  background: #FBF1D2;
  border-color: var(--az-accent);
  color: #8A6A12;
}

/* 카운트 배지 / 카드 메타 — 올리브 */
.ai-azure-content .apose-select-count-badge {
  background: var(--az-secondary);
  color: #fff;
}

/* 요약 카드 좌측 액센트 (모델 = primary, 세부 = secondary) */
.ai-azure-content #apose-selection-summary,
.ai-azure-content #aclothes-selection-summary,
.ai-azure-content #abgimg-selection-summary {
  border-left: 4px solid var(--az-primary);
}
.ai-azure-content #apose-settings-summary,
.ai-azure-content #aclothes-settings-summary,
.ai-azure-content #abgimg-settings-summary {
  border-left: 4px solid var(--az-secondary);
}

/* 보조 버튼 변주: 모달 '추가' 버튼 = 올리브 (translate 버튼의 primary 와 구분) */
.ai-azure-content .aimg-modal-btn-add {
  border-color: var(--az-secondary);
  color: #5E6E3F;
  background: var(--az-surface);
}
.ai-azure-content .aimg-modal-btn-add:hover {
  background: var(--az-secondary);
  color: #fff;
}

/* 모달 헤더 골드 하단 라인 + 제목 deep */
.ai-azure-content .aimg-modal-header {
  border-bottom: 2px solid var(--az-accent);
}

/* static help 강조어 = primary-deep */
.ai-azure-content .apose-static-help strong {
  color: var(--az-primary-deep);
}

/* 결과 placeholder 아이콘/문구 = 올리브 톤 */
.ai-azure-content .aimg-result-placeholder {
  color: #9AA882;
}

/* 생성 버튼 hover 골드 글로우 */
.ai-azure-content .essay-btn:hover {
  box-shadow: 0 4px 14px rgba(242, 192, 62, 0.35);
}

/* 모드 라디오 비활성 hover = 올리브 틴트 */
.ai-azure-content .apose-mode-radio-label:hover {
  background: rgba(143, 160, 107, 0.16);
  color: var(--az-primary-deep);
}

/* 잠금 프롬프트 항목 메타 = 골드 */
.ai-azure-content .apose-prompt-item.is-locked .apose-prompt-item-meta {
  color: #A8801A;
}

/* 라벨에 작은 골드 마커 느낌의 액센트 (세부 옵션 카드 제목 밑줄) */
.ai-azure-content .apose-option-card h3 {
  border-bottom: 1px dotted var(--az-border);
  padding-bottom: 6px;
}