/*
 * WEN overrides and design tokens (ADR-0002). Loaded AFTER the compiled Trezo CSS.
 *
 * THIS IS THE ONLY FILE WITH COLOR LITERALS. Templates and components use Bootstrap/Trezo
 * classes or the --wen-* tokens / wen-* classes below - never hex colors
 * (enforced by tests/Unit/TemplateColorsTest.php).
 */

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../theme/fonts/inter-latin-ext-wght-normal-1Br77OV.woff2") format("woff2-variations");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../theme/fonts/inter-latin-wght-normal-Gz7AlRl.woff2") format("woff2-variations");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    color-scheme: light;

    /* Brand (Trezo) */
    --wen-primary: #605dff;
    --wen-primary-subtle: #eceeff;
    --wen-primary-emphasis: #3225ae;

    /* Semantic tones: base (icons, charts), -subtle (backgrounds), -emphasis (text on subtle, AA contrast) */
    --wen-success: #25b003;
    --wen-success-subtle: #eaf8e4;
    --wen-success-emphasis: #1a6b05;
    --wen-warning: #ffbc2b;
    --wen-warning-subtle: #fff4dc;
    --wen-warning-emphasis: #7a4d00;
    --wen-danger: #fd5812;
    --wen-danger-subtle: #fff0e8;
    --wen-danger-emphasis: #b02406;
    --wen-info: #2db6f5;
    --wen-info-subtle: #e5f6fe;
    --wen-info-emphasis: #075985;
    --wen-neutral: #64748b;
    --wen-neutral-subtle: #eef1f5;
    --wen-neutral-emphasis: #3a4252;

    /* Surfaces */
    --wen-surface: #ffffff;
    --wen-surface-muted: #f6f7f9;
    --wen-border: #eceef2;
    --wen-text: #3a4252;
    --wen-text-muted: #64748b;
    --wen-focus-ring: #3225ae;
    --wen-skeleton: #e9ecf2;
    --wen-skeleton-shine: #f6f7fa;

    /* Chart palette (ApexCharts reads these at runtime) */
    --wen-chart-1: #605dff;
    --wen-chart-2: #2db6f5;
    --wen-chart-3: #25b003;
    --wen-chart-4: #ffbc2b;
    --wen-chart-5: #fd5812;
    --wen-chart-6: #ad63f6;
    --wen-chart-grid: #eceef2;
}

/*
 * Status tokens reference the tones; they are re-declared on the themed element so
 * var() resolves against the dark tone values there too.
 */
:root,
[data-theme="dark"] {
    /* Deal (transaction) status */
    --wen-deal-draft: var(--wen-neutral-emphasis);
    --wen-deal-draft-subtle: var(--wen-neutral-subtle);
    --wen-deal-confirmed: var(--wen-info-emphasis);
    --wen-deal-confirmed-subtle: var(--wen-info-subtle);
    --wen-deal-in-transport: var(--wen-primary-emphasis);
    --wen-deal-in-transport-subtle: var(--wen-primary-subtle);
    --wen-deal-delivered: var(--wen-success-emphasis);
    --wen-deal-delivered-subtle: var(--wen-success-subtle);
    --wen-deal-settled: var(--wen-success-emphasis);
    --wen-deal-settled-subtle: var(--wen-neutral-subtle);
    --wen-deal-cancelled: var(--wen-danger-emphasis);
    --wen-deal-cancelled-subtle: var(--wen-danger-subtle);

    /* Transport status */
    --wen-transport-planned: var(--wen-neutral-emphasis);
    --wen-transport-planned-subtle: var(--wen-neutral-subtle);
    --wen-transport-assigned: var(--wen-info-emphasis);
    --wen-transport-assigned-subtle: var(--wen-info-subtle);
    --wen-transport-loading: var(--wen-warning-emphasis);
    --wen-transport-loading-subtle: var(--wen-warning-subtle);
    --wen-transport-in-transit: var(--wen-primary-emphasis);
    --wen-transport-in-transit-subtle: var(--wen-primary-subtle);
    --wen-transport-delivered: var(--wen-success-emphasis);
    --wen-transport-delivered-subtle: var(--wen-success-subtle);
    --wen-transport-delayed: var(--wen-danger-emphasis);
    --wen-transport-delayed-subtle: var(--wen-warning-subtle);
    --wen-transport-cancelled: var(--wen-danger-emphasis);
    --wen-transport-cancelled-subtle: var(--wen-danger-subtle);

    /* Risk level / carrier rating A (low) - D (high) */
    --wen-risk-a: var(--wen-success-emphasis);
    --wen-risk-a-subtle: var(--wen-success-subtle);
    --wen-risk-b: var(--wen-info-emphasis);
    --wen-risk-b-subtle: var(--wen-info-subtle);
    --wen-risk-c: var(--wen-warning-emphasis);
    --wen-risk-c-subtle: var(--wen-warning-subtle);
    --wen-risk-d: var(--wen-danger-emphasis);
    --wen-risk-d-subtle: var(--wen-danger-subtle);
}

