:root{--navy:#17365d;--blue:#2f75b5;--light:#eef5fb;--green:#2e7d32;--red:#b71c1c;--border:#d8e0e8;--text:#243447}
*{box-sizing:border-box}body{margin:0;background:#f4f7fa;color:var(--text);font-family:Arial,Helvetica,sans-serif}
.topbar{background:var(--navy);color:#fff;display:flex;justify-content:space-between;align-items:center;padding:16px 32px;box-shadow:0 2px 8px #0002}
.brand{font-size:20px;font-weight:800;letter-spacing:1px}.subtitle{font-size:13px;opacity:.85}
nav{display:flex;gap:10px;flex-wrap:wrap}nav a{color:#fff;text-decoration:none;padding:10px 12px;border-radius:7px}nav a:hover{background:#ffffff18}
.container{max-width:1280px;margin:0 auto;padding:28px}.page-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.page-title h1{margin:0;color:var(--navy)}.page-title p{margin:7px 0 0;color:#64748b}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}.cards.three{grid-template-columns:repeat(3,1fr)}
.card,.panel{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 3px 12px #2030400b}.card{padding:20px}.card span{display:block;color:#64748b;font-size:13px;margin-bottom:8px}.card strong{font-size:25px;color:var(--navy)}.card.money{border-top:4px solid var(--blue)}.card.success{border-top:4px solid var(--green)}
.panel{padding:20px;margin-bottom:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.panel h2{margin:0;color:var(--navy);font-size:19px}
.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.mini-grid div{background:var(--light);padding:18px;border-radius:10px}.mini-grid span{display:block;color:#64748b;font-size:13px}.mini-grid strong{display:block;font-size:23px;margin-top:6px}
.btn{display:inline-block;border:1px solid var(--blue);background:#fff;color:var(--blue);padding:10px 16px;border-radius:8px;text-decoration:none;cursor:pointer;font-weight:700}.btn.primary{background:var(--blue);color:#fff}.btn.small{padding:7px 11px;font-size:13px}.btn:hover{filter:brightness(.96)}
.notice{padding:13px 16px;background:#fff8d8;border:1px solid #f0dc80;border-radius:9px;margin-bottom:18px}.success-note{background:#e8f5e9;border-color:#a5d6a7}
.filters{display:flex;gap:10px;align-items:end;flex-wrap:wrap;background:#fff;border:1px solid var(--border);padding:15px;border-radius:11px;margin-bottom:18px}
input,select,textarea{width:100%;border:1px solid #cbd5e1;border-radius:7px;padding:10px;background:#fff;font:inherit}.filters input{width:280px}.filters select{width:220px}.filters label{min-width:180px;color:#475569;font-size:13px}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th{background:var(--navy);color:#fff;text-align:left;padding:11px;font-size:13px}td{padding:11px;border-bottom:1px solid #e5eaf0;vertical-align:top}td small{display:block;color:#789;margin-top:4px}.empty{text-align:center;color:#789;padding:28px}
.badge{display:inline-block;padding:6px 9px;border-radius:999px;background:#edf2f7;font-size:12px;font-weight:700}.badge.emitida{background:#dff3e1;color:#1b5e20}.badge.emissão-parcial{background:#fff0cf;color:#8a5a00}.badge.pendente{background:#fde2e2;color:#9b1c1c}
.two-cols{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid label{font-size:13px;color:#526275}.form-grid .full{grid-column:1/-1}.form-grid textarea{min-height:78px}
.upload-panel form{display:flex;gap:14px;align-items:center}.upload-box{flex:1;border:2px dashed #9db7d0;border-radius:12px;padding:25px;background:var(--light);cursor:pointer}.upload-box strong,.upload-box span{display:block}.upload-box span{font-size:13px;color:#64748b;margin:6px 0 15px}
.link-danger{border:0;background:none;color:var(--red);cursor:pointer;text-decoration:underline}
footer{text-align:center;color:#789;padding:24px}
@media(max-width:900px){.topbar{align-items:flex-start;gap:16px;flex-direction:column}.container{padding:16px}.cards,.cards.three,.mini-grid,.two-cols{grid-template-columns:1fr}.page-title{align-items:flex-start;gap:12px;flex-direction:column}.form-grid{grid-template-columns:1fr}.filters input,.filters select{width:100%}}


/* ==========================================================
   V2 — SELEÇÃO MÚLTIPLA, CÓPIA E WHATSAPP
   ========================================================== */

.selection-toolbar {
    position: sticky;
    top: 0;
    z-index: 20;

    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;

    background: #ffffff;
    border: 1px solid #d8e0e8;
    border-left: 5px solid #2f75b5;
    border-radius: 11px;

    padding: 14px 16px;
    margin-bottom: 16px;

    box-shadow: 0 4px 14px rgba(23, 54, 93, 0.12);
}

.selection-info {
    margin-right: auto;
    color: #526275;
}

.selection-info strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 35px;
    height: 35px;

    margin-right: 6px;

    border-radius: 50%;
    background: #17365d;
    color: #ffffff;

    font-size: 16px;
}

.check-column {
    width: 45px;
    text-align: center;
}

.check-column input {
    width: 19px;
    height: 19px;
    cursor: pointer;
}

.notes-table tbody tr {
    transition:
        background-color 0.15s ease,
        box-shadow 0.15s ease;
}

.notes-table tbody tr:hover {
    background: #f4f8fc;
}

.notes-table tbody tr.selected-row {
    background: #e7f2ff;
    box-shadow: inset 5px 0 0 #2f75b5;
}

.code-container {
    display: flex;
    align-items: center;
    gap: 8px;
}

.movement-code {
    color: #17365d;
    font-size: 15px;
    letter-spacing: 0.3px;
}

.copy-code {
    border: 1px solid #9db7d0;
    background: #ffffff;
    color: #2f75b5;

    padding: 5px 8px;
    border-radius: 6px;

    cursor: pointer;
    font-size: 11px;
    font-weight: bold;
}

.copy-code:hover {
    background: #eef5fb;
}

.copy-code.copied {
    border-color: #70ad47;
    background: #e6f4e7;
    color: #2e7d32;
}

.copy-button {
    border-color: #7046a8;
    color: #7046a8;
}

.whatsapp-button {
    background: #168c46;
    border-color: #168c46;
    color: #ffffff;
}

.whatsapp-button:hover {
    background: #11763a;
}

.modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 999;

    align-items: center;
    justify-content: center;

    padding: 20px;

    background: rgba(12, 30, 51, 0.65);
    backdrop-filter: blur(3px);
}

.modal-box {
    width: min(650px, 100%);
    max-height: 90vh;
    overflow-y: auto;

    background: #ffffff;
    border-radius: 14px;

    padding: 22px;

    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.30);
}

.modal-title {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;

    gap: 15px;
    margin-bottom: 18px;
}

.modal-title h2 {
    margin: 0;
    color: #17365d;
}

.modal-title p {
    margin: 6px 0 0;
    color: #64748b;
}

.modal-close {
    border: 0;
    background: transparent;
    color: #64748b;

    cursor: pointer;
    font-size: 30px;
    line-height: 1;
}

.modal-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;

    margin-bottom: 18px;
}

.modal-summary div {
    padding: 16px;

    border-radius: 10px;
    background: #eef5fb;
}

.modal-summary span {
    display: block;
    color: #64748b;
    font-size: 13px;
}

.modal-summary strong {
    display: block;
    margin-top: 5px;

    color: #17365d;
    font-size: 22px;
}

.modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;

    margin-top: 20px;
}

.whatsapp-panel {
    border-left: 5px solid #168c46;
}

.report-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

@media (max-width: 900px) {
    .selection-toolbar {
        position: static;
    }

    .selection-toolbar .btn {
        width: 100%;
        text-align: center;
    }

    .selection-info {
        width: 100%;
    }

    .modal-summary {
        grid-template-columns: 1fr;
    }

    .modal-actions {
        flex-direction: column;
    }

    .modal-actions .btn {
        width: 100%;
    }

    .report-actions {
        width: 100%;
    }

    .report-actions .btn {
        width: 100%;
        text-align: center;
    }
}


/* ==========================================================
   V3 — CLASSIFICAÇÃO CPF E CNPJ
   ========================================================== */

.person-badge {
    display: inline-flex;
    align-items: center;

    padding: 6px 9px;
    border-radius: 999px;

    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.person-badge.company {
    background: #dcecff;
    color: #174f87;
    border: 1px solid #aacbed;
}

.person-badge.individual {
    background: #e6f4e7;
    color: #25672a;
    border: 1px solid #b4d9b7;
}

.person-badge.unidentified {
    background: #f0f0f0;
    color: #666666;
    border: 1px solid #d4d4d4;
}

.duplicate-note {
    background: #fff1d6;
    border-color: #e9ba61;
    color: #704600;
}


/* ==========================================================
   V4 — FILTROS CPF/CNPJ E ALINHAMENTO
   ========================================================== */

.notes-filters {
    display: grid;
    grid-template-columns:
        minmax(280px, 1.7fr)
        minmax(190px, 0.9fr)
        minmax(230px, 1fr)
        auto;

    align-items: end;
    gap: 12px;

    padding: 17px;
}

.notes-filters .filter-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.notes-filters .filter-field label {
    display: block;

    margin: 0 0 6px;

    color: #526275;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.notes-filters input,
.notes-filters select {
    width: 100%;
    height: 44px;
    min-width: 0;

    padding: 9px 12px;

    border: 1px solid #b8c6d6;
    border-radius: 8px;

    background: #ffffff;
    color: #243447;

    font-size: 14px;
}

.notes-filters input:focus,
.notes-filters select:focus {
    outline: none;

    border-color: #2f75b5;
    box-shadow: 0 0 0 3px rgba(47, 117, 181, 0.14);
}

.notes-filters .filter-actions {
    display: flex;
    align-items: center;
    gap: 9px;
}

.notes-filters .filter-actions .btn {
    height: 44px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    white-space: nowrap;
}

.notes-table {
    table-layout: fixed;
    min-width: 1180px;
}

.notes-table th,
.notes-table td {
    vertical-align: middle;
}

.notes-table th {
    padding: 13px 10px;

    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.15px;
}

.notes-table td {
    padding: 12px 10px;
}

.notes-table th:nth-child(1),
.notes-table td:nth-child(1) {
    width: 48px;
    text-align: center;
}

.notes-table th:nth-child(2),
.notes-table td:nth-child(2) {
    width: 150px;
}

.notes-table th:nth-child(3),
.notes-table td:nth-child(3) {
    width: 70px;
    text-align: center;
}

.notes-table th:nth-child(4),
.notes-table td:nth-child(4) {
    width: 92px;
    text-align: center;
}

.notes-table th:nth-child(5),
.notes-table td:nth-child(5) {
    width: 335px;
}

.notes-table th:nth-child(6),
.notes-table td:nth-child(6) {
    width: 150px;
    text-align: center;
}

.notes-table th:nth-child(7),
.notes-table td:nth-child(7) {
    width: 60px;
    text-align: center;
}

.notes-table th:nth-child(8),
.notes-table td:nth-child(8) {
    width: 155px;
    text-align: right;
}

.notes-table th:nth-child(9),
.notes-table td:nth-child(9) {
    width: 125px;
    text-align: center;
}

.notes-table th:nth-child(10),
.notes-table td:nth-child(10) {
    width: 85px;
    text-align: center;
}

.notes-table td:nth-child(4) {
    line-height: 1.25;
}

.notes-table td:nth-child(5) strong {
    display: block;

    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.notes-table td:nth-child(5) small {
    margin-top: 5px;
}

.notes-table td:nth-child(8) strong {
    display: block;
    white-space: nowrap;
}

.notes-table td:nth-child(8) small {
    line-height: 1.3;
}

.notes-table td:nth-child(10) .btn {
    min-width: 62px;
}

.person-badge {
    justify-content: center;
    min-width: 95px;
}

.code-container {
    justify-content: flex-start;
}

.code-container .movement-code {
    min-width: 67px;
}

.selection-toolbar {
    align-items: center;
}

.selection-toolbar .selection-info {
    display: flex;
    align-items: center;
}

@media (max-width: 1100px) {
    .notes-filters {
        grid-template-columns: 1fr 1fr;
    }

    .notes-filters .search-field {
        grid-column: 1 / -1;
    }

    .notes-filters .filter-actions {
        justify-content: flex-end;
    }
}

@media (max-width: 700px) {
    .notes-filters {
        grid-template-columns: 1fr;
    }

    .notes-filters .search-field {
        grid-column: auto;
    }

    .notes-filters .filter-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
    }

    .notes-filters .filter-actions .btn {
        width: 100%;
    }
}


/* ==========================================================
   V5 — CORREÇÃO DA COLUNA DATA
   ========================================================== */

.notes-table th:nth-child(4),
.notes-table td:nth-child(4) {
    width: 115px;
    min-width: 115px;
    text-align: center;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
}

.notes-table td:nth-child(4) {
    font-variant-numeric: tabular-nums;
}

.notes-table {
    min-width: 1210px;
}


/* ==========================================================
   V6 — RELATÓRIO DIÁRIO E ACOMPANHAMENTO GERAL
   ========================================================== */

.report-section {
    margin-bottom: 28px;
}

.report-title {
    display: flex;
    justify-content: space-between;
    align-items: center;

    gap: 15px;
    margin-bottom: 15px;
}

.report-title h2 {
    margin: 4px 0 0;
    color: #17365d;
}

.report-label {
    color: #2f75b5;

    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.8px;
}

.report-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.general-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 14px;
    margin-bottom: 18px;
}

.general-summary > div {
    padding: 18px;

    border-radius: 10px;
    border: 1px solid #cbd9e7;

    background: #d9eaf7;
}

.general-summary span {
    display: block;

    margin-bottom: 7px;

    color: #17365d;
    font-size: 12px;
    font-weight: 900;
}

.general-summary strong {
    color: #102f55;
    font-size: 23px;
}

.general-summary .summary-emitted {
    background: #fff350;
    border-color: #d9ca00;
}

.general-summary .summary-pending {
    background: #e7f4e8;
    border-color: #afd4b2;
}

.daily-report-table,
.general-report-table {
    min-width: 1000px;
}

.daily-report-table th,
.general-report-table th {
    white-space: nowrap;
}

.daily-report-table td:first-child,
.general-report-table td:first-child {
    white-space: nowrap;
    text-align: center;
}

.daily-report-table .money-cell,
.general-report-table .money-cell {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.daily-report-table tfoot td,
.general-report-table tfoot td {
    background: #fff350;
    color: #000000;

    font-weight: 900;
    border-top: 2px solid #b9a900;
}

.general-report-table tbody tr:nth-child(even) {
    background: #f3f7fb;
}

.report-filters {
    align-items: end;
}

.report-filters label {
    min-width: 190px;
}

@media (max-width: 800px) {
    .general-summary {
        grid-template-columns: 1fr;
    }

    .report-title {
        align-items: flex-start;
        flex-direction: column;
    }

    .report-actions {
        width: 100%;
    }

    .report-actions .btn {
        width: 100%;
        text-align: center;
    }
}


/* ==========================================================
   V7 — RELATÓRIO IMPRESSO DE NF EMITIDAS
   ========================================================== */

.print-button {
    border-color: #17365d;
    color: #17365d;
}

.print-report-body {
    margin: 0;
    background: #e9eef4;
    color: #172a3d;
    font-family: Arial, Helvetica, sans-serif;
}

.print-toolbar {
    max-width: 1400px;
    margin: 18px auto;
    padding: 0 20px;

    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.print-report {
    max-width: 1400px;
    margin: 0 auto 30px;
    padding: 28px;

    background: #ffffff;
    box-shadow: 0 6px 24px rgba(20, 42, 70, 0.15);
}

.print-header {
    display: flex;
    justify-content: space-between;
    align-items: center;

    gap: 25px;

    padding-bottom: 18px;
    margin-bottom: 18px;

    border-bottom: 3px solid #17365d;
}

.print-company {
    display: flex;
    align-items: center;
    gap: 18px;
}

.print-logo {
    min-width: 120px;

    padding: 17px 18px;

    background: #17365d;
    color: #ffffff;

    text-align: center;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: 1px;
}

.print-company h1 {
    margin: 0;

    color: #17365d;
    font-size: 24px;
}

.print-company p {
    margin: 5px 0 0;

    color: #60748a;
}

.print-period {
    min-width: 190px;

    padding: 13px 16px;

    border: 1px solid #9fb6ce;
    background: #edf4fa;

    text-align: center;
}

.print-period span {
    display: block;

    margin-bottom: 5px;

    color: #587087;
    font-size: 11px;
    font-weight: 800;
}

.print-period strong {
    color: #17365d;
    font-size: 17px;
}

.print-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 12px;
    margin-bottom: 20px;
}

.print-kpis > div {
    padding: 14px 16px;

    border: 1px solid #c3d1df;
    border-top: 4px solid #2f75b5;

    background: #f5f9fc;
}

.print-kpis span,
.print-general-grid span {
    display: block;

    margin-bottom: 5px;

    color: #60748a;
    font-size: 11px;
    font-weight: 900;
}

.print-kpis strong,
.print-general-grid strong {
    color: #17365d;
    font-size: 20px;
}

.print-table {
    width: 100%;

    border-collapse: collapse;
    table-layout: auto;

    font-size: 12px;
}

.print-table th {
    padding: 9px 7px;

    background: #17365d;
    color: #ffffff;

    border: 1px solid #17365d;

    text-align: center;
    font-size: 10px;
    letter-spacing: 0.2px;
}

.print-table td {
    padding: 8px 7px;

    border: 1px solid #cbd5df;
    vertical-align: middle;
}

.print-table tbody tr:nth-child(even) {
    background: #f2f6fa;
}

.print-table .center {
    text-align: center;
}

.print-table .nowrap {
    white-space: nowrap;
}

.print-table .money-cell {
    text-align: right;
    white-space: nowrap;
    font-weight: 700;
}

.print-table tfoot td {
    padding: 10px 8px;

    background: #fff24b;
    color: #000000;

    border: 1px solid #c8b900;

    font-size: 13px;
    font-weight: 900;
}

.print-general-summary {
    margin-top: 22px;
}

.print-general-summary h2 {
    margin: 0 0 12px;

    color: #17365d;
    font-size: 16px;
}

.print-general-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 10px;
}

.print-general-grid > div {
    padding: 14px;

    background: #d9eaf7;
    border: 1px solid #a9c3db;
}

.print-general-grid .yellow {
    background: #fff24b;
    border-color: #c8b900;
}

.print-general-grid .green {
    background: #e4f3e5;
    border-color: #afd3b2;
}

.print-footer {
    display: flex;
    justify-content: space-between;

    margin-top: 25px;
    padding-top: 12px;

    border-top: 1px solid #b8c6d3;

    color: #60748a;
    font-size: 10px;
}

@media print {

    @page {
        size: A4 landscape;
        margin: 10mm;
    }

    body.print-report-body {
        background: #ffffff;
    }

    .no-print {
        display: none !important;
    }

    .print-report {
        max-width: none;
        margin: 0;
        padding: 0;

        box-shadow: none;
    }

    .print-header,
    .print-kpis,
    .print-general-summary,
    .print-footer {
        break-inside: avoid;
    }

    .print-table thead {
        display: table-header-group;
    }

    .print-table tfoot {
        display: table-footer-group;
    }

    .print-table tr {
        break-inside: avoid;
    }

    .print-table {
        font-size: 9px;
    }

    .print-table th {
        font-size: 8px;
        padding: 6px 4px;
    }

    .print-table td {
        padding: 5px 4px;
    }

    .print-company h1 {
        font-size: 18px;
    }

    .print-logo {
        font-size: 17px;
        padding: 12px;
    }
}


/* ==========================================================
   V9 — IMPORTAÇÃO DOS PDF DAS NF EMITIDAS
   ========================================================== */

.pdf-result-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}

.pdf-result {
    background: #ffffff;
    border: 1px solid #d8e0e8;
    border-top: 4px solid #2f75b5;
    border-radius: 10px;
    padding: 16px;
}

.pdf-result span {
    display: block;
    color: #64748b;
    font-size: 12px;
}

.pdf-result strong {
    display: block;
    margin-top: 6px;
    color: #17365d;
    font-size: 24px;
}

.pdf-result.success {
    border-top-color: #2e7d32;
}

.pdf-result.duplicate {
    border-top-color: #64748b;
}

.pdf-result.warning {
    border-top-color: #ed9b20;
}

.pdf-result.error {
    border-top-color: #b71c1c;
}

.pdf-history-table,
.pdf-report-table {
    min-width: 1250px;
}

.pdf-history-table .money-cell,
.pdf-report-table .money-cell {
    text-align: right;
    white-space: nowrap;
}

.pdf-status {
    display: inline-block;
    padding: 6px 9px;
    border-radius: 999px;
    background: #edf2f7;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.pdf-status.importada {
    background: #dff3e1;
    color: #1b5e20;
}

.pdf-status.já-lançada {
    background: #dcecff;
    color: #174f87;
}

.pdf-status.aguardando-conferência {
    background: #fff0cf;
    color: #8a5a00;
}

.pdf-status.erro {
    background: #fde2e2;
    color: #9b1c1c;
}

.pdf-report-table tfoot td {
    background: #fff24b;
    color: #000000;
    font-weight: 900;
}

@media (max-width: 850px) {
    .pdf-result-grid {
        grid-template-columns: 1fr 1fr;
    }
}


/* ==========================================================
   V13 — CONFIRMAÇÃO MANUAL DE PDF
   ========================================================== */

.confirm-pdf-form {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 190px;
}

.confirm-pdf-form select {
    width: 100%;
    min-width: 190px;
    padding: 7px;
    border: 1px solid #b8c6d6;
    border-radius: 7px;
    background: #ffffff;
    font-size: 11px;
}

.confirm-pdf-form .btn {
    width: 100%;
    white-space: nowrap;
}


/* ==========================================================
   V16 — RELATÓRIO GERENCIAL INOVADOR
   ========================================================== */

.executive-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 17px;
}

.executive-header h2 {
    margin: 5px 0 5px;
    color: #17365d;
    font-size: 27px;
}

.executive-header p {
    margin: 0;
    color: #64748b;
}

.executive-period {
    min-width: 145px;
    padding: 14px 18px;
    border-radius: 12px;
    background: #17365d;
    color: #ffffff;
    text-align: center;
}

.executive-period span {
    display: block;
    margin-bottom: 4px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.5px;
}

.executive-period strong {
    font-size: 28px;
}

.management-explanation {
    display: flex;
    gap: 13px;
    align-items: flex-start;
    margin-bottom: 18px;
    padding: 15px 17px;
    border: 1px solid #bdd4e8;
    border-left: 5px solid #2f75b5;
    border-radius: 11px;
    background: #edf6fd;
}

.management-explanation p {
    margin: 5px 0 0;
    color: #49647d;
    line-height: 1.45;
}

.explanation-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 27px;
    height: 27px;
    border-radius: 50%;
    background: #2f75b5;
    color: #ffffff;
    font-weight: 900;
}

.executive-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 13px;
    margin-bottom: 18px;
}

.executive-card {
    position: relative;
    overflow: hidden;
    padding: 19px;
    border: 1px solid #d8e0e8;
    border-radius: 13px;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(23, 54, 93, 0.07);
}

.executive-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: #2f75b5;
}

.executive-card span {
    display: block;
    min-height: 29px;
    color: #526275;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.3px;
}

.executive-card strong {
    display: block;
    margin: 7px 0;
    color: #17365d;
    font-size: 22px;
    white-space: nowrap;
}

.executive-card small {
    color: #73869a;
    line-height: 1.3;
}

.history-card::before {
    background: #f1ce18;
}

.current-card::before {
    background: #2f75b5;
}

.pending-card::before {
    background: #2e7d32;
}

.history-breakdown {
    margin-bottom: 18px;
    padding: 20px;
    border: 1px solid #d8e0e8;
    border-radius: 13px;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(23, 54, 93, 0.06);
}

.breakdown-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.breakdown-title span {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 900;
}

.breakdown-title strong {
    display: block;
    margin-top: 4px;
    color: #17365d;
    font-size: 23px;
}

.progress-percent {
    color: #2f75b5;
    font-size: 24px;
    font-weight: 900;
}

.main-progress,
.daily-progress {
    overflow: hidden;
    height: 12px;
    margin: 15px 0;
    border-radius: 999px;
    background: #e4ebf2;
}

.main-progress-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        #2f75b5,
        #65a4d8
    );
}

.breakdown-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px;
}

.breakdown-grid > div {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px;
    border-radius: 10px;
    background: #f5f8fb;
}

.breakdown-grid small {
    display: block;
    color: #64748b;
}

.breakdown-grid strong {
    display: block;
    margin-top: 4px;
    color: #17365d;
}

.breakdown-dot {
    width: 12px;
    height: 36px;
    border-radius: 999px;
}

.linked-dot {
    background: #2f75b5;
}

.pdf-dot {
    background: #f1ce18;
}

.performance-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 13px;
    margin-bottom: 18px;
}

.performance-card {
    padding: 17px;
    border: 1px solid #d8e0e8;
    border-radius: 12px;
    background: #ffffff;
}

.performance-card span {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 900;
}

.performance-card strong {
    display: block;
    margin: 7px 0;
    color: #17365d;
    font-size: 22px;
}

.performance-card small {
    color: #73869a;
}

.best-day-card {
    border-color: #ead667;
    background: #fffbed;
}

.evolution-panel {
    padding: 21px;
}

.evolution-head p,
.compact-table-panel .panel-head p {
    margin: 5px 0 0;
    color: #64748b;
}

.daily-evolution {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.evolution-row {
    display: grid;
    grid-template-columns: 75px 1fr;
    gap: 16px;
    align-items: center;
    padding: 14px 4px;
    border-bottom: 1px solid #e4eaf0;
}

.evolution-row:last-child {
    border-bottom: 0;
}

.evolution-date {
    text-align: center;
}

.evolution-date strong {
    display: block;
    color: #17365d;
    font-size: 17px;
}

.evolution-date small {
    color: #8493a3;
}

.evolution-values {
    display: flex;
    justify-content: space-between;
    gap: 15px;
}

.evolution-values strong {
    display: block;
    color: #17365d;
}

.evolution-values small {
    color: #73869a;
}

.accumulated-value {
    text-align: right;
}

.accumulated-value span {
    display: block;
    color: #8493a3;
    font-size: 10px;
    font-weight: 800;
}

.daily-progress {
    height: 8px;
    margin: 9px 0 0;
}

.daily-progress-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        #17365d,
        #2f75b5
    );
}

.compact-table-panel {
    margin-top: 18px;
}

@media (max-width: 1100px) {
    .executive-kpis {
        grid-template-columns: 1fr 1fr;
    }

    .performance-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .executive-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .executive-period {
        width: 100%;
    }

    .executive-kpis,
    .performance-grid,
    .breakdown-grid {
        grid-template-columns: 1fr;
    }

    .evolution-row {
        grid-template-columns: 55px 1fr;
    }

    .evolution-values {
        flex-direction: column;
    }

    .accumulated-value {
        text-align: left;
    }
}


/* ==========================================================
   V17 — QUADRO-RESUMO IGUAL À PLANILHA
   ========================================================== */

.spreadsheet-summary-section {
    margin: 22px 0;
}

.spreadsheet-summary-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;
    margin-bottom: 12px;
}

.spreadsheet-summary-header h2 {
    margin: 4px 0 0;
    color: #17365d;
    font-size: 21px;
}

.spreadsheet-print-button {
    border-color: #17365d;
    color: #17365d;
    white-space: nowrap;
}

.spreadsheet-summary-wrapper {
    overflow-x: auto;

    padding: 16px;

    border: 1px solid #d1dce7;
    border-radius: 12px;

    background: #ffffff;

    box-shadow:
        0 5px 18px
        rgba(23, 54, 93, 0.07);
}

.spreadsheet-summary-table {
    width: 100%;
    min-width: 950px;

    border-collapse: collapse;
    table-layout: fixed;

    color: #000000;
}

.spreadsheet-summary-table td {
    border: 1px solid #000000;

    padding: 7px 6px;

    text-align: center;
    vertical-align: middle;

    font-weight: 800;
    white-space: nowrap;
}

.spreadsheet-values-row td {
    background: #5ba6d6;

    font-size: 14px;
    font-variant-numeric: tabular-nums;
}

.spreadsheet-values-row
.spreadsheet-base-cell {
    min-width: 160px;
}

.spreadsheet-values-row
.spreadsheet-total-cell {
    min-width: 155px;

    background: #fff200;

    font-size: 15px;
    font-weight: 900;
}

.spreadsheet-dates-row td {
    background: #ffffff;

    font-size: 12px;
    font-weight: 800;
}

.spreadsheet-dates-row
.spreadsheet-total-label {
    text-align: left;
    padding-left: 9px;
}

.spreadsheet-dates-row
.spreadsheet-total-label-final {
    background: #fff200;

    font-size: 13px;
    font-weight: 900;
}

.spreadsheet-title-row td {
    padding: 7px;

    background: #ffffff;

    font-size: 14px;
    font-weight: 900;
    letter-spacing: 0.5px;
}

.spreadsheet-summary-legend {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;

    margin-top: 10px;

    color: #60748a;
    font-size: 11px;
}

.spreadsheet-summary-legend > div {
    display: flex;
    align-items: center;
    gap: 6px;
}

.legend-box {
    display: inline-block;

    width: 17px;
    height: 11px;

    border: 1px solid #798897;
}

.legend-box.base,
.legend-box.daily {
    background: #5ba6d6;
}

.legend-box.total {
    background: #fff200;
}

@media print {

    .spreadsheet-summary-header,
    .spreadsheet-summary-legend {
        display: none !important;
    }

    .spreadsheet-summary-wrapper {
        overflow: visible;
        padding: 0;

        border: 0;
        border-radius: 0;

        box-shadow: none;
    }

    .spreadsheet-summary-table {
        min-width: 0;
    }

    .spreadsheet-summary-table td {
        padding: 5px 3px;
        font-size: 9px;
    }
}

@media (max-width: 750px) {

    .spreadsheet-summary-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .spreadsheet-print-button {
        width: 100%;
    }
}


/* ==========================================================
   V18 — CONCILIAÇÃO COM A PLANILHA OFICIAL
   ========================================================== */

.spreadsheet-summary-header p {
    margin: 5px 0 0;
    color: #64748b;
}

.spreadsheet-balance-row td {
    padding: 9px 7px;

    background: #dff0df;
    color: #143f1b;

    border: 1px solid #000000;

    font-size: 14px;
    font-weight: 900;
}

.spreadsheet-balance-row td:first-child {
    text-align: right;
}

.balance-explanation-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);

    gap: 12px;
    margin-top: 15px;
}

