/*
 * Ask Travel World — Brand Style Guide
 * ------------------------------------
 * Single source of truth for brand colors, type, and shape tokens.
 * Every app (landing page, Add-on Manager, Booking Form, Payment Portal)
 * links this file first. Change a value here and it reflects everywhere.
 */

@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@600;700&family=Montserrat:wght@400;500;600;700&display=swap');

:root {
  /* ---- Brand palette ---- */
  --brand-primary: #1D475A;      /* Deep Teal — headers, sidebars, titles, footers */
  --brand-primary-soft: #477990; /* Muted Ocean Teal — primary buttons, soft interactive surfaces */
  --brand-primary-dark: #112933; /* Dark Teal Shade — hover/pressed on dark teal surfaces */
  --brand-sky: #C2DBE7;          /* Pale Sky Blue — secondary bg, selected states, badges, dividers */
  --brand-gold: #EFAF1F;         /* Travel Gold — accents, hover, price accents, highlights */
  --brand-gold-dark: #CC920F;    /* Gold Dark Shade — pressed/hover on gold accents */
  --brand-cream: #FFF2D5;        /* Warm Cream — promo/alert/reminder panels */

  --text-primary: #000000;
  --text-muted: #707070;

  --surface: #FFFFFF;
  --surface-subtle: #F5F5F5;

  /* ---- Typography ---- */
  --font-heading: 'Lexend Deca', sans-serif;
  --font-body: 'Montserrat', sans-serif;

  /* ---- Shape ---- */
  --radius-card: 10px;
  --radius-panel: 16px;
  --radius-btn: 999px;
  --radius-input: 10px;

  /* ---- Legacy tokens ----
     shared/base.css and each app's stylesheet reference these names.
     They alias onto the brand palette above so existing component
     styles pick up the brand automatically. */
  --bg: var(--surface-subtle);
  --brand: var(--brand-primary-soft);
  --brand-hover: var(--brand-primary-dark);
  --ink: var(--text-primary);
  --muted: var(--text-muted);
  --border: #D7E4EA;
  --divider: #E7EFF2;
  --panel-dark: var(--brand-primary);
  --panel-dark-text: var(--brand-sky);
  --total-gold: var(--brand-gold);
  --success-bg: #EAF6EE;
  --success-ink: #1F8A4C;
  --fail-bg: #FBEAEA;
  --fail-ink: #C0392B;
}