/* Formulários FM — estilos base.
   Cores em variáveis: as de marca (--color-*) vêm de system_settings, injetadas
   no layout; as de interface trocam junto com o tema claro/escuro (ver abaixo). */
:root{
    color-scheme: light;
    --bg: #f4f6f8;
    --surface: #ffffff;
    --surface-2: #f1f3f5;      /* fundo secundário: hover de linha, cabeçalho de tabela */
    --text: #1c2733;
    --muted: #6b7785;
    --border: #e2e8f0;
    --danger: #c0392b;
    --success: #2e7d46;
    /* Estados (aviso/erro/sucesso/informação): fundo + texto legível em cada tema */
    --danger-bg: #fdecea;
    --danger-border: #f5c6cb;
    --success-bg: #eaf6ee;
    --success-border: #bfe3c9;
    --warn-bg: #fff4e0;
    --warn-border: #ffe1a6;
    --warn-text: #b7791f;
    --info-bg: #eef4f9;
    --info-border: #d6e4f0;
    --radius: 12px;
    --shadow: 0 1px 3px rgba(16,24,40,.08), 0 1px 2px rgba(16,24,40,.06);
}

/* ---- Tema escuro ----------------------------------------------------------
   Duas portas de entrada:
   1. o sistema operacional/navegador pede escuro (prefers-color-scheme) e o
      usuário NÃO escolheu claro manualmente;
   2. o usuário escolheu escuro no botão (data-theme="dark" no <html>).
   Só as variáveis mudam — nenhum componente precisa saber que existe tema. */
