/* ==========================================================================
   MAISON DIX-HUIT GLOBAL SYSTEM STYLES
   ========================================================================== */

/*#region BrandVariables*/
:root {
    /* Brand Palettes */
    --pantone-7533C: #483729; /* Dark Espresso / Deep Earth */
    --pantone-7534C: #D1CCBD; /* Chalk / Very Light Taupe */
    --pantone-7527C: #D7D2C4; /* Soft Sand / Warm Parchment */
    --pantone-7528C: #C6B9AC; /* Warm Greige / Muted Pebble */
    --pantone-400C: #C5BFB6; /* Fog / Warm Silver Gray */
    --pantone-warmgray4: #A89F8E; /* Needs to be defined */
    --pantone-622C: #B6CDC3; /* Pale Mint / Light Ice Green */
    --pantone-623C: #99B9AD; /* Soft Sage Green */
    --pantone-5575C: #91ACA1; /* Dusty Laurel / Muted Spruce */
    --pantone-557C: #86AF9B; /* Eucalyptus Green */
    --pantone-7494C: #9BAE89; /* Moss / Muted Olive */
    --pantone-1525C: #BC4800; /* Burnt Amber / Deep Rust */
    --pantone-167C: #C2541B; /* Terracotta / Spice Orange */
    --pantone-1595C: #DB6116; /* Vibrant Copper / Pumpkin */
    --pantone-1675C: #AC441D; /* Deep Auburn / Burnt Sienna */
    --pantone-661C: #003594; /* Cobalt / Royal Blue */
    --pantone-662C: #001B70; /* Deep Navy / Midnight Blue */
    --white: #ffffff; /* Pure White */
    --black: #000000; /* Pure Black */
    /* Layout Component Overrides & Global Fills */
    --brand-header-background: var(--pantone-623C);
    --brand-header-border: var(--pantone-623C);
    --brand-page-background: var(--white); /* All page backgrounds */
    --brand-text-primary: var(--pantone-7533C); /* All text */
    --brand-text-muted: #6c757d; /* All muted text */
    /* Layout Accents & Dividers */
    --brand-divider-light: #f0efe9;
    --brand-divider-medium: #e5e4df;
    --brand-divider-dark: #1c1c1e;
    --brand-accent-strip: #faf9f5; /* The 6px decorative break bar background */
    /* Hero Parallax Area */
    --brand-hero-overlay-start: rgba(26, 26, 26, 0.15);
    --brand-hero-overlay-end: rgba(26, 26, 26, 0.30);
    --brand-hero-text: #ffffff;
    /* Floating Footer Area */
    --brand-footer-background: var(--black); /* Footer background with transparency */
    --brand-footer-border: var(--pantone-1675C); /* Footer border color */
    --brand-footer-text: var(--pantone-7527C); /* Footer text color */
    --brand-footer-text-hover: #ffffff; /* Footer text hover color */
    --brand-footer-separator: rgba(255, 255, 255, 0.25); /* Footer separator line color */
    /* Typography Definitions & Structural Elements */
    --font-heading: 'Big Caslon', 'Libre Caslon Text', 'Georgia', 'Baskerville', serif;
    --font-body: 'Optima', 'Tenor Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --border-radius-main: 8px;
    /* ==========================================================================
       BRAND TYPOGRAPHY SCALE (TOKENIZED SIZES)
       ========================================================================== */
    --font-size-xs: 0.75rem; /* ~12px - Small badges, buttons, drawer secondary */
    --font-size-sm: 0.875rem; /* ~14px - Banner body, Mega panel body copy, links */
    --font-size-base: 0.90rem; /* ~14.4px - Panel titles/subheadings, banner title */
    --font-size-md: 1.00rem; /* ~16px - Standard sub-headers */
    --font-size-lg: 1.25rem; /* ~20px - Main section titles */
    --font-size-xl: 2.00rem; /* ~40px - Main Brand Logo Text */
    /* Font Weights */
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    /* Letter Spacing Tokens (Luxury Minimalist Aesthetic) */
    --tracking-normal: 0.5px;
    --tracking-wide: 1.0px;
    --tracking-wider: 1.2px;
    --tracking-widest: 1.5px;
}
/*#endregion BrandVariables*/

