/*
 * USL Web port of TabNook's Aurora skin.
 * Near-black night field, violet/teal/rose light on each panel, Inter,
 * pill controls, chromatic title shadow. Inherently dark — it does not
 * follow the site light theme. Every rule is scoped to body[data-skin="aurora"].
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

body[data-skin="aurora"] {
  --aurora-violet: 167, 139, 250;
  --aurora-teal: 94, 234, 212;
  --aurora-rose: 251, 113, 133;
  --skin-radius-card: 22px;
  --skin-radius-input: 14px;
  --skin-blur: 28px;
  --skin-saturate: 140%;
  --skin-surface: rgba(8, 8, 22, 0.82);
  --skin-surface-strong: rgba(8, 8, 22, 0.94);
  --skin-border: rgba(255, 255, 255, 0.14);
  --skin-text: #f7f7fb;
  --skin-text-muted: #d7d8e4;
  --skin-text-link: #b9e4ff;
  --skin-text-shadow:
    1px 0 0 rgba(var(--aurora-violet), 0.55),
    -1px 0 0 rgba(var(--aurora-teal), 0.55);
  --skin-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 30px 60px -20px rgba(0, 0, 0, 0.6),
    0 8px 24px -8px rgba(var(--aurora-violet), 0.18);
  --skin-font-display: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color-scheme: dark;
  background-color: #03030c !important;
  background-image:
    linear-gradient(180deg, rgba(var(--aurora-violet), 0.14) 0%, transparent 35%),
    linear-gradient(0deg, rgba(var(--aurora-teal), 0.08) 0%, transparent 22%) !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  color: var(--skin-text) !important;
  font-family: var(--skin-font-display);
  letter-spacing: -0.01em;
  position: relative;
}

body[data-skin="aurora"]::before {
  content: "";
  position: fixed;
  inset: -20%;
  background: linear-gradient(115deg,
    transparent 0%,
    transparent 28%,
    rgba(var(--aurora-violet), 0.22) 42%,
    rgba(var(--aurora-teal), 0.26) 55%,
    rgba(var(--aurora-rose), 0.18) 68%,
    transparent 88%,
    transparent 100%);
  filter: blur(80px);
  pointer-events: none;
  z-index: -1;
}

body[data-skin="aurora"] h1,
body[data-skin="aurora"] h2,
body[data-skin="aurora"] h3,
body[data-skin="aurora"] h4,
body[data-skin="aurora"] h5,
body[data-skin="aurora"] h6,
body[data-skin="aurora"] .home-wordmark-title,
body[data-skin="aurora"] .ft-name,
body[data-skin="aurora"] .section-head,
body[data-skin="aurora"] .navbar-brand,
body[data-skin="aurora"] .navbar-brand-text {
  font-family: var(--skin-font-display) !important;
  color: #ffffff !important;
  text-shadow: var(--skin-text-shadow);
  letter-spacing: -0.02em;
  text-transform: none;
}

body[data-skin="aurora"] .home-banner { background: transparent !important; }

body[data-skin="aurora"] .home-wordmark-rule {
  background: linear-gradient(90deg,
    rgba(var(--aurora-violet), 0.15),
    rgba(var(--aurora-teal), 0.9),
    rgba(var(--aurora-rose), 0.75),
    rgba(var(--aurora-violet), 0.15)) !important;
  box-shadow: 0 0 16px rgba(var(--aurora-teal), 0.35);
}

body[data-skin="aurora"] a { color: var(--skin-text-link); }
body[data-skin="aurora"] a:hover { color: #ffffff; }

body[data-skin="aurora"] p,
body[data-skin="aurora"] li,
body[data-skin="aurora"] label,
body[data-skin="aurora"] .lede,
body[data-skin="aurora"] .site-desc,
body[data-skin="aurora"] .store-lede,
body[data-skin="aurora"] .disc-note,
body[data-skin="aurora"] .text-muted,
body[data-skin="aurora"] .form-text,
body[data-skin="aurora"] .ft-count,
body[data-skin="aurora"] .topic-count {
  color: var(--skin-text-muted) !important;
  text-shadow: none;
}

body[data-skin="aurora"] .res-card,
body[data-skin="aurora"] .facet-tile,
body[data-skin="aurora"] .featured-card,
body[data-skin="aurora"] .home-store-card,
body[data-skin="aurora"] .prod-card,
body[data-skin="aurora"] .card,
body[data-skin="aurora"] .lb-box,
body[data-skin="aurora"] .rpt-box,
body[data-skin="aurora"] .store-lb-box,
body[data-skin="aurora"] .sidebar,
body[data-skin="aurora"] .usl-situation,
body[data-skin="aurora"] .site-foot {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--skin-surface) !important;
  color: var(--skin-text) !important;
  border: 1px solid var(--skin-border) !important;
  border-top-color: rgba(var(--aurora-teal), 0.4) !important;
  border-radius: var(--skin-radius-card) !important;
  box-shadow: inset 0 1px 0 rgba(var(--aurora-teal), 0.22), var(--skin-shadow) !important;
  backdrop-filter: blur(var(--skin-blur)) saturate(var(--skin-saturate));
  -webkit-backdrop-filter: blur(var(--skin-blur)) saturate(var(--skin-saturate));
}

body[data-skin="aurora"] .res-card::before,
body[data-skin="aurora"] .facet-tile::before,
body[data-skin="aurora"] .featured-card::before,
body[data-skin="aurora"] .home-store-card::before,
body[data-skin="aurora"] .prod-card::before,
body[data-skin="aurora"] .card::before,
body[data-skin="aurora"] .usl-situation::before,
body[data-skin="aurora"] .site-foot::before {
  content: "";
  position: absolute;
  inset: -20%;
  background: linear-gradient(115deg,
    transparent 0%,
    rgba(var(--aurora-violet), 0.5) 28%,
    rgba(var(--aurora-teal), 0.62) 50%,
    rgba(var(--aurora-rose), 0.42) 72%,
    transparent 100%);
  filter: blur(28px);
  mix-blend-mode: screen;
  opacity: 0.42;
  pointer-events: none;
  z-index: 0;
}

body[data-skin="aurora"] .res-card > *,
body[data-skin="aurora"] .facet-tile > *,
body[data-skin="aurora"] .featured-card > *,
body[data-skin="aurora"] .home-store-card > *,
body[data-skin="aurora"] .prod-card > *,
body[data-skin="aurora"] .card > *,
body[data-skin="aurora"] .usl-situation > *,
body[data-skin="aurora"] .site-foot > * {
  position: relative;
  z-index: 1;
}

body[data-skin="aurora"] .res-card:hover,
body[data-skin="aurora"] .facet-tile:hover,
body[data-skin="aurora"] .featured-card:hover,
body[data-skin="aurora"] .card:hover {
  transform: translateY(-2px);
}

body[data-skin="aurora"] .res-card:hover::before,
body[data-skin="aurora"] .facet-tile:hover::before,
body[data-skin="aurora"] .featured-card:hover::before,
body[data-skin="aurora"] .card:hover::before {
  opacity: 0.62;
}

body[data-skin="aurora"] .card-header,
body[data-skin="aurora"] .lb-head,
body[data-skin="aurora"] .store-lb-head {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, transparent 100%) !important;
  color: #ffffff !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
  text-shadow: var(--skin-text-shadow);
}

body[data-skin="aurora"] .card-body,
body[data-skin="aurora"] .rc-body,
body[data-skin="aurora"] .pc-body {
  background: transparent !important;
  color: var(--skin-text) !important;
}

body[data-skin="aurora"] .res-card h5,
body[data-skin="aurora"] .featured-card h5,
body[data-skin="aurora"] .home-store-title {
  color: #ffffff !important;
  text-shadow: var(--skin-text-shadow);
}

body[data-skin="aurora"] .res-card p,
body[data-skin="aurora"] .featured-card p {
  color: var(--skin-text-muted) !important;
  text-shadow: none;
}

body[data-skin="aurora"] .section-head .sh-icon { color: rgb(var(--aurora-teal)) !important; }

body[data-skin="aurora"] .type-chip,
body[data-skin="aurora"] .cat-chip,
body[data-skin="aurora"] .topic-pills a,
body[data-skin="aurora"] .rb-saved {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #ffffff !important;
  border: 1px solid rgba(var(--aurora-teal), 0.35) !important;
  border-radius: 999px !important;
}

body[data-skin="aurora"] .type-chip:hover,
body[data-skin="aurora"] .cat-chip.on,
body[data-skin="aurora"] .topic-pills a[aria-current="page"] {
  background: rgba(var(--aurora-teal), 0.2) !important;
  color: #ffffff !important;
}

body[data-skin="aurora"] #navbar-placeholder .navbar {
  background: rgba(8, 8, 22, 0.78) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(20px) saturate(var(--skin-saturate));
  -webkit-backdrop-filter: blur(20px) saturate(var(--skin-saturate));
  box-shadow: inset 0 1px 0 rgba(var(--aurora-teal), 0.2), 0 10px 28px -16px rgba(0, 0, 0, 0.7) !important;
  position: sticky;
  z-index: 1030;
}

body[data-skin="aurora"] #navbar-placeholder .navbar-brand,
body[data-skin="aurora"] #navbar-placeholder .navbar-brand-text,
body[data-skin="aurora"] #navbar-placeholder .nav-link {
  color: #ffffff !important;
  text-shadow: var(--skin-text-shadow);
  font-family: var(--skin-font-display);
}

body[data-skin="aurora"] #navbar-placeholder .btn-store,
body[data-skin="aurora"] #navbar-placeholder .btn-suggest,
body[data-skin="aurora"] #navbar-placeholder .btn-contact,
body[data-skin="aurora"] #navbar-placeholder .btn-reader,
body[data-skin="aurora"] #navbar-placeholder .btn-videos,
body[data-skin="aurora"] #navbar-placeholder .btn-topics,
body[data-skin="aurora"] #navbar-placeholder .btn-library,
body[data-skin="aurora"] #navbar-placeholder .btn-auth,
body[data-skin="aurora"] .home-store-cta,
body[data-skin="aurora"] .btn,
body[data-skin="aurora"] .btn-primary,
body[data-skin="aurora"] .btn-dark,
body[data-skin="aurora"] .btn-amazon,
body[data-skin="aurora"] .load-more,
body[data-skin="aurora"] .rc-btn,
body[data-skin="aurora"] .rpt-submit,
body[data-skin="aurora"] .rpt-cancel,
body[data-skin="aurora"] .usl-situation-toggle {
  border-radius: 999px !important;
  font-family: var(--skin-font-display) !important;
  font-weight: 600;
  letter-spacing: -0.01em;
  text-transform: none;
  text-shadow: none;
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  border: 1px solid rgba(var(--aurora-teal), 0.35) !important;
  box-shadow: inset 0 1px 0 rgba(var(--aurora-teal), 0.2), 0 6px 16px rgba(0, 0, 0, 0.28) !important;
}

/* Keep the shared nav on Rajdhani so the homepage count stays on screen. */
body[data-skin="aurora"] #navbar-placeholder .navbar-nav .btn-store,
body[data-skin="aurora"] #navbar-placeholder .navbar-nav .btn-suggest,
body[data-skin="aurora"] #navbar-placeholder .navbar-nav .btn-contact,
body[data-skin="aurora"] #navbar-placeholder .navbar-nav .btn-reader,
body[data-skin="aurora"] #navbar-placeholder .navbar-nav .btn-videos,
body[data-skin="aurora"] #navbar-placeholder .navbar-nav .btn-topics,
body[data-skin="aurora"] #navbar-placeholder .navbar-nav .btn-library,
body[data-skin="aurora"] #navbar-placeholder .navbar-nav .btn-auth {
  font-family: 'Rajdhani', sans-serif !important;
  font-size: 0.92rem;
  text-shadow: none;
}

