/* ==========================================================================
   Aurum Theme — Design Tokens
   Premium jewelry theme for PrestaShop 8
   ========================================================================== */

:root {
  /* ---- Colors ---- */
  --au-gold:          #B8963E;
  --au-gold-light:    #d4b567;
  --au-gold-dark:     #96792e;

  --au-bg:            #ffffff;
  --au-text:          #030213;
  --au-text-secondary:#717182;
  --au-muted:         #717182;

  --au-surface:       #ffffff;
  --au-surface-muted: #ececf0;
  --au-surface-dark:  #1a1a1a;
  --au-surface-darker:#0d0d0d;

  --au-border:        #e0e0e4;
  --au-border-light:  #ececf0;

  --au-success:       #2e7d32;
  --au-error:         #c62828;
  --au-warning:       #f9a825;
  --au-info:          #1565c0;

  --au-promo:         #c62828;
  --au-new:           var(--au-gold);

  /* ---- Typography ---- */
  --au-font-display:  'Cormorant Garamond', 'Georgia', serif;
  --au-font-body:     system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  --au-fs-xs:         0.75rem;    /* 12px */
  --au-fs-sm:         0.875rem;   /* 14px */
  --au-fs-base:       1rem;       /* 16px */
  --au-fs-md:         1.125rem;   /* 18px */
  --au-fs-lg:         1.25rem;    /* 20px */
  --au-fs-xl:         1.5rem;     /* 24px */
  --au-fs-2xl:        2rem;       /* 32px */
  --au-fs-3xl:        2.5rem;     /* 40px */
  --au-fs-4xl:        3rem;       /* 48px */

  --au-fw-regular:    400;
  --au-fw-medium:     500;
  --au-fw-semibold:   600;

  --au-lh-tight:      1.2;
  --au-lh-base:       1.6;
  --au-lh-loose:      1.8;

  --au-ls-wide:       0.05em;
  --au-ls-wider:      0.1em;
  --au-ls-widest:     0.15em;

  /* ---- Spacing ---- */
  --au-sp-1:          0.25rem;    /* 4px */
  --au-sp-2:          0.5rem;     /* 8px */
  --au-sp-3:          0.75rem;    /* 12px */
  --au-sp-4:          1rem;       /* 16px */
  --au-sp-5:          1.25rem;    /* 20px */
  --au-sp-6:          1.5rem;     /* 24px */
  --au-sp-8:          2rem;       /* 32px */
  --au-sp-10:         2.5rem;     /* 40px */
  --au-sp-12:         3rem;       /* 48px */
  --au-sp-16:         4rem;       /* 64px */
  --au-sp-20:         5rem;       /* 80px */
  --au-sp-24:         6rem;       /* 96px */

  /* ---- Layout ---- */
  --au-container:     1320px;
  --au-container-sm:  720px;
  --au-container-md:  960px;
  --au-container-lg:  1140px;
  --au-gutter:        var(--au-sp-6);

  /* ---- Breakpoints (for reference, used via media queries) ---- */
  /* --au-bp-sm:  576px  */
  /* --au-bp-md:  768px  */
  /* --au-bp-lg:  992px  */
  /* --au-bp-xl:  1200px */

  /* ---- Borders & Radius ---- */
  --au-radius:        0.625rem;   /* 10px */
  --au-radius-sm:     0.375rem;   /* 6px */
  --au-radius-lg:     1rem;       /* 16px */
  --au-radius-full:   9999px;

  /* ---- Shadows ---- */
  --au-shadow-sm:     0 1px 3px rgba(3, 2, 19, 0.06);
  --au-shadow:        0 2px 8px rgba(3, 2, 19, 0.08);
  --au-shadow-md:     0 4px 16px rgba(3, 2, 19, 0.1);
  --au-shadow-lg:     0 8px 32px rgba(3, 2, 19, 0.12);
  --au-shadow-header: 0 2px 12px rgba(3, 2, 19, 0.08);

  /* ---- Transitions ---- */
  --au-ease:          cubic-bezier(0.4, 0, 0.2, 1);
  --au-duration:      200ms;
  --au-duration-slow: 400ms;

  /* ---- Z-index ---- */
  --au-z-dropdown:    100;
  --au-z-sticky:      200;
  --au-z-overlay:     300;
  --au-z-drawer:      400;
  --au-z-modal:       500;
  --au-z-toast:       600;
}