/* Cofre Digital — design system (plano de controlo).
   Aspeto leve e claro: fundo branco, tipografia Inter fluida (ajusta ao ecrã),
   barra de topo + navegação horizontal, sombras discretas. Estiliza elementos
   semânticos (para as páginas existentes herdarem o aspeto) e oferece classes de
   componente (.cd-card, .cd-btn, .cd-table, .cd-list…). */

:root {
    /* Tema por omissão: Claro refinado. Outros temas sobrepõem estes tokens por data-cd-style. */
    --cd-bg: #f5f6f8;
    --cd-surface: #ffffff;
    --cd-surface-2: #f8fafc;
    --cd-ink: #182230;
    --cd-ink-soft: #5a6b7d;
    --cd-faint: #93a2b2;
    --cd-line: #e6eaef;
    --cd-line-strong: #dce2e9;
    --cd-brand: #2563d8;          /* azul (ações, ligações, ativo) */
    --cd-brand-600: #1d50b8;
    --cd-brand-soft: #eaf1fe;
    --cd-accent: #2563d8;
    --cd-on-brand: #ffffff;       /* texto sobre a cor de marca (botões, etc.) */
    --cd-ok: #1a7f4b;  --cd-ok-dot: #22a35c;  --cd-ok-bg: #e6f5ec;
    --cd-warn: #9a6300; --cd-warn-dot: #e0920a; --cd-warn-bg: #fdf1dd;
    --cd-crit: #c6362b; --cd-crit-dot: #e05548; --cd-crit-bg: #fdecea;
    --cd-idle: #93a2b2;
    --cd-radius: 12px;
    --cd-shadow: 0 1px 2px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.05);
    --cd-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --cd-font-display: "Inter", system-ui, sans-serif;

    /* Tipografia fluida (ajusta entre telemóvel e PC) */
    --cd-fs-xs:   clamp(10.5px, 1.9vw, 11.5px);
    --cd-fs-sm:   clamp(12px, 2vw, 13px);
    --cd-fs-base: clamp(13.5px, 2.1vw, 15px);
    --cd-fs-h1:   clamp(18px, 3.4vw, 22px);
    --cd-fs-h2:   clamp(14.5px, 2.5vw, 17px);
    --cd-gutter:  clamp(14px, 4vw, 28px);
}

/* ── Temas selecionáveis (o utilizador escolhe na barra de topo; guardado no browser).
   Cada bloco só redefine tokens — os componentes herdam tudo. ── */
