/* ==========================================================================
   Design tokens — Zero Touch brand (gold on black, from assets/images/logo*.png)
   Override Bootstrap's CSS variables here, in one place.
   Default theme is dark (<html data-bs-theme="dark">), matching the logo.
   ========================================================================== */

:root {
  /* Brand palette */
  --zt-gold: #d1bd72;            /* exact logo gold */
  --zt-gold-rgb: 209, 189, 114;
  --zt-gold-light: #e8d79c;      /* highlights / hover on dark */
  --zt-gold-dark: #b39d55;       /* pressed state */
  --zt-gold-deep: #7d6728;       /* gold text on light backgrounds (AA contrast) */
  --zt-gold-gradient: linear-gradient(135deg, #b8973f 0%, #ecd58c 45%, #d1bd72 70%, #a8893a 100%);

  --zt-black: #0a0a0a;           /* logo background */
  --zt-black-rgb: 10, 10, 10;
  --zt-surface: #141414;
  --zt-surface-2: #1c1c1c;
  --zt-ivory: #f7f3e8;

  /* Semantic aliases used across components */
  --brand-primary: var(--zt-gold);
  --brand-primary-rgb: var(--zt-gold-rgb);
  --brand-on-primary: var(--zt-black);   /* text on gold buttons */
  --brand-dark: var(--zt-black);

  /* Bootstrap overrides (shared) */
  --bs-primary: var(--zt-gold);
  --bs-primary-rgb: var(--zt-gold-rgb);
  /* Typography — matched to the logo:
     Sora     headings  wide geometric letterforms, like "ZERO TOUCH"
     Michroma labels    wide extended caps, like "ECOSOFT PVT LTD" (single weight)
     Inter    body      most readable UI text face */
  --font-body: "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-heading: "Sora", "Sora Fallback", var(--font-body);
  --font-accent: "Michroma", "Michroma Fallback", var(--font-heading);
  --bs-body-font-family: var(--font-body);
  --bs-body-line-height: 1.65;
  --bs-border-radius: 0.5rem;
  --bs-border-radius-lg: 0.75rem;
  --bs-focus-ring-color: rgba(var(--zt-gold-rgb), 0.35);

  /* Layout */
  --navbar-height: 72px;
  --section-spacing: clamp(3rem, 8vw, 6rem);

  /* Elevation */
  --shadow-gold: 0 18px 40px rgba(var(--zt-gold-rgb), 0.12);
  --shadow-deep: 0 24px 60px rgba(0, 0, 0, 0.45);

  /* Motion */
  --transition-base: 0.25s ease;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- Dark theme (default) — black & gold ---------- */
[data-bs-theme="dark"] {
  color-scheme: dark;

  --bs-body-bg: var(--zt-black);
  --bs-body-bg-rgb: var(--zt-black-rgb);
  --bs-body-color: #ece7da;
  --bs-body-color-rgb: 236, 231, 218;
  --bs-emphasis-color: #ffffff;
  --bs-heading-color: #f5efdf;
  --bs-secondary-color: rgba(236, 231, 218, 0.65);
  --bs-secondary-bg: var(--zt-surface-2);
  --bs-secondary-bg-rgb: 28, 28, 28;
  --bs-tertiary-bg: var(--zt-surface);
  --bs-tertiary-bg-rgb: 20, 20, 20;
  --bs-border-color: rgba(var(--zt-gold-rgb), 0.18);
  --bs-border-color-translucent: rgba(var(--zt-gold-rgb), 0.15);

  --bs-link-color: var(--zt-gold);
  --bs-link-color-rgb: var(--zt-gold-rgb);
  --bs-link-hover-color: var(--zt-gold-light);
  --bs-link-hover-color-rgb: 232, 215, 156;

  --bs-primary-text-emphasis: var(--zt-gold-light);
  --bs-primary-bg-subtle: rgba(var(--zt-gold-rgb), 0.12);
  --bs-primary-border-subtle: rgba(var(--zt-gold-rgb), 0.35);

  --brand-text: var(--zt-gold);
}

/* ---------- Light theme — ivory & deep gold ---------- */
[data-bs-theme="light"] {
  color-scheme: light;

  --bs-body-bg: #ffffff;
  --bs-body-color: #1a1814;
  --bs-heading-color: var(--zt-black);
  --bs-secondary-color: rgba(26, 24, 20, 0.65);
  --bs-tertiary-bg: var(--zt-ivory);
  --bs-tertiary-bg-rgb: 247, 243, 232;
  --bs-border-color: rgba(var(--zt-gold-rgb), 0.35);
  --bs-border-color-translucent: rgba(var(--zt-gold-rgb), 0.3);

  --bs-link-color: var(--zt-gold-deep);
  --bs-link-color-rgb: 125, 103, 40;
  --bs-link-hover-color: var(--zt-black);
  --bs-link-hover-color-rgb: var(--zt-black-rgb);

  --bs-primary-text-emphasis: var(--zt-gold-deep);
  --bs-primary-bg-subtle: rgba(var(--zt-gold-rgb), 0.15);
  --bs-primary-border-subtle: rgba(var(--zt-gold-rgb), 0.45);

  --brand-text: var(--zt-gold-deep);
}