/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* 1. CSS Zero foundation — vendored under app/assets/stylesheets/css-zero/ on purpose
 * so tokens/utilities are greppable in-repo (DX + agent visibility). App paths
 * intentionally shadow the css-zero gem; keep that tree in sync when bumping the gem. */
@import url("/assets/css-zero/reset-d2ca2cc5.css");
@import url("/assets/css-zero/variables-c15eb0b3.css");

/* 2. Application styles */
@import url("/assets/accordion-38fc1f9d.css");
@import url("/assets/alert-8ee6cb9e.css");
@import url("/assets/notification_inbox-efe2ac5d.css");
@import url("/assets/base-4d194172.css");
@import url("/assets/breadcrumb-225b4541.css");
@import url("/assets/button-42eff212.css");
@import url("/assets/card-fd68a5b9.css");
@import url("/assets/command-e1e5edeb.css");
@import url("/assets/dialog-183a9b18.css");
@import url("/assets/flash-bd8c54bc.css");
@import url("/assets/sale_toast-06a5a0f2.css");
@import url("/assets/group-652f0db2.css");
@import url("/assets/icons-72f6afd1.css");
@import url("/assets/input-8c6106db.css");
@import url("/assets/layouts-50282cd3.css");
@import url("/assets/menu-c8696929.css");
@import url("/assets/popover-46267da2.css");
@import url("/assets/pagination-fa87e204.css");
@import url("/assets/keyboard-a3c00b63.css");
@import url("/assets/sheet-1de781e1.css");
@import url("/assets/sidebar_menu-cd1f6d68.css");
@import url("/assets/table-f8c91274.css");
@import url("/assets/color_scheme-0fedfe3e.css");
@import url("/assets/badge-5b4b4a70.css");
@import url("/assets/list-47e2b1a6.css");
@import url("/assets/tabs-1e8b67f0.css");
@import url("/assets/lexxy-f326a350.css");
@import url("/assets/rich_text-aa8fa44d.css");
@import url("/assets/input_copyable-4e9a65e2.css");
@import url("/assets/input_revealable-a39bd3ca.css");
@import url("/assets/datepicker-60653d21.css");
@import url("/assets/forms-f532ef33.css");
@import url("/assets/event_hero-47adf46a.css");
@import url("/assets/switch-cc26d01d.css");
@import url("/assets/settings-95a3c177.css");
@import url("/assets/order_show-e7a3305f.css");
@import url("/assets/ai_chat-d8e029dc.css");
@import url("/assets/onboarding-8ed6a902.css");
@import url("/assets/seatmap_editor-2db61038.css");
@import url("/assets/seatmap_setup-28988ec4.css");

@import url("/assets/pages/dashboard-ab41b556.css");
@import url("/assets/pages/public-33871ffb.css");

/* 3. CSS Zero utilities - must load last to ensure proper cascade priority */
@import url("/assets/css-zero/utilities-1dfac6d1.css");
@import url("/assets/application_utilities-3d8ca35a.css");

/* Usetix semantic theme — single source of truth (not base.css). */
:root {
    --default-font-family: "Inter", system-ui, sans-serif;
    --container-width: 100%;

    /* Backgrounds — match demo surface stack for strong card contrast */
    --color-bg: light-dark(var(--neutral-200), var(--neutral-950));
    --color-bg-elevated: light-dark(
        color-mix(in oklch, var(--neutral-100) 60%, var(--neutral-200)),
        color-mix(in oklch, var(--neutral-950) 70%, var(--neutral-900))
    );
    --color-surface: light-dark(var(--neutral-50), var(--neutral-900));

    /* Elevation surfaces (0 = lowest, 4 = highest) */
    --color-surface-0: var(--color-bg);
    --color-surface-1: light-dark(
        color-mix(in oklch, var(--neutral-200) 60%, var(--neutral-300)),
        var(--neutral-950)
    );
    --color-surface-2: var(--color-bg-elevated);
    --color-surface-3: var(--color-surface);
    --color-surface-4: light-dark(
        var(--neutral-50),
        color-mix(in oklch, var(--neutral-900) 60%, var(--neutral-800))
    );

    /* Text with warm undertones */
    --color-text: light-dark(var(--neutral-900), var(--neutral-50));
    --color-text-reversed: light-dark(var(--neutral-50), var(--neutral-900));
    --color-text-subtle: light-dark(var(--neutral-500), var(--neutral-400));

    /* Links stay blue for recognition */
    --color-link: light-dark(var(--blue-700), var(--blue-400));

    /* Warm borders */
    --color-border-light: light-dark(var(--neutral-100), var(--neutral-800));
    --color-border: light-dark(var(--neutral-300), var(--neutral-700));
    --color-border-dark: light-dark(var(--neutral-400), var(--neutral-600));

    /* Selection & highlight: sky blue in light, monochrome in dark */
    --color-selected: light-dark(var(--sky-100), var(--neutral-800));
    --color-selected-dark: light-dark(var(--blue-300), var(--blue-800));
    --color-highlight: light-dark(var(--sky-200), var(--neutral-800));

    /* Actions & status */
    --color-primary: light-dark(var(--neutral-950), var(--neutral-100));
    --color-secondary: light-dark(var(--neutral-100), var(--neutral-800));
    --color-negative: light-dark(var(--red-500), var(--red-800));
    --color-positive: light-dark(var(--emerald-500), var(--emerald-800));
    --color-warning: light-dark(var(--amber-600), var(--amber-400));
}

/* Admin pages share a single content width (matches Shopify/Stripe-style admin shells) */
.sidebar-layout {
    --container-width: 64rem;
}

.sidebar-layout .container {
    padding-block-end: var(--size-8);
}

html, body {
    -webkit-font-smoothing: antialiased;
}

html.light {
    color-scheme: light;
}

html.dark {
    color-scheme: dark;
}