/* ============================================================================
   JuriX Design System — "Autos Modernos"
   A gravidade de uma banca tradicional + a precisão de um instrumento moderno.
   Direção completa em .interface-design/system.md
   ----------------------------------------------------------------------------
   Regras de ouro:
   - Profundidade = bordas + variação de superfície. Sombra SÓ em overlays.
   - --jx-lacre é EXCLUSIVO de fatalidade (prazo fatal, risco crítico).
   - Números processuais (CNJ) sempre em --jx-mono.
   - Serif (--jx-serif) só em títulos de página e números de destaque.
   ============================================================================ */

:root {
    /* Papel & tinta (superfícies e texto) */
    --jx-papel: #f5f3ee;            /* canvas — papel dos autos */
    --jx-superficie: #fffefb;       /* cartão (nível 1) */
    --jx-superficie-2: #ffffff;     /* overlay: dropdown/modal (nível 2) */
    --jx-inset: #edeae2;            /* inputs — "recebe conteúdo", mais escuro */

    --jx-tinta: #1d2433;            /* texto primário */
    --jx-tinta-2: #4a5266;          /* secundário */
    --jx-tinta-3: #79819a;          /* terciário / metadado */
    --jx-tinta-4: #a8adbd;          /* muted / placeholder */

    --jx-borda: rgba(29, 36, 51, .12);
    --jx-borda-suave: rgba(29, 36, 51, .07);
    --jx-borda-enfase: rgba(29, 36, 51, .22);

    /* Marca */
    --jx-marinho: #1d2e50;          /* ação primária */
    --jx-marinho-2: #274070;        /* hover */
    --jx-marinho-bg: rgba(29, 46, 80, .07);
    --jx-latao: #9a7b25;            /* acento — atenção, ativo, destaque */
    --jx-latao-claro: #d8b95c;      /* latão sobre fundo escuro */
    --jx-latao-bg: rgba(154, 123, 37, .10);

    /* Semânticos */
    --jx-lacre: #9b1c3c;            /* EXCLUSIVO: fatal / crítico */
    --jx-lacre-bg: rgba(155, 28, 60, .08);
    --jx-verde: #2e6b4f;            /* positivo — lâmpada de biblioteca */
    --jx-verde-bg: rgba(46, 107, 79, .10);

    /* Tipografia */
    --jx-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
    --jx-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --jx-mono: 'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;

    /* Sidebar (tinta escura) */
    --jx-sb-bg: #141d30;
    --jx-sb-item: rgba(226, 232, 240, .78);
    --jx-sb-ico: #8fa3c8;
    --jx-sb-borda: rgba(255, 255, 255, .07);

    /* Sombra — SÓ overlays (dropdown, modal, popover) */
    --jx-sombra-overlay: 0 16px 48px rgba(29, 36, 51, .18);

    /* Raio: 10 controles · 14 cartões · 16 modais */
    --jx-r-controle: 10px;
    --jx-r-cartao: 14px;
    --jx-r-modal: 16px;

    /* Layout */
    --sb-w: 266px;
    --rail-w: 76px;

    /* Compat: aliases antigos (telas legadas ainda referenciam) */
    --azul: var(--jx-marinho);
    --azul2: var(--jx-marinho-2);
    --azul-bright: #3563b8;
    --azul-200: #9db4dd;
    --dourado: var(--jx-latao);
    --dourado-bright: var(--jx-latao-claro);
    --ink: var(--jx-tinta);
    --muted: var(--jx-tinta-3);
    --border: var(--jx-borda);

    /* Bootstrap re-base */
    --bs-body-bg: var(--jx-papel);
    --bs-body-color: var(--jx-tinta);
    --bs-border-color: var(--jx-borda);
}

* { scrollbar-width: thin; scrollbar-color: rgba(121, 129, 154, .45) transparent; }

body {
    background: var(--jx-papel);
    color: var(--jx-tinta);
    font-family: var(--jx-sans);
    font-size: .925rem;
}

