/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-t2ku09w999] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-t2ku09w999] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-spcuyls1ff],
.components-reconnect-repeated-attempt-visible[b-spcuyls1ff],
.components-reconnect-failed-visible[b-spcuyls1ff],
.components-pause-visible[b-spcuyls1ff],
.components-resume-failed-visible[b-spcuyls1ff],
.components-rejoining-animation[b-spcuyls1ff] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-spcuyls1ff],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-spcuyls1ff],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-spcuyls1ff],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-spcuyls1ff],
#components-reconnect-modal.components-reconnect-retrying[b-spcuyls1ff],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-spcuyls1ff],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-spcuyls1ff],
#components-reconnect-modal.components-reconnect-failed[b-spcuyls1ff],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-spcuyls1ff] {
    display: block;
}


#components-reconnect-modal[b-spcuyls1ff] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-spcuyls1ff 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-spcuyls1ff 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-spcuyls1ff 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-spcuyls1ff]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-spcuyls1ff 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-spcuyls1ff {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-spcuyls1ff {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-spcuyls1ff {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-spcuyls1ff] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-spcuyls1ff] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-spcuyls1ff] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-spcuyls1ff] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-spcuyls1ff] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-spcuyls1ff] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-spcuyls1ff] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-spcuyls1ff 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-spcuyls1ff] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-spcuyls1ff {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Ingest.razor.rz.scp.css */
/* Restyle da /ingest com a linguagem visual do /rotas (tokens do G10, DEC-56). Só apresentação.
   Scoped ao componente Ingest — os seletores de elemento (h2, select, button, table…) só afetam esta
   página. Tokens consumidos por var(--color-*), como no Rotas.razor.css.
   NOTA de scoping: o <InputFile> (uploads PBF/POIs) é componente filho — o seu input[type=file] não
   herda o scope desta página, por isso os file inputs usam ::deep (apanha os do InputFile E o plano). */

/* Página: fundo escuro full-bleed. O .ingest só dá o fundo; o .ingest-inner é a coluna centrada. */
.ingest[b-sfnomokvcw] {
    min-height: 100vh;
    width: 100%;
    box-sizing: border-box;
    background: var(--color-panel-2);
    color: var(--color-ink);
}

.ingest-inner[b-sfnomokvcw] {
    max-width: 820px;
    margin: 0 auto;
    padding: 28px 20px 48px;
}

/* Cabeçalho */
.ingest-header[b-sfnomokvcw] {
    margin-bottom: 20px;
}

.overline[b-sfnomokvcw] {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--color-data);
}

.ingest h1[b-sfnomokvcw] {
    margin: 0 0 6px;
    font-size: 24px;
    font-weight: 700;
    color: var(--color-ink);
}

.ingest-header p[b-sfnomokvcw] {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--color-ink-dim);
}

/* Secções = cartões escuros */
.session-picker[b-sfnomokvcw],
.upload-row[b-sfnomokvcw],
.pbf-import[b-sfnomokvcw],
.poi-import[b-sfnomokvcw],
.tiles-package[b-sfnomokvcw],
.sessions-list[b-sfnomokvcw] {
    box-sizing: border-box;
    margin-bottom: 16px;
    padding: 16px 18px;
    background: var(--color-panel);
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
}

.ingest h2[b-sfnomokvcw] {
    margin: 0 0 10px;
    font-size: 16px;
    font-weight: 700;
    color: var(--color-ink);
}

.ingest h3[b-sfnomokvcw] {
    margin: 14px 0 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--color-ink);
}

.ingest p[b-sfnomokvcw] {
    font-size: 13px;
    line-height: 1.5;
    color: var(--color-ink-dim);
}

.ingest em[b-sfnomokvcw] {
    color: var(--color-ink-dim);
}

.ingest strong[b-sfnomokvcw] {
    color: var(--color-ink);
}

