/* Site-wide theme: typography, colors, calculator layouts — uses tokens.css */

/* —— Header & brand (overrides site.min until rebuilt) —— */
.site-header {
  background: rgba(255, 255, 255, 0.92) !important;
  border-bottom-color: var(--cd-border) !important;
}

.site-header.scrolled {
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: var(--cd-shadow-sm) !important;
}

.cd-brand__mark {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 2px !important;
  padding: 4px !important;
  background: linear-gradient(135deg, #e8f1ff, #fff) !important;
  border: 2px solid var(--cd-accent) !important;
  border-radius: 10px !important;
  box-shadow: var(--cd-shadow-sm) !important;
}

.cd-brand__mark i {
  display: none !important;
}

.cd-brand__glyph {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  color: var(--cd-accent) !important;
}

.cd-brand__name {
  font-family: var(--cd-font-ui) !important;
  font-size: 1.125rem !important;
  font-weight: 800 !important;
}

.cd-brand__name-accent {
  color: var(--cd-accent) !important;
}

.header-nav-link {
  font-family: var(--cd-font-ui) !important;
  font-size: var(--cd-text-sm) !important;
}

.header-nav-link:hover {
  color: var(--cd-accent) !important;
  background: var(--cd-accent-soft) !important;
}

.header-auth-btn {
  background: var(--cd-accent) !important;
}

.header-auth-btn:hover {
  background: var(--cd-accent-hover) !important;
}

/* —— Base —— */
body {
  font-family: var(--cd-font-ui) !important;
  font-size: var(--cd-text-base);
  color: var(--cd-text);
  background: var(--cd-surface-elevated) !important;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--cd-font-ui) !important;
  color: var(--cd-text);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

h1 { font-size: var(--cd-text-4xl); }
h2 { font-size: var(--cd-text-3xl); }
h3 { font-size: var(--cd-text-2xl); }
h4 { font-size: var(--cd-text-xl); }
h5 { font-size: var(--cd-text-lg); }
h6 { font-size: var(--cd-text-base); }

p, li, label, input, select, textarea, button {
  font-family: inherit;
}

::selection {
  background: var(--cd-accent-soft);
  color: var(--cd-text);
}

/* —— Main content container —— */
main.flex-1 {
  background: var(--cd-surface-elevated);
}

/* Breadcrumbs */
nav[aria-label*="Breadcrumb"] {
  font-family: var(--cd-font-ui);
  font-size: var(--cd-text-sm);
}

nav[aria-label*="Breadcrumb"] a {
  color: var(--cd-text-secondary) !important;
}

nav[aria-label*="Breadcrumb"] a:hover {
  color: var(--cd-accent) !important;
}

nav[aria-label*="Breadcrumb"] span[aria-current="page"] {
  color: var(--cd-text) !important;
}

.max-w-7xl.mx-auto.px-4 {
  max-width: var(--cd-max-width) !important;
}

/* —— Calculator pages (Tailwind shells) —— */
.min-h-screen.bg-gradient-to-br {
  background: linear-gradient(
    165deg,
    var(--cd-accent-muted) 0%,
    var(--cd-surface-elevated) 35%,
    var(--cd-surface-elevated) 100%
  ) !important;
}

.min-h-screen .max-w-7xl {
  max-width: var(--cd-max-width) !important;
}

/* Page titles with gradient text */
.text-transparent.bg-clip-text.bg-gradient-to-r {
  -webkit-text-fill-color: var(--cd-accent) !important;
  color: var(--cd-accent) !important;
  background: none !important;
}

/* Primary CTA buttons */
.bg-gradient-to-r.from-blue-600,
[class*="from-blue-600"][class*="to-indigo-600"],
button.from-blue-600,
a.from-blue-600 {
  background: var(--cd-accent) !important;
  background-image: none !important;
  border-radius: var(--cd-radius-md) !important;
  font-family: var(--cd-font-ui) !important;
  font-size: var(--cd-text-base) !important;
  font-weight: 600 !important;
}

.hover\:from-blue-700:hover,
[class*="hover:from-blue-700"]:hover {
  background: var(--cd-accent-hover) !important;
  background-image: none !important;
}

.bg-blue-600,
.bg-blue-500 {
  background-color: var(--cd-accent) !important;
}

.hover\:bg-blue-700:hover,
.bg-blue-600:hover {
  background-color: var(--cd-accent-hover) !important;
}

.text-blue-600,
.text-blue-700,
.text-blue-800 {
  color: var(--cd-accent) !important;
}

.border-blue-200,
.border-blue-300 {
  border-color: rgba(26, 107, 255, 0.25) !important;
}

.bg-blue-50,
.from-blue-50 {
  background-color: var(--cd-accent-muted) !important;
}

.to-indigo-50 {
  background-color: transparent !important;
}

.bg-gradient-to-br.from-blue-50 {
  background: var(--cd-accent-muted) !important;
}

/* Result cards — use brand blue instead of purple/indigo mix */
.from-blue-600.via-indigo-600,
.from-purple-600,
.via-indigo-600.to-purple-600,
[class*="from-purple-600"][class*="via-indigo"] {
  background: linear-gradient(135deg, var(--cd-accent) 0%, var(--cd-accent-hover) 100%) !important;
}

/* Cards & panels */
.bg-white.rounded-xl,
.bg-white.rounded-lg,
.bg-white.shadow-lg,
.bg-white.shadow-xl {
  border: 1px solid var(--cd-border) !important;
  border-radius: var(--cd-radius-lg) !important;
  box-shadow: var(--cd-shadow-sm) !important;
}

/* Form inputs */
input[type="text"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
select,
textarea {
  font-size: var(--cd-text-base) !important;
  border-color: #cbd5e1 !important;
  border-radius: var(--cd-radius-sm) !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--cd-accent) !important;
  outline: none;
  box-shadow: 0 0 0 3px var(--cd-accent-soft) !important;
}

/* Sticky sidebar — disable on mobile */
@media (max-width: 1023px) {
  .lg\:sticky {
    position: static !important;
  }
}

/* Share FAB */
.share-fab {
  background: var(--cd-navy) !important;
}

.share-fab:hover:not(.active) {
  background: var(--cd-navy-dark) !important;
}

/* Auth pages */
.auth-submit-btn {
  background: var(--cd-accent) !important;
}

.auth-submit-btn:hover {
  background: var(--cd-accent-hover) !important;
}

.auth-link {
  color: var(--cd-accent) !important;
}

.auth-title,
.auth-card h1 {
  font-family: var(--cd-font-ui) !important;
}

/* Blog */
#reading-progress {
  background: var(--cd-accent) !important;
}

