:root {
    --vd-blue: #1a73ff;
    --vd-blue-600: #0f5fe6;
    --vd-blue-50: #eaf3ff;
    --vd-teal: #1ec8c8;
    --vd-navy: #0b2545;
    --vd-navy-2: #0a1c36;
    --vd-ink: #0f1e36;
    --vd-muted: #6b7a90;
    --vd-line: #e6ecf4;
    --vd-bg: #f4f8fd;
    --vd-radius: 14px;
    --vd-shadow: 0 4px 18px rgba(16, 42, 84, .06);

    --bs-primary: var(--vd-blue);
    --bs-primary-rgb: 26, 115, 255;
    --bs-link-color: var(--vd-blue);
    --bs-link-hover-color: var(--vd-blue-600);
    --bs-body-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --bs-body-color: var(--vd-ink);
    --bs-border-color: var(--vd-line);
}

body {
    background: var(--vd-bg);
    font-size: .925rem;
}

h1, h2, h3, .h4, .h5, .h6 {
    font-weight: 700;
    letter-spacing: -.01em;
}

a,
.btn-link {
    text-decoration: none;
}

/* ---------- Botões ---------- */
.btn {
    border-radius: 10px;
    font-weight: 500;
}

.btn-primary {
    --bs-btn-bg: var(--vd-blue);
    --bs-btn-border-color: var(--vd-blue);
    --bs-btn-hover-bg: var(--vd-blue-600);
    --bs-btn-hover-border-color: var(--vd-blue-600);
    --bs-btn-active-bg: var(--vd-blue-600);
    background-image: linear-gradient(90deg, #1a73ff, #2b8cff);
    box-shadow: 0 6px 16px rgba(26, 115, 255, .25);
}

.btn-outline-primary {
    --bs-btn-color: var(--vd-blue);
    --bs-btn-border-color: #bcd6ff;
    --bs-btn-hover-bg: var(--vd-blue);
    --bs-btn-hover-border-color: var(--vd-blue);
}

.form-control, .form-select {
    border-radius: 10px;
    border-color: #d9e2ee;
}

.form-control:focus, .form-select:focus {
    border-color: #8ab8ff;
    box-shadow: 0 0 0 .2rem rgba(26, 115, 255, .15);
}

/* ---------- Logótipo ---------- */
.logo {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    line-height: 1;
}

.logo-text {
    display: flex;
    flex-direction: column;
}

.logo-name {
    font-family: "Exo 2", "Inter", sans-serif;
    font-size: 1.45rem;
    letter-spacing: -.01em;
    font-weight: 400;
}

.logo-name strong {
    font-weight: 800;
    letter-spacing: -.02em;
}

.logo-tag {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .56rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .6em;
    margin-top: .3rem;
}

.logo-tag::before,
.logo-tag::after {
    content: "";
    flex: 1;
    height: 1.5px;
    background: currentColor;
    opacity: .8;
}

.logo-light .logo-name strong { color: #0d2d6b; }
.logo-light .logo-name { color: #1766e0; }
.logo-light .logo-tag { color: #1fa9c0; }
.logo-dark .logo-name strong { color: #fff; }
.logo-dark .logo-name { color: #5aa7ff; }
.logo-dark .logo-tag { color: #3fc3d0; }

/* ---------- Sidebar ---------- */
.app-shell {
    display: flex;
    min-height: 100vh;
}

.sidebar {
    background: linear-gradient(180deg, var(--vd-navy) 0%, var(--vd-navy-2) 100%);
    color: #c9d8ee;
}

@media (min-width: 992px) {
    .sidebar {
        width: 250px;
        flex-shrink: 0;
        position: sticky;
        top: 0;
        height: 100vh;
    }
}

.sidebar .sidebar-brand {
    padding: 1.4rem 1.4rem 1rem;
}

.sidebar .nav-link {
    color: #d5e2f5;
    padding: .7rem 1rem;
    margin: .15rem .9rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: .8rem;
    font-weight: 500;
}

.sidebar .nav-link i {
    font-size: 1.15rem;
    opacity: .9;
}

.sidebar .nav-link:hover {
    background: rgba(255, 255, 255, .07);
    color: #fff;
}

.sidebar .nav-link.active {
    background: linear-gradient(90deg, #1a73ff, #2b8cff);
    color: #fff;
    box-shadow: 0 6px 18px rgba(26, 115, 255, .35);
}

.sidebar-card {
    margin: 1rem;
    padding: 1rem;
    border-radius: var(--vd-radius);
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .08);
    font-size: .8rem;
}

.sidebar-card strong {
    color: #fff;
}

/* ---------- Topbar ---------- */
.topbar {
    background: #fff;
    border-bottom: 1px solid var(--vd-line);
    padding: .7rem 1.5rem;
    position: sticky;
    top: 0;
    z-index: 1020;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.topbar-empresa {
    padding-right: 1rem;
    border-right: 1px solid var(--vd-line);
    max-width: 220px;
}

.topbar-empresa > div {
    overflow: hidden;
}

.topbar-empresa .small,
.topbar-empresa div[style] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.topbar .search {
    position: relative;
    max-width: 380px;
    flex: 1;
}

.topbar .search i {
    position: absolute;
    left: .85rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--vd-muted);
}

.topbar .search input {
    padding-left: 2.3rem;
    background: #f5f8fc;
    border-color: transparent;
}

.topbar .form-select {
    min-width: 210px;
}

.avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: .85rem;
    background: linear-gradient(135deg, #1a73ff, #1ec8c8);
    overflow: hidden;
}

.avatar-photo {
    background: none;
}

.avatar-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.content {
    min-width: 0;
    flex-grow: 1;
}

.content-inner {
    padding: 1.75rem;
}

/* ---------- Página ---------- */
.page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: 1.5rem;
}

.page-header h1 {
    font-size: 1.6rem;
    margin: 0;
}

.card {
    border: 1px solid var(--vd-line);
    border-radius: var(--vd-radius);
    box-shadow: var(--vd-shadow);
}

.card-header {
    background: #fff;
    border-bottom-color: var(--vd-line);
    border-radius: var(--vd-radius) var(--vd-radius) 0 0 !important;
    padding: 1rem 1.25rem;
}

.card-table .table {
    margin: 0;
}

.card-table .table thead th {
    font-size: .75rem;
    font-weight: 600;
    color: var(--vd-muted);
    text-transform: none;
    background: #fafcff;
    border-bottom-color: var(--vd-line);
    padding-top: .75rem;
    padding-bottom: .75rem;
}

.table > :not(caption) > * > * {
    vertical-align: middle;
    padding-left: 1rem;
    padding-right: 1rem;
    border-bottom-color: var(--vd-line);
}

/* ---------- Indicadores ---------- */
.stat-card {
    padding: 1.1rem 1.2rem;
    height: 100%;
}

.stat-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.25rem;
}

.stat-value {
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1.1;
    margin-top: .7rem;
}

.stat-label {
    font-size: .95rem;
    color: #3b4a60;
}

.stat-foot {
    font-size: .78rem;
    color: var(--vd-muted);
    margin-top: .45rem;
}

.tone-blue .stat-icon { background: linear-gradient(135deg, #2b8cff, #1a5fe6); }
.tone-green .stat-icon { background: linear-gradient(135deg, #2ecc8f, #16a36b); }
.tone-orange { background: linear-gradient(180deg, #fff6ef, #fff); }
.tone-orange .stat-icon { background: linear-gradient(135deg, #ff9a3c, #f26b1d); }
.tone-purple .stat-icon { background: linear-gradient(135deg, #a57bff, #7c4dff); }
.tone-sky .stat-icon { background: linear-gradient(135deg, #3fa9ff, #1a73ff); }

.chip {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .75rem;
    font-weight: 600;
    padding: .15rem .5rem;
    border-radius: 999px;
}

/* ---------- Atalhos ---------- */
.action-card {
    display: flex;
    gap: .9rem;
    padding: 1.1rem;
    height: 100%;
    color: inherit;
    transition: transform .15s ease, box-shadow .15s ease;
}

.action-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(16, 42, 84, .1);
    color: inherit;
}

.action-card .action-icon {
    font-size: 1.8rem;
    color: var(--vd-blue);
    line-height: 1;
}

.action-card h3 {
    font-size: .98rem;
    margin-bottom: .25rem;
}

.action-card p {
    font-size: .8rem;
    color: var(--vd-muted);
    margin-bottom: .5rem;
}

.action-card .action-link {
    font-size: .82rem;
    font-weight: 600;
    color: var(--vd-blue);
}

.help-card {
    background: linear-gradient(90deg, #e8f2ff, #f2f8ff);
    border: 1px solid #d6e7ff;
}

/* ---------- Badges ---------- */
.badge {
    font-weight: 600;
    border-radius: 999px;
    padding: .38em .7em;
}

.badge-dot::before {
    content: "";
    display: inline-block;
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: currentColor;
    margin-right: .35rem;
    vertical-align: middle;
}

.nav-pills .nav-link {
    border-radius: 999px;
    color: #3b4a60;
    font-size: .85rem;
}

.nav-pills .nav-link.active {
    background: var(--vd-blue);
}

.nav-pills .count {
    display: inline-block;
    min-width: 1.4rem;
    padding: 0 .35rem;
    margin-left: .3rem;
    border-radius: 999px;
    background: #e9eef5;
    color: #3b4a60;
    font-size: .72rem;
    text-align: center;
}

.nav-pills .nav-link.active .count {
    background: rgba(255, 255, 255, .25);
    color: #fff;
}

.lead-tabs .nav-link {
    border: none;
    border-bottom: 3px solid transparent;
    background: none;
    color: var(--vd-muted);
    font-weight: 600;
    border-radius: 0;
}

.lead-tabs .nav-link:hover {
    color: var(--vd-ink);
}

.lead-tabs .nav-item:nth-child(1) .nav-link.active {
    color: var(--vd-blue);
    border-bottom-color: var(--vd-blue);
}

.lead-tabs .nav-item:nth-child(2) .nav-link.active {
    color: var(--vd-teal);
    border-bottom-color: var(--vd-teal);
}

.lead-tabs .nav-link.text-danger.active {
    color: #dc3545 !important;
    border-bottom-color: #dc3545 !important;
}

/* ---------- Login ---------- */
.auth-split {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1fr;
    background: #fff;
}

@media (min-width: 992px) {
    .auth-split {
        grid-template-columns: minmax(420px, 1fr) 1.15fr;
    }
}

.auth-form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 3rem clamp(1.5rem, 6vw, 5rem);
}

.auth-form .inner {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

.input-icon {
    position: relative;
}

.input-icon i {
    position: absolute;
    left: .9rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--vd-muted);
}

.input-icon .form-control {
    padding-left: 2.5rem;
    height: 46px;
}

.auth-hero {
    position: relative;
    overflow: hidden;
    color: #fff;
    padding: 3rem;
    display: none;
    flex-direction: column;
    justify-content: flex-end;
    background:
        radial-gradient(1200px 500px at 110% -10%, rgba(30, 200, 200, .35), transparent 60%),
        linear-gradient(160deg, #1454c9 0%, #0b2f73 55%, #07214f 100%);
}

@media (min-width: 992px) {
    .auth-hero {
        display: flex;
    }
}

.auth-hero .skyline {
    position: absolute;
    inset: 0;
    opacity: .28;
}

.auth-hero > * {
    position: relative;
}

.auth-hero h2 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.25;
    margin-bottom: 2rem;
}

.auth-hero .feature {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1.1rem;
}

.auth-hero .feature i {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .14);
    font-size: 1.3rem;
}

.auth-hero .feature small {
    color: #bcd3f5;
}

.guest-simple {
    min-height: 100vh;
    background: radial-gradient(900px 400px at 0 0, #dcebff, transparent), var(--vd-bg);
}

.auth-card {
    max-width: 480px;
    border: 0;
    box-shadow: 0 16px 40px rgba(16, 42, 84, .1);
}

@media print {
    .topbar, .sidebar, .no-print, .alert {
        display: none !important;
    }

    .content-inner {
        padding: 0 !important;
    }
}

/* =====================================================================
   VTRLeads
   ===================================================================== */
.min-w-0 { min-width: 0; }

.sidebar .nav-group {
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: #7f93b3;
    padding: 1rem 1.9rem .3rem;
}

.sidebar .nav-link { padding: .55rem 1rem; }

.avatar-lg { width: 52px; height: 52px; font-size: 1.05rem; flex-shrink: 0; }

.dot {
    display: inline-block;
    width: .6rem;
    height: .6rem;
    border-radius: 50%;
    vertical-align: middle;
}

.tipo-icon {
    --c: #94a3b8;
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--c);
    background: color-mix(in srgb, var(--c) 14%, #fff);
    font-size: 1.1rem;
}

.tipo-chip {
    --c: #94a3b8;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .12rem .5rem;
    border-radius: 999px;
    color: color-mix(in srgb, var(--c) 80%, #000);
    background: color-mix(in srgb, var(--c) 13%, #fff);
    font-size: .78rem;
    font-weight: 500;
    white-space: nowrap;
}

.date-tile {
    width: 48px;
    flex-shrink: 0;
    text-align: center;
    border-radius: 10px;
    background: var(--vd-blue-50);
    color: var(--vd-blue-600);
    font-size: .7rem;
    text-transform: uppercase;
    font-weight: 600;
    padding: .3rem 0;
    line-height: 1.1;
}

.date-tile span { display: block; font-size: 1.3rem; font-weight: 800; }

.dl-compact dt { font-weight: 500; color: var(--vd-muted); }
.dl-compact dd { margin-bottom: .45rem; }

/* ---------- Badges de estado ---------- */
.badge-lead-novo { background: #e6f0ff; color: #1a5fe6; }
.badge-lead-contactado { background: #e8f7fb; color: #0e7f9c; }
.badge-lead-visita { background: #f1eaff; color: #6b3fd6; }
.badge-lead-orcamentado { background: #fff4de; color: #b26a00; }
.badge-lead-negociacao { background: #fff0e3; color: #c25a0a; }
.badge-lead-ganho, .badge-orc-adjudicado, .badge-inst-concluida { background: #e3f8ee; color: #138a55; }
.badge-lead-perdido, .badge-orc-rejeitado, .badge-inst-cancelada { background: #ffeae6; color: #d0391a; }
.badge-orc-rascunho, .badge-orc-substituido { background: #eef1f5; color: #56647a; }
.badge-orc-enviado { background: #e6f0ff; color: #1a5fe6; }
.badge-inst-por_agendar { background: #fff4de; color: #b26a00; }
.badge-inst-agendada { background: #e6f0ff; color: #1a5fe6; }
.badge-inst-em_curso { background: #f1eaff; color: #6b3fd6; }
.badge-prioridade-alta { background: #fff0e3; color: #c25a0a; }
.badge-perfil-admin { background: #0b2545; color: #fff; }
.badge-perfil-gestor { background: #e6f0ff; color: #1a5fe6; }
.badge-perfil-comercial { background: #e3f8ee; color: #138a55; }
.badge-perfil-instalador { background: #fff4de; color: #b26a00; }

/* ---------- Funil / barras ---------- */
.funil-row {
    display: grid;
    grid-template-columns: 130px 1fr 34px;
    align-items: center;
    gap: .75rem;
    padding: .35rem 0;
    color: inherit;
    font-size: .88rem;
}

.funil-row:hover { color: inherit; }
.funil-row:hover .funil-track { background: #e4ebf5; }
.funil-track { height: 12px; border-radius: 999px; background: #eef2f8; overflow: hidden; }
.funil-fill { display: block; height: 100%; border-radius: 999px; background: var(--vd-blue); min-width: 4px; }
.funil-novo { background: #2b8cff; }
.funil-contactado { background: #1eb3d0; }
.funil-visita { background: #8a5cf5; }
.funil-orcamentado { background: #f0a020; }
.funil-negociacao { background: #f26b1d; }
.funil-perdido { background: #e0461c; }
.funil-n { text-align: right; font-weight: 700; }

.bar-chart {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    height: 200px;
    padding-top: 1.2rem;
}

.bar-col {
    flex: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
}

.bar {
    width: 100%;
    max-width: 56px;
    border-radius: 8px 8px 3px 3px;
    background: linear-gradient(180deg, #2b8cff, #1a5fe6);
}

.bar-value { font-size: .72rem; font-weight: 600; color: var(--vd-muted); margin-bottom: .25rem; }
.bar-label { font-size: .75rem; color: var(--vd-muted); margin-top: .4rem; }

/* ---------- Kanban ---------- */
.kanban {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
    padding-bottom: 1rem;
    align-items: start;
}

.kanban-col {
    background: #eaf0f7;
    border-radius: var(--vd-radius);
    padding: .75rem;
    min-height: 300px;
    border-top: 4px solid var(--vd-blue);
    transition: background .15s;
}

.kanban-col header { padding: .1rem .25rem .7rem; }
.kanban-col .count { font-size: .75rem; font-weight: 700; background: #fff; border-radius: 999px; padding: .05rem .5rem; }
.kanban-col.drop-target { background: #dbe8fb; }
.kanban-contactado { border-top-color: #1eb3d0; }
.kanban-visita { border-top-color: #8a5cf5; }
.kanban-orcamentado { border-top-color: #f0a020; }
.kanban-negociacao { border-top-color: #f26b1d; }
.kanban-ganho { border-top-color: #16a36b; }
.kanban-perdido { border-top-color: #e0461c; }
.kanban-list { display: flex; flex-direction: column; gap: .6rem; min-height: 60px; }

.kanban-card {
    position: relative;
    background: #fff;
    border-radius: 10px;
    padding: .7rem .8rem;
    box-shadow: 0 1px 3px rgba(16, 42, 84, .08);
    border-left: 3px solid transparent;
    cursor: grab;
    font-size: .85rem;
}

.kanban-card:hover { box-shadow: 0 6px 16px rgba(16, 42, 84, .12); }
.kanban-card.prioridade-alta { border-left-color: #f26b1d; }
.kanban-card.dragging { opacity: .5; }

/* ---------- Timeline ---------- */
.timeline { list-style: none; padding: 0; margin: 0; }

.timeline li {
    display: flex;
    gap: .8rem;
    position: relative;
    padding-bottom: 1rem;
}

.timeline li::before {
    content: "";
    position: absolute;
    left: 15px;
    top: 34px;
    bottom: 0;
    width: 2px;
    background: var(--vd-line);
}

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

.timeline-icon {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--vd-blue-50);
    color: var(--vd-blue);
    font-size: .9rem;
}

.timeline-sistema .timeline-icon { background: #f1f4f8; color: var(--vd-muted); }
.timeline-sistema .timeline-body > div:last-child { color: var(--vd-muted); font-size: .85rem; }
.timeline-chamada .timeline-icon { background: #e3f8ee; color: #138a55; }
.timeline-visita .timeline-icon { background: #f1eaff; color: #6b3fd6; }
.timeline-body { min-width: 0; flex: 1; font-size: .9rem; }

/* ---------- Calendário ---------- */
.calendario { overflow: hidden; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-head div { padding: .5rem; font-size: .75rem; font-weight: 600; color: var(--vd-muted); text-align: center; background: #fafcff; border-bottom: 1px solid var(--vd-line); }

.cal-dia {
    min-height: 118px;
    border-right: 1px solid var(--vd-line);
    border-bottom: 1px solid var(--vd-line);
    padding: .3rem;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.cal-dia:nth-child(7n) { border-right: 0; }
.cal-dia.fds { background: #fbfcfe; }
.cal-dia.fora { background: #f6f8fb; }
.cal-dia.fora .cal-num { opacity: .4; }
.cal-num { font-size: .78rem; font-weight: 600; padding: 0 .2rem; }

.cal-dia.hoje .cal-num {
    background: var(--vd-blue);
    color: #fff;
    border-radius: 999px;
    width: 1.6rem;
    text-align: center;
}

.cal-evento {
    --c: #94a3b8;
    display: block;
    font-size: .72rem;
    line-height: 1.25;
    padding: .2rem .35rem;
    border-radius: 6px;
    background: color-mix(in srgb, var(--c) 16%, #fff);
    border-left: 3px solid var(--c);
    color: #1f2d44;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cal-evento:hover { background: color-mix(in srgb, var(--c) 28%, #fff); color: #000; }
.cal-evento.cal-concluida { opacity: .55; text-decoration: line-through; }

@media (max-width: 767px) {
    .cal-dia { min-height: 70px; }
    .cal-evento { font-size: 0; padding: 3px; }
    .cal-evento i { font-size: .7rem; }
}

/* ---------- Anexos ---------- */
.anexos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: .75rem; }
.anexo { min-width: 0; }

.anexo-thumb {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    background: #f1f4f8;
    overflow: hidden;
    font-size: 2rem;
}

.anexo-thumb img { width: 100%; height: 100%; object-fit: cover; }
.anexo-nome { font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: .3rem; }

/* ---------- Orçamento ---------- */
.orc-linhas td { vertical-align: top; }
.orc-linhas textarea { resize: vertical; min-height: 31px; }
.orc-linhas .l-total { padding-top: .45rem; }
.totais-card { position: sticky; top: 80px; }
.acoes-orc { border-left: 4px solid var(--vd-blue); }

/* ---------- Documento do orçamento (A4) ---------- */
.od {
    --od-cor: #1a5fe6;   /* só linhas/acentos; todo o texto é preto */
    --od-texto: #000;
    --od-linha: #b9c1cc;
    --od-fundo: #e2e6ec;
    position: relative;
    color: var(--od-texto);
    font-family: "Inter", system-ui, sans-serif;
    font-size: 9.5pt;
    line-height: 1.4;
}

.od-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10mm;
    margin-bottom: 6mm;
}

.od-logo { max-height: 18mm; max-width: 62mm; display: block; margin-bottom: 3mm; }
.od-empresa-nome { font-size: 10.5pt; font-weight: 700; }
.od-empresa-dados { font-size: 8.5pt; line-height: 1.45; }
.od-titulo { text-align: right; flex-shrink: 0; }

.od-titulo-texto {
    font-size: 20pt;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    line-height: 1;
    margin-bottom: 3mm;
}

.od-meta { margin-left: auto; font-size: 8.8pt; border-collapse: collapse; }
.od-meta th { font-weight: 500; text-align: right; padding: .4mm 3mm .4mm 0; }
.od-meta td { text-align: right; padding: .4mm 0; white-space: nowrap; }

.od-partes { display: grid; grid-template-columns: 1fr 1fr; gap: 4mm; margin-bottom: 5mm; }

.od-caixa {
    background: var(--od-fundo);
    border: 1px solid var(--od-linha);
    border-radius: 2mm;
    padding: 3mm 4mm;
    font-size: 8.8pt;
    line-height: 1.45;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.od-rotulo {
    font-size: 7pt;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 1mm;
}

.od-destaque { font-weight: 700; font-size: 10pt; margin-bottom: .5mm; }
.od-intro { margin: 0 0 4mm; }

.od-linhas { width: 100%; border-collapse: collapse; margin-bottom: 4mm; font-size: 8.8pt; }
.od-linhas thead { display: table-header-group; }

.od-linhas th {
    background: var(--od-fundo);
    color: var(--od-texto);
    border-top: 1.5px solid var(--od-texto);
    border-bottom: 1.5px solid var(--od-texto);
    font-size: 7.5pt;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: 2mm 2.5mm;
    text-align: left;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.od-linhas td { padding: 2.2mm 2.5mm; border-bottom: 1px solid var(--od-linha); vertical-align: top; }
.od-linhas tbody tr { break-inside: avoid; }
.od-linhas .od-n { width: 7mm; text-align: center; }
.od-num { text-align: right !important; white-space: nowrap; width: 1%; }
.od-item { font-weight: 600; }
.od-detalhe { font-size: 8pt; margin-top: .5mm; }
.od-forte { font-weight: 600; }

.od-fecho {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8mm;
    margin-bottom: 6mm;
    break-inside: avoid;
}

.od-pagamento { font-size: 8.5pt; padding-top: 1mm; }
.od-totais { width: 80mm; border-collapse: collapse; font-size: 9pt; }
.od-totais th { font-weight: 500; padding: 1.2mm 0; text-align: left; }
.od-totais td { text-align: right; padding: 1.2mm 0; white-space: nowrap; }
.od-totais .od-iva { font-size: 8.5pt; }

.od-totais .od-total th,
.od-totais .od-total td {
    background: var(--od-fundo);
    color: var(--od-texto);
    border-top: 2px solid var(--od-texto);
    font-size: 12.5pt;
    font-weight: 800;
    padding: 2.5mm 3mm;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.od-condicoes {
    font-size: 8.3pt;
    border-top: 1px solid var(--od-linha);
    padding-top: 3mm;
    margin-bottom: 6mm;
    break-inside: avoid;
}

.od-aceitacao { break-inside: avoid; margin-bottom: 6mm; }
.od-assinaturas { display: grid; grid-template-columns: 1fr 1fr; gap: 14mm; margin-top: 14mm; font-size: 8.3pt; text-align: center; }
.od-linha { display: block; border-top: 1px solid var(--od-texto); margin-bottom: 1.5mm; }

.od-pagina { width: 100%; border-collapse: collapse; }
.od-pagina > tbody > tr > td, .od-pagina > tfoot > tr > td { padding: 0; }
.od-rodape-espaco { display: none; }

.od-rodape {
    border-top: 1px solid var(--od-linha);
    padding-top: 2mm;
    margin-top: 4mm;
    font-size: 7.5pt;
    background: #fff;
}

.od-rodape-linha { display: flex; justify-content: space-between; gap: 4mm; }

.od-copy { font-size: 7pt; margin-top: .8mm; }

/* Marca de água VTRLeads quando a empresa não tem logótipo */
.od-marca {
    position: absolute;
    top: 45%;
    left: 50%;
    width: 150mm;
    transform: translate(-50%, -50%) rotate(-30deg);
    opacity: .12;
    pointer-events: none;
    z-index: 0;
}

.od > :not(.od-marca) { position: relative; z-index: 1; }

/* ---------- Impressão A4 ---------- */
.print-doc { display: none; }

@page {
    size: A4;
    margin: 12mm 13mm 10mm;

    @bottom-right {
        content: "Página " counter(page) " de " counter(pages);
        white-space: nowrap;
        width: 20mm;
        font-family: "Inter", sans-serif;
        font-size: 7.5pt;
        color: #000;
    }
}

@media print {
    html, body { background: #fff !important; }
    .app-shell { display: block; min-height: 0; }
    .content { width: 100%; }

    /* Páginas com documento próprio (ex.: orçamento): imprime só o documento. */
    .content-inner:has(.print-doc) > :not(.print-doc) { display: none !important; }
    .print-doc { display: block; }

    /* Rodapé (empresa, direitos de autor e licença) fixo no fundo de todas as páginas.
       O tfoot da tabela .od-pagina repete-se e reserva o espaço para não sobrepor o conteúdo. */
    .od > .od-rodape { position: fixed; left: 0; right: 0; bottom: 0; margin: 0; }
    .od-rodape-espaco { display: block; height: 13mm; }

    /* Marca de água repetida no centro de cada página */
    .od-marca { position: fixed; top: 50%; }
}

/* ---------- Login hero ---------- */
.auth-hero { justify-content: center; }
.hero-funnel { margin-bottom: 2.5rem; display: flex; flex-direction: column; align-items: center; gap: .6rem; }

.hero-bar {
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 12px;
    padding: .7rem 1rem;
    text-align: center;
    font-weight: 500;
    backdrop-filter: blur(4px);
}

.hero-bar:last-child { background: rgba(30, 200, 200, .35); }

/* ---------- Direitos de autor / licença ---------- */
.app-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .25rem 1rem;
    padding: 1rem 1.75rem 1.5rem;
    font-size: .74rem;
    color: var(--vd-muted);
    border-top: 1px solid var(--vd-line);
}

.auth-copy { margin: 2.5rem 0 0; font-size: .72rem; color: var(--vd-muted); line-height: 1.5; }

.content { display: flex; flex-direction: column; min-height: 100vh; }
.content-inner { flex-grow: 1; }

@media print {
    .content { min-height: 0; display: block; }
}

/* ---------- Utilizadores por abas ---------- */
.utilizadores-abas .nav-link { color: #3b4a60; font-weight: 500; }
.utilizadores-abas .nav-link.active { color: var(--vd-blue); background: #fff; }
.utilizadores-abas .count { display: inline-block; min-width: 1.4rem; padding: 0 .35rem; margin-left: .25rem; border-radius: 999px; background: #e9eef5; font-size: .72rem; text-align: center; }
.utilizadores-abas .nav-link.active .count { background: var(--vd-blue-50); }
.badge-perfil-cliente { background: #f1eaff; color: #6b3fd6; }

/* ---------- Portal: progresso da instalação ---------- */
.passos { display: flex; justify-content: space-between; position: relative; }
.passos::before { content: ""; position: absolute; top: 17px; left: 8%; right: 8%; height: 3px; background: var(--vd-line); }
.passo { position: relative; flex: 1; text-align: center; font-size: .82rem; color: var(--vd-muted); }
.passo-bola { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto .4rem; background: #fff; border: 3px solid var(--vd-line); font-weight: 700; }
.passo.feito .passo-bola { background: #16a36b; border-color: #16a36b; color: #fff; }
.passo.atual .passo-bola { border-color: var(--vd-blue); color: var(--vd-blue); }
.passo.atual { color: var(--vd-ink); font-weight: 600; }

/* ---------- Visitas técnicas ---------- */
.badge-visita-pendente { background: #fff4de; color: #b26a00; }
.badge-visita-aceite { background: #e6f0ff; color: #1a5fe6; }
.badge-visita-recusada { background: #ffeae6; color: #d0391a; }
.badge-visita-realizada { background: #e3f8ee; color: #138a55; }
.badge-visita-cancelada { background: #eef1f5; color: #56647a; }
.tecnicos .list-group-item { cursor: pointer; }
.tecnicos .list-group-item:has(input:checked) { background: var(--vd-blue-50); }