/*
 * RenoQuotes brand tokens.
 * Single source for brand colours. Loaded before MudBlazor and app.css so that
 * every downstream stylesheet and the MudBlazor theme can consume these values.
 * Spec: .ai/product/branding-guidelines.md v2.0 (Copper Forward).
 *
 * Fonts (DM Sans, JetBrains Mono) are currently loaded via Google Fonts in
 * App.razor. Self-hosting to wwwroot/fonts is a follow-up per tech-stack.md
 * ("Font Loading: Self-hosted for performance").
 */

:root {
    /* Primary — Deep Navy */
    --rq-deep-navy: #1B2A4A;
    --rq-navy-light: #2D4470;
    --rq-navy-muted: #3D5A8A;
    --rq-navy-darker: #162240; /* Footer / pressed-navy variant */

    /* Accent — Warm Copper */
    --rq-warm-copper: #C47A2E;
    --rq-copper: #D4883A;
    --rq-soft-gold: #F0C078;
    --rq-copper-dark: #A86B28;

    /* Semantic */
    --rq-eucalyptus: #2D8F5E;
    --rq-alert-red: #C94444;
    --rq-info-blue: #3B82F6;
    --rq-warning-amber: #D97706;

    /* Neutrals */
    --rq-near-black: #1A1A1A;
    --rq-slate-grey: #6B7280;
    --rq-mid-grey: #9CA3AF;
    --rq-sandstone: #EDE8E1;
    --rq-warm-white: #F8F6F3;
    --rq-pure-white: #FFFFFF;

    /* Translucent white overlays — for white-on-navy contexts (hero bands, dark cards) */
    --rq-overlay-faint: rgba(255, 255, 255, 0.06);  /* feature-card backgrounds */
    --rq-overlay-soft: rgba(255, 255, 255, 0.10);   /* icon-container backgrounds, dividers */
    --rq-text-on-navy: rgba(255, 255, 255, 0.85);   /* body copy on navy */
    --rq-text-on-navy-muted: rgba(255, 255, 255, 0.70); /* microcopy on navy */

    /*
     * Breakpoints — mirror MudBlazor's Breakpoint.{Sm,Md,Lg} so Razor (MudHidden)
     * and CSS (@media) share one vocabulary. Don't introduce ad-hoc px values in
     * page-scoped CSS; use these.
     */
    --rq-bp-sm: 600px;   /* tablet floor */
    --rq-bp-md: 960px;   /* desktop floor */
    --rq-bp-lg: 1280px;

    /* Minimum tap-target size (WCAG 2.5.5 AAA recommendation, comfortable default). */
    --rq-tap-target: 44px;
}

/*
 * Link colour override. Standard Warm Copper (#C47A2E) on white fails WCAG AA
 * for normal text (3.38:1). Force anchor-style links to Copper Dark (#A86B28),
 * which passes AA at 4.54:1 on pure white. Filled buttons, icons, and large
 * headings keep full-strength copper because they're not normal text.
 */
a,
.mud-link {
    color: var(--rq-copper-dark);
}

a:hover,
.mud-link:hover {
    color: var(--rq-warm-copper);
}

/*
 * Shared utility pill. Used across the quote surface (wizard + results page) to
 * render disabled-stub navigation surrogates like "Saved Quotes" / "Quote History".
 * Lives here rather than in a page-scoped stylesheet because two consumers share it
 * and a third (account dashboard) is likely. Class is unprefixed (rq-) to signal
 * "global brand component", not page-local.
 */
.rq-utility-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--rq-pure-white);
    border: 1px solid var(--rq-sandstone);
    border-radius: 8px;
    font-size: 0.875rem;
    color: var(--rq-slate-grey);
    opacity: 0.7;
    cursor: not-allowed;
}