.balance-explanation-grid article {
    padding: 16px;

    border: 1px solid #d4dee8;
    border-radius: 11px;

    background: #ffffff;
}

.balance-explanation-grid span {
    display: block;

    color: #60748a;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.3px;
}

.balance-explanation-grid strong {
    display: block;

    margin: 7px 0;

    color: #17365d;
    font-size: 20px;
    white-space: nowrap;
}

.balance-explanation-grid small {
    color: #75879a;
    line-height: 1.35;
}

.balance-explanation-grid .balance-current {
    background: #e7f4e8;
    border-color: #acd3af;
}

.reconciliation-panel {
    margin-top: 17px;
    padding: 20px;

    border: 1px solid #d8e0e8;
    border-radius: 12px;

    background: #ffffff;
}

.reconciliation-panel .panel-head p {
    margin: 5px 0 0;
    color: #64748b;
}

.reconciliation-table {
    width: 100%;
    min-width: 900px;

    border-collapse: collapse;
}

.reconciliation-table th {
    padding: 11px;

    background: #17365d;
    color: #ffffff;

    text-align: center;
    font-size: 12px;
}

.reconciliation-table td {
    padding: 11px;

    border-bottom: 1px solid #dde5ed;
    text-align: center;
}

.reconciliation-table .money-cell {
    text-align: right;
    white-space: nowrap;
}

