/**
 * Nanban Headings World — premium typography every page (loads last)
 * Stripe / Linear / Notion tier — Tamil + English, landing + ERP
 */

html.nb-ivory-theme {
  --nb-font-display: "Plus Jakarta Sans", "Noto Sans Tamil", "Inter", system-ui, sans-serif;
  --nb-font-body: "Inter", "Noto Sans Tamil", system-ui, sans-serif;
  --nb-h-ink: #0c0a09;
  --nb-h-text: #18181b;
  --nb-h-muted: #64748b;
  --nb-h-accent: #dc2626;
  --nb-h-accent-2: #4f46e5;
  --nb-h-line: linear-gradient(90deg, #dc2626 0%, #4f46e5 72%, transparent 100%);
}

/* ── Global heading foundation ── */
html.nb-ivory-theme h1,
html.nb-ivory-theme h2,
html.nb-ivory-theme h3,
html.nb-ivory-theme h4,
html.nb-ivory-theme h5,
html.nb-ivory-theme h6 {
  font-family: var(--nb-font-display) !important;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--nb-h-text) !important;
  text-shadow: none !important;
}

html.nb-ivory-theme h1 {
  font-size: clamp(2rem, 5vw, 3rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.08 !important;
  color: var(--nb-h-ink) !important;
}

html.nb-ivory-theme h2 {
  font-size: clamp(1.375rem, 3.2vw, 2rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.12 !important;
  color: var(--nb-h-ink) !important;
}

html.nb-ivory-theme h3 {
  font-size: clamp(1.125rem, 2.4vw, 1.375rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.25 !important;
}

html.nb-ivory-theme h4 {
  font-size: clamp(1rem, 2vw, 1.125rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.3 !important;
}

/* ── Landing / front page ── */
html.nb-ivory-theme #loginScreen .nb-hero-title,
html.nb-ivory-theme #loginScreen.nb-ultra .nb-hero-title {
  font-size: clamp(2.5rem, 7.5vw, 4.75rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.045em !important;
  line-height: 0.98 !important;
  max-width: 16ch;
}

html.nb-ivory-theme #loginScreen.nb-ultra .nb-hero-title-main {
  font-size: 0.48em !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase;
  color: #64748b !important;
  margin-bottom: 0.2em !important;
}

html.nb-ivory-theme #loginScreen.nb-ultra .nb-hero-title-gradient,
html.nb-ivory-theme #loginScreen #nbHeroSchoolName,
html.nb-ivory-theme #loginScreen .nb-hero-school-name {
  font-weight: 900 !important;
  letter-spacing: -0.03em !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
}

html.nb-ivory-theme #loginScreen .nb-section-kicker,
html.nb-ivory-theme #publicPortal .nb-section-kicker {
  font-family: var(--nb-font-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase;
  color: var(--nb-h-accent) !important;
}

html.nb-ivory-theme #loginScreen .nb-section-title,
html.nb-ivory-theme #loginScreen h2.nb-section-title,
html.nb-ivory-theme #publicPortal .nb-section-title {
  font-size: clamp(2rem, 5vw, 3.25rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.045em !important;
  line-height: 1.04 !important;
  color: var(--nb-h-ink) !important;
}

html.nb-ivory-theme #loginScreen .nb-bento-cell h3,
html.nb-ivory-theme #publicPortal .nb-public-bento-card h3 {
  font-size: clamp(1.15rem, 2.4vw, 1.4rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: var(--nb-h-ink) !important;
  margin-bottom: 0.65em !important;
}

html.nb-ivory-theme #loginScreen .nb-enquiry-copy h2 {
  font-size: clamp(1.75rem, 4vw, 2.5rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
}

html.nb-ivory-theme #loginScreen .nb-hero-stat strong {
  font-size: clamp(1.5rem, 3.5vw, 2rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
}

/* ── ERP page heroes (Settings, Reports, etc.) ── */
html.nb-ivory-theme .settings-page-hero h2,
html.nb-ivory-theme #settingsSection .settings-page-hero h2 {
  font-size: clamp(1.75rem, 3.5vw, 2.35rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.1 !important;
  color: var(--nb-h-ink) !important;
  margin: 0 !important;
  position: relative;
  padding-bottom: 14px;
}

html.nb-ivory-theme .settings-page-hero h2::after,
html.nb-ivory-theme #settingsSection .settings-page-hero h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 4px;
  border-radius: 99px;
  background: var(--nb-h-line);
}

html.nb-ivory-theme .settings-page-hero p {
  font-family: var(--nb-font-body) !important;
  font-size: clamp(0.9375rem, 2vw, 1.0625rem) !important;
  font-weight: 500 !important;
  color: var(--nb-h-muted) !important;
  line-height: 1.6 !important;
  max-width: 56ch;
}

html.nb-ivory-theme #settingsSection h3,
html.nb-ivory-theme #settingsSection h4,
html.nb-ivory-theme #settingsSection .nb-set-card-head h3 {
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  color: var(--nb-h-text) !important;
}

