* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    background: #f3f7fb;
    color: #1d2939;
}

.layout {
    display: flex;
    min-height: 100vh;
}

.sidebar {
    width: 250px;
    background: #072b4d;
    color: #fff;
    padding: 18px;
}

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
}

.logo,
.login-logo {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: linear-gradient(135deg, #00a86b, #0b5cad);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    box-shadow: 0 8px 25px rgba(0,0,0,.25);
}

.brand span {
    display: block;
    color: #a7d8ff;
    font-size: 13px;
}

.sidebar nav a {
    display: block;
    color: #dcefff;
    text-decoration: none;
    padding: 12px;
    border-radius: 10px;
    margin-bottom: 7px;
}

.sidebar nav a:hover {
    background: rgba(255,255,255,.13);
}

.content {
    flex: 1;
    padding: 22px;
}

.topbar {
    background: #fff;
    border-radius: 16px;
    padding: 14px 18px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    box-shadow: 0 8px 25px rgba(0,0,0,.05);
}

h1 {
    margin-top: 0;
}

.cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    margin-bottom: 20px;
}

.card,
.panel {
    background: #fff;
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 8px 25px rgba(0,0,0,.06);
}

.card span {
    display: block;
    color: #667085;
    margin-bottom: 8px;
}

.card strong {
    font-size: 28px;
}

.danger-card strong {
    color: #c0392b;
}

.panel-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 10px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    vertical-align: middle;
}

th {
    background: #eef6ff;
}

input,
select,
textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 12px;
}

textarea {
    min-height: 90px;
}

label {
    font-weight: bold;
    font-size: 14px;
}

.btn {
    display: inline-block;
    padding: 10px 16px;
    background: #0b5cad;
    color: #fff !important;
    text-decoration: none;
    border: none;
    border-radius: 10px;
    cursor: pointer;
}

.btn.secondary {
    background: #64748b;
}

.alert {
    padding: 12px;
    border-radius: 10px;
    margin-bottom: 12px;
}

.alert.danger {
    background: #ffe4e6;
    color: #b42318;
}

.alert.success {
    background: #dcfce7;
    color: #166534;
}

.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

.full {
    grid-column: 1 / -1;
}

.inline-form {
    display: flex;
    gap: 10px;
    align-items: end;
    margin-bottom: 20px;
}

.avatar {
    width: 45px;
    height: 45px;
    object-fit: cover;
    border-radius: 12px;
}

.row-danger {
    background: #fff1f2;
}

.row-warning {
    background: #fffbeb;
}

.login-body {
    min-height: 100vh;
    background: linear-gradient(135deg, #072b4d, #0b5cad, #00a86b);
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-box {
    width: 380px;
    background: #fff;
    padding: 30px;
    border-radius: 22px;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
}

.login-box h1 {
    margin-bottom: 4px;
}

.login-box button {
    width: 100%;
    margin-top: 10px;
    padding: 12px;
    border-radius: 12px;
    border: none;
    background: #0b5cad;
    color: white;
    font-weight: bold;
}

.voucher {
    max-width: 900px;
    margin: 20px auto;
    background: #fff;
    border-radius: 22px;
    padding: 28px;
    box-shadow: 0 12px 35px rgba(0,0,0,.12);
    border: 1px solid #dbeafe;
}

.voucher-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 4px solid #0b5cad;
    padding-bottom: 18px;
}

.voucher-brand {
    display: flex;
    gap: 15px;
    align-items: center;
}

.voucher-brand img {
    width: 85px;
    height: 85px;
    object-fit: contain;
}

.voucher-brand h1 {
    margin: 0;
    color: #072b4d;
    font-size: 34px;
}

.voucher-brand p {
    margin: 4px 0 0;
    color: #0b5cad;
    font-weight: bold;
}

.voucher-number {
    text-align: right;
}

.voucher-number strong {
    display: block;
    font-size: 20px;
    color: #00a86b;
}

.voucher-info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin: 25px 0;
}

.voucher-info div {
    background: #f8fbff;
    border-radius: 14px;
    padding: 14px;
}

.voucher-info p {
    margin: 7px 0;
    font-size: 18px;
}

.voucher-table th {
    background: #072b4d;
    color: #fff;
}

.voucher-total {
    margin-top: 20px;
    padding: 18px;
    background: linear-gradient(135deg, #072b4d, #0b5cad);
    color: white;
    border-radius: 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.voucher-total strong {
    font-size: 32px;
}

.voucher-sign {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 35px;
}

.voucher-sign img {
    max-width: 260px;
    max-height: 100px;
    display: block;
    margin: 10px auto;
}

.line {
    height: 70px;
    border-bottom: 2px solid #1d2939;
}

.voucher-foot {
    margin-top: 25px;
    padding-top: 15px;
    border-top: 1px dashed #98a2b3;
    color: #667085;
    font-size: 13px;
    text-align: center;
}

.firma-body {
    background: #eef6ff;
}

.firma-container {
    max-width: 950px;
    margin: 20px auto;
}

#canvasFirma {
    width: 100%;
    background: white;
    border: 2px dashed #0b5cad;
    border-radius: 14px;
    touch-action: none;
}

.firma-actions {
    display: flex;
    justify-content: end;
    gap: 10px;
    margin-top: 12px;
}

.print-body {
    background: #fff;
}

@media print {
    .sidebar,
    .topbar,
    .panel-title,
    .btn {
        display: none !important;
    }

    .content {
        padding: 0;
    }

    .voucher {
        box-shadow: none;
        border: none;
        margin: 0;
        max-width: 100%;
    }

    body {
        background: #fff;
    }
}


.voucher-bank {
    background: #eef6ff;
    border: 1px solid #bfdbfe;
    border-radius: 18px;
    padding: 16px;
    margin-bottom: 20px;
}

.voucher-bank h2 {
    margin: 0 0 12px;
    color: #072b4d;
}

.voucher-bank-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.voucher-bank-grid div {
    background: #fff;
    border-radius: 12px;
    padding: 10px;
}

.voucher-bank-grid strong {
    display: block;
    color: #475467;
    font-size: 12px;
    margin-bottom: 5px;
}

.voucher-bank-grid span {
    font-weight: bold;
    color: #072b4d;
}


.brand-logo-img,
.login-logo-img {
    width: 58px;
    height: 58px;
    border-radius: 16px;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0,0,0,.25);
    flex-shrink: 0;
}

.brand-logo-img img,
.login-logo-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 5px;
}

.login-logo-img {
    width: 90px;
    height: 90px;
    margin: 0 auto 12px;
}

.config-logo-preview {
    background: #f8fbff;
    border: 1px dashed #0b5cad;
    border-radius: 16px;
    padding: 16px;
    margin-bottom: 18px;
    display: inline-flex;
    flex-direction: column;
    gap: 10px;
}

.config-logo-preview img {
    width: 160px;
    height: 100px;
    object-fit: contain;
    background: white;
    border-radius: 12px;
    padding: 8px;
}

.company-line {
    margin-top: 12px;
    color: #475467;
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    font-size: 13px;
}


.factura-normal {
    max-width: 900px;
    margin: 20px auto;
    background: #fff;
    border-radius: 18px;
    padding: 28px;
    box-shadow: 0 10px 30px rgba(0,0,0,.10);
    border: 1px solid #dbeafe;
}

.factura-head {
    display: grid;
    grid-template-columns: 120px 1fr 220px;
    gap: 15px;
    align-items: center;
    border-bottom: 4px solid #0b5cad;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.factura-logo img {
    width: 110px;
    height: 90px;
    object-fit: contain;
}

.factura-empresa h1 {
    margin: 0 0 6px;
    color: #072b4d;
}

.factura-empresa p {
    margin: 2px 0;
    color: #475467;
}

.factura-numero {
    text-align: right;
}

.factura-numero h2 {
    margin: 0;
    color: #00a86b;
}

.factura-numero strong {
    display: block;
    font-size: 20px;
    margin-top: 8px;
}

.factura-fiscal,
.factura-cliente,
.factura-observacion,
.factura-footer {
    background: #f8fbff;
    border-radius: 14px;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #e0efff;
}

.factura-fiscal p,
.factura-footer p {
    margin: 4px 0;
}

.factura-cliente {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.factura-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 12px;
}

.factura-table th {
    background: #072b4d;
    color: white;
}

.factura-totales {
    width: 330px;
    margin-left: auto;
    margin-top: 15px;
    background: #f8fbff;
    border-radius: 14px;
    padding: 12px;
    border: 1px solid #e0efff;
}

.factura-totales p {
    display: flex;
    justify-content: space-between;
    margin: 7px 0;
}

.factura-totales .total-final {
    font-size: 22px;
    color: #072b4d;
    border-top: 2px solid #0b5cad;
    padding-top: 10px;
}

.factura-ticket {
    width: 80mm;
    max-width: 80mm;
    margin: 0 auto;
    background: white;
    color: black;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    padding: 4mm;
}

.factura-ticket .factura-head {
    display: block;
    text-align: center;
    border-bottom: 1px dashed #000;
    padding-bottom: 6px;
    margin-bottom: 6px;
}

.factura-ticket .factura-logo img {
    width: 55mm;
    height: 25mm;
    object-fit: contain;
}

.factura-ticket .factura-empresa h1 {
    font-size: 16px;
    margin: 4px 0;
}

.factura-ticket .factura-numero {
    text-align: center;
}

.factura-ticket .factura-numero h2 {
    font-size: 14px;
    color: black;
}

.factura-ticket .factura-numero strong {
    font-size: 12px;
}

.factura-ticket .factura-fiscal,
.factura-ticket .factura-cliente,
.factura-ticket .factura-observacion,
.factura-ticket .factura-footer {
    background: white;
    border: none;
    border-bottom: 1px dashed #000;
    border-radius: 0;
    padding: 4px 0;
}

.factura-ticket .factura-cliente {
    display: block;
}

.factura-ticket .factura-table th,
.factura-ticket .factura-table td {
    padding: 3px 1px;
    font-size: 10px;
    border-bottom: 1px dotted #999;
}

.factura-ticket .factura-table th {
    background: white;
    color: black;
    border-bottom: 1px solid #000;
}

.factura-ticket .factura-totales {
    width: 100%;
    background: white;
    border: none;
    border-radius: 0;
    padding: 4px 0;
}

.factura-ticket .factura-totales .total-final {
    font-size: 15px;
    color: black;
    border-top: 1px solid #000;
}