/* Links na paleta — nunca o azul default do Bootstrap */
a { color: var(--jx-marinho); }
a:hover { color: var(--jx-marinho-2); }

/* ===== Tipografia ===== */
.jx-ptitle, .jx-page-title {
    font-family: var(--jx-serif);
    font-weight: 600;
    color: var(--jx-tinta);
    letter-spacing: -.01em;
}
h3.text-jurix { font-family: var(--jx-serif); font-weight: 600; letter-spacing: -.01em; }
.text-jurix { color: var(--jx-marinho); }

/* CNJ e números processuais — código estruturado, não texto */
.jx-cnj, code {
    font-family: var(--jx-mono);
    font-size: .84em;
    color: var(--jx-tinta-2);
    letter-spacing: .01em;
    font-variant-numeric: tabular-nums;
}
td code, td .jx-cnj { white-space: nowrap; }
.jx-num { font-variant-numeric: tabular-nums; }

/* ===== Lombada de autos — etiqueta lateral semântica ===== */
.jx-lombada { border-left: 3px solid var(--jx-borda-enfase) !important; }
.jx-lombada-fatal { border-left: 3px solid var(--jx-lacre) !important; }
.jx-lombada-atencao { border-left: 3px solid var(--jx-latao) !important; }
.jx-lombada-ok { border-left: 3px solid var(--jx-verde) !important; }
.jx-lombada-info { border-left: 3px solid var(--jx-marinho) !important; }

/* ===== Selo de lacre — fatalidade, uso exclusivo ===== */
.jx-selo {
    display: inline-flex; align-items: center; gap: .38em;
    background: var(--jx-lacre-bg); color: var(--jx-lacre);
    border: 1px solid rgba(155, 28, 60, .25);
    border-radius: 999px; padding: .18em .7em .18em .55em;
    font-size: .74rem; font-weight: 600; white-space: nowrap;
}
.jx-selo::before { content: ''; width: .5em; height: .5em; border-radius: 50%; background: var(--jx-lacre); }

/* Chip neutro (etiquetas, metadados) */
.jx-chip {
    display: inline-flex; align-items: center; gap: .35em;
    background: var(--jx-superficie); color: var(--jx-tinta-2);
    border: 1px solid var(--jx-borda); border-radius: 999px;
    padding: .2em .7em; font-size: .76rem; font-weight: 500; white-space: nowrap;
}

/* ===== Stat tile — número de destaque em serif ===== */
.jx-stat .jx-stat-label {
    font-size: .7rem; font-weight: 600; letter-spacing: .07em;
    text-transform: uppercase; color: var(--jx-tinta-3);
}
.jx-stat .jx-stat-valor {
    font-family: var(--jx-serif); font-weight: 700; font-size: 1.9rem;
    line-height: 1.15; color: var(--jx-tinta); font-variant-numeric: tabular-nums;
}
.jx-stat .jx-stat-valor.fatal { color: var(--jx-lacre); }
.jx-stat .jx-stat-valor.atencao { color: var(--jx-latao); }
.jx-stat .jx-stat-valor.ok { color: var(--jx-verde); }
.jx-stat .jx-stat-sub { font-size: .76rem; color: var(--jx-tinta-3); }

/* ===== Cartões — sólidos, borda define, sem sombra ===== */
.card {
    border: 1px solid var(--jx-borda);
    border-radius: var(--jx-r-cartao);
    background: var(--jx-superficie);
    box-shadow: none;
}
.card .card-header { background: transparent; border-bottom: 1px solid var(--jx-borda-suave); }
a > .card { transition: border-color .14s; }
a > .card:hover { border-color: var(--jx-borda-enfase); }