:root {
    /* Layout */
    --wen-detail-aside-width: 380px;
    --wen-kanban-column-width: 300px;
    --wen-radius: 7px;

    --bs-font-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --bs-focus-ring-color: color-mix(in srgb, var(--wen-focus-ring) 35%, transparent);
}

[data-theme="dark"] {
    color-scheme: dark;
    --wen-primary-subtle: #1d2150;
    --wen-primary-emphasis: #b3b1ff;
    --wen-success-subtle: #12301a;
    --wen-success-emphasis: #7fe36a;
    --wen-warning-subtle: #3a2c0c;
    --wen-warning-emphasis: #ffd27a;
    --wen-danger-subtle: #3d1a10;
    --wen-danger-emphasis: #ff9b73;
    --wen-info-subtle: #0d2b3d;
    --wen-info-emphasis: #8fd8fb;
    /* WEN-103: neutral tone, surfaces and chart grid in the dark variant (AA: emphasis on subtle >= 4.5:1) */
    --wen-neutral-subtle: #2a3140;
    --wen-neutral-emphasis: #d5dbe5;
    --wen-surface: #0c1427;
    --wen-surface-muted: #111a2e;
    --wen-border: #1f2a40;
    --wen-text: #e6e9ef;
    --wen-text-muted: #a3adbf;
    --wen-focus-ring: #b3b1ff;
    --wen-skeleton: #1b2438;
    --wen-skeleton-shine: #243049;
    --wen-chart-grid: #1f2a40;
    --wen-neutral-subtle: #1b2438;
    --wen-neutral-emphasis: #c3cbd8;
    --wen-surface: #0c1427;
    --wen-surface-muted: #0a0e19;
    --wen-border: #172036;
    --wen-text: #d5dbe5;
    --wen-text-muted: #8695aa;
    --wen-focus-ring: #b3b1ff;
    --wen-skeleton: #172036;
    --wen-skeleton-shine: #1f2a44;
    --wen-chart-grid: #172036;
}

body {
    font-family: var(--bs-font-sans-serif);
}

/* ---------- Accessibility ---------- */

.wen-skip-link {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 2000;
    padding: 8px 16px;
    border-radius: var(--wen-radius);
    background: var(--wen-surface);
    color: var(--wen-primary-emphasis);
    box-shadow: 0 0 0 3px var(--wen-focus-ring);
}

:focus-visible {
    outline: 3px solid var(--wen-focus-ring);
    outline-offset: 2px;
}

.sidebar-area .menu-link:focus-visible,
.btn:focus-visible,
.page-link:focus-visible {
    outline: 3px solid var(--wen-focus-ring);
    outline-offset: 2px;
    box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* ---------- Shell ---------- */

.wen-logo-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 9px;
    background: var(--wen-primary);
    color: var(--wen-surface);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.5px;
}