body[data-skin="aurora"] #navbar-placeholder .btn-store,
body[data-skin="aurora"] .home-store-cta,
body[data-skin="aurora"] .btn-primary,
body[data-skin="aurora"] .btn-dark,
body[data-skin="aurora"] .btn-amazon,
body[data-skin="aurora"] .rpt-submit {
  background: linear-gradient(135deg, #115e59 0%, #5b21b6 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

body[data-skin="aurora"] #navbar-placeholder .btn-suggest {
  background: linear-gradient(135deg, #9f1239 0%, #6d28d9 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

body[data-skin="aurora"] #navbar-placeholder .btn-store:hover,
body[data-skin="aurora"] #navbar-placeholder .btn-suggest:hover,
body[data-skin="aurora"] .btn:hover,
body[data-skin="aurora"] .home-store-cta:hover {
  transform: translateY(-1px);
  text-decoration: none;
}

body[data-skin="aurora"] #navbar-placeholder .usl-theme-toggle,
body[data-skin="aurora"] #navbar-placeholder .usl-saved-toggle {
  background: rgba(255, 255, 255, 0.06);
  color: #ffffff;
  border: 1px solid rgba(var(--aurora-teal), 0.35);
}

body[data-skin="aurora"] #navbar-placeholder .usl-skin-btn {
  background-color: rgba(8, 8, 22, 0.9);
  background-image: none;
  color: #ffffff;
  border: 1px solid rgba(var(--aurora-teal), 0.4);
  border-radius: 50%;
  text-shadow: none;
}

body[data-skin="aurora"] #navbar-placeholder .usl-skin-menu {
  background: var(--skin-surface-strong);
  color: #ffffff;
  border: 1px solid var(--skin-border);
  border-radius: 14px;
  box-shadow: var(--skin-shadow);
}