/* Grupos de controlo em linha (picker de upload; nova sessão) */
.upload-row[b-sfnomokvcw],
.new-session[b-sfnomokvcw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.new-session[b-sfnomokvcw] {
    margin-top: 10px;
}

.poi-upload[b-sfnomokvcw] {
    margin-top: 12px;
}

/* Controlos de markup próprio: select + input de texto (o file input vai por ::deep, abaixo) */
.ingest select[b-sfnomokvcw],
.ingest input[type="text"][b-sfnomokvcw] {
    box-sizing: border-box;
    max-width: 100%;
    height: 34px;
    padding: 0 10px;
    background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 4px;
    color: var(--color-ink);
    font-size: 13px;
}

.ingest select[b-sfnomokvcw] {
    min-width: 260px;
    appearance: none;
    padding-right: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%237c8da0' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 10px;
}

.ingest input[type="text"][b-sfnomokvcw] {
    min-width: 220px;
}

.ingest select:focus[b-sfnomokvcw],
.ingest input[type="text"]:focus[b-sfnomokvcw] {
    outline: none;
    border-color: var(--color-data);
}

.ingest input[type="text"][b-sfnomokvcw]::placeholder {
    color: var(--color-ink-dim);
}

/* File inputs (plano E os do <InputFile> filho) — via ::deep para atravessar a fronteira do componente */
.ingest[b-sfnomokvcw]  input[type="file"] {
    box-sizing: border-box;
    max-width: 100%;
    padding: 6px 10px;
    background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 4px;
    color: var(--color-ink);
    font-size: 13px;
}

.ingest[b-sfnomokvcw]  input[type="file"]:focus {
    outline: none;
    border-color: var(--color-data);
}

.ingest[b-sfnomokvcw]  input[type="file"]::file-selector-button {
    margin-right: 10px;
    padding: 5px 12px;
    background: var(--color-panel-2);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 4px;
    color: var(--color-ink);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.ingest[b-sfnomokvcw]  input[type="file"]::file-selector-button:hover {
    border-color: var(--color-data);
    color: var(--color-data);
}

/* Botões primários (Criar sessão, Carregar) */
.ingest button[b-sfnomokvcw] {
    padding: 8px 16px;
    background: var(--color-cta);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: filter .15s ease;
}

.ingest button:hover:not(:disabled)[b-sfnomokvcw] {
    filter: brightness(1.08);
}

.ingest button:disabled[b-sfnomokvcw] {
    background: var(--color-field);
    color: var(--color-ink-dim);
    cursor: not-allowed;
    opacity: .7;
}

/* Botão Apagar (tabela de sessões): discreto, hover vermelho */
.sessions-list button[b-sfnomokvcw] {
    padding: 4px 12px;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .15);
    color: var(--color-ink-dim);
    font-weight: 600;
}

.sessions-list button:hover:not(:disabled)[b-sfnomokvcw] {
    filter: none;
    border-color: var(--color-error);
    color: var(--color-error);
}

/* Painel de progresso: fundo mais escuro dentro do cartão */
.progress-panel[b-sfnomokvcw] {
    box-sizing: border-box;
    margin: 12px 0 16px;
    padding: 14px 16px;
    background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .06);
    border-radius: 6px;
}

.progress-panel h2[b-sfnomokvcw],
.progress-panel h3[b-sfnomokvcw] {
    margin-top: 0;
}

.ingest progress[b-sfnomokvcw] {
    width: 100%;
    height: 10px;
    accent-color: var(--color-data);
}

/* Estados */
.notice[b-sfnomokvcw] {
    color: var(--color-data);
    font-weight: 600;
}

.err[b-sfnomokvcw] {
    color: var(--color-error);
    font-weight: 600;
}

.stalled[b-sfnomokvcw] {
    margin-left: 6px;
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--color-warn);
    color: #000;
    font-weight: 600;
}

/* Tabelas (sessões existentes + ficheiros do job) */
.sessions-list table[b-sfnomokvcw],
.ingest-files[b-sfnomokvcw] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 8px;
}

