/* LastRound — Shared Theme Overrides
   All colors sourced from LastRound Brand Color Palette:
   Main:      Bone #DBD6CB | Chamois #CEB59C | Grullo #AEA796 | Rust #B77543
              Pine #565644 | Dark Lava #584E3B | Ebony #313029 | Black #07080A
   Secondary: Ash Grey #B2B8AA | Morning Blue #9EABA0 | French Grey #B5BFBA | Green Grey #C3C1B0
*/

/* ── PWA SAFE-AREA (iOS standalone mode) ──────── */
/* When added to home screen, the status bar overlaps content.
   These rules push content below the notch / status bar. */
@supports (padding-top: env(safe-area-inset-top)) {
  /* Only apply when running as standalone PWA (home screen app) */
  @media all and (display-mode: standalone) {
    /* Push body content below the status bar */
    body {
      padding-top: env(safe-area-inset-top) !important;
      padding-left: env(safe-area-inset-left);
      padding-right: env(safe-area-inset-right);
      padding-bottom: env(safe-area-inset-bottom);
    }
    /* Sticky headers need to account for the safe area */
    .header[style*="sticky"], .header {
      top: env(safe-area-inset-top);
    }
  }
  /* iOS Safari also needs this for apple-mobile-web-app-capable */
  @media all and (display-mode: standalone), all and (-webkit-device-pixel-ratio) {
    html.pwa-standalone body {
      padding-top: env(safe-area-inset-top) !important;
      padding-left: env(safe-area-inset-left);
      padding-right: env(safe-area-inset-right);
      padding-bottom: env(safe-area-inset-bottom);
    }
    html.pwa-standalone .header {
      top: env(safe-area-inset-top);
    }
  }
}

/* ── DARK MODES ─────────────────────────────────── */

/* Warm: golden-hour glow — Chamois-forward */
:root[data-theme="warm"] {
  --bg: #100C06; --surface: #201A10; --surface2: #302818; --surface3: #403620;
  --border: #584E3B; --text: #DBD6CB; --text-muted: #CEB59C; --text-dim: #8A7A60;
  --accent: #CEB59C; --accent-hover: #DBD6CB; --accent-dim: #584E3B;
  --green: #9EABA0; --red: #B77543; --orange: #C4A24C;
}

/* Ember: deep warmth — Rust accent on dark burgundy */
:root[data-theme="ember"] {
  --bg: #0C0806; --surface: #1A1210; --surface2: #261E18; --surface3: #332820;
  --border: #4D3D30; --text: #DBD6CB; --text-muted: #CEB59C; --text-dim: #7A6B5A;
  --accent: #B77543; --accent-hover: #DBD6CB; --accent-dim: #5C3E28;
  --green: #9EABA0; --red: #B77543; --orange: #CEB59C;
}

/* Slate: cool neutral — French Grey / Ash Grey */
:root[data-theme="slate"] {
  --bg: #181C1B; --surface: #232826; --surface2: #2E3432; --surface3: #3A413E;
  --border: #505855; --text: #DBD6CB; --text-muted: #B5BFBA; --text-dim: #788380;
  --accent: #B2B8AA; --accent-hover: #DBD6CB; --accent-dim: #505855;
  --green: #9EABA0; --red: #B77543; --orange: #C4A24C;
}

/* Speakeasy: dim golden lounge — Dark Lava surfaces, Chamois text */
:root[data-theme="speakeasy"] {
  --bg: #0C0A04; --surface: #1A1608; --surface2: #282210; --surface3: #36301A;
  --border: #504828; --text: #CEB59C; --text-muted: #AEA796; --text-dim: #6E6450;
  --accent: #B77543; --accent-hover: #CEB59C; --accent-dim: #504828;
  --green: #9EABA0; --red: #B77543; --orange: #CEB59C;
}

/* Noir: ultra high contrast — Black + Bone + Rust only */
:root[data-theme="noir"] {
  --bg: #020202; --surface: #0A0908; --surface2: #141210; --surface3: #1E1C18;
  --border: #2E2A24; --text: #DBD6CB; --text-muted: #AEA796; --text-dim: #504A40;
  --accent: #B77543; --accent-hover: #DBD6CB; --accent-dim: #3A2A1E;
  --green: #B77543; --red: #B77543; --orange: #B77543;
}

/* Terracotta: warm clay surfaces — Southwest sunset */
:root[data-theme="terracotta"] {
  --bg: #1A140E; --surface: #28201A; --surface2: #382C22; --surface3: #4A3A2C;
  --border: #5C4830; --text: #DBD6CB; --text-muted: #CEB59C; --text-dim: #8A7258;
  --accent: #CEB59C; --accent-hover: #DBD6CB; --accent-dim: #5C4830;
  --green: #9EABA0; --red: #B77543; --orange: #CEB59C;
}

/* ── MID-TONE MODES ─────────────────────────────── */

/* Sage: earthy green — Pine / Morning Blue / Green Grey */
:root[data-theme="sage"] {
  --bg: #2C2E24; --surface: #383A2E; --surface2: #464838; --surface3: #565644;
  --border: #6A6C58; --text: #DBD6CB; --text-muted: #C3C1B0; --text-dim: #8A8A78;
  --accent: #9EABA0; --accent-hover: #DBD6CB; --accent-dim: #565644;
  --green: #9EABA0; --red: #B77543; --orange: #C4A24C;
}