html[data-cd-style="vault"] {
    --cd-bg:#0e1620; --cd-surface:#15202c; --cd-surface-2:#1b2836; --cd-ink:#eaf1f8; --cd-ink-soft:#9fb2c4;
    --cd-faint:#6b8096; --cd-line:#243444; --cd-line-strong:#2d3f50;
    --cd-brand:#f2b544; --cd-brand-600:#e0a633; --cd-brand-soft:#2a2416; --cd-accent:#f2b544; --cd-on-brand:#10161e;
    --cd-ok:#36c793; --cd-ok-dot:#36c793; --cd-ok-bg:#12352c;
    --cd-warn:#f0a830; --cd-warn-dot:#f0a830; --cd-warn-bg:#36290f;
    --cd-crit:#f2685f; --cd-crit-dot:#f2685f; --cd-crit-bg:#3a1c1c;
    --cd-idle:#6b8096; --cd-radius:16px; --cd-shadow:0 10px 30px rgba(0,0,0,.35);
    --cd-font-display:"Sora", system-ui, sans-serif;
    color-scheme: dark;
}
html[data-cd-style="nordic"] {
    --cd-bg:#eef0ea; --cd-surface:#f8f9f4; --cd-surface-2:#f1f3ec; --cd-ink:#2d322b; --cd-ink-soft:#6a7265;
    --cd-faint:#9aa394; --cd-line:#dfe3d8; --cd-line-strong:#d2d7c9;
    --cd-brand:#5b7a5b; --cd-brand-600:#4d684d; --cd-brand-soft:#e4ede2; --cd-accent:#5b7a5b; --cd-on-brand:#f8f9f4;
    --cd-ok:#4f7a53; --cd-ok-dot:#5a8a5e; --cd-ok-bg:#e4ede2;
    --cd-warn:#a2772f; --cd-warn-dot:#c79a4b; --cd-warn-bg:#f1e7d4;
    --cd-crit:#b1534a; --cd-crit-dot:#c4645a; --cd-crit-bg:#f1e0dd;
    --cd-idle:#9aa394; --cd-radius:18px; --cd-shadow:0 1px 2px rgba(45,50,43,.06);
    --cd-font-display:"Fraunces", Georgia, serif;
    color-scheme: light;
}
html[data-cd-style="bold"] {
    --cd-bg:#0b0d10; --cd-surface:#14181d; --cd-surface-2:#1a1f26; --cd-ink:#f4f6f8; --cd-ink-soft:#9aa6b2;
    --cd-faint:#64707c; --cd-line:#242b33; --cd-line-strong:#2f3843;
    --cd-brand:#4f7bff; --cd-brand-600:#3d63d8; --cd-brand-soft:#17233f; --cd-accent:#4f7bff; --cd-on-brand:#ffffff;
    --cd-ok:#2fd27a; --cd-ok-dot:#2fd27a; --cd-ok-bg:#0f3324;
    --cd-warn:#ffb020; --cd-warn-dot:#ffb020; --cd-warn-bg:#3a2b0c;
    --cd-crit:#ff5c5c; --cd-crit-dot:#ff5c5c; --cd-crit-bg:#3a1818;
    --cd-idle:#64707c; --cd-radius:10px; --cd-shadow:0 10px 30px rgba(0,0,0,.45);
    --cd-font-display:"Sora", system-ui, sans-serif;
    color-scheme: dark;
}
h1, h2, h3 { font-family: var(--cd-font-display); }

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: var(--cd-font);
    color: var(--cd-ink);
    background: var(--cd-bg);
    font-size: var(--cd-fs-base);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

h1 { font-size: var(--cd-fs-h1); font-weight: 700; letter-spacing: -.02em; margin: 0 0 1rem; }
h2 { font-size: var(--cd-fs-h2); font-weight: 650; margin: 1.6rem 0 .7rem; letter-spacing: -.01em; }
h3 { font-size: 1rem; font-weight: 600; margin: 1.25rem 0 .5rem; }
a { color: var(--cd-brand); text-decoration: none; }
a:hover { text-decoration: underline; }
code { font-family: "Cascadia Code", "Consolas", monospace; font-size: .86em;
       background: var(--cd-surface-2); padding: .1em .4em; border-radius: 4px; color: var(--cd-ink-soft); }
p { color: var(--cd-ink); }

/* ── Estrutura: barra de topo + navegação + conteúdo ── */
.cd-shell { min-height: 100vh; display: flex; flex-direction: column; background: var(--cd-bg); }
.cd-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.cd-topbar {
    background: var(--cd-surface); border-bottom: 1px solid var(--cd-line);
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 11px var(--cd-gutter); position: sticky; top: 0; z-index: 10; flex-wrap: wrap;
}
.cd-topbar .cd-user { color: var(--cd-ink-soft); font-size: var(--cd-fs-sm);
    display: flex; align-items: center; gap: .8rem; }

.cd-topnav {
    background: var(--cd-surface); border-bottom: 1px solid var(--cd-line);
    display: flex; gap: 2px; padding: 0 var(--cd-gutter); overflow-x: auto;
}
.cd-topnav a {
    display: inline-flex; align-items: center; gap: .5rem; padding: 12px 12px;
    font-size: var(--cd-fs-base); font-weight: 500; color: var(--cd-ink-soft);
    border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; text-decoration: none;
}
.cd-topnav a:hover { color: var(--cd-ink); text-decoration: none; }
.cd-topnav a.active { color: var(--cd-ink); border-bottom-color: var(--cd-brand); font-weight: 600; }