.reconciliation-table tfoot td {
    background: #fff350;
    color: #000000;

    font-weight: 900;
    border-top: 2px solid #c0af00;
}

.difference-positive {
    color: #a05b00;
    font-weight: 800;
}

.difference-negative {
    color: #ad2222;
    font-weight: 800;
}

.difference-zero {
    color: #24752a;
    font-weight: 800;
}

.reconciliation-status {
    display: inline-flex;

    padding: 6px 9px;

    border-radius: 999px;

    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.reconciliation-status.reconciled {
    background: #e1f2e2;
    color: #246829;
}

.reconciliation-status.missing {
    background: #fff0cf;
    color: #865900;
}

.reconciliation-status.above {
    background: #fde2e2;
    color: #982323;
}

@media (max-width: 1050px) {
    .balance-explanation-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 650px) {
    .balance-explanation-grid {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================
   V19 — PORTAL MULTILOJAS
   ========================================================== */

.stores-page-title h1 {
    margin-top: 4px;
}

.stores-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 18px;
    margin-bottom: 22px;
}

.store-card {
    display: flex;
    flex-direction: column;

    min-height: 275px;
    padding: 20px;

    border: 1px solid #d5e0ea;
    border-radius: 14px;

    background: #ffffff;

    box-shadow:
        0 7px 22px
        rgba(23, 54, 93, 0.08);
}

.store-card-top {
    display: flex;
    align-items: center;
    gap: 14px;

    margin-bottom: 20px;
}

.store-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 46px;
    height: 46px;

    border-radius: 13px;

    background: #17365d;
    color: #ffffff;

    font-size: 20px;
    font-weight: 900;
}

.store-system {
    display: block;

    color: #2f75b5;

    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.store-card h2 {
    margin: 4px 0 0;

    color: #17365d;
    font-size: 20px;
}

.store-card-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 10px;
    margin-bottom: 15px;
}

.store-card-stats > div {
    padding: 12px;

    border-radius: 9px;

    background: #f3f7fb;
}

.store-card-stats span {
    display: block;

    color: #718397;
    font-size: 10px;
    font-weight: 800;
}

.store-card-stats strong {
    display: block;

    margin-top: 5px;

    color: #17365d;
    font-size: 21px;
}

.store-status {
    margin-bottom: 17px;
    padding: 9px 11px;

    border-radius: 8px;

    font-size: 11px;
    font-weight: 800;
}

.store-status.active {
    background: #e4f3e5;
    color: #216627;
}

.store-status.preparing {
    background: #fff0cf;
    color: #805600;
}

.store-card-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 9px;
    margin-top: auto;
}

