* {
    box-sizing:border-box
}
body {
    margin:0;
    font-family:Segoe UI,Arial,sans-serif;
    background:linear-gradient(145deg,#e0f2f1,#d8f3ee);
    color:#1f2937;
    min-height:100vh
}
.top {
    background:#fff;
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:center;
    padding:18px max(20px,calc((100% - 1250px)/2));
    box-shadow:0 4px 16px #0001
}
.top>div {
    display:flex;
    flex-direction:column
}
.brand {
    font-size:24px;
    font-weight:800;
    color:#0f766e;
    text-decoration:none
}
.top small {
    color:#64748b
}
.user {
    align-items:flex-end
}
.user a {
    color:#b91c1c;
    text-decoration:none;
    font-weight:700;
    margin-top:4px
}
.nav {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding:10px max(20px,calc((100% - 1250px)/2));
    background:#0f766e
}
.nav a {
    color:#fff;
    text-decoration:none;
    padding:8px 12px;
    border-radius:10px
}
.nav a:hover {
    background:#115e59
}
.container {
    max-width:1250px;
    margin:25px auto;
    padding:0 18px 60px
}
.card {
    background:#fff;
    border-radius:18px;
    padding:22px;
    margin-bottom:20px;
    box-shadow:0 8px 24px #0000000d
}
.card h1,.card h2 {
    margin-top:0;
    color:#0f766e
}
.grid {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:14px
}
.field {
    display:flex;
    flex-direction:column;
    gap:6px
}
.field label {
    font-weight:700;
    font-size:13px;
    color:#334155
}
.field input,.field select,.field textarea {
    padding:11px 12px;
    border:1px solid #cbd5e1;
    border-radius:10px;
    font:inherit
}
.field textarea {
    min-height:85px;
    resize:vertical
}
.actions {
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:16px
}
.btn {
    display:inline-block;
    border:0;
    border-radius:10px;
    padding:10px 15px;
    background:#0d9488;
    color:#fff;
    text-decoration:none;
    font-weight:700;
    cursor:pointer
}
.btn.secondary {
    background:#64748b
}
.btn.danger {
    background:#dc2626
}
.btn.warning {
    background:#d97706
}
.btn.light {
    background:#e2e8f0;
    color:#1f2937
}
.table-wrap {
    overflow:auto
}
.table {
    width:100%;
    border-collapse:collapse;
    font-size:14px
}
.table th,.table td {
    padding:11px 9px;
    border-bottom:1px solid #e2e8f0;
    text-align:left;
    vertical-align:top
}
.table th {
    background:#f0fdfa;
    color:#0f766e;
    white-space:nowrap
}
.badge {
    display:inline-block;
    border-radius:99px;
    padding:3px 9px;
    font-size:12px;
    font-weight:700;
    background:#e2e8f0
}
.badge.ok {
    background:#dcfce7;
    color:#166534
}
.badge.bad {
    background:#fee2e2;
    color:#991b1b
}
.badge.warn {
    background:#fef3c7;
    color:#92400e
}
.alert {
    padding:13px 16px;
    border-radius:12px;
    margin-bottom:16px;
    font-weight:600
}
.alert.success {
    background:#dcfce7;
    color:#166534
}
.alert.error {
    background:#fee2e2;
    color:#991b1b
}
.alert.info {
    background:#dbeafe;
    color:#1e40af
}
.stats {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:14px
}
.stat {
    background:#fff;
    padding:18px;
    border-radius:16px;
    box-shadow:0 6px 18px #0001
}
.stat strong {
    display:block;
    font-size:28px;
    color:#0f766e;
    margin-top:4px
}
.module {
    background:#fff;
    padding:20px;
    border-radius:16px;
    text-decoration:none;
    color:inherit;
    border:1px solid #ccfbf1
}
.module:hover {
    transform:translateY(-2px);
    box-shadow:0 8px 20px #0001
}
.module b {
    display:block;
    color:#0f766e;
    font-size:18px;
    margin-bottom:6px
}
.login {
    max-width:450px;
    margin:70px auto
}
.muted {
    color:#64748b;
    font-size:13px
}
.searchbar {
    display:flex;
    gap:8px;
    flex-wrap:wrap
}
.searchbar input,.searchbar select {
    padding:10px;
    border:1px solid #cbd5e1;
    border-radius:10px
}
.right {
    text-align:right
}
.total {
    font-size:17px;
    font-weight:800;
    color:#0f766e
}
footer {
    text-align:center;
    color:#64748b;
    padding:20px
}
@media(max-width:700px) {
    .top {
        align-items:flex-start
    }
    .user {
        align-items:flex-start
    }
    .nav {
        overflow:auto;
        flex-wrap:nowrap
    }
    .table {
        font-size:12px
    }
    .btn {
        padding:9px 10px
    }
}
.capture-card {
    border:2px solid #99f6e4;
    background:#f0fdfa
}
.capture-card h2 {
    margin-bottom:8px
}
.badge.watch {
    background:#dbeafe;
    color:#1d4ed8;
    margin-top:5px
}
.action-stack {
    display:flex;
    gap:6px;
    flex-wrap:wrap;
    min-width:205px
}
.sat-config input {
    font-family:Consolas,monospace
}
.forms-hero {
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:center
}
.forms-hero p {
    margin-bottom:0
}
.hero-actions {
    margin-top:0
}
.portal-btn {
    background:#2563eb
}
.client-forms-grid {
    display:grid;
    grid-template-columns:1fr;
    gap:18px
}
.client-form-card {
    margin-bottom:0
}
.client-form-head {
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:flex-start;
    margin-bottom:16px
}
.client-form-head h2 {
    margin-bottom:8px
}
.client-meta {
    display:flex;
    gap:10px 18px;
    flex-wrap:wrap;
    color:#475569;
    font-size:13px
}
.client-capture {
    min-width:310px
}
.client-capture>label {
    display:block;
    font-size:12px;
    font-weight:700;
    color:#475569;
    margin-bottom:5px
}
.capture-inline {
    display:flex;
    gap:8px
}
.capture-inline input {
    padding:10px;
    border:1px solid #cbd5e1;
    border-radius:10px;
    font:inherit
}
.empty-forms {
    padding:16px;
    border:1px dashed #99f6e4;
    background:#f0fdfa;
    border-radius:12px;
    color:#475569
}
.compact-table th,.compact-table td {
    padding:9px 8px
}
.file-name {
    display:inline-block;
    max-width:250px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-top:5px
}
@media(max-width:800px) {
    .forms-hero,.client-form-head {
        flex-direction:column
    }
    .client-capture {
        min-width:0;
        width:100%
    }
    .capture-inline {
        flex-wrap:wrap
    }
    .capture-inline input {
        flex:1;
        min-width:160px
    }
}
.page-head {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px
}
.page-head h1 {
    margin-bottom:4px
}
.page-head p {
    margin:0
}
.top-right {
    display:flex!important;
    flex-direction:row!important;
    align-items:center;
    gap:18px
}
.brand-block {
    min-width:220px
}
.global-search {
    display:flex;
    align-items:center;
    background:#f8fafc;
    border:1px solid #cbd5e1;
    border-radius:12px;
    padding:4px 5px 4px 10px;
    min-width:380px
}
.global-search input {
    border:0;
    outline:0;
    background:transparent;
    padding:8px;
    width:100%;
    font:inherit
}
.global-search button {
    border:0;
    background:#0d9488;
    color:#fff;
    border-radius:8px;
    padding:8px 12px;
    font-weight:700;
    cursor:pointer
}
.modal {
    position:fixed;
    inset:0;
    display:none;
    z-index:1000
}
.modal.is-open {
    display:block
}
.modal-backdrop {
    position:absolute;
    inset:0;
    background:#0f172a99;
    backdrop-filter:blur(2px)
}
.modal-dialog {
    position:relative;
    background:#fff;
    width:min(980px,calc(100% - 32px));
    max-height:88vh;
    overflow:auto;
    margin:6vh auto;
    border-radius:18px;
    padding:22px;
    box-shadow:0 24px 70px #0004
}
.modal-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px
}
.modal-head h2 {
    margin:0;
    color:#0f766e
}
.modal-x {
    border:0;
    background:#e2e8f0;
    width:36px;
    height:36px;
    border-radius:50%;
    font-size:25px;
    line-height:1;
    cursor:pointer
}
.modal-open {
    overflow:hidden
}
.secret-wrap {
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap
}
.secret-text {
    font-family:Consolas,monospace;
    min-width:72px
}
.icon-btn {
    border:0;
    background:#e2e8f0;
    border-radius:8px;
    padding:5px 7px;
    cursor:pointer
}
.global-results {
    display:grid;
    gap:10px
}
.result-item {
    display:grid;
    grid-template-columns:110px 1fr;
    gap:3px 12px;
    text-decoration:none;
    color:#1f2937;
    border:1px solid #e2e8f0;
    border-radius:12px;
    padding:13px 14px
}
.result-item:hover {
    border-color:#5eead4;
    background:#f0fdfa
}
.result-type {
    grid-row:1/3;
    align-self:center;
    background:#ccfbf1;
    color:#0f766e;
    border-radius:99px;
    padding:5px 10px;
    text-align:center;
    font-size:12px;
    font-weight:800
}
.result-item small {
    color:#64748b
}
@media(max-width:900px) {
    .top {
        flex-direction:column;
        align-items:stretch
    }
    .top-right {
        width:100%;
        justify-content:space-between
    }
    .global-search {
        min-width:0;
        flex:1
    }
    .page-head {
        align-items:flex-start
    }
    .page-head {
        flex-direction:column
    }
}
@media(max-width:650px) {
    .top-right {
        flex-direction:column!important;
        align-items:stretch
    }
    .user {
        align-items:flex-start
    }
    .result-item {
        grid-template-columns:1fr
    }
    .result-type {
        grid-row:auto;
        width:max-content
    }
    .modal-dialog {
        margin:2vh auto;
        max-height:96vh
    }
}
/* Expediente centralizado de cliente */
.nowrap-table th,.nowrap-table td {
    white-space:nowrap;
    vertical-align:middle
}
.client-list-table {
    min-width:1180px
}
.client-name-link {
    color:#0f766e;
    font-weight:800;
    text-decoration:none
}
.client-name-link:hover {
    text-decoration:underline
}
.row-actions {
    display:flex;
    align-items:center;
    gap:5px;
    flex-wrap:nowrap
}
.btn.btn-sm {
    padding:8px 11px;
    border-radius:8px;
    font-size:13px
}
.btn.btn-xs {
    padding:5px 8px;
    border-radius:7px;
    font-size:12px;
    line-height:1.2
}
.clickable-row {
    cursor:pointer
}
.clickable-row:hover td {
    background:#f8fffe
}
.client-profile-head {
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:center
}
.client-profile-head h1 {
    margin:5px 0 8px
}
.back-link {
    color:#64748b;
    text-decoration:none;
    font-size:13px;
    font-weight:700
}
.profile-actions {
    margin:0
}
.client-summary-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-bottom:20px
}
.summary-card {
    background:#fff;
    border:1px solid #ccfbf1;
    border-radius:15px;
    padding:15px;
    text-decoration:none;
    color:#334155;
    box-shadow:0 6px 18px #0000000a
}
.summary-card span,.summary-card small {
    display:block;
    color:#64748b;
    font-size:12px
}
.summary-card strong {
    display:block;
    color:#0f766e;
    font-size:20px;
    margin-top:3px
}
.section-head {
    display:flex;
    justify-content:space-between;
    gap:15px;
    align-items:center;
    margin-bottom:14px
}
.section-head h2 {
    margin:0
}
.section-head p {
    margin:4px 0 0
}
.detail-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px
}
.detail-grid>div {
    padding:12px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:11px;
    min-width:0
}
.detail-grid label {
    display:block;
    color:#64748b;
    font-size:11px;
    font-weight:700;
    margin-bottom:4px
}
.detail-grid strong {
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:13px
}
.capture-inline-status {
    padding:10px 12px;
    margin-bottom:12px;
    border-radius:10px;
    background:#f0fdfa;
    border:1px solid #99f6e4;
    font-size:13px
}
.capture-inline input {
    min-width:145px
}
.table-wrap {
    border-radius:10px
}
.table td {
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:280px
}
@media(max-width:950px) {
    .client-summary-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .detail-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .client-profile-head,.section-head {
        align-items:flex-start;
        flex-direction:column
    }
}
@media(max-width:560px) {
    .client-summary-grid,.detail-grid {
        grid-template-columns:1fr
    }
}
.nowrap-table td {
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important
}
.nowrap-table th {
    white-space:nowrap!important
}
/* Lista de clientes compacta sin desplazamiento horizontal */
.client-table-card {
    padding:18px 16px
}
.client-list-title {
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:12px
}
.client-list-title h2 {
    margin-bottom:10px
}
.client-table-wrap {
    overflow:visible!important;
    width:100%
}
.client-list-table {
    min-width:0!important;
    width:100%;
    table-layout:auto;
    font-size:11.2px
}
.client-list-table th,.client-list-table td {
    padding:7px 5px!important;
    white-space:nowrap!important;
    vertical-align:middle!important;
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important
}
.client-list-table th {
    font-size:10.8px
}
.client-list-table td:nth-child(4),.client-list-table td:nth-child(5) {
    font-size:10.4px
}
.client-list-table .secret-text {
    min-width:54px;
    font-size:10.5px
}
.icon-btn-xs {
    padding:3px 5px;
    font-size:10px
}
.btn.btn-xxs {
    padding:4px 6px;
    border-radius:6px;
    font-size:10.5px;
    line-height:1.15;
    white-space:nowrap
}
.client-list-table .row-actions {
    gap:3px
}
.sat-row-status {
    font-size:10px;
    padding:3px 6px;
    white-space:nowrap
}
.badge.watch {
    background:#dbeafe;
    color:#1d4ed8
}
.client-toolbar {
    padding:14px 16px
}
.client-filter {
    align-items:center
}
.period-filter {
    display:flex;
    align-items:center;
    gap:6px;
    font-size:12px;
    font-weight:700;
    color:#475569
}
.period-filter input {
    padding:8px
}
.client-list-table .clickable-row td {
    cursor:pointer
}
@media(max-width:1100px) {
    .client-list-table {
        font-size:10px
    }
    .client-list-table th,.client-list-table td {
        padding:6px 3px!important
    }
    .client-list-table td:nth-child(4),.client-list-table td:nth-child(5) {
        font-size:9.4px
    }
    .btn.btn-xxs {
        font-size:9.5px;
        padding:4px 5px
    }
    .sat-row-status {
        font-size:9px
    }
    .client-table-card {
        padding-left:10px;
        padding-right:10px
    }
}
/* Clientes: aprovechar todo el ancho de la pantalla sin barra horizontal */
.container.wide-container {
    max-width:none;
    width:100%;
    margin:18px auto;
    padding-left:12px;
    padding-right:12px
}
.wide-container .client-table-card {
    width:100%;
    padding:18px 14px
}
.wide-container .client-table-wrap {
    width:100%;
    overflow:visible!important
}
.wide-container .client-list-table {
    width:100%;
    min-width:0!important;
    table-layout:auto;
    font-size:clamp(10px,.82vw,13px)
}
.wide-container .client-list-table th,.wide-container .client-list-table td {
    padding:8px clamp(3px,.45vw,8px)!important;
    white-space:nowrap!important;
    vertical-align:middle!important
}
.wide-container .client-list-table th {
    font-size:clamp(9.5px,.78vw,12px)
}
.wide-container .client-list-table td:nth-child(4), .wide-container .client-list-table td:nth-child(5) {
    font-size:clamp(9px,.76vw,12px)
}
.wide-container .client-list-table .secret-text {
    min-width:48px;
    font-size:inherit
}
.wide-container .client-list-table .row-actions {
    gap:3px;
    justify-content:flex-start
}
.wide-container .btn.btn-xxs {
    padding:4px clamp(4px,.42vw,7px);
    font-size:clamp(9px,.72vw,11px)
}
.wide-container .sat-row-status {
    font-size:clamp(9px,.7vw,11px);
    padding:3px 6px
}
@media(max-width:900px) {
    .container.wide-container {
        padding-left:6px;
        padding-right:6px
    }
    .wide-container .client-table-card {
        padding-left:6px;
        padding-right:6px
    }
    .wide-container .client-list-table {
        font-size:9px
    }
    .wide-container .client-list-table th {
        font-size:8.5px
    }
    .wide-container .client-list-table th,.wide-container .client-list-table td {
        padding:6px 2px!important
    }
    .wide-container .client-list-table td:nth-child(4),.wide-container .client-list-table td:nth-child(5) {
        font-size:8px
    }
    .wide-container .btn.btn-xxs {
        font-size:8px;
        padding:3px 4px
    }
    .wide-container .sat-row-status {
        font-size:8px;
        padding:2px 4px
    }
}
/* Navegación, notificaciones y tablero mensual */
.top {
    max-width:1180px;
    margin:0 auto;
    padding:8px 14px
}
.top-right {
    margin-left:auto
}
.logout-icon {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    border-radius:9px;
    background:#fff1f2;
    color:#be123c;
    text-decoration:none;
    font-size:21px;
    font-weight:900;
    border:1px solid #fecdd3
}
.logout-icon:hover {
    background:#ffe4e6
}
.nav {
    padding:0
}
.nav-inner {
    max-width:1180px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:0 14px
}
.nav-links,.nav-tools {
    display:flex;
    align-items:center
}
.nav-links a {
    display:block
}
.nav-tools {
    gap:8px;
    margin-left:auto
}
.nav-icon {
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border:0;
    background:transparent;
    color:white;
    text-decoration:none;
    border-radius:9px;
    font-size:19px;
    cursor:pointer
}
.nav-icon:hover {
    background:#ffffff22
}
.notification-wrap {
    position:relative
}
.notification-badge {
    position:absolute;
    right:0;
    top:1px;
    min-width:17px;
    height:17px;
    padding:0 4px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#dc2626;
    color:#fff;
    border-radius:99px;
    font-size:9px;
    font-weight:800;
    border:2px solid #0f766e
}
.notification-panel {
    display:none;
    position:absolute;
    right:0;
    top:46px;
    width:min(390px,calc(100vw - 24px));
    background:#fff;
    color:#1f2937;
    border-radius:15px;
    box-shadow:0 18px 50px #0f172a38;
    border:1px solid #dbe5e9;
    z-index:1500;
    overflow:hidden
}
.notification-panel.is-open {
    display:block
}
.notification-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:14px 15px;
    border-bottom:1px solid #e5e7eb
}
.notification-head strong {
    color:#0f766e
}
.notification-head span {
    font-size:11px;
    color:#64748b
}
.notification-list {
    max-height:430px;
    overflow:auto
}
.notification-item {
    display:grid;
    grid-template-columns:31px 1fr;
    gap:9px;
    padding:11px 13px;
    text-decoration:none;
    color:#334155;
    border-bottom:1px solid #f1f5f9
}
.notification-item:hover {
    background:#f8fafc
}
.notification-item b,.notification-item small {
    display:block
}
.notification-item b {
    font-size:12px
}
.notification-item small {
    font-size:11px;
    color:#64748b;
    margin-top:3px
}
.notification-item.bad {
    border-left:4px solid #dc2626
}
.notification-item.warn {
    border-left:4px solid #f59e0b
}
.notification-item.info {
    border-left:4px solid #0ea5e9
}
.notification-emoji {
    font-size:18px
}
.notification-empty {
    padding:22px;
    text-align:center;
    color:#64748b;
    font-size:13px
}
.month-toolbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap
}
.month-select-form {
    display:flex;
    align-items:center;
    gap:8px
}
.month-select-form label {
    font-size:12px;
    font-weight:800;
    color:#475569
}
.month-select-form input[type=month] {
    padding:8px 10px;
    border:1px solid #cbd5e1;
    border-radius:9px;
    background:#fff
}
.dashboard-grid {
    display:grid;
    grid-template-columns:1.05fr 1.6fr;
    gap:16px;
    margin:16px 0
}
.chart-card {
    background:#fff;
    border-radius:17px;
    padding:18px;
    box-shadow:0 6px 20px #0f172a0b;
    border:1px solid #e6f3f1
}
.chart-card h2 {
    margin:0 0 4px
}
.chart-card .muted {
    margin:0
}
.progress-layout {
    display:flex;
    align-items:center;
    gap:22px;
    margin-top:18px
}
.progress-ring {
    width:150px;
    height:150px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:conic-gradient(#0d9488 var(--pct),#e2e8f0 0)
}
.progress-ring::after {
    content:"";
    width:108px;
    height:108px;
    border-radius:50%;
    background:white;
    position:absolute
}
.progress-ring {
    position:relative
}
.progress-ring strong,.progress-ring span {
    position:relative;
    z-index:2
}
.progress-ring strong {
    font-size:28px;
    color:#0f766e
}
.progress-ring span {
    font-size:11px;
    color:#64748b
}
.progress-ring>div {
    text-align:center;
    position:relative;
    z-index:2
}
.progress-ring>div strong,.progress-ring>div span {
    display:block
}
.progress-notes {
    display:grid;
    gap:9px;
    flex:1
}
.progress-note {
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:9px 11px;
    border-radius:10px;
    background:#f8fafc;
    font-size:12px
}
.progress-note b {
    font-size:14px
}
.mini-bars {
    height:190px;
    display:flex;
    align-items:flex-end;
    gap:12px;
    margin-top:18px;
    border-bottom:1px solid #cbd5e1;
    padding:0 6px 8px
}
.mini-bar-col {
    flex:1;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    align-items:center;
    gap:6px;
    min-width:36px
}
.mini-bar-value {
    font-size:10px;
    font-weight:800;
    color:#0f766e
}
.mini-bar {
    width:min(34px,80%);
    height:var(--h);
    min-height:3px;
    background:#14b8a6;
    border-radius:7px 7px 2px 2px
}
.mini-bar-label {
    font-size:9px;
    color:#64748b;
    white-space:nowrap
}
.dashboard-alerts {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:14px
}
.alert-summary {
    display:flex;
    align-items:center;
    gap:12px;
    padding:13px;
    border:1px solid #e2e8f0;
    border-radius:12px;
    text-decoration:none;
    color:#334155;
    background:#fff
}
.alert-summary .emoji {
    font-size:24px
}
.alert-summary b,.alert-summary small {
    display:block
}
.alert-summary b {
    color:#0f766e
}
.alert-summary small {
    color:#64748b;
    font-size:11px;
    margin-top:2px
}
.report-month {
    margin-bottom:14px
}
.audit-lock {
    max-width:520px;
    margin:40px auto
}
.audit-table td {
    font-size:12px
}
.audit-detail {
    max-width:430px;
    white-space:normal
}
.month-history-note {
    font-size:11px;
    color:#64748b
}
.client-month-box {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap
}
.client-month-box input {
    padding:7px 9px;
    border:1px solid #cbd5e1;
    border-radius:8px
}
@media(max-width:900px) {
    .nav-inner {
        padding:0 8px
    }
    .dashboard-grid {
        grid-template-columns:1fr
    }
    .dashboard-alerts {
        grid-template-columns:1fr
    }
    .progress-layout {
        justify-content:center;
        flex-wrap:wrap
    }
    .top {
        max-width:none
    }
    .global-search {
        min-width:0
    }
    .nav-links a {
        padding-left:10px;
        padding-right:10px
    }
    .notification-panel {
        position:fixed;
        right:12px;
        top:112px
    }
}
/* Herramientas al extremo derecho de la pantalla */
.top {
    max-width:none;
    width:100%;
    margin:0;
    padding:10px 22px
}
.nav-inner {
    max-width:none;
    width:100%;
    margin:0;
    padding:0 22px
}
@media(max-width:700px) {
    .top {
        padding:10px 12px
    }
    .nav-inner {
        padding:0 8px
    }
}
/* Login renovado */
body.login-page {
    background:#f4faf9;
    min-height:100vh
}
.login-page .top {
    display:none
}
.login-page .container {
    max-width:none;
    margin:0;
    padding:0;
    min-height:calc(100vh - 58px)
}
.login-page footer {
    background:#fff;
    color:#94a3b8;
    padding:18px
}
.login-shell {
    min-height:calc(100vh - 58px);
    display:grid;
    grid-template-columns:minmax(360px,1.05fr) minmax(420px,.95fr)
}
.login-visual {
    position:relative;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:clamp(48px,8vw,110px);
    background:linear-gradient(145deg,#0f766e,#0d9488);
    color:#fff
}
.login-visual:before,.login-visual:after {
    content:"";
    position:absolute;
    border-radius:50%;
    background:#ffffff10
}
.login-visual:before {
    width:420px;
    height:420px;
    right:-130px;
    top:-110px
}
.login-visual:after {
    width:300px;
    height:300px;
    left:-120px;
    bottom:-100px
}
.login-brandmark {
    position:relative;
    z-index:1;
    width:66px;
    height:66px;
    border-radius:20px;
    display:grid;
    place-items:center;
    background:#fff;
    color:#0f766e;
    font-size:24px;
    font-weight:900;
    box-shadow:0 12px 30px #064e3b33;
    margin-bottom:28px
}
.login-brandmark.small {
    width:48px;
    height:48px;
    border-radius:14px;
    margin:0;
    font-size:18px;
    background:#ecfdf5;
    box-shadow:none
}
.login-kicker {
    position:relative;
    z-index:1;
    text-transform:uppercase;
    letter-spacing:.16em;
    font-size:12px;
    font-weight:800;
    opacity:.86
}
.login-visual h1 {
    position:relative;
    z-index:1;
    max-width:630px;
    font-size:clamp(38px,4.4vw,66px);
    line-height:1.03;
    margin:14px 0 20px;
    color:#fff;
    letter-spacing:-.04em
}
.login-visual p {
    position:relative;
    z-index:1;
    max-width:560px;
    font-size:17px;
    line-height:1.65;
    color:#d9fffa;
    margin:0
}
.login-points {
    position:relative;
    z-index:1;
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:34px
}
.login-points span {
    padding:9px 12px;
    border:1px solid #ffffff2e;
    background:#ffffff12;
    border-radius:999px;
    font-size:12px;
    font-weight:700
}
.login-panel {
    display:grid;
    place-items:center;
    padding:40px;
    background:linear-gradient(180deg,#fff,#f4faf9)
}
.login-card {
    width:min(440px,100%);
    background:#fff;
    border:1px solid #dfecea;
    border-radius:26px;
    padding:38px;
    box-shadow:0 24px 65px #0f766e16
}
.login-card h2 {
    font-size:32px;
    line-height:1.1;
    color:#0f172a;
    margin:8px 0 8px;
    letter-spacing:-.02em
}
.login-subtitle {
    color:#64748b;
    margin:0 0 26px
}
.login-mobile-brand {
    display:none;
    align-items:center;
    gap:12px;
    margin-bottom:28px
}
.login-mobile-brand b,.login-mobile-brand small {
    display:block
}
.login-mobile-brand b {
    color:#0f766e
}
.login-mobile-brand small {
    font-size:11px;
    color:#64748b;
    margin-top:2px
}
.login-form {
    display:grid;
    gap:18px
}
.login-form .field {
    gap:8px
}
.login-form .field label {
    font-size:13px;
    color:#334155
}
.login-input {
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid #cbd5e1;
    border-radius:13px;
    padding:0 13px;
    background:#fff;
    transition:.2s
}
.login-input:focus-within {
    border-color:#14b8a6;
    box-shadow:0 0 0 4px #14b8a619
}
.login-input>span {
    font-size:15px;
    opacity:.7
}
.login-input input {
    width:100%;
    border:0!important;
    outline:0;
    padding:13px 0!important;
    box-shadow:none!important;
    background:transparent
}
.login-submit {
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:13px 18px;
    border-radius:13px;
    margin-top:4px;
    font-size:15px;
    background:linear-gradient(135deg,#0f766e,#0d9488);
    box-shadow:0 10px 24px #0d94882b
}
.login-submit:hover {
    filter:brightness(.96)
}
.login-help {
    text-align:center;
    color:#94a3b8;
    font-size:11px;
    margin:20px 0 0
}
.password-visible {
    font-family:Consolas,monospace;
    font-weight:700;
    color:#334155
}
@media(max-width:900px) {
    .login-shell {
        grid-template-columns:1fr
    }
    .login-visual {
        display:none
    }
    .login-panel {
        min-height:calc(100vh - 58px);
        padding:24px
    }
    .login-card {
        padding:30px
    }
    .login-mobile-brand {
        display:flex
    }
}
/* Login animado con logo GF */
body.login-page {
    background:radial-gradient(circle at top,#f8fcff 0,#eef7f5 42%,#e8f2f0 100%);
    min-height:100vh;
    overflow-x:hidden
}
.login-page .top {
    display:none
}
.login-page .container {
    max-width:none;
    margin:0;
    padding:0;
    min-height:calc(100vh - 58px)
}
.login-page footer {
    background:transparent;
    color:#64748b;
    padding:18px
}
.login-shell-animated {
    position:relative;
    min-height:calc(100vh - 58px);
    display:grid;
    grid-template-columns:minmax(360px,1.04fr) minmax(430px,.96fr);
    overflow:hidden;
    isolation:isolate
}
.login-shell-animated .login-intro {
    position:absolute;
    inset:0;
    z-index:8;
    display:grid;
    place-items:center;
    padding:30px;
    background:linear-gradient(135deg,rgba(237,242,247,.82),rgba(238,247,245,.94));
    backdrop-filter:blur(16px);
    transition:opacity .72s ease,transform .72s ease,visibility .72s ease
}
.login-shell-animated.show-login .login-intro {
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:scale(1.03)
}
.intro-orb {
    position:absolute;
    border-radius:50%;
    filter:blur(6px);
    opacity:.75;
    animation:floatOrb 9s ease-in-out infinite
}
.orb-one {
    width:330px;
    height:330px;
    background:radial-gradient(circle,#d8b87a 0,#d8b87a22 65%,transparent 70%);
    top:-55px;
    left:-30px
}
.orb-two {
    width:300px;
    height:300px;
    background:radial-gradient(circle,#0f274d 0,#0f274d18 65%,transparent 70%);
    right:-55px;
    bottom:-35px;
    animation-delay:-2.5s
}
.login-intro-card {
    position:relative;
    z-index:2;
    width:min(560px,100%);
    padding:38px 34px;
    border-radius:34px;
    border:1px solid #ffffffcc;
    background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(255,255,255,.78));
    box-shadow:0 30px 90px rgba(15,39,77,.16);
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    cursor:pointer;
    transition:transform .25s ease, box-shadow .25s ease
}
.login-intro-card:hover {
    transform:translateY(-3px) scale(1.01);
    box-shadow:0 34px 100px rgba(15,39,77,.21)
}
.login-intro-card:focus-visible {
    outline:3px solid #0f274d33;
    outline-offset:4px
}
.login-logo-wrap {
    position:relative;
    display:grid;
    place-items:center;
    margin-bottom:22px
}
.login-logo-glow {
    position:absolute;
    width:190px;
    height:190px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(216,184,122,.30),rgba(15,39,77,.10) 55%,transparent 72%);
    animation:pulseGlow 2.8s ease-in-out infinite
}
.login-logo-main {
    position:relative;
    width:min(250px,55vw);
    max-width:250px;
    display:block;
    filter:drop-shadow(0 18px 34px rgba(15,39,77,.14));
    transform-origin:center;
    animation:logoBreath 3.2s ease-in-out infinite
}
.login-intro-chip,.login-visual-badge {
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    border-radius:999px;
    background:#0f274d;
    color:#fff;
    font-size:11px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase
}
.login-intro-card h1 {
    margin:0 0 10px;
    color:#0f274d;
    font-size:clamp(34px,4.2vw,48px);
    line-height:1.02;
    letter-spacing:-.04em
}
.login-intro-card p {
    max-width:470px;
    font-size:16px;
    line-height:1.65;
    color:#475569;
    margin:0 0 18px
}
.login-intro-action {
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:12px 18px;
    border-radius:999px;
    background:linear-gradient(135deg,#0f274d,#183967);
    color:#fff;
    font-weight:700;
    box-shadow:0 14px 34px rgba(15,39,77,.24);
    margin-bottom:14px
}
.intro-action-icon {
    font-size:17px;
    color:#d8b87a
}
.login-intro-card small {
    font-size:12px;
    color:#64748b
}
.login-shell-animated .login-visual {
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:clamp(42px,6.5vw,92px);
    background:linear-gradient(145deg,#0f274d,#183967 52%,#0f274d);
    color:#fff;
    overflow:hidden
}
.login-shell-animated .login-visual:before,.login-shell-animated .login-visual:after {
    content:"";
    position:absolute;
    border-radius:50%;
    background:#ffffff10
}
.login-shell-animated .login-visual:before {
    width:420px;
    height:420px;
    right:-140px;
    top:-120px
}
.login-shell-animated .login-visual:after {
    width:260px;
    height:260px;
    left:-110px;
    bottom:-100px
}
.login-visual-logo {
    position:relative;
    z-index:1;
    width:min(250px,70%);
    max-width:250px;
    border-radius:26px;
    background:#fff;
    padding:14px 18px;
    box-shadow:0 28px 60px rgba(2,6,23,.22);
    margin:18px 0 24px
}
.login-shell-animated .login-kicker {
    position:relative;
    z-index:1;
    text-transform:uppercase;
    letter-spacing:.18em;
    font-size:12px;
    font-weight:800;
    opacity:.86
}
.login-shell-animated .login-visual h2 {
    position:relative;
    z-index:1;
    max-width:600px;
    font-size:clamp(34px,4vw,58px);
    line-height:1.04;
    margin:14px 0 18px;
    color:#fff;
    letter-spacing:-.04em
}
.login-shell-animated .login-visual p {
    position:relative;
    z-index:1;
    max-width:560px;
    font-size:17px;
    line-height:1.7;
    color:#ddeaf6;
    margin:0
}
.login-shell-animated .login-points {
    position:relative;
    z-index:1;
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:30px
}
.login-shell-animated .login-points span {
    padding:9px 12px;
    border:1px solid #ffffff2e;
    background:#ffffff12;
    border-radius:999px;
    font-size:12px;
    font-weight:700
}
.login-shell-animated .login-panel {
    display:grid;
    place-items:center;
    padding:34px;
    background:linear-gradient(180deg,#fcfefe,#edf5f3)
}
.login-shell-animated .login-card {
    width:min(450px,100%);
    background:rgba(255,255,255,.96);
    border:1px solid #d9e5ea;
    border-radius:30px;
    padding:38px;
    box-shadow:0 28px 68px rgba(15,39,77,.14);
    backdrop-filter:blur(4px);
    transform:translateY(18px);
    opacity:.92;
    transition:transform .42s ease,opacity .42s ease,box-shadow .42s ease
}
.login-shell-animated.show-login .login-card {
    transform:translateY(0);
    opacity:1;
    box-shadow:0 34px 76px rgba(15,39,77,.19)
}
.login-shell-animated .login-card h2 {
    font-size:32px;
    line-height:1.1;
    color:#0f172a;
    margin:8px 0 8px;
    letter-spacing:-.02em
}
.login-shell-animated .login-subtitle {
    color:#64748b;
    margin:0 0 26px
}
.login-shell-animated .login-mobile-brand {
    display:none;
    align-items:center;
    gap:12px;
    margin-bottom:28px
}
.login-shell-animated .login-mobile-brand b,.login-shell-animated .login-mobile-brand small {
    display:block
}
.login-shell-animated .login-mobile-brand b {
    color:#0f274d
}
.login-shell-animated .login-mobile-brand small {
    font-size:11px;
    color:#64748b;
    margin-top:2px
}
.login-mobile-logo {
    width:60px;
    border-radius:14px;
    background:#fff;
    padding:6px;
    border:1px solid #e2e8f0;
    box-shadow:0 10px 24px rgba(15,39,77,.08)
}
.login-shell-animated .login-form {
    display:grid;
    gap:18px
}
.login-shell-animated .login-form .field {
    gap:8px
}
.login-shell-animated .login-form .field label {
    font-size:13px;
    color:#334155
}
.login-shell-animated .login-input {
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid #cbd5e1;
    border-radius:14px;
    padding:0 14px;
    background:#fff;
    transition:.2s
}
.login-shell-animated .login-input:focus-within {
    border-color:#0f274d;
    box-shadow:0 0 0 4px rgba(15,39,77,.11)
}
.login-shell-animated .login-input>span {
    font-size:15px;
    opacity:.7
}
.login-shell-animated .login-input input {
    width:100%;
    border:0!important;
    outline:0;
    padding:14px 0!important;
    box-shadow:none!important;
    background:transparent
}
.login-shell-animated .login-submit {
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:14px 18px;
    border-radius:14px;
    margin-top:4px;
    font-size:15px;
    background:linear-gradient(135deg,#0f274d,#183967);
    box-shadow:0 14px 28px rgba(15,39,77,.22)
}
.login-shell-animated .login-submit:hover {
    filter:brightness(.97)
}
.login-back-btn {
    margin-top:14px;
    width:100%;
    border:1px solid #d9e5ea;
    background:#f8fafc;
    color:#334155;
    border-radius:13px;
    padding:12px 14px;
    font-weight:700;
    cursor:pointer;
    transition:.2s
}
.login-back-btn:hover {
    background:#eff6ff;
    border-color:#cbd5e1
}
.login-shell-animated .login-help {
    text-align:center;
    color:#94a3b8;
    font-size:11px;
    margin:18px 0 0
}
@keyframes pulseGlow {
    0%,100% {
        transform:scale(.96);
        opacity:.8
    }
    50% {
        transform:scale(1.08);
        opacity:1
    }
}
@keyframes logoBreath {
    0%,100% {
        transform:translateY(0) scale(1)
    }
    50% {
        transform:translateY(-6px) scale(1.02)
    }
}
@keyframes floatOrb {
    0%,100% {
        transform:translate3d(0,0,0)
    }
    50% {
        transform:translate3d(12px,18px,0)
    }
}
@media(max-width:980px) {
    .login-shell-animated {
        grid-template-columns:1fr
    }
    .login-shell-animated .login-visual {
        display:none
    }
    .login-shell-animated .login-panel {
        min-height:calc(100vh - 58px);
        padding:24px
    }
    .login-shell-animated .login-card {
        padding:30px
    }
    .login-shell-animated .login-mobile-brand {
        display:flex
    }
    .login-back-btn {
        display:block
    }
    .login-intro-card {
        padding:34px 26px
    }
    .login-intro-card h1 {
        font-size:38px
    }
}
@media(min-width:981px) {
    .login-back-btn {
        display:none
    }
}
@media(max-width:560px) {
    .login-shell-animated .login-panel {
        padding:16px
    }
    .login-shell-animated .login-card {
        padding:24px;
        border-radius:24px
    }
    .login-intro-card {
        padding:28px 20px;
        border-radius:26px
    }
    .login-logo-main {
        max-width:210px
    }
    .login-intro-card h1 {
        font-size:30px
    }
    .login-intro-card p {
        font-size:14px
    }
    .login-intro-action {
        font-size:14px;
        padding:11px 15px
    }
}
/* Login simplificado */
body.login-simple-page {
    background:linear-gradient(180deg,#f4f7f8 0,#eef3f4 100%)
}
.login-simple-page .top {
    display:none
}
.login-simple-page .container {
    max-width:none;
    margin:0;
    padding:0;
    min-height:calc(100vh - 58px)
}
.login-simple-page footer {
    background:transparent;
    color:#64748b;
    padding:18px;
    text-align:center
}
.login-simple-shell {
    min-height:calc(100vh - 58px);
    display:grid;
    place-items:center;
    padding:32px 16px
}
.login-simple-card {
    width:min(460px,100%);
    background:#fff;
    border:1px solid #dbe4ea;
    border-radius:28px;
    padding:34px;
    box-shadow:0 24px 60px rgba(15,39,77,.10);
    text-align:center
}
.login-simple-logo {
    display:block;
    width:min(230px,72%);
    margin:0 auto 18px auto;
    background:transparent;
    border-radius:0;
    box-shadow:none
}
.login-simple-card h1 {
    font-size:32px;
    line-height:1.08;
    color:#0f172a;
    margin:8px 0 8px;
    letter-spacing:-.02em
}
.login-simple-card .login-kicker {
    display:block;
    text-transform:uppercase;
    letter-spacing:.16em;
    font-size:12px;
    font-weight:800;
    color:#475569;
    margin-bottom:6px
}
.login-simple-card .login-subtitle {
    color:#64748b;
    margin:0 0 24px
}
.login-simple-card .login-form {
    text-align:left;
    display:grid;
    gap:18px
}
.login-simple-card .login-form .field {
    gap:8px
}
.login-simple-card .login-form .field label {
    font-size:13px;
    color:#334155;
    font-weight:700
}
.login-simple-card .login-input {
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid #cbd5e1;
    border-radius:14px;
    padding:0 14px;
    background:#fff;
    transition:.2s
}
.login-simple-card .login-input:focus-within {
    border-color:#0f274d;
    box-shadow:0 0 0 4px rgba(15,39,77,.10)
}
.login-simple-card .login-input>span {
    font-size:15px;
    opacity:.7
}
.login-simple-card .login-input input {
    width:100%;
    border:0!important;
    outline:0;
    padding:14px 0!important;
    box-shadow:none!important;
    background:transparent
}
.login-simple-card .login-submit {
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:14px 18px;
    border-radius:14px;
    margin-top:4px;
    font-size:15px;
    background:linear-gradient(135deg,#0f274d,#183967);
    box-shadow:0 14px 28px rgba(15,39,77,.18)
}
.login-simple-card .login-submit:hover {
    filter:brightness(.97)
}
.login-simple-card .login-help {
    text-align:center;
    color:#94a3b8;
    font-size:11px;
    margin:18px 0 0
}
@media(max-width:560px) {
    .login-simple-shell {
        padding:18px 12px
    }
    .login-simple-card {
        padding:24px;
        border-radius:22px
    }
    .login-simple-logo {
        width:min(200px,76%)
    }
    .login-simple-card h1 {
        font-size:28px
    }
}
/* Login dividido: panel azul + formulario con logo */
body.login-split-page {
    background:#eef4f5;
    min-height:100vh
}
.login-split-page .top {
    display:none
}
.login-split-page .container {
    max-width:none;
    margin:0;
    padding:0;
    min-height:calc(100vh - 58px)
}
.login-split-page footer {
    background:transparent;
    color:#64748b;
    padding:18px;
    text-align:center
}
.login-split-shell {
    min-height:calc(100vh - 58px);
    display:grid;
    grid-template-columns:minmax(460px,1.03fr) minmax(430px,.97fr)
}
.login-blue-side {
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    background:linear-gradient(145deg,#102f59,#173e70 58%,#102f59);
    color:#fff;
    padding:clamp(46px,6vw,90px)
}
.login-blue-content {
    position:relative;
    z-index:2;
    max-width:610px
}
.blue-system-label {
    display:block;
    width:100%;
    padding:7px 12px;
    border-radius:999px;
    background:#0d2a52;
    color:#fff;
    font-size:11px;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
    margin-bottom:46px
}
.blue-kicker {
    display:block;
    text-transform:uppercase;
    letter-spacing:.14em;
    font-size:12px;
    font-weight:900;
    color:#fff;
    margin-bottom:14px
}
.login-blue-content h1 {
    margin:0 0 20px;
    color:#fff;
    font-size:clamp(42px,4.8vw,68px);
    line-height:1.02;
    letter-spacing:-.045em;
    max-width:590px
}
.login-blue-content p {
    margin:0;
    max-width:570px;
    color:#e7eff8;
    font-size:16px;
    line-height:1.75
}
.blue-feature-list {
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:30px
}
.blue-feature-list span {
    padding:9px 12px;
    border:1px solid rgba(255,255,255,.24);
    border-radius:999px;
    background:rgba(255,255,255,.06);
    font-size:12px;
    font-weight:700;
    color:#fff
}
.blue-decoration {
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.08)
}
.blue-decoration-top {
    width:330px;
    height:330px;
    right:-105px;
    top:-120px
}
.blue-decoration-bottom {
    width:220px;
    height:220px;
    left:-110px;
    bottom:-90px
}
.login-form-side {
    display:grid;
    place-items:center;
    padding:34px 24px;
    background:linear-gradient(180deg,#f9fbfb,#edf4f4)
}
.login-split-page .login-simple-card {
    width:min(460px,100%);
    background:#fff;
    border:1px solid #dbe4ea;
    border-radius:28px;
    padding:34px;
    box-shadow:0 24px 60px rgba(15,39,77,.10);
    text-align:center
}
.login-split-page .login-simple-logo {
    display:block;
    width:min(230px,72%);
    margin:0 auto 18px;
    background:transparent;
    border-radius:0;
    box-shadow:none
}
.login-split-page .login-simple-card h1 {
    font-size:32px;
    line-height:1.08;
    color:#0f172a;
    margin:8px 0 8px;
    letter-spacing:-.02em
}
.login-split-page .login-simple-card .login-kicker {
    display:block;
    text-transform:uppercase;
    letter-spacing:.16em;
    font-size:12px;
    font-weight:800;
    color:#475569;
    margin-bottom:6px
}
.login-split-page .login-simple-card .login-subtitle {
    color:#64748b;
    margin:0 0 24px
}
.login-split-page .login-simple-card .login-form {
    text-align:left;
    display:grid;
    gap:18px
}
.login-split-page .login-simple-card .login-form .field {
    gap:8px
}
.login-split-page .login-simple-card .login-form .field label {
    font-size:13px;
    color:#334155;
    font-weight:700
}
.login-split-page .login-simple-card .login-input {
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid #cbd5e1;
    border-radius:14px;
    padding:0 14px;
    background:#fff;
    transition:.2s
}
.login-split-page .login-simple-card .login-input:focus-within {
    border-color:#0f274d;
    box-shadow:0 0 0 4px rgba(15,39,77,.10)
}
.login-split-page .login-simple-card .login-input>span {
    font-size:15px;
    opacity:.7
}
.login-split-page .login-simple-card .login-input input {
    width:100%;
    min-width:0;
    border:0!important;
    outline:0;
    padding:14px 0!important;
    box-shadow:none!important;
    background:transparent
}
.password-field {
    padding-right:8px!important
}
.password-toggle {
    flex:0 0 auto;
    width:36px;
    height:36px;
    border:0;
    border-radius:10px;
    background:#eef2f7;
    display:grid;
    place-items:center;
    cursor:pointer;
    font-size:16px;
    transition:.18s
}
.password-toggle:hover {
    background:#e1e8f0;
    transform:translateY(-1px)
}
.password-toggle:focus-visible {
    outline:2px solid #0f274d55;
    outline-offset:2px
}
.login-split-page .login-simple-card .login-submit {
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:14px 18px;
    border-radius:14px;
    margin-top:4px;
    font-size:15px;
    background:linear-gradient(135deg,#0f274d,#183967);
    box-shadow:0 14px 28px rgba(15,39,77,.18)
}
.login-split-page .login-simple-card .login-submit:hover {
    filter:brightness(.97)
}
.login-split-page .login-simple-card .login-help {
    text-align:center;
    color:#94a3b8;
    font-size:11px;
    margin:18px 0 0
}
@media(max-width:980px) {
    .login-split-shell {
        grid-template-columns:1fr
    }
    .login-blue-side {
        display:none
    }
    .login-form-side {
        min-height:calc(100vh - 58px)
    }
}
@media(max-width:560px) {
    .login-form-side {
        padding:18px 12px
    }
    .login-split-page .login-simple-card {
        padding:24px;
        border-radius:22px
    }
    .login-split-page .login-simple-logo {
        width:min(200px,76%)
    }
    .login-split-page .login-simple-card h1 {
        font-size:28px
    }
}
/* Ajustes 2026-09-28: notificaciones legibles, navegación y clientes */
.nav-tools {
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:4px;
    margin-left:auto;
    padding:4px 0
}
.nav-tool-icons {
    display:flex;
    align-items:center;
    gap:8px
}
.nav-back {
    border:1px solid #bfdbfe;
    background:#eff6ff;
    color:#1d4ed8;
    border-radius:9px;
    padding:5px 11px;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 2px 8px #0f172a12;
    white-space:nowrap
}
.nav-back:hover {
    background:#dbeafe;
    color:#1e40af
}
.notification-panel {
    background:#eaf5ff!important;
    border-color:#bfdbfe!important
}
.notification-head {
    background:#dbeafe;
    border-bottom-color:#bfdbfe
}
.notification-head strong {
    color:#0f3f75
}
.notification-head span {
    color:#475569
}
.notification-list {
    background:#eef7ff
}
.notification-item,.notification-item:visited {
    background:#f4f9ff!important;
    color:#17324d!important;
    border-bottom:1px solid #cfe3f5!important
}
.notification-item b {
    color:#17324d!important;
    font-weight:800
}
.notification-item small {
    color:#475569!important;
    opacity:1!important
}
.notification-item:hover {
    background:#dbeeff!important;
    color:#17324d!important
}
.notification-item:hover b,.notification-item:hover small {
    color:#17324d!important
}
.notification-empty {
    background:#f4f9ff;
    color:#475569
}
.client-list-table {
    min-width:0!important;
    table-layout:auto
}
.client-list-table th,.client-list-table td {
    white-space:nowrap
}
.client-list-table th:last-child,.client-list-table td:last-child {
    text-align:center;
    width:90px
}
@media(max-width:900px) {
    .nav-tools {
        align-items:flex-end
    }
    .nav-back {
        font-size:11px;
        padding:5px 9px
    }
}
/* Filas alternadas y alertas visuales de vencimiento */
.table tr:nth-child(odd) td {
    background:#ffffff!important
}
.table tr:nth-child(even) td {
    background:#dceff6!important
}
.table tr:hover td {
    background:#c9e5f1!important
}
.table th {
    background:#e8f8f7!important
}
.due-bubble {
    display:inline-flex;
    align-items:center;
    margin-left:8px;
    padding:3px 8px;
    border-radius:999px;
    background:#fff3cd;
    color:#8a5a00;
    border:1px solid #f5d77a;
    font-size:10.5px;
    font-weight:800;
    white-space:nowrap;
    vertical-align:middle
}
.due-bubble.urgent {
    background:#ffe4cc;
    color:#9a3f00;
    border-color:#fdba74
}
.due-bubble.expired {
    background:#fee2e2;
    color:#991b1b;
    border-color:#fecaca
}
.due-days {
    display:block;
    margin-top:3px;
    color:#b45309;
    font-weight:700;
    font-size:10px
}
@media(max-width:700px) {
    .due-bubble {
        font-size:9.5px;
        padding:2px 6px
    }
    .due-days {
        font-size:9px
    }
}

/* Acciones agrupadas en encabezados de sección */
.section-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

/* Integración directa GFCONTA + Excel */
.excel-open-card {
    max-width: 900px;
    margin: 24px auto;
}

.excel-open-card .info-box,
.excel-setup-note {
    margin: 16px 0;
    padding: 14px 16px;
    border-radius: 12px;
    background: #eef8ff;
    border: 1px solid #cbe7f7;
}

.excel-setup-note h3 {
    margin-top: 0;
}

.modal-sm {
    max-width: 520px;
}

/* Mensajes de validación dentro de modales */
.modal-inline-error {
    margin: 0 0 16px;
}

.nav-back {
    text-decoration: none;
}

/* Ajuste visual: botón Volver claramente visible */
.nav-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    padding: 7px 14px;
    border: 2px solid #ffffff;
    border-radius: 10px;
    background: #ffffff;
    color: #0f766e;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.18);
}

.nav-back:hover,
.nav-back:focus-visible {
    background: #dff7f5;
    color: #0b5f59;
    border-color: #ccfbf1;
    outline: none;
}

/* Botones Volver que aparecen dentro de tarjetas/paneles */
.back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    border: 1px solid #99f6e4;
    border-radius: 9px;
    background: #f0fdfa;
    color: #0f766e;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
}

.back-link:hover,
.back-link:focus-visible {
    background: #ccfbf1;
    color: #115e59;
    outline: none;
}

/* Nombre visible del archivo seleccionado/subido */
.file-name-display,
.saved-file-name {
    display: block;
    margin-top: 6px;
    color: #334155;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.file-name-display.has-file {
    padding: 6px 9px;
    border: 1px solid #bae6fd;
    border-radius: 8px;
    background: #f0f9ff;
    color: #075985;
}

.saved-file-name {
    max-width: 240px;
    color: #64748b;
}

/* Libros por folios */
.book-folio-stats { margin-bottom: 16px; }
.book-folio-stats .stat strong { font-size: 1.55rem; }


/* El libro completo abre su panel de folios; los botones de acciones conservan su función. */
.book-row-clickable {
    cursor: pointer;
}

.book-row-clickable:hover td {
    background-color: rgba(73, 173, 192, 0.12);
}

.book-row-clickable .row-actions {
    cursor: default;
}

/* Ajustes folios + navegación + compatibilidad visual Hostinger */
.nav a.nav-back,
.nav a.nav-back:visited {
    color: #0f766e !important;
    background: #ffffff !important;
    border: 2px solid #ffffff !important;
    min-width: 92px;
    min-height: 34px;
    opacity: 1 !important;
    visibility: visible !important;
}

.nav a.nav-back:hover,
.nav a.nav-back:focus-visible {
    color: #0b5f59 !important;
    background: #dff7f5 !important;
    border-color: #ccfbf1 !important;
}

.folio-file-inline {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    white-space: nowrap;
}

.folio-file-inline .folio-file-name {
    display: inline-block;
    max-width: 330px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0;
    vertical-align: middle;
}

.folio-file-inline .btn {
    flex: 0 0 auto;
}

@media (max-width: 900px) {
    .folio-file-inline .folio-file-name {
        max-width: 220px;
    }
}