/* Client logo (assets/images/brand/wen-logo.png, white on transparent). On light
   backgrounds it is rendered dark with a filter; in dark mode it stays white. */
.brand-logo {
    display: block;
    height: 34px;
    width: auto;
    max-width: 100%;
}

.brand-logo--on-light {
    filter: brightness(0);
    opacity: 0.85;
}

[data-theme="dark"] .brand-logo--on-light {
    filter: none;
    opacity: 1;
}

.sidebar-area .logo .brand-logo {
    height: 30px;
}

[sidebar-data-theme="sidebar-hide"] .sidebar-area:not(:hover) .logo .brand-logo {
    height: 16px;
}

.sidebar-area .menu-link.active,
.sidebar-area .menu-link[aria-current="page"] {
    background-color: var(--wen-primary-subtle);
    color: var(--wen-primary-emphasis);
}

.sidebar-area .menu-link.active .menu-icon,
.sidebar-area .menu-link[aria-current="page"] .menu-icon,
.sidebar-area .menu-link.active .title,
.sidebar-area .menu-link[aria-current="page"] .title {
    color: var(--wen-primary-emphasis);
}

.sidebar-area .menu-icon[class*="ri-"] {
    font-size: 20px;
}

.wen-sidebar-backdrop {
    display: none;
}

@media (max-width: 1199.98px) {
    [sidebar-data-theme="sidebar-hide"] .wen-sidebar-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1;
        background: color-mix(in srgb, var(--wen-neutral-emphasis) 45%, transparent);
    }

    [sidebar-data-theme="sidebar-hide"] .sidebar-area {
        z-index: 3;
    }
}

.wen-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--wen-primary-subtle);
    color: var(--wen-primary-emphasis);
    font-weight: 600;
}

.wen-avatar-sm {
    width: 30px;
    height: 30px;
    font-size: 12px;
}

.wen-page-header h1 {
    font-size: 1.35rem;
}

@media (max-width: 575.98px) {
    .header-area .right-header-content .header-right-item {
        margin-left: 12px;
    }

    .wen-page-header {
        flex-direction: column;
        align-items: flex-start !important;
    }
}

/* Category tab bar (docs/design-system.md "Menu"): the active category's items, above
   the page heading. Tabs wrap onto a second row rather than scrolling; categories are
   split so a bar stays on one row on desktop. */
.wen-category-tabs .nav-link {
    color: var(--wen-text-muted);
    white-space: nowrap;
}

.wen-category-tabs .nav-link.active {
    color: var(--wen-primary-emphasis);
    border-color: var(--wen-border) var(--wen-border) var(--wen-surface);
    background-color: var(--wen-surface);
}

.wen-category-tabs .nav-link:focus-visible {
    outline: 3px solid var(--wen-focus-ring);
    outline-offset: 2px;
    box-shadow: none;
}

.wen-category-tabs .nav-tabs {
    flex: 1 1 auto;
}

.wen-category-tabs .wen-view-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    margin-left: auto;
}

.wen-category-tabs .wen-view-switch .form-select {
    min-width: 200px;
}

/* ---------- Badges (status tokens) ---------- */

.wen-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
    color: var(--wen-badge-fg, var(--wen-neutral-emphasis));
    background: var(--wen-badge-bg, var(--wen-neutral-subtle));
}

.wen-badge::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.wen-tone-success { --wen-badge-fg: var(--wen-success-emphasis); --wen-badge-bg: var(--wen-success-subtle); }
.wen-tone-warning { --wen-badge-fg: var(--wen-warning-emphasis); --wen-badge-bg: var(--wen-warning-subtle); }
.wen-tone-danger { --wen-badge-fg: var(--wen-danger-emphasis); --wen-badge-bg: var(--wen-danger-subtle); }
.wen-tone-info { --wen-badge-fg: var(--wen-info-emphasis); --wen-badge-bg: var(--wen-info-subtle); }
.wen-tone-neutral { --wen-badge-fg: var(--wen-neutral-emphasis); --wen-badge-bg: var(--wen-neutral-subtle); }
.wen-tone-primary { --wen-badge-fg: var(--wen-primary-emphasis); --wen-badge-bg: var(--wen-primary-subtle); }