.ticket-body {
    background: white;
}

@media print {
    @page {
        margin: 8mm;
    }

    .factura-normal {
        box-shadow: none;
        border: none;
        margin: 0;
        max-width: 100%;
    }

    .ticket-body {
        margin: 0;
        padding: 0;
    }

    .ticket-body @page {
        size: 80mm auto;
        margin: 2mm;
    }

    .factura-ticket {
        margin: 0;
        width: 80mm;
        max-width: 80mm;
        padding: 2mm;
    }
}


.danger-link {
    color: #b42318 !important;
    font-weight: 700;
}

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

.actions a {
    text-decoration: none;
}


/* V11 REPORTES PRINT */
.report-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.report-card {
    background: #ffffff;
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
    border: 1px solid #e5edf5;
}

.report-card span {
    display: block;
    color: #667085;
    font-size: 13px;
    margin-bottom: 6px;
}

.report-card strong {
    display: block;
    color: #102033;
    font-size: 24px;
}

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

.print-only {
    display: none;
}

.voucher-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 15px 0;
}

.btn.ticket {
    background: #0f766e;
}

.ticket-print {
    width: 80mm;
    max-width: 80mm;
    background: white;
    color: black;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    padding: 4mm;
    margin: 0 auto;
}

.ticket-print h1,
.ticket-print h2,
.ticket-print h3 {
    text-align: center;
    margin: 4px 0;
}

.ticket-print table {
    width: 100%;
    border-collapse: collapse;
}

.ticket-print td,
.ticket-print th {
    font-size: 10px;
    padding: 3px 1px;
    border-bottom: 1px dotted #999;
}

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

.ticket-print .line {
    border-top: 1px dashed #000;
    margin: 6px 0;
}