html.nb-ivory-theme #settingsSection .settings-pane-panel h3 {
  font-size: clamp(1.125rem, 2.2vw, 1.3125rem) !important;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  margin-bottom: 16px !important;
}

/* ── ERP section page titles ── */
html.nb-ivory-theme #nbAppMain #reportSection h2,
html.nb-ivory-theme #nbAppMain #rtoFileSection h2,
html.nb-ivory-theme #nbAppMain #rtoSvcSection h2,
html.nb-ivory-theme #nbAppMain #chitSection h2,
html.nb-ivory-theme #nbAppMain #expenseSection h2,
html.nb-ivory-theme #nbAppMain #fleetSection h2,
html.nb-ivory-theme #nbAppMain #quizSection h2,
html.nb-ivory-theme #nbAppMain #masterSection h2,
html.nb-ivory-theme #nbAppMain #listSection > h2,
html.nb-ivory-theme #nbAppMain h2[style*="color:#f8fafc"],
html.nb-ivory-theme #nbAppMain h2[style*="color: #f8fafc"] {
  font-size: clamp(1.375rem, 3vw, 1.875rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.15 !important;
  color: var(--nb-h-ink) !important;
}

html.nb-ivory-theme #nbAppMain h3[style*="color:#f8fafc"],
html.nb-ivory-theme #nbAppMain h3[style*="color: #f8fafc"],
html.nb-ivory-theme #dashSection h3 {
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: var(--nb-h-ink) !important;
}

/* ── Dashboard card titles ── */
html.nb-ivory-theme .dash-card-title {
  font-family: var(--nb-font-display) !important;
  font-size: clamp(1rem, 2vw, 1.125rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: var(--nb-h-ink) !important;
  margin-bottom: 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

html.nb-ivory-theme .dash-card-title span {
  font-size: 0.78em !important;
  font-weight: 600 !important;
  color: var(--nb-h-muted) !important;
  letter-spacing: 0 !important;
}

/* ── Metric card labels vs values ── */
html.nb-ivory-theme #nbAppMain .metric-card h3,
html.nb-ivory-theme #reportSection .metric-card h3,
html.nb-ivory-theme .nb-fin-card__label,
html.nb-ivory-theme .nb-rep-cash-label {
  font-family: var(--nb-font-body) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--nb-h-muted) !important;
}

html.nb-ivory-theme #nbAppMain .stat-val,
html.nb-ivory-theme .nb-fin-card__amt,
html.nb-ivory-theme #reportSection .nb-rep-money--income,
html.nb-ivory-theme #reportSection .nb-rep-money--expense,
html.nb-ivory-theme #reportSection .nb-rep-money--net,
html.nb-ivory-theme #reportSection .nb-rep-money--cash {
  font-family: var(--nb-font-display) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  text-shadow: none !important;
}

html.nb-ivory-theme #reportSection #repTotalIn,
html.nb-ivory-theme #reportSection .nb-rep-money--income {
  color: #059669 !important;
}

html.nb-ivory-theme #reportSection #repTotalOut,
html.nb-ivory-theme #reportSection .nb-rep-money--expense {
  color: #dc2626 !important;
}