/* Midtown: twilight medium — Ebony-to-Pine range */
:root[data-theme="midtown"] {
  --bg: #38342B; --surface: #45403A; --surface2: #524C44; --surface3: #5E584E;
  --border: #6E6858; --text: #DBD6CB; --text-muted: #C3C1B0; --text-dim: #9A9488;
  --accent: #CEB59C; --accent-hover: #DBD6CB; --accent-dim: #584E3B;
  --green: #9EABA0; --red: #B77543; --orange: #C4A24C;
}

/* ── LIGHT MODES ────────────────────────────────── */

/* Ivory: classic light — Bone / cream */
:root[data-theme="ivory"] {
  --bg: #EDE8DF; --surface: #F5F1EA; --surface2: #E3DDD3; --surface3: #D8D1C6;
  --border: #C4BCAE; --text: #1A1610; --text-muted: #584E3B; --text-dim: #8A8070;
  --accent: #7A6545; --accent-hover: #1A1610; --accent-dim: #C4B8A2;
  --green: #5E7A62; --red: #A05830; --orange: #8A7030;
}

/* Linen: airiest light — softer than Ivory */
:root[data-theme="linen"] {
  --bg: #F5F1EA; --surface: #FAF8F4; --surface2: #EDE8DF; --surface3: #E3DDD3;
  --border: #D8D1C6; --text: #242118; --text-muted: #584E3B; --text-dim: #8A8070;
  --accent: #8A7050; --accent-hover: #242118; --accent-dim: #CEB59C;
  --green: #5E7A62; --red: #A05830; --orange: #8A7030;
}

/* Club: warm tan — Chamois / Grullo surfaces (the palette card itself) */
:root[data-theme="club"] {
  --bg: #C4AD90; --surface: #D4C4A8; --surface2: #B8A488; --surface3: #AEA796;
  --border: #8A7A60; --text: #07080A; --text-muted: #313029; --text-dim: #584E3B;
  --accent: #584E3B; --accent-hover: #07080A; --accent-dim: #AEA796;
  --green: #565644; --red: #8A5030; --orange: #6E5830;
}

/* Patina: oxidized copper — Morning Blue / Ash Grey light green */
:root[data-theme="patina"] {
  --bg: #C8D0CA; --surface: #D5DDD8; --surface2: #BFC8C0; --surface3: #B2B8AA;
  --border: #9EABA0; --text: #07080A; --text-muted: #313029; --text-dim: #565644;
  --accent: #565644; --accent-hover: #07080A; --accent-dim: #9EABA0;
  --green: #565644; --red: #8A5030; --orange: #6E5830;
}

/* ── WILD THEMES (off-palette) ──────────────────── */

/* Midnight: deep navy — steel blue accent */
:root[data-theme="midnight"] {
  --bg: #080C14; --surface: #0E1420; --surface2: #161E2C; --surface3: #1E2838;
  --border: #2A3A50; --text: #D8DEE8; --text-muted: #8898B0; --text-dim: #506080;
  --accent: #6090C0; --accent-hover: #D8DEE8; --accent-dim: #2A3A50;
  --green: #60A080; --red: #C06048; --orange: #C0A040;
}

/* Neon: cyberpunk — electric green on dark chrome */
:root[data-theme="neon"] {
  --bg: #0A0A0C; --surface: #121216; --surface2: #1A1A20; --surface3: #22222A;
  --border: #2E2E38; --text: #E0E0E8; --text-muted: #8888A0; --text-dim: #505060;
  --accent: #00E890; --accent-hover: #E0E0E8; --accent-dim: #0A4030;
  --green: #00E890; --red: #FF4060; --orange: #FFAA00;
}

/* Rosé: blush pink — soft and warm */
:root[data-theme="rose"] {
  --bg: #1A1216; --surface: #241C20; --surface2: #2E242A; --surface3: #3A3034;
  --border: #504048; --text: #E8D8DE; --text-muted: #C0A0B0; --text-dim: #7A6070;
  --accent: #D08098; --accent-hover: #E8D8DE; --accent-dim: #503848;
  --green: #90B0A0; --red: #D06060; --orange: #D0A870;
}

/* Ocean: deep teal — aquatic calm */
:root[data-theme="ocean"] {
  --bg: #081210; --surface: #0E1C18; --surface2: #162822; --surface3: #1E342C;
  --border: #2A4A40; --text: #D0E8E2; --text-muted: #80B0A0; --text-dim: #406860;
  --accent: #40C8B0; --accent-hover: #D0E8E2; --accent-dim: #1A3830;
  --green: #40C8B0; --red: #C87050; --orange: #C0A850;
}

/* Lavender: violet dusk — soft purple */
:root[data-theme="lavender"] {
  --bg: #100E16; --surface: #1A1822; --surface2: #24222E; --surface3: #2E2C3A;
  --border: #403E50; --text: #E0DCE8; --text-muted: #A8A0C0; --text-dim: #686080;
  --accent: #9080C0; --accent-hover: #E0DCE8; --accent-dim: #383050;
  --green: #80B0A0; --red: #C07060; --orange: #C0A060;
}

/* Solar: golden blaze — bright gold on deep warm */
:root[data-theme="solar"] {
  --bg: #141008; --surface: #201C10; --surface2: #2C2818; --surface3: #3A3420;
  --border: #504830; --text: #F0E8D0; --text-muted: #D0C090; --text-dim: #807040;
  --accent: #F0C030; --accent-hover: #F0E8D0; --accent-dim: #504020;
  --green: #90C080; --red: #E07040; --orange: #F0C030;
}