.wen-status-deal-draft { --wen-badge-fg: var(--wen-deal-draft); --wen-badge-bg: var(--wen-deal-draft-subtle); }
.wen-status-deal-confirmed { --wen-badge-fg: var(--wen-deal-confirmed); --wen-badge-bg: var(--wen-deal-confirmed-subtle); }
.wen-status-deal-in-transport { --wen-badge-fg: var(--wen-deal-in-transport); --wen-badge-bg: var(--wen-deal-in-transport-subtle); }
.wen-status-deal-delivered { --wen-badge-fg: var(--wen-deal-delivered); --wen-badge-bg: var(--wen-deal-delivered-subtle); }
.wen-status-deal-settled { --wen-badge-fg: var(--wen-deal-settled); --wen-badge-bg: var(--wen-deal-settled-subtle); }
.wen-status-deal-cancelled { --wen-badge-fg: var(--wen-deal-cancelled); --wen-badge-bg: var(--wen-deal-cancelled-subtle); }
.wen-status-transport-planned { --wen-badge-fg: var(--wen-transport-planned); --wen-badge-bg: var(--wen-transport-planned-subtle); }
.wen-status-transport-assigned { --wen-badge-fg: var(--wen-transport-assigned); --wen-badge-bg: var(--wen-transport-assigned-subtle); }
.wen-status-transport-loading { --wen-badge-fg: var(--wen-transport-loading); --wen-badge-bg: var(--wen-transport-loading-subtle); }
.wen-status-transport-in-transit { --wen-badge-fg: var(--wen-transport-in-transit); --wen-badge-bg: var(--wen-transport-in-transit-subtle); }
.wen-status-transport-delivered { --wen-badge-fg: var(--wen-transport-delivered); --wen-badge-bg: var(--wen-transport-delivered-subtle); }
.wen-status-transport-delayed { --wen-badge-fg: var(--wen-transport-delayed); --wen-badge-bg: var(--wen-transport-delayed-subtle); }
.wen-status-transport-cancelled { --wen-badge-fg: var(--wen-transport-cancelled); --wen-badge-bg: var(--wen-transport-cancelled-subtle); }
.wen-status-risk-a { --wen-badge-fg: var(--wen-risk-a); --wen-badge-bg: var(--wen-risk-a-subtle); }
.wen-status-risk-b { --wen-badge-fg: var(--wen-risk-b); --wen-badge-bg: var(--wen-risk-b-subtle); }
.wen-status-risk-c { --wen-badge-fg: var(--wen-risk-c); --wen-badge-bg: var(--wen-risk-c-subtle); }
.wen-status-risk-d { --wen-badge-fg: var(--wen-risk-d); --wen-badge-bg: var(--wen-risk-d-subtle); }

/* ---------- States (empty / error / no data / insufficient / freshness) ---------- */

.wen-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 32px 16px;
    text-align: center;
    color: var(--wen-text-muted);
}

.wen-state-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    font-size: 22px;
    color: var(--wen-badge-fg, var(--wen-neutral-emphasis));
    background: var(--wen-badge-bg, var(--wen-neutral-subtle));
}

.wen-state-compact {
    flex-direction: row;
    padding: 8px 0;
    justify-content: flex-start;
    text-align: left;
}

.wen-state-compact .wen-state-icon {
    width: 28px;
    height: 28px;
    font-size: 15px;
}

.wen-empty-value {
    color: var(--wen-text-muted);
}

.wen-freshness {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--wen-text-muted);
}

.wen-freshness.is-stale {
    color: var(--wen-warning-emphasis);
}

/* ---------- Lists / tables ---------- */

