:root {
    --controlcond-success: #198754;
    --controlcond-warning: #fd7e14;
    --controlcond-danger: #dc3545;
    --controlcond-background: #f8f9fa;
    --controlcond-card: #ffffff;
    --bs-primary: var(--controlcond-primary);
    --bs-primary-rgb: var(--controlcond-primary-rgb);
    --bs-secondary: var(--controlcond-secondary);
    --bs-secondary-rgb: var(--controlcond-secondary-rgb);
    --bs-link-color: var(--controlcond-primary);
    --bs-link-color-rgb: var(--controlcond-primary-rgb);
    --bs-link-hover-color: color-mix(
        in srgb,
        var(--controlcond-primary) 78%,
        black
    );
}

body {
    min-height: 100vh;
    background-color: var(--controlcond-background);
}

.login-page {
    background-color: #243b5a !important;
}

.login-page .btn-primary {
    --bs-btn-bg: #243b5a;
    --bs-btn-border-color: #243b5a;
    --bs-btn-color: #ffffff;
}

.login-page .login-password-reset {
    color: #243b5a;
}

.controlcond-navbar {
    background-color: var(--controlcond-primary);
    --bs-navbar-active-color: var(--controlcond-primary-contrast);
    --bs-navbar-brand-color: var(--controlcond-primary-contrast);
    --bs-navbar-brand-hover-color: var(--controlcond-primary-contrast);
    --bs-navbar-color: var(--controlcond-primary-contrast);
    --bs-navbar-hover-color: var(--controlcond-primary-contrast);
    color: var(--controlcond-primary-contrast);
}

.btn-primary {
    --bs-btn-bg: var(--controlcond-primary);
    --bs-btn-border-color: var(--controlcond-primary);
    --bs-btn-color: var(--controlcond-primary-contrast);
    --bs-btn-hover-bg: color-mix(
        in srgb,
        var(--controlcond-primary) 85%,
        black
    );
    --bs-btn-hover-border-color: color-mix(
        in srgb,
        var(--controlcond-primary) 78%,
        black
    );
    --bs-btn-hover-color: var(--controlcond-primary-contrast);
    --bs-btn-active-bg: color-mix(
        in srgb,
        var(--controlcond-primary) 75%,
        black
    );
    --bs-btn-active-border-color: color-mix(
        in srgb,
        var(--controlcond-primary) 70%,
        black
    );
    --bs-btn-active-color: var(--controlcond-primary-contrast);
    --bs-btn-disabled-bg: var(--controlcond-primary);
    --bs-btn-disabled-border-color: var(--controlcond-primary);
    --bs-btn-disabled-color: var(--controlcond-primary-contrast);
}

.btn-outline-primary {
    --bs-btn-color: var(--controlcond-primary);
    --bs-btn-border-color: var(--controlcond-primary);
    --bs-btn-hover-bg: var(--controlcond-primary);
    --bs-btn-hover-border-color: var(--controlcond-primary);
    --bs-btn-hover-color: var(--controlcond-primary-contrast);
    --bs-btn-active-bg: var(--controlcond-primary);
    --bs-btn-active-border-color: var(--controlcond-primary);
    --bs-btn-active-color: var(--controlcond-primary-contrast);
    --bs-btn-disabled-color: var(--controlcond-primary);
}

.btn-secondary {
    --bs-btn-bg: var(--controlcond-secondary);
    --bs-btn-border-color: var(--controlcond-secondary);
    --bs-btn-color: var(--controlcond-secondary-contrast);
}

.text-primary { color: var(--controlcond-primary) !important; }
.text-secondary { color: var(--controlcond-secondary) !important; }
.bg-primary,
.text-bg-primary {
    background-color: var(--controlcond-primary) !important;
    color: var(--controlcond-primary-contrast) !important;
}
.bg-secondary,
.text-bg-secondary {
    background-color: var(--controlcond-secondary) !important;
    color: var(--controlcond-secondary-contrast) !important;
}

.alert-primary {
    --bs-alert-bg: var(--controlcond-highlight);
    --bs-alert-border-color: color-mix(
        in srgb,
        var(--controlcond-primary) 30%,
        var(--controlcond-highlight)
    );
    --bs-alert-color: color-mix(
        in srgb,
        var(--controlcond-primary) 75%,
        black
    );
    --bs-alert-link-color: var(--controlcond-primary);
}

.table-primary {
    --bs-table-bg: var(--controlcond-highlight);
    --bs-table-border-color: color-mix(
        in srgb,
        var(--controlcond-primary) 20%,
        var(--controlcond-highlight)
    );
}

.page-link {
    color: var(--controlcond-primary);
}