.store-card-actions .btn {
    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;
}

.multistore-info {
    padding: 22px;

    border: 1px solid #d5e0ea;
    border-radius: 14px;

    background: #ffffff;
}

.multistore-info h2 {
    margin: 0 0 17px;

    color: #17365d;
}

.multistore-flow {
    display: grid;
    grid-template-columns: repeat(4, 1fr);

    gap: 12px;
}

.multistore-flow > div {
    display: flex;
    align-items: center;
    gap: 10px;

    padding: 13px;

    border-radius: 10px;

    background: #f3f7fb;
}

.multistore-flow strong {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 29px;
    height: 29px;

    border-radius: 50%;

    background: #2f75b5;
    color: #ffffff;
}

.multistore-flow span {
    color: #526275;
    font-size: 12px;
    font-weight: 700;
}

@media (max-width: 1050px) {
    .stores-grid {
        grid-template-columns: 1fr 1fr;
    }

    .multistore-flow {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 650px) {
    .stores-grid,
    .multistore-flow {
        grid-template-columns: 1fr;
    }

    .store-card-actions {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================
   V21 — DASHBOARD SOFT COSMOS POR LOJA
   ========================================================== */

.soft-dashboard-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 20px;
    margin-bottom: 20px;
}

.soft-dashboard-header h1 {
    margin: 5px 0;
    color: #17365d;
}

.soft-dashboard-header p {
    margin: 0;
    color: #64748b;
}

.soft-filter-panel {
    display: grid;
    grid-template-columns:
        1fr
        1fr
        1.4fr
        auto;

    align-items: end;
    gap: 12px;

    margin-bottom: 18px;
    padding: 18px;

    border: 1px solid #d4dee8;
    border-radius: 12px;

    background: #ffffff;
}

.soft-filter-panel label {
    display: block;

    margin-bottom: 6px;

    color: #17365d;
    font-size: 11px;
    font-weight: 900;
}

.soft-filter-panel input,
.soft-filter-panel select {
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;

    border: 1px solid #c4d0dc;
    border-radius: 8px;

    background: #ffffff;
}

.soft-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);

    gap: 14px;
    margin-bottom: 17px;
}