.wen-list-table th {
    white-space: nowrap;
}

/* Row headers (first column, th scope=row) look like ordinary cells. */
.wen-list-table tbody th,
.table tbody th[scope="row"] {
    background-color: inherit;
    color: inherit;
}

.wen-list-table th .wen-sort {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    color: inherit;
    text-decoration: none;
}

.wen-list-table th[aria-sort="ascending"] .wen-sort,
.wen-list-table th[aria-sort="descending"] .wen-sort {
    color: var(--wen-primary-emphasis);
}

.wen-list-table .wen-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.wen-list-table tfoot td,
.wen-list-table tfoot th {
    font-weight: 600;
    background: var(--wen-surface-muted);
}

.wen-list-region {
    position: relative;
}

.wen-list-region .wen-skeleton-overlay {
    display: none;
}

.wen-list-region.htmx-request .wen-skeleton-overlay,
.wen-list-region[aria-busy="true"] .wen-skeleton-overlay {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 2;
    padding: 56px 16px 16px;
    background: color-mix(in srgb, var(--wen-surface) 80%, transparent);
}

.wen-skeleton-line {
    height: 14px;
    margin-bottom: 14px;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--wen-skeleton) 25%, var(--wen-skeleton-shine) 50%, var(--wen-skeleton) 75%);
    background-size: 200% 100%;
    animation: wen-skeleton 1.2s ease-in-out infinite;
}

@keyframes wen-skeleton {
    from { background-position: 200% 0; }
    to { background-position: -200% 0; }
}

.wen-column-chooser .dropdown-menu {
    min-width: 240px;
}

/* ---------- KPI ---------- */

.wen-kpi-value {
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--wen-text);
    font-variant-numeric: tabular-nums;
}

.wen-delta {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 13px;
    font-weight: 600;
}

.wen-delta-up { color: var(--wen-success-emphasis); }
.wen-delta-down { color: var(--wen-danger-emphasis); }
.wen-delta-flat,
.wen-delta-none { color: var(--wen-text-muted); }
.wen-delta-inverse.wen-delta-up { color: var(--wen-danger-emphasis); }
.wen-delta-inverse.wen-delta-down { color: var(--wen-success-emphasis); }

.wen-chart {
    min-height: 260px;
}

/* ---------- Kanban ---------- */

.wen-kanban {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding-bottom: 8px;
    scroll-snap-type: x proximity;
}

.wen-kanban-column {
    flex: 0 0 var(--wen-kanban-column-width);
    max-width: 85vw;
    scroll-snap-align: start;
    border-radius: var(--wen-radius);
    background: var(--wen-surface-muted);
}

.wen-kanban-cards {
    min-height: 120px;
    padding: 8px;
}

.wen-kanban-card {
    cursor: grab;
}

.wen-kanban-card.sortable-chosen {
    box-shadow: 0 0 0 3px var(--wen-focus-ring);
}

.wen-kanban-card.sortable-ghost {
    opacity: 0.4;
}

.wen-kanban-card.is-saving {
    opacity: 0.6;
    pointer-events: none;
}

/* ---------- Detail page ---------- */

.wen-detail-header {
    position: sticky;
    top: 0;
    z-index: 5;
}

.wen-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--wen-detail-aside-width);
    gap: 24px;
    align-items: start;
}

@media (max-width: 991.98px) {
    .wen-detail-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .wen-detail-header {
        position: static;
    }
}

.wen-timeline {
    list-style: none;
    margin: 0;
    padding: 0;
}

.wen-timeline-item {
    position: relative;
    padding: 0 0 20px 28px;
}

.wen-timeline-item::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 18px;
    bottom: 0;
    width: 2px;
    background: var(--wen-border);
}

.wen-timeline-item:last-child::before {
    display: none;
}

.wen-timeline-dot {
    position: absolute;
    left: 0;
    top: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 3px solid var(--wen-surface);
    background: var(--wen-badge-fg, var(--wen-primary));
    box-shadow: 0 0 0 1px var(--wen-border);
}