.sessions-list th[b-sfnomokvcw],
.ingest-files th[b-sfnomokvcw] {
    padding: 8px 10px;
    text-align: left;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--color-ink-section);
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.sessions-list td[b-sfnomokvcw],
.ingest-files td[b-sfnomokvcw] {
    padding: 8px 10px;
    font-size: 13px;
    color: var(--color-ink);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

/* Downloads do Pacote offline + código inline */
.tiles-package a[b-sfnomokvcw] {
    color: var(--color-data);
    font-weight: 600;
    text-decoration: none;
}

.tiles-package a:hover[b-sfnomokvcw] {
    text-decoration: underline;
}

.ingest code[b-sfnomokvcw] {
    padding: 1px 6px;
    background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 4px;
    font-size: 12px;
    color: var(--color-ink);
}

/* Zona do botão "Gerar tiles" na secção Basemap vetorial */
.tile-gen[b-sfnomokvcw] {
    margin-top: 12px;
}
/* /Components/Pages/Processamento.razor.rz.scp.css */
/* Layout lado-a-lado (mapa + painel de controlo), molde do wireframe aprovado
   (.superpowers/brainstorm/.../layout-v3.html): diferente do /rotas (cartão flutuante sobre mapa
   full-bleed) porque esta página é um painel de controlo/acompanhamento, não uma busca pontual. */
.proc[b-kfvrum5ad4] {
    display: flex;
    height: 100vh;
    width: 100%;
    overflow: hidden;

    /* Tokens de cor por ESTADO (texto legível claro + fundo escuro tonal), usados nos badges e na legenda.
       O ...-dot é a cor sólida do ponto da legenda (= CELL_COLORS do map.js, que pinta a grelha).
       Antes cada estado estava hardcoded e repetido; o por_fazer tinha texto escuro (#5b6473) sobre cinza
       — ~1.9:1, ilegível. Aqui o texto é sempre claro sobre fundo escuro (≥ ~7:1). */
    --st-feito-fg: #8be7b0;  --st-feito-bg: #0f5132;              --st-feito-dot: #2ecc71;
    --st-proc-fg:  #e7d18b;  --st-proc-bg:  #2a230e;              --st-proc-dot:  #f1c40f;
    --st-fila-fg:  #9cc4ec;  --st-fila-bg:  #0e1a2a;              --st-fila-dot:  #2f6fed;
    --st-fazer-fg: #c2cad6;  --st-fazer-bg: rgba(255,255,255,.08); --st-fazer-dot: #5b6473;
    --st-erro-fg:  #e78b8b;  --st-erro-bg:  #2a0e0e;              --st-erro-dot:  #e74c3c;
}

.proc-map[b-kfvrum5ad4] {
    flex: 1;
    position: relative;
}

.proc-map-canvas[b-kfvrum5ad4] {
    position: absolute;
    inset: 0;
}

.proc-panel[b-kfvrum5ad4] {
    width: 290px;
    flex-shrink: 0;
    box-sizing: border-box;
    padding: 16px;
    overflow-y: auto;
    background: var(--color-panel);
    border-right: 1px solid rgba(255, 255, 255, .08);
}

.overline[b-kfvrum5ad4] {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--color-data);
}

.proc-panel h2[b-kfvrum5ad4] {
    margin: 0 0 12px;
    font-size: 19px;
    font-weight: 700;
    color: var(--color-ink);
}

.hint[b-kfvrum5ad4] {
    margin: 4px 0;
    font-size: 12px;
    line-height: 1.4;
    color: var(--color-ink-dim);
}

/* ---- Controlo + ETA ------------------------------------------------------------ */
.ctrl[b-kfvrum5ad4] {
    background: var(--color-panel-2);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 6px;
    padding: 10px;
    margin-bottom: 16px;
}

.ctrl .run[b-kfvrum5ad4] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 700;
    color: #8be7b0;
}

.ctrl .run.paused[b-kfvrum5ad4] {
    color: var(--color-warn);
}

.ctrl .run .dot[b-kfvrum5ad4] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #2ecc71;
    box-shadow: 0 0 6px #2ecc71;
}

.eta[b-kfvrum5ad4] {
    margin: 4px 0 2px;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-ink);
}

.bar[b-kfvrum5ad4] {
    height: 6px;
    margin: 5px 0 4px;
    background: rgba(255, 255, 255, .08);
    border-radius: 3px;
    overflow: hidden;
}

.bar > i[b-kfvrum5ad4] {
    display: block;
    height: 100%;
    background: var(--color-cta);
    transition: width .3s ease;
}

/* 2ª barra (progresso do sub-passo) — mais fina e em teal, secundária face à geral (verde). */
.bar.sub[b-kfvrum5ad4] {
    height: 4px;
    margin: 2px 0 3px;
}

.bar.sub > i[b-kfvrum5ad4] {
    background: var(--color-data);
}

/* Os <small> do bloco de publicação (progresso global + "x% deste passo") não herdavam cor → ficavam a
   preto do UA sobre o painel escuro (ilegível). Dá-lhes o mesmo token de texto secundário do .ctrl small. */