.soft-summary-grid article {
    padding: 18px;

    border: 1px solid #d4dee8;
    border-radius: 12px;

    background: #ffffff;
}

.soft-summary-grid span {
    display: block;

    color: #64748b;
    font-size: 11px;
    font-weight: 800;
}

.soft-summary-grid strong {
    display: block;

    margin: 7px 0;

    color: #17365d;
    font-size: 23px;
}

.soft-summary-grid small {
    color: #8291a2;
    font-size: 10px;
}

.soft-summary-grid
.soft-balance-card {
    border-top: 4px solid #c73434;
}

.soft-summary-grid
.soft-balance-card strong {
    color: #9c2525;
}

.soft-progress-panel {
    margin-bottom: 17px;
    padding: 18px;

    border: 1px solid #d4dee8;
    border-radius: 12px;

    background: #ffffff;
}

.soft-progress-title {
    display: flex;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 12px;
}

.soft-progress-title > div {
    display: flex;
    flex-direction: column;
}

.soft-progress-title span {
    color: #718397;
    font-size: 10px;
    font-weight: 800;
}

.soft-progress-title strong {
    margin-top: 3px;

    color: #17365d;
    font-size: 18px;
}

.soft-progress-track {
    height: 12px;
    overflow: hidden;

    border-radius: 999px;

    background: #e4ebf2;
}

.soft-progress-value {
    height: 100%;

    border-radius: inherit;

    background: #2f75b5;
}

.soft-table-panel {
    padding: 20px;

    border: 1px solid #d4dee8;
    border-radius: 12px;

    background: #ffffff;
}

.soft-table-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 15px;
    margin-bottom: 15px;
}

.soft-table-header h2 {
    margin: 0;

    color: #17365d;
}

.soft-table-header p {
    margin: 5px 0 0;

    color: #7b8b9c;
    font-size: 11px;
}

.soft-store-badge {
    padding: 8px 12px;

    border-radius: 999px;

    background: #e5f0fb;
    color: #18558d;

    font-size: 11px;
    font-weight: 900;
}

.soft-sales-table {
    width: 100%;
    min-width: 1200px;

    border-collapse: collapse;
}

.soft-sales-table th {
    padding: 11px 9px;

    background: #17365d;
    color: #ffffff;

    font-size: 11px;
    text-align: left;
}

.soft-sales-table td {
    padding: 11px 9px;

    border-bottom: 1px solid #e0e7ee;

    color: #26384b;
    font-size: 12px;
}

.soft-sales-table tbody tr:hover {
    background: #f5f9fd;
}

.soft-sales-table .money-cell {
    text-align: right;
    white-space: nowrap;
}

.soft-balance-value {
    color: #a12626 !important;
    font-weight: 900;
}

.soft-sales-table tfoot td {
    background: #fff350;
    color: #000000;

    border-top: 2px solid #c3b100;

    font-weight: 900;
}

.row-progress {
    min-width: 105px;
}

.row-progress > div {
    height: 7px;
    overflow: hidden;

    border-radius: 999px;

    background: #e4ebf2;
}

.row-progress > div span {
    display: block;
    height: 100%;

    border-radius: inherit;

    background: #2f75b5;
}

.row-progress small {
    display: block;

    margin-top: 4px;

    color: #718397;
    text-align: right;
}

.soft-status {
    display: inline-flex;

    padding: 6px 9px;

    border-radius: 999px;

    font-size: 9px;
    font-weight: 900;
    white-space: nowrap;
}

.soft-status.completed {
    background: #ddf1df;
    color: #23682a;
}

.soft-status.partial {
    background: #fff0cf;
    color: #855900;
}

.soft-status.pending {
    background: #fbe0e0;
    color: #9b2525;
}

.soft-error-panel {
    display: flex;
    flex-direction: column;
    gap: 5px;

    padding: 18px;

    border: 1px solid #e2aaaa;
    border-radius: 10px;

    background: #fff0f0;
    color: #882424;
}

.empty-table-message {
    padding: 30px !important;

    color: #718397 !important;
    text-align: center;
}

@media (max-width: 1000px) {
    .soft-summary-grid {
        grid-template-columns: 1fr 1fr;
    }

    .soft-filter-panel {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 650px) {
    .soft-dashboard-header,
    .soft-progress-title {
        flex-direction: column;
    }

    .soft-summary-grid,
    .soft-filter-panel {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================
   V22 — PADRÃO DEFINITIVO DOS DASHBOARDS SOFT COSMOS
   ========================================================== */

.sc-page {
    width: 100%;
}

.sc-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 24px;
    margin-bottom: 22px;
}

.sc-hero-main {
    display: flex;
    align-items: center;

    gap: 15px;
}

.sc-store-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 54px;
    height: 54px;

    border-radius: 15px;

    background: #173f6c;
    color: #ffffff;

    font-size: 23px;
    font-weight: 900;

    box-shadow:
        0 8px 18px
        rgba(23, 63, 108, 0.18);
}

.sc-eyebrow {
    display: block;

    color: #2674b8;

    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.sc-hero h1 {
    margin: 4px 0 5px;

    color: #15385f;

    font-size: 30px;
    line-height: 1.1;
}

.sc-hero p {
    margin: 0;

    color: #687b8f;
    font-size: 14px;
}

.sc-hero-actions {
    display: flex;
    align-items: center;

    gap: 10px;
}

.sc-btn-primary,
.sc-filter-button {
    background: #2f7bbc !important;
    color: #ffffff !important;

    border-color: #2f7bbc !important;
}

.sc-btn-secondary {
    background: #ffffff !important;
    color: #246da9 !important;

    border: 1px solid #78a7d0 !important;
}

.sc-filter-card {
    display: grid !important;

    grid-template-columns:
        minmax(170px, 1fr)
        minmax(170px, 1fr)
        minmax(230px, 1.5fr)
        auto !important;

    align-items: end !important;

    gap: 14px !important;
    margin-bottom: 18px !important;
    padding: 18px !important;

    border: 1px solid #d3dee8 !important;
    border-radius: 13px !important;

    background: #ffffff !important;

    box-shadow:
        0 6px 20px
        rgba(20, 55, 90, 0.06);
}

.sc-filter-field label {
    display: block !important;

    margin-bottom: 7px !important;

    color: #183d64 !important;

    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: 0.5px !important;
}

.sc-filter-field input,
.sc-filter-field select {
    width: 100% !important;
    height: 43px !important;

    padding: 8px 11px !important;

    border: 1px solid #bdccd9 !important;
    border-radius: 8px !important;

    background: #ffffff !important;
    color: #24384c !important;

    font-size: 13px !important;
}

.sc-filter-button {
    min-width: 145px;
    height: 43px;
}

.sc-summary-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;

    gap: 14px !important;
    margin-bottom: 17px !important;
}

.sc-summary-card {
    min-height: 132px;

    padding: 18px !important;

    border: 1px solid #d5e0e9 !important;
    border-radius: 13px !important;

    background: #ffffff !important;

    box-shadow:
        0 6px 18px
        rgba(19, 53, 87, 0.06);
}

.sc-summary-card::before {
    content: "";

    display: block;

    width: 42px;
    height: 4px;

    margin-bottom: 14px;

    border-radius: 999px;

    background: #2f7bbc;
}

.sc-summary-delivered::before {
    background: #2e8a44;
}

.sc-summary-pending::before {
    background: #cb3e3e;
}

.sc-summary-label {
    color: #6c7f92 !important;

    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: 0.5px !important;
}

.sc-summary-card strong {
    display: block !important;

    margin: 7px 0 5px !important;

    color: #15385f !important;

    font-size: 24px !important;
    line-height: 1.15 !important;

    white-space: nowrap;
}

.sc-summary-pending strong {
    color: #a62d2d !important;
}

.sc-summary-card small {
    color: #8190a0 !important;
    font-size: 10px !important;
}

.sc-progress-card {
    margin-bottom: 18px !important;
    padding: 18px !important;

    border: 1px solid #d5e0e9 !important;
    border-radius: 13px !important;

    background: #ffffff !important;

    box-shadow:
        0 6px 18px
        rgba(19, 53, 87, 0.05);
}

.sc-progress-info {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 20px;
    margin-bottom: 12px;
}

.sc-progress-info span {
    display: block;

    color: #718397;

    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.4px;
}

.sc-progress-info strong {
    display: block;

    margin-top: 3px;

    color: #15385f;
    font-size: 18px;
}

.sc-period-info {
    text-align: right;
}

.sc-progress-track {
    height: 12px;
    overflow: hidden;

    border-radius: 999px;

    background: #e3ebf2;
}

.sc-progress-bar {
    min-width: 3px;
    height: 100%;

    border-radius: inherit;

    background:
        linear-gradient(
            90deg,
            #235f97,
            #3489cc
        );
}

.sc-table-card {
    padding: 20px !important;

    border: 1px solid #d5e0e9 !important;
    border-radius: 13px !important;

    background: #ffffff !important;

    box-shadow:
        0 6px 20px
        rgba(19, 53, 87, 0.06);
}

.sc-table-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 16px;
    margin-bottom: 16px;
}