.cd-content { max-width: 1080px; width: 100%; margin: 0 auto; padding: clamp(18px,4vw,28px) var(--cd-gutter); }

/* ── Marca ── */
.cd-brand { display: flex; align-items: center; gap: .55rem; font-size: var(--cd-fs-base);
    font-weight: 600; color: var(--cd-ink); letter-spacing: -.01em; }
.cd-brand-mark { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center;
    background: var(--cd-brand-soft); font-size: 1rem; flex: 0 0 auto; }

/* ── Cartões ── */
.cd-card {
    background: var(--cd-surface); border: 1px solid var(--cd-line); border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow); padding: 1.2rem 1.3rem; margin-bottom: 1.1rem;
}
.cd-card > h2:first-child, .cd-card > h3:first-child { margin-top: 0; }
.cd-muted { color: var(--cd-ink-soft); }
.cd-toolbar { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-bottom: 1rem; }

/* ── Tabelas (também apanha <table> nu das páginas existentes) ── */
table, .cd-table {
    width: 100%; border-collapse: collapse; background: var(--cd-surface);
    border: 1px solid var(--cd-line); border-radius: var(--cd-radius); overflow: hidden;
}
thead tr { background: var(--cd-surface-2); }
th { text-align: left; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em;
     color: var(--cd-ink-soft); font-weight: 600; padding: .7rem .85rem; border-bottom: 1px solid var(--cd-line); }
td { padding: .7rem .85rem; border-bottom: 1px solid var(--cd-line); vertical-align: top; }
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover { background: var(--cd-surface-2); }

/* ── Botões (também apanha <button> nu) ── */
button, .cd-btn {
    font-family: inherit; font-size: var(--cd-fs-sm); font-weight: 600; cursor: pointer;
    background: var(--cd-brand); color: var(--cd-on-brand); border: 1px solid transparent;
    padding: .55rem .9rem; border-radius: 9px; transition: background .12s, box-shadow .12s;
}
button:hover, .cd-btn:hover { background: var(--cd-brand-600); }
button:disabled { opacity: .5; cursor: not-allowed; }
.cd-btn-ghost { background: var(--cd-surface); color: var(--cd-ink); border-color: var(--cd-line-strong); }
.cd-btn-ghost:hover { background: var(--cd-surface-2); }
.cd-btn-danger { background: var(--cd-crit); }
.cd-btn-danger:hover { background: #a93226; }
.cd-btn-primary { background: var(--cd-brand); }
.cd-btn-primary:hover { background: var(--cd-brand-600); }
a.cd-btn { display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; }
a.cd-btn:hover { text-decoration: none; }

.cd-input {
    font-family: inherit; font-size: var(--cd-fs-base); color: var(--cd-ink);
    background: var(--cd-surface); border: 1px solid var(--cd-line-strong);
    border-radius: 10px; padding: .6rem .7rem; width: 100%;
}
.cd-input:focus { outline: none; border-color: var(--cd-brand); box-shadow: 0 0 0 3px var(--cd-brand-soft); }

.cd-langbar { position: fixed; top: 1rem; right: 1rem; z-index: 50; display: flex; gap: .1rem;
    border: 1px solid var(--cd-line-strong); border-radius: 999px; padding: .15rem; background: var(--cd-surface); }
/* Na área de cliente (que tem topbar própria), a barra flutuante colidia com o "Terminar sessão".
   Esconde-se a flutuante e usa-se a variante inline dentro da topbar. */
.cd-langbar:has(+ .cd-shell) { display: none; }
.cd-langbar-inline { position: static; top: auto; right: auto; z-index: auto; border: 1px solid var(--cd-line); }
.cd-langbtn { font: 600 .72rem/1 "IBM Plex Mono", monospace; letter-spacing: .04em; padding: .3rem .55rem;
    border-radius: 999px; text-decoration: none; color: var(--cd-ink-soft); }
.cd-langbtn:hover { color: var(--cd-ink); text-decoration: none; }
.cd-langbtn.active { color: var(--cd-on-brand); background: var(--cd-brand); }

/* ── Inputs (também apanha os nus) ── */
input, select, textarea {
    font-family: inherit; font-size: var(--cd-fs-base); color: var(--cd-ink); background: var(--cd-surface);
    border: 1px solid var(--cd-line-strong); border-radius: 10px; padding: .55rem .7rem;
}
input:focus, select:focus, textarea:focus {
    outline: none; border-color: var(--cd-brand); box-shadow: 0 0 0 3px var(--cd-brand-soft);
}

/* ── Badges / semáforos ── */
.cd-badge { display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .6rem;
    border-radius: 999px; font-size: var(--cd-fs-xs); font-weight: 600; white-space: nowrap; }
.cd-badge-ok   { background: var(--cd-ok-bg);   color: var(--cd-ok); }
.cd-badge-warn { background: var(--cd-warn-bg); color: var(--cd-warn); }
.cd-badge-crit { background: var(--cd-crit-bg); color: var(--cd-crit); }
.cd-badge-idle { background: var(--cd-surface-2); color: var(--cd-ink-soft); }
.cd-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; flex: 0 0 auto; }
.cd-dot-ok { background: var(--cd-ok-dot); } .cd-dot-warn { background: var(--cd-warn-dot); }
.cd-dot-crit { background: var(--cd-crit-dot); } .cd-dot-idle { background: var(--cd-idle); }