.active > .page-link,
.page-link.active {
    background-color: var(--controlcond-primary);
    border-color: var(--controlcond-primary);
    color: var(--controlcond-primary-contrast);
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--controlcond-primary);
    color: var(--controlcond-primary-contrast);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: color-mix(in srgb, var(--controlcond-primary) 55%, white);
    box-shadow: 0 0 0 0.25rem rgb(var(--controlcond-primary-rgb) / 25%);
}

.form-check-input:checked {
    background-color: var(--controlcond-primary);
    border-color: var(--controlcond-primary);
}

.modal-header {
    border-bottom-color: color-mix(
        in srgb,
        var(--controlcond-primary) 18%,
        var(--bs-border-color)
    );
}

a,
button,
input,
select,
textarea {
    scroll-margin-top: 1rem;
}

.navbar-brand {
    letter-spacing: 0.02em;
}

.card {
    border-radius: 1rem;
}

.card-dashboard {
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.card-dashboard:hover {
    transform: translateY(-3px);
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 12%);
}

.dashboard-value {
    line-height: 1;
}

.dashboard-executive-header {
    align-items: flex-end;
    display: flex;
    gap: 2rem;
    justify-content: space-between;
    padding-top: 1rem;
}

.dashboard-executive-header h1 {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    letter-spacing: -0.045em;
    margin: 0;
}

.dashboard-eyebrow {
    color: var(--bs-secondary-color);
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    margin-bottom: 0.45rem;
    text-transform: uppercase;
}

.dashboard-competence {
    font-size: 1.15rem;
    font-weight: 600;
}

.dashboard-health {
    align-items: center;
    border-radius: 2rem;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 600;
    gap: 0.4rem;
    padding: 0.4rem 0.7rem;
}