body[data-skin="aurora"] #navbar-placeholder .usl-skin-menu li {
  color: #ffffff;
}

body[data-skin="aurora"] #navbar-placeholder .usl-skin-menu li:hover,
body[data-skin="aurora"] #navbar-placeholder .usl-skin-menu li:focus,
body[data-skin="aurora"] #navbar-placeholder .usl-skin-menu li[aria-selected="true"] {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

body[data-skin="aurora"] .navbar-toggler {
  border-color: rgba(var(--aurora-teal), 0.4) !important;
}

body[data-skin="aurora"] .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='%235eead4' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

body[data-skin="aurora"] .dropdown-menu {
  background: var(--skin-surface-strong) !important;
  color: #ffffff !important;
  border: 1px solid var(--skin-border) !important;
  border-radius: 14px !important;
  box-shadow: var(--skin-shadow) !important;
  z-index: 1050 !important;
}

body[data-skin="aurora"] .dropdown-item { color: #ffffff !important; }

body[data-skin="aurora"] .dropdown-item:hover,
body[data-skin="aurora"] .dropdown-item:focus {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}

body[data-skin="aurora"] .form-control,
body[data-skin="aurora"] select,
body[data-skin="aurora"] textarea,
body[data-skin="aurora"] .header-search input,
body[data-skin="aurora"] .sort-sel,
body[data-skin="aurora"] .store-search input {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: var(--skin-radius-input) !important;
  font-family: var(--skin-font-display);
}

body[data-skin="aurora"] .form-control:focus,
body[data-skin="aurora"] textarea:focus,
body[data-skin="aurora"] .header-search input:focus {
  border-color: rgba(var(--aurora-teal), 0.7) !important;
  box-shadow: 0 0 0 3px rgba(var(--aurora-teal), 0.22) !important;
  color: #ffffff !important;
}

body[data-skin="aurora"] .form-control::placeholder,
body[data-skin="aurora"] .header-search input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

body[data-skin="aurora"] .header-search i,
body[data-skin="aurora"] .store-search i { color: rgb(var(--aurora-teal)) !important; }

body[data-skin="aurora"] .suggest {
  background: #080816 !important;
  border: 1px solid rgba(var(--aurora-teal), 0.35) !important;
  border-radius: 14px;
  z-index: 1060;
}

body[data-skin="aurora"] .suggest div { color: #ffffff !important; }

body[data-skin="aurora"] .usl-situation-kicker {
  color: rgb(var(--aurora-teal)) !important;
  text-shadow: none;
}

body[data-skin="aurora"] .usl-situation-headline,
body[data-skin="aurora"] .usl-situation-copy {
  color: #ffffff !important;
  text-shadow: none;
}

body[data-skin="aurora"] .usl-situation--calm .usl-situation-level { color: #8ee0b0 !important; }
body[data-skin="aurora"] .usl-situation--elevated .usl-situation-level { color: #f0d078 !important; }
body[data-skin="aurora"] .usl-situation--high .usl-situation-level { color: #f0b48a !important; }
body[data-skin="aurora"] .usl-situation--critical .usl-situation-level { color: #f0a8a8 !important; }

body[data-skin="aurora"] .usl-situation-asof,
body[data-skin="aurora"] .usl-situation-regions,
body[data-skin="aurora"] .site-foot,
body[data-skin="aurora"] .site-foot .foot-copy {
  color: var(--skin-text-muted) !important;
}

body[data-skin="aurora"] .site-foot a,
body[data-skin="aurora"] .usl-situation-sources a {
  color: var(--skin-text-link) !important;
}

body[data-skin="aurora"] .lb-overlay,
body[data-skin="aurora"] .rpt-overlay,
body[data-skin="aurora"] .store-lb,
body[data-skin="aurora"] .modal { z-index: 1080; }

body[data-skin="aurora"] .modal-content {
  background: var(--skin-surface-strong) !important;
  color: #ffffff !important;
  border: 1px solid var(--skin-border) !important;
  border-radius: var(--skin-radius-card) !important;
  box-shadow: var(--skin-shadow) !important;
}

body[data-skin="aurora"] .result-bar,
body[data-skin="aurora"] .header-stat,
body[data-skin="aurora"] .header-stat b,
body[data-skin="aurora"] #totalCount,
body[data-skin="aurora"] .rb-count { color: #f7f7fb !important; }

body[data-skin="aurora"] .home-store-photo,
body[data-skin="aurora"] .prod-card .pc-media,
body[data-skin="aurora"] .prod-card .pc-media.has-photo,
body[data-skin="aurora"] .store-lb-imgwrap,
body[data-skin="aurora"] .reader-article-thumb-wrap { background: rgba(255, 255, 255, 0.04) !important; }

body[data-skin="aurora"] .reader-sidebar,
body[data-skin="aurora"] .reader-toolbar,
body[data-skin="aurora"] .reader-guest-note,
body[data-skin="aurora"] .reader-article {
  background: var(--skin-surface) !important;
  color: #f7f7fb !important;
  border-color: var(--skin-border) !important;
}

body[data-skin="aurora"] .reader-view-item,
body[data-skin="aurora"] .reader-feed-row,
body[data-skin="aurora"] .reader-sidebar-title,
body[data-skin="aurora"] .reader-stream-title,
body[data-skin="aurora"] .reader-lede,
body[data-skin="aurora"] .reader-article-title,
body[data-skin="aurora"] .reader-article-excerpt { color: #f7f7fb !important; }

body[data-skin="aurora"] .btn-outline-dark,
body[data-skin="aurora"] .btn-outline-secondary {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #ffffff !important;
  border-color: rgba(var(--aurora-teal), 0.35) !important;
}

body[data-skin="aurora"][data-skin-cursors="on"] {
  cursor: url('/assets/skins/aurora/defaultarrow.png') 0 0, default !important;
}

body[data-skin="aurora"][data-skin-cursors="on"] a,
body[data-skin="aurora"][data-skin-cursors="on"] button,
body[data-skin="aurora"][data-skin-cursors="on"] [role="button"],
body[data-skin="aurora"][data-skin-cursors="on"] .btn,
body[data-skin="aurora"][data-skin-cursors="on"] .dropdown-item,
body[data-skin="aurora"][data-skin-cursors="on"] select,
body[data-skin="aurora"][data-skin-cursors="on"] summary,
body[data-skin="aurora"][data-skin-cursors="on"] label[for],
body[data-skin="aurora"][data-skin-cursors="on"] .res-card,
body[data-skin="aurora"][data-skin-cursors="on"] .facet-tile,
body[data-skin="aurora"][data-skin-cursors="on"] .featured-card,
body[data-skin="aurora"][data-skin-cursors="on"] .type-chip,
body[data-skin="aurora"][data-skin-cursors="on"] .prod-card {
  cursor: url('/assets/skins/aurora/pointer.png') 10 0, pointer !important;
}

body[data-skin="aurora"][data-skin-cursors="on"] input,
body[data-skin="aurora"][data-skin-cursors="on"] textarea {
  cursor: url('/assets/skins/aurora/ibeam.png') 16 16, text !important;
}

@media (prefers-reduced-motion: reduce) {
  body[data-skin="aurora"] .res-card,
  body[data-skin="aurora"] .card,
  body[data-skin="aurora"] .btn { transition: none !important; }
}