/* ── Utilidades de layout (formulários e linhas de cartões) ── */
.cd-row { display: flex; flex-wrap: wrap; gap: 1.1rem; align-items: flex-start; }
.cd-row > .cd-card { flex: 1 1 300px; margin: 0; }
.cd-stack { display: flex; flex-direction: column; gap: .6rem; }
.cd-stack > input, .cd-stack > select { width: 100%; }
.cd-selectable { user-select: all; }

/* ── Frota / listas de estado (resumo + mosaicos + cartões) ── */
.cd-summary { display: flex; align-items: center; gap: 11px; margin-bottom: 20px; flex-wrap: wrap; }
.cd-summary-badge { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px;
    border-radius: 50%; flex: 0 0 auto; }
.cd-summary-badge.ok   { background: var(--cd-ok-bg);   color: var(--cd-ok); }
.cd-summary-badge.warn { background: var(--cd-warn-bg); color: var(--cd-warn); }
.cd-summary-badge.crit { background: var(--cd-crit-bg); color: var(--cd-crit); }
.cd-summary-title { font-size: var(--cd-fs-h1); font-weight: 650; letter-spacing: -.01em; }
.cd-summary-sub { font-size: var(--cd-fs-sm); color: var(--cd-ink-soft); }

.cd-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,150px),1fr));
    gap: 12px; margin-bottom: 24px; }
.cd-tile { background: var(--cd-surface); border: 1px solid var(--cd-line); border-radius: var(--cd-radius);
    padding: 15px 16px; box-shadow: var(--cd-shadow); }
.cd-tile .k { font-size: var(--cd-fs-sm); color: var(--cd-ink-soft); font-weight: 500; margin-bottom: 6px; }
.cd-tile .v { font-size: clamp(21px,5vw,27px); font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }
.cd-tile .v small { font-size: .56em; font-weight: 500; color: var(--cd-faint); }

.cd-section-h { display: flex; align-items: center; justify-content: space-between; margin: 0 2px 11px; }
.cd-section-h h2 { font-size: var(--cd-fs-xs); font-weight: 600; color: var(--cd-ink-soft);
    text-transform: uppercase; letter-spacing: .05em; margin: 0; }

.cd-list { background: var(--cd-surface); border: 1px solid var(--cd-line); border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow); overflow: hidden; }
.cd-litem { display: flex; align-items: center; gap: 13px; padding: 14px 16px;
    border-top: 1px solid var(--cd-line); cursor: pointer; color: var(--cd-ink); text-decoration: none; }
