body {
    background: #f6f7f9;
}

.login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    background: #eef1f5;
}

.login-card {
    width: min(420px, calc(100vw - 32px));
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 28px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

.filters {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 12px;
}

/* Bifa de filtrare sta pe acelasi rand cu campurile de text si listele de selectie. Fara o
 * inaltime egala cu a unui form-control, coloana ei este mai scunda, iar randul fiind aliniat la
 * baza, label-ul de deasupra ar cobori sub celelalte label-uri. */
.filters .filters-check {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    margin: 0;
    min-height: calc(1.5em + 0.75rem + 2px);
    padding-left: 0;
}

.filters .filters-check .form-check-input,
.filters .filters-check .form-check-label {
    flex: 0 0 auto;
    margin: 0;
}

.active-period-banner {
    align-items: center;
    background: #fff8e1;
    border: 1px solid #f4c95d;
    border-left: 5px solid #d99500;
    border-radius: 8px;
    color: #6f4b00;
    display: inline-flex;
    gap: 0.5rem;
    min-height: 42px;
    padding: 0.45rem 0.8rem;
    box-shadow: 0 4px 12px rgba(143, 94, 0, 0.12);
}

.active-period-label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.active-period-name {
    color: #111827;
    font-size: 1.05rem;
    font-weight: 700;
}

.task-table {
    font-size: 0.875rem;
    background: #fff;
}

.sticky-table-container {
    max-height: 70vh;
    overflow: auto;
    position: relative;
}

.sticky-table-container thead {
    position: sticky;
    top: 0;
    z-index: 2;
}

.sticky-table-container thead th {
    background-color: var(--bs-table-bg, #f8f9fa);
    box-shadow: inset 0 -1px 0 #dee2e6;
}

.task-table th {
    text-align: center;
    white-space: nowrap;
}

.task-table .task-row {
    cursor: pointer;
}

.navigation-row {
    cursor: pointer;
}

.task-table th .column-title {
    display: inline-block;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
}

.task-note,
.company-note {
    max-width: 240px;
}

/* Mesajul unui lucru de facut poate avea 1000 de caractere; in tabel se vede inceputul lui, iar
 * restul in tooltip. Coloana este mai lata decat cea de note, pentru ca mesajul este subiectul
 * randului, nu o adnotare pe marginea lui. */
.todo-message {
    max-width: 420px;
}

/* Titlul fisei companiei este numele ei, iar momentul ultimei salvari sta langa el, pe aceeasi
 * linie de baza si mult mai discret, ca sa se citeasca drept adnotare, nu drept al doilea titlu.
 * Cand nu incap pe un rand, momentul salvarii coboara sub nume. */
.company-form-heading {
    align-items: baseline;
    column-gap: 0.75rem;
    display: flex;
    flex-wrap: wrap;
}

.company-updated {
    color: #6c757d;
    font-size: 0.8125rem;
    white-space: nowrap;
}

.declaration-state {
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

.declaration-icon-sprite {
    height: 0;
    overflow: hidden;
    position: absolute;
    width: 0;
}

.declaration-state-icons {
    align-items: center;
    display: inline-flex;
    gap: 0.25rem;
    justify-content: center;
    min-width: 1.25rem;
}

.declaration-icon {
    fill: currentColor;
    height: 1rem;
    width: 1rem;
}

.declaration-legend {
    align-items: center;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    display: flex;
    flex-wrap: wrap;
    font-size: 0.75rem;
    gap: 0.4rem 0.8rem;
    padding: 0.35rem 0.6rem;
}

.declaration-legend-title {
    color: #495057;
    font-weight: 700;
}

.declaration-legend-item {
    align-items: center;
    display: inline-flex;
    gap: 0.3rem;
    white-space: nowrap;
}

.declaration-legend-state-not-applicable .declaration-icon {
    color: #495057;
}

.declaration-legend-state-not-filed .declaration-icon {
    color: #842029;
}

.declaration-legend-state-prepared .declaration-icon {
    color: #084298;
}

.declaration-legend-state-filed .declaration-icon {
    color: #664d03;
}

.declaration-legend-state-receipt .declaration-icon {
    color: #0f5132;
}

.declaration-state-NOT_APPLICABLE {
    --bs-table-bg: #e9ecef;
    --bs-table-hover-bg: #dee2e6;
    background-color: #e9ecef !important;
    color: #495057 !important;
}

.declaration-state-NO {
    --bs-table-bg: #f8d7da;
    --bs-table-hover-bg: #f1c2c7;
    background-color: #f8d7da !important;
    color: #842029 !important;
}

.declaration-state-PREPARED {
    --bs-table-bg: #cfe2ff;
    --bs-table-hover-bg: #b6d4fe;
    background-color: #cfe2ff !important;
    color: #084298 !important;
}

.declaration-state-YES {
    --bs-table-bg: #fff3cd;
    --bs-table-hover-bg: #ffe69c;
    background-color: #fff3cd !important;
    color: #664d03 !important;
}

.declaration-state-YES_WITH_RECEIPT {
    --bs-table-bg: #d1e7dd;
    --bs-table-hover-bg: #badbcc;
    background-color: #d1e7dd !important;
    color: #0f5132 !important;
}

/* Pictograma principala si chenarul R stau pe aceeasi linie de mijloc, centrate in celula. */
.declaration-cell {
    align-items: center;
    display: flex;
    gap: 0.3rem;
    justify-content: center;
    line-height: 1;
}

.rectification-summary {
    align-items: center;
    border: 1px solid currentColor;
    border-radius: 0.35rem;
    display: inline-flex;
    gap: 0.15rem;
    line-height: 1;
    padding: 0.1rem 0.3rem;
}

/* In chenar pictogramele sunt putin mai mici, ca sa ramana secundare fata de cea principala. */
.rectification-summary .declaration-icon {
    height: 0.85rem;
    width: 0.85rem;
}

.rectification-summary .declaration-state-icons {
    gap: 0.15rem;
    min-width: 0;
}

.rectification-summary-label {
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
}

/* Chenarul R din Istoric deschide un popup consultativ cu lunile rectificate. */
.rectification-summary[data-rectification-details] {
    cursor: pointer;
}

.rectification-details {
    display: none;
}

.rectification-popup {
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    color: #212529;
    font-size: 0.85rem;
    font-weight: 400;
    max-height: 60vh;
    max-width: 18rem;
    min-width: 11rem;
    overflow-y: auto;
    padding: 0.6rem 0.75rem;
    position: fixed;
    text-align: left;
    white-space: normal;
    z-index: 1080;
}

.rectification-popup-title {
    border-bottom: 1px solid #dee2e6;
    display: block;
    font-weight: 700;
    margin-bottom: 0.4rem;
    padding-bottom: 0.3rem;
}

.rectification-popup-row {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
    padding: 0.15rem 0;
}

.rectification-popup-month {
    font-variant-numeric: tabular-nums;
}

.rectification-popup-state {
    align-items: center;
    border-radius: 0.3rem;
    display: inline-flex;
    gap: 0.3rem;
    padding: 0.05rem 0.3rem;
}

.rectifications-section {
    border-top: 1px solid #dee2e6;
    padding-top: 1rem;
}

.rectifications-header {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
}

.rectification-add-form {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(240px, 420px) minmax(0, 1fr);
}

.rectification-declaration-column {
    min-width: 0;
}

.rectification-month-fieldset {
    min-width: 0;
}

.rectification-add-action {
    margin-top: 1rem;
}

.rectification-month-list {
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    display: grid;
    gap: 0.45rem 1rem;
    grid-template-columns: repeat(auto-fit, minmax(105px, 1fr));
    max-height: 20rem;
    overflow-y: auto;
    padding: 0.65rem;
}

.rectification-year-title {
    background: #f1f3f5;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    font-size: 0.9rem;
    font-weight: 700;
    grid-column: 1 / -1;
    margin: 0.35rem 0 0;
    padding: 0.4rem 0.65rem;
}

.rectification-month-option {
    margin: 0;
    min-height: 1.5rem;
    padding-bottom: 0.15rem;
    padding-top: 0.15rem;
    white-space: nowrap;
}

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

@media (max-width: 767.98px) {
    .rectification-add-form {
        grid-template-columns: 1fr;
    }

    .rectification-month-list {
        grid-template-columns: repeat(2, minmax(100px, 1fr));
    }
}

.task-sort-form {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
}

.task-sort-form label {
    white-space: nowrap;
}

.task-sort-form .form-select {
    min-width: 170px;
}

.status-pill {
    border-radius: 999px;
    display: inline-flex;
    font-weight: 600;
    line-height: 1;
    padding: 0.35rem 0.55rem;
}

.status-color-done {
    background-color: #d1e7dd !important;
    border-color: #a3cfbb !important;
    color: #0f5132 !important;
}

.status-color-not-started {
    background-color: #f8d7da !important;
    border-color: #f1aeb5 !important;
    color: #842029 !important;
}

.status-color-in-progress {
    background-color: #fff3cd !important;
    border-color: #ffda6a !important;
    color: #664d03 !important;
}

.status-color-disabled {
    color: #495057;
    background: #e9ecef;
}

.status-color-other {
    background-color: #f8d7ef !important;
    border-color: #efadce !important;
    color: #7d1f56 !important;
}

.readonly-field {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    min-height: 58px;
    padding: 0.55rem 0.75rem;
}

.readonly-field-label {
    color: #6c757d;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.2;
    margin-bottom: 0.2rem;
    text-transform: uppercase;
}

.readonly-field-value {
    color: #111827;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.company-form-section {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 1rem;
}

.navbar-dark .navbar-nav .nav-link.active {
    background: #f8f9fa;
    border-radius: 6px;
    color: #111827;
    font-weight: 600;
}

.settings-tabs .nav-tabs {
    gap: 4px;
}

.settings-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.75rem;
}

.settings-language-form {
    align-items: center;
    display: flex;
    gap: 0.5rem;
}

.settings-language-form .form-select {
    min-width: 150px;
}

.settings-tabs .nav-link {
    color: #495057;
    white-space: nowrap;
}

.settings-tabs .nav-link.active {
    color: #0d6efd;
    font-weight: 600;
}

.fiscal-vector-form {
    display: grid;
    gap: 1.25rem;
    max-width: 760px;
}

.fiscal-vector-checks {
    align-items: center;
    display: grid;
    gap: 0.75rem 1rem;
    grid-template-columns: repeat(3, minmax(120px, 1fr));
    max-width: 520px;
}

.fiscal-vector-check {
    align-items: center;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    display: flex;
    gap: 0.55rem;
    min-height: 44px;
    padding: 0.55rem 0.75rem;
}

.fiscal-vector-check .form-check-input {
    flex: 0 0 auto;
    margin: 0;
}

.fiscal-vector-selects {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fiscal-vector-actions {
    display: flex;
    gap: 0.5rem;
}

@media (max-width: 767.98px) {
    .fiscal-vector-checks,
    .fiscal-vector-selects {
        grid-template-columns: 1fr;
    }
}

.rectification-month-empty {
    margin: 0.5rem 0 0;
}

.help-content {
    max-width: 900px;
}

.help-content h1 {
    font-size: 1.75rem;
}

.help-content h2 {
    border-bottom: 1px solid #dee2e6;
    font-size: 1.35rem;
    margin-top: 2rem;
    padding-bottom: 0.35rem;
}

.help-content h3 {
    font-size: 1.1rem;
    margin-top: 1.5rem;
}

.help-content img {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    max-width: 100%;
}

.help-content table {
    border-collapse: collapse;
    margin: 1rem 0;
}

.help-content th,
.help-content td {
    border: 1px solid #dee2e6;
    padding: 0.4rem 0.75rem;
    text-align: left;
}

.help-content blockquote {
    border-left: 4px solid #dee2e6;
    color: #495057;
    margin: 1rem 0;
    padding: 0.25rem 1rem;
}

.help-content code {
    background: #f8f9fa;
    border-radius: 4px;
    padding: 0.1rem 0.3rem;
}

.dashboard-card {
    align-items: flex-start;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    height: 100%;
    padding: 0.9rem 1rem;
    text-decoration: none;
}

a.dashboard-card:hover {
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12);
}

.dashboard-card-total {
    background: #fff;
    border-color: #cfd8e3;
}

.dashboard-card-label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.dashboard-card-value {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
}

.dashboard-card-hint {
    font-size: 0.75rem;
    opacity: 0.85;
}

.dashboard-panel {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 1rem;
}

.dashboard-panel h2 {
    margin-bottom: 0.75rem;
}

.dashboard-table {
    font-size: 0.875rem;
}

.dashboard-table th[scope="row"] {
    font-weight: 600;
}

.dashboard-progress {
    height: 1.25rem;
}

.dashboard-progress-sm {
    height: 0.5rem;
}

.dashboard-bar-cell {
    min-width: 120px;
    vertical-align: middle;
}

/* ---------------------------------------------------------------------------------------------
 * Tiparire (Ctrl+P, sau "Salveaza ca PDF" din browser).
 *
 * Pe hartie raman doar titlul, perioada si tabelul. Dispar navigatia, filtrele, sortarea,
 * paginarea si butoanele: sunt unelte de ecran si ar ocupa un sfert din prima pagina. Nu exista
 * export PDF pe server; browserul face treaba, iar stilurile de mai jos ii dau ce sa tipareasca.
 * --------------------------------------------------------------------------------------------- */
@media print {
    @page {
        margin: 10mm;
        size: A4 landscape;
    }

    body {
        background: #fff;
    }

    .navbar,
    .filters,
    .task-sort-form,
    .pagination,
    .settings-tabs,
    .btn {
        display: none !important;
    }

    /* Legenda ramane: pe hartie iconitele sunt singura reprezentare a starii, iar fara ea
     * randul nu poate fi citit de cineva care nu foloseste aplicatia. */

    /* Culorile de status si iconitele de declaratii sunt informatie, nu decor: fara asta browserul
     * le scoate albe la tiparire si randul nu mai spune nimic. */
    .status-pill,
    .badge,
    .declaration-state,
    .active-period-banner {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* Tabelul are inaltime limitata si antet lipit pe ecran; pe hartie trebuie sa curga intreg. */
    .sticky-table-container {
        max-height: none;
        overflow: visible;
    }

    .sticky-table-container thead {
        position: static;
    }

    /* Antetul se repeta pe fiecare pagina si niciun rand nu se rupe intre pagini. */
    .task-table thead {
        display: table-header-group;
    }

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

    .task-table {
        font-size: 8pt;
    }

    /* Nota este scurtata pe ecran ca sa incapa in coloana; pe hartie se vede intreaga. */
    .task-note,
    .company-note,
    .todo-message {
        max-width: none;
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    .task-table th .column-title {
        max-width: none;
        overflow: visible;
    }

    /* Cardurile isi pierd umbra si se strang, ca sa nu iasa o pagina pe fiecare sectiune. */
    .card,
    .dashboard-panel,
    .dashboard-card {
        box-shadow: none;
        break-inside: avoid;
    }

    a[href] {
        text-decoration: none;
    }
}