.publish small[b-kfvrum5ad4] {
    color: var(--color-ink-section);
}

.ctrl small[b-kfvrum5ad4] {
    display: block;
    font-size: 10px;
    color: var(--color-ink-section);
}

/* ---- Stepper do paralelismo (só idle/pausado) ---------------------------------- */
.par[b-kfvrum5ad4] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

.par-lbl[b-kfvrum5ad4] {
    font-size: 11px;
    font-weight: 700;
    color: var(--color-ink-dim);
}

.par-step[b-kfvrum5ad4] {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
}

.par-b[b-kfvrum5ad4] {
    width: 22px;
    height: 22px;
    padding: 0;
    background: var(--color-panel);
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 4px;
    color: var(--color-ink);
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.par-b:hover:not(:disabled)[b-kfvrum5ad4] {
    filter: brightness(1.3);
}

.par-b:disabled[b-kfvrum5ad4] {
    opacity: .35;
    cursor: default;
}

.par-n[b-kfvrum5ad4] {
    min-width: 20px;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
    color: var(--color-ink);
}

.par-max[b-kfvrum5ad4] {
    font-size: 10px;
    color: var(--color-ink-section);
}

.btns[b-kfvrum5ad4] {
    display: flex;
    gap: 6px;
    margin-top: 8px;
}

.b[b-kfvrum5ad4] {
    flex: 1;
    text-align: center;
    padding: 7px 0;
    background: none;
    border: 1px solid;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.b.start[b-kfvrum5ad4] {
    flex: 1 1 100%;
    background: #0f5132;
    border-color: #1f6b3f;
    color: #8be7b0;
}

.b.resume[b-kfvrum5ad4] {
    background: #0f5132;
    border-color: #1f6b3f;
    color: #8be7b0;
}

.b.pause[b-kfvrum5ad4] {
    background: #2a230e;
    border-color: #6b5a1f;
    color: #e7d18b;
}

.b.stop[b-kfvrum5ad4] {
    background: #2a0e0e;
    border-color: #6b1f1f;
    color: #e78b8b;
}

.b:hover[b-kfvrum5ad4] {
    filter: brightness(1.15);
}

/* ---- Detalhe da célula selecionada ---------------------------------------------- */
.selhdr[b-kfvrum5ad4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 4px 0 8px;
}

.selhdr h4[b-kfvrum5ad4] {
    margin: 0;
    font-size: 13px;
    color: var(--color-ink);
}

.badge[b-kfvrum5ad4] {
    padding: 2px 8px;
    background: rgba(255, 255, 255, .08);
    border-radius: 10px;
    color: var(--color-ink-dim);
    font-size: 10px;
    font-weight: 700;
}

.badge.por_fazer[b-kfvrum5ad4] { background: var(--st-fazer-bg); color: var(--st-fazer-fg); }
.badge.feito[b-kfvrum5ad4] { background: var(--st-feito-bg); color: var(--st-feito-fg); }
.badge.erro[b-kfvrum5ad4] { background: var(--st-erro-bg); color: var(--st-erro-fg); }
.badge.a_processar[b-kfvrum5ad4] { background: var(--st-proc-bg); color: var(--st-proc-fg); }
.badge.na_fila[b-kfvrum5ad4] { background: var(--st-fila-bg); color: var(--st-fila-fg); }

.rows[b-kfvrum5ad4] {
    margin-bottom: 8px;
}

.rows .r[b-kfvrum5ad4] {
    display: flex;
    justify-content: space-between;
    padding: 4px 0;
    border-bottom: 1px dashed rgba(255, 255, 255, .08);
    font-size: 12px;
    color: var(--color-ink-section);
}

.rows .r b[b-kfvrum5ad4] {
    color: var(--color-ink);
    font-weight: 600;
}

.erro[b-kfvrum5ad4] {
    margin: 6px 0;
    font-size: 12px;
    color: var(--color-error);
}

.rbtn[b-kfvrum5ad4] {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 8px 0;
    background: var(--color-panel);
    border: 1px solid rgba(63, 214, 196, .3);
    border-radius: 5px;
    color: var(--color-data);
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.rbtn:hover[b-kfvrum5ad4] {
    filter: brightness(1.15);
}

/* ---- Legenda dos estados da grelha (cores = CELL_COLORS/cells-aviso do map.js) --------------- */
.proc-legend[b-kfvrum5ad4] {
    position: absolute;
    left: 12px;
    bottom: 12px;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    max-width: 340px;
    gap: 6px 10px;
    padding: 6px 10px;
    background: rgba(13, 15, 20, .78);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 6px;
}

.lg-item[b-kfvrum5ad4] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 10px;
    color: var(--color-ink-dim);
}

.lg-dot[b-kfvrum5ad4] {
    width: 9px;
    height: 9px;
    border-radius: 2px;
    flex-shrink: 0;
}

.lg-dot.por_fazer[b-kfvrum5ad4] { background: var(--st-fazer-dot); }
.lg-dot.na_fila[b-kfvrum5ad4] { background: var(--st-fila-dot); }
.lg-dot.a_processar[b-kfvrum5ad4] { background: var(--st-proc-dot); }
.lg-dot.feito[b-kfvrum5ad4] { background: var(--st-feito-dot); }
.lg-dot.erro[b-kfvrum5ad4] { background: var(--st-erro-dot); }

/* ---- Seleção múltipla por retângulo (Ctrl+arrasto) — bloco no fundo do painel ---------------- */
.multisel[b-kfvrum5ad4] {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, .08);
}

.ms-help[b-kfvrum5ad4] {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--color-ink-dim);
}