.cd-litem:first-child { border-top: 0; }
.cd-litem:hover { background: var(--cd-surface-2); text-decoration: none; }
.cd-litem-main { flex: 1; min-width: 0; }
.cd-litem-title { font-size: var(--cd-fs-base); font-weight: 600; letter-spacing: -.01em; }
.cd-litem-sub { font-size: var(--cd-fs-sm); color: var(--cd-ink-soft); margin-top: 2px; }
.cd-replica { display: none; align-items: center; gap: 5px; font-size: var(--cd-fs-sm);
    color: var(--cd-ink-soft); white-space: nowrap; }
.cd-replica svg { color: var(--cd-ok-dot); }
.cd-chev { color: var(--cd-faint); flex: 0 0 auto; }
@media (min-width: 640px) { .cd-replica { display: inline-flex; } }

/* ── Login ── */
.cd-login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: var(--cd-bg); padding: 28px var(--cd-gutter); }
.cd-login-card { width: 100%; max-width: 380px; background: var(--cd-surface);
    border: 1px solid var(--cd-line); border-radius: 16px; box-shadow: 0 4px 24px rgba(16,24,40,.06);
    padding: clamp(20px,6vw,28px); }
.cd-login-brand { display: flex; align-items: center; gap: .6rem; font-size: var(--cd-fs-h1); font-weight: 700;
    color: var(--cd-ink); margin-bottom: .35rem; }
.cd-login-card label { display: block; font-size: var(--cd-fs-sm); font-weight: 600; color: var(--cd-ink);
    margin: .9rem 0 .35rem; }
.cd-login-card input { width: 100%; }
.cd-login-card button { width: 100%; margin-top: 1.25rem; padding: .7rem; }
.cd-login-err { background: var(--cd-crit-bg); color: var(--cd-crit); border-radius: 10px; padding: .55rem .7rem;
    font-size: .87rem; margin-top: .9rem; }

.cd-alert-line { padding: .7rem .9rem; border-radius: 10px; margin: .5rem 0; font-size: .9rem; }
.cd-alert-crit { background: var(--cd-crit-bg); color: var(--cd-crit); border-left: 3px solid var(--cd-crit); }
.cd-alert-warn { background: var(--cd-warn-bg); color: var(--cd-warn); border-left: 3px solid var(--cd-warn-dot); }
.cd-alert-info { background: var(--cd-brand-soft); color: var(--cd-ink); border-left: 3px solid var(--cd-brand); }

