/* =============================================================================
 * Alnora — Freemius Checkout Brand Overrides
 * Remaps the Freemius design-system CSS variables to the Alnora palette.
 * Palette reference: --navy #0A4B5C | --teal #0DB89A | --coral #F5701A
 * =========================================================================== */

:root {

    /* ── Blue scale → Alnora teal ──────────────────────────────────────────
       Freemius uses the blue scale for links, active inputs, focus rings,
       and the primary CTA button. We remap it to the teal brand colour.   */
    --fs-ds-blue-10:  #EDF9F7;
    --fs-ds-blue-100: #C8EFE9;
    --fs-ds-blue-200: #8EDDD4;
    --fs-ds-blue-300: #3DD6C0;
    --fs-ds-blue-400: #1DC3AB;
    --fs-ds-blue-500: #0DB89A;
    --fs-ds-blue-600: #0DA087;
    --fs-ds-blue-700: #0D7A68;
    --fs-ds-blue-800: #0A5C4E;
    --fs-ds-blue-900: #073D35;

    /* ── Typography ────────────────────────────────────────────────────── */
    --fs-ds-typography-font-base: 'Montserrat', -apple-system, BlinkMacSystemFont,
        'Segoe UI', Roboto, Helvetica, Arial, sans-serif,
        'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;

    /* ── Border radius — slightly more rounded to match Alnora card style  */
    --fs-ds-appearance-border-radius:    8px;
    --fs-ds-appearance-border-radius-sm: 5px;
    --fs-ds-appearance-border-radius-lg: 14px;

    /* ── Backgrounds ───────────────────────────────────────────────────── */
    --fs-ds-theme-background-color:   #FFFFFF;
    --fs-ds-theme-background-shade:   #F8FBFC;   /* --bg */
    --fs-ds-theme-background-accented:#E2EEF2;   /* --navy-light */

    /* ── Text ──────────────────────────────────────────────────────────── */
    --fs-ds-theme-text-color:         #4A6B72;   /* --body */
    --fs-ds-theme-heading-text-color: #0A4B5C;   /* --navy */
    --fs-ds-theme-muted-text-color:   #7A99A2;   /* --muted */

    /* ── Controls ─────────────────────────────────────────────────────── */
    --fs-ds-theme-control-border-color:       #D4E8EC;   /* --border */
    --fs-ds-theme-control-border-hover-color: #9BC4CF;
    --fs-ds-theme-control-placeholder-color:  #7A99A2;   /* --muted */

    /* ── Divider ───────────────────────────────────────────────────────── */
    --fs-ds-theme-divider-color: #D4E8EC;   /* --border */

    /* ── Cart header ───────────────────────────────────────────────────── */
    --fs-ds-theme-cart-header-background-color:            #F0F9F8;   /* --teal-mist */
    --fs-ds-theme-cart-header-border-color:                #C8EFE9;
    --fs-ds-theme-cart-header-product-image-background-color: #9BC4CF;
    --fs-ds-theme-cart-header-footer-background-color:     #E2EEF2;   /* --navy-light */

    /* ── Footer — Alnora navy ──────────────────────────────────────────── */
    --fs-ds-theme-footer-background-color:      #073544;   /* --navy-dark */
    --fs-ds-theme-footer-text-color:            #C8EFE9;
    --fs-ds-theme-footer-control-border:        #3D8199;
    --fs-ds-theme-footer-control-border-hover:  #6AA2B2;
    --fs-ds-theme-footer-control-border-focus:  #3DD6C0;   /* --teal-light */
    --fs-ds-theme-footer-link-color:            #8EDDD4;

    /* ── Scrollbar ─────────────────────────────────────────────────────── */
    --fs-ds-theme-scrollbar-thumb-background:        #C8EFE9;
    --fs-ds-theme-scrollbar-thumb-background-active: #8EDDD4;

    /* ── Badge ─────────────────────────────────────────────────────────── */
    --fs-ds-theme-badge-color:            #0A4B5C;   /* --navy */
    --fs-ds-theme-badge-background-color: #E2EEF2;   /* --navy-light */

    /* ── Switch ─────────────────────────────────────────────────────────  */
    --fs-ds-theme-switch-border-color: #7A99A2;

    /* ── Signals / expand button ────────────────────────────────────────  */
    --fs-ds-theme-signal-bar-expand-button-background-color: #0DB89A;   /* --teal */

    /* ── Promotion strip ────────────────────────────────────────────────  */
    --fs-ds-theme-promotion-background-color: #E2EEF2;   /* --navy-light */

    /* ── Box shadows — tinted with navy instead of pure black ───────────  */
    --fs-ds-box-shadow-sm:      0 1px 2px 0 rgba(10, 75, 92, .05);
    --fs-ds-box-shadow-regular: 0 1px 3px 0 rgba(10, 75, 92, .10), 0 1px 2px -1px rgba(10, 75, 92, .10);
    --fs-ds-box-shadow-md:      0 4px 6px -1px rgba(10, 75, 92, .10), 0 2px 4px -2px rgba(10, 75, 92, .10);
    --fs-ds-box-shadow-lg:      0 10px 15px -3px rgba(10, 75, 92, .10), 0 4px 6px -4px rgba(10, 75, 92, .10);
    --fs-ds-box-shadow-xl:      0 20px 25px -5px rgba(10, 75, 92, .10), 0 8px 10px -6px rgba(10, 75, 92, .10);
    --fs-ds-box-shadow-2xl:     0 25px 50px -12px rgba(10, 75, 92, .22);
    --fs-ds-box-shadow-footer:  0 -20px 25px 5px rgba(10, 75, 92, .10), 0 -8px 10px -6px rgba(10, 75, 92, .22), 0 0 10px -2px rgba(10, 75, 92, .22);
}