/* ─── Quantum Justice — Custom CSS ─────────────────────────────────────────── */

/* Material-Symbols icon rendering */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  display: inline-block;
  line-height: 1;
}

/* Amber glow on hover for primary CTA buttons */
.glow-hover:hover {
  box-shadow: 0 0 30px rgba(255, 157, 0, 0.6);
  transform: scale(1.02);
}

/* Section reveal gradient overlay */
.reveal-shadow {
  background: linear-gradient(to bottom, rgba(18, 20, 20, 0) 0%, rgba(18, 20, 20, 1) 90%);
}

/* Asymmetric clip-path for accent sections */
.asymmetric-clip {
  clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%);
}

/* Ghost/outlined text utility */
.text-outline {
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.1);
  color: transparent;
}

/* Fixed-background parallax for atmospheric sections */
.parallax-bg {
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* WordPress alignment helpers */
.alignnone  { margin: 0; }
.aligncenter { display: block; margin: 0 auto; }
.alignleft  { float: left; margin: 0 1.5em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1.5em; }

/* WP admin bar spacing */
body.admin-bar .sticky-header { top: 32px; }

/* ─── Scroll-reveal animation base (JS-driven) ──────────────────────────────── */
.reveal-ready {
  transition: opacity 1.2s ease-out, transform 1.2s ease-out;
}
.reveal-ready.is-hidden {
  opacity: 0;
  transform: translateY(3rem);
}
.reveal-ready.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ─── Light section overrides (data-theme="light") ─────────────────────────────
   Applied to white-background sections on inner pages.
   Overrides Tailwind dark-mode colour tokens so text remains visible.
   No need to touch PHP — just tag the section with data-theme="light".        */

[data-theme="light"] {
  color: #101415;
}

/* Headings */
[data-theme="light"] .text-on-surface {
  color: #101415 !important;
}
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4 {
  color: #101415;
}

/* Body / secondary text */
[data-theme="light"] .text-on-surface-variant {
  color: #555555 !important;
}
[data-theme="light"] p {
  color: #555555;
}

/* Amber — works on both backgrounds, keep as-is */
[data-theme="light"] .text-primary {
  color: #ff9d00 !important;
}

/* Muted / outline text */
[data-theme="light"] .text-outline {
  color: #aaaaaa !important;
}

/* Borders */
[data-theme="light"] .border-outline-variant\/10 { border-color: rgba(0,0,0,0.06) !important; }
[data-theme="light"] .border-outline-variant\/15 { border-color: rgba(0,0,0,0.09) !important; }
[data-theme="light"] .border-outline-variant\/20 { border-color: rgba(0,0,0,0.12) !important; }
[data-theme="light"] .border-outline-variant\/30 { border-color: rgba(0,0,0,0.16) !important; }

/* Card backgrounds */
[data-theme="light"] .bg-surface-container\/20  { background-color: #f5f5f5 !important; }
[data-theme="light"] .bg-surface-container\/15  { background-color: #f7f7f7 !important; }
[data-theme="light"] .bg-surface-container\/40  { background-color: #eeeeee !important; }
[data-theme="light"] .bg-surface-container-high { background-color: #e8e8e8 !important; }
[data-theme="light"] .bg-surface-container-low  { background-color: #f0f0f0 !important; }
[data-theme="light"] .bg-surface-container      { background-color: #f2f2f2 !important; }
[data-theme="light"] .bg-background\/90         { background-color: rgba(255,255,255,0.92) !important; }

/* Hover card bg */
[data-theme="light"] .hover\:bg-surface-container\/40:hover { background-color: #eeeeee !important; }
[data-theme="light"] .hover\:bg-on-surface\/5:hover          { background-color: rgba(0,0,0,0.05) !important; }

/* Inputs on white sections */
[data-theme="light"] .bg-surface-container.border {
  background-color: #f5f5f5 !important;
  color: #101415 !important;
}
[data-theme="light"] input,
[data-theme="light"] textarea,
[data-theme="light"] select {
  background-color: #f5f5f5;
  color: #101415;
  border-color: #dddddd;
}
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder {
  color: #aaaaaa;
}

/* Blockquotes */
[data-theme="light"] blockquote {
  color: #444444;
}

/* Star ratings — keep amber */
[data-theme="light"] .text-primary-container {
  color: #ff9d00 !important;
}

/* Initials avatar rings */
[data-theme="light"] .bg-primary\/10 {
  background-color: rgba(255,157,0,0.12) !important;
}
[data-theme="light"] .rounded-full.bg-surface-container-high {
  background-color: #e0e0e0 !important;
}

/* Secondary button border on white */
[data-theme="light"] .border-outline {
  border-color: #aaaaaa !important;
}
[data-theme="light"] .text-on-surface.border-outline {
  color: #101415 !important;
}