/* ---- Área de cliente: master-detail (acordeão + detalhe) ---- */
.cd-md { display: flex; gap: 1.2rem; margin-top: 1rem; align-items: flex-start; }
.cd-md-nav { flex: 0 0 260px; max-width: 260px; background: var(--cd-surface); border: 1px solid var(--cd-line); border-radius: 12px; padding: .8rem; }
.cd-md-detail { flex: 1 1 auto; min-width: 0; }
.cd-md-company { font-weight: 700; font-size: 1.1rem; margin-bottom: .4rem; color: var(--cd-ink); }
.cd-acc-h { display: flex; align-items: center; gap: .4rem; width: 100%; text-align: left; background: transparent; color: var(--cd-ink); border: none; padding: .5rem .2rem; font-weight: 600; cursor: pointer; }
.cd-acc-h:hover { background: var(--cd-surface-2); }
.cd-acc-item { display: flex; align-items: center; gap: .5rem; width: 100%; text-align: left; background: transparent; color: var(--cd-ink); border: none; border-radius: 8px; padding: .4rem .6rem .4rem 1.4rem; cursor: pointer; font-size: .92rem; }
.cd-acc-item:hover { background: var(--cd-surface-2); }
.cd-acc-item.sel { background: var(--cd-brand); color: var(--cd-on-brand); }
.cd-acc-add { width: calc(100% - 1.2rem); text-align: left; background: transparent; color: var(--cd-brand); border: 1px dashed var(--cd-line-strong); border-radius: 8px; padding: .35rem .6rem; margin: .3rem 0 .3rem 1.2rem; cursor: pointer; font-size: .85rem; }
.cd-acc-add:hover { background: var(--cd-surface-2); }
.cd-events { border: 1px solid var(--cd-line); border-radius: 10px; max-height: 340px; overflow-y: auto; }
.cd-ev { display: flex; gap: .7rem; align-items: baseline; padding: .4rem .7rem; border-bottom: 1px solid var(--cd-line); font-size: .86rem; }
.cd-ev:last-child { border-bottom: none; }
.cd-ev-when { color: var(--cd-ink-soft); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cd-ev-kind { font-weight: 600; text-transform: uppercase; font-size: .72rem; letter-spacing: .03em; padding: .05rem .4rem; border-radius: 4px; white-space: nowrap; }
.cd-ev-kind.ev-ok { background: var(--cd-ok-bg); color: var(--cd-ok); }
.cd-ev-kind.ev-warn { background: var(--cd-warn-bg); color: var(--cd-warn); }
.cd-ev-kind.ev-crit { background: var(--cd-crit-bg); color: var(--cd-crit); }
.cd-ev-kind.ev-info { background: var(--cd-surface-2); color: var(--cd-ink-soft); }
.cd-ev-text { color: var(--cd-ink); word-break: break-word; }
textarea.cd-input { resize: vertical; font-family: inherit; }
@media (max-width: 760px) {
    .cd-md { flex-direction: column; }
    .cd-md-nav { flex-basis: auto; max-width: none; width: 100%; }
}

/* Botão que parece uma ligação (ex.: "Terminar sessão" em POST com token antiforgery). */
.cd-linklike { background: none; border: 0; padding: 0; font: inherit; color: var(--cd-ink-soft); cursor: pointer; text-decoration: underline; }
.cd-linklike:hover { background: none; color: var(--cd-ink); }

/* ── Menu de contexto (kebab ⋮) numa linha de grelha ──────────────────────── */
.cd-kebab-wrap { position: relative; display: inline-block; }
.cd-kebab { background: none; border: 1px solid transparent; border-radius: 8px; padding: .15rem .5rem;
            font-size: 1.15rem; line-height: 1; color: var(--cd-ink-soft); cursor: pointer; }
.cd-kebab:hover { background: var(--cd-surface-2); border-color: var(--cd-line); color: var(--cd-ink); }
.cd-menu { position: fixed; z-index: 200; min-width: 210px;
           background: var(--cd-surface); border: 1px solid var(--cd-line); border-radius: var(--cd-radius);
           box-shadow: 0 8px 28px rgba(16,32,48,.18); padding: .35rem; }
.cd-menu button, .cd-menu a { display: flex; align-items: center; gap: .5rem; width: 100%; text-align: left;
           background: none; border: 0; border-radius: 8px; padding: .5rem .6rem; font: inherit; font-size: .9rem;
           color: var(--cd-ink); cursor: pointer; text-decoration: none; }
.cd-menu button:hover, .cd-menu a:hover { background: var(--cd-surface-2); text-decoration: none; }
.cd-menu button.cd-menu-danger { color: var(--cd-crit); }
.cd-menu button.cd-menu-danger:hover { background: var(--cd-crit-bg); }
.cd-menu-sep { height: 1px; background: var(--cd-line); margin: .3rem 0; }
/* clique fora fecha o menu / modal */
.cd-scrim { position: fixed; inset: 0; z-index: 150; background: transparent; }
/* contentores roláveis dentro dos modais (grelhas grandes, listas de eventos) */
.cd-scroll-grid { max-height: 46vh; overflow: auto; border: 1px solid var(--cd-line); border-radius: var(--cd-radius); }
.cd-scroll-grid table { margin: 0; }
.cd-scroll-box { max-height: 260px; overflow: auto; }

/* ── Modal (popup) ────────────────────────────────────────────────────────── */
.cd-modal-overlay { position: fixed; inset: 0; z-index: 100; background: rgba(16,32,48,.35);
           display: flex; align-items: flex-start; justify-content: center; padding: 3rem 1rem; overflow-y: auto; }
.cd-modal { background: var(--cd-surface); border-radius: 16px; box-shadow: 0 12px 48px rgba(16,32,48,.22);
           width: 100%; max-width: 760px; max-height: 88vh; overflow-y: auto; }
.cd-modal-lg { max-width: 1040px; }
.cd-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
           padding: 1.1rem 1.4rem; border-bottom: 1px solid var(--cd-line); position: sticky; top: 0;
           background: var(--cd-surface); border-radius: 16px 16px 0 0; }