.sc-table-heading h2 {
    margin: 4px 0 !important;

    color: #15385f !important;
    font-size: 22px !important;
}

.sc-table-heading p {
    margin: 0 !important;

    color: #7a8a9a !important;
    font-size: 11px !important;
}

.sc-store-pill {
    display: inline-flex;

    padding: 8px 13px;

    border-radius: 999px;

    background: #e3f0fb;
    color: #246da9;

    font-size: 11px;
    font-weight: 900;

    white-space: nowrap;
}

.sc-table-scroll {
    width: 100%;
    overflow-x: auto;

    border-radius: 9px;
}

.sc-table {
    width: 100% !important;
    min-width: 1180px !important;

    border-collapse: collapse !important;
}

.sc-table th {
    padding: 12px 10px !important;

    background: #183f6b !important;
    color: #ffffff !important;

    border: none !important;

    font-size: 11px !important;
    font-weight: 800 !important;

    text-align: left !important;
    white-space: nowrap !important;
}

.sc-table th:first-child {
    border-radius: 8px 0 0 0;
}

.sc-table th:last-child {
    border-radius: 0 8px 0 0;
}

.sc-table td {
    padding: 12px 10px !important;

    border-bottom: 1px solid #e1e8ef !important;

    color: #263b50 !important;

    font-size: 12px !important;
    vertical-align: middle !important;
}

.sc-table tbody tr:nth-child(even) {
    background: #f7faff;
}

.sc-table tbody tr:hover {
    background: #eef6fc;
}

.sc-nowrap {
    white-space: nowrap;
}

.sc-condition {
    min-width: 180px;
}

.sc-money {
    text-align: right !important;
    white-space: nowrap !important;
}

.sc-pending-money {
    color: #a42d2d !important;
    font-weight: 900 !important;
}

.sc-row-progress {
    min-width: 105px;
}

.sc-row-track {
    height: 7px;
    overflow: hidden;

    border-radius: 999px;

    background: #e2eaf1;
}

.sc-row-track span {
    display: block;

    height: 100%;

    border-radius: inherit;

    background: #3182c3;
}

.sc-row-progress small {
    display: block;

    margin-top: 4px;

    color: #718397;
    text-align: right;
}

.sc-status {
    display: inline-flex;
    align-items: center;

    padding: 6px 9px;

    border-radius: 999px;

    font-size: 9px;
    font-weight: 900;

    white-space: nowrap;
}

.sc-completed {
    background: #dff1e1;
    color: #236b2a;
}

.sc-partial {
    background: #fff0cd;
    color: #845900;
}

.sc-pending {
    background: #f9dfdf;
    color: #9d2929;
}

.sc-table tfoot td {
    padding: 13px 10px !important;

    background: #fff14b !important;
    color: #111111 !important;

    border-top: 2px solid #c9b900 !important;

    font-weight: 900 !important;
}

.sc-empty {
    padding: 35px !important;

    color: #74879a !important;
    text-align: center !important;
}

.sc-error {
    display: flex;
    flex-direction: column;

    gap: 5px;
    padding: 18px;

    border: 1px solid #e3aaaa;
    border-radius: 11px;

    background: #fff1f1;
    color: #8e2929;
}

@media (max-width: 1100px) {
    .sc-summary-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    .sc-filter-card {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    .sc-filter-button {
        width: 100%;
    }
}

@media (max-width: 700px) {
    .sc-hero,
    .sc-progress-info,
    .sc-table-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .sc-hero-actions {
        width: 100%;
    }

    .sc-hero-actions .btn {
        flex: 1;
    }

    .sc-filter-card,
    .sc-summary-grid {
        grid-template-columns: 1fr !important;
    }

    .sc-period-info {
        text-align: left;
    }

    .sc-summary-card strong {
        white-space: normal;
    }
}


/* ==========================================================
   V24 — PAINEL DE LOJAS NO PADRÃO DO PORTAL DE METAS
   ========================================================== */

.ml-page {
    width: 100%;
}

.ml-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;
    margin-bottom: 20px;
}

.ml-eyebrow {
    color: #2674b8;

    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1px;
}

.ml-header h1 {
    margin: 5px 0;

    color: #15385f;
    font-size: 32px;
}

.ml-header p {
    margin: 0;

    color: #6d7f91;
}

.ml-header-status {
    display: flex;
    align-items: center;

    gap: 10px;
    padding: 12px 16px;

    border: 1px solid #cfe0d2;
    border-radius: 12px;

    background: #f1faf2;
}

.ml-header-status strong,
.ml-header-status small {
    display: block;
}

.ml-header-status strong {
    color: #24642e;
    font-size: 12px;
}

.ml-header-status small {
    color: #648069;
    font-size: 10px;
}

.ml-online-dot {
    width: 11px;
    height: 11px;

    border-radius: 50%;

    background: #2e9645;

    box-shadow:
        0 0 0 5px
        rgba(46, 150, 69, 0.13);
}

.ml-overview {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 13px;
    margin-bottom: 20px;
}

.ml-overview article {
    padding: 15px 17px;

    border: 1px solid #d7e1ea;
    border-radius: 12px;

    background: #ffffff;

    box-shadow:
        0 5px 16px
        rgba(20, 55, 90, 0.05);
}

.ml-overview span {
    display: block;

    color: #718397;

    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.5px;
}

.ml-overview strong {
    display: block;

    margin: 5px 0;

    color: #15385f;
    font-size: 20px;
}

.ml-overview small {
    color: #8392a1;
    font-size: 9px;
}

.ml-overview-highlight {
    border-top: 4px solid #2f7bbc !important;
}

.ml-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 18px;
}

.ml-store-card {
    position: relative;

    padding: 20px;

    border: 1px solid #d5e0e9;
    border-radius: 15px;

    background: #ffffff;

    box-shadow:
        0 8px 24px
        rgba(20, 55, 90, 0.07);

    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease;
}

.ml-store-card:hover {
    transform: translateY(-3px);

    box-shadow:
        0 12px 30px
        rgba(20, 55, 90, 0.12);
}

.ml-fenix-card {
    border-top: 4px solid #2f7bbc;
}

.ml-card-top {
    display: flex;
    align-items: center;

    gap: 12px;
    margin-bottom: 18px;
}

.ml-number {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 48px;
    height: 48px;

    border-radius: 13px;

    background: #173f6c;
    color: #ffffff;

    font-size: 20px;
    font-weight: 900;
}

.ml-system {
    display: block;

    margin-bottom: 3px;

    color: #2674b8;

    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.6px;
}

.ml-card-top h2 {
    margin: 0;

    color: #15385f;
    font-size: 19px;
}

.ml-status-pill {
    margin-left: auto;
    padding: 5px 8px;

    border-radius: 999px;

    font-size: 8px;
    font-weight: 900;
}

.ml-status-pill.online {
    background: #dff2e2;
    color: #24692d;
}

.ml-status-pill.loading {
    background: #fff0cc;
    color: #865b00;
}

.ml-status-pill.error {
    background: #f8dddd;
    color: #982727;
}

.ml-metrics {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 14px;
}

.ml-metrics > div {
    min-height: 74px;
    padding: 12px;

    border-radius: 10px;

    background: #f1f6fb;
}

.ml-metrics span {
    display: block;

    color: #718397;

    font-size: 9px;
    font-weight: 800;
}

.ml-metrics strong {
    display: block;

    margin-top: 7px;

    color: #15385f;

    font-size: 21px;
    line-height: 1.1;
}

.ml-metrics .ml-money {
    font-size: 17px;
}

.ml-info-bar {
    min-height: 37px;
    margin-bottom: 15px;
    padding: 10px 12px;

    border-radius: 9px;

    font-size: 9px;
    font-weight: 800;
}

.ml-info-bar.success {
    background: #e1f2e3;
    color: #236b2b;
}

