/* ============================================================
   Phase Theme System
   L3-08: Phase 전환 테마

   Day/Night Phase 간 시각적 테마 전환 시스템
   - Day Theme: 밝고 따뜻한 톤 (전투의 긴장감)
   - Night Theme: 어둡고 차분한 톤 (영업의 편안함)
   - 부드러운 전환 애니메이션 (0.8초)
   ============================================================ */

/* ========== 공통 전환 애니메이션 ========== */
body,
#gameWrapper,
.building-shop,
#info,
.phase-banner {
  transition: background-color 0.8s ease,
              color 0.8s ease,
              border-color 0.8s ease,
              box-shadow 0.8s ease;
}

/* ========== Day Theme (낮 - 전투) ========== */
.theme-day {
  /* 배경 - 밝고 따뜻한 톤 */
  --theme-bg-primary: #f4e4c1;      /* 연한 베이지 */
  --theme-bg-secondary: #e8d5b7;    /* 모래색 */
  --theme-bg-overlay: rgba(255, 220, 150, 0.1);  /* 햇살 효과 */

  /* 텍스트 - 어두운 톤 */
  --theme-text-primary: #2d1b0e;
  --theme-text-secondary: #5a3d2a;

  /* UI 강조 - 경고/긴장감 */
  --theme-accent: #d9534f;          /* 붉은 계열 */
  --theme-border: #c9a87c;

  /* Phase Banner */
  --theme-banner-bg: linear-gradient(135deg, #ffd700 0%, #ff8c00 100%);
  --theme-banner-text: #1a0f0a;
  --theme-banner-shadow: 0 4px 12px rgba(255, 140, 0, 0.3);
}

body.theme-day {
  background-color: var(--theme-bg-primary) !important;
  color: var(--theme-text-primary) !important;
}

body.theme-day #gameWrapper {
  background-color: var(--theme-bg-secondary);
  position: relative;
}

body.theme-day #gameWrapper::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--theme-bg-overlay);
  pointer-events: none;
  transition: background 1s ease;
  z-index: 0;
}

body.theme-day #gameWrapper > * {
  position: relative;
  z-index: 1;
}

body.theme-day #info {
  background-color: var(--theme-bg-secondary);
  border-color: var(--theme-border);
}

body.theme-day #info .label {
  color: var(--theme-text-secondary);
}

body.theme-day #info .value {
  color: var(--theme-text-primary);
  font-weight: bold;
}

body.theme-day .phase-banner {
  background: var(--theme-banner-bg);
  color: var(--theme-banner-text);
  box-shadow: var(--theme-banner-shadow);
}

body.theme-day .building-shop {
  background-color: rgba(232, 213, 183, 0.95);
  border-color: var(--theme-border);
}

body.theme-day button {
  background: linear-gradient(135deg, #ff8c00 0%, #ff6347 100%);
  border-color: #d9534f;
  color: white;
}

body.theme-day button:hover:not(:disabled) {
  background: linear-gradient(135deg, #ff7700 0%, #ff5733 100%);
}

/* ========== Night Theme (밤 - 영업) ========== */
.theme-night {
  /* 배경 - 어둡고 차분한 톤 */
  --theme-bg-primary: #1a0f0a;      /* 어두운 갈색 */
  --theme-bg-secondary: #2d1b0e;    /* 중간 갈색 */
  --theme-bg-overlay: rgba(70, 130, 180, 0.1);  /* 달빛 효과 */

  /* 텍스트 - 밝은 톤 */
  --theme-text-primary: #f4e4c1;
  --theme-text-secondary: #c9a87c;

  /* UI 강조 - 차분한 톤 */
  --theme-accent: #4682b4;          /* 푸른 계열 */
  --theme-border: #5a3d2a;

  /* Phase Banner */
  --theme-banner-bg: linear-gradient(135deg, #4682b4 0%, #2c5282 100%);
  --theme-banner-text: #f4e4c1;
  --theme-banner-shadow: 0 4px 12px rgba(70, 130, 180, 0.3);
}

body.theme-night {
  background-color: var(--theme-bg-primary) !important;
  color: var(--theme-text-primary) !important;
}

body.theme-night #gameWrapper {
  background-color: var(--theme-bg-secondary);
  position: relative;
}

body.theme-night #gameWrapper::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--theme-bg-overlay);
  pointer-events: none;
  transition: background 1s ease;
  z-index: 0;
}

body.theme-night #gameWrapper > * {
  position: relative;
  z-index: 1;
}

body.theme-night #info {
  background-color: var(--theme-bg-secondary);
  border-color: var(--theme-border);
}

body.theme-night #info .label {
  color: var(--theme-text-secondary);
}

body.theme-night #info .value {
  color: var(--theme-text-primary);
  font-weight: bold;
}

body.theme-night .phase-banner {
  background: var(--theme-banner-bg);
  color: var(--theme-banner-text);
  box-shadow: var(--theme-banner-shadow);
}

body.theme-night .building-shop {
  background-color: rgba(45, 27, 14, 0.95);
  border-color: var(--theme-border);
}

body.theme-night button {
  background: linear-gradient(135deg, #4682b4 0%, #2c5282 100%);
  border-color: #4682b4;
  color: white;
}

body.theme-night button:hover:not(:disabled) {
  background: linear-gradient(135deg, #5a9fd4 0%, #3d6fa2 100%);
}

/* ========== 기본 테마 (Preparation Phase = Night) ========== */
/* Preparation Phase는 Night 테마와 동일하게 처리 */
body:not(.theme-day):not(.theme-night) {
  /* 기본값은 Night 테마 적용 */
  background-color: #1a0f0a;
  color: #f4e4c1;
}

/* ========== 접근성: 애니메이션 감소 모드 ========== */
@media (prefers-reduced-motion: reduce) {
  body,
  #gameWrapper,
  .building-shop,
  #info,
  .phase-banner {
    transition: none;
  }

  #gameWrapper::before {
    transition: none;
  }
}

/* ========== 반응형: 모바일에서는 전환 시간 단축 ========== */
@media (max-width: 768px) {
  body,
  #gameWrapper,
  .building-shop,
  #info,
  .phase-banner {
    transition-duration: 0.5s;
  }
}