.cd-modal-head h2, .cd-modal-head h3 { margin: 0; }
.cd-modal-body { padding: 1.2rem 1.4rem; }
.cd-modal-close { background: none; border: 0; font-size: 1.4rem; line-height: 1; color: var(--cd-ink-soft);
           cursor: pointer; padding: .1rem .4rem; border-radius: 8px; }
.cd-modal-close:hover { background: var(--cd-surface-2); color: var(--cd-ink); }

/* ── Gráficos de espaço (Frota) — herdam os tokens do tema escolhido ── */
.cd-space { display: grid; grid-template-columns: 1fr 1fr; gap: var(--cd-gutter); margin-bottom: 1rem; }
.cd-space-card h3 { margin: 0 0 .9rem; font-size: var(--cd-fs-h2); }
.cd-donut-wrap { display: flex; gap: 1.1rem; align-items: center; flex-wrap: wrap; }
.cd-donut { width: 132px; height: 132px; border-radius: 50%; position: relative; flex: 0 0 auto; }
.cd-donut-hole { position: absolute; inset: 19px; border-radius: 50%; background: var(--cd-surface);
    display: flex; flex-direction: column; align-items: center; justify-content: center; }
.cd-donut-tot { font-family: var(--cd-font-display); font-weight: 700; font-size: 1.5rem; line-height: 1;
    font-variant-numeric: tabular-nums; color: var(--cd-ink); }
.cd-donut-lab { font-size: .68rem; color: var(--cd-faint); margin-top: 2px; }
.cd-legend { display: flex; flex-direction: column; gap: .55rem; min-width: 0; flex: 1; }
.cd-legend-row { display: flex; align-items: center; gap: .5rem; font-size: var(--cd-fs-sm); }
.cd-legend-k { width: 11px; height: 11px; border-radius: 3px; flex: 0 0 auto; }
.cd-legend-v { margin-left: auto; color: var(--cd-ink-soft); font-variant-numeric: tabular-nums; }
.cd-bars { display: flex; flex-direction: column; gap: .8rem; }
.cd-bar-t { display: flex; justify-content: space-between; gap: .5rem; font-size: var(--cd-fs-sm); margin-bottom: .3rem; }
.cd-bar-t span { color: var(--cd-ink-soft); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cd-bar-track { height: 10px; border-radius: 999px; background: var(--cd-surface-2); border: 1px solid var(--cd-line); overflow: hidden; }
.cd-bar-fill { height: 100%; border-radius: 999px; background: var(--cd-brand); }
.cd-bar-fill.warn { background: var(--cd-warn-dot); }
.cd-bar-fill.crit { background: var(--cd-crit-dot); }
@media (max-width: 720px) { .cd-space { grid-template-columns: 1fr; } }

/* ── Lista de alertas (detalhe do cofre): data+nível numa linha, mensagem por baixo ── */
.cd-alerts { display: flex; flex-direction: column; }
.cd-alert-item { padding: .7rem 1rem; border-bottom: 1px solid var(--cd-line); }
.cd-alert-item:last-child { border-bottom: 0; }
.cd-alert-head { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.cd-alert-when { color: var(--cd-ink-soft); font-size: var(--cd-fs-sm); font-variant-numeric: tabular-nums; }
.cd-alert-msg { margin-top: .3rem; color: var(--cd-ink); line-height: 1.45; }