/* ===== Botões ===== */
.btn { border-radius: var(--jx-r-controle); }
.btn-jurix { background: var(--jx-marinho); color: #fff; border: 1px solid var(--jx-marinho); font-weight: 600; }
.btn-jurix:hover, .btn-jurix:focus { background: var(--jx-marinho-2); border-color: var(--jx-marinho-2); color: #fff; }
.btn-jurix:focus-visible { box-shadow: 0 0 0 3px rgba(29, 46, 80, .25); }
.btn-jurix-soft { background: transparent; color: var(--jx-marinho); border: 1px solid rgba(29, 46, 80, .28); font-weight: 500; }
.btn-jurix-soft:hover { background: var(--jx-marinho-bg); color: var(--jx-marinho); border-color: rgba(29, 46, 80, .4); }
.btn-primary { --bs-btn-bg: var(--jx-marinho); --bs-btn-border-color: var(--jx-marinho); --bs-btn-hover-bg: var(--jx-marinho-2); --bs-btn-hover-border-color: var(--jx-marinho-2); }
.btn-outline-primary { --bs-btn-color: var(--jx-marinho); --bs-btn-border-color: rgba(29,46,80,.35); --bs-btn-hover-bg: var(--jx-marinho); --bs-btn-hover-border-color: var(--jx-marinho); }

/* ===== Formulários — input é "inset" ===== */
.form-control, .form-select {
    background: var(--jx-inset); border: 1px solid var(--jx-borda);
    border-radius: var(--jx-r-controle); color: var(--jx-tinta);
}
.form-control::placeholder { color: var(--jx-tinta-4); }
.form-control:focus, .form-select:focus {
    background: var(--jx-superficie-2); border-color: var(--jx-marinho);
    box-shadow: 0 0 0 3px rgba(29, 46, 80, .14); color: var(--jx-tinta);
}
.form-label { color: var(--jx-tinta-2); font-weight: 500; }
.form-check-input:checked { background-color: var(--jx-marinho); border-color: var(--jx-marinho); }

/* ===== Badges — paleta contida com significado ===== */
.badge { font-weight: 600; border-radius: 7px; letter-spacing: .01em; }
.badge.bg-danger { background: var(--jx-lacre) !important; }
.badge.bg-warning, .badge.text-bg-warning { background: var(--jx-latao-bg) !important; color: var(--jx-latao) !important; border: 1px solid rgba(154,123,37,.3); }
.badge.bg-success { background: var(--jx-verde) !important; }
.badge.bg-primary, .badge.bg-info { background: var(--jx-marinho) !important; color: #fff !important; }
.badge.bg-secondary { background: transparent !important; color: var(--jx-tinta-3) !important; border: 1px solid var(--jx-borda-enfase); }
.badge.bg-dark { background: var(--jx-tinta) !important; }
.badge.bg-light, .badge.text-bg-light { background: var(--jx-superficie) !important; color: var(--jx-tinta-2) !important; border: 1px solid var(--jx-borda); }

/* ===== Alertas — quietos, com lombada ===== */
.alert { border: 1px solid var(--jx-borda); border-radius: var(--jx-r-cartao); background: var(--jx-superficie); color: var(--jx-tinta-2); }
.alert-success { border-left: 3px solid var(--jx-verde); }
.alert-success i, .alert-success .fa-circle-check { color: var(--jx-verde); }
.alert-danger { border-left: 3px solid var(--jx-lacre); }
.alert-warning { border-left: 3px solid var(--jx-latao); }
.alert-info { border-left: 3px solid var(--jx-marinho); }

/* ===== Tabelas ===== */
.table { --bs-table-hover-bg: rgba(29, 36, 51, .028); color: var(--jx-tinta); }
.table thead th, .table .table-light th {
    background: var(--jx-papel); color: var(--jx-tinta-3);
    font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
    border-bottom: 1px solid var(--jx-borda);
}
.table td { border-color: var(--jx-borda-suave); }
.table .bg-light, tr.collapse td.bg-light { background: var(--jx-papel) !important; }

/* ===== Dropdowns & modais — nível 2, ÚNICO lugar com sombra ===== */
.dropdown-menu {
    background: var(--jx-superficie-2); border: 1px solid var(--jx-borda);
    border-radius: 12px; box-shadow: var(--jx-sombra-overlay);
}
/* Modais levam o traço fino de latão ao redor (a "encadernação" — mesma identidade
   do fio de latão do cartão de login). */
.modal-content, .jx-glass-modal {
    background: var(--jx-superficie-2); border: 1px solid rgba(154, 123, 37, .38);
    border-top: 3px solid var(--jx-latao);
    border-radius: var(--jx-r-modal); box-shadow: var(--jx-sombra-overlay);
    backdrop-filter: none; -webkit-backdrop-filter: none;
}

.pagination { --bs-pagination-active-bg: var(--jx-marinho); --bs-pagination-active-border-color: var(--jx-marinho); --bs-pagination-color: var(--jx-marinho); }

/* ============================================================================
   LAYOUT DA APLICAÇÃO (sidebar + topbar + conteúdo)
   ============================================================================ */

.jx-sidebar {
    position: fixed; top: 0; left: 0; height: 100vh; width: var(--sb-w); z-index: 1045;
    display: flex; flex-direction: column;
    background: var(--jx-sb-bg);
    border-right: 1px solid var(--jx-sb-borda);
    transition: width .22s cubic-bezier(.4, 0, .2, 1), transform .25s ease;
}

.jx-edge-toggle {
    position: absolute; top: 50%; right: -13px; transform: translateY(-50%); z-index: 5;
    width: 26px; height: 26px; border-radius: 50%;
    border: 1px solid var(--jx-borda-enfase); background: var(--jx-superficie-2); color: var(--jx-tinta-3);
    display: grid; place-items: center; font-size: .68rem; cursor: pointer; transition: .15s;
}
.jx-edge-toggle:hover { color: var(--jx-marinho); border-color: var(--jx-marinho); }
.jx-edge-toggle i { transition: transform .22s; }
body.jx-collapsed .jx-edge-toggle i { transform: rotate(180deg); }

.jx-sbhead { display: flex; align-items: center; gap: .6rem; padding: 1.05rem 1rem .7rem; }
.jx-brand {
    font-family: var(--jx-serif); font-weight: 700; font-size: 1.45rem; color: #fff;
    letter-spacing: -.01em; text-decoration: none; line-height: 1; white-space: nowrap;
}
.jx-brand span { color: var(--jx-latao-claro); }
.jx-brand i { color: var(--jx-latao-claro); margin-right: .3rem; font-size: 1.05rem; vertical-align: 2px; }
.jx-pin { margin-left: auto; width: 32px; height: 32px; flex: none; border: 0; border-radius: 9px; background: rgba(255,255,255,.06); color: rgba(226,232,240,.7); transition: .15s; }
.jx-pin:hover { background: rgba(255,255,255,.13); color: #fff; }

.jx-search { position: relative; padding: .2rem .8rem .7rem; }
.jx-search i { position: absolute; left: 1.35rem; top: 42%; transform: translateY(-50%); color: rgba(143,163,200,.75); font-size: .78rem; }
.jx-search input {
    width: 100%; border: 1px solid rgba(255,255,255,.09); border-radius: 10px;
    background: rgba(255,255,255,.05); color: #fff; padding: .48rem .7rem .48rem 2.1rem; font-size: .84rem; outline: none; transition: .15s;
}
.jx-search input::placeholder { color: rgba(203,213,225,.5); }
.jx-search input:focus { background: rgba(255,255,255,.09); border-color: rgba(216,185,92,.45); box-shadow: 0 0 0 3px rgba(216,185,92,.12); }

.jx-nav { flex: 1 1 auto; overflow-y: auto; overflow-x: hidden; padding: .2rem .15rem 1rem; }
.jx-section {
    font-size: .62rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
    color: rgba(143,163,200,.55); padding: .9rem 1.15rem .35rem; white-space: nowrap;
}

.jx-item {
    display: flex; align-items: center; gap: .7rem; padding: .52rem .7rem; margin: .1rem .55rem;
    border-radius: 10px; color: var(--jx-sb-item); text-decoration: none; font-size: .875rem;
    font-weight: 500; white-space: nowrap; transition: background .14s, color .14s; cursor: pointer;
}
.jx-item:hover { background: rgba(255,255,255,.06); color: #fff; }
.jx-item.active { background: rgba(216,185,92,.10); color: #fff; box-shadow: inset 3px 0 0 var(--jx-latao-claro); }
.jx-ico { width: 22px; flex: none; text-align: center; font-size: .95rem; color: var(--jx-sb-ico); }
.jx-item.active .jx-ico { color: var(--jx-latao-claro); }
.jx-label { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; }
.jx-chev { font-size: .7rem; color: rgba(143,163,200,.6); transition: transform .2s; flex: none; }

.jx-group.open > .jx-ghead .jx-chev { transform: rotate(90deg); }
.jx-group-items { max-height: 0; overflow: hidden; transition: max-height .25s ease; }
.jx-group.open > .jx-group-items { max-height: 520px; }
.jx-group-items .jx-item { margin-left: 1.35rem; font-size: .84rem; padding: .42rem .7rem; }
.jx-group-items .jx-item .jx-ico { font-size: .82rem; }

.jx-sbfoot { padding: .6rem .8rem 1rem; border-top: 1px solid var(--jx-sb-borda); }
.jx-user { display: flex; align-items: center; gap: .6rem; color: #e2e8f0; font-size: .82rem; padding: .3rem .35rem; white-space: nowrap; }
.jx-avatar {
    width: 34px; height: 34px; flex: none; border-radius: 50%; display: grid; place-items: center;
    background: var(--jx-marinho-2); border: 1px solid rgba(216,185,92,.4);
    color: #fff; font-weight: 700; font-size: .85rem;
}

/* Rail recolhido */
body.jx-collapsed .jx-sidebar { width: var(--rail-w); }
body.jx-collapsed .jx-main { margin-left: var(--rail-w); }
body.jx-collapsed .jx-label,
body.jx-collapsed .jx-chev,
body.jx-collapsed .jx-section,
body.jx-collapsed .jx-search,
body.jx-collapsed .jx-user span { opacity: 0; visibility: hidden; width: 0; }
body.jx-collapsed .jx-item, body.jx-collapsed .jx-ghead { justify-content: center; }
body.jx-collapsed .jx-group-items { max-height: 0 !important; }
body.jx-collapsed .jx-sbhead { justify-content: center; padding: 1.05rem .25rem .7rem; }
body.jx-collapsed .jx-brand { font-size: 0; }
body.jx-collapsed .jx-brand i { font-size: 1.35rem; margin: 0; }
body.jx-collapsed .jx-pin { display: none; }

/* Main + topbar */
.jx-main { margin-left: var(--sb-w); min-height: 100vh; transition: margin-left .22s cubic-bezier(.4, 0, .2, 1); display: flex; flex-direction: column; }
.jx-topbar {
    position: sticky; top: 0; z-index: 1035; height: 60px;
    display: flex; align-items: center; gap: .75rem; padding: 0 1.15rem;
    background: rgba(245, 243, 238, .94); border-bottom: 1px solid var(--jx-borda);
}
.jx-ptitle { font-size: 1.06rem; }
.jx-tbtn { width: 38px; height: 38px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--jx-tinta-2); transition: .14s; position: relative; }
.jx-tbtn:hover { background: var(--jx-superficie-2); color: var(--jx-marinho); border-color: var(--jx-borda); }
.jx-ham { display: none; }
.jx-content { padding: 1.4rem 1.4rem 3rem; flex: 1 1 auto; }
.jx-notif-badge { position: absolute; top: 4px; right: 4px; font-size: .55rem; }

/* Cronômetro (topbar) — latão = trabalho em curso */
.jx-timer-chip {
    display: none; align-items: center; gap: .45rem; height: 38px; padding: 0 .8rem;
    border: 1px solid rgba(154, 123, 37, .45); border-radius: 999px;
    background: var(--jx-latao-bg); color: var(--jx-tinta); cursor: pointer;
    font-size: .8rem; font-weight: 500; transition: border-color .14s;
}
.jx-timer-chip.ativo { display: inline-flex; }
.jx-timer-chip:hover { border-color: var(--jx-latao); }
.jx-timer-chip .tempo { font-family: var(--jx-mono); font-variant-numeric: tabular-nums; color: var(--jx-latao); font-weight: 600; }
.jx-timer-chip .proc { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--jx-tinta-2); }
@media (max-width: 768px) { .jx-timer-chip .proc { display: none; } }

.jx-backdrop { position: fixed; inset: 0; background: rgba(20, 29, 48, .5); z-index: 1044; opacity: 0; visibility: hidden; transition: .2s; }

@media (max-width: 992px) {
    .jx-sidebar { transform: translateX(-100%); }
    body.jx-mobile .jx-sidebar { transform: none; }
    body.jx-mobile .jx-backdrop { opacity: 1; visibility: visible; }
    .jx-main { margin-left: 0 !important; }
    .jx-ham { display: inline-flex; align-items: center; justify-content: center; }
}

/* ============================================================================
   PÁGINAS DE ACESSO (login, 2FA) e PORTAL DO CLIENTE
   ============================================================================ */

.jx-acesso {
    margin: 0; min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: var(--jx-sb-bg); font-family: var(--jx-sans); color: var(--jx-tinta); padding: 1rem;
}
.jx-acesso-card {
    width: min(410px, 94vw); background: var(--jx-superficie); border-radius: var(--jx-r-modal);
    padding: 38px 34px 30px; border-top: 3px solid var(--jx-latao);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .45);
}
.jx-acesso-brand { text-align: center; margin-bottom: 6px; }
.jx-acesso-brand .logo { font-family: var(--jx-serif); font-size: 30px; font-weight: 700; color: var(--jx-tinta); letter-spacing: -.01em; }
.jx-acesso-brand .logo span { color: var(--jx-latao); }
.jx-acesso-brand .sub { color: var(--jx-tinta-3); font-size: 13px; margin-top: 5px; }
.jx-acesso label { display: block; font-size: 13px; font-weight: 500; color: var(--jx-tinta-2); margin: 16px 0 6px; }
.jx-acesso input:not([type=checkbox]) {
    width: 100%; padding: 11px 12px; border: 1px solid var(--jx-borda); border-radius: var(--jx-r-controle);
    font-size: 15px; background: var(--jx-inset); color: var(--jx-tinta); font-family: var(--jx-sans); box-sizing: border-box;
}
.jx-acesso input:focus { outline: none; background: var(--jx-superficie-2); border-color: var(--jx-marinho); box-shadow: 0 0 0 3px rgba(29, 46, 80, .14); }
.jx-acesso input[inputmode=numeric] { font-family: var(--jx-mono); letter-spacing: .35em; text-align: center; font-size: 20px; }
.jx-acesso button[type=submit] {
    width: 100%; margin-top: 22px; padding: 12px; border: 0; border-radius: var(--jx-r-controle); cursor: pointer;
    background: var(--jx-marinho); color: #fff; font-size: 15px; font-weight: 600; font-family: var(--jx-sans); transition: background .14s;
}
.jx-acesso button[type=submit]:hover { background: var(--jx-marinho-2); }
.jx-acesso .err {
    background: var(--jx-lacre-bg); color: var(--jx-lacre); border: 1px solid rgba(155, 28, 60, .3);
    border-left: 3px solid var(--jx-lacre); border-radius: var(--jx-r-controle); padding: 10px 12px; font-size: 13px; margin-top: 16px;
}
.jx-acesso .hint { color: var(--jx-tinta-3); font-size: 12.5px; margin-top: 8px; text-align: center; }
.jx-acesso .row { display: flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 13px; color: var(--jx-tinta-2); }
.jx-acesso details { margin-top: 18px; }
.jx-acesso summary { cursor: pointer; font-size: 13px; color: var(--jx-marinho); font-weight: 500; }
.jx-acesso .back { display: block; text-align: center; margin-top: 18px; font-size: 13px; color: var(--jx-tinta-3); text-decoration: none; }
.jx-acesso .back:hover { color: var(--jx-marinho); }
.jx-acesso .rodape { text-align: center; color: var(--jx-tinta-4); font-size: 11.5px; margin-top: 20px; }

/* Portal do cliente */
.jx-portal { background: var(--jx-papel); font-family: var(--jx-sans); color: var(--jx-tinta); }
.jx-portal .topo { background: var(--jx-sb-bg); color: #fff; border-bottom: 3px solid var(--jx-latao); }
.jx-portal .marca { font-family: var(--jx-serif); font-weight: 700; }
.jx-portal .marca span { color: var(--jx-latao-claro); }
.jx-portal h4 { font-family: var(--jx-serif); font-weight: 600; color: var(--jx-tinta); }
.jx-portal .timeline-item { border-left: 2px solid var(--jx-borda-enfase); padding: 0 0 1.05rem 1.05rem; position: relative; }
.jx-portal .timeline-item::before {
    content: ''; width: 9px; height: 9px; background: var(--jx-latao); border: 2px solid var(--jx-superficie);
    border-radius: 50%; position: absolute; left: -5.5px; top: 4px;
}
.jx-portal .timeline-item .carimbo { font-family: var(--jx-mono); font-size: .74rem; color: var(--jx-tinta-3); }

/* ===== Logo do escritório (personalização) — abaixo do brand na sidebar ===== */
.jx-logo-escritorio { padding: 2px 12px 10px; margin-bottom: 4px; text-align: center; border-bottom: 1px solid var(--jx-sb-borda); }
.jx-logo-escritorio img { max-width: 84%; max-height: 46px; object-fit: contain; }

/* Módulo travado por plano (CLI-F2) — aparece no menu com cadeado */
.jx-item.jx-locked { opacity: .58; }
.jx-item .jx-lock { margin-left: auto; font-size: .68rem; color: var(--jx-latao-claro); }

/* Tour guiado (CLI-F3) — spotlight + tooltip */
.jx-tour-hole { position: fixed; z-index: 20000; border-radius: 10px; box-shadow: 0 0 0 9999px rgba(20, 29, 48, .62); transition: all .2s ease; pointer-events: none; }
.jx-tour-tip { position: fixed; z-index: 20001; width: 280px; background: var(--jx-superficie-2); border: 1px solid var(--jx-latao); border-radius: 12px; box-shadow: var(--jx-sombra-overlay); padding: 14px 16px; }
.jx-tour-t { font-family: var(--jx-serif); font-weight: 700; color: var(--jx-marinho); font-size: .78rem; margin-bottom: 5px; }
.jx-tour-x { font-size: .88rem; color: var(--jx-tinta-2); line-height: 1.45; }
.jx-tour-btns { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }
.jx-tour-skip { background: none; border: 0; color: var(--jx-tinta-3); font-size: .82rem; cursor: pointer; }
.jx-tour-next { background: var(--jx-marinho); color: #fff; border: 0; border-radius: 8px; padding: 6px 15px; font-weight: 600; font-size: .85rem; cursor: pointer; }
.jx-tour-next:hover { background: var(--jx-marinho-2); }

/* ===== Impressão / PDF (P2.3 relatórios) — esconde o chrome, a tela vira o documento ===== */
@media print {
    .jx-sidebar, .jx-topbar, .no-print, .modal, .swal2-container { display: none !important; }
    .jx-main { margin: 0 !important; }
    .jx-content { padding: 0 !important; }
    body, .jx-main, .jx-content { background: #fff !important; }
    .card { border: 1px solid #ccc !important; box-shadow: none !important; break-inside: avoid; }
    .jx-lombada, .jx-lombada-info, .jx-lombada-atencao, .jx-lombada-ok, .jx-lombada-fatal { border-left: 3px solid #999 !important; }
    a[href]::after { content: '' !important; }
    @page { margin: 1.4cm; }
}