/*#region GlobalOverrides*/
html, body {
    font-family: var(--font-body), 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background-color: var(--brand-page-background);
    color: var(--brand-text-primary);
}

h1:focus {
    outline: none;
}

/* Systemic Luxury Serif for clean Editorial Headers */
.font-editorial {
    font-family: Garamond, 'Baskerville Old Face', 'Hoefler Text', 'Times New Roman', serif;
    letter-spacing: -0.5px;
}

/* Ultra-Clean Modern Sans-Serif for Buttons, Navigation, and Small Accents */
.font-clean {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.transition-opacity:hover {
    opacity: 0.8;
}
/*#endregion GlobalOverrides*/

/*#region FrameworkComponents*/
/* Data Validation States */
.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

/* Native Blazor Error Boundary Layout */
.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NUwyODkuODMxIDc1LjU3NzFDMjkwLjYxNSA3Ni4zNzAxIDI5MSA3Ny40NjU4IDI5MSA3OC42NzY4IDI5MSA3OS44ODc5IDI5MC42MTUgODEuMDA1NSAyODkuODMxIDgxLjc4ODRMMjY3LjA1MiAxMDQuNTY3QzI2Ni44MTMgMTA0Ljc2MiAyNjYuNjA2IDEwNSAyNjMuNTA2IDEwNUMyNjIuMjA2IDEwNSAyNjEuMjM3IDEwNC43NjIgMjYwLjQwNyAxMDQuNTY3TDIzNy42MjggODEuNzg4NEMyMzYuODQ2IDgxLjAwNTUgMjM2IDc5Ljg4NzkgMjM2IDc4LjY3NjggMjM2IDc3LjQ2NTggMjM2Ljg0NiA3Ni4zNzAxIDIzNy42MjggNzUuNTc3MUwyNjAuNDA3IDUyLjc5ODVDMjYxLjIzNyA1MS40ODM3IDI2Mi4yMDYgNTEgMjYzLjUwNiA1MVpNMjYzLjUwNiA2MC42OTMzQzI2MC4xOTggNjAuNjkzMyAyNTcuNTExIDYzLjM4MDEgMjU3LjUxMSA2Ni42ODgxIDI1Ny41MTEgNjkuOTk2MSAyNjAuMTk4IDcyLjY4MjkgMjYzLjUwNiA3Mi42ODI5IDI2Ni44MTQgNzIuNzgyOSAyNjkuNTAxIDY5Ljk5NjEgMjY5LjUwMSA2Ni42ODgxIDI2OS41MDEgNjMuMzgwMSAyNjkuNTAxIDYwLjY5MzMgMjYzLjUwNiA2MC42OTMzWk0yNTkuNjE2IDgwLjI3NjZMMjU5LjYxNiA4OC44NzA5QzI1OS42MTYgOTAuMTg0MyAyNjAuNjgxIDkxLjI0OTMgMjYxLjk5NCA5MS4yNDkzTDI2NS4wMTggOTEuMjQ5M0MyNjYuMzMyIDkxLjI0OTMgMjY3LjM5NyA5MC4xODQzIDI2Ny4zOTcgODguODcwOUwyNjcuMzk3IDgwLjI3NjZDMjY3LjM5NyA3OC45NjMzIDI2Ni4zMzIgNzcuODk4MiAyNjUuMDE4IDc3Ljg5ODJMMjYxLjk5NCA3Ny44OTgyQzI2MC42ODEgNzcuODk4MiAyNTkuNjE2IDc4Ljk2MzMgMjU5LjE2IDgwLjI3NjZaIiBmaWxsPSIjRkZGRkZGIi8+PC9nPjwvc3ZnPg==) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred.";
}

/* Blazor System Error UI Overlay */
#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 2000;
    color: #000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/*#endregion FrameworkComponents*/