/* ============================================================
   JOBNOVA — THEMES.CSS
   Theme transitions and special theme-aware overrides
   ============================================================ */

/* ──────────────── SMOOTH THEME TRANSITION ──────────────── */
html.theme-transitioning *,
html.theme-transitioning *::before,
html.theme-transitioning *::after {
  transition:
    background-color 0.35s cubic-bezier(0.4,0,0.2,1),
    border-color 0.35s cubic-bezier(0.4,0,0.2,1),
    color 0.35s cubic-bezier(0.4,0,0.2,1),
    box-shadow 0.35s cubic-bezier(0.4,0,0.2,1) !important;
}

/* ──────────────── DARK MODE SPECIAL OVERRIDES ──────────────── */

/* Dark mode nav */
[data-theme="dark"] #main-nav {
  background: var(--bg-secondary);
  border-bottom-color: var(--border-light);
}

/* Dark mode hero blobs brighter */
[data-theme="dark"] .blob-1 {
  background: radial-gradient(circle, rgba(123,109,255,0.6) 0%, rgba(30,16,78,0.15) 70%);
}
[data-theme="dark"] .blob-2 {
  background: radial-gradient(circle, rgba(255,122,87,0.5) 0%, rgba(255,212,116,0.1) 70%);
}

/* Dark mode search card */
[data-theme="dark"] .search-card {
  box-shadow: var(--shadow-lg), 0 0 60px rgba(123,109,255,0.08);
}

/* Dark mode card hover glow */
[data-theme="dark"] .job-card:hover {
  box-shadow: var(--shadow-lg), 0 0 30px rgba(123,109,255,0.12);
}

/* Dark mode resource card hover */
[data-theme="dark"] .resource-card:hover {
  box-shadow: var(--shadow-lg), 0 0 24px rgba(123,109,255,0.1);
}

/* Dark mode footer */
[data-theme="dark"] #footer {
  background: #090717;
}

/* Dark mode filter section */
[data-theme="dark"] #filters {
  background: var(--bg-secondary);
  border-bottom-color: var(--border-light);
}

/* Dark mode input */
[data-theme="dark"] .form-input,
[data-theme="dark"] .form-select,
[data-theme="dark"] .form-textarea,
[data-theme="dark"] .search-input {
  color-scheme: dark;
}

/* Dark mode scrollbar */
[data-theme="dark"] ::-webkit-scrollbar-track {
  background: #0E0B1F;
}
[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #3A315C;
}

/* Dark mode about section */
[data-theme="dark"] #about {
  background: var(--bg-tertiary);
}

/* Dark mode contact + query section backgrounds */
[data-theme="dark"] #contact {
  background: var(--bg-tertiary);
}

/* ──────────────── THEME TOGGLE BUTTON STATES ──────────────── */
#theme-toggle .moon-icon { display: none; }
#theme-toggle .sun-icon  { display: block; }

[data-theme="dark"] #theme-toggle .moon-icon { display: block; }
[data-theme="dark"] #theme-toggle .sun-icon  { display: none; }

/* ──────────────── LANGUAGE ACTIVE STATE ──────────────── */
.lang-btn[data-active="hi"] {
  background: rgba(255,101,63,0.1);
  border-color: rgba(255,101,63,0.3);
  color: var(--accent);
}

/* ──────────────── GRADIENT MESH OVERLAY (DARK ONLY) ──────────────── */
[data-theme="dark"] #hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 40% 60% at 20% 50%, rgba(123,109,255,0.07) 0%, transparent 70%),
    radial-gradient(ellipse 35% 50% at 80% 30%, rgba(255,122,87,0.06) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

/* ──────────────── HIGH CONTRAST MODE ──────────────── */
@media (forced-colors: active) {
  .btn-primary, .apply-btn, .search-btn-full, .form-submit {
    forced-color-adjust: none;
  }
}