.dashboard-health-success { background: rgb(25 135 84 / 10%); color: #146c43; }
.dashboard-health-warning { background: rgb(255 193 7 / 15%); color: #856404; }
.dashboard-health-neutral { background: var(--bs-secondary-bg); color: var(--bs-secondary-color); }

.dashboard-filter-panel {
    background: var(--controlcond-card);
    border: 1px solid var(--bs-border-color);
    border-radius: 1rem;
    box-shadow: 0 0.5rem 1.5rem rgb(33 37 41 / 5%);
    padding: 1.5rem 1.5rem 0;
}

.dashboard-hero-card,
.dashboard-panel {
    background: var(--controlcond-card);
    border: 1px solid rgb(33 37 41 / 8%);
    box-shadow: 0 0.75rem 2rem rgb(33 37 41 / 6%);
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.dashboard-hero-card {
    border-top: 3px solid var(--dashboard-accent);
}

.dashboard-hero-card:hover,
.dashboard-panel:hover,
.dashboard-quick-action:hover {
    box-shadow: 0 1rem 2.5rem rgb(33 37 41 / 10%);
    transform: translateY(-3px);
}

.dashboard-hero-card:focus-within,
.dashboard-panel:focus-within,
.dashboard-quick-action:focus-visible,
.dashboard-details-toggle:focus-visible {
    box-shadow: 0 0 0 0.25rem rgb(var(--controlcond-primary-rgb) / 18%);
    outline: 0;
}

.dashboard-accent-primary { --dashboard-accent: var(--controlcond-primary); --dashboard-tint: rgb(var(--controlcond-primary-rgb) / 10%); }
.dashboard-accent-success { --dashboard-accent: #2da771; --dashboard-tint: rgb(45 167 113 / 10%); }
.dashboard-accent-warning { --dashboard-accent: #d99a25; --dashboard-tint: rgb(217 154 37 / 12%); }
.dashboard-accent-danger { --dashboard-accent: #b42318; --dashboard-tint: rgb(180 35 24 / 10%); }

.dashboard-hero-card .card-body { padding: 1.75rem; }

.dashboard-card-icon {
    align-items: center;
    background: var(--dashboard-tint);
    border-radius: 0.75rem;
    color: var(--dashboard-accent);
    display: inline-flex;
    font-size: 1.15rem;
    height: 2.5rem;
    justify-content: center;
    margin-bottom: 1.4rem;
    width: 2.5rem;
}

.dashboard-hero-label {
    color: var(--bs-secondary-color);
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
    margin-bottom: 0.45rem;
}

.dashboard-hero-value {
    color: var(--bs-body-color);
    font-size: clamp(1.8rem, 3vw, 2.55rem);
    font-weight: 750;
    letter-spacing: -0.05em;
    line-height: 1;
    margin-bottom: 1rem;
}

.dashboard-hero-card small { color: var(--bs-secondary-color); }
.dashboard-hero-card a,
.dashboard-hero-card .btn-link { color: var(--dashboard-accent); font-size: 0.8rem; text-decoration: none; }

.dashboard-section-heading {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.dashboard-section-heading h2,
.dashboard-section-title h2,
.dashboard-closing-card h2 {
    font-size: 1.2rem;
    font-weight: 650;
    letter-spacing: -0.02em;
    margin: 0;
}

.dashboard-section-heading > .bi { color: var(--bs-secondary-color); font-size: 1.25rem; }

.dashboard-status-bar {
    background: var(--bs-tertiary-bg);
    border-radius: 1rem;
    display: flex;
    gap: 3px;
    height: 0.75rem;
    margin-bottom: 1.75rem;
    overflow: hidden;
}

.dashboard-status-bar span { flex-grow: var(--status-weight); }
.dashboard-status-bar .is-paid { background: #2da771; }
.dashboard-status-bar .is-pending { background: #e4aa3f; }
.dashboard-status-bar .is-cancelled { background: #d65f6e; }

.dashboard-status-legend {
    display: grid;
    gap: 0.75rem 2rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-status-legend a {
    align-items: center;
    border-bottom: 1px solid var(--bs-border-color);
    color: inherit;
    display: flex;
    justify-content: space-between;
    padding: 0.75rem 0;
    text-decoration: none;
}

.dashboard-status-legend a:hover span { color: var(--controlcond-primary); }
.dashboard-status-legend span { align-items: center; display: flex; gap: 0.6rem; }
.dashboard-status-legend i { border-radius: 50%; display: inline-block; height: 0.55rem; width: 0.55rem; }
.dashboard-status-legend .is-paid { background: #2da771; }
.dashboard-status-legend .is-pending { background: #e4aa3f; }
.dashboard-status-legend .is-cancelled { background: #d65f6e; }
.dashboard-status-legend .is-overdue { background: #b42318; }
.dashboard-status-legend .is-missing { background: #adb5bd; }

.dashboard-attention-list > div {
    align-items: center;
    border-bottom: 1px solid var(--bs-border-color);
    display: grid;
    gap: 0.85rem;
    grid-template-columns: auto 1fr auto;
    padding: 0.9rem 0;
}

.dashboard-attention-list > div:last-child { border-bottom: 0; }
.dashboard-attention-icon { align-items: center; background: rgb(217 154 37 / 12%); border-radius: 0.7rem; color: #a66d00; display: flex; height: 2.3rem; justify-content: center; width: 2.3rem; }
.dashboard-attention-list strong { display: block; font-size: 1.05rem; line-height: 1; }
.dashboard-attention-list small { color: var(--bs-secondary-color); }
.dashboard-attention-list button { color: var(--controlcond-primary); font-size: 0.78rem; padding: 0.25rem 0.4rem; text-decoration: none; white-space: nowrap; }

.dashboard-detail-collapse .card {
    border-color: var(--bs-border-color);
    box-shadow: none;
}

.dashboard-section-title { margin-bottom: 1.25rem; }

.dashboard-quick-action {
    align-items: center;
    background: var(--controlcond-card);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.9rem;
    color: var(--bs-body-color);
    display: grid;
    gap: 0.75rem;
    grid-template-columns: auto 1fr auto;
    min-height: 4rem;
    padding: 0.9rem 1rem;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.dashboard-quick-action:hover { border-color: rgb(var(--controlcond-primary-rgb) / 30%); color: var(--controlcond-primary); }
.dashboard-quick-action > .bi:first-child { background: rgb(var(--controlcond-primary-rgb) / 8%); border-radius: 0.6rem; padding: 0.5rem; }
.dashboard-quick-action > .bi:last-child { color: var(--bs-secondary-color); font-size: 0.75rem; }

.dashboard-closing-card {
    align-items: center;
    background: linear-gradient(135deg, var(--controlcond-highlight), #fff);
    border: 1px solid rgb(var(--controlcond-primary-rgb) / 18%);
    border-radius: 1rem;
    box-shadow: 0 0.75rem 2rem rgb(var(--controlcond-primary-rgb) / 6%);
    display: flex;
    gap: 1.5rem;
    padding: 1.75rem 2rem;
}

.dashboard-closing-icon { align-items: center; background: rgb(var(--controlcond-primary-rgb) / 10%); border-radius: 1rem; color: var(--controlcond-primary); display: flex; font-size: 1.5rem; height: 3.5rem; justify-content: center; width: 3.5rem; }
.dashboard-closing-card p { color: var(--bs-secondary-color); margin: 0.3rem 0 0.8rem; }
.dashboard-closing-stats { display: flex; flex-wrap: wrap; gap: 1rem; font-size: 0.82rem; }

.dashboard-details-section { background: var(--controlcond-card); border: 1px solid var(--bs-border-color); border-radius: 1rem; overflow: hidden; }
.dashboard-details-toggle { align-items: center; background: transparent; border: 0; color: var(--bs-body-color); display: flex; font-weight: 600; justify-content: space-between; padding: 1.25rem 1.5rem; width: 100%; }
.dashboard-details-toggle > span:last-child { color: var(--bs-secondary-color); font-weight: 400; }
.dashboard-details-toggle:hover { background: var(--bs-tertiary-bg); }
.dashboard-details-grid { border-top: 1px solid var(--bs-border-color); display: grid; gap: 2rem; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 1.75rem; }

.dashboard-summary-grid,
.dashboard-contract-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dashboard-contract-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dashboard-pendency-grid { display: grid; gap: 0.75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dashboard-pendency-grid a,
.dashboard-pendency-grid button { align-items: center; background: var(--bs-tertiary-bg); border: 0; border-radius: 0.75rem; color: var(--bs-body-color); display: flex; justify-content: space-between; padding: 0.85rem 1rem; text-align: left; text-decoration: none; }
.dashboard-pendency-grid a:hover,
.dashboard-pendency-grid button:hover { color: var(--controlcond-primary); }
.dashboard-timeline { list-style: none; padding: 0; }
.dashboard-timeline li { align-items: center; border-bottom: 1px solid var(--bs-border-color); display: grid; gap: 1rem; grid-template-columns: auto 1fr auto; padding: 0.9rem 0; }
.dashboard-timeline li:last-child { border-bottom: 0; }
.dashboard-timeline-icon { align-items: center; background: rgb(var(--controlcond-primary-rgb) / 8%); border-radius: 50%; color: var(--controlcond-primary); display: flex; height: 2.4rem; justify-content: center; width: 2.4rem; }
.dashboard-timeline time { color: var(--bs-secondary-color); display: block; font-size: 0.78rem; margin-top: 0.2rem; }
.dashboard-timeline a { font-size: 0.8rem; text-decoration: none; }
.financial-comparison { display: grid; gap: 0.75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.financial-comparison > div { background: var(--bs-tertiary-bg); border-radius: 0.75rem; padding: 1rem; }
.financial-comparison span { color: var(--bs-secondary-color); display: block; font-size: 0.78rem; margin-bottom: 0.25rem; }
.financial-comparison strong { font-size: 1.05rem; }
.financial-progress { accent-color: var(--controlcond-primary); height: 0.75rem; width: 100%; }

.dashboard-details-toggle[aria-expanded="true"] .bi {
    transform: rotate(180deg);
}

.dashboard-details-toggle .bi {
    display: inline-block;
    transition: transform 0.2s ease;
}

@media (max-width: 575.98px) {
    .dashboard-executive-header,
    .dashboard-closing-card { align-items: stretch; flex-direction: column; }
    .dashboard-filter-trigger,
    .dashboard-closing-card .btn { width: 100%; }
    .dashboard-status-legend,
    .dashboard-details-grid,
    .dashboard-summary-grid,
    .dashboard-contract-grid,
    .dashboard-pendency-grid { grid-template-columns: 1fr; }
    .financial-comparison { grid-template-columns: 1fr; }
    .dashboard-attention-list > div { grid-template-columns: auto 1fr; }
    .dashboard-attention-list button { grid-column: 2; justify-self: start; }
    .dashboard-details-toggle > span:last-child { font-size: 0; }
    .dashboard-details-toggle > span:last-child .bi { font-size: 0.875rem; }
}

@media (min-width: 576px) and (max-width: 991.98px) {
    .dashboard-details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.badge {
    padding: 0.45rem 0.75rem;
    border-radius: 0.5rem;
}

.empty-state-icon {
    color: var(--bs-secondary-color);
    font-size: 2.5rem;
    line-height: 1;
}

.clickable-row {
    position: relative;
    cursor: pointer;
}

.clickable-row > * {
    transition:
        background-color 0.2s ease,
        box-shadow 0.2s ease;
}

.clickable-row:hover > * {
    background-color: var(--bs-tertiary-bg);
    box-shadow:
        inset 0 0.125rem 0.25rem rgb(0 0 0 / 6%),
        inset 0 -0.125rem 0.25rem rgb(0 0 0 / 6%);
}

.clickable-row:focus-within {
    outline: 0.2rem solid rgb(var(--controlcond-primary-rgb) / 25%);
    outline-offset: -0.2rem;
}

.dashboard-card-link {
    display: flex;
    flex-direction: column;
}

.dashboard-card-link:hover {
    color: inherit;
}

.dashboard-card-link:focus-visible {
    outline: 0.2rem solid rgb(var(--controlcond-primary-rgb) / 25%);
    outline-offset: 0.15rem;
}

.detail-label {
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
    margin-bottom: 0.25rem;
}

.detail-value {
    font-weight: 600;
    margin-bottom: 0;
}

.table-action {
    position: relative;
    z-index: 2;
}