/* ---------- Forms ---------- */

.wen-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.wen-required::after,
.form-label.required::after {
    content: " *";
    color: var(--wen-danger-emphasis);
}

/* ---------- Toasts ---------- */

.wen-toasts {
    z-index: 1090;
}

.wen-toast {
    border-left: 4px solid var(--wen-badge-fg, var(--wen-primary));
}

/* ---------- HTMX ---------- */

.htmx-indicator {
    display: none;
}

.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
    display: inline-block;
}

/* ---------- Design system catalog ---------- */

.wen-swatch {
    height: 48px;
    border-radius: var(--wen-radius);
    border: 1px solid var(--wen-border);
}

.wen-catalog-section {
    scroll-margin-top: 16px;
}

.wen-code {
    font-size: 12px;
    max-height: 260px;
    overflow: auto;
    background: var(--wen-surface-muted);
    border-radius: var(--wen-radius);
    padding: 12px;
}

/* ---------- Geopolitical risk (epic 24): one sequential scale, higher = worse ---------- */
/* Map fills are a single yellow-orange-red ramp (ColorBrewer YlOrRd); "no data" is neutral grey.
   Badges reuse the ramp: text in -emphasis on -subtle (AA contrast). Never green/blue for risk. */
:root {
    --wen-georisk-low: #fed976;
    --wen-georisk-moderate: #fd8d3c;
    --wen-georisk-high: #e31a1c;
    --wen-georisk-critical: #800026;
    --wen-georisk-none: #cfd4dc;
    --wen-georisk-low-subtle: #fff7d6;
    --wen-georisk-low-emphasis: #6b4a00;
    --wen-georisk-moderate-subtle: #ffe8d4;
    --wen-georisk-moderate-emphasis: #8a3b00;
    --wen-georisk-high-subtle: #ffe0e0;
    --wen-georisk-high-emphasis: #a50f15;
    --wen-georisk-critical-subtle: #f6d5de;
    --wen-georisk-critical-emphasis: #67001f;
    --wen-map-sea: #eef4f8;
    --wen-map-border: #ffffff;
    --wen-map-lane: #3a4252;
}

[data-theme="dark"] {
    --wen-georisk-none: #4a5262;
    --wen-georisk-low-subtle: #3a3212;
    --wen-georisk-low-emphasis: #fed976;
    --wen-georisk-moderate-subtle: #3d2412;
    --wen-georisk-moderate-emphasis: #fdae6b;
    --wen-georisk-high-subtle: #3f1515;
    --wen-georisk-high-emphasis: #fc9272;
    --wen-georisk-critical-subtle: #3a0f1c;
    --wen-georisk-critical-emphasis: #f4a3b8;
    --wen-map-sea: #1b2230;
    --wen-map-border: #2a3140;
    --wen-map-lane: #e6e9ef;
}

.wen-status-georisk-low { --wen-badge-fg: var(--wen-georisk-low-emphasis); --wen-badge-bg: var(--wen-georisk-low-subtle); }
.wen-status-georisk-moderate { --wen-badge-fg: var(--wen-georisk-moderate-emphasis); --wen-badge-bg: var(--wen-georisk-moderate-subtle); }
.wen-status-georisk-high { --wen-badge-fg: var(--wen-georisk-high-emphasis); --wen-badge-bg: var(--wen-georisk-high-subtle); }
.wen-status-georisk-critical { --wen-badge-fg: var(--wen-georisk-critical-emphasis); --wen-badge-bg: var(--wen-georisk-critical-subtle); }
.wen-status-georisk-none { --wen-badge-fg: var(--wen-neutral-emphasis); --wen-badge-bg: var(--wen-neutral-subtle); }