html.nb-ivory-theme #reportSection #repNet,
html.nb-ivory-theme #reportSection .nb-rep-money--net {
  color: #2563eb !important;
}

html.nb-ivory-theme #reportSection #repCashRanjith,
html.nb-ivory-theme #reportSection #repCashNandha,
html.nb-ivory-theme #reportSection #repCashOffice,
html.nb-ivory-theme #reportSection .nb-rep-money--cash {
  color: #4338ca !important;
}

html.nb-ivory-theme #reportSection .metric-card,
html.nb-ivory-theme #reportSection .nb-report-cash-card {
  background: #ffffff !important;
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 4px 24px rgba(15, 23, 42, 0.06) !important;
  color: var(--nb-h-text) !important;
  backdrop-filter: none !important;
}

/* ── Admission wizard ── */
html.nb-ivory-theme #newSection .ad-wiz-head h2 {
  font-size: clamp(1.25rem, 2.8vw, 1.5rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: var(--nb-h-ink) !important;
}

html.nb-ivory-theme #newSection .ad-wiz-section-title,
html.nb-ivory-theme #newSection .ad-wiz-glass-card > h3,
html.nb-ivory-theme #newSection h3.ad-wiz-step-title {
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--nb-h-text) !important;
}

/* ── Modals ── */
html.nb-ivory-theme .modal-content h2,
html.nb-ivory-theme .modal-content h3,
html.nb-ivory-theme .modal h2,
html.nb-ivory-theme .modal h3 {
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: var(--nb-h-ink) !important;
}

html.nb-ivory-theme .modal-content h3,
html.nb-ivory-theme .modal h3 {
  font-size: 1.125rem !important;
  font-weight: 700 !important;
}

/* ── Student cards ── */
html.nb-ivory-theme .premium-student-card .card-name,
html.nb-ivory-theme .nb-crm-card__name {
  font-family: var(--nb-font-display) !important;
  font-size: clamp(1.125rem, 2.5vw, 1.375rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  color: var(--nb-h-ink) !important;
}

/* ── Trainer / master ── */
html.nb-ivory-theme #masterSection h3,
html.nb-ivory-theme .nb-trainer-bento__name {
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: var(--nb-h-ink) !important;
}

/* ── Fancy / Parivahan ── */
html.nb-ivory-theme #fancySection .fancy-vip-card h3,
html.nb-ivory-theme #fancySection .fancy-range-title-ta {
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
}

/* ── Top bar brand ── */
html.nb-ivory-theme body.nanban-pro-app #mainApp .top-bar > div:first-child > div:first-child,
html.nb-ivory-theme body.nanban-pro-app #mainApp .nb-top-logo {
  font-family: var(--nb-font-display) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  color: var(--nb-h-ink) !important;
}

/* ── Staff login ── */
html.nb-ivory-theme #nbStaffLoginTitle {
  font-size: clamp(1.5rem, 4vw, 2rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
}

/* ── E-Sevai headings keep green accent ── */
html.nb-ivory-theme body.esevai-mode #nbAppMain h2,
html.nb-ivory-theme body.esevai-mode #nbAppMain h3 {
  color: #064e3b !important;
}

html.nb-ivory-theme body.esevai-mode #nbAppMain h2[style*="color:#0f172a"],
html.nb-ivory-theme body.esevai-mode #nbAppMain h2[style*="color: #0f172a"] {
  color: #064e3b !important;
}

/* ── Chit section accent heading ── */
html.nb-ivory-theme #chitSection h2,
html.nb-ivory-theme #chitSection h3[style*="chit-color"] {
  color: #6d28d9 !important;
  font-weight: 800 !important;
}

@media (max-width: 768px) {
  html.nb-ivory-theme h1 {
    letter-spacing: -0.03em !important;
  }
  html.nb-ivory-theme #loginScreen .nb-hero-title,
  html.nb-ivory-theme #loginScreen.nb-ultra .nb-hero-title {
    max-width: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.nb-ivory-theme #loginScreen.nb-ultra .nb-hero-title-gradient {
    animation: none !important;
    background-position: 0% center !important;
  }
}