@media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
        color-scheme: dark;
        --bg: #12171d;
        --surface: #1a2129;
        --surface-2: #232c36;
        --text: #e6edf3;
        --muted: #9aa7b4;
        --border: #2d3843;
        --danger: #ff6b5e;
        --success: #4ac97e;
        --danger-bg: #3a1f1d;
        --danger-border: #5c2f2b;
        --success-bg: #16301f;
        --success-border: #24552f;
        --warn-bg: #3a2f1a;
        --warn-border: #5c4a25;
        --warn-text: #e0b062;
        --info-bg: #1b2a38;
        --info-border: #2b4257;
        --shadow: 0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);
    }
}
:root[data-theme="dark"]{
    color-scheme: dark;
    --bg: #12171d;
    --surface: #1a2129;
    --surface-2: #232c36;
    --text: #e6edf3;
    --muted: #9aa7b4;
    --border: #2d3843;
    --danger: #ff6b5e;
    --success: #4ac97e;
    --danger-bg: #3a1f1d;
    --danger-border: #5c2f2b;
    --success-bg: #16301f;
    --success-border: #24552f;
    --warn-bg: #3a2f1a;
    --warn-border: #5c4a25;
    --warn-text: #e0b062;
    --info-bg: #1b2a38;
    --info-border: #2b4257;
    --shadow: 0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);
}
*{ box-sizing: border-box; }
html,body{ margin:0; padding:0; }
body{
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: var(--bg); color: var(--text); line-height: 1.5;
}
a{ color: var(--color-secondary, #2e6f95); text-decoration: none; }
a:hover{ text-decoration: underline; }
.muted{ color: var(--muted); }
.small{ font-size:.85rem; }

/* ---- Layout autenticado ---- */
.topbar{
    display:flex; align-items:center; justify-content:space-between;
    background: var(--color-primary, #1f3b57); color:#fff;
    padding: .75rem 1.25rem;
}
.brand{ display:flex; align-items:center; gap:.6rem; color:#fff; font-weight:600; }
.brand:hover{ text-decoration:none; }
.brand-logo{ height:28px; }
.topnav{ display:flex; align-items:center; gap:1rem; }
.user-badge{ font-size:.9rem; opacity:.9; }
.btn-link{ background:none; border:none; color:#fff; cursor:pointer; text-decoration:underline; font:inherit; }
.inline{ display:inline; margin:0; }
.content{ max-width: 960px; margin: 1.5rem auto; padding: 0 1rem; }
.footer{ text-align:center; color:var(--muted); padding: 2rem 0; }

/* ---- Flash ---- */
.flash{ max-width:960px; margin: .75rem auto; padding:.75rem 1rem; border-radius:8px; }
.flash-error{ background:var(--danger-bg); color:var(--danger); border:1px solid var(--danger-border); }
.flash-success{ background:var(--success-bg); color:var(--success); border:1px solid var(--success-border); }

/* ---- Cards ---- */
.card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:1.5rem; }

/* Orçamento (seção 7.3-A): item de cotação na tela da solicitação, e o selo do
   fornecedor que a Diretoria escolheu. */
.quote-item{ padding:.7rem 0; border-bottom:1px solid var(--border); }
.quote-item:last-child{ border-bottom:none; }
.badge-selected{ display:inline-block; font-size:.72rem; font-weight:700; text-transform:uppercase;
    letter-spacing:.3px; color:var(--success); background:var(--success-bg); border:1px solid var(--success-border);
    border-radius:999px; padding:.15rem .55rem; margin-bottom:.35rem; }
.quote-choice{ display:flex; align-items:flex-start; gap:.5rem; font-weight:normal; padding:.5rem .6rem;
    border:1px solid var(--border); border-radius:8px; margin-bottom:.4rem; cursor:pointer; }
.quote-choice input{ margin-top:.2rem; }
.center-card{ max-width:420px; margin:3rem auto; text-align:center; }

/* ---- Login ---- */
.guest{ display:flex; min-height:100vh; align-items:center; justify-content:center; }
.auth-wrap{ width:100%; max-width:400px; padding:1rem; }
.auth-card{ }
.auth-head{ text-align:center; margin-bottom:1.25rem; }
.auth-head h1{ margin:.25rem 0; font-size:1.4rem; color:var(--color-primary, #1f3b57); }
.auth-logo{ max-height:56px; margin-bottom:.5rem; }

/* ---- Formulários ---- */
.form label{ display:block; margin-bottom:1rem; }
.form label > span{ display:block; margin-bottom:.3rem; font-weight:500; font-size:.9rem; }
.form input, .form select, .form textarea{
    width:100%; padding:.6rem .7rem; border:1px solid var(--border); border-radius:8px; font:inherit;
    background:var(--surface); color:var(--text);
}
.form input:focus, .form select:focus, .form textarea:focus{
    outline:none; border-color:var(--color-secondary, #2e6f95); box-shadow:0 0 0 3px rgba(46,111,149,.15);
}

/* ---- Botões ---- */
.btn{ display:inline-block; padding:.6rem 1.1rem; border-radius:8px; border:1px solid transparent; cursor:pointer; font:inherit; font-weight:500; }
.btn:hover{ text-decoration:none; }
.btn-primary{ background:var(--color-secondary, #2e6f95); color:#fff; }
.btn-primary:hover{ filter:brightness(.95); }
.btn-ghost{ background:transparent; border-color:var(--border); color:var(--text); }
.btn-block{ width:100%; }

/* ---- Hub ---- */
.hub-head{ margin-bottom:1.25rem; }
.grid-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:1rem; }
.form-card{ display:flex; flex-direction:column; gap:.35rem; text-align:center; align-items:center; color:var(--text); transition:transform .08s ease, box-shadow .08s ease; }
.form-card:hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(16,24,40,.12); text-decoration:none; }
.form-icon{ font-size:2rem; }
.form-name{ font-weight:600; }
.hub-links{ display:flex; gap:.75rem; margin-top:1.5rem; flex-wrap:wrap; }

/* ---- Solicitações ---- */
.back-link{ display:inline-block; margin-bottom:.75rem; color:var(--muted); }
.form-page h1, .detail-head h1, .list-page h1{ margin:.2rem 0 1rem; font-size:1.4rem; }
.form-page .form{ display:block; }
.field{ display:block; margin-bottom:1.1rem; }
.field > span:first-child{ display:block; margin-bottom:.3rem; font-weight:500; }
.field .help{ display:block; margin-bottom:.35rem; }
.req{ color:var(--danger); }
.radio-row{ display:flex; gap:1.25rem; flex-wrap:wrap; padding-top:.2rem; }
.radio{ display:inline-flex; align-items:center; gap:.35rem; font-weight:400; }
.radio input{ width:auto; }
.form-actions{ display:flex; gap:.75rem; margin-top:1rem; }
.notice{ background:var(--info-bg); border:1px solid var(--info-border); border-radius:8px; padding:.85rem 1rem; margin-bottom:1.25rem; }
.notice-warn{ background:var(--warn-bg); border-color:var(--warn-border); }
.mini-table{ border-collapse:collapse; margin-top:.5rem; width:100%; max-width:420px; }
.mini-table th, .mini-table td{ border:1px solid var(--border); padding:.3rem .5rem; text-align:left; font-size:.9rem; }

/* ---- Detalhe ---- */
.detail-head{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.detail h2{ font-size:1.05rem; margin:1.5rem 0 .5rem; }
.status-pill{ background:var(--color-primary,#1f3b57); color:#fff; padding:.3rem .75rem; border-radius:999px; font-size:.85rem; white-space:nowrap; }
.kv{ display:grid; grid-template-columns:minmax(140px,220px) 1fr; gap:.4rem 1rem; margin:0; }
.kv dt{ color:var(--muted); }
.kv dd{ margin:0; }
.timeline{ list-style:none; margin:0; padding:0; }
.timeline li{ padding:.6rem 0; border-bottom:1px solid var(--border); display:flex; flex-direction:column; gap:.15rem; }
.timeline li:last-child{ border-bottom:none; }
.tl-when{ color:var(--muted); font-size:.82rem; }
.tl-comment{ background:var(--bg); border-radius:6px; padding:.4rem .6rem; font-size:.9rem; }

/* ---- Listagem ---- */
.tabs{ display:flex; gap:.25rem; flex-wrap:wrap; border-bottom:1px solid var(--border); margin-bottom:.75rem; }
.tab{ padding:.5rem .85rem; color:var(--muted); border-bottom:2px solid transparent; }
.tab.active{ color:var(--text); border-bottom-color:var(--color-secondary,#2e6f95); font-weight:600; }
.tab:hover{ text-decoration:none; }
.order-bar{ font-size:.9rem; color:var(--muted); margin-bottom:1rem; }
.order-bar a.active{ font-weight:600; color:var(--text); }
.data-table{ width:100%; border-collapse:collapse; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; }
.data-table th, .data-table td{ padding:.65rem .8rem; text-align:left; border-bottom:1px solid var(--border); font-size:.92rem; }
.data-table thead th{ background:var(--bg); color:var(--muted); font-weight:600; }
.data-table tr.clickable{ cursor:pointer; }
.data-table tr.clickable:hover{ background:var(--surface-2); }
.urg{ font-size:.78rem; padding:.15rem .5rem; border-radius:999px; }
.urg-urgente{ background:var(--danger-bg); color:var(--danger); }
.urg-medio{ background:var(--warn-bg); color:var(--warn-text); }
.urg-normal{ background:var(--surface-2); color:var(--muted); }

/* ---- Painel de ações (decisão) ---- */
.action-panel .row-2{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.action-buttons{ display:flex; gap:.75rem; align-items:flex-start; flex-wrap:wrap; }
.inline-block{ display:inline-block; margin:0; }
.btn-danger{ background:var(--danger); color:#fff; }
.btn-danger:hover{ filter:brightness(.95); }
.action-detail{ position:relative; }
.action-detail > summary{ list-style:none; cursor:pointer; display:inline-block; }
.action-detail > summary::-webkit-details-marker{ display:none; }
.action-detail[open] > summary{ margin-bottom:.5rem; }
.action-detail .form.mt{ margin-top:.25rem; min-width:min(340px,90vw); background:var(--bg); padding:1rem; border-radius:10px; }
@media (max-width:560px){ .action-panel .row-2{ grid-template-columns:1fr; } }

/* ---- Retorno / correção ---- */
.mt0{ margin-top:0; }
.return-box{ border-left:4px solid var(--color-accent,#d9a441); }
.return-msg{ background:var(--bg); padding:.6rem .8rem; border-radius:8px; margin:.5rem 0; }
.row-returned{ background:#fff7f2; }
.row-returned:hover{ background:#ffeee4 !important; }
.badge-return{ display:inline-block; background:var(--danger); color:#fff; font-size:.68rem; font-weight:600; padding:.1rem .45rem; border-radius:999px; margin-right:.4rem; vertical-align:middle; }

/* ---- Order bar como pills ---- */
.order-bar{ display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.order-bar > span{ color:var(--muted); }
.order-bar a{ padding:.3rem .7rem; border:1px solid var(--border); border-radius:999px; color:var(--muted); font-size:.85rem; }
.order-bar a.active{ background:var(--color-secondary,#2e6f95); border-color:var(--color-secondary,#2e6f95); color:#fff; }
.order-bar a:hover{ text-decoration:none; }

/* ---- Tabelas roláveis (não estouram a largura no celular) ---- */
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:var(--radius); }
.table-scroll .data-table{ min-width:560px; }

/* ============================================================
   RESPONSIVO — celulares (<=640px)
   ============================================================ */
@media (max-width:640px){
    .content{ margin:1rem auto; padding:0 .8rem; }
    .topbar{ padding:.6rem .9rem; }
    .brand span{ font-size:.95rem; }
    .user-badge{ max-width:38vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block; vertical-align:middle; }

    /* Abas rolam na horizontal em vez de quebrar */
    .tabs{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; }
    .tab{ white-space:nowrap; }

    /* Chave/valor empilha */
    .kv{ grid-template-columns:1fr; gap:.15rem .5rem; }
    .kv dt{ margin-top:.5rem; }
    .kv dd{ margin:0 0 .3rem; }

    /* Botões e ações ocupam a largura, alvos maiores para o dedo */
    .form-actions{ flex-direction:column; }
    .form-actions .btn{ width:100%; text-align:center; }
    .btn{ padding:.7rem 1.1rem; }
    .action-buttons{ flex-direction:column; align-items:stretch; }
    .action-buttons > form, .action-buttons .action-detail{ width:100%; }
    .action-buttons .btn, .action-detail > summary{ width:100%; text-align:center; }
    .action-detail .form.mt{ min-width:0; width:100%; }

    .detail-head h1, .form-page h1, .list-page h1{ font-size:1.2rem; }
    h1{ font-size:1.3rem; }
}
@media (max-width:400px){
    .grid-cards{ grid-template-columns:1fr 1fr; }
}

/* ---- Filtros (Diretoria) ---- */
.filters{ display:flex; flex-wrap:wrap; gap:1rem; align-items:flex-end; justify-content:space-between; margin:.5rem 0 1rem; }
.filter-form{ display:flex; gap:.75rem; flex-wrap:wrap; margin:0; }
.filter-field{ display:flex; flex-direction:column; gap:.25rem; }
.filter-field > span{ font-size:.8rem; color:var(--muted); }
.filter-field select{ padding:.5rem .6rem; border:1px solid var(--border); border-radius:8px; font:inherit; background:#fff; }
.row-urgent{ box-shadow:inset 3px 0 0 var(--danger); }
@media (max-width:640px){
    .filters{ flex-direction:column; align-items:stretch; }
    .filter-form{ flex-direction:column; }
    .filter-field select{ width:100%; }
}

/* ---- Busca no topo ---- */
.search-box{ display:flex; align-items:center; background:rgba(255,255,255,.15); border-radius:999px; overflow:hidden; margin:0; }
.search-box input{ border:none; background:transparent; color:#fff; padding:.35rem .7rem; font:inherit; width:120px; outline:none; }
.search-box input::placeholder{ color:rgba(255,255,255,.7); }
.search-box button{ border:none; background:transparent; color:#fff; cursor:pointer; padding:.3rem .6rem; }

/* ---- Botões pequenos / ações do detalhe ---- */
.btn-sm{ padding:.3rem .6rem; font-size:.8rem; }
.detail-actions{ display:flex; justify-content:flex-end; margin:-.25rem 0 .75rem; }

@media (max-width:640px){
    .search-box input{ width:84px; }
    .topnav{ gap:.5rem; }
    .detail-actions{ justify-content:stretch; }
    .detail-actions .btn{ width:100%; text-align:center; }
}

/* ---- Box de recusa ---- */
.reject-box{ border-left:4px solid var(--danger); }
.reject-msg{ background:#fdecea; color:#7a2018; padding:.6rem .8rem; border-radius:8px; margin:.3rem 0 0; }

/* ---- Lista de anexos ---- */
.attach-list{ list-style:none; margin:0; padding:0; }
.attach-list li{ padding:.4rem 0; border-bottom:1px solid var(--border); display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.attach-list li:last-child{ border-bottom:none; }
.attach-list input[type=file]{ width:100%; }

/* ---- Resumo de aprovações ---- */
.approvals-box{ display:flex; flex-direction:column; gap:.4rem; }
.appr{ font-size:.95rem; }
.appr-ok{ color:var(--success); }
.appr-wait{ color:var(--muted); }
.appr strong{ color:var(--text); }

/* ---- Master-Cadastro ---- */
.list-head{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; }
.list-head h1{ margin:0; }
.badge-on{ background:var(--success-bg); color:var(--success); font-size:.78rem; padding:.15rem .5rem; border-radius:999px; }
.badge-off{ background:var(--surface-2); color:var(--muted); font-size:.78rem; padding:.15rem .5rem; border-radius:999px; }
.badge-warn{ background:var(--warn-bg); color:var(--warn-text); font-size:.78rem; padding:.15rem .5rem; border-radius:999px; }
.row-inactive{ opacity:.55; }
/* Ações na última coluna de uma tabela (Editar + Excluir lado a lado) */
.row-actions{ display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.row-actions form{ margin:0; }
/* Dois campos lado a lado no formulário (quebram no celular) */
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media (max-width:560px){ .field-row{ grid-template-columns:1fr; } }
/* Aviso dentro de um formulário */
.alert-warn{ background:#fff4e0; color:#8a5800; border:1px solid #f0d9a8; border-radius:var(--radius); padding:.7rem .9rem; font-size:.9rem; margin:0; }
.tag{ display:inline-block; background:#eef4f9; color:var(--color-primary,#1f3b57); font-size:.75rem; padding:.12rem .5rem; border-radius:6px; margin:.1rem .15rem .1rem 0; }
.checks{ display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; padding-top:.35rem; }
.check{ display:inline-flex; align-items:center; gap:.4rem; font-weight:400; }
.check input{ width:auto; }
.check-inline{ flex-direction:row !important; align-items:center; gap:.5rem; }
.check-inline input{ width:auto; }
.is-disabled{ opacity:.5; cursor:default; }

.nowrap{ white-space:nowrap; }
.nowrap .btn-sm{ margin:.1rem .1rem; }

/* ---- Editor visual de fluxo (canvas de nós) ---- */
.fluxo-wrap{ overflow:auto; border:1px solid var(--border); border-radius:var(--radius); background:
    radial-gradient(circle, #e6ebf0 1px, transparent 1px) 0 0 / 22px 22px, var(--surface); margin:.75rem 0 1rem; }
.fluxo-canvas{ position:relative; min-width:600px; min-height:200px; }
.fluxo-wires{ position:absolute; top:0; left:0; pointer-events:none; }
.node{ position:absolute; background:#fff; border:2px solid var(--color-secondary,#2e6f95); border-radius:10px;
    box-shadow:var(--shadow); padding:.5rem .6rem; cursor:grab; user-select:none; touch-action:none; }
.node.drag{ cursor:grabbing; box-shadow:0 8px 20px rgba(16,24,40,.18); }
.node.sel{ border-color:var(--color-accent,#d9a441); box-shadow:0 0 0 3px rgba(217,164,65,.3); }
.node-title{ font-weight:600; font-size:.9rem; }
.node-role{ color:var(--muted); font-size:.78rem; margin:.1rem 0 .35rem; }
.node-badges{ display:flex; gap:.25rem; flex-wrap:wrap; }
.nb{ font-size:.68rem; padding:.08rem .35rem; border-radius:999px; }
.nb-on{ background:#eaf6ee; color:var(--success); }
.nb-off{ background:#f1f3f5; color:#aab2bb; text-decoration:line-through; }
.fluxo-panel{ max-width:420px; }
.fluxo-panel .check{ display:flex; align-items:center; gap:.5rem; margin:.35rem 0; }

/* ---- Editor de fluxo Estágio 2 ---- */
.fluxo-toolbar{ display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; margin:.5rem 0; }
.fluxo-toolbar select{ padding:.4rem .5rem; border:1px solid var(--border); border-radius:8px; }
.node-head{ display:flex; align-items:center; justify-content:space-between; gap:.4rem; }
.node-x{ border:none; background:#fdecea; color:var(--danger); width:20px; height:20px; border-radius:50%; cursor:pointer; font-size:14px; line-height:1; }
.node-x:hover{ background:#f8c9c2; }
.node-lock{ font-size:.85rem; }
.node-final{ border-color:var(--color-primary,#1f3b57); border-style:dashed; }

/* ===================== MESA (diretoria, estilo swipe) ===================== */
/* Botão flutuante na tela da diretoria */
.mesa-fab{ position:fixed; left:50%; transform:translateX(-50%); bottom:1.1rem; z-index:50;
    background:var(--color-primary,#1f3b57); color:#fff; padding:.8rem 1.8rem; border-radius:999px;
    font-weight:700; font-size:1.05rem; box-shadow:0 6px 18px rgba(16,24,40,.25); }
.mesa-fab:hover{ text-decoration:none; filter:brightness(1.08); }

/* Overlay imersivo */
body.blank{ background:var(--bg); }
.mesa{ position:fixed; inset:0; display:flex; flex-direction:column; align-items:center;
    background:var(--color-primary,#0a2540); overflow:hidden; }
.mesa-close{ position:absolute; top:.6rem; left:.8rem; z-index:20; color:#fff; font-size:1.7rem; font-weight:700;
    width:44px; height:44px; display:flex; align-items:center; justify-content:center; text-decoration:none; }
.mesa-close:hover{ text-decoration:none; opacity:.85; }

/* Pilha de cartões */
.mesa-stack{ position:relative; flex:1; width:100%; max-width:480px; display:flex; align-items:center; justify-content:center; padding:3.2rem .8rem .5rem; }
.mesa-card{ position:absolute; width:min(92vw,460px); height:min(62vh,560px); background:#fff; border-radius:18px;
    box-shadow:0 12px 30px rgba(0,0,0,.35); overflow:hidden; will-change:transform; touch-action:none; cursor:grab; }
.mesa-card:active{ cursor:grabbing; }
.mc-inner{ display:flex; flex-direction:column; height:100%; padding:1rem 1.1rem 1.1rem; }
.mc-head{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.mc-form{ font-weight:700; font-size:1.1rem; color:var(--text); }
.mc-num{ color:var(--muted); font-size:.8rem; margin:.1rem 0 .5rem; }
.mc-body{ position:relative; flex:1; overflow:hidden; }
.mc-body .kv{ grid-template-columns:minmax(110px,150px) 1fr; gap:.25rem .8rem; font-size:.92rem; }
.mc-fade{ position:absolute; left:0; right:0; bottom:0; height:40px; background:linear-gradient(transparent, #fff); }
.mc-full{ margin-top:.6rem; font-size:.9rem; font-weight:600; align-self:flex-start; }

/* Carimbos de direção */
.mc-stamp{ position:absolute; top:22px; font-size:1.4rem; font-weight:800; letter-spacing:1px; padding:.3rem .7rem;
    border:3px solid; border-radius:10px; opacity:0; transition:opacity .1s; text-transform:uppercase; }
.st-approve{ left:20px; color:#2e7d46; border-color:#2e7d46; transform:rotate(-14deg); }
.st-reject{ right:20px; color:#c0392b; border-color:#c0392b; transform:rotate(14deg); }
.st-devolver{ left:50%; transform:translateX(-50%) rotate(-4deg); top:14px; color:#b7791f; border-color:#b7791f; }
.mesa-card.show-approve .st-approve{ opacity:1; }
.mesa-card.show-reject .st-reject{ opacity:1; }
.mesa-card.show-devolver .st-devolver{ opacity:1; }

/* Botões de ação */
.mesa-actions{ display:flex; gap:1.5rem; align-items:center; justify-content:center; padding:1rem 0 1.6rem; }
.mesa-btn{ width:64px; height:64px; border-radius:50%; border:none; font-size:1.7rem; cursor:pointer; color:#fff;
    box-shadow:0 4px 12px rgba(0,0,0,.3); display:flex; align-items:center; justify-content:center; }
.mesa-btn:active{ transform:scale(.92); }
.mb-approve{ background:#2e9e4b; } .mb-devolver{ background:#d9a441; } .mb-reject{ background:#d23b34; }

/* Estado vazio */
.mesa-empty{ color:#fff; text-align:center; margin:auto; padding:2rem; }
.me-emoji{ font-size:3rem; }

/* Modais (tutorial + motivo) */
.mesa-modal{ position:fixed; inset:0; z-index:60; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; padding:1rem; }
.mesa-modal-box{ background:#fff; border-radius:16px; padding:1.4rem; width:100%; max-width:400px; box-shadow:0 12px 30px rgba(0,0,0,.4); }
.mesa-modal-box h3{ margin:0 0 .8rem; }
.mesa-modal-box textarea{ width:100%; border:1px solid var(--border); border-radius:8px; padding:.6rem; font:inherit; }
.mm-actions{ display:flex; gap:.6rem; justify-content:flex-end; margin-top:.8rem; }
.tut{ list-style:none; margin:0 0 .6rem; padding:0; }
.tut li{ display:flex; align-items:flex-start; gap:.6rem; margin:.55rem 0; font-size:.95rem; }
.tut-ic{ flex:0 0 30px; width:30px; height:30px; border-radius:50%; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; }
.ic-ok{ background:#2e9e4b; } .ic-dev{ background:#d9a441; } .ic-no{ background:#d23b34; }

@media (max-width:640px){
    .mesa-btn{ width:58px; height:58px; font-size:1.5rem; }
    .mesa-actions{ gap:1.1rem; }
}

/* ===== Mesa: card maior no desktop + layout novo ===== */
@media (min-width:768px){
    .mesa-stack{ max-width:720px; }
    .mesa-card{ width:660px; height:min(80vh,760px); }
    .mc-inner{ padding:1.4rem 1.6rem; }
    .mc-form{ font-size:1.35rem; }
}
.mc-head{ align-items:flex-start; }
.mc-head .mc-num{ display:inline-block; margin:0 0 0 .5rem; font-size:.8rem; }
.mc-who{ display:flex; flex-wrap:wrap; gap:.5rem 1.6rem; background:var(--bg); border-radius:10px; padding:.7rem .9rem; margin:.7rem 0; }
.mc-who .lbl, .mc-value .lbl, .mc-desc .lbl{ display:block; font-size:.7rem; text-transform:uppercase; letter-spacing:.4px; color:var(--muted); margin-bottom:.1rem; }
.mc-value{ margin:.5rem 0; }
.mc-value strong{ display:block; font-size:1.6rem; color:var(--color-primary,#1f3b57); font-weight:800; }
/* Orçamento na Mesa (seção 7.3-A): 3 cotações LADO A LADO (não empilhadas —
   ocupava altura demais no cartão) com só o essencial pra decidir rápido:
   fornecedor, valor em destaque, forma de pagamento pequena. A mais barata
   ganha fundo/borda de "success" (mesmos tokens do resto do sistema, então
   já respeita dark mode) — é o dado que mais importa numa comparação rápida. */
.mc-quotes-hint{ font-size:.7rem; color:var(--muted); margin:.4rem 0 .3rem; }
.mc-quotes{ display:grid; grid-template-columns:repeat(3,1fr); gap:.4rem; margin:.2rem 0 .5rem; }
/* .mc-quote virou <button> (precisa ser tocável pra escolher o fornecedor) —
   reseta a aparência padrão de botão do navegador antes de estilizar. */
.mc-quote{ appearance:none; -webkit-appearance:none; font:inherit; cursor:pointer;
    background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:.45rem .35rem; text-align:center; }
.mc-quote-best{ background:var(--success-bg); border-color:var(--success-border); }
.mc-quote-selected{ border:2px solid var(--color-secondary,#2e6f95); box-shadow:0 0 0 2px color-mix(in srgb, var(--color-secondary,#2e6f95) 25%, transparent); }
.mc-quote-badge{ display:block; font-size:.6rem; font-weight:700; text-transform:uppercase; letter-spacing:.3px; color:var(--success); margin-bottom:.15rem; }
.mc-quote-supplier{ display:block; font-size:.76rem; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mc-quote-amount{ display:block; font-size:1rem; font-weight:800; color:var(--color-primary,#1f3b57); margin:.15rem 0; }
.mc-quote-method{ display:block; font-size:.68rem; color:var(--muted); }
.mc-quote-details{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
    font-size:.64rem; color:var(--muted); margin-top:.2rem; text-align:left; }
.mc-desc{ margin:.6rem 0; }
.mc-desc p{ margin:.1rem 0; font-size:1rem; line-height:1.45; }
.mc-others{ margin-top:.4rem; }
.mc-others-title{ font-size:.72rem; text-transform:uppercase; letter-spacing:.4px; color:var(--muted); border-top:1px solid var(--border); padding-top:.5rem; margin-bottom:.3rem; }
.mc-others .kv{ grid-template-columns:minmax(120px,42%) 1fr; gap:.15rem .8rem; font-size:.88rem; }
.mc-full{ background:none; border:none; color:var(--color-secondary,#2e6f95); font-weight:700; cursor:pointer; padding:.6rem 0 0; text-align:left; font-size:.95rem; }

/* Pop-up da solicitação completa (iframe) */
.detail-box{ position:relative; background:#fff; border-radius:14px; width:min(96vw,900px); height:min(92vh,920px); overflow:hidden; box-shadow:0 16px 40px rgba(0,0,0,.5); }
.detail-close{ position:absolute; top:10px; right:10px; z-index:3; width:36px; height:36px; border-radius:50%; border:none; background:rgba(0,0,0,.55); color:#fff; font-size:1.1rem; cursor:pointer; }
.detail-close:hover{ background:rgba(0,0,0,.75); }
#detail-frame{ width:100%; height:100%; border:none; }
.detail-embed{ padding:1.25rem 1.5rem; max-width:820px; margin:0 auto; }

/* ===================== Seletor visual de veículo ===================== */
.veh-picker{ border:1px solid var(--border); border-radius:12px; padding:1rem; margin-bottom:1.1rem; background:var(--bg); }
.vp-top{ display:flex; gap:1.2rem; flex-wrap:wrap; }
.vp-cal{ flex:1 1 300px; max-width:360px; }
.vp-cal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.4rem; font-weight:600; }
.vp-nav{ border:none; background:var(--surface); width:32px; height:32px; border-radius:8px; cursor:pointer; font-size:1.2rem; }
.vp-week, .vp-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:3px; }
.vp-week span{ text-align:center; font-size:.72rem; color:var(--muted); padding:.2rem 0; }
.vp-day{ aspect-ratio:1; border:1px solid var(--border); background:var(--surface); border-radius:8px; cursor:pointer; font-size:.9rem; }
.vp-day:hover:not(:disabled){ border-color:var(--color-secondary,#2e6f95); }
.vp-day.sel{ background:var(--color-secondary,#2e6f95); color:#fff; border-color:var(--color-secondary,#2e6f95); font-weight:700; }
.vp-day.past{ opacity:.35; cursor:not-allowed; }
.vp-times{ flex:1 1 200px; display:flex; flex-direction:column; gap:.6rem; }
.vp-selday{ background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:.5rem .7rem; font-size:.9rem; }
.vp-times .field{ margin:0; }
.vp-times input[type=time]{ font-size:1.1rem; }

.vp-cars{ margin-top:1rem; }
.vp-cars-head{ font-weight:600; margin-bottom:.5rem; }
.vp-grid-cars{ display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:.6rem; }
.vp-car{ display:flex; flex-direction:column; align-items:center; gap:.15rem; padding:.7rem .4rem; border-radius:10px; border:2px solid; cursor:pointer; background:var(--surface); font:inherit; }
.vp-car.ok{ border-color:#2e9e4b; color:#1e6b34; }
.vp-car.ok:hover{ background:#eafaef; }
.vp-car.ok.sel{ background:#2e9e4b; color:#fff; }
.vp-car.busy{ border-color:#d23b34; color:#c0392b; opacity:.55; cursor:not-allowed; background:#fdecea; }
.vp-car-ic{ font-size:1.6rem; }
.vp-car-lbl{ font-size:.82rem; font-weight:600; text-align:center; line-height:1.1; }
.vp-car-plate{ font-size:.72rem; opacity:.85; }
@media (max-width:560px){ .vp-cal{ max-width:none; } }

/* ===================== Seletor visual de sala (diagrama de andar) ===================== */
.room-picker{ border:1px solid var(--border); border-radius:14px; padding:1.4rem; margin-bottom:1.1rem; background:var(--bg); }

.rp-pills{ display:flex; justify-content:center; gap:.75rem; margin-bottom:1.2rem; flex-wrap:wrap; }
.rp-pill{ border:2px solid var(--border); border-radius:999px; padding:.6rem 1.4rem; cursor:pointer; background:var(--surface); font-weight:600; font-size:.95rem; color:var(--text); transition:background .1s ease, border-color .1s ease, color .1s ease; }
.rp-pill:hover{ border-color:var(--color-secondary,#2e6f95); }
.rp-pill.sel{ background:var(--color-secondary,#2e6f95); border-color:var(--color-secondary,#2e6f95); color:#fff; }

.rp-top{ display:flex; gap:1.5rem; flex-wrap:wrap; justify-content:center; padding-bottom:1.1rem; margin-bottom:1.1rem; border-bottom:1px solid var(--border); }
.rp-cal-block{ flex:1 1 300px; max-width:340px; }
.rp-times-block{ flex:1 1 220px; max-width:280px; display:flex; flex-direction:column; gap:.7rem; }
.rp-times-block .field{ margin:0; }

.rp-floor-switch{ display:flex; align-items:center; justify-content:center; gap:.9rem; margin:0 0 1.2rem; font-weight:700; font-size:1.05rem; }
.rp-floor-switch button{ border:none; background:var(--surface); width:36px; height:36px; border-radius:9px; cursor:pointer; font-size:1.1rem; box-shadow:var(--shadow); }
.rp-floor-switch button:hover{ background:var(--surface-2); }

.rp-hint{ text-align:center; margin-bottom:.8rem; }

.rp-body{ display:grid; grid-template-columns:1.4fr 1fr; gap:1.5rem; align-items:start; }
@media (max-width:760px){ .rp-body{ grid-template-columns:1fr; } }

.rp-map-col{ background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:1rem; }
.rp-canvas-wrap{ aspect-ratio:1/0.85; max-width:100%; margin:0 auto; }
.rp-canvas-wrap svg{ width:100%; height:100%; }
.rp-room{ stroke-width:1.5; }
/* Texto sempre em cor escura fixa: o fundo das salas é sempre um pastel claro
   (não muda com o tema, mesmo padrão dos cartões de carro e sala do painel do
   gerente), então var(--text) fica ilegível no tema escuro. */
.rp-room text, .rp-room + text{ font-size:4px; font-weight:700; pointer-events:none; fill:#1c2733; }
/* Ainda sem tipo de reunião/horário definido: neutro, não informa nada ainda. */
.rp-room.indefinido{ fill:var(--surface-2); stroke:var(--border); }
/* Livre — mesmo verde já usado em .vp-car.ok / .st-disp */
.rp-room.livre{ fill:#eafaef; stroke:#2e9e4b; }
.rp-room.livre.clickable{ cursor:pointer; }
.rp-room.livre.clickable:hover{ fill:#d7f3dd; }
.rp-room.livre.sel{ fill:#2e9e4b; }
/* Manutenção — mesmo cinza já usado em .st-manut */
.rp-room.manutencao{ fill:#eef1f4; stroke:#8a94a0; opacity:.7; }
/* Ocupada por reunião INTERNA — cor própria (terracota), diferente do vermelho de
   veículo (#d23b34) para não confundir os dois recursos. Clicável só quando a
   própria solicitação sendo feita é "reunião com clientes". */
.rp-room.ocupada-interna{ fill:#fdf0e6; stroke:#d9622e; }
.rp-room.ocupada-interna.clickable{ cursor:pointer; }
.rp-room.ocupada-interna.clickable:hover{ fill:#fbdfc9; }
.rp-room.ocupada-interna.sel{ fill:#d9622e; }
.rp-room.ocupada-interna:not(.clickable){ opacity:.55; }
/* Ocupada por OUTRA reunião de CLIENTE — cor própria (vinho), NUNCA clicável. */
.rp-room.ocupada-cliente{ fill:#f3e6f0; stroke:#7a3b6d; opacity:.7; cursor:not-allowed; }

.rp-legend{ display:flex; flex-wrap:wrap; justify-content:center; gap:.9rem; margin-top:.8rem; }
.rp-legend span{ display:inline-flex; align-items:center; gap:.35rem; }
.rp-dot{ display:inline-block; width:10px; height:10px; border-radius:3px; }
.rp-dot.livre{ background:#eafaef; border:1.5px solid #2e9e4b; }
.rp-dot.ocupada-interna{ background:#fdf0e6; border:1.5px solid #d9622e; }
.rp-dot.ocupada-cliente{ background:#f3e6f0; border:1.5px solid #7a3b6d; }
.rp-dot.manutencao{ background:#eef1f4; border:1.5px solid #8a94a0; }

/* Agenda do dia (sem identidade de quem reservou) */
.rp-schedule-col h4{ margin:0 0 .7rem; font-size:.95rem; }
#rp-schedule{ display:flex; flex-direction:column; gap:.8rem; max-height:420px; overflow-y:auto; }
.rp-sched-room{ background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:.7rem .85rem; }
.rp-sched-room-name{ font-weight:600; font-size:.88rem; margin-bottom:.4rem; }
.rp-sched-free{ font-style:italic; }
.rp-sched-slot{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.25rem 0; font-size:.85rem; }
.rp-sched-slot + .rp-sched-slot{ border-top:1px dashed var(--border); }
.rp-sched-time{ font-variant-numeric:tabular-nums; font-weight:600; }
.rp-sched-badge{ font-size:.72rem; padding:.12rem .5rem; border-radius:999px; white-space:nowrap; }
.rp-sched-badge.rp-sched-interna{ background:#fdf0e6; color:#a2481c; }
.rp-sched-badge.rp-sched-cliente{ background:#f3e6f0; color:#6b2f5f; }

/* Painel de Salas — espelha as classes fd-/st- do painel de frota */
.rd-floor-title{ margin:1.2rem 0 .5rem; }
.rd-disp{ border-left-color:#2e9e4b; } .rd-disp .fd-car-st{ background:#eafaef; color:#1e6b34; }
.rd-resv{ border-left-color:#3b74c4; } .rd-resv .fd-car-st{ background:#e7f0fb; color:#28527f; }
.rd-manut{ border-left-color:#8a94a0; } .rd-manut .fd-car-st{ background:#eef1f4; color:#5a6b7b; }
.rd-inat{ border-left-color:#d23b34; opacity:.7; } .rd-inat .fd-car-st{ background:#fdecea; color:#c0392b; }

/* ===================== Painel do Gerente de Frota ===================== */
.frota-dash{ }
.fd-clock{ text-align:center; margin:.5rem 0 1.5rem; }
.fd-time{ font-size:2.6rem; font-weight:800; color:var(--color-primary,#1f3b57); font-variant-numeric:tabular-nums; letter-spacing:1px; }
.fd-date{ color:var(--muted); text-transform:capitalize; }
.fd-cars{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:.9rem; margin:.6rem 0 1.5rem; }
.fd-car{ border:1px solid var(--border); border-left:5px solid var(--border); border-radius:12px; padding:.8rem .9rem; background:var(--surface); }
.fd-car-top{ display:flex; align-items:center; justify-content:space-between; }
.fd-car-ic{ font-size:1.6rem; }
.fd-car-st{ font-size:.75rem; font-weight:700; padding:.1rem .5rem; border-radius:999px; }
.fd-car-name{ font-weight:600; margin-top:.35rem; }
.fd-car-plate{ color:var(--muted); font-size:.85rem; margin-bottom:.5rem; }
.st-disp{ border-left-color:#2e9e4b; } .st-disp .fd-car-st{ background:#eafaef; color:#1e6b34; }
.st-uso{ border-left-color:#d9a441; } .st-uso .fd-car-st{ background:#fff4e0; color:#b7791f; }
.st-manut{ border-left-color:#8a94a0; } .st-manut .fd-car-st{ background:#eef1f4; color:#5a6b7b; }
.st-inat{ border-left-color:#d23b34; opacity:.7; } .st-inat .fd-car-st{ background:#fdecea; color:#c0392b; }
.fd-queues{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1rem; }
.fd-queue{ background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:1rem; }
.fd-queue h3{ margin:0 0 .6rem; font-size:1rem; display:flex; align-items:center; gap:.5rem; }
.fd-badge{ background:var(--color-secondary,#2e6f95); color:#fff; border-radius:999px; padding:.05rem .5rem; font-size:.8rem; }
.fd-item{ display:flex; align-items:center; gap:.5rem; padding:.5rem .2rem; border-bottom:1px solid var(--border); color:var(--text); }
.fd-item:last-child{ border-bottom:none; }
.fd-item:hover{ text-decoration:none; color:var(--color-secondary,#2e6f95); }

/* ajustes frota */
.fd-filter{ padding:.3rem .5rem; border:1px solid var(--border); border-radius:8px; font:inherit; }
.vp-car-tag{ font-size:.68rem; margin-top:.15rem; opacity:.9; }
.fd-queue h3 form{ display:inline; }

/* histórico da frota */
.fd-history{ }
.fd-htabs{ flex-wrap:wrap; margin-bottom:.5rem; }
.fd-htabs .tab{ font-size:.85rem; }
.fd-item{ flex-wrap:wrap; }
.fd-km{ margin-left:auto; background:#eef4f9; color:var(--color-primary,#1f3b57); font-size:.75rem; padding:.1rem .5rem; border-radius:999px; }

/* ---- Minhas solicitações: filtro por tipo + cores de linha ---- */
.type-filter{ display:flex; gap:.5rem; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:.4rem; margin-bottom:.75rem; }
.type-chip{ white-space:nowrap; border:1px solid var(--border); border-radius:999px; padding:.4rem .85rem; color:var(--text); background:var(--surface); font-size:.88rem; display:inline-flex; align-items:center; gap:.35rem; }
.type-chip:hover{ text-decoration:none; border-color:var(--color-secondary,#2e6f95); }
.type-chip.active{ background:var(--color-primary,#1f3b57); color:#fff; border-color:var(--color-primary,#1f3b57); }
.row-finalized{ background:#eefaf1; box-shadow:inset 3px 0 0 #2e9e4b; }
.row-finalized:hover{ background:#e2f6e8 !important; }
.row-rejected{ background:#fdf0ef; box-shadow:inset 3px 0 0 #d23b34; }
.row-rejected:hover{ background:#fbe5e3 !important; }

/* chips de tipo: todos visíveis (sem scroll escondido) */
.type-filter{ flex-wrap:wrap; overflow:visible; }
/* bloco "Ação necessária" no topo */
.action-needed-block{ border:2px solid #f0c36d; border-radius:12px; background:#fffaf0; padding:.6rem .7rem; margin-bottom:1rem; }
.an-title{ font-size:1.05rem; margin:.2rem 0 .6rem; display:flex; align-items:center; gap:.5rem; }
.an-count{ background:var(--danger); color:#fff; border-radius:999px; padding:.05rem .5rem; font-size:.8rem; }
.action-needed-block .data-table{ border:none; }
.muted-title{ color:var(--muted); font-size:.95rem; font-weight:600; margin:.4rem 0 .5rem; }

/* frota: status reservado + quem usa + relatório */
.st-resv{ border-left-color:#3b74c4; } .st-resv .fd-car-st{ background:#e7f0fb; color:#28527f; }
.fd-car-user{ font-size:.82rem; color:var(--text); margin:.1rem 0 .4rem; font-weight:600; }
.fd-report{ display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; justify-content:center; margin-bottom:1.2rem; }
.fd-report input[type=month]{ padding:.35rem .5rem; border:1px solid var(--border); border-radius:8px; font:inherit; }

/* Overlay de "Convertendo PDF…" durante o upload (upload-pdf.js) */
.upload-overlay{ position:fixed; inset:0; background:rgba(16,24,40,.55); display:flex; align-items:center; justify-content:center; z-index:9999; }
.upload-overlay-box{ background:#fff; border-radius:12px; padding:26px 34px; text-align:center; box-shadow:0 10px 40px rgba(0,0,0,.25); }
.upload-overlay-box p{ margin:.8rem 0 0; color:#1c2733; font-weight:600; }
.upload-overlay .spin{ width:34px; height:34px; margin:0 auto; border:4px solid #dfe6ee; border-top-color:#1f3b57; border-radius:50%; animation:uspin .8s linear infinite; }
@keyframes uspin{ to{ transform:rotate(360deg); } }

/* Anexos: imagem em tamanho de leitura — largura total da coluna, altura pela
   proporção original (sem corte). Página longa é aceitável: o que importa é ler. */
.attach-full{ margin:0 0 1.25rem; }
.attach-full img{
    display:block; width:100%; height:auto;          /* proporção preservada */
    border:1px solid var(--border); border-radius:var(--radius);
    background:#fff; box-shadow:var(--shadow);
}
.attach-full figcaption{ margin-top:.4rem; font-size:.85rem; color:var(--muted); word-break:break-word; }
/* PDF: sem pré-visualização, fica como link */
.attach-doc-row{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; padding:.9rem 1.2rem; margin-bottom:1.25rem; }

/* Parecer restrito no histórico (ex.: recomendação do coordenador ao RH) */
.tl-conf{ background:#fff7e6; border-left:3px solid #d9a441; }
.tl-conf-tag{ color:#8a5800; font-size:.8rem; }
.tl-locked{ background:#f1f3f5; color:var(--muted); font-style:italic; }

/* Sino de notificações */
.bell{ position:relative; color:#fff; font-size:1.15rem; line-height:1; text-decoration:none; padding:.15rem; }
.bell:hover{ text-decoration:none; opacity:.85; }
.bell-badge{
    position:absolute; top:-6px; right:-8px; min-width:17px; height:17px; padding:0 4px;
    background:var(--danger); color:#fff; border-radius:999px;
    font-size:.68rem; font-weight:700; line-height:17px; text-align:center;
}
.bell-badge[hidden]{ display:none; }
/* Lista de notificações */
.notif-list{ list-style:none; margin:0; padding:0; }
.notif{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); margin-bottom:.5rem; }
.notif a{ display:block; padding:.8rem 1rem; color:var(--text); }
.notif a:hover{ text-decoration:none; background:var(--surface-2); border-radius:var(--radius); }
.notif-unread{ border-left:3px solid var(--color-secondary,#2e6f95); background:var(--info-bg); }
.notif-unread .notif-msg{ font-weight:600; }
.notif-msg{ display:block; }
.notif-meta{ display:block; color:var(--muted); font-size:.82rem; margin-top:.15rem; }

/* Frota: manutenção com período */
.fd-maint{ background:#fff4e0; border-radius:8px; padding:.4rem .6rem; font-size:.82rem; color:#8a5800; margin:.3rem 0; }
.fd-maint-form{ text-align:left; }
.fd-maint-form > summary{ list-style:none; cursor:pointer; display:inline-block; }
.fd-maint-form > summary::-webkit-details-marker{ display:none; }
.fd-maint-form .field{ margin-bottom:.6rem; }
.fd-maint-form .field > span:first-child{ font-size:.82rem; }
.btn[disabled]{ opacity:.45; cursor:not-allowed; }

/* Backup: destaque para a área destrutiva */
.restore-box{ border-color:#f0c9c4; }
.mt0{ margin-top:0; }

/* Telas de conta (cadastro / código / senha) */
.auth-wide{ max-width:560px; }
.auth-alt{ text-align:center; margin:1rem 0 0; font-size:.9rem; }
.code-input{ text-transform:uppercase; letter-spacing:.5rem; text-align:center; font-size:1.5rem; font-weight:700; }
.btn-link-muted{ background:none; border:none; color:var(--color-secondary,#2e6f95); cursor:pointer; font:inherit; text-decoration:underline; padding:0; }
.mt{ margin-top:.75rem; }

/* Cadastros pendentes */
.pend-card{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-bottom:1rem; }
@media (max-width:640px){ .pend-card{ grid-template-columns:1fr; } }
.pend-form{ border-left:1px solid var(--border); padding-left:1.5rem; }
@media (max-width:640px){ .pend-form{ border-left:none; padding-left:0; border-top:1px solid var(--border); padding-top:1rem; } }
.card-alert{ border-color:#ffd699; background:#fffaf0; }

/* ---- Alternador de tema ---- */
.theme-toggle{
    background:none; border:none; cursor:pointer; font-size:1.1rem; line-height:1;
    padding:.25rem; border-radius:8px; color:inherit;
}
.theme-toggle:hover{ background:rgba(255,255,255,.12); }
/* Nas telas sem topbar (login, cadastro): canto superior direito */
.theme-float{
    position:fixed; top:1rem; right:1rem; z-index:10;
    background:var(--surface); border:1px solid var(--border); box-shadow:var(--shadow);
    width:38px; height:38px;
}
.theme-float:hover{ background:var(--surface-2); }

/* ---- Ordem de cadastro (painel do Master) ---- */
.setup-guide{ margin-bottom:1.5rem; padding:1rem 1.25rem; }
.setup-guide > summary{ cursor:pointer; display:flex; align-items:center; gap:.6rem; font-size:1.05rem; }
.setup-guide > summary + p{ margin:.6rem 0 .9rem; }
.setup-steps{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.55rem; }
.setup-step{ display:flex; gap:.75rem; align-items:flex-start; padding:.6rem .75rem; border:1px solid var(--border); border-radius:8px; }
.setup-mark{ flex:0 0 1.7rem; height:1.7rem; border-radius:999px; display:flex; align-items:center; justify-content:center;
             font-weight:700; font-size:.85rem; background:var(--surface-2); color:var(--muted); }
.setup-body{ min-width:0; flex:1; }
.setup-title{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; font-weight:600; }
.setup-why{ margin:.2rem 0 0; }
.setup-missing{ margin:.4rem 0 0; padding-left:1.1rem; color:var(--warn-text); font-size:.85rem; }
.setup-step.is-done .setup-mark{ background:var(--success-bg); color:var(--success); }
.setup-step.is-done .setup-why{ display:none; }   /* feito: não precisa mais da explicação */
.setup-step.is-next{ border-color:var(--warn-border); background:var(--warn-bg); }
.setup-step.is-next .setup-mark{ background:var(--warn-border); color:var(--warn-text); }
.setup-step.is-optional{ opacity:.85; }