.ms-help b[b-kfvrum5ad4] {
    color: var(--color-data);
    font-weight: 700;
}

.ms-count[b-kfvrum5ad4] {
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 700;
    color: #7fe9ff;
}

.ms-clear[b-kfvrum5ad4] {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 6px 0;
    background: none;
    border: none;
    color: var(--color-ink-section);
    font-size: 11px;
    cursor: pointer;
    text-decoration: underline;
}

.ms-clear:hover[b-kfvrum5ad4] {
    color: var(--color-ink-dim);
}

/* ---- Publicação (fase 3) -------------------------------------------------------- */
.publish[b-kfvrum5ad4] {
    margin-bottom: 16px;
}

.publish .pub-run[b-kfvrum5ad4] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 700;
    color: #8be7b0;
}

/* .dot só está definida como .ctrl .run .dot no bloco acima — o painel de publicação não é filho de
   .ctrl .run, por isso repete-se aqui o mesmo estilo (senão o indicador fica invisível). */
.publish .pub-run .dot[b-kfvrum5ad4] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #2ecc71;
    box-shadow: 0 0 6px #2ecc71;
}

.publish-btn[b-kfvrum5ad4] {
    width: 100%;
    margin-top: 2px;
    /* Azul "publicar" — ação de promoção, distinta do verde Iniciar / amarelo Pausar / vermelho Parar. */
    background: #12294a;
    border-color: #2a5599;
    color: #9cc2f0;
    font-weight: 700;
}

/* ---- Painéis "Último processamento" / "Última publicação" (reutilizam .selhdr/.rows/.r do detalhe) --- */
.proc-stats[b-kfvrum5ad4],
.pub-stats[b-kfvrum5ad4] {
    margin-bottom: 10px;
}

.pub-done[b-kfvrum5ad4] {
    margin: 6px 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: #8be7b0;
}

.pub-done a[b-kfvrum5ad4] {
    color: var(--color-data);
}
/* /Components/Pages/Rotas.razor.rz.scp.css */
/* Layout full-bleed: o mapa enche a viewport, o cartão fica por cima (não numa coluna ao lado). */
.rotas[b-1yerge1dcm] {
    position: relative;
    height: 100vh;
    width: 100%;
    overflow: hidden;
}

.rotas-map[b-1yerge1dcm] {
    position: absolute;
    inset: 0;
}

/* Cartão flutuante escuro — molde do Mass Viewer (sample/g10-viewer-mass.png). */
.rotas-panel[b-1yerge1dcm] {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 10;
    box-sizing: border-box;
    width: 300px;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    padding: 16px;
    background: var(--color-panel);
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .3);
}

/* Wordmark de marca — SVG que escala o texto até encher a largura do cartão: auto-fit,
   sempre 1 linha e no tamanho máximo; reescala sozinho se a janela mudar (sem font-size mágico).
   textLength força o texto à largura do viewBox (268 = largura útil); width:100% escala o SVG
   inteiro à largura real da janela. O font-size 25 mantém a largura natural ≈ 268 → sem distorção. */