.prose {
  font-family: var(--cd-font-body) !important;
  font-size: var(--cd-text-lg) !important;
  color: var(--cd-text) !important;
}

.prose h1, .prose h2, .prose h3 {
  font-family: var(--cd-font-ui) !important;
}

/* Footer contrast */
.site-footer {
  font-family: var(--cd-font-ui);
  font-size: var(--cd-text-sm);
}

/* Landing search (all pages using landing-search) */
.landing-search__input {
  font-family: var(--cd-font-ui);
  border-color: #cbd5e1;
}

.landing-search__input:focus {
  border-color: var(--cd-accent);
  box-shadow: 0 0 0 4px var(--cd-accent-soft);
}

.landing-search__btn {
  background: var(--cd-accent);
}

.landing-search__btn:hover {
  background: var(--cd-accent-hover);
}

/* Neutral text utilities → brand tokens */
.text-gray-900, .text-slate-900, .text-neutral-900 {
  color: var(--cd-text) !important;
}

.text-gray-600, .text-gray-500, .text-slate-600, .text-slate-500,
.text-neutral-500, .text-neutral-600 {
  color: var(--cd-text-secondary) !important;
}

/* FC consent */
.fc-consent-root a,
.fc-consent-root .fc-faq-label {
  color: var(--cd-accent) !important;
}

.fc-consent-root .fc-primary-button {
  background-color: var(--cd-accent) !important;
}