.wen-georisk-swatch {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 3px;
    border: 1px solid var(--wen-border);
    vertical-align: -2px;
}
.wen-georisk-swatch--low { background: var(--wen-georisk-low); }
.wen-georisk-swatch--moderate { background: var(--wen-georisk-moderate); }
.wen-georisk-swatch--high { background: var(--wen-georisk-high); }
.wen-georisk-swatch--critical { background: var(--wen-georisk-critical); }
.wen-georisk-swatch--none { background: var(--wen-georisk-none); }
.wen-georisk-swatch--crossing { border-radius: 50%; border: 2px solid var(--wen-text); background: var(--wen-surface); }
.wen-georisk-swatch--lane { height: 0; border: 0; border-top: 3px dashed var(--wen-map-lane); border-radius: 0; vertical-align: 3px; }

.wen-risk-map {
    height: 560px;
    border-radius: var(--wen-radius);
    background: var(--wen-map-sea);
    z-index: 0;
}
.wen-risk-map .leaflet-container,
.wen-risk-map.leaflet-container { background: var(--wen-map-sea); font: inherit; }
.wen-risk-panel { min-height: 200px; }
.wen-risk-trend { width: 100%; height: 140px; }
.wen-risk-trend .trend-line { fill: none; stroke: var(--wen-georisk-high); stroke-width: 2; }
.wen-risk-trend .trend-base { fill: none; stroke: var(--wen-neutral); stroke-width: 1.5; stroke-dasharray: 4 3; }
.wen-risk-trend .trend-threshold { stroke: var(--wen-border); stroke-width: 1; }
.wen-risk-trend text { fill: var(--wen-text-muted); font-size: 10px; }
.wen-risk-breakdown td, .wen-risk-breakdown th { font-variant-numeric: tabular-nums; }

@media (max-width: 991.98px) {
    .wen-risk-map { height: 420px; }
}
/* ---- Epic 15: notifications bell, global search, work queue ------------------------------ */
.wen-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--wen-badge-fg, var(--wen-neutral));
}
.notifications .dropdown-menu { width: min(380px, 92vw); }
.wen-bell-list { max-height: 420px; overflow-y: auto; }
.wen-search-results {
    width: 100%;
    max-height: 70vh;
    overflow-y: auto;
    top: calc(100% + 4px);
    left: 0;
}
.wen-search-results .dropdown-item.active,
.wen-search-results .dropdown-item:focus { background: var(--wen-primary-subtle); color: var(--wen-primary-emphasis); }
.wen-task-overdue { background: var(--wen-danger-subtle); }
.wen-comment-body { white-space: normal; overflow-wrap: anywhere; }

/* ---- Analyzing: lane map (WEN-260) ---------------------------------------------------------- */
.wen-lane-map {
    height: 560px;
    border-radius: var(--wen-radius);
    background: var(--wen-map-sea);
    z-index: 0;
}
.wen-lane-map.leaflet-container { background: var(--wen-map-sea); font: inherit; }
.wen-lane-swatch {
    display: inline-block;
    width: 22px;
    height: 0;
    border-top: 5px solid var(--wen-lane-swatch, var(--wen-map-lane));
    vertical-align: 3px;
}
.wen-lane-swatch--dashed { border-top-style: dashed; }
@media (max-width: 767.98px) {
    .wen-lane-map { height: 400px; }
}

/* Intel (WEN-329): muted text and inline notices on the token palette - no Bootstrap colour
   utilities. Contrast review (tests/Unit/IntelUiContrastTest.php): tone emphasis on tone subtle
   and --wen-text-muted on --wen-surface meet WCAG AA 4.5:1 in both themes. */
.wen-text-muted {
    color: var(--wen-text-muted);
}

.wen-note {
    display: block;
    padding: 10px 14px;
    border-radius: var(--wen-radius);
    color: var(--wen-badge-fg, var(--wen-neutral-emphasis));
    background: var(--wen-badge-bg, var(--wen-neutral-subtle));
}

.wen-note a {
    color: inherit;
    text-decoration: underline;
}