.brand[b-1yerge1dcm] {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 0 10px;
    fill: var(--color-data);   /* herdado pelo traço (rect) E pelo texto do wordmark */
}

.brand text[b-1yerge1dcm] {
    font-family: inherit;
    font-size: 25px;
    font-weight: 800;
}

/* "Calcular rota" desce a subtítulo — a marca passa a ser o título visual. */
.rotas-panel h2[b-1yerge1dcm] {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--color-ink-section);
}

.hint[b-1yerge1dcm] {
    margin: 0 0 14px;
    font-size: 12px;
    line-height: 1.4;
    color: var(--color-ink-dim);
}

.road-toggle[b-1yerge1dcm] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-size: 12px;
    color: var(--color-ink-dim);
    cursor: pointer;
}

.road-toggle input[type="checkbox"][b-1yerge1dcm] {
    width: 14px;
    height: 14px;
    accent-color: var(--color-cta);
    cursor: pointer;
}

.endpoint[b-1yerge1dcm] {
    position: relative;
    margin: 16px 0 14px;
}

.endpoint label[b-1yerge1dcm] {
    display: block;
    margin-bottom: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--color-ink-section);
}

.endpoint select[b-1yerge1dcm],
.endpoint input[b-1yerge1dcm] {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 34px;
    margin-bottom: 6px;
    padding: 0 10px;
    background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 4px;
    color: var(--color-ink);
    font-size: 13px;
}

.endpoint select[b-1yerge1dcm] {
    appearance: none;
    padding-right: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%237c8da0' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 10px;
}

.endpoint select:focus[b-1yerge1dcm],
.endpoint input:focus[b-1yerge1dcm] {
    outline: none;
    border-color: var(--color-data);
}

.endpoint input[b-1yerge1dcm]::placeholder {
    color: var(--color-ink-dim);
}

.endpoint-trigger[b-1yerge1dcm] {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 34px;
    padding: 0 10px;
    text-align: left;
    background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 4px;
    color: var(--color-ink);
    font-size: 13px;
    cursor: pointer;
}
.endpoint-trigger:hover[b-1yerge1dcm] { border-color: var(--color-data); }
/* Sem província a cx fica esmaecida (por usar) mas CLICÁVEL — o clique mostra o balão de info
   (um botão `disabled` não receberia o clique). */
.endpoint-trigger.is-locked[b-1yerge1dcm] { color: var(--color-ink-dim); opacity: .7; }

/* Balão de info suave: FLUTUA por baixo da cx (position:absolute → fora do fluxo, NÃO desloca o
   layout — evita o "yo-yo"). Sobrepõe-se ao conteúdo abaixo; por isso fundo opaco + sombra. Desvanece
   sozinho (~4s). Ancorado ao .endpoint (que é position:relative). */
.lock-hint[b-1yerge1dcm] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 30;
    margin-top: 4px;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    padding: 7px 9px;
    background: var(--color-panel);
    border: 1px solid rgba(63, 214, 196, .45);
    border-radius: 6px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .45);
    color: var(--color-ink);
    font-size: 12px;
    line-height: 1.35;
    pointer-events: none;
    animation: lock-hint-fade-b-1yerge1dcm 4s ease forwards;
}
.lock-hint-ico[b-1yerge1dcm] { flex: none; color: var(--color-data); font-weight: 700; }
@keyframes lock-hint-fade-b-1yerge1dcm {
    0%   { opacity: 0; transform: translateY(-3px); }
    10%  { opacity: 1; transform: translateY(0); }
    75%  { opacity: 1; }
    100% { opacity: 0; transform: translateY(0); }
}

.calc-btn[b-1yerge1dcm] {
    display: block;
    width: 100%;
    margin-top: 4px;
    padding: 10px;
    background: var(--color-cta);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: filter .15s ease;
}

.calc-btn:hover:not(:disabled)[b-1yerge1dcm] {
    filter: brightness(1.08);
}

.calc-btn:disabled[b-1yerge1dcm] {
    background: var(--color-field);
    color: var(--color-ink-dim);
    cursor: not-allowed;
    opacity: .7;
}

.calc-status[b-1yerge1dcm] {
    margin-top: 10px;
    font-size: 12px;
    color: var(--color-ink-dim);
}

