/**
 * Ducobur product frontend foundation.
 *
 * Shared design tokens and accessibility defaults for the product landing,
 * product category archives. Single products load editorial tokens directly.
 *
 * @package Kadence_Child
 */

:root {
    /* Brand and semantic color system. */
    --df-blue-700: #303090;
    --df-blue-800: #25256f;
    --df-navy-900: #171b4b;
    --df-blue-500: #4e5db7;
    --df-focus: #2f5fd0;
    --df-lavender-100: #ecebf5;
    --df-lavender-200: #e0deed;
    --df-white: #ffffff;
    --df-canvas: #f7f8fc;
    --df-surface-subtle: #eef1f7;
    --df-text: #182033;
    --df-text-muted: #59657a;
    --df-text-subtle: #758096;
    --df-border: #d8deea;
    --df-border-strong: #b9c3d5;
    --df-disabled-bg: #e9edf4;
    --df-disabled-text: #7d8799;
    --df-success: #24745a;
    --df-warning: #8a6200;
    --df-error: #b42318;
    --df-overlay: rgb(17 24 39 / 48%);

    /* Typography. */
    --df-font-sans: 'Source Sans 3', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --df-font-mono: 'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;
    --df-leading-tight: 1.1;
    --df-leading-heading: 1.2;
    --df-leading-body: 1.625;

    /* Spacing. */
    --df-space-1: 0.25rem;
    --df-space-2: 0.5rem;
    --df-space-3: 0.75rem;
    --df-space-4: 1rem;
    --df-space-6: 1.5rem;
    --df-space-8: 2rem;
    --df-space-12: 3rem;
    --df-space-16: 4rem;
    --df-space-20: 5rem;
    --df-space-24: 6rem;

    /* Layout. */
    --df-shell-wide: 90rem;
    --df-shell-standard: 75rem;
    --df-reading-width: 45rem;
    --df-page-gutter: 2rem;
    --df-category-rail: 15.5rem;
    --df-header-height: 4.5rem;
    --df-control-height: 3rem;
    --df-control-height-compact: 2.75rem;

    /* Shape, depth, and motion. */
    --df-radius-control: 0.375rem;
    --df-radius-card: 0.625rem;
    --df-radius-dialog: 1rem;
    --df-shadow-overlay: 0 1rem 2.5rem rgb(35 45 80 / 14%);
    --df-duration-fast: 160ms;
    --df-duration-base: 220ms;
    --df-ease-standard: cubic-bezier(0.2, 0, 0, 1);

    /* Documented layer scale. */
    --df-z-sticky: 20;
    --df-z-dropdown: 40;
    --df-z-overlay: 80;
    --df-z-dialog: 90;
}

@media (max-width: 1279px) {
    :root {
        --df-page-gutter: 1.5rem;
    }
}

@media (max-width: 767px) {
    :root {
        --df-page-gutter: 1rem;
        --df-header-height: 4rem;
    }
}

body.post-type-archive-product,
body.tax-product_cat,
body.single-product {
    background: var(--df-canvas);
    color: var(--df-text);
    font-family: var(--df-font-sans);
    font-size: 1rem;
    line-height: var(--df-leading-body);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.post-type-archive-product *,
body.tax-product_cat *,
body.single-product * {
    box-sizing: border-box;
}

body.post-type-archive-product :where(button, input, select, textarea),
body.tax-product_cat :where(button, input, select, textarea),
body.single-product :where(button, input, select, textarea) {
    font: inherit;
}

body.post-type-archive-product :where(a, button, input, select, textarea, [tabindex]):focus-visible,
body.tax-product_cat :where(a, button, input, select, textarea, [tabindex]):focus-visible,
body.single-product :where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid var(--df-focus);
    outline-offset: 3px;
}

body.post-type-archive-product :where(button, input, select, textarea):disabled,
body.tax-product_cat :where(button, input, select, textarea):disabled,
body.single-product :where(button, input, select, textarea):disabled {
    border-color: var(--df-border);
    background: var(--df-disabled-bg);
    color: var(--df-disabled-text);
    cursor: not-allowed;
}

.df-technical-value {
    font-family: var(--df-font-mono);
    font-variant-numeric: tabular-nums;
}

.df-screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

@media (prefers-reduced-motion: reduce) {
    body.post-type-archive-product *,
    body.post-type-archive-product *::before,
    body.post-type-archive-product *::after,
    body.tax-product_cat *,
    body.tax-product_cat *::before,
    body.tax-product_cat *::after,
    body.single-product *,
    body.single-product *::before,
    body.single-product *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}