.ml-info-bar.loading {
    background: #fff0cd;
    color: #855b00;
}

.ml-info-bar.error {
    background: #f9dfdf;
    color: #982929;
}

.ml-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 9px;
}

.ml-actions .btn {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 42px;

    font-size: 12px;
    font-weight: 800;
}

@media (max-width: 1100px) {
    .ml-overview {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .ml-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .ml-header {
        align-items: stretch;
        flex-direction: column;
    }

    .ml-overview,
    .ml-grid {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================
   V25 — IDENTIDADE VISUAL NOTAS FUTURAS
   ========================================================== */

.brand-title,
.logo-title,
.nav-brand strong,
header .brand strong {
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.ml-fenix-card {
    border-top: 4px solid #2f7bbc !important;
}

.ml-fenix-card .ml-status-pill {
    background: #dff2e2 !important;
    color: #24692d !important;
}

.ml-fenix-card .ml-info-bar {
    background: #e1f2e3 !important;
    color: #236b2b !important;
}

/*
 Mantém o mesmo acabamento visual dos cards
 Soft Cosmos, preservando os dados próprios da Fênix NE.
*/
.ml-fenix-card,
.ml-store-card {
    min-height: 292px;
}

.ml-fenix-card .ml-card-top,
.ml-store-card .ml-card-top {
    min-height: 50px;
}

.ml-fenix-card .ml-metrics,
.ml-store-card .ml-metrics {
    min-height: 74px;
}

.ml-fenix-card .ml-actions,
.ml-store-card .ml-actions {
    margin-top: auto;
}

/* Cabeçalho principal do portal */
header,
.topbar,
.main-header {
    background: #173f6c;
}

header .brand,
.topbar .brand,
.main-header .brand {
    color: #ffffff;
}

/* Título padronizado nas páginas */
h1 {
    color: #15385f;
}

/* Rodapé genérico */
footer {
    color: #718397;
}


/* ==========================================================
   V26 — PADRÃO VISUAL DO PORTAL DE METAS
   ========================================================== */

.nf-metas-hero {
    position: relative;

    display: grid;
    grid-template-columns:
        minmax(260px, 310px)
        1fr
        minmax(220px, 270px);

    align-items: center;

    gap: 30px;

    width: 100%;
    min-height: 190px;

    margin-bottom: 28px;
    padding: 18px 26px;

    overflow: hidden;

    border-bottom: 5px solid #13d4e3;

    background:
        radial-gradient(
            circle at 55% 100%,
            rgba(68, 151, 255, 0.40),
            transparent 42%
        ),
        radial-gradient(
            circle at 95% 0%,
            rgba(89, 172, 255, 0.28),
            transparent 35%
        ),
        linear-gradient(
            120deg,
            #073b88 0%,
            #0758c4 52%,
            #2c82e6 100%
        );

    color: #ffffff;
}

.nf-metas-hero::before {
    content: "";

    position: absolute;
    left: 36%;
    bottom: -150px;

    width: 470px;
    height: 340px;

    border-radius: 50%;

    background:
        rgba(68, 149, 255, 0.16);
}

.nf-metas-logo-box,
.nf-metas-title,
.nf-metas-actions {
    position: relative;
    z-index: 2;
}

.nf-metas-logo-box {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 105px;
    padding: 14px;

    border-radius: 12px;

    background: #ffffff;

    box-shadow:
        0 10px 24px
        rgba(0, 26, 75, 0.22);
}

.nf-metas-logo {
    display: block;

    width: 100%;
    max-width: 275px;
    max-height: 90px;

    object-fit: contain;
}

.nf-metas-title {
    text-align: center;
}

.nf-metas-title h1 {
    margin: 0 0 5px;

    color: #ffffff !important;

    font-size: clamp(27px, 3vw, 39px);
    font-weight: 900;
    line-height: 1.1;

    text-shadow:
        0 3px 8px
        rgba(0, 35, 90, 0.25);
}

.nf-metas-title p {
    margin: 0;

    color: #ffffff;

    font-size: 15px;
}

.nf-metas-actions {
    display: flex;
    flex-direction: column;

    gap: 10px;
}

.nf-metas-button {
    min-height: 45px;
    padding: 9px 15px;

    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 10px;

    background:
        rgba(80, 154, 242, 0.34);

    color: #ffffff;

    cursor: pointer;

    font-size: 11px;
    font-weight: 900;

    transition:
        background 0.18s ease,
        transform 0.18s ease;
}

.nf-metas-button:hover {
    transform: translateY(-1px);

    background:
        rgba(255, 255, 255, 0.22);
}

.nf-metas-clock {
    margin-top: 4px;

    color: #ffffff;
    text-align: right;
}

.nf-metas-clock span,
.nf-metas-clock small,
.nf-metas-clock strong {
    display: block;
}

.nf-metas-clock span {
    font-size: 10px;
}

.nf-metas-clock small {
    margin-top: 3px;

    font-size: 9px;
}

.nf-metas-clock strong {
    margin-top: 2px;

    font-size: 12px;
}

/* Cards no mesmo azul do Portal de Metas */

.ml-number {
    background:
        linear-gradient(
            145deg,
            #073b88,
            #0860ce
        ) !important;
}

.ml-store-card {
    border-top:
        4px solid #167bd4 !important;
}

.ml-store-card .btn.primary {
    border-color: #0758c4 !important;

    background:
        linear-gradient(
            120deg,
            #0750b7,
            #0871df
        ) !important;

    color: #ffffff !important;
}

.ml-store-card .btn:not(.primary) {
    border-color: #1777d0 !important;

    background: #ffffff !important;
    color: #0758c4 !important;
}

.ml-overview-highlight {
    border-top-color: #167bd4 !important;
}

.ml-fenix-card .ml-metrics {
    grid-template-columns:
        0.85fr
        0.85fr
        1.4fr !important;
}

.ml-fenix-open-value strong {
    color: #0754ad !important;
    font-size: 16px !important;
}

@media (max-width: 1050px) {
    .nf-metas-hero {
        grid-template-columns:
            minmax(220px, 270px)
            1fr;
    }

    .nf-metas-actions {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    .nf-metas-clock {
        align-self: center;
    }
}

@media (max-width: 720px) {
    .nf-metas-hero {
        grid-template-columns: 1fr;

        padding: 18px;
    }

    .nf-metas-logo-box {
        max-width: 320px;
        margin: 0 auto;
    }

    .nf-metas-actions {
        display: flex;
    }

    .nf-metas-clock {
        text-align: center;
    }

    .ml-fenix-card .ml-metrics {
        grid-template-columns: 1fr !important;
    }
}


/* ==========================================================
   V27 — RESUMO FÊNIX POR ANO
   ========================================================== */

.ml-fenix-card .ml-metrics {
    grid-template-columns:
        0.82fr
        0.82fr
        1.36fr !important;
}

.ml-fenix-open-value {
    min-width: 0;
}

.ml-fenix-open-value strong {
    overflow: hidden;

    color: #0754ad !important;
    font-size: 15px !important;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.fenix-financial-summary {
    display: grid;
    grid-template-columns:
        minmax(130px, 0.9fr)
        minmax(170px, 1.5fr);

    gap: 8px;
    margin-bottom: 12px;
}

.fenix-total-emitted {
    padding: 9px 10px;

    border: 1px solid #c9dcf0;
    border-radius: 9px;

    background: #eef6ff;
}

.fenix-total-emitted span {
    display: block;

    color: #667d94;

    font-size: 8px;
    font-weight: 900;
    text-transform: uppercase;
}

.fenix-total-emitted strong {
    display: block;

    margin-top: 4px;

    color: #0754ad;

    font-size: 14px;
    white-space: nowrap;
}

.fenix-year-list {
    display: flex;
    align-items: stretch;

    gap: 5px;
    min-width: 0;
}

.fenix-year-item {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;

    min-width: 0;
    padding: 6px 7px;

    border: 1px solid #d7e4f1;
    border-radius: 8px;

    background: #f7faff;
    text-align: center;
}

.fenix-year-item span {
    color: #6c8196;

    font-size: 8px;
    font-weight: 900;
}

.fenix-year-item strong {
    display: block;

    margin-top: 3px;
    overflow: hidden;

    color: #153f6d;

    font-size: 10px;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.fenix-year-loading,
.fenix-year-error {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    padding: 8px;

    border-radius: 8px;

    background: #fff2cf;
    color: #795600;

    font-size: 8px;
    font-weight: 800;
    text-align: center;
}

.fenix-year-error {
    background: #f8dfdf;
    color: #922828;
}

@media (max-width: 760px) {
    .ml-fenix-card .ml-metrics,
    .fenix-financial-summary {
        grid-template-columns: 1fr !important;
    }

    .fenix-year-list {
        flex-wrap: wrap;
    }

    .fenix-year-item {
        min-width: calc(50% - 4px);
    }
}


/* ==========================================================
   V29 — PAINEL LIMPO DE LOJAS
   ========================================================== */

.nf29-page {
    width: 100%;
}

.nf29-hero {
    display: grid;

    grid-template-columns:
        minmax(250px, 310px)
        minmax(340px, 1fr)
        minmax(210px, 255px);

    align-items: center;

    gap: 28px;

    margin-bottom: 24px;
    padding: 22px 28px;

    border-bottom: 5px solid #10d2e4;

    background:
        radial-gradient(
            circle at 70% 110%,
            rgba(83, 167, 255, 0.38),
            transparent 45%
        ),
        linear-gradient(
            120deg,
            #063b88,
            #075fc9 58%,
            #2b83e6
        );

    color: #ffffff;
}

.nf29-logo-box {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 105px;
    padding: 14px;

    border-radius: 13px;

    background: #ffffff;

    box-shadow:
        0 10px 25px
        rgba(0, 25, 70, 0.24);
}

.nf29-logo {
    width: 100%;
    max-width: 275px;
    max-height: 90px;

    object-fit: contain;
}

.nf29-eyebrow {
    display: block;

    margin-bottom: 5px;

    color: #c8e6ff;

    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.8px;
}

.nf29-hero-title {
    text-align: center;
}

.nf29-hero-title h1 {
    margin: 0 0 6px;

    color: #ffffff !important;

    font-size: clamp(27px, 3vw, 39px);
    font-weight: 900;
    line-height: 1.08;
}

.nf29-hero-title p {
    margin: 0;

    color: #ffffff;
    font-size: 14px;
}

.nf29-hero-actions {
    display: flex;
    flex-direction: column;

    gap: 9px;
}

.nf29-action-button {
    min-height: 43px;
    padding: 9px 13px;

    border: 1px solid
        rgba(255, 255, 255, 0.75);
    border-radius: 9px;

    background:
        rgba(255, 255, 255, 0.12);
    color: #ffffff;

    cursor: pointer;

    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

.nf29-action-button:hover {
    background:
        rgba(255, 255, 255, 0.22);
}

.nf29-clock {
    margin-top: 4px;

    color: #ffffff;
    text-align: right;
}

.nf29-clock span,
.nf29-clock strong {
    display: block;
}

.nf29-clock span {
    font-size: 9px;
}

.nf29-clock strong {
    margin-top: 3px;
    font-size: 11px;
}

.nf29-overview {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 13px;
    margin-bottom: 20px;
}

.nf29-overview article {
    padding: 15px 17px;

    border: 1px solid #d6e1eb;
    border-radius: 12px;

    background: #ffffff;

    box-shadow:
        0 5px 16px
        rgba(20, 55, 90, 0.05);
}

.nf29-overview article > span {
    display: block;

    color: #718397;

    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.5px;
}

.nf29-overview article > strong {
    display: block;

    margin: 5px 0;

    color: #15385f;
    font-size: 20px;
}

.nf29-overview article > small {
    color: #8392a1;
    font-size: 8px;
}

.nf29-overview-total {
    border-top:
        4px solid #167bd4 !important;
}

.nf29-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    align-items: start;

    gap: 18px;
}

.nf29-store-card {
    overflow: hidden;

    border: 1px solid #d5e0e9;
    border-top: 4px solid #167bd4;
    border-radius: 15px;

    background: #ffffff;

    box-shadow:
        0 8px 24px
        rgba(20, 55, 90, 0.08);
}

.nf29-card-header {
    display: flex;
    align-items: center;

    gap: 12px;
    padding: 18px 18px 14px;
}

.nf29-store-number {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 47px;
    height: 47px;

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            #063d8a,
            #0871dc
        );

    color: #ffffff;

    font-size: 20px;
    font-weight: 900;
}

.nf29-store-name {
    min-width: 0;
}

.nf29-store-name span {
    display: block;

    color: #2674b8;

    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.6px;
}

.nf29-store-name h2 {
    margin: 2px 0 0;

    color: #15385f;
    font-size: 19px;
}

.nf29-status {
    margin-left: auto;
    padding: 5px 8px;

    border-radius: 999px;

    font-size: 8px;
    font-weight: 900;
}

.nf29-status.loading {
    background: #fff0cc;
    color: #835a00;
}

.nf29-status.online {
    background: #def1e1;
    color: #256a2e;
}

.nf29-status.error {
    background: #f9dddd;
    color: #992727;
}

.nf29-main-total {
    margin: 0 18px 12px;
    padding: 13px;

    border: 1px solid #bdd8f1;
    border-radius: 10px;

    background:
        linear-gradient(
            135deg,
            #eaf5ff,
            #f8fbff
        );
}

.nf29-main-total span {
    display: block;

    color: #617990;

    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.4px;
}

.nf29-main-total strong {
    display: block;

    margin-top: 5px;

    color: #0754ad;

    font-size: 20px;
    font-weight: 900;
    line-height: 1.15;

    white-space: normal;
}

.nf29-metrics {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;
    padding: 0 18px 12px;
}

.nf29-metrics > div {
    min-width: 0;
    min-height: 68px;
    padding: 10px;

    border-radius: 9px;

    background: #f1f6fb;
}

.nf29-metrics span {
    display: block;

    color: #718397;

    font-size: 7px;
    font-weight: 900;
    letter-spacing: 0.3px;
}

.nf29-metrics strong {
    display: block;

    margin-top: 6px;

    color: #15385f;

    font-size: 16px;
    line-height: 1.15;

    white-space: normal;
}

.nf29-metrics
.nf29-balance {
    color: #a32c2c;
}

.nf29-history-button {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: calc(100% - 36px);
    min-height: 38px;

    margin: 0 18px 10px;
    padding: 8px 11px;

    border: 1px solid #1475d0;
    border-radius: 8px;

    background: #ffffff;
    color: #0754ad;

    cursor: pointer;

    font-size: 10px;
    font-weight: 900;
}

.nf29-history-button:hover {
    background: #eef7ff;
}

.nf29-history-button strong {
    font-size: 16px;
}

.nf29-history {
    max-height: 330px;

    margin: 0 18px 10px;
    overflow-y: auto;

    border: 1px solid #d7e4f1;
    border-radius: 9px;

    background: #ffffff;
}

.nf29-history[hidden] {
    display: none !important;
}

.nf29-history-content {
    padding: 4px 9px;
}

.nf29-year-row {
    padding: 10px 3px;

    border-bottom: 1px solid #e2eaf2;
}

.nf29-year-row:last-child {
    border-bottom: 0;
}

.nf29-year-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 8px;
    margin-bottom: 7px;
}

.nf29-year-header strong {
    color: #153f6d;
    font-size: 13px;
}

.nf29-year-header small {
    color: #74899e;
    font-size: 8px;
    text-align: right;
}

.nf29-year-single span,
.nf29-year-values span {
    display: block;

    color: #74899e;

    font-size: 7px;
    font-weight: 900;
    text-transform: uppercase;
}

.nf29-year-single strong,
.nf29-year-values strong {
    display: block;

    margin-top: 2px;

    color: #153f6d;

    font-size: 9px;
    font-weight: 900;
    line-height: 1.2;

    white-space: normal;
}

.nf29-year-values {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 5px;
}

.nf29-info {
    margin: 0 18px 12px;
    padding: 9px 11px;

    border-radius: 8px;

    font-size: 8px;
    font-weight: 800;
}

.nf29-info.loading {
    background: #fff0cd;
    color: #845900;
}

.nf29-info.online {
    background: #e0f2e2;
    color: #246b2c;
}

.nf29-info.error {
    background: #f8dfdf;
    color: #982929;
}

.nf29-card-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 8px;
    padding: 0 18px 18px;
}

.nf29-button {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 41px;
    padding: 8px;

    border-radius: 8px;

    font-size: 11px;
    font-weight: 900;
    text-decoration: none;
}

.nf29-button.primary {
    border: 1px solid #0758c4;

    background:
        linear-gradient(
            120deg,
            #0750b7,
            #0871df
        );

    color: #ffffff;
}

.nf29-button.secondary {
    border: 1px solid #1777d0;

    background: #ffffff;
    color: #0758c4;
}

.nf29-empty {
    padding: 15px 8px;

    color: #75889b;

    font-size: 9px;
    text-align: center;
}

@media (max-width: 1150px) {
    .nf29-hero {
        grid-template-columns:
            minmax(230px, 280px)
            1fr;
    }

    .nf29-hero-actions {
        grid-column: 1 / -1;

        display: grid;
        grid-template-columns:
            1fr 1fr 1fr;
    }

    .nf29-overview,
    .nf29-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .nf29-hero,
    .nf29-overview,
    .nf29-grid {
        grid-template-columns: 1fr;
    }

    .nf29-hero {
        padding: 18px;
    }

    .nf29-hero-actions {
        display: flex;
    }

    .nf29-clock {
        text-align: center;
    }

    .nf29-year-values {
        grid-template-columns: 1fr;
    }
}

@media print {
    .nf29-action-button,
    .nf29-card-actions,
    .nf29-history-button {
        display: none !important;
    }

    .nf29-history[hidden] {
        display: block !important;
    }

    .nf29-store-card {
        break-inside: avoid;
    }
}