.calc-error[b-1yerge1dcm] {
    margin-top: 10px;
    font-size: 12px;
    color: var(--color-error);
}

.routes[b-1yerge1dcm] {
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
}

.routes li[b-1yerge1dcm] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 4px 16px;
    padding: 10px 12px;
    margin-bottom: 8px;
    background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .06);
    border-radius: 6px;
    cursor: pointer;
    transition: border-color .15s ease;
}

.routes li:hover[b-1yerge1dcm] {
    border-color: var(--color-data);
}

.routes li.sel[b-1yerge1dcm] {
    border-color: var(--color-data);
    box-shadow: inset 0 0 0 1px var(--color-data);
}

.routes li .rt[b-1yerge1dcm] {
    flex-basis: 100%;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--color-ink-section);
}

.kpi[b-1yerge1dcm] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1 1 auto;
    min-width: 70px;
}

.kpi-value[b-1yerge1dcm] {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-ink);
}

.kpi-label[b-1yerge1dcm] {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--color-ink-section);
}

.gmaps-link[b-1yerge1dcm] {
    display: inline-block;
    margin-top: 8px;
    font-size: 12px;
    font-weight: 600;
    color: var(--color-data);
    text-decoration: none;
}

.gmaps-link:hover[b-1yerge1dcm] {
    text-decoration: underline;
}
/* /Components/PoiPickerModal.razor.rz.scp.css */
.modal-backdrop[b-2p0mg5qpea] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .55);
}

.modal-card[b-2p0mg5qpea] {
    display: flex;
    flex-direction: column;
    width: 90vw;
    height: 90vh;
    box-sizing: border-box;
    background: var(--color-panel);
    border-radius: 10px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
    color: var(--color-ink);
    outline: none;
    overflow: hidden;
}

.modal-head[b-2p0mg5qpea] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.modal-head h3[b-2p0mg5qpea] { margin: 0; font-size: 16px; font-weight: 700; }

.modal-close[b-2p0mg5qpea] {
    background: none; border: none; color: var(--color-ink-dim);
    font-size: 24px; line-height: 1; cursor: pointer;
}
.modal-close:hover[b-2p0mg5qpea] { color: var(--color-ink); }

.modal-tools[b-2p0mg5qpea] {
    display: flex; align-items: center; gap: 12px;
    padding: 12px 18px; border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.modal-search[b-2p0mg5qpea] {
    flex: 1 1 260px; max-width: 360px; height: 34px; box-sizing: border-box;
    padding: 0 10px; background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .1); border-radius: 6px; color: var(--color-ink);
}
.modal-search:focus[b-2p0mg5qpea] { outline: none; border-color: var(--color-data); }

.chips[b-2p0mg5qpea] { display: flex; gap: 6px; }
.chip[b-2p0mg5qpea] {
    padding: 5px 12px; background: var(--color-field);
    border: 1px solid rgba(255, 255, 255, .1); border-radius: 999px;
    color: var(--color-ink-dim); font-size: 12px; font-weight: 600; cursor: pointer;
}
.chip.active[b-2p0mg5qpea] { background: var(--color-data); color: #06231f; border-color: var(--color-data); }

.count[b-2p0mg5qpea] { margin-left: auto; font-size: 12px; color: var(--color-ink-dim); }

.modal-table[b-2p0mg5qpea] { flex: 1 1 auto; overflow: auto; }
.modal-table table[b-2p0mg5qpea] { width: 100%; border-collapse: collapse; font-size: 13px; }

.modal-table thead th[b-2p0mg5qpea] {
    position: sticky; top: 0; z-index: 1;
    background: var(--color-panel);
    padding: 8px 10px; text-align: left; white-space: nowrap;
    font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
    color: var(--color-ink-section);
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.modal-table th.sortable[b-2p0mg5qpea] { cursor: pointer; user-select: none; }
.modal-table th.sortable:hover[b-2p0mg5qpea] { color: var(--color-ink); }

.modal-table tbody td[b-2p0mg5qpea] {
    padding: 7px 10px; border-bottom: 1px solid rgba(255, 255, 255, .05);
    white-space: nowrap;
}
.modal-table tbody tr[b-2p0mg5qpea] { cursor: pointer; }
.modal-table tbody tr:hover td[b-2p0mg5qpea] { background: rgba(63, 214, 196, .10); }