@media print {
    body {
        background: white !important;
    }

    .sidebar,
    .topbar,
    .report-actions,
    .btn,
    .no-print {
        display: none !important;
    }

    .content {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .panel {
        box-shadow: none !important;
        border: none !important;
        padding: 0 !important;
    }

    .print-only {
        display: block !important;
    }

    table {
        width: 100% !important;
        border-collapse: collapse !important;
    }

    table th,
    table td {
        border: 1px solid #222 !important;
        padding: 6px !important;
        color: #000 !important;
    }

    table th {
        background: #f2f2f2 !important;
    }

    @page {
        size: letter;
        margin: 10mm;
    }
}

@media print {
    body.ticket-mode {
        margin: 0 !important;
        padding: 0 !important;
    }
}


/* V13 VOUCHER ONE PAGE */
.voucher-onepage {
    max-width: 820px;
    padding: 18px 20px;
    page-break-inside: avoid;
    break-inside: avoid;
}

.voucher-onepage .voucher-head {
    padding-bottom: 10px;
    border-bottom-width: 3px;
}

.voucher-onepage .voucher-brand {
    gap: 12px;
    align-items: center;
}

.voucher-onepage .voucher-brand img {
    width: 64px;
    height: 64px;
}

.voucher-onepage .voucher-brand h1 {
    font-size: 24px;
    line-height: 1.1;
}

.voucher-onepage .voucher-brand p {
    font-size: 15px;
    margin-top: 3px;
}

.voucher-onepage .voucher-brand small,
.voucher-onepage .voucher-number small {
    display: block;
    color: #667085;
    margin-top: 4px;
    font-size: 11px;
}

.voucher-onepage .voucher-number strong {
    font-size: 17px;
}

.voucher-onepage .voucher-number span {
    display: block;
    margin-top: 4px;
    font-size: 13px;
}

.voucher-onepage .voucher-info {
    gap: 10px;
    margin: 14px 0;
}

.voucher-onepage .voucher-info div {
    padding: 10px 12px;
}

.voucher-onepage .voucher-info p {
    margin: 5px 0 3px;
    font-size: 14px;
    font-weight: 700;
    color: #0f172a;
}

.voucher-onepage .voucher-info small {
    color: #475467;
    font-size: 12px;
}

.voucher-onepage .voucher-bank {
    padding: 12px 14px;
    margin-bottom: 14px;
    page-break-inside: avoid;
}

.voucher-onepage .voucher-bank h2 {
    margin-bottom: 8px;
    font-size: 16px;
}

.voucher-onepage .voucher-bank-grid {
    gap: 8px;
}

.voucher-onepage .voucher-bank-grid div {
    padding: 8px 10px;
}

.voucher-onepage .voucher-bank-grid strong {
    font-size: 11px;
    margin-bottom: 3px;
}

.voucher-onepage .voucher-bank-grid span {
    font-size: 13px;
}

.voucher-onepage .voucher-table {
    page-break-inside: avoid;
    break-inside: avoid;
}

.voucher-onepage .voucher-table th,
.voucher-onepage .voucher-table td {
    padding: 9px 10px;
    font-size: 13px;
}

.voucher-onepage .voucher-total {
    margin-top: 14px;
    padding: 12px 16px;
}

.voucher-onepage .voucher-total span {
    font-size: 15px;
}

.voucher-onepage .voucher-total strong {
    font-size: 24px;
}

.voucher-onepage .voucher-sign {
    margin-top: 16px;
    gap: 14px;
    page-break-inside: avoid;
}

.voucher-onepage .sign-box {
    background: #f8fbff;
    border: 1px solid #dbeafe;
    border-radius: 14px;
    padding: 12px;
}

.voucher-onepage .voucher-sign strong {
    display: block;
    margin-bottom: 8px;
    color: #102a43;
}

.voucher-onepage .voucher-sign img {
    max-width: 220px;
    max-height: 66px;
    margin: 4px auto 6px;
}

.voucher-onepage .compact-line {
    height: 44px;
    border-bottom: 2px solid #1d2939;
}

.voucher-onepage .voucher-sign p {
    margin: 8px 0 3px;
    font-weight: 700;
}

.voucher-onepage .voucher-sign small {
    color: #667085;
    font-size: 11px;
}

.voucher-onepage .voucher-foot {
    margin-top: 10px;
    padding-top: 8px;
    font-size: 11px;
}

@media print {
    @page {
        size: letter portrait;
        margin: 6mm;
    }

    .voucher-onepage {
        max-width: 100% !important;
        width: 100% !important;
        padding: 10px 12px !important;
        margin: 0 auto !important;
        box-shadow: none !important;
        border: none !important;
        page-break-after: avoid !important;
    }

    .voucher-onepage .voucher-brand img {
        width: 54px !important;
        height: 54px !important;
    }

    .voucher-onepage .voucher-brand h1 {
        font-size: 20px !important;
    }

    .voucher-onepage .voucher-brand p {
        font-size: 13px !important;
    }

    .voucher-onepage .voucher-number strong {
        font-size: 15px !important;
    }

    .voucher-onepage .voucher-info {
        margin: 10px 0 !important;
        gap: 8px !important;
    }

    .voucher-onepage .voucher-info div,
    .voucher-onepage .voucher-bank-grid div {
        padding: 7px 8px !important;
    }

    .voucher-onepage .voucher-table th,
    .voucher-onepage .voucher-table td {
        padding: 6px 7px !important;
        font-size: 12px !important;
    }

    .voucher-onepage .voucher-total {
        margin-top: 10px !important;
        padding: 10px 12px !important;
    }

    .voucher-onepage .voucher-total strong {
        font-size: 22px !important;
    }

    .voucher-onepage .voucher-sign {
        margin-top: 12px !important;
        gap: 10px !important;
    }

    .voucher-onepage .sign-box {
        padding: 10px !important;
    }

    .voucher-onepage .compact-line {
        height: 36px !important;
    }

    .voucher-onepage .voucher-sign img {
        max-height: 52px !important;
    }

    .voucher-onepage .voucher-foot {
        margin-top: 8px !important;
        padding-top: 6px !important;
        font-size: 10px !important;
    }

    body.print-body {
        margin: 0 !important;
        padding: 0 !important;
    }
}


/* V14 CORPORATIVO + MARCA DE AGUA + TICKET 58/80MM */
.voucher-corporate {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    border: 1px solid #cfe0ff;
}

.voucher-watermark {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 0;
}

.voucher-watermark img {
    width: 360px;
    max-width: 55%;
    opacity: 0.05;
    filter: grayscale(15%);
}

.voucher-corporate > * {
    position: relative;
    z-index: 1;
}

.corporate-head {
    background: linear-gradient(90deg, rgba(11,92,173,0.05), rgba(7,43,77,0.01));
    border-radius: 16px;
    padding: 12px 14px 10px;
    margin-bottom: 10px;
}

.corporate-number {
    background: #fff;
    border: 1px solid #d6e4ff;
    border-radius: 14px;
    padding: 8px 12px;
    min-width: 210px;
}

.status-badge {
    display: inline-block;
    margin-top: 6px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .4px;
}

.status-badge.signed {
    background: #dcfce7;
    color: #166534;
}

.status-badge.pending {
    background: #fef3c7;
    color: #92400e;
}

.corporate-table tbody tr:nth-child(even) td {
    background: rgba(11,92,173,0.03);
}

.corporate-total {
    box-shadow: 0 8px 18px rgba(7,43,77,.12);
}

.ticket-print {
    box-sizing: border-box;
    box-shadow: 0 0 0 1px #eee;
}

.ticket-80 {
    width: 80mm;
    max-width: 80mm;
    font-size: 11px;
    padding: 4mm;
}

.ticket-58 {
    width: 58mm;
    max-width: 58mm;
    font-size: 10px;
    padding: 3mm;
}

.ticket-company {
    font-weight: 800;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: .3px;
}

.ticket-58 .ticket-company {
    font-size: 12px;
}

.ticket-subtitle {
    font-size: 10px;
}

.ticket-print .right {
    text-align: right;
}

.ticket-meta td {
    border-bottom: none;
    padding: 2px 1px;
    vertical-align: top;
}

.ticket-note {
    font-weight: 700;
    margin-bottom: 4px;
}

.ticket-link {
    word-break: break-all;
    font-size: 9px;
    line-height: 1.25;
}

.ticket-58 table td,
.ticket-58 table th {
    font-size: 9px;
}

.ticket-58 .ticket-link {
    font-size: 8px;
}

@media print {
    .voucher-watermark img {
        opacity: 0.06 !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    body.ticket-mode.ticket-size-80 {
        width: 80mm !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.ticket-mode.ticket-size-58 {
        width: 58mm !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    @page {
        size: letter portrait;
        margin: 6mm;
    }

    body.ticket-mode.ticket-size-80 .ticket-print {
        width: 76mm !important;
        max-width: 76mm !important;
        box-shadow: none !important;
    }

    body.ticket-mode.ticket-size-58 .ticket-print {
        width: 54mm !important;
        max-width: 54mm !important;
        box-shadow: none !important;
    }
}


/* V15 WATERMARK POSITION FIX */
.voucher-corporate {
    margin-top: 0 !important;
    padding-top: 12px !important;
}

.voucher-corporate .voucher-watermark {
    position: absolute !important;
    top: 10px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    height: 165px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}

.voucher-corporate .voucher-watermark img {
    width: 260px !important;
    max-width: 42% !important;
    opacity: 0.045 !important;
}

.voucher-corporate .corporate-head {
    margin-top: 0 !important;
}

.voucher-corporate .voucher-head,
.voucher-corporate .voucher-info,
.voucher-corporate .voucher-bank,
.voucher-corporate .voucher-table,
.voucher-corporate .voucher-total,
.voucher-corporate .voucher-sign,
.voucher-corporate .voucher-foot {
    position: relative;
    z-index: 2;
}

@media print {
    .voucher-corporate {
        margin-top: 0 !important;
        padding-top: 8px !important;
    }

    .voucher-corporate .voucher-watermark {
        top: 8px !important;
        height: 140px !important;
    }

    .voucher-corporate .voucher-watermark img {
        width: 220px !important;
        max-width: 38% !important;
        opacity: 0.04 !important;
    }
}


/* V16 CATALOGOS REPORTES */
.inline-form {
    display: flex;
    gap: 10px;
    align-items: end;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.inline-form input {
    min-width: 260px;
}

.report-cards {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

@media print {
    .sidebar,
    .topbar,
    .panel-title,
    .report-actions,
    .btn,
    .no-print {
        display: none !important;
    }

    .content {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .panel {
        box-shadow: none !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    h1, h2 {
        color: #000 !important;
    }

    table {
        page-break-inside: auto;
    }

    tr {
        page-break-inside: avoid;
        page-break-after: auto;
    }
}


/* V17 ASISTENCIA UI FIX */
.asistencia-title {
    margin-bottom: 14px;
}

.asistencia-panel {
    padding-top: 22px;
}

.asistencia-date-form {
    display: flex;
    align-items: end;
    gap: 12px;
    margin-bottom: 20px;
    max-width: 560px;
}

.asistencia-date-group {
    flex: 1;
}

.asistencia-date-group label {
    display: block;
    font-weight: 700;
    margin-bottom: 6px;
    color: #1d2939;
}

.asistencia-date-group input[type="date"] {
    width: 100%;
    max-width: 320px;
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
}

.asistencia-table {
    min-width: 980px;
}

.asistencia-table th {
    white-space: nowrap;
}

.asistencia-table td {
    vertical-align: middle;
}

.empleado-cell strong {
    display: block;
    color: #1d2939;
}

.empleado-cell small {
    display: block;
    color: #667085;
    margin-top: 3px;
    font-size: 12px;
}

.time-input {
    width: 135px !important;
    min-width: 135px !important;
    font-family: inherit !important;
    letter-spacing: normal !important;
    text-align: center;
}

.estado-select {
    width: 230px !important;
    min-width: 230px !important;
}

.observacion-input {
    min-width: 280px;
}

.asistencia-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
}

@media (max-width: 800px) {
    .asistencia-date-form {
        display: block;
        max-width: 100%;
    }

    .asistencia-date-form .btn {
        margin-top: 10px;
        width: 100%;
    }

    .asistencia-date-group input[type="date"] {
        max-width: 100%;
    }
}


/* V18 TIME CHOOSER */
.time-chooser {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff;
    border: 1px solid #cfd8e3;
    border-radius: 10px;
    padding: 6px 8px;
    min-width: 148px;
}

.time-chooser select {
    width: 58px !important;
    min-width: 58px !important;
    height: 34px;
    padding: 4px 6px;
    border: 1px solid #d0d5dd;
    border-radius: 8px;
    background: #f8fbff;
    font-weight: 700;
    text-align: center;
    color: #101828;
}

.time-chooser span {
    font-weight: 800;
    color: #0b5cad;
}

.asistencia-date-form {
    flex-direction: row !important;
    align-items: end !important;
}

.asistencia-date-group input[type="date"] {
    height: 42px;
}

.asistencia-table td {
    padding-top: 12px;
    padding-bottom: 12px;
}


/* V19 CRUD GENERAL */
.crud-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.crud-card {
    display: block;
    padding: 18px;
    background: #ffffff;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    text-decoration: none;
    box-shadow: 0 8px 20px rgba(15,23,42,.06);
    transition: .15s ease;
}

.crud-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(15,23,42,.10);
}

.crud-card strong {
    display: block;
    color: #072b4d;
    font-size: 16px;
    margin-bottom: 5px;
}

.crud-card span {
    color: #667085;
    font-size: 12px;
}

.crud-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(260px, 1fr));
    gap: 14px;
}

.crud-form textarea {
    min-height: 90px;
}

.crud-form button,
.crud-form a.btn {
    width: fit-content;
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
}

@media (max-width: 900px) {
    .crud-form {
        grid-template-columns: 1fr;
    }
}


/* V20 CRUD EN MODULOS */
.panel-title .report-actions {
    margin-bottom: 0;
}

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

.actions a {
    text-decoration: none;
    font-weight: 700;
}

.danger-link {
    color: #b42318 !important;
}


/* V21 DASHBOARD FIX */
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.dash-card {
    background: #ffffff;
    border: 1px solid #dbeafe;
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .07);
}

.dash-card span {
    display: block;
    color: #667085;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 8px;
}

.dash-card strong {
    display: block;
    color: #072b4d;
    font-size: 28px;
    line-height: 1.1;
}

.dash-card small {
    display: block;
    color: #667085;
    margin-top: 8px;
}

.dash-card.money strong {
    color: #0b5cad;
}

.dash-card.warning strong {
    color: #b54708;
}

.dash-card.danger strong {
    color: #b42318;
}

.dashboard-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

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

@media print {
    .dashboard-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .dashboard-panels {
        grid-template-columns: 1fr;
    }
}


/* V22 DASHBOARD GRAFICOS */
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.dash-card {
    border-radius: 20px;
    padding: 18px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 14px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .12);
}

.dash-icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    background: rgba(255,255,255,.16);
    flex-shrink: 0;
}

.dash-content span {
    display: block;
    font-size: 13px;
    font-weight: 700;
    opacity: .95;
    margin-bottom: 6px;
}

.dash-content strong {
    display: block;
    font-size: 28px;
    line-height: 1.05;
    margin-bottom: 4px;
}

.dash-content small {
    display: block;
    opacity: .92;
    font-size: 12px;
}

.gradient-blue { background: linear-gradient(135deg, #0f4c81, #1d4ed8); }
.gradient-green { background: linear-gradient(135deg, #0f766e, #16a34a); }
.gradient-orange { background: linear-gradient(135deg, #c2410c, #f59e0b); }
.gradient-indigo { background: linear-gradient(135deg, #312e81, #4f46e5); }
.gradient-red { background: linear-gradient(135deg, #991b1b, #dc2626); }
.gradient-cyan { background: linear-gradient(135deg, #0f766e, #06b6d4); }
.gradient-gold { background: linear-gradient(135deg, #9a6700, #eab308); color:#1f2937; }
.gradient-purple { background: linear-gradient(135deg, #6d28d9, #a855f7); }

.dashboard-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-bottom: 18px;
}

.chart-panel .chart-wrap {
    position: relative;
    min-height: 320px;
}

.quick-summary-panel .quick-metrics {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 10px;
}

.quick-metric {
    background: #f8fafc;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    padding: 16px;
}

.quick-metric span {
    display: block;
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 6px;
}

.quick-metric strong {
    display: block;
    color: #0f172a;
    font-size: 24px;
}

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

@media (max-width: 700px) {
    .quick-summary-panel .quick-metrics {
        grid-template-columns: 1fr;
    }
}

@media print {
    .dashboard-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .dashboard-panels {
        grid-template-columns: 1fr;
    }

    .dash-card {
        color: #111827 !important;
        background: #ffffff !important;
        border: 1px solid #dbeafe;
    }
}


/* V23 DASHBOARD CONTRASTE CARDS */
.dashboard-grid .dash-card,
.dashboard-grid .dash-card.gradient-blue,
.dashboard-grid .dash-card.gradient-green,
.dashboard-grid .dash-card.gradient-orange,
.dashboard-grid .dash-card.gradient-indigo,
.dashboard-grid .dash-card.gradient-red,
.dashboard-grid .dash-card.gradient-cyan,
.dashboard-grid .dash-card.gradient-gold,
.dashboard-grid .dash-card.gradient-purple {
    color: #ffffff !important;
    position: relative;
    overflow: hidden;
    min-height: 112px;
    align-items: center;
}

.dashboard-grid .dash-card::after {
    content: "";
    position: absolute;
    right: -28px;
    bottom: -34px;
    width: 110px;
    height: 110px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    pointer-events: none;
}

.dashboard-grid .dash-card .dash-icon {
    background: rgba(255, 255, 255, .22) !important;
    color: #ffffff !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
    text-shadow: 0 2px 5px rgba(0,0,0,.25);
    z-index: 2;
}

.dashboard-grid .dash-card .dash-content {
    position: relative;
    z-index: 2;
}

.dashboard-grid .dash-card .dash-content span {
    color: #ffffff !important;
    opacity: 1 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: .2px;
    text-shadow: 0 1px 3px rgba(0,0,0,.28);
}

.dashboard-grid .dash-card .dash-content strong {
    color: #ffffff !important;
    opacity: 1 !important;
    font-size: 31px !important;
    font-weight: 900 !important;
    text-shadow: 0 2px 6px rgba(0,0,0,.30);
}

.dashboard-grid .dash-card .dash-content small {
    color: rgba(255,255,255,.96) !important;
    opacity: 1 !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 3px rgba(0,0,0,.25);
}

.dashboard-grid .gradient-gold,
.dashboard-grid .dash-card.gradient-gold {
    color: #ffffff !important;
    background: linear-gradient(135deg, #a16207, #d97706) !important;
}

.dashboard-grid .gradient-cyan,
.dashboard-grid .dash-card.gradient-cyan {
    background: linear-gradient(135deg, #0f766e, #0891b2) !important;
}

.dashboard-grid .gradient-green,
.dashboard-grid .dash-card.gradient-green {
    background: linear-gradient(135deg, #047857, #16a34a) !important;
}

.dashboard-grid .gradient-blue,
.dashboard-grid .dash-card.gradient-blue {
    background: linear-gradient(135deg, #0b4a7a, #1d4ed8) !important;
}

.dashboard-grid .gradient-purple,
.dashboard-grid .dash-card.gradient-purple {
    background: linear-gradient(135deg, #6d28d9, #9333ea) !important;
}

.dashboard-grid .gradient-indigo,
.dashboard-grid .dash-card.gradient-indigo {
    background: linear-gradient(135deg, #3730a3, #4f46e5) !important;
}

.dashboard-grid .gradient-red,
.dashboard-grid .dash-card.gradient-red {
    background: linear-gradient(135deg, #991b1b, #dc2626) !important;
}

.dashboard-grid .gradient-orange,
.dashboard-grid .dash-card.gradient-orange {
    background: linear-gradient(135deg, #c2410c, #ea580c) !important;
}

@media print {
    .dashboard-grid .dash-card,
    .dashboard-grid .dash-card .dash-content span,
    .dashboard-grid .dash-card .dash-content strong,
    .dashboard-grid .dash-card .dash-content small {
        color: #111827 !important;
        text-shadow: none !important;
    }
}


/* V24 CRUD VISIBLE MODULOS */
.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.actions a {
    font-weight: 800;
    text-decoration: none;
    color: #0b5cad;
}

.actions .danger-link,
.danger-link {
    color: #b42318 !important;
}

.alert.info {
    background: #eaf4ff;
    color: #084b83;
    border: 1px solid #bfdbfe;
}

.panel-title .report-actions,
.report-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

/* V27 PAGOS BCH FORM FIX */
.pagos-bch-form small { display:block; margin-top:5px; color:#667085; font-weight:600; }
.alert code { display:block; margin-top:8px; padding:8px 10px; background:#fff; border-radius:8px; color:#111827; white-space:normal; }


/* V30 DASHBOARD CARDS CLICK */
.dashboard-grid .dash-link-card {
    text-decoration: none !important;
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.dashboard-grid .dash-link-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 34px rgba(15, 23, 42, .22);
    filter: brightness(1.04);
}

.dashboard-grid .dash-link-card:active {
    transform: translateY(-1px);
}

.dashboard-grid .dash-link-card::before {
    content: "Abrir";
    position: absolute;
    top: 10px;
    right: 12px;
    background: rgba(255,255,255,.18);
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    padding: 4px 8px;
    border-radius: 999px;
    opacity: 0;
    transform: translateY(-4px);
    transition: .16s ease;
    z-index: 3;
}

.dashboard-grid .dash-link-card:hover::before {
    opacity: 1;
    transform: translateY(0);
}

@media print {
    .dashboard-grid .dash-link-card::before {
        display: none;
    }
}


/* V31 PAGAR PAGOS */
.pay-link {
    background: #16a34a;
    color: #fff !important;
    padding: 5px 10px;
    border-radius: 999px;
    font-weight: 900;
}

.payment-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

.payment-summary div {
    background: #f8fafc;
    border: 1px solid #dbeafe;
    border-radius: 14px;
    padding: 14px;
}

.payment-summary span {
    display: block;
    color: #667085;
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 5px;
}

.payment-summary strong {
    display: block;
    color: #0f172a;
    font-size: 16px;
}

/* V32 ASISTENCIA DASHBOARD */
.attendance-dashboard{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:18px}
.attendance-card{color:#fff;border-radius:18px;padding:16px;box-shadow:0 10px 24px rgba(15,23,42,.12)}
.attendance-card span{display:block;font-size:12px;font-weight:900;opacity:.96;margin-bottom:6px}
.attendance-card strong{display:block;font-size:26px;font-weight:950}
.attendance-card.blue{background:linear-gradient(135deg,#0b5cad,#1d4ed8)}.attendance-card.green{background:linear-gradient(135deg,#047857,#16a34a)}.attendance-card.orange{background:linear-gradient(135deg,#c2410c,#f97316)}.attendance-card.red{background:linear-gradient(135deg,#991b1b,#dc2626)}.attendance-card.cyan{background:linear-gradient(135deg,#0f766e,#0891b2)}.attendance-card.purple{background:linear-gradient(135deg,#5b21b6,#9333ea)}
.attendance-datebar,.attendance-report-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:end}
.attendance-header-row{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.quick-actions{display:flex;gap:8px;flex-wrap:wrap}
.attendance-list{display:grid;gap:12px}.attendance-employee-row{display:grid;grid-template-columns:240px 1fr 230px 260px;gap:12px;align-items:center;background:#fff;border:1px solid #dbeafe;border-left:6px solid #0b5cad;border-radius:16px;padding:14px;box-shadow:0 6px 18px rgba(15,23,42,.05)}
.attendance-employee-row.estado-presente{border-left-color:#16a34a}.attendance-employee-row.estado-tarde{border-left-color:#f97316}.attendance-employee-row.estado-ausente{border-left-color:#dc2626;background:#fff7f7}.attendance-employee-row.estado-pagado{border-left-color:#2563eb}
.emp-info strong{display:block;color:#0f172a;font-size:14px}.emp-info small{display:block;color:#667085;margin-top:3px}
.state-buttons{display:flex;flex-wrap:wrap;gap:6px}.state-pill{cursor:pointer}.state-pill input{display:none}.state-pill span{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;background:#f1f5f9;border:1px solid #dbeafe;color:#334155;font-size:12px;font-weight:900}.state-pill input:checked+span{color:#fff;border-color:transparent;box-shadow:0 6px 14px rgba(15,23,42,.14)}
.state-presente input:checked+span{background:#16a34a}.state-tarde input:checked+span{background:#f97316}.state-dia_autorizado_pagado input:checked+span,.state-vacaciones input:checked+span,.state-incapacidad input:checked+span{background:#2563eb}.state-ausente input:checked+span,.state-permiso_sin_goce input:checked+span{background:#dc2626}
.time-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px}.time-fields label,.obs-field label{font-size:11px;color:#667085;font-weight:900}.obs-field input{width:100%}
.winner-card{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:18px;padding:18px}.winner-card.danger{background:#fff1f2;border-color:#fecdd3}.winner-card strong{display:block;font-size:20px;color:#0f172a}.winner-card span,.winner-card small{display:block;margin-top:6px;color:#334155;font-weight:800}.muted{color:#667085}
@media(max-width:1300px){.attendance-employee-row{grid-template-columns:1fr}}@media print{.attendance-employee-row{break-inside:avoid;box-shadow:none}.state-pill span{padding:3px 6px}}

/* V33 FILTROS REPORTES PAGOS */
.filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
    align-items: end;
}
.filter-buttons {
    display: flex;
    gap: 8px;
    align-items: end;
    flex-wrap: wrap;
}
.dashboard-grid-nine {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}
.gradient-emerald,
.dashboard-grid .dash-card.gradient-emerald {
    background: linear-gradient(135deg, #047857, #10b981) !important;
}
@media print {
    .filter-grid,
    .filter-buttons {
        display: none !important;
    }
}


/* V34 PLANILLA EXCEPCIONES */
.alert.warning {
    background: #fff7ed;
    color: #9a3412;
    border: 1px solid #fed7aa;
}
.date-chip {
    display: inline-flex;
    margin: 2px;
    padding: 4px 8px;
    background: #eff6ff;
    color: #0b5cad;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}
@media print {
    .date-chip {
        border: 1px solid #999;
        color: #111;
        background: #fff;
    }
}


/* V38 GASTOS HORMIGA */
.gradient-pink,
.dashboard-grid .dash-card.gradient-pink {
    background: linear-gradient(135deg, #be185d, #ec4899) !important;
}

.gradient-brown,
.dashboard-grid .dash-card.gradient-brown {
    background: linear-gradient(135deg, #78350f, #d97706) !important;
}

.gradient-slate,
.dashboard-grid .dash-card.gradient-slate {
    background: linear-gradient(135deg, #334155, #0f172a) !important;
}

.gasto-hormiga-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 999px;
    background: #fff7ed;
    color: #9a3412;
    border: 1px solid #fed7aa;
    font-weight: 900;
}

@media print {
    .gasto-hormiga-badge {
        background: white;
        color: #111;
        border: 1px solid #999;
    }
}


/* V39 DASHBOARD PREMIUM BONITO */
.premium-dashboard {
    display: grid;
    gap: 18px;
}

.premium-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 22px;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(37, 99, 235, .18), transparent 30%),
        linear-gradient(135deg, #ffffff, #f8fbff);
    border: 1px solid #dbeafe;
    box-shadow: 0 16px 38px rgba(15, 23, 42, .08);
}

.hero-eyebrow {
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #0b5cad;
}

.premium-hero h1 {
    margin: 0;
    font-size: 34px;
    line-height: 1.1;
    color: #0f172a;
}

.hero-subtitle {
    margin: 8px 0 0;
    color: #475569;
    font-weight: 700;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.premium-section {
    display: grid;
    gap: 12px;
}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
}

.section-kicker {
    display: block;
    color: #0b5cad;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.section-head h2 {
    margin: 2px 0 0;
    color: #0f172a;
    font-size: 20px;
}

.premium-kpi-grid {
    display: grid;
    gap: 14px;
}

.primary-kpis {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.alert-kpis {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.premium-kpi {
    position: relative;
    overflow: hidden;
    min-height: 136px;
    padding: 17px;
    border-radius: 22px;
    color: #fff !important;
    text-decoration: none !important;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .16);
    display: grid;
    align-content: space-between;
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.premium-kpi:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(15, 23, 42, .24);
    filter: brightness(1.04);
}

.premium-kpi::after {
    content: "";
    position: absolute;
    right: -28px;
    bottom: -34px;
    width: 112px;
    height: 112px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
}

.premium-kpi.slim {
    min-height: 118px;
}

.kpi-icon {
    width: 44px;
    height: 44px;
    display: inline-grid;
    place-items: center;
    border-radius: 15px;
    background: rgba(255,255,255,.18);
    font-size: 22px;
    margin-bottom: 12px;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.14);
}

.kpi-title {
    display: block;
    font-size: 13px;
    font-weight: 950;
    color: rgba(255,255,255,.96);
}

.premium-kpi strong {
    display: block;
    margin-top: 5px;
    font-size: 27px;
    line-height: 1.05;
    font-weight: 950;
    color: #fff;
    text-shadow: 0 1px 0 rgba(0,0,0,.08);
}

.premium-kpi small {
    display: block;
    margin-top: 7px;
    color: rgba(255,255,255,.92);
    font-size: 12px;
    font-weight: 800;
    max-width: 170px;
}

.kpi-blue { background: linear-gradient(135deg, #0b5cad, #2563eb); }
.kpi-green { background: linear-gradient(135deg, #047857, #16a34a); }
.kpi-indigo { background: linear-gradient(135deg, #4338ca, #6366f1); }
.kpi-cyan { background: linear-gradient(135deg, #0f766e, #0891b2); }
.kpi-emerald { background: linear-gradient(135deg, #047857, #10b981); }
.kpi-purple { background: linear-gradient(135deg, #6d28d9, #a855f7); }
.kpi-orange { background: linear-gradient(135deg, #c2410c, #f97316); }
.kpi-red { background: linear-gradient(135deg, #991b1b, #dc2626); }
.kpi-gold { background: linear-gradient(135deg, #92400e, #d97706); }
.kpi-pink { background: linear-gradient(135deg, #be185d, #ec4899); }

.finance-strip {
    display: grid;
    grid-template-columns: 1fr 1.4fr 1fr;
    gap: 14px;
}

.finance-card {
    background: #fff;
    border: 1px solid #dbeafe;
    border-radius: 22px;
    padding: 18px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .07);
}

.finance-card.featured {
    color: #fff;
    background:
        radial-gradient(circle at right, rgba(255,255,255,.18), transparent 28%),
        linear-gradient(135deg, #be185d, #ec4899);
    border: 0;
}

.finance-card span {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.finance-card.featured span,
.finance-card.featured small,
.finance-card.featured a {
    color: rgba(255,255,255,.92);
}

.finance-card strong {
    display: block;
    margin: 8px 0;
    font-size: 28px;
    color: #0f172a;
    font-weight: 950;
}

.finance-card.featured strong {
    color: #fff;
    font-size: 34px;
}

.finance-card a {
    display: inline-flex;
    margin-top: 6px;
    font-weight: 950;
    color: #0b5cad;
    text-decoration: none;
}

.premium-charts,
.premium-tables {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
}

.premium-panel {
    border: 1px solid #dbeafe;
    border-radius: 24px;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .08);
}

.premium-chart {
    height: 310px;
}

.premium-panel table {
    font-size: 13px;
}

.premium-panel th {
    background: #eff6ff;
    color: #0f172a;
    font-weight: 950;
}

@media (max-width: 1200px) {
    .finance-strip,
    .premium-charts,
    .premium-tables {
        grid-template-columns: 1fr;
    }

    .premium-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .hero-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .premium-hero h1 {
        font-size: 28px;
    }

    .primary-kpis,
    .alert-kpis {
        grid-template-columns: 1fr;
    }

    .premium-kpi {
        min-height: 118px;
    }
}

@media print {
    .premium-hero,
    .premium-kpi,
    .finance-card,
    .premium-panel {
        box-shadow: none !important;
    }

    .premium-kpi,
    .finance-card.featured {
        color: #111 !important;
        background: #fff !important;
        border: 1px solid #999 !important;
    }

    .premium-kpi strong,
    .premium-kpi small,
    .premium-kpi span,
    .finance-card.featured strong,
    .finance-card.featured span,
    .finance-card.featured small {
        color: #111 !important;
        text-shadow: none !important;
    }
}


/* V40 REPORTES PROFESIONALES */
.report-premium-page{display:grid;gap:18px}
.report-hero{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px;border-radius:22px;background:linear-gradient(135deg,#fff,#f7fbff);border:1px solid #dbeafe;box-shadow:0 14px 32px rgba(15,23,42,.08)}
.report-hero.compact{padding:18px 22px}
.report-premium-grid{display:grid;gap:14px}
.stats-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.mini-stats{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.report-stat-card{padding:18px;border-radius:18px;color:#fff;box-shadow:0 14px 30px rgba(15,23,42,.14)}
.report-stat-card span{display:block;font-size:12px;font-weight:900;letter-spacing:.03em;color:rgba(255,255,255,.92);text-transform:uppercase}
.report-stat-card strong{display:block;font-size:34px;line-height:1.05;margin:7px 0;font-weight:950;color:#fff}
.report-stat-card small{display:block;font-size:12px;font-weight:700;color:rgba(255,255,255,.9)}
.report-stat-card.blue{background:linear-gradient(135deg,#0b5cad,#2563eb)}
.report-stat-card.green{background:linear-gradient(135deg,#047857,#16a34a)}
.report-stat-card.red{background:linear-gradient(135deg,#991b1b,#dc2626)}
.report-stat-card.indigo{background:linear-gradient(135deg,#4338ca,#6366f1)}
.report-stat-card.cyan{background:linear-gradient(135deg,#0f766e,#0891b2)}
.report-stat-card.orange{background:linear-gradient(135deg,#c2410c,#f97316)}
.report-stat-card.purple{background:linear-gradient(135deg,#6d28d9,#a855f7)}
.report-stat-card.gold{background:linear-gradient(135deg,#92400e,#d97706)}
.report-link-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.report-module-card{display:block;padding:18px;border:1px solid #dbeafe;border-radius:16px;background:#fff;text-decoration:none;color:#0f172a;box-shadow:0 10px 24px rgba(15,23,42,.05);transition:all .16s ease}
.report-module-card:hover{transform:translateY(-3px);border-color:#93c5fd;box-shadow:0 16px 32px rgba(15,23,42,.10)}
.report-module-card strong{display:block;font-size:16px;margin-bottom:6px}
.report-module-card span{font-size:13px;color:#64748b}
.filter-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;align-items:end}
.filter-bar.advanced-filters{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.filter-bar label{display:block;margin-bottom:6px;font-size:12px;font-weight:900;color:#334155;text-transform:uppercase;letter-spacing:.03em}
.filter-actions{display:flex;gap:10px;align-items:end;flex-wrap:wrap}
.report-table td .status-badge{white-space:nowrap}
.status-badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.02em}
.badge-success{background:#dcfce7;color:#166534}
.badge-warning{background:#ffedd5;color:#9a3412}
.badge-info{background:#dbeafe;color:#1d4ed8}
.badge-danger{background:#fee2e2;color:#b91c1c}
.badge-neutral{background:#e5e7eb;color:#374151}
.dual-highlight-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.highlight-panel{padding:24px;border-radius:22px;color:#fff;box-shadow:0 14px 32px rgba(15,23,42,.10)}
.highlight-panel.success{background:linear-gradient(135deg,#047857,#10b981)}
.highlight-panel.danger{background:linear-gradient(135deg,#991b1b,#ef4444)}
.highlight-tag{display:inline-block;margin-bottom:10px;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.18);font-size:12px;font-weight:900}
.highlight-panel h3{margin:0 0 10px;font-size:22px;color:#fff}
.highlight-panel strong{display:block;font-size:28px;line-height:1.1;color:#fff}
.highlight-panel p,.highlight-panel small{color:rgba(255,255,255,.93)}
.print-header h2{margin:0 0 4px}
@media (max-width: 900px){.dual-highlight-grid{grid-template-columns:1fr}.report-hero{flex-direction:column;align-items:flex-start}}
@media print{.report-hero,.report-stat-card,.highlight-panel,.report-module-card{box-shadow:none !important}.report-stat-card,.highlight-panel{background:#fff !important;color:#111 !important;border:1px solid #999 !important}.report-stat-card strong,.report-stat-card span,.report-stat-card small,.highlight-panel h3,.highlight-panel strong,.highlight-panel p,.highlight-panel small,.highlight-tag{color:#111 !important;background:transparent !important}}


/* V41 INVENTARIO VACACIONES DISCIPLINA */
.panel-subsection {
    margin-top: 18px;
    padding: 16px;
    border: 1px solid #dbeafe;
    border-radius: 18px;
    background: #f8fbff;
}
.panel-subsection h2 {
    margin-top: 0;
}
.memo-document {
    max-width: 860px;
    margin: 0 auto;
    background: white;
    padding: 42px;
    border-radius: 8px;
    border: 1px solid #d1d5db;
    color: #111827;
}
.memo-head {
    text-align: center;
    border-bottom: 3px solid #0b5cad;
    padding-bottom: 16px;
    margin-bottom: 22px;
}
.memo-head h1 {
    margin: 0;
    color: #0b5cad;
    letter-spacing: .08em;
}
.memo-head h2 {
    margin: 6px 0;
}
.memo-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    padding: 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    margin-bottom: 18px;
}
.memo-document h3 {
    color: #0b5cad;
    margin-bottom: 4px;
}
.memo-signatures {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 60px;
    text-align: center;
}
.memo-signatures span {
    display: block;
    border-top: 1px solid #111827;
    margin-bottom: 8px;
}
@media print {
    .memo-document {
        border: none;
        padding: 0;
    }
    .memo-grid {
        background: white;
    }
}
@media (max-width: 900px) {
    .memo-grid,
    .memo-signatures {
        grid-template-columns: 1fr;
    }
}


/* V42 USUARIOS PERMISOS TECNICO LOGS */
.permission-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.permission-card{display:flex;align-items:center;gap:10px;padding:13px 14px;border:1px solid #dbeafe;border-radius:14px;background:#fff;font-weight:900;color:#0f172a;box-shadow:0 8px 18px rgba(15,23,42,.04)}
.permission-card input{width:18px;height:18px}
.row-warning{background:#fff7ed !important}
.row-warning td{color:#9a3412;font-weight:800}
.alert.warning{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa}


/* V43 PRACTICANTES EVALUACIONES */
.eval-badge{display:inline-flex;align-items:center;justify-content:center;min-width:58px;padding:7px 10px;border-radius:999px;font-weight:950;font-size:12px;text-transform:uppercase}
.eval-verde{background:#dcfce7;color:#166534;border:1px solid #86efac}
.eval-amarillo{background:#fef9c3;color:#854d0e;border:1px solid #fde68a}
.eval-rojo{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
.eval-gris{background:#e5e7eb;color:#374151;border:1px solid #cbd5e1}
.practice-eval-header,.practice-profile-head{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:18px;padding:18px;border:1px solid #dbeafe;border-radius:22px;background:linear-gradient(135deg,#fff,#f8fbff)}
.practice-eval-header h2,.practice-profile-head h1{margin:0;color:#0f172a}
.practice-eval-header p,.practice-profile-head p{margin:6px 0 0;color:#64748b;font-weight:700}
.vumetro{width:150px;height:150px;border-radius:999px;display:grid;place-items:center;text-align:center;position:relative;color:#fff;box-shadow:0 16px 34px rgba(15,23,42,.16);overflow:hidden;flex:0 0 auto}
.vumetro::before{content:"";position:absolute;inset:14px;border-radius:999px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.25)}
.vumetro span{position:relative;font-size:34px;font-weight:950;line-height:1;color:#fff}
.vumetro small{position:relative;display:block;font-size:12px;font-weight:950;letter-spacing:.08em;color:rgba(255,255,255,.94)}
.vumetro-verde{background:conic-gradient(#16a34a 0deg,#22c55e 300deg,#bbf7d0 300deg)}
.vumetro-amarillo{background:conic-gradient(#d97706 0deg,#facc15 245deg,#fef3c7 245deg)}
.vumetro-rojo{background:conic-gradient(#991b1b 0deg,#ef4444 180deg,#fecaca 180deg)}
.vumetro-gris{background:conic-gradient(#64748b 0deg,#94a3b8 120deg,#e2e8f0 120deg)}
.eval-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:18px 0}
.eval-item{padding:14px;border:1px solid #dbeafe;border-radius:16px;background:#fff;box-shadow:0 8px 20px rgba(15,23,42,.04)}
.eval-item label{display:flex;justify-content:space-between;gap:12px;font-size:13px;font-weight:950;color:#0f172a;margin-bottom:10px}
.eval-item input[type=range]{width:100%}
.practice-profile{background:white;border:1px solid #dbeafe;border-radius:24px;padding:24px;box-shadow:0 14px 32px rgba(15,23,42,.08)}
.practice-profile h3{color:#0b5cad;margin-bottom:4px}
@media(max-width:800px){.practice-eval-header,.practice-profile-head{flex-direction:column;align-items:flex-start}.vumetro{width:130px;height:130px}}
@media print{.practice-profile,.practice-eval-header,.practice-profile-head{box-shadow:none!important}.vumetro{box-shadow:none!important;color:#111!important;background:#fff!important;border:2px solid #111}.vumetro span,.vumetro small{color:#111!important}}


/* V44 LOGO REPORTES MEMORANDUM PROFESIONAL */
.global-print-branding {
    display: none;
}

.report-page-brand-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    margin-bottom: 14px;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid #dbeafe;
    box-shadow: 0 10px 26px rgba(15,23,42,.06);
}

.report-page-brand-header img {
    width: 58px;
    height: 58px;
    object-fit: contain;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    background: white;
}

.report-page-brand-header strong {
    display: block;
    color: #0b5cad;
    font-size: 18px;
    font-weight: 950;
    text-transform: uppercase;
}

.report-page-brand-header span {
    display: block;
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
}

/* Memorandum profesional */
.professional-memo {
    position: relative;
    max-width: 920px;
    min-height: 1050px;
    margin: 0 auto 30px;
    padding: 34px 40px 30px;
    background: #ffffff;
    color: #0f172a;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    box-shadow: 0 18px 45px rgba(15,23,42,.16);
    overflow: hidden;
}

.professional-memo .memo-watermark {
    display: none;
}

.professional-memo.memo-has-watermark .memo-watermark {
    display: block;
    position: absolute;
    inset: 0;
    background-image: var(--memo-watermark-image);
    background-repeat: no-repeat;
    background-position: center 47%;
    background-size: 430px auto;
    opacity: var(--memo-watermark-opacity, .07);
    pointer-events: none;
    z-index: 0;
}

.professional-memo > *:not(.memo-watermark) {
    position: relative;
    z-index: 1;
}

.memo-company-header {
    display: grid;
    grid-template-columns: 96px 1fr 210px;
    gap: 18px;
    align-items: center;
    padding-bottom: 18px;
    border-bottom: 4px solid #0b5cad;
}

.memo-logo-box {
    width: 88px;
    height: 88px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    border: 1px solid #dbeafe;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(15,23,42,.08);
}

.memo-logo-box img {
    width: 78px;
    height: 78px;
    object-fit: contain;
}

.memo-company-info h1 {
    margin: 0;
    color: #0b5cad;
    font-size: 26px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: .04em;
}

.memo-company-info p {
    margin: 6px 0 4px;
    color: #334155;
    font-size: 14px;
    font-weight: 800;
}

.memo-company-info small {
    color: #64748b;
    font-weight: 700;
}

.memo-doc-number {
    text-align: right;
    padding: 12px 14px;
    border-radius: 16px;
    background: #f8fbff;
    border: 1px solid #dbeafe;
}

.memo-doc-number span {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.memo-doc-number strong {
    display: block;
    color: #0b5cad;
    font-size: 16px;
    margin: 5px 0;
}

.memo-doc-number small {
    color: #475569;
    font-weight: 800;
}

.memo-title-block {
    text-align: center;
    margin: 22px 0 18px;
}

.memo-title-block h2 {
    margin: 0;
    color: #0f172a;
    font-size: 24px;
    font-weight: 950;
    letter-spacing: .03em;
}

.memo-title-block p {
    margin: 6px 0 0;
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
}

.memo-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0 20px;
}

.memo-info-grid div {
    padding: 12px;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: rgba(248,250,252,.92);
}

.memo-info-grid span {
    display: block;
    margin-bottom: 4px;
    color: #64748b;
    font-size: 10px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.memo-info-grid strong {
    color: #0f172a;
    font-size: 13px;
    font-weight: 950;
}

.memo-gravity {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
}

.memo-gravity-leve {
    background: #dcfce7;
    color: #166534 !important;
}

.memo-gravity-media {
    background: #fef3c7;
    color: #92400e !important;
}

.memo-gravity-grave {
    background: #fee2e2;
    color: #991b1b !important;
}

.memo-content {
    display: grid;
    gap: 12px;
}

.memo-section {
    padding: 14px 16px;
    border-left: 5px solid #0b5cad;
    border-radius: 14px;
    background: rgba(255,255,255,.88);
    border-top: 1px solid #e2e8f0;
    border-right: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

.memo-section h3 {
    margin: 0 0 8px;
    color: #0b5cad;
    font-size: 15px;
    font-weight: 950;
}

.memo-section p {
    margin: 0;
    color: #0f172a;
    line-height: 1.55;
}

.memo-acknowledgement {
    margin-top: 18px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px dashed #94a3b8;
    color: #334155;
    font-size: 12px;
    line-height: 1.45;
}

.memo-signature-area {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 70px;
}

.memo-sign-card {
    min-height: 120px;
    text-align: center;
    padding: 0 8px;
}

.signature-line {
    border-top: 2px solid #0f172a;
    margin-bottom: 10px;
}

.memo-sign-card strong {
    display: block;
    color: #0f172a;
    font-size: 13px;
    font-weight: 950;
}

.memo-sign-card span {
    display: block;
    min-height: 18px;
    margin-top: 5px;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
}

.memo-sign-card small {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}

.memo-footer {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 30px;
    padding-top: 10px;
    border-top: 1px solid #e2e8f0;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}

@media print {
    .global-print-branding {
        display: flex !important;
        align-items: center;
        gap: 12px;
        padding-bottom: 10px;
        margin-bottom: 12px;
        border-bottom: 2px solid #0b5cad;
        color: #0f172a;
    }

    .global-print-branding img {
        width: 56px;
        height: 56px;
        object-fit: contain;
    }

    .global-print-branding strong {
        display: block;
        color: #0b5cad;
        font-size: 18px;
        font-weight: 950;
        text-transform: uppercase;
    }

    .global-print-branding span {
        display: block;
        color: #475569;
        font-size: 11px;
    }

    .professional-memo {
        max-width: none;
        min-height: auto;
        margin: 0;
        padding: 0;
        border: none;
        box-shadow: none;
        border-radius: 0;
        page-break-inside: avoid;
    }

    .professional-memo ~ .global-print-branding,
    body:has(.professional-memo) .global-print-branding {
        display: none !important;
    }

    .memo-company-header {
        grid-template-columns: 80px 1fr 180px;
        gap: 12px;
    }

    .memo-logo-box {
        width: 74px;
        height: 74px;
    }

    .memo-logo-box img {
        width: 66px;
        height: 66px;
    }

    .memo-title-block {
        margin: 16px 0 12px;
    }

    .memo-info-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }

    .memo-info-grid div,
    .memo-section,
    .memo-acknowledgement {
        background: rgba(255,255,255,.85) !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .memo-signature-area {
        margin-top: 55px;
    }

    .report-page-brand-header {
        box-shadow: none;
        border: none;
        border-bottom: 2px solid #0b5cad;
        border-radius: 0;
        padding: 0 0 10px;
        margin-bottom: 14px;
    }
}

@media (max-width: 1000px) {
    .memo-company-header,
    .memo-info-grid,
    .memo-signature-area {
        grid-template-columns: 1fr;
    }

    .memo-doc-number {
        text-align: left;
    }
}


/* V45 FIX GLOBAL PRINT BRANDING */
body .global-print-branding {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}
@media print {
    body .global-print-branding {
        display: none !important;
    }
}


/* V45 MODULO VENTAS */
.kpi-ventas {
    background: linear-gradient(135deg, #0f766e, #14b8a6) !important;
}

.ventas-dashboard {
    display: grid;
    gap: 18px;
}

.ventas-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px;
}

.ventas-kpi {
    display: block;
    min-height: 128px;
    padding: 18px;
    border-radius: 22px;
    color: #fff !important;
    text-decoration: none !important;
    box-shadow: 0 14px 30px rgba(15,23,42,.14);
    position: relative;
    overflow: hidden;
}

.ventas-kpi::after {
    content: "";
    position: absolute;
    width: 100px;
    height: 100px;
    right: -28px;
    bottom: -34px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
}

.ventas-kpi span {
    display: block;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: rgba(255,255,255,.92);
}

.ventas-kpi strong {
    display: block;
    margin: 8px 0;
    font-size: 30px;
    line-height: 1.05;
    color: #fff;
    font-weight: 950;
}

.ventas-kpi small {
    display: block;
    color: rgba(255,255,255,.9);
    font-weight: 800;
}

.ventas-kpi.blue { background: linear-gradient(135deg, #0b5cad, #2563eb); }
.ventas-kpi.green { background: linear-gradient(135deg, #047857, #16a34a); }
.ventas-kpi.purple { background: linear-gradient(135deg, #6d28d9, #a855f7); }
.ventas-kpi.orange { background: linear-gradient(135deg, #c2410c, #f97316); }
.ventas-kpi.dark { background: linear-gradient(135deg, #0f172a, #334155); }

.venta-document {
    max-width: 860px;
    margin: 0 auto;
    background: #fff;
    border-radius: 22px;
    padding: 28px;
    border: 1px solid #dbeafe;
    box-shadow: 0 14px 32px rgba(15,23,42,.10);
}

.venta-doc-header {
    display: grid;
    grid-template-columns: 82px 1fr 190px;
    align-items: center;
    gap: 18px;
    padding-bottom: 16px;
    border-bottom: 3px solid #0b5cad;
    margin-bottom: 18px;
}

.venta-doc-header img {
    width: 76px;
    height: 76px;
    object-fit: contain;
    border-radius: 14px;
    border: 1px solid #dbeafe;
}

.venta-doc-header h1 {
    margin: 0;
    color: #0b5cad;
    font-size: 24px;
    font-weight: 950;
}

.venta-doc-header p {
    margin: 5px 0 0;
    color: #475569;
    font-weight: 800;
}

.venta-doc-number {
    text-align: right;
    background: #f8fbff;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    padding: 12px;
}

.venta-doc-number span {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.venta-doc-number strong {
    display: block;
    color: #0b5cad;
    font-size: 16px;
}

.venta-doc-number small {
    color: #475569;
    font-weight: 800;
}

@media print {
    .venta-document {
        box-shadow: none;
        border: none;
        padding: 0;
    }
}

@media (max-width: 900px) {
    .venta-doc-header {
        grid-template-columns: 1fr;
        text-align: left;
    }
    .venta-doc-number {
        text-align: left;
    }
}


/* V46 MEMORANDUM FIRMA LOGO CORREGIDO */
.memo-print-document {
    position: relative;
    max-width: 850px;
    min-height: 1030px;
    margin: 0 auto 28px;
    padding: 28px 34px;
    background: #ffffff;
    color: #111827;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .13);
    overflow: hidden;
}

.memo-print-document * {
    box-sizing: border-box;
}

.memo-print-watermark {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: var(--memo-watermark-image);
    background-repeat: no-repeat;
    background-position: center 54%;
    background-size: 360px auto;
    opacity: var(--memo-watermark-opacity, .06);
    pointer-events: none;
}

.memo-print-document > *:not(.memo-print-watermark) {
    position: relative;
    z-index: 1;
}

.memo-print-header {
    display: grid;
    grid-template-columns: 78px 1fr 190px;
    gap: 14px;
    align-items: center;
    border-bottom: 3px solid #0b5cad;
    padding-bottom: 13px;
    margin-bottom: 16px;
}

.memo-print-logo {
    width: 72px;
    height: 72px;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #ffffff;
    overflow: hidden;
}

.memo-print-logo img {
    width: 2cm !important;
    height: 2cm !important;
    max-width: 2cm !important;
    max-height: 2cm !important;
    object-fit: contain !important;
    display: block !important;
}

.memo-print-company h1 {
    margin: 0;
    color: #0b5cad;
    font-size: 24px;
    line-height: 1.05;
    font-weight: 950;
}

.memo-print-company p {
    margin: 5px 0 2px;
    color: #334155;
    font-size: 13px;
    font-weight: 800;
}

.memo-print-company small {
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}

.memo-print-number {
    text-align: right;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    padding: 10px;
    background: #f8fbff;
}

.memo-print-number span {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.memo-print-number strong {
    display: block;
    color: #0b5cad;
    font-size: 13px;
    margin: 4px 0;
    word-break: break-word;
}

.memo-print-number small {
    color: #475569;
    font-size: 11px;
    font-weight: 800;
}

.memo-print-title {
    text-align: center;
    margin: 14px 0 14px;
}

.memo-print-title h2 {
    margin: 0;
    font-size: 23px;
    color: #111827;
    font-weight: 950;
}

.memo-print-title p {
    margin: 5px 0 0;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
}

.memo-print-info-table {
    width: 100%;
    border-collapse: collapse;
    margin: 12px 0 16px;
    font-size: 12px;
}

.memo-print-info-table th {
    width: 17%;
    padding: 8px;
    text-align: left;
    color: #0b5cad;
    background: #eff6ff;
    border: 1px solid #dbeafe;
    font-weight: 950;
}

.memo-print-info-table td {
    width: 33%;
    padding: 8px;
    border: 1px solid #dbeafe;
    background: rgba(255,255,255,.86);
    font-weight: 800;
}

.memo-print-section {
    margin: 10px 0;
    padding: 10px 12px;
    border-left: 4px solid #0b5cad;
    border-radius: 8px;
    background: rgba(255,255,255,.88);
    border-top: 1px solid #e2e8f0;
    border-right: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

.memo-print-section h3 {
    margin: 0 0 5px;
    color: #0b5cad;
    font-size: 14px;
    font-weight: 950;
}

.memo-print-section p {
    margin: 0;
    color: #111827;
    line-height: 1.45;
    font-size: 13px;
}

.memo-print-received {
    margin-top: 13px;
    padding: 10px 12px;
    border: 1px dashed #94a3b8;
    border-radius: 8px;
    background: rgba(248,250,252,.88);
}

.memo-print-received p {
    margin: 0;
    font-size: 11.5px;
    line-height: 1.4;
    color: #334155;
}

.memo-print-signatures {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 68px;
}

.memo-print-signature-box {
    text-align: center;
    min-height: 92px;
    padding: 0 6px;
}

.memo-sign-line {
    width: 100%;
    border-top: 2px solid #111827;
    height: 1px;
    margin-bottom: 8px;
}

.memo-print-signature-box strong {
    display: block;
    color: #111827;
    font-size: 12px;
    font-weight: 950;
}

.memo-print-signature-box span {
    display: block;
    margin-top: 4px;
    color: #334155;
    font-size: 11px;
    font-weight: 800;
    min-height: 14px;
}

.memo-print-signature-box small {
    display: block;
    margin-top: 2px;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
}

.memo-print-footer {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 26px;
    padding-top: 8px;
    border-top: 1px solid #e2e8f0;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
}

@media print {
    @page {
        size: letter;
        margin: 12mm;
    }

    .memo-print-document {
        max-width: none !important;
        min-height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
        page-break-inside: avoid;
    }

    .memo-print-logo,
    .memo-print-logo img {
        width: 2cm !important;
        height: 2cm !important;
        max-width: 2cm !important;
        max-height: 2cm !important;
    }

    .memo-print-logo {
        border: 1px solid #d1d5db !important;
        overflow: hidden !important;
    }

    .memo-print-header {
        grid-template-columns: 2.2cm 1fr 4.8cm !important;
        gap: 10px !important;
        margin-bottom: 10px !important;
        padding-bottom: 9px !important;
    }

    .memo-print-company h1 {
        font-size: 19px !important;
    }

    .memo-print-company p {
        font-size: 11px !important;
    }

    .memo-print-title h2 {
        font-size: 18px !important;
    }

    .memo-print-title p {
        font-size: 10.5px !important;
    }

    .memo-print-info-table {
        font-size: 10.5px !important;
        margin: 8px 0 10px !important;
    }

    .memo-print-info-table th,
    .memo-print-info-table td {
        padding: 5px 6px !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .memo-print-section {
        padding: 7px 9px !important;
        margin: 7px 0 !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .memo-print-section h3 {
        font-size: 12px !important;
    }

    .memo-print-section p {
        font-size: 11px !important;
        line-height: 1.35 !important;
    }

    .memo-print-received {
        margin-top: 8px !important;
        padding: 7px 9px !important;
    }

    .memo-print-received p {
        font-size: 10px !important;
    }

    .memo-print-signatures {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 14px !important;
        margin-top: 55px !important;
        page-break-inside: avoid;
    }

    .memo-sign-line {
        border-top: 2px solid #000 !important;
    }

    .memo-print-signature-box strong {
        font-size: 10.5px !important;
    }

    .memo-print-signature-box span,
    .memo-print-signature-box small {
        font-size: 9.5px !important;
    }

    .memo-print-footer {
        font-size: 9px !important;
        margin-top: 18px !important;
    }

    .memo-print-watermark {
        background-size: 300px auto !important;
        opacity: var(--memo-watermark-opacity, .05) !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
}

@media (max-width: 900px) {
    .memo-print-header,
    .memo-print-info-table,
    .memo-print-signatures {
        display: block;
    }

    .memo-print-number {
        text-align: left;
        margin-top: 10px;
    }

    .memo-print-signature-box {
        margin-top: 44px;
    }
}


/* V47 VOUCHER DIAS PERIODO */
.voucher-table .voucher-period-total-row td {
    background: #eaf4ff !important;
    color: #0b3154 !important;
    border-top: 2px solid #0b5cad !important;
    border-bottom: 2px solid #0b5cad !important;
}
.voucher-table .voucher-period-total-row strong {
    font-weight: 950 !important;
}
@media print {
    .voucher-table .voucher-period-total-row td {
        background: #eaf4ff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

/* V49 DASHBOARD CIERRE MENSUAL + HISTORIAL ANUAL */
.monthly-closing-section {
    margin-top: 4px;
}

.monthly-window-badge {
    display: inline-flex;
    align-items: center;
    padding: 7px 11px;
    border-radius: 999px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #c2410c;
    font-size: 11px;
    font-weight: 900;
}

.monthly-closing-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.monthly-closing-strip .finance-card {
    min-height: 138px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 20px;
}

.monthly-closing-strip .finance-card span {
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.monthly-closing-strip .finance-card strong {
    margin: 8px 0;
    font-size: 29px;
}

.monthly-closing-strip .income-card {
    background: linear-gradient(135deg, #ecfdf5, #d1fae5);
    border-color: #a7f3d0;
}

.monthly-closing-strip .income-card strong {
    color: #047857;
}

.monthly-closing-strip .expense-card {
    background: linear-gradient(135deg, #fff7ed, #ffedd5);
    border-color: #fed7aa;
}

.monthly-closing-strip .expense-card strong {
    color: #c2410c;
}

.monthly-closing-strip .net-positive {
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
    border-color: #bfdbfe;
}

.monthly-closing-strip .net-positive strong {
    color: #1d4ed8;
}

.monthly-closing-strip .net-negative {
    background: linear-gradient(135deg, #fef2f2, #fee2e2);
    border-color: #fecaca;
}

.monthly-closing-strip .net-negative strong {
    color: #b91c1c;
}

.annual-finance-panel {
    margin-top: 18px;
    overflow: hidden;
}

.annual-finance-title {
    align-items: flex-end;
    gap: 20px;
}

.annual-finance-title h2 {
    margin-bottom: 3px;
}

.annual-finance-title small {
    color: #64748b;
    font-weight: 700;
}

.annual-year-filter {
    display: flex;
    align-items: center;
    gap: 8px;
}

.annual-year-filter label {
    margin: 0;
    font-size: 12px;
    font-weight: 900;
    color: #475569;
}

.annual-year-filter select {
    min-width: 108px;
    border-radius: 12px;
    padding: 8px 10px;
    border: 1px solid #cbd5e1;
    background: #fff;
    font-weight: 850;
}

.annual-finance-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 14px 0 16px;
}

.annual-finance-kpis > div {
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.annual-finance-kpis span {
    display: block;
    margin-bottom: 5px;
    color: #64748b;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.annual-finance-kpis strong {
    font-size: 23px;
    color: #0f172a;
}

.annual-finance-kpis .positive {
    background: #ecfdf5;
    border-color: #a7f3d0;
}

.annual-finance-kpis .positive strong {
    color: #047857;
}

.annual-finance-kpis .negative {
    background: #fef2f2;
    border-color: #fecaca;
}

.annual-finance-kpis .negative strong {
    color: #b91c1c;
}

.annual-finance-chart {
    height: 390px;
}

@media (max-width: 950px) {
    .monthly-closing-strip,
    .annual-finance-kpis {
        grid-template-columns: 1fr;
    }

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

    .annual-finance-chart {
        height: 320px;
    }
}

@media print {
    .monthly-window-badge,
    .annual-year-filter {
        display: none !important;
    }
}

/* V50 FINANZAS REALES - no mezclar pendientes con flujo ejecutado */
.monthly-closing-strip {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.receivable-card {
    border-color: #bfdbfe !important;
    background: linear-gradient(135deg, #eff6ff, #ffffff) !important;
}
.receivable-card strong { color: #1d4ed8 !important; }
.commitment-card {
    border-color: #fde68a !important;
    background: linear-gradient(135deg, #fffbeb, #ffffff) !important;
}
.commitment-card strong { color: #b45309 !important; }
.annual-finance-kpis-v50 {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}
.annual-finance-kpis-v50 > div small {
    display: block;
    margin-top: 4px;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}
.annual-finance-kpis-v50 .pending strong { color: #2563eb; }
.annual-finance-kpis-v50 .commitment strong { color: #b45309; }
.finance-data-warning {
    margin: 12px 0 16px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid #fde68a;
    background: #fffbeb;
    color: #92400e;
    font-size: 12px;
    line-height: 1.45;
}
.finance-data-warning strong { display: block; margin-bottom: 3px; }

/* V51 ALMACEN INSTALACIONES */
.warehouse-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:18px}.warehouse-kpi{padding:18px;border-radius:20px;color:#fff;box-shadow:0 14px 28px #0f172a1f;min-height:105px}.warehouse-kpi span{display:block;font-size:12px;font-weight:900;text-transform:uppercase}.warehouse-kpi strong{display:block;font-size:28px;margin:8px 0}.warehouse-kpi small{opacity:.9;font-weight:700}.warehouse-kpi.blue{background:linear-gradient(135deg,#1d4ed8,#3b82f6)}.warehouse-kpi.green{background:linear-gradient(135deg,#047857,#22c55e)}.warehouse-kpi.purple{background:linear-gradient(135deg,#6d28d9,#a855f7)}.warehouse-kpi.orange{background:linear-gradient(135deg,#c2410c,#f97316)}.warehouse-kpi.red{background:linear-gradient(135deg,#b91c1c,#ef4444)}.warehouse-kpi.teal{background:linear-gradient(135deg,#0f766e,#14b8a6)}.warehouse-menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:15px}.warehouse-menu-grid a{display:block;padding:20px;border-radius:18px;background:#fff;border:1px solid #dbeafe;text-decoration:none;box-shadow:0 10px 25px #0f172a0f;transition:.18s}.warehouse-menu-grid a:hover{transform:translateY(-2px);box-shadow:0 16px 34px #0f172a1a}.warehouse-menu-grid b{display:block;color:#0b5cad;font-size:17px;margin-bottom:7px}.warehouse-menu-grid span{color:#64748b;font-weight:650;line-height:1.4}


/* =========================================================
   V52 PREMIUM ALMACEN INSTALACIONES
   ========================================================= */
.warehouse-premium-page,
.install-premium-page {
    display: grid;
    gap: 18px;
}

.warehouse-hero,
.install-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 24px 26px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 88% 20%, rgba(255,255,255,.20), transparent 28%),
        linear-gradient(135deg, #0b5cad 0%, #0f766e 100%);
    color: #fff;
    box-shadow: 0 18px 40px rgba(15, 23, 42, .16);
}

.install-hero {
    background:
        radial-gradient(circle at 90% 22%, rgba(255,255,255,.20), transparent 28%),
        linear-gradient(135deg, #6d28d9 0%, #2563eb 100%);
}

.warehouse-eyebrow,
.install-eyebrow,
.warehouse-card-kicker {
    display: block;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.warehouse-eyebrow,
.install-eyebrow {
    color: rgba(255,255,255,.86);
    margin-bottom: 7px;
}

.warehouse-hero h1,
.install-hero h1 {
    margin: 0;
    font-size: clamp(28px, 4vw, 42px);
    line-height: 1.05;
    font-weight: 950;
}

.warehouse-hero p,
.install-hero p {
    margin: 8px 0 0;
    color: rgba(255,255,255,.90);
    font-weight: 700;
    max-width: 760px;
}

.warehouse-hero-actions,
.install-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    justify-content: flex-end;
}

.warehouse-hero .btn.secondary,
.install-hero .btn.secondary {
    background: rgba(255,255,255,.14);
    color: #fff;
    border: 1px solid rgba(255,255,255,.30);
}

.warehouse-kpis.premium-six,
.install-kpis {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.warehouse-kpi {
    text-decoration: none !important;
}

.warehouse-dashboard-grid,
.install-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.warehouse-chart-card {
    min-height: 420px;
}

.warehouse-chart-wrap {
    height: 320px;
    position: relative;
}

.warehouse-card-kicker {
    color: #0b5cad;
    margin-bottom: 5px;
}

.warehouse-card-kicker.danger {
    color: #b91c1c;
}

.compact-table th,
.compact-table td {
    padding-top: 10px;
    padding-bottom: 10px;
}

.stock-critical-pill {
    display: inline-block;
    padding: 5px 9px;
    border-radius: 999px;
    background: #fee2e2;
    color: #991b1b;
    font-weight: 950;
}

.empty-premium {
    padding: 20px;
    text-align: center;
    border-radius: 14px;
    background: #f8fafc;
    color: #64748b;
    font-weight: 800;
}

.warehouse-timeline {
    display: grid;
    gap: 12px;
}

.warehouse-timeline-item {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 12px;
    align-items: start;
    padding: 12px;
    border-radius: 14px;
    background: #f8fbff;
    border: 1px solid #dbeafe;
}

.warehouse-timeline-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: linear-gradient(135deg, #0b5cad, #14b8a6);
    color: #fff;
    font-size: 20px;
    font-weight: 950;
}

.warehouse-timeline-item strong,
.warehouse-timeline-item span,
.warehouse-timeline-item small {
    display: block;
}

.warehouse-timeline-item span {
    margin-top: 3px;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    text-transform: capitalize;
}

.warehouse-timeline-item small {
    margin-top: 3px;
    color: #64748b;
}

.warehouse-shortcuts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 14px;
}

.warehouse-shortcuts a {
    display: grid;
    gap: 5px;
    padding: 18px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid #dbeafe;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(15,23,42,.07);
    transition: transform .18s ease, box-shadow .18s ease;
}

.warehouse-shortcuts a:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(15,23,42,.12);
}

.warehouse-shortcuts span {
    font-size: 26px;
}

.warehouse-shortcuts b {
    color: #0b5cad;
    font-size: 15px;
}

.warehouse-shortcuts small {
    color: #64748b;
    font-weight: 700;
}

.install-order-list {
    display: grid;
    gap: 10px;
}

.install-order-item {
    display: grid;
    grid-template-columns: 62px 1fr auto;
    gap: 13px;
    align-items: center;
    padding: 12px;
    border-radius: 15px;
    background: #f8fbff;
    border: 1px solid #dbeafe;
    text-decoration: none;
    color: inherit;
}

.install-order-item:hover {
    border-color: #93c5fd;
    box-shadow: 0 10px 20px rgba(15,23,42,.07);
}

.install-order-date {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    align-content: center;
    border-radius: 14px;
    background: linear-gradient(135deg, #6d28d9, #2563eb);
    color: #fff;
}

.install-order-date strong {
    font-size: 21px;
    line-height: 1;
}

.install-order-date span {
    font-size: 9px;
    font-weight: 950;
    margin-top: 3px;
}

.install-order-item b,
.install-order-item span,
.install-order-item small {
    display: block;
}

.install-order-item span {
    margin-top: 3px;
    color: #334155;
    font-weight: 800;
    font-size: 12px;
}

.install-order-item small {
    margin-top: 3px;
    color: #64748b;
}

.install-status-pill {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 950;
    text-transform: uppercase;
    white-space: nowrap;
}

.state-borrador { background: #e2e8f0; color: #334155; }
.state-asignada { background: #dbeafe; color: #1d4ed8; }
.state-en_proceso { background: #fef3c7; color: #92400e; }
.state-firmada { background: #ede9fe; color: #6d28d9; }
.state-cerrada { background: #dcfce7; color: #166534; }
.state-cancelada { background: #fee2e2; color: #991b1b; }

.table-scroll {
    overflow-x: auto;
}

@media (max-width: 1000px) {
    .warehouse-dashboard-grid,
    .install-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .warehouse-hero,
    .install-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .warehouse-hero-actions,
    .install-hero-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 700px) {
    .install-order-item {
        grid-template-columns: 54px 1fr;
    }

    .install-order-item .install-status-pill {
        grid-column: 2;
        justify-self: start;
    }
}