/* =============================================================================
   smkk-flatten.css — GLOBAL de-bubble pass (2026-06-30). Luke: "simple + effective,
   no bad-looking cards, every page, desktop + mobile."
   Turns the floating/rounded/heavy-shadow "bubbly cards" into flat, dense, professional
   surfaces (Spectrum / Microsoft / Cisco admin look) across ALL 148 pages in one file —
   because every card uses shared classes. VISUAL-ONLY (radius + shadow + border): it does
   NOT touch padding/margins/layout, so it cannot break page structure. Tunable via the
   variables below; fully reversible (delete this file + its <link>).
   Deeper work (dense rows over cards, kill scroll-nightmares, per-page IA) = the Codex
   systematic overhaul; this is the instant app-wide first coat.
   ============================================================================= */

:root {
    /* dial these to taste */
    --smkk-flat-radius: 8px;                                   /* was ~12–16px (bubbly) */
    --smkk-flat-radius-sm: 6px;
    --smkk-flat-border: 1px solid var(--smkk-spx-border, rgba(31, 41, 51, .12));
    --smkk-flat-shadow: none;                                  /* flat: rely on the border, not a float */
    --smkk-flat-shadow-raised: 0 2px 8px rgba(15, 23, 42, .10);/* only true overlays (modals/menus) keep a lift */
}

/* --- the card/panel/tile surfaces: flatten radius, drop the heavy float, add a crisp hairline --- */
:is(.card, .app-card, .panel, .tile, .spx-card, .warehouse-proof-card,
    .dashboard-card, .kpi-tile, .card--wide, .installer-list-card, .installer-picker-card) {
    border-radius: var(--smkk-flat-radius) !important;
    box-shadow: var(--smkk-flat-shadow) !important;
    border: var(--smkk-flat-border);
}

/* --- overlays that SHOULD still lift off the page (real popovers/menus/modals) keep a soft shadow --- */
:is(dialog, .smkk-sheet, .clint-actions-menu, [role="menu"], .spx-popover, .modal, .drill-sheet) {
    box-shadow: var(--smkk-flat-shadow-raised);
    border-radius: var(--smkk-flat-radius) !important;
}

/* --- calm the busiest decoration: gradient/patterned card backgrounds -> flat surface --- */
:is(.card, .app-card, .panel, .warehouse-proof-card) {
    background-image: none;
}

/* --- buttons/pills stay tappable but lose the pill-bubble excess (keep a modest radius) --- */
:is(.app-btn, .btn, .pill, .chip, .badge) { border-radius: var(--smkk-flat-radius-sm); }

/* --- nested cards (card inside card) look terrible when both float: inner cards go borderless/flat --- */
:is(.card, .app-card, .panel) :is(.card, .app-card, .panel) {
    box-shadow: none !important;
    border: 1px solid var(--smkk-spx-border, rgba(31, 41, 51, .08));
}