/* ============================================================
   CAJACLOUD
   Sistema visual global
   ============================================================ */


/* ============================================================
   1. DESIGN TOKENS
   ============================================================ */

:root {
    /* Marca */
    --cc-primary: #714b67;
    --cc-primary-hover: #604059;
    --cc-primary-active: #52364b;
    --cc-primary-soft: #f3edf1;
    --cc-primary-soft-hover: #ebe1e8;
    /* Superficies */
    --cc-background: #f6f6f8;
    --cc-surface: #ffffff;
    --cc-surface-soft: #fafafa;
    /* Texto */
    --cc-text: #2d2d32;
    --cc-text-secondary: #686970;
    --cc-text-muted: #8b8c92;
    --cc-text-on-primary: #ffffff;
    /* Bordes */
    --cc-border: #dedee3;
    --cc-border-soft: #eaeaed;
    --cc-border-strong: #c9c9cf;
    /* Estados */
    --cc-success: #27845a;
    --cc-warning: #b97818;
    --cc-danger: #c53d3d;
    --cc-info: #3575a8;
    /* Layout */
    --cc-topbar-height: 52px;
    --cc-sidebar-width: 218px;
    /* Espaciado */
    --cc-space-1: 4px;
    --cc-space-2: 8px;
    --cc-space-3: 12px;
    --cc-space-4: 16px;
    --cc-space-5: 20px;
    --cc-space-6: 24px;
    --cc-space-8: 32px;
    /* Bordes */
    --cc-radius-sm: 5px;
    --cc-radius-md: 7px;
    --cc-radius-lg: 10px;
    /* Sombras */
    --cc-shadow-sm: 0 1px 2px rgba(24, 24, 28, 0.05);
    --cc-shadow-md: 0 3px 12px rgba(24, 24, 28, 0.07);
    /* Tipografía */
    --cc-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    /* Transiciones */
    --cc-transition-fast: 140ms ease;
}


/* ============================================================
   2. BASE
   ============================================================ */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    min-height: 100%;
    margin: 0;
}

html {
    font-size: 14px;
}

body {
    min-height: 100vh;
    margin: 0;
    font-family: var(--cc-font);
    color: var(--cc-text);
    background: var(--cc-background);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
textarea,
select {
    font: inherit;
}


/* ============================================================
   3. APP SHELL
   ============================================================ */

.cc-app-shell {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
}


/* ============================================================
   4. TOPBAR
   ============================================================ */

.cc-topbar {
    position: sticky;
    top: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--cc-topbar-height);
    min-height: var(--cc-topbar-height);
    padding: 0 var(--cc-space-4);
    color: var(--cc-text-on-primary);
    background: var(--cc-primary);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.cc-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: var(--cc-text-on-primary);
    transition: opacity var(--cc-transition-fast);
}

    .cc-brand:hover {
        color: var(--cc-text-on-primary);
        opacity: 0.94;
    }

.cc-brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 7px;
    font-size: 16px;
    font-weight: 700;
    background: rgba(255, 255, 255, 0.15);
}

.cc-brand-content {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.05;
}

.cc-brand-name {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.1px;
}

.cc-brand-subtitle {
    margin-top: 3px;
    font-size: 10px;
    font-weight: 400;
    opacity: 0.72;
}

.cc-topbar-end {
    display: flex;
    align-items: center;
    gap: var(--cc-space-2);
}


/* ============================================================
   5. APP BODY
   ============================================================ */

.cc-app-body {
    display: flex;
    flex: 1 1 auto;
    min-height: calc(100vh - var(--cc-topbar-height));
}


/* ============================================================
   6. SIDEBAR
   ============================================================ */

.cc-sidebar {
    position: sticky;
    top: var(--cc-topbar-height);
    width: var(--cc-sidebar-width);
    min-width: var(--cc-sidebar-width);
    height: calc(100vh - var(--cc-topbar-height));
    overflow-y: auto;
    background: var(--cc-surface);
    border-right: 1px solid var(--cc-border);
    scrollbar-width: thin;
}


/* ============================================================
   7. NAVIGATION
   ============================================================ */

.cc-nav.cc-menu {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 10px 8px 18px;
}


/* Inicio */

.cc-menu-home {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 36px;
    padding: 0 10px;
    margin-bottom: 6px;
    color: var(--cc-text-secondary);
    border-radius: var(--cc-radius-sm);
    font-size: 13px;
    font-weight: 500;
    transition: color var(--cc-transition-fast), background-color var(--cc-transition-fast);
}

    .cc-menu-home:hover {
        color: var(--cc-primary);
        background: var(--cc-surface-soft);
    }

    .cc-menu-home.active {
        color: var(--cc-primary);
        background: var(--cc-primary-soft);
        font-weight: 600;
    }

        .cc-menu-home.active::before {
            content: "";
            position: absolute;
            left: 0;
            top: 8px;
            bottom: 8px;
            width: 3px;
            border-radius: 0 3px 3px 0;
            background: var(--cc-primary);
        }


/* Módulos */

.cc-menu-group {
    display: flex;
    flex-direction: column;
}

.cc-menu-module {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 36px;
    padding: 0 10px;
    color: var(--cc-text-secondary);
    background: transparent;
    border: 0;
    border-radius: var(--cc-radius-sm);
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    text-align: left;
    cursor: pointer;
    transition: color var(--cc-transition-fast), background-color var(--cc-transition-fast);
}

    .cc-menu-module:hover {
        color: var(--cc-primary);
        background: var(--cc-surface-soft);
    }

    .cc-menu-module.is-open {
        color: var(--cc-primary);
    }

    .cc-menu-module.is-current {
        color: var(--cc-primary);
        background: var(--cc-primary-soft);
        font-weight: 600;
    }

        .cc-menu-module.is-current::before {
            content: "";
            position: absolute;
            left: 0;
            top: 8px;
            bottom: 8px;
            width: 3px;
            border-radius: 0 3px 3px 0;
            background: var(--cc-primary);
        }


/* Icono, texto y flecha */

.cc-menu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 21px;
    min-width: 21px;
    color: var(--cc-text-muted);
}

    .cc-menu-icon .rz-icon {
        font-size: 17px;
    }

.cc-menu-home:hover .cc-menu-icon,
.cc-menu-home.active .cc-menu-icon,
.cc-menu-module:hover .cc-menu-icon,
.cc-menu-module.is-open .cc-menu-icon,
.cc-menu-module.is-current .cc-menu-icon {
    color: var(--cc-primary);
}

.cc-menu-label {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.cc-menu-chevron {
    margin-left: auto;
    color: var(--cc-text-muted);
    font-size: 16px !important;
    transition: color var(--cc-transition-fast);
}

.cc-menu-module:hover .cc-menu-chevron,
.cc-menu-module.is-open .cc-menu-chevron,
.cc-menu-module.is-current .cc-menu-chevron {
    color: var(--cc-primary);
}


/* Submenú */

.cc-menu-children {
    position: relative;
    display: flex;
    flex-direction: column;
    margin: 1px 0 4px 31px;
    padding: 2px 0 3px 11px;
}

    .cc-menu-children::before {
        content: "";
        position: absolute;
        left: 0;
        top: 3px;
        bottom: 3px;
        width: 1px;
        background: var(--cc-border-soft);
    }

.cc-menu-child {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 30px;
    padding: 0 8px;
    color: var(--cc-text-secondary);
    border-radius: var(--cc-radius-sm);
    font-size: 12.5px;
    font-weight: 400;
    transition: color var(--cc-transition-fast), background-color var(--cc-transition-fast);
}

    .cc-menu-child:hover {
        color: var(--cc-primary);
        background: var(--cc-surface-soft);
    }

    .cc-menu-child.active {
        color: var(--cc-primary);
        font-weight: 600;
    }

        .cc-menu-child.active::before {
            content: "";
            position: absolute;
            left: -12px;
            width: 3px;
            height: 16px;
            border-radius: 3px;
            background: var(--cc-primary);
        }


/* ============================================================
   8. MAIN WORKSPACE
   ============================================================ */

.cc-main {
    flex: 1 1 auto;
    min-width: 0;
    background: var(--cc-background);
}

.cc-content {
    width: 100%;
    padding: var(--cc-space-6);
}


/* ============================================================
   9. PAGE STRUCTURE
   ============================================================ */

.cc-page {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
}

.cc-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--cc-space-4);
    margin-bottom: var(--cc-space-5);
}

.cc-page-heading {
    min-width: 0;
}

.cc-page-title {
    margin: 0;
    color: var(--cc-text);
    font-size: 24px;
    font-weight: 550;
    line-height: 1.2;
    letter-spacing: -0.35px;
}

.cc-page-subtitle {
    margin: 5px 0 0;
    color: var(--cc-text-secondary);
    font-size: 13.5px;
    line-height: 1.45;
}

.cc-page-actions {
    display: flex;
    align-items: center;
    gap: var(--cc-space-2);
    flex-wrap: wrap;
}


/* ============================================================
   10. TOOLBARS
   ============================================================ */

.cc-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-space-3);
    min-height: 46px;
    margin-bottom: var(--cc-space-3);
}

.cc-toolbar-start,
.cc-toolbar-end {
    display: flex;
    align-items: center;
    gap: var(--cc-space-2);
}


/* ============================================================
   11. SURFACES / PANELS
   ============================================================ */

.cc-card,
.cc-surface {
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
    box-shadow: var(--cc-shadow-sm);
}

.cc-card {
    padding: var(--cc-space-5);
}

.cc-section {
    padding: var(--cc-space-5);
}

    .cc-section + .cc-section {
        border-top: 1px solid var(--cc-border-soft);
    }

.cc-section-title {
    margin: 0 0 var(--cc-space-4);
    color: var(--cc-text);
    font-size: 15px;
    font-weight: 600;
}


/* ============================================================
   12. TYPOGRAPHY HELPERS
   ============================================================ */

.cc-muted {
    color: var(--cc-text-muted);
}

.cc-text-secondary {
    color: var(--cc-text-secondary);
}

.cc-record-link {
    display: inline-flex;
    align-items: center;
    width: max-content;
    padding: 0;
    color: var(--cc-primary);
    background: transparent;
    border: 0;
    font: inherit;
    font-weight: 600;
    line-height: 1.35;
    text-decoration: none;
    cursor: pointer;
}

    .cc-record-link:hover {
        color: var(--cc-primary-hover);
        text-decoration: underline;
    }

    .cc-record-link:focus-visible {
        outline: 2px solid var(--cc-primary);
        outline-offset: 2px;
        border-radius: 2px;
    }


/* ============================================================
   13. STATUS
   ============================================================ */

.cc-status {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 550;
}

.cc-status-success {
    color: var(--cc-success);
    background: rgba(39, 132, 90, 0.10);
}

.cc-status-warning {
    color: var(--cc-warning);
    background: rgba(185, 120, 24, 0.11);
}

.cc-status-danger {
    color: var(--cc-danger);
    background: rgba(197, 61, 61, 0.10);
}

.cc-status-info {
    color: var(--cc-info);
    background: rgba(53, 117, 168, 0.10);
}

.cc-status-neutral {
    color: var(--cc-text-secondary);
    background: var(--cc-surface-soft);
}


/* ============================================================
   14. RADZEN - GLOBAL INTEGRATION
   ============================================================ */

/*
   Radzen sigue controlando el comportamiento de sus componentes.
   Aquí únicamente alineamos la apariencia con CajaCloud.
*/

.rz-button {
    min-height: 34px;
    border-radius: var(--cc-radius-sm);
    font-family: var(--cc-font);
    font-size: 13px;
    font-weight: 550;
    text-transform: none;
    box-shadow: none;
    transition: background-color var(--cc-transition-fast), border-color var(--cc-transition-fast), color var(--cc-transition-fast), box-shadow var(--cc-transition-fast);
}

    .rz-button.rz-primary {
        background-color: var(--cc-primary);
    }

        .rz-button.rz-primary:hover {
            background-color: var(--cc-primary-hover);
        }

        .rz-button.rz-primary:active {
            background-color: var(--cc-primary-active);
        }

.rz-inputtext,
.rz-textarea,
.rz-dropdown,
.rz-numeric,
.rz-datepicker {
    border-radius: var(--cc-radius-sm);
}


/* ============================================================
   15. VALIDATION
   ============================================================ */

.valid.modified:not([type="checkbox"]) {
    outline: 1px solid var(--cc-success);
}

.invalid {
    outline: 1px solid var(--cc-danger);
}

.validation-message {
    margin-top: var(--cc-space-1);
    color: var(--cc-danger);
    font-size: 12px;
}


/* ============================================================
   16. BLAZOR ERROR UI
   ============================================================ */

#blazor-error-ui {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 10000;
    display: none;
    align-items: center;
    gap: 12px;
    max-width: 520px;
    padding: 12px 14px;
    color: #ffffff;
    background: #9f3030;
    border-radius: var(--cc-radius-md);
    box-shadow: var(--cc-shadow-md);
    font-size: 13px;
}

    #blazor-error-ui .reload {
        color: #ffffff;
        font-weight: 600;
        text-decoration: underline;
    }

    #blazor-error-ui .dismiss {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 24px;
        padding: 0;
        color: #ffffff;
        background: transparent;
        border: 0;
        cursor: pointer;
        font-size: 20px;
    }


/* ============================================================
   17. ERROR BOUNDARY
   ============================================================ */

.blazor-error-boundary {
    padding: 14px 16px;
    color: #ffffff;
    background: var(--cc-danger);
    border-radius: var(--cc-radius-md);
}


/* ============================================================
   18. RESPONSIVE
   ============================================================ */

@media (max-width: 900px) {

    :root {
        --cc-sidebar-width: 190px;
    }

    .cc-content {
        padding: var(--cc-space-4);
    }
}

@media (max-width: 700px) {

    .cc-sidebar {
        display: none;
    }

    .cc-brand-subtitle {
        display: none;
    }

    .cc-content {
        padding: var(--cc-space-3);
    }

    .cc-page-header {
        flex-direction: column;
    }
}
/* ============================================================
   AUTHENTICATION
   ============================================================ */

.cc-auth-shell {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px;
    background: var(--cc-background);
}

.cc-auth-content {
    width: 100%;
}

.cc-login {
    width: 100%;
    max-width: 390px;
    margin: 0 auto;
}

.cc-login-brand {
    margin-bottom: 24px;
    text-align: center;
}

.cc-login-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin: 0 auto 12px;
    color: #fff;
    background: var(--cc-primary);
    border-radius: 10px;
    font-size: 22px;
    font-weight: 700;
}

.cc-login-brand h1 {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
}

.cc-login-brand p {
    margin: 5px 0 0;
    color: var(--cc-text-secondary);
    font-size: 13px;
}

.cc-login-card {
    padding: 28px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-lg);
    box-shadow: var(--cc-shadow-md);
}

    .cc-login-card h2 {
        margin: 0 0 22px;
        font-size: 18px;
        font-weight: 600;
    }

.cc-auth-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cc-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .cc-field label {
        font-size: 13px;
        font-weight: 500;
    }

    .cc-field input {
        width: 100%;
        height: 38px;
        padding: 0 11px;
        color: var(--cc-text);
        background: #fff;
        border: 1px solid var(--cc-border-strong);
        border-radius: var(--cc-radius-sm);
        outline: none;
    }

        .cc-field input:focus {
            border-color: var(--cc-primary);
            box-shadow: 0 0 0 2px var(--cc-primary-soft);
        }

.cc-check {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--cc-text-secondary);
    font-size: 13px;
}

.cc-login-button {
    height: 38px;
    color: #fff;
    background: var(--cc-primary);
    border: 0;
    border-radius: var(--cc-radius-sm);
    font-weight: 600;
    cursor: pointer;
}

    .cc-login-button:hover {
        background: var(--cc-primary-hover);
    }

.cc-login-error {
    margin-bottom: 16px;
    padding: 10px 12px;
    color: var(--cc-danger);
    background: rgba(197, 61, 61, .08);
    border-radius: var(--cc-radius-sm);
    font-size: 13px;
}

.cc-topbar-end form {
    margin: 0;
}

.cc-user-name {
    font-size: 13px;
    opacity: .9;
}

.cc-user-action {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    color: #fff;
    background: transparent;
    border: 0;
    border-radius: var(--cc-radius-sm);
    cursor: pointer;
}

    .cc-user-action:hover {
        background: rgba(255,255,255,.12);
    }

/* ============================================================
   19. DIALOGS & SHARED FORMS
   ============================================================ */

.cc-dialog-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.cc-dialog-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 10px;
    margin-top: 2px;
}

.cc-form-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
}

@media (max-width: 650px) {
    .cc-form-grid-2 {
        grid-template-columns: 1fr;
    }
}


/* ============================================================
   20. HIERARCHY & ROW ACTIONS
   ============================================================ */

/* Selector Lista / Árbol */

.cc-view-switch {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 2px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
}

    .cc-view-switch .rz-button {
        min-height: 30px;
    }


/* Acciones Grid / Árbol */

.cc-row-actions,
.cc-tree-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 3px;
}

.cc-icon-action.rz-button {
    width: 30px;
    height: 30px;
    min-height: 30px;
    padding: 0;
    color: var(--cc-text-secondary);
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--cc-radius-sm);
}

    .cc-icon-action.rz-button:hover {
        color: var(--cc-primary);
        background: var(--cc-primary-soft);
        border-color: var(--cc-border);
    }

.cc-icon-action .rzi {
    font-size: 17px;
}


/* Vista Árbol */

.cc-hierarchy-tree {
    width: 100%;
    padding: 10px 12px;
}

    .cc-hierarchy-tree .rz-tree,
    .cc-hierarchy-tree .rz-treenode,
    .cc-hierarchy-tree .rz-treenode-content,
    .cc-hierarchy-tree .rz-treenode-label {
        width: 100%;
    }

    .cc-hierarchy-tree .rz-treenode-content {
        display: flex;
        align-items: center;
    }

    .cc-hierarchy-tree .rz-treenode-label {
        flex: 1;
        min-width: 0;
    }

.cc-hierarchy-view {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.cc-hierarchy-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    min-height: 44px;
    padding: 6px 10px;
    border-bottom: 1px solid var(--cc-border);
}

.cc-hierarchy-toolbar-actions,
.cc-hierarchy-levels {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cc-hierarchy-toolbar-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    padding: 4px 9px;
    color: var(--cc-text-secondary);
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: 6px;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

    .cc-hierarchy-toolbar-button:hover {
        color: var(--cc-primary);
        border-color: var(--cc-primary);
    }

    .cc-hierarchy-toolbar-button .rz-icon {
        font-size: 17px;
    }

.cc-hierarchy-level-label {
    margin-right: 2px;
    color: var(--cc-text-secondary);
    font-size: 12px;
    font-weight: 500;
}

.cc-hierarchy-level-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    color: var(--cc-text-secondary);
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: 6px;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

    .cc-hierarchy-level-button:hover {
        color: var(--cc-primary);
        border-color: var(--cc-primary);
    }

    .cc-hierarchy-level-button.is-active {
        color: var(--cc-primary);
        border-color: var(--cc-primary);
        box-shadow: inset 0 0 0 1px var(--cc-primary);
    }

@media (max-width: 650px) {
    .cc-hierarchy-toolbar {
        justify-content: flex-start;
    }
}

.cc-tree-node {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
    gap: 16px;
    padding: 3px 4px;
}

.cc-tree-node-main {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
}

.cc-tree-code {
    flex: 0 0 82px;
    width: 82px;
    color: var(--cc-text-muted);
    font-size: 12px;
    font-variant-numeric: tabular-nums;
}

.cc-tree-name {
    min-width: 180px;
    color: var(--cc-text);
    font-size: 13.5px;
    font-weight: 500;
}

.cc-tree-node-end {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    margin-left: auto;
}

.cc-tree-actions {
    margin-left: 0;
    padding-left: 0;
}

.cc-empty-state {
    padding: 32px;
    color: var(--cc-text-muted);
    text-align: center;
}


/* Campo jerárquico */

.cc-field-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cc-field-label {
    color: var(--cc-text);
    font-size: 13px;
    font-weight: 500;
}


/* Campo jerárquico alineado con RadzenFormField */

.cc-hierarchy-form-field {
    position: relative;
    width: 100%;
    padding-top: 7px;
}

.cc-hierarchy-form-label {
    position: absolute;
    top: 0;
    left: 12px;
    z-index: 1301;
    padding: 0 4px;
    color: var(--cc-text-secondary);
    background: var(--cc-surface);
    font-size: 11px;
    line-height: 14px;
    pointer-events: none;
}


/* Selector jerárquico */

.cc-hierarchy-selector {
    position: relative;
    width: 100%;
}

.cc-hierarchy-selector-open {
    z-index: 1300;
}

.cc-hierarchy-selector-trigger {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 38px;
    padding: 0 10px 0 12px;
    color: var(--cc-text);
    background: var(--cc-surface);
    border: 1px solid var(--cc-border-strong);
    border-radius: var(--cc-radius-sm);
    cursor: pointer;
    text-align: left;
}

    .cc-hierarchy-selector-trigger:hover {
        border-color: var(--cc-primary);
    }

.cc-hierarchy-selector-open .cc-hierarchy-selector-trigger {
    border-color: var(--cc-primary);
    box-shadow: 0 0 0 1px var(--cc-primary);
}

.cc-hierarchy-form-field:has(.cc-hierarchy-selector-open)
.cc-hierarchy-form-label {
    color: var(--cc-primary);
}

.cc-hierarchy-selector-panel {
    width: 100%;
    max-height: min(285px, 38vh);
    overflow-y: auto;
    margin-top: 6px;
    padding: 8px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
    box-shadow: var(--cc-shadow-sm);
}

/*
   Solo se vuelve flotante cuando el componente
   recibe Flotante="true".
*/
.cc-hierarchy-selector-panel-floating {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 3;
}

/*
   Capa transparente utilizada únicamente por el
   selector flotante para detectar clic fuera.
*/
.cc-hierarchy-selector-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    cursor: default;
}

.cc-hierarchy-selector-toolbar {
    padding: 2px 2px 8px;
}

.cc-hierarchy-root-option {
    margin-bottom: 5px;
}

.cc-selector-tree {
    width: 100%;
}


/* Opciones */

.cc-hierarchy-option,
.cc-hierarchy-tree-option {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    color: var(--cc-text);
    background: transparent;
    border: 0;
    border-radius: var(--cc-radius-sm);
    cursor: pointer;
    text-align: left;
}

.cc-hierarchy-option {
    padding: 8px 9px;
    color: var(--cc-text-secondary);
}

.cc-hierarchy-tree-option {
    padding: 6px 8px;
}

    .cc-hierarchy-option:hover,
    .cc-hierarchy-option.selected,
    .cc-hierarchy-tree-option:hover,
    .cc-hierarchy-tree-option.selected {
        color: var(--cc-primary);
        background: var(--cc-primary-soft);
    }

.cc-hierarchy-option-code {
    min-width: 74px;
    color: var(--cc-text-muted);
    font-size: 11.5px;
    font-variant-numeric: tabular-nums;
}

.cc-hierarchy-option-name {
    font-size: 13px;
}


/* Búsqueda */

.cc-hierarchy-search {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    height: 36px;
    padding: 0 9px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border-strong);
    border-radius: var(--cc-radius-sm);
}

    .cc-hierarchy-search:focus-within {
        border-color: var(--cc-primary);
        box-shadow: 0 0 0 2px var(--cc-primary-soft);
    }

    .cc-hierarchy-search > .rzi {
        color: var(--cc-text-muted);
        font-size: 17px;
    }

    .cc-hierarchy-search input {
        flex: 1;
        min-width: 0;
        height: 100%;
        padding: 0;
        color: var(--cc-text);
        background: transparent;
        border: 0;
        outline: 0;
        font-size: 13px;
    }

        .cc-hierarchy-search input::placeholder {
            color: var(--cc-text-muted);
        }

.cc-hierarchy-search-clear {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    color: var(--cc-text-muted);
    background: transparent;
    border: 0;
    border-radius: var(--cc-radius-sm);
    cursor: pointer;
}

    .cc-hierarchy-search-clear:hover {
        color: var(--cc-primary);
        background: var(--cc-primary-soft);
    }


/* ============================================================
   21. RECORD / DETAIL PAGES
   ============================================================ */

.cc-record-layout {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 100%;
    max-width: 1180px;
}

.cc-record-card {
    width: 100%;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
    overflow: hidden;
}

/*
   Solo para tarjetas que contienen dropdowns flotantes.
*/
.cc-record-card-overflow-visible {
    position: relative;
    z-index: 10;
    overflow: visible;
}

.cc-record-section-header {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 0 20px;
    border-bottom: 1px solid var(--cc-border-soft);
}

    .cc-record-section-header h2 {
        margin: 0;
        color: var(--cc-text);
        font-size: 15px;
        font-weight: 600;
    }

.cc-record-body {
    width: 100%;
    padding: 22px 20px;
}

.cc-record-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 100%;
}

.cc-breadcrumb-back {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 5px;
    color: var(--cc-text-secondary);
    font-size: 13px;
    cursor: pointer;
}

    .cc-breadcrumb-back:hover {
        color: var(--cc-primary);
    }

.cc-inline-tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}

.cc-text-muted {
    color: var(--cc-text-muted);
}

.cc-record-tabs {
    width: 100%;
}

    .cc-record-tabs .rz-tabview-nav {
        padding-left: 12px;
        padding-right: 12px;
    }

    .cc-record-tabs .rz-tabview-panel {
        min-height: 120px;
        padding: 24px 20px;
    }

@media (max-width: 700px) {
    .cc-record-body {
        padding: 18px 14px;
    }

    .cc-record-section-header {
        padding: 0 14px;
    }

    .cc-record-tabs .rz-tabview-panel {
        padding: 20px 14px;
    }
}


/* ============================================================
   22. RELATED RECORDS
   ============================================================ */

.cc-related-section {
    width: 100%;
}

.cc-related-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.cc-related-description {
    margin-top: 2px;
    color: var(--cc-text-muted);
    font-size: 12px;
}

@media (max-width: 600px) {
    .cc-related-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ============================================================
   formularios/componentes compartidos
   ============================================================ */

.cc-file-upload {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    padding: 0 14px;
    color: var(--cc-primary);
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

    .cc-file-upload:hover {
        border-color: var(--cc-primary);
    }

    .cc-file-upload input[type="file"] {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

    .cc-file-upload.is-disabled {
        opacity: .55;
        pointer-events: none;
    }

/* ============================================================
   PRINT
   ============================================================ */

@media print {
    .cc-no-print,
    .rz-sidebar,
    .rz-header,
    .cc-nav {
        display: none !important;
    }

    .cc-print-receipt {
        max-width: none !important;
        margin: 0 !important;
    }

    .cc-print-receipt .cc-record-card {
        border: 0 !important;
        box-shadow: none !important;
        max-width: none !important;
    }
}

/* ============================================================
   LOAN PRODUCT WIZARD
   ============================================================ */

.cc-loan-wizard {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 100%;
}

.cc-stepper {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 4px;
    padding: 4px;
    background: var(--cc-surface-soft, #f7f7f8);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
}

.cc-stepper-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 6px 8px;
    color: var(--cc-text-secondary);
    background: transparent;
    border: 0;
    border-radius: var(--cc-radius-sm);
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.cc-stepper-item:disabled {
    opacity: .55;
    cursor: default;
}

.cc-stepper-item.is-active {
    color: var(--cc-primary);
    background: var(--cc-surface);
    box-shadow: 0 1px 2px rgba(0,0,0,.05);
    font-weight: 600;
}

.cc-stepper-item.is-complete {
    color: var(--cc-text);
}

.cc-stepper-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 21px;
    height: 21px;
    flex: 0 0 21px;
    border: 1px solid var(--cc-border);
    border-radius: 50%;
    font-size: 11px;
    font-weight: 600;
}

.cc-stepper-item.is-active .cc-stepper-number {
    color: #fff;
    background: var(--cc-primary);
    border-color: var(--cc-primary);
}

.cc-stepper-item.is-complete .cc-stepper-number {
    color: var(--cc-primary);
    border-color: var(--cc-primary);
}

.cc-wizard-panel {
    min-height: 390px;
}

.cc-wizard-heading h2 {
    margin: 0;
    color: var(--cc-text);
    font-size: 18px;
    font-weight: 650;
}

.cc-wizard-heading p {
    margin: 4px 0 0;
    color: var(--cc-text-muted);
    font-size: 13px;
}

.cc-option-line {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    color: var(--cc-text);
    font-size: 13px;
}

.cc-financial-hint {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    min-height: 42px;
    padding: 9px 12px;
    background: var(--cc-surface-soft, #f7f7f8);
    border: 1px solid var(--cc-border-soft);
    border-radius: var(--cc-radius-sm);
}

.cc-financial-hint strong {
    color: var(--cc-text);
    font-size: 13px;
}

.cc-financial-hint span {
    color: var(--cc-text-muted);
    font-size: 12px;
}

.cc-review-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.cc-review-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    padding: 12px 14px;
    background: var(--cc-surface-soft, #f7f7f8);
    border: 1px solid var(--cc-border-soft);
    border-radius: var(--cc-radius-sm);
}

.cc-review-item span {
    color: var(--cc-text-muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.cc-review-item strong {
    color: var(--cc-text);
    font-size: 13px;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.cc-review-wide {
    grid-column: 1 / -1;
}

.cc-wizard-actions {
    justify-content: space-between;
}

.cc-wizard-actions-main {
    display: flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 900px) {
    .cc-stepper {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

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

    .cc-stepper-item {
        justify-content: flex-start;
    }

    .cc-review-grid {
        grid-template-columns: 1fr;
    }

    .cc-review-wide {
        grid-column: auto;
    }
}

/* Detalle de préstamos: resumen ejecutivo de condiciones, datos y desembolso. */
.cc-loan-summary-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr) minmax(0, .8fr);
    gap: 16px;
    margin-bottom: 16px;
    align-items: stretch;
}

.cc-loan-summary-grid-two {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
}

.cc-loan-summary-grid > .cc-record-card {
    height: 100%;
}

@media (max-width: 1400px) {
    .cc-loan-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cc-loan-summary-grid .cc-loan-disbursement-card {
        grid-column: 1 / -1;
    }
}

@media (max-width: 850px) {
    .cc-loan-summary-grid,
    .cc-loan-summary-grid-two {
        grid-template-columns: 1fr;
    }

    .cc-loan-summary-grid .cc-loan-disbursement-card {
        grid-column: auto;
    }
}

/* ============================================================
   PRODUCTOS DE PRÉSTAMO - DETALLE Y VERSIONES
   ============================================================ */

/* Grid compartido que ya utilizan varios formularios de préstamos. */
.cc-form-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
}

.cc-product-description {
    padding: 14px 16px;
    margin-bottom: 16px;
}

.cc-product-current-card,
.cc-product-next-card {
    margin-bottom: 16px;
}

.cc-product-card-header {
    justify-content: space-between;
    gap: 16px;
}

.cc-product-version-caption {
    margin-top: 2px;
    font-size: 12px;
}

.cc-product-header-actions,
.cc-version-row-actions,
.cc-product-title-line {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.cc-product-current-body {
    padding-top: 18px;
    padding-bottom: 18px;
}

.cc-product-config-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 18px;
    width: 100%;
}

.cc-product-secondary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 16px;
    align-items: stretch;
}

.cc-product-secondary-grid > .cc-record-card {
    height: 100%;
}

.cc-product-section-body {
    padding-top: 18px;
    padding-bottom: 18px;
}

.cc-product-next-card {
    border-color: color-mix(in srgb, var(--cc-primary) 28%, var(--cc-border));
}

.cc-product-next-body {
    padding-top: 16px;
    padding-bottom: 16px;
}

.cc-product-next-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
}

.cc-version-row-actions {
    justify-content: flex-end;
    flex-wrap: nowrap;
}

.cc-version-detail-dialog {
    gap: 14px;
}

.cc-version-detail-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    background: var(--cc-background);
    border: 1px solid var(--cc-border-soft);
    border-radius: var(--cc-radius-md);
}

.cc-version-detail-title {
    color: var(--cc-text);
    font-size: 16px;
    font-weight: 600;
}

.cc-version-detail-section {
    padding: 16px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
}

.cc-version-detail-section-title {
    margin-bottom: 14px;
    color: var(--cc-text);
    font-size: 14px;
    font-weight: 600;
}

.cc-version-detail-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 22px;
    row-gap: 16px;
}

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

.cc-version-detail-two-cols {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

@media (max-width: 1200px) {
    .cc-product-config-grid,
    .cc-version-detail-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cc-product-next-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .cc-form-grid-3,
    .cc-product-config-grid,
    .cc-product-next-grid,
    .cc-version-detail-grid,
    .cc-version-detail-grid-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cc-product-secondary-grid,
    .cc-version-detail-two-cols {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .cc-form-grid-3,
    .cc-product-config-grid,
    .cc-product-next-grid,
    .cc-version-detail-grid,
    .cc-version-detail-grid-2 {
        grid-template-columns: 1fr;
    }

    .cc-product-card-header,
    .cc-version-detail-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .cc-product-header-actions {
        width: 100%;
    }

    .cc-version-row-actions {
        flex-wrap: wrap;
    }
}

/* =========================================================
   REPORTERÍA Y FILTROS UNIFICADOS
   ========================================================= */
.cc-filter-panel {
    padding: 16px;
    margin-bottom: 16px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
}

.cc-filter-grid {
    display: grid;
    gap: 12px;
    align-items: end;
}

.cc-filter-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; }
.cc-filter-grid-4 { grid-template-columns: 1fr 2fr 1.1fr auto; }
.cc-filter-grid-ledger { grid-template-columns: minmax(220px, 2fr) repeat(6, minmax(120px, 1fr)) auto; }
.cc-filter-grid-movements { grid-template-columns: minmax(240px, 1fr) 150px 150px 170px auto; }

.cc-filter-actions {
    display: flex;
    gap: 8px;
    align-items: end;
    flex-wrap: wrap;
    min-height: 48px;
}

.cc-filter-check {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 48px;
    color: var(--cc-text-muted);
    font-size: 14px;
}

.cc-kpi-grid {
    display: grid;
    gap: 14px;
    margin-bottom: 16px;
}

.cc-kpi-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cc-kpi-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.cc-kpi-card {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-height: 116px;
    padding: 16px 18px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
    box-shadow: var(--cc-shadow-sm);
}

.cc-kpi-warning { border-color: #e7b85a; background: #fffaf0; }
.cc-kpi-label { color: var(--cc-text-muted); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .035em; }
.cc-kpi-value { color: var(--cc-text); font-size: clamp(22px, 2vw, 29px); line-height: 1.12; font-variant-numeric: tabular-nums; }
.cc-kpi-meta { margin-top: auto; color: var(--cc-text-muted); font-size: 12px; }

.cc-report-tabs { margin-top: 4px; }
.cc-report-tabs .rz-tabview-panels { padding: 16px 0 0 !important; background: transparent !important; }
.cc-report-table-wrap { overflow-x: auto; }

.cc-report-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
}

.cc-report-table th,
.cc-report-table td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--cc-border-soft);
    vertical-align: middle;
}

.cc-report-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--cc-background);
    color: var(--cc-text-muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .035em;
    text-align: left;
}

.cc-report-table tbody tr:hover td { background: color-mix(in srgb, var(--cc-primary) 4%, var(--cc-surface)); }
.cc-report-table tfoot th { background: var(--cc-background); color: var(--cc-text); font-weight: 700; }
.cc-report-table .cc-money { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cc-row-actions { text-align: right; white-space: nowrap; }
.cc-table-subtext { margin-top: 2px; color: var(--cc-text-muted); font-size: 11px; }
.cc-empty-cell { padding: 36px !important; text-align: center; color: var(--cc-text-muted); }

.cc-account-cell { display: flex; align-items: center; gap: 8px; min-width: 280px; }
.cc-account-code { min-width: 72px; color: var(--cc-primary); font-weight: 700; font-variant-numeric: tabular-nums; }
.cc-account-group td { background: color-mix(in srgb, var(--cc-primary) 4%, var(--cc-surface)); font-weight: 600; }
.cc-account-toggle,
.cc-account-toggle-placeholder { width: 22px; min-width: 22px; height: 22px; }
.cc-account-toggle { display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 5px; color: var(--cc-text-muted); background: transparent; cursor: pointer; }
.cc-account-toggle:hover { background: var(--cc-background); color: var(--cc-primary); }
.cc-account-toggle .rzi { font-size: 18px; }

.cc-empty-state {
    display: flex;
    min-height: 190px;
    padding: 32px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--cc-text-muted);
    background: var(--cc-surface);
    border: 1px dashed var(--cc-border);
    border-radius: var(--cc-radius-md);
    text-align: center;
}
.cc-empty-state .rzi { font-size: 32px; color: var(--cc-primary); }
.cc-empty-state strong { color: var(--cc-text); }

@media (max-width: 1300px) {
    .cc-filter-grid-ledger { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .cc-filter-grid-movements { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
    .cc-filter-grid-4,
    .cc-filter-grid-ledger,
    .cc-filter-grid-movements { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cc-kpi-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .cc-filter-grid-3,
    .cc-filter-grid-4,
    .cc-filter-grid-ledger,
    .cc-filter-grid-movements,
    .cc-kpi-grid-3,
    .cc-kpi-grid-4 { grid-template-columns: 1fr; }
    .cc-filter-actions { min-height: auto; }
}

@media print {
    .cc-no-print,
    .cc-page-actions,
    .cc-nav,
    .cc-sidebar { display: none !important; }
    .cc-page { padding: 0 !important; max-width: none !important; }
    .cc-surface, .cc-kpi-card { box-shadow: none !important; }
    .cc-report-table thead th { position: static; }
}
.cc-kpi-value-small { font-size: 18px; line-height: 1.25; }
.cc-report-context {
    margin: -4px 0 14px;
    color: var(--cc-text-muted);
    font-size: 12px;
}
.cc-report-context strong { color: var(--cc-text); font-weight: 600; }
/* ============================================================
   PLAN DE CUENTAS CON SALDOS
   Vista operativa / contable
   ============================================================ */

.cc-coa-page {
    gap: 14px;
}

.cc-coa-page-header {
    margin-bottom: 0;
}

.cc-coa-eyebrow {
    margin-bottom: 2px;
    color: var(--cc-primary);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

/* Toolbar */
.cc-coa-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 14px;
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
    box-shadow: var(--cc-shadow-sm);
}

.cc-coa-toolbar-main {
    display: grid;
    grid-template-columns: 180px minmax(280px, 1fr) auto;
    align-items: end;
    gap: 12px;
    min-width: 0;
    flex: 1 1 auto;
}

.cc-coa-field {
    min-width: 0;
}

.cc-coa-field-label {
    display: block;
    margin: 0 0 5px 2px;
    color: var(--cc-text-muted);
    font-size: 11px;
    font-weight: 600;
}

.cc-coa-search-box {
    position: relative;
}

.cc-coa-search-box > .rzi {
    position: absolute;
    z-index: 2;
    left: 11px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--cc-text-muted);
    font-size: 17px;
    pointer-events: none;
}

.cc-coa-search-box .rz-textbox {
    padding-left: 34px !important;
}

.cc-coa-check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 4px;
    color: var(--cc-text-secondary);
    font-size: 13px;
    white-space: nowrap;
    cursor: pointer;
}

.cc-coa-toolbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    flex: 0 0 auto;
    flex-wrap: wrap;
}

.cc-coa-toolbar-separator {
    width: 1px;
    height: 28px;
    margin: 0 2px;
    background: var(--cc-border);
}

/* Métricas compactas */
.cc-coa-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
    box-shadow: var(--cc-shadow-sm);
    overflow: hidden;
}

.cc-coa-metric {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 76px;
    padding: 12px 16px;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
}

.cc-coa-metric + .cc-coa-metric {
    border-left: 1px solid var(--cc-border-soft);
}

.cc-coa-metric-label {
    color: var(--cc-text-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.cc-coa-metric-value {
    color: var(--cc-text);
    font-size: 21px;
    font-weight: 700;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cc-coa-metric-value small {
    color: var(--cc-text-secondary);
    font-size: 11px;
    font-weight: 500;
}

.cc-coa-metric-meta {
    color: var(--cc-text-muted);
    font-size: 11px;
}

.cc-coa-ok {
    color: var(--cc-success);
}

.cc-coa-danger,
.cc-coa-negative {
    color: var(--cc-danger) !important;
}

.cc-coa-positive {
    color: var(--cc-text);
}

.cc-coa-zero {
    color: var(--cc-text-muted) !important;
    font-weight: 400 !important;
}

/* Superficie principal */
.cc-coa-ledger {
    min-width: 0;
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-md);
    box-shadow: var(--cc-shadow-sm);
    overflow: hidden;
}

.cc-coa-ledger-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 56px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--cc-border-soft);
}

.cc-coa-ledger-header h2 {
    margin: 0;
    color: var(--cc-text);
    font-size: 14px;
    font-weight: 700;
}

.cc-coa-ledger-header p {
    margin: 2px 0 0;
    color: var(--cc-text-muted);
    font-size: 11px;
}

.cc-coa-ledger-count {
    display: flex;
    align-items: baseline;
    gap: 5px;
    color: var(--cc-text-muted);
    white-space: nowrap;
}

.cc-coa-ledger-count strong {
    color: var(--cc-text);
    font-size: 15px;
    font-variant-numeric: tabular-nums;
}

.cc-coa-ledger-count span {
    font-size: 11px;
}

.cc-coa-table-wrap {
    width: 100%;
    overflow: auto;
}

.cc-coa-table {
    width: 100%;
    min-width: 1080px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 12.5px;
}

.cc-coa-table th,
.cc-coa-table td {
    height: 42px;
    padding: 7px 12px;
    border-bottom: 1px solid var(--cc-border-soft);
    vertical-align: middle;
}

.cc-coa-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    height: 36px;
    background: var(--cc-surface-soft);
    color: var(--cc-text-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .045em;
    text-transform: uppercase;
    text-align: left;
    box-shadow: inset 0 -1px 0 var(--cc-border);
}

.cc-coa-table thead th.cc-money,
.cc-coa-table td.cc-money {
    text-align: right;
}

.cc-coa-code-column {
    width: 190px;
}

.cc-coa-class-column {
    width: 130px;
}

.cc-coa-status-column {
    width: 105px;
}

.cc-coa-actions-column {
    width: 112px;
    text-align: right !important;
}

.cc-coa-row td {
    background: var(--cc-surface);
    transition: background var(--cc-transition-fast);
}

.cc-coa-row:hover td {
    background: color-mix(in srgb, var(--cc-primary) 2.8%, var(--cc-surface));
}

.cc-coa-group td {
    background: color-mix(in srgb, var(--cc-primary) 3.5%, var(--cc-surface));
    font-weight: 600;
}

.cc-coa-group:hover td {
    background: color-mix(in srgb, var(--cc-primary) 6%, var(--cc-surface));
}

.cc-coa-root td {
    background: color-mix(in srgb, var(--cc-primary) 7%, var(--cc-surface));
    border-bottom-color: color-mix(in srgb, var(--cc-primary) 14%, var(--cc-border-soft));
    font-weight: 700;
}

.cc-coa-inactive td {
    opacity: .72;
}

.cc-coa-code-cell {
    white-space: nowrap;
}

.cc-coa-tree-cell {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 5px;
}

.cc-coa-toggle,
.cc-coa-toggle-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    min-width: 22px;
    height: 22px;
}

.cc-coa-toggle {
    padding: 0;
    border: 0;
    border-radius: 5px;
    color: var(--cc-text-muted);
    background: transparent;
    cursor: pointer;
    transition: color var(--cc-transition-fast), background var(--cc-transition-fast);
}

.cc-coa-toggle:hover {
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
}

.cc-coa-toggle .rzi {
    font-size: 17px;
}

.cc-coa-code {
    color: var(--cc-primary);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.cc-coa-name-cell {
    min-width: 260px;
}

.cc-coa-name {
    color: var(--cc-text);
}

.cc-coa-group .cc-coa-name,
.cc-coa-root .cc-coa-name {
    font-weight: 700;
}

.cc-coa-class-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 8px;
    border-radius: 999px;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.cc-coa-table .cc-money {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.cc-coa-balance {
    font-weight: 700;
}

.cc-coa-table .cc-row-actions .rz-button {
    white-space: nowrap;
}

.cc-coa-ledger-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 38px;
    padding: 8px 14px;
    color: var(--cc-text-muted);
    background: var(--cc-surface-soft);
    border-top: 1px solid var(--cc-border-soft);
    font-size: 11px;
}

.cc-coa-empty {
    display: flex;
    min-height: 150px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: var(--cc-text-muted);
}

.cc-coa-empty .rzi {
    margin-bottom: 4px;
    color: var(--cc-primary);
    font-size: 28px;
}

.cc-coa-empty strong {
    color: var(--cc-text);
    font-size: 13px;
}

/* Ajustes Radzen dentro de la barra compacta */
.cc-coa-toolbar .rz-datepicker,
.cc-coa-toolbar .rz-textbox {
    min-height: 38px;
}

.cc-coa-toolbar .rz-button {
    min-height: 36px;
}

@media (max-width: 1450px) {
    .cc-coa-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .cc-coa-toolbar-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 1050px) {
    .cc-coa-toolbar-main {
        grid-template-columns: 180px 1fr;
    }

    .cc-coa-check {
        grid-column: 1 / -1;
    }

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

    .cc-coa-metric:nth-child(3) {
        border-left: 0;
        border-top: 1px solid var(--cc-border-soft);
    }

    .cc-coa-metric:nth-child(4) {
        border-top: 1px solid var(--cc-border-soft);
    }
}

@media (max-width: 700px) {
    .cc-coa-toolbar-main {
        grid-template-columns: 1fr;
    }

    .cc-coa-check {
        grid-column: auto;
    }

    .cc-coa-toolbar-actions {
        align-items: stretch;
    }

    .cc-coa-toolbar-actions .rz-button {
        flex: 1 1 auto;
    }

    .cc-coa-toolbar-separator {
        display: none;
    }

    .cc-coa-metrics {
        grid-template-columns: 1fr;
    }

    .cc-coa-metric + .cc-coa-metric {
        border-left: 0;
        border-top: 1px solid var(--cc-border-soft);
    }

    .cc-coa-ledger-header,
    .cc-coa-ledger-footer {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ============================================================
   REPORTERÍA · CONSULTAS OPERATIVAS Y DOCUMENTOS FORMALES
   ============================================================ */

.cc-filter-panel-compact {
    padding: 12px 14px;
}

.cc-filter-grid-2 { grid-template-columns: minmax(280px, 1fr) auto; }
.cc-filter-grid-5 { grid-template-columns: repeat(4, minmax(150px, 1fr)) auto; }
.cc-filter-grid-6 { grid-template-columns: repeat(5, minmax(140px, 1fr)) auto; }

.cc-list-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 20px;
    margin: -2px 0 10px;
    color: var(--cc-text-muted);
    font-size: 12px;
}

.cc-list-summary strong {
    color: var(--cc-text);
    font-variant-numeric: tabular-nums;
}

.cc-summary-danger,
.cc-amount-danger,
.cc-date-danger {
    color: var(--cc-danger) !important;
}

.cc-amount-positive {
    color: var(--cc-success);
}

.cc-grid-wrap {
    overflow: hidden;
}

.cc-grid-wrap .rz-datatable,
.cc-grid-wrap .rz-grid-table {
    border-radius: inherit;
}

.cc-grid-wrap .rz-data-grid-data td {
    vertical-align: middle;
}

.cc-row-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
}

.cc-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin: 22px 0 9px;
}

.cc-section-heading h2 {
    margin: 0;
    font-size: 16px;
    font-weight: 650;
}

.cc-section-heading p {
    margin: 3px 0 0;
    color: var(--cc-text-muted);
    font-size: 12px;
}

/* Catálogo de reportes */
.cc-report-catalog {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.cc-report-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 24px;
    align-items: center;
    min-height: 104px;
    gap: 13px;
    padding: 16px;
    color: var(--cc-text);
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-lg);
    box-shadow: var(--cc-shadow-sm);
    transition: border-color var(--cc-transition-fast), box-shadow var(--cc-transition-fast), transform var(--cc-transition-fast);
}

.cc-report-card:hover {
    color: var(--cc-text);
    border-color: color-mix(in srgb, var(--cc-primary) 38%, var(--cc-border));
    box-shadow: var(--cc-shadow-md);
    transform: translateY(-1px);
}

.cc-report-card-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-radius: 10px;
}

.cc-report-card-icon .rzi { font-size: 21px; }
.cc-report-card-body { min-width: 0; }
.cc-report-card-body strong { display: block; margin-bottom: 4px; font-size: 14px; font-weight: 650; }
.cc-report-card-body span { display: block; color: var(--cc-text-secondary); font-size: 12px; line-height: 1.45; }
.cc-report-card-arrow { color: var(--cc-text-muted); }
.cc-report-card:hover .cc-report-card-arrow { color: var(--cc-primary); }

/* Posición integral del socio */
.cc-position-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
    padding: 16px 18px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-lg);
    box-shadow: var(--cc-shadow-sm);
}

.cc-position-person {
    display: flex;
    align-items: center;
    gap: 13px;
}

.cc-avatar-lg {
    display: grid;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    place-items: center;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border: 1px solid var(--cc-primary-soft-hover);
    border-radius: 50%;
    font-size: 14px;
    font-weight: 750;
    letter-spacing: .3px;
}

.cc-position-name { font-size: 17px; font-weight: 680; }
.cc-position-meta { margin-top: 2px; color: var(--cc-text-muted); font-size: 11.5px; }

.cc-metric-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 14px;
    overflow: hidden;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-lg);
    box-shadow: var(--cc-shadow-sm);
}

.cc-metric-strip-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.cc-metric-strip-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

.cc-metric {
    min-width: 0;
    padding: 13px 15px;
    border-left: 1px solid var(--cc-border-soft);
}

.cc-metric:first-child { border-left: 0; }
.cc-metric > span { display: block; margin-bottom: 5px; color: var(--cc-text-muted); font-size: 10.5px; font-weight: 600; letter-spacing: .025em; text-transform: uppercase; }
.cc-metric > strong { display: block; color: var(--cc-text); font-size: 18px; font-weight: 720; font-variant-numeric: tabular-nums; line-height: 1.15; }
.cc-metric > small { display: block; margin-top: 5px; overflow: hidden; color: var(--cc-text-muted); font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.cc-metric-emphasis { background: linear-gradient(180deg, var(--cc-primary-soft), #fff); }
.cc-metric-emphasis > strong { color: var(--cc-primary); }

.cc-activity-list { overflow: hidden; }
.cc-activity-row { display: grid; grid-template-columns: 100px minmax(0, 1fr) 145px 38px; align-items: center; gap: 12px; min-height: 54px; padding: 9px 13px; border-bottom: 1px solid var(--cc-border-soft); }
.cc-activity-row:last-child { border-bottom: 0; }
.cc-activity-date { color: var(--cc-text-muted); font-size: 11px; }
.cc-activity-main { min-width: 0; }
.cc-activity-main strong { display: block; overflow: hidden; font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.cc-activity-main span { display: block; margin-top: 2px; color: var(--cc-text-muted); font-size: 10.5px; }
.cc-activity-money { text-align: right; font-size: 12px; font-weight: 650; font-variant-numeric: tabular-nums; }
.cc-empty-inline { padding: 24px; color: var(--cc-text-muted); text-align: center; font-size: 12px; }

/* Documento formal */
.cc-report-document-page { max-width: none; }

.cc-report-document {
    overflow: hidden;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-lg);
    box-shadow: var(--cc-shadow-sm);
}

.cc-report-document-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 20px 22px 16px;
    border-bottom: 1px solid var(--cc-border-soft);
}

.cc-report-document-header strong {
    display: block;
    margin-bottom: 4px;
    color: var(--cc-primary);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.cc-report-document-header h2 {
    margin: 0;
    color: var(--cc-text);
    font-size: 19px;
    font-weight: 700;
}

.cc-report-document-header span,
.cc-report-document-header small {
    display: block;
    margin-top: 4px;
    color: var(--cc-text-secondary);
    font-size: 11.5px;
}

.cc-report-document-cut {
    flex: 0 0 auto;
    padding: 7px 10px;
    color: var(--cc-text-secondary);
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.cc-report-totals {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    padding: 10px 14px;
    background: #fcfcfd;
    border-bottom: 1px solid var(--cc-border-soft);
}

.cc-report-totals > span {
    padding: 3px 14px;
    color: var(--cc-text-muted);
    border-left: 1px solid var(--cc-border-soft);
    font-size: 10.5px;
    white-space: nowrap;
}
.cc-report-totals > span:first-child { border-left: 0; padding-left: 0; }
.cc-report-totals strong { margin-left: 4px; color: var(--cc-text); font-size: 12.5px; font-variant-numeric: tabular-nums; }

.cc-report-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.cc-report-table {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: var(--cc-text);
    font-size: 11px;
}

.cc-report-table th {
    padding: 9px 10px;
    color: var(--cc-text-muted);
    background: #fafafd;
    border-bottom: 1px solid var(--cc-border);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .04em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.cc-report-table td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--cc-border-soft);
    vertical-align: top;
}

.cc-report-table tbody tr:last-child td { border-bottom: 0; }
.cc-report-table tbody tr:hover td { background: #fcfbfc; }
.cc-report-table .cc-money { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cc-report-row-reversal td { color: var(--cc-text-muted); background: #fbfbfc; }
.cc-report-row-reversal .cc-money { color: var(--cc-danger); }

.cc-report-section-title {
    margin: 20px 22px 8px;
    font-size: 14px;
    font-weight: 680;
}

.cc-report-note {
    margin: 14px 22px 20px;
    padding: 10px 12px;
    color: var(--cc-text-secondary);
    background: var(--cc-surface-soft);
    border-left: 3px solid var(--cc-primary);
    border-radius: 4px;
    font-size: 10.5px;
    line-height: 1.5;
}

.cc-aging-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    border-bottom: 1px solid var(--cc-border-soft);
}

.cc-aging-card {
    padding: 13px 15px;
    border-left: 1px solid var(--cc-border-soft);
}
.cc-aging-card:first-child { border-left: 0; }
.cc-aging-card span { display: block; color: var(--cc-text-muted); font-size: 10px; font-weight: 600; text-transform: uppercase; }
.cc-aging-card strong { display: block; margin-top: 4px; color: var(--cc-danger); font-size: 16px; font-variant-numeric: tabular-nums; }
.cc-aging-card small { display: block; margin-top: 3px; color: var(--cc-text-muted); font-size: 10px; }

.cc-member-balance-band {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    border-bottom: 1px solid var(--cc-border-soft);
}
.cc-member-balance-band > div { padding: 14px 18px; border-left: 1px solid var(--cc-border-soft); }
.cc-member-balance-band > div:first-child { border-left: 0; }
.cc-member-balance-band span { display: block; color: var(--cc-text-muted); font-size: 10px; text-transform: uppercase; }
.cc-member-balance-band strong { display: block; margin-top: 4px; font-size: 17px; font-variant-numeric: tabular-nums; }

@media (max-width: 1450px) {
    .cc-filter-grid-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .cc-filter-grid-6 .cc-filter-actions { justify-content: flex-start; }
    .cc-metric-strip-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .cc-metric-strip-6 .cc-metric:nth-child(4) { border-left: 0; border-top: 1px solid var(--cc-border-soft); }
    .cc-metric-strip-6 .cc-metric:nth-child(5), .cc-metric-strip-6 .cc-metric:nth-child(6) { border-top: 1px solid var(--cc-border-soft); }
}

@media (max-width: 1100px) {
    .cc-report-catalog { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cc-filter-grid-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cc-metric-strip-5, .cc-metric-strip-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cc-metric { border-top: 1px solid var(--cc-border-soft); }
    .cc-metric:nth-child(1), .cc-metric:nth-child(2) { border-top: 0; }
    .cc-metric:nth-child(odd) { border-left: 0; }
    .cc-aging-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .cc-aging-card { border-top: 1px solid var(--cc-border-soft); }
    .cc-member-balance-band { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .cc-member-balance-band > div:nth-child(3) { border-left: 0; border-top: 1px solid var(--cc-border-soft); }
    .cc-member-balance-band > div:nth-child(4) { border-top: 1px solid var(--cc-border-soft); }
}

@media (max-width: 760px) {
    .cc-report-catalog,
    .cc-filter-grid-2,
    .cc-filter-grid-5,
    .cc-filter-grid-6,
    .cc-metric-strip,
    .cc-metric-strip-5,
    .cc-metric-strip-6,
    .cc-member-balance-band,
    .cc-aging-grid { grid-template-columns: 1fr; }
    .cc-metric,
    .cc-member-balance-band > div,
    .cc-aging-card { border-left: 0; border-top: 1px solid var(--cc-border-soft); }
    .cc-metric:first-child,
    .cc-member-balance-band > div:first-child,
    .cc-aging-card:first-child { border-top: 0; }
    .cc-position-hero,
    .cc-report-document-header { align-items: flex-start; flex-direction: column; }
    .cc-activity-row { grid-template-columns: 78px minmax(0,1fr) 110px; }
    .cc-activity-row > :last-child { display: none; }
}

@media print {
    body { background: #fff !important; }
    .cc-topbar,
    .cc-sidebar,
    .cc-no-print { display: none !important; }
    .cc-app-body,
    .cc-main,
    .cc-page,
    .cc-report-document-page { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
    .cc-report-document { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
    .cc-report-table-wrap { overflow: visible !important; }
    .cc-report-table { min-width: 0 !important; font-size: 8.5pt; }
    .cc-report-table th { font-size: 7.5pt; }
    .cc-report-table tr { break-inside: avoid; }
    .cc-report-document-header { padding-left: 0; padding-right: 0; }
    .cc-report-totals { padding-left: 0; padding-right: 0; }
    .cc-report-note { margin-left: 0; margin-right: 0; }
}

/* =========================================================
   Ahorros — operación y reportería
   ========================================================= */
.cc-alert {
    margin: 0 0 14px;
    padding: 10px 12px;
    border: 1px solid var(--cc-border);
    border-radius: 7px;
    font-size: 11.5px;
    line-height: 1.45;
}
.cc-alert-info { color: #334155; background: #f8fafc; border-color: #dbe3ec; }
.cc-alert-danger { color: #8a1c24; background: #fff7f7; border-color: #f1cfd2; }

.cc-form-grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.cc-form-section { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--cc-border-soft); }
.cc-subsection-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.cc-subsection-header strong { color: var(--cc-text); font-size: 12px; font-weight: 700; }
.cc-check-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px 14px; padding: 8px 0; }
.cc-check-grid label,
.cc-check-stack label { display: flex; align-items: center; gap: 7px; color: var(--cc-text-secondary); font-size: 11.5px; }
.cc-check-stack { display: flex; min-height: 56px; flex-direction: column; justify-content: center; gap: 8px; padding: 4px 2px; }

.cc-rate-grid { display: grid; grid-template-columns: minmax(120px,.8fr) minmax(120px,.8fr) minmax(140px,.8fr) 42px; align-items: center; gap: 8px; }
.cc-rate-head { padding: 0 2px 3px; color: var(--cc-text-muted); font-size: 9.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }

.cc-ahorro-product-dialog { min-width: min(960px, 88vw); }
.cc-version-card { margin-bottom: 12px; padding: 14px 16px; background: #fff; border: 1px solid var(--cc-border); border-radius: 9px; box-shadow: var(--cc-shadow-sm); }
.cc-version-card:last-child { margin-bottom: 0; }

.cc-section-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin: 16px 0 8px; }
.cc-section-header h2, .cc-section-header h3 { margin: 0; color: var(--cc-text); font-size: 14px; font-weight: 700; }
.cc-section-subtitle { margin: 3px 0 0; color: var(--cc-text-muted); font-size: 10.5px; }
.cc-eyebrow { display: block; margin-bottom: 4px; color: var(--cc-primary); font-size: 9.5px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }

.cc-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1px; overflow: hidden; background: var(--cc-border-soft); border: 1px solid var(--cc-border-soft); border-radius: 8px; }
.cc-detail-grid > div { min-width: 0; padding: 11px 13px; background: #fff; }
.cc-detail-grid span { display: block; margin-bottom: 4px; color: var(--cc-text-muted); font-size: 9.5px; font-weight: 650; letter-spacing: .03em; text-transform: uppercase; }
.cc-detail-grid strong { display: block; overflow: hidden; color: var(--cc-text); font-size: 12.5px; font-weight: 680; text-overflow: ellipsis; white-space: nowrap; }

.cc-metric-strip-4,
.cc-metric-strip-8 { display: grid; overflow: hidden; margin-bottom: 14px; background: #fff; border: 1px solid var(--cc-border); border-radius: var(--cc-radius-lg); box-shadow: var(--cc-shadow-sm); }
.cc-metric-strip-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
.cc-metric-strip-8 { grid-template-columns: repeat(8, minmax(0,1fr)); }
.cc-metric-item { min-width: 0; padding: 11px 13px; border-left: 1px solid var(--cc-border-soft); }
.cc-metric-item:first-child { border-left: 0; }
.cc-metric-item span { display: block; overflow: hidden; margin-bottom: 4px; color: var(--cc-text-muted); font-size: 9.5px; font-weight: 650; letter-spacing: .025em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.cc-metric-item strong { display: block; overflow: hidden; color: var(--cc-text); font-size: 15px; font-weight: 720; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }

.cc-report-catalog-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.cc-report-catalog-card { display: flex; align-items: flex-start; gap: 12px; min-height: 84px; padding: 15px 16px; color: inherit; background: #fff; border: 1px solid var(--cc-border); border-radius: 9px; box-shadow: var(--cc-shadow-sm); text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.cc-report-catalog-card:hover { color: inherit; border-color: #d5c4cd; box-shadow: 0 5px 16px rgba(32,24,29,.07); transform: translateY(-1px); text-decoration: none; }
.cc-report-catalog-card .rz-icon { flex: 0 0 auto; margin-top: 1px; color: var(--cc-primary); font-size: 21px; }
.cc-report-catalog-card strong { display: block; margin-bottom: 4px; color: var(--cc-text); font-size: 12.5px; font-weight: 700; }
.cc-report-catalog-card span { display: block; color: var(--cc-text-muted); font-size: 10.5px; line-height: 1.45; }
.cc-report-table-formal { min-width: 980px; }

@media (max-width: 1450px) {
    .cc-metric-strip-8 { grid-template-columns: repeat(4, minmax(0,1fr)); }
    .cc-metric-strip-8 .cc-metric-item:nth-child(5) { border-left: 0; }
    .cc-metric-strip-8 .cc-metric-item:nth-child(n+5) { border-top: 1px solid var(--cc-border-soft); }
}

@media (max-width: 1100px) {
    .cc-form-grid-4, .cc-detail-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .cc-check-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .cc-metric-strip-4, .cc-metric-strip-8 { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .cc-metric-item:nth-child(odd) { border-left: 0; }
    .cc-metric-item:nth-child(n+3) { border-top: 1px solid var(--cc-border-soft); }
}

@media (max-width: 760px) {
    .cc-form-grid-4, .cc-detail-grid, .cc-check-grid, .cc-report-catalog-grid, .cc-metric-strip-4, .cc-metric-strip-8 { grid-template-columns: 1fr; }
    .cc-rate-grid { grid-template-columns: 1fr 1fr 1fr 38px; }
    .cc-metric-item { border-left: 0; border-top: 1px solid var(--cc-border-soft); }
    .cc-metric-item:first-child { border-top: 0; }
    .cc-ahorro-product-dialog { min-width: 0; }
}

/* =========================================================
   Ahorros — producto financiero mejorado
   ========================================================= */
.cc-savings-wizard .cc-wizard-panel { padding-bottom: 18px; }
.cc-field-with-help { position: relative; min-width: 0; }
.cc-field-with-help > .cc-help-dot { position: absolute; top: -2px; right: 5px; z-index: 2; }
.cc-help-dot {
    display: inline-flex;
    width: 17px;
    height: 17px;
    align-items: center;
    justify-content: center;
    flex: 0 0 17px;
    color: #6b4a5f;
    background: #f4edf1;
    border: 1px solid #ddccd6;
    border-radius: 50%;
    cursor: help;
    font-size: 10px;
    font-weight: 750;
    line-height: 1;
}
.cc-help-dot:hover { color: #fff; background: var(--cc-primary); border-color: var(--cc-primary); }

.cc-policy-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 10px 0 14px;
    padding: 13px 14px;
    background: #fbfafb;
    border: 1px solid var(--cc-border);
    border-radius: 9px;
}
.cc-policy-card-main { min-width: 0; }
.cc-policy-card-main strong { display: block; margin-bottom: 3px; color: var(--cc-text); font-size: 12px; font-weight: 720; }
.cc-policy-card-main span { display: block; max-width: 760px; color: var(--cc-text-muted); font-size: 10.5px; line-height: 1.45; }
.cc-policy-mini { display: flex; flex-direction: column; justify-content: center; gap: 9px; min-height: 58px; padding: 4px 2px; }
.cc-policy-mini label { display: flex; align-items: center; gap: 7px; color: var(--cc-text-secondary); font-size: 11px; }

.cc-financial-hint {
    display: grid;
    grid-template-columns: 145px minmax(0,1fr);
    gap: 12px;
    margin: 12px 0 0;
    padding: 11px 13px;
    color: #475569;
    background: #f8fafc;
    border: 1px solid #dfe7ee;
    border-radius: 8px;
    font-size: 10.5px;
    line-height: 1.5;
}
.cc-financial-hint strong { color: #334155; font-size: 10.5px; }
.cc-empty-state.compact { min-height: 0; padding: 16px; font-size: 11px; }

.cc-accounting-flow {
    overflow: hidden;
    margin-top: 14px;
    background: #fff;
    border: 1px solid var(--cc-border);
    border-radius: 9px;
}
.cc-accounting-flow-title { padding: 10px 12px; color: var(--cc-text); background: #faf8f9; border-bottom: 1px solid var(--cc-border-soft); font-size: 10.5px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.cc-accounting-flow-row { display: grid; grid-template-columns: 165px 1fr 1fr; gap: 14px; padding: 9px 12px; border-top: 1px solid var(--cc-border-soft); font-size: 10.5px; line-height: 1.4; }
.cc-accounting-flow-row:first-of-type { border-top: 0; }
.cc-accounting-flow-row strong { color: var(--cc-text); }
.cc-accounting-flow-row span { color: var(--cc-text-secondary); }
.cc-accounting-flow.compact { margin-top: 12px; }

.cc-savings-version { margin-bottom: 16px; padding: 16px; }
.cc-savings-version-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 13px; }
.cc-policy-summary-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 15px; }
.cc-policy-summary-card { display: flex; min-width: 0; gap: 10px; padding: 12px; background: #fbfafb; border: 1px solid var(--cc-border); border-radius: 9px; }
.cc-policy-summary-icon { display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; flex: 0 0 34px; color: var(--cc-primary); background: #f4edf1; border-radius: 8px; }
.cc-policy-summary-icon .rz-icon { font-size: 18px; }
.cc-policy-summary-card div { min-width: 0; }
.cc-policy-summary-card small { display: block; margin-bottom: 2px; color: var(--cc-text-muted); font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.cc-policy-summary-card strong { display: block; overflow: hidden; color: var(--cc-text); font-size: 12px; font-weight: 720; text-overflow: ellipsis; white-space: nowrap; }
.cc-policy-summary-card span:not(.cc-policy-summary-icon) { display: block; overflow: hidden; margin-top: 3px; color: var(--cc-text-muted); font-size: 9.7px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.cc-savings-detail-sections { display: grid; gap: 14px; }
.cc-savings-detail-block { padding-top: 3px; }
.cc-savings-detail-block + .cc-savings-detail-block { padding-top: 14px; border-top: 1px solid var(--cc-border-soft); }
.cc-filter-check { display: flex; align-items: center; gap: 8px; min-height: 54px; padding-top: 18px; color: var(--cc-text-secondary); font-size: 11.5px; }

@media (max-width: 1180px) {
    .cc-policy-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
    .cc-policy-summary-grid { grid-template-columns: 1fr; }
    .cc-financial-hint { grid-template-columns: 1fr; gap: 4px; }
    .cc-accounting-flow-row { grid-template-columns: 1fr; gap: 3px; }
    .cc-savings-version-head { flex-direction: column; }
    .cc-policy-card { align-items: flex-start; }
}

/* =========================================================
   Ahorros — interfaz operativa compacta y ayudas puntuales
   ========================================================= */
.cc-savings-wizard {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 14px;
}

.cc-savings-wizard .cc-stepper {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.cc-savings-wizard .cc-wizard-panel {
    min-height: 0;
    padding-bottom: 4px;
}

.cc-savings-wizard .cc-wizard-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
}

.cc-savings-wizard .cc-wizard-heading h2 {
    font-size: 16px;
    font-weight: 700;
}

.cc-heading-with-help .cc-help-dot,
.cc-policy-title .cc-help-dot {
    position: static !important;
}

.cc-field-with-help {
    position: relative;
    min-width: 0;
}

.cc-field-with-help > .cc-help-dot {
    position: absolute;
    z-index: 3;
    top: -7px;
    right: 8px;
    background: #fff;
}

.cc-field-single {
    width: min(520px, 100%);
}

.cc-help-dot {
    display: inline-flex;
    width: 18px;
    height: 18px;
    align-items: center;
    justify-content: center;
    flex: 0 0 18px;
    padding: 0;
    color: #6b4a5f;
    background: #f8f4f6;
    border: 1px solid #d9cbd3;
    border-radius: 50%;
    cursor: help;
    font-family: inherit;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

.cc-help-dot:hover,
.cc-help-dot:focus-visible {
    color: #fff;
    background: var(--cc-primary);
    border-color: var(--cc-primary);
    outline: none;
}

.cc-policy-toggle {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    padding: 7px 10px;
    color: var(--cc-text-secondary);
    background: #faf9fa;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    font-size: 11.5px;
}

.cc-policy-toggle-primary {
    margin: 0 0 14px;
    color: var(--cc-text);
}

.cc-savings-policy-section {
    overflow: visible;
    margin-bottom: 12px;
    padding: 14px;
    background: #fff;
    border: 1px solid var(--cc-border);
    border-radius: 9px;
}

.cc-savings-policy-section:last-of-type {
    margin-bottom: 0;
}

.cc-savings-policy-head,
.cc-interest-action-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.cc-policy-title {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 7px;
}

.cc-policy-title strong,
.cc-policy-title h3 {
    margin: 0;
    color: var(--cc-text);
    font-size: 12.5px;
    font-weight: 720;
}

.cc-switch-line {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--cc-text-secondary);
    font-size: 11.5px;
    white-space: nowrap;
}

.cc-policy-fields {
    margin-top: 13px;
}

.cc-policy-fields-second {
    margin-top: 10px;
}

.cc-disabled-policy {
    margin-top: 10px;
    padding: 8px 10px;
    color: var(--cc-text-muted);
    background: #fafafa;
    border: 1px dashed var(--cc-border-soft);
    border-radius: 7px;
    font-size: 10.5px;
}

.cc-interest-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 0 14px;
}

.cc-interest-options label {
    display: flex;
    min-height: 38px;
    align-items: center;
    gap: 7px;
    padding: 7px 9px;
    color: var(--cc-text-secondary);
    background: #faf9fa;
    border: 1px solid var(--cc-border-soft);
    border-radius: 7px;
    font-size: 10.8px;
}

.cc-interest-options .cc-help-dot {
    margin-left: auto;
}

.cc-rate-header {
    margin-top: 3px;
}

.cc-rate-grid-savings {
    padding: 10px;
    background: #fafafa;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
}

.cc-accounting-compact {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px 14px;
    margin-top: 14px;
    padding: 9px 11px;
    color: var(--cc-text-muted);
    background: #fafafa;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    font-size: 10.3px;
}

.cc-accounting-compact strong {
    color: var(--cc-text-secondary);
    font-weight: 700;
}

.cc-accounting-compact .cc-help-dot {
    margin-left: auto;
}

.cc-savings-wizard-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
}

.cc-actions-right {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cc-interest-toolbar {
    margin-bottom: 12px;
    padding: 14px;
}

.cc-interest-product {
    width: min(520px, 100%);
}

.cc-interest-actions-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.cc-interest-action-card {
    padding: 14px;
}

.cc-interest-action-fields {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto;
    align-items: end;
    gap: 10px;
    margin-top: 12px;
}

.cc-interest-action-fields.has-reason {
    grid-template-columns: minmax(150px, .7fr) minmax(220px, 1.3fr) auto;
}

.cc-table-section-head {
    margin: 0;
    padding: 14px 14px 8px;
}

@media (max-width: 900px) {
    .cc-savings-wizard .cc-stepper {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .cc-interest-actions-grid {
        grid-template-columns: 1fr;
    }
    .cc-interest-options {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .cc-savings-wizard .cc-stepper {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .cc-interest-action-fields,
    .cc-interest-action-fields.has-reason {
        grid-template-columns: 1fr;
    }
    .cc-savings-policy-head,
    .cc-interest-action-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .cc-savings-wizard-actions {
        align-items: stretch;
        flex-direction: column-reverse;
        gap: 8px;
    }
    .cc-actions-right {
        justify-content: flex-end;
        flex-wrap: wrap;
    }
}

/* Ahorros · detalles y diálogos compactos */
.cc-inline-control {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 8px;
}

.cc-inline-control > :first-child {
    flex: 1 1 auto;
    min-width: 0;
}

.cc-compact-note {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding: 9px 11px;
    color: var(--cc-text-secondary);
    background: #fafafa;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    font-size: 11.5px;
}

.cc-compact-note strong {
    color: var(--cc-text);
    font-weight: 700;
}

.cc-savings-version-card {
    margin-bottom: 16px;
    padding: 17px;
}

.cc-version-period {
    margin-top: 5px;
    color: var(--cc-text-muted);
    font-size: 11.5px;
}

.cc-detail-section-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 17px 0 9px;
    padding-top: 0;
    border-top: 0;
}

.cc-detail-section-title strong {
    color: var(--cc-text);
    font-size: 12.5px;
    font-weight: 720;
}

.cc-savings-policy-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.cc-policy-detail-card {
    min-width: 0;
    padding: 12px;
    background: #fff;
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
}

.cc-policy-detail-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}

.cc-policy-detail-head strong {
    color: var(--cc-text);
    font-size: 12px;
}

.cc-policy-summary-second,
.cc-detail-row-gap {
    margin-top: 10px;
}

.cc-rate-detail {
    margin-top: 12px;
}

.cc-rate-detail-head {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 8px;
    color: var(--cc-text);
    font-size: 12px;
}

.cc-empty-inline {
    padding: 9px 11px;
    color: var(--cc-text-muted);
    background: #fafafa;
    border: 1px dashed var(--cc-border-soft);
    border-radius: 8px;
    font-size: 11.5px;
}

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

    .cc-inline-control {
        align-items: flex-start;
    }
}

/* =========================================================
   Ahorros — revisión final y ayuda contextual Radzen
   ========================================================= */
.cc-savings-wizard .cc-stepper {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.cc-help-trigger {
    display: inline-flex;
    width: 17px;
    height: 17px;
    align-items: center;
    justify-content: center;
    flex: 0 0 17px;
    padding: 0;
    color: color-mix(in srgb, var(--cc-text-muted) 82%, transparent);
    background: transparent;
    border: 0;
    border-radius: 50%;
    cursor: help;
    opacity: .72;
    vertical-align: middle;
    transition: color .14s ease, background-color .14s ease, opacity .14s ease, transform .14s ease;
}

.cc-help-glyph {
    display: inline-flex;
    width: 13px;
    height: 13px;
    align-items: center;
    justify-content: center;
    color: currentColor;
    background: transparent;
    border: 1px solid currentColor;
    border-radius: 50%;
    font-family: var(--cc-font);
    font-size: 8.5px;
    font-style: normal;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
    letter-spacing: 0;
}

.cc-help-trigger:hover,
.cc-help-trigger:focus-visible {
    color: var(--cc-primary);
    background: color-mix(in srgb, var(--cc-primary) 7%, transparent);
    opacity: 1;
    outline: none;
}

.cc-help-trigger:active {
    transform: scale(.94);
}

.cc-field-with-help > .cc-help-trigger {
    position: absolute;
    z-index: 3;
    top: -5px;
    right: 7px;
    background: var(--cc-surface, #fff);
}

.cc-heading-with-help,
.cc-policy-title,
.cc-detail-section-title,
.cc-rate-detail-head {
    align-items: center;
}

.cc-heading-with-help .cc-help-trigger,
.cc-policy-title .cc-help-trigger,
.cc-detail-section-title .cc-help-trigger,
.cc-rate-detail-head .cc-help-trigger {
    position: static;
    margin-left: 1px;
}

.cc-interest-options .cc-help-trigger,
.cc-accounting-compact .cc-help-trigger {
    margin-left: auto;
}

.cc-tooltip-help.rz-tooltip {
    max-width: 285px;
}

.cc-tooltip-help .rz-tooltip-content {
    padding: 7px 9px;
    font-family: var(--cc-font);
    font-size: 10.5px;
    font-weight: 400;
    line-height: 1.4;
}

/* Compatibilidad: cualquier ayuda antigua dibujada a mano queda oculta. */
.cc-savings-wizard .cc-help-dot,
.cc-savings-version-card .cc-help-dot,
.cc-savings-detail-block .cc-help-dot,
.cc-dialog-form .cc-help-dot,
.cc-page .cc-help-dot {
    display: none !important;
}

.cc-review-caption {
    color: var(--cc-text-muted);
    font-size: 11px;
}

.cc-savings-review {
    display: grid;
    gap: 14px;
}

.cc-review-section {
    padding: 13px;
    background: #fff;
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
}

.cc-review-section-title {
    margin-bottom: 9px;
    color: var(--cc-text-secondary);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.cc-review-grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.cc-review-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.cc-review-policy {
    min-width: 0;
    padding: 11px 12px;
    background: var(--cc-surface-soft, #fafafa);
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
}

.cc-review-policy-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.cc-review-policy-head strong {
    color: var(--cc-text);
    font-size: 12px;
}

.cc-review-policy dl {
    display: grid;
    gap: 6px;
    margin: 0;
}

.cc-review-policy dl > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.cc-review-policy dt {
    color: var(--cc-text-muted);
    font-size: 10.5px;
}

.cc-review-policy dd {
    margin: 0;
    color: var(--cc-text-secondary);
    font-size: 10.8px;
    font-weight: 650;
    text-align: right;
}

.cc-review-empty {
    padding: 10px 12px;
    color: var(--cc-text-muted);
    background: var(--cc-surface-soft, #fafafa);
    border-radius: 7px;
    font-size: 11px;
}

@media (max-width: 1000px) {
    .cc-savings-wizard .cc-stepper {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .cc-review-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .cc-savings-wizard .cc-stepper {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .cc-review-columns,
    .cc-review-grid-4 {
        grid-template-columns: 1fr;
    }
}


/* Ahorros: las ayudas no dependen de Material Icons/RadzenIcon. */
.cc-help-trigger .rzi,
.cc-help-trigger .rz-icon,
.cc-help-trigger [class*="material-icons"] {
    display: none !important;
}

/* =========================================================
   Ahorros — ayuda de campos al lado del control
   ========================================================= */
.cc-field-with-help {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.cc-field-with-help > :not(.cc-help-trigger) {
    flex: 1 1 auto;
    min-width: 0;
}

.cc-field-with-help > .cc-help-trigger {
    position: static !important;
    z-index: auto;
    top: auto;
    right: auto;
    flex: 0 0 17px;
    margin: 0;
    background: transparent;
}

/* En campos altos (textarea o controles compuestos), la ayuda queda junto al borde superior. */
.cc-field-with-help:has(textarea) {
    align-items: flex-start;
}

.cc-field-with-help:has(textarea) > .cc-help-trigger {
    margin-top: 10px;
}

@media (max-width: 640px) {
    .cc-field-with-help {
        gap: 5px;
    }
}

/* =========================================================
   Ahorros — cuentas: listado y detalle
   ========================================================= */
.cc-savings-account-metrics {
    margin-bottom: 14px;
}

.cc-savings-account-list {
    overflow: hidden;
}

.cc-savings-empty-state {
    display: flex;
    min-height: 118px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    padding: 24px;
    color: var(--cc-text-muted);
    text-align: center;
}

.cc-savings-empty-state strong {
    color: var(--cc-text-secondary);
    font-size: 12.5px;
}

.cc-savings-empty-state span {
    font-size: 11px;
}

.cc-account-detail-header {
    margin-bottom: 12px;
}

.cc-account-detail-tags {
    margin-bottom: 7px;
}

.cc-account-product-tag,
.cc-account-version-tag {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 3px 8px;
    color: var(--cc-text-muted);
    background: var(--cc-surface-soft, #fafafa);
    border: 1px solid var(--cc-border-soft);
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 600;
}

.cc-account-version-tag {
    min-width: 30px;
    justify-content: center;
}

.cc-account-balance-strip {
    margin-bottom: 14px;
}

.cc-account-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(300px, .85fr);
    gap: 14px;
    margin-bottom: 14px;
}

.cc-account-info-card,
.cc-account-interest-card {
    min-width: 0;
    padding: 16px 17px;
}

.cc-account-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 13px;
}

.cc-account-card-head .cc-section-title {
    margin: 0;
}

.cc-account-opened-on,
.cc-account-section-caption,
.cc-account-actions-copy > span {
    color: var(--cc-text-muted);
    font-size: 10.5px;
}

.cc-account-data-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 18px;
}

.cc-account-interest-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.cc-account-actions-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
    padding: 13px 16px;
}

.cc-account-actions-copy {
    min-width: 190px;
}

.cc-account-actions-copy .cc-section-title {
    margin: 0;
}

.cc-account-actions-copy > span {
    display: block;
    margin-top: 4px;
}

.cc-account-control-actions {
    justify-content: flex-end;
}

.cc-account-table-card {
    overflow: hidden;
    margin-bottom: 14px;
}

.cc-account-table-head {
    padding: 13px 15px 9px;
}

.cc-account-table-head .cc-section-title {
    margin: 0 0 2px;
}

.cc-account-lower-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
    gap: 14px;
}

.cc-account-lower-grid > .cc-account-table-card {
    margin-bottom: 0;
}

@media (max-width: 1100px) {
    .cc-account-overview-grid,
    .cc-account-lower-grid {
        grid-template-columns: 1fr;
    }

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

@media (max-width: 760px) {
    .cc-account-actions-card {
        align-items: stretch;
        flex-direction: column;
    }

    .cc-account-control-actions {
        justify-content: flex-start;
    }

    .cc-account-data-grid {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   Ahorros — controles compuestos: evitar botones recortados
   ========================================================= */
.cc-inline-control {
    flex-wrap: nowrap;
}

.cc-inline-control > .rz-button,
.cc-inline-control > button,
.cc-inline-select-button {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 112px;
    white-space: nowrap !important;
}

.cc-inline-control .rz-button-text,
.cc-inline-select-button .rz-button-text {
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.cc-inline-control > .rz-textbox,
.cc-inline-control > input,
.cc-inline-control > :first-child {
    flex: 1 1 0 !important;
    min-width: 0 !important;
}

@media (max-width: 520px) {
    .cc-inline-control {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .cc-inline-select-button {
        width: 100% !important;
    }
}

/* =========================================================
   Patrón transversal — contexto de operación y detalle
   ========================================================= */
.cc-operation-context {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
    padding: 11px 13px;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    background: var(--cc-surface-soft, #fafafa);
}

.cc-operation-context > div:first-child {
    min-width: 0;
}

.cc-operation-context span,
.cc-record-summary span,
.cc-detail-list span {
    display: block;
    color: var(--cc-text-muted);
    font-size: 10px;
    font-weight: 650;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.cc-operation-context strong {
    display: block;
    margin-top: 2px;
    font-size: 13px;
}

.cc-operation-context small {
    display: block;
    margin-top: 2px;
    overflow: hidden;
    color: var(--cc-text-muted);
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-operation-context-amount {
    flex: 0 0 auto;
    text-align: right;
}

.cc-operation-context-amount strong {
    font-size: 15px;
}

.cc-record-summary {
    display: grid;
    gap: 1px;
    overflow: hidden;
    margin-bottom: 12px;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    background: var(--cc-border-soft);
}

.cc-record-summary-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cc-record-summary > div {
    min-width: 0;
    padding: 10px 12px;
    background: #fff;
}

.cc-record-summary strong {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-detail-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 12px;
}

.cc-detail-card {
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    background: #fff;
}

.cc-detail-section-title {
    margin-bottom: 9px;
    color: var(--cc-text);
    font-size: 12px;
    font-weight: 720;
}

.cc-detail-list {
    display: grid;
    gap: 8px;
}

.cc-detail-list-inline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cc-detail-list > div {
    min-width: 0;
}

.cc-detail-list strong,
.cc-detail-list .cc-record-link {
    display: inline-block;
    margin-top: 2px;
    max-width: 100%;
    overflow: hidden;
    font-size: 12.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-dialog-loading {
    padding: 18px 2px;
    color: var(--cc-text-muted);
    font-size: 12px;
}

/* Las referencias navegables se comportan igual en todos los módulos. */
a.cc-record-link,
button.cc-record-link {
    vertical-align: baseline;
}

button.cc-record-link {
    padding: 0;
    border: 0;
    background: transparent;
    font: inherit;
    cursor: pointer;
}

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

    .cc-operation-context-amount {
        text-align: left;
    }

    .cc-record-summary-3,
    .cc-detail-grid-2,
    .cc-detail-list-inline {
        grid-template-columns: 1fr;
    }
}

.cc-dialog-section-heading {
    margin: 4px 0 2px;
    min-height: 24px;
}

.cc-policy-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    margin-top: -2px;
    color: var(--cc-text-muted);
    font-size: 11px;
}

.cc-policy-inline > span {
    position: relative;
}

.cc-policy-inline > span + span::before {
    content: "·";
    position: absolute;
    left: -8px;
    color: var(--cc-border-strong, #aaa);
}

/* ===== Datos de detalle / referencias navegables ===== */
.cc-dato {
    min-width: 0;
}

.cc-dato-label {
    margin-bottom: 3px;
    color: var(--cc-text-muted, #6b7280);
    font-size: .78rem;
}

.cc-dato-value {
    min-width: 0;
    color: var(--cc-text, #1f2937);
    font-weight: 500;
}

.cc-dato-value .cc-record-link {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

/* ============================================================
   Bloque 2 — formularios compactos y configuración
   ============================================================ */
.cc-config-stack {
    display: grid;
    gap: 14px;
}

.cc-config-stack > .cc-surface {
    margin-top: 0 !important;
}

.cc-dialog-wide-form {
    max-height: min(78vh, 820px);
    overflow-y: auto;
    padding-right: 4px;
}

.cc-dialog-section {
    padding: 14px;
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
}

.cc-dialog-section-title {
    margin-bottom: 12px;
    color: var(--cc-text-secondary);
    font-size: 10.5px;
    font-weight: 750;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.cc-check-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.cc-check-option {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    min-width: 0;
    padding: 10px 11px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    cursor: pointer;
}

.cc-check-option > span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.cc-check-option strong {
    color: var(--cc-text);
    font-size: 11.5px;
    font-weight: 650;
}

.cc-check-option small {
    color: var(--cc-text-muted);
    font-size: 10.5px;
    line-height: 1.35;
}

.cc-subsection-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 14px 0 8px;
}

.cc-text-muted {
    color: var(--cc-text-muted);
}

@media (max-width: 760px) {
    .cc-check-grid { grid-template-columns: 1fr; }
}

.cc-settings-form {
    display: grid;
    gap: 14px;
}

.cc-settings-form > .cc-surface {
    margin: 0 !important;
}

/* ============================================================
   Configuración institucional — diseño compacto y localizado HN
   ============================================================ */
.cc-institution-page {
    max-width: 1500px;
}

.cc-institution-form {
    display: grid;
    gap: 12px;
}

.cc-institution-card {
    background: var(--cc-surface);
    border: 1px solid var(--cc-border-soft);
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
    overflow: hidden;
}

.cc-institution-section-head {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 13px 16px 11px;
    border-bottom: 1px solid var(--cc-border-soft);
    background: color-mix(in srgb, var(--cc-primary) 2.5%, var(--cc-surface));
}

.cc-institution-section-head h2 {
    margin: 0;
    color: var(--cc-text);
    font-size: .86rem;
    font-weight: 700;
}

.cc-institution-section-head p {
    margin: 2px 0 0;
    color: var(--cc-text-muted);
    font-size: .70rem;
    line-height: 1.3;
}

.cc-institution-section-icon {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--cc-primary) 9%, var(--cc-surface));
    color: var(--cc-primary);
}

.cc-institution-section-icon .rzi {
    font-size: 17px;
}

.cc-institution-grid {
    display: grid;
    gap: 14px 14px;
    padding: 16px;
    align-items: end;
}

.cc-institution-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cc-col-span-2 {
    grid-column: span 2;
    min-width: 0;
}

.cc-fixed-field {
    position: relative;
    min-height: 39px;
    padding: 8px 12px 7px;
    border: 1px solid var(--cc-border, #d6d9de);
    border-radius: 4px;
    background: var(--cc-surface-soft);
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: 10px;
}

.cc-fixed-field > span {
    position: absolute;
    top: -7px;
    left: 9px;
    padding: 0 4px;
    background: var(--cc-surface);
    color: var(--cc-text-muted);
    font-size: .66rem;
    line-height: 1;
}

.cc-fixed-field strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--cc-text);
    font-size: .78rem;
    font-weight: 600;
}

.cc-fixed-field small {
    color: var(--cc-text-muted);
    font-size: .68rem;
    white-space: nowrap;
}

@media (max-width: 1050px) {
    .cc-institution-grid-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cc-col-span-2 {
        grid-column: span 2;
    }
}

@media (max-width: 700px) {
    .cc-institution-grid-3 {
        grid-template-columns: 1fr;
    }

    .cc-col-span-2 {
        grid-column: span 1;
    }

    .cc-institution-grid {
        padding: 13px;
    }
}

/* ============================================================
   Beneficiarios y participantes — acceso visible en Ahorros
   ============================================================ */
.cc-account-participants-card {
    margin-top: 14px;
    padding: 0 16px 15px;
}

.cc-participant-preview-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.cc-participant-preview-item {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    padding: 10px 11px;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    background: var(--cc-surface-soft);
}

.cc-participant-preview-item > div:first-child {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.cc-participant-preview-item strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--cc-text);
    font-size: .77rem;
}

.cc-participant-preview-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--cc-text-muted);
    font-size: .67rem;
}

.cc-participant-role {
    color: var(--cc-primary);
    font-size: .64rem;
    font-weight: 750;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.cc-participant-preview-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 5px;
    flex: 0 0 auto;
    color: var(--cc-text-secondary);
    font-size: .68rem;
}

.cc-participant-more {
    display: inline-block;
    margin-top: 10px;
}

.cc-inline-empty-state {
    padding: 16px;
    border: 1px dashed var(--cc-border-soft);
    border-radius: 8px;
    background: var(--cc-surface-soft);
    color: var(--cc-text-muted);
    font-size: .74rem;
}

.cc-participant-list-head {
    margin-left: 14px;
    margin-right: 14px;
}

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

@media (max-width: 720px) {
    .cc-participant-preview-grid {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   Ajustes UX — configuración, cargos, participantes y navegación
   ============================================================ */

:root {
    --cc-sidebar-width: 248px;
}

/* Navegación: más espacio, etiquetas completas y un solo marcador activo. */
.cc-menu-module.is-current.is-open::before {
    display: none;
}

.cc-menu-child {
    min-height: 30px;
    height: auto;
    padding-top: 6px;
    padding-bottom: 6px;
    line-height: 1.22;
}

.cc-menu-child > span {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.cc-menu-children {
    margin-left: 31px;
    padding-right: 2px;
}

@media (max-width: 900px) {
    :root {
        --cc-sidebar-width: 220px;
    }
}

/* Configuración institucional: formulario más corto y sin parámetros fijos visibles. */
.cc-institution-page {
    max-width: 1180px;
}

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

.cc-institution-grid-compact {
    align-items: end;
}

@media (max-width: 760px) {
    .cc-institution-grid-2,
    .cc-institution-grid-3 {
        grid-template-columns: 1fr;
    }

    .cc-col-span-2 {
        grid-column: span 1;
    }
}

/* Páginas de configuración: jerarquía más clara entre lo principal y lo auxiliar. */
.cc-config-primary {
    border-color: color-mix(in srgb, var(--cc-primary) 24%, var(--cc-border));
}

.cc-config-primary > .cc-section-header,
.cc-config-secondary > .cc-section-header {
    margin: 0;
    padding: 13px 14px 10px;
    border-bottom: 1px solid var(--cc-border-soft);
}

.cc-config-secondary {
    box-shadow: none;
}

.cc-config-split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.cc-context-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--cc-primary) 20%, var(--cc-border));
    border-radius: var(--cc-radius-md);
    background: var(--cc-primary-soft);
}

.cc-context-banner > div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.cc-context-banner strong {
    overflow: hidden;
    color: var(--cc-text);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-context-banner small {
    color: var(--cc-text-secondary);
    font-size: 11px;
}

.cc-context-kicker {
    color: var(--cc-primary);
    font-size: 9.5px;
    font-weight: 750;
    letter-spacing: .045em;
    text-transform: uppercase;
}

@media (max-width: 980px) {
    .cc-config-split {
        grid-template-columns: 1fr;
    }
}

.cc-dialog-note {
    margin-top: 10px;
    padding: 9px 11px;
    color: var(--cc-text-secondary);
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 7px;
    font-size: 11px;
    line-height: 1.4;
}

.cc-dialog-inline-field {
    display: grid;
    grid-template-columns: minmax(180px, 280px) 1fr;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
}

.cc-dialog-inline-field > span {
    color: var(--cc-text-muted);
    font-size: 11px;
}

@media (max-width: 700px) {
    .cc-dialog-inline-field {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   Participantes — vigentes primero, historial separado
   ============================================================ */
.cc-participant-history {
    margin-top: 14px;
}

.cc-participant-history > summary {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    background: var(--cc-surface-soft);
    color: var(--cc-text-secondary);
    cursor: pointer;
    font-size: .76rem;
    font-weight: 700;
    user-select: none;
}

.cc-participant-history[open] > summary {
    margin-bottom: 10px;
}

.cc-participant-history-body {
    margin-top: 0;
}

.cc-form-hint-box {
    display: flex;
    align-items: center;
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid var(--cc-border-soft);
    border-radius: 7px;
    background: var(--cc-surface-soft);
    color: var(--cc-text-muted);
    font-size: .72rem;
    line-height: 1.35;
}

.cc-dialog-copy {
    margin: 0;
    color: var(--cc-text-secondary);
    font-size: .78rem;
    line-height: 1.5;
}

/* =========================================================
   BLOQUE 3 · IDENTIDAD / SEGURIDAD / IMPLANTACIÓN
   ========================================================= */
.cc-brand-logo {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 10px;
    overflow: hidden;
    display: grid;
    place-items: center;
    background: var(--cc-surface-soft, #f4f6f8);
}

.cc-brand-logo img,
.cc-login-logo img,
.cc-logo-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.cc-login-logo {
    width: 82px;
    height: 82px;
    margin: 0 auto 18px;
    border-radius: 18px;
    overflow: hidden;
    display: grid;
    place-items: center;
    background: #fff;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .10);
    padding: 8px;
}

.cc-branding-editor {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 16px;
    border: 1px solid var(--cc-border, #e3e8ef);
    border-radius: 14px;
    background: var(--cc-surface-soft, #f8fafc);
}

.cc-logo-preview {
    width: 94px;
    height: 94px;
    flex: 0 0 94px;
    display: grid;
    place-items: center;
    border: 1px solid var(--cc-border, #e3e8ef);
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    font-size: 32px;
    font-weight: 700;
}

.cc-logo-actions { display: grid; gap: 6px; min-width: 0; }
.cc-logo-actions small { color: var(--cc-muted, #64748b); }

.cc-implantation-status {
    margin-top: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid var(--cc-border, #e3e8ef);
}
.cc-implantation-status > div { flex: 1; display: grid; gap: 2px; }
.cc-implantation-status > div span { color: var(--cc-muted, #64748b); font-size: .88rem; }
.cc-implantation-status.is-ready { background: rgba(22, 163, 74, .06); }
.cc-implantation-status.is-preparing { background: rgba(202, 138, 4, .06); }

.cc-implantation-type-info {
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--cc-surface-soft, #f8fafc);
    display: grid;
    gap: 2px;
}
.cc-implantation-type-info span { color: var(--cc-muted, #64748b); }

.cc-requirements-panel {
    margin-top: 14px;
    border: 1px solid var(--cc-border, #e3e8ef);
    border-radius: 14px;
    overflow: hidden;
}
.cc-requirements-panel.is-ready { border-color: rgba(22, 163, 74, .28); }
.cc-requirements-panel.has-missing { border-color: rgba(217, 119, 6, .30); }
.cc-requirements-head,
.cc-requirement-row {
    display: flex;
    align-items: center;
    gap: 12px;
}
.cc-requirements-head {
    padding: 14px 16px;
    background: var(--cc-surface-soft, #f8fafc);
}
.cc-requirements-head > div,
.cc-requirement-row > div { flex: 1; min-width: 0; display: grid; gap: 2px; }
.cc-requirements-head span,
.cc-requirement-row span { color: var(--cc-muted, #64748b); font-size: .86rem; }
.cc-requirement-row { padding: 11px 16px; border-top: 1px solid var(--cc-border, #e3e8ef); }
.cc-requirement-row .is-ok { color: #16a34a; }
.cc-requirement-row .is-missing { color: #d97706; }

.cc-report-brand-inline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    vertical-align: middle;
}
.cc-report-brand-inline img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    border-radius: 5px;
}

.cc-permission-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 14px;
}
.cc-permission-item,
.cc-check-option {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 9px 10px;
    border: 1px solid var(--cc-border, #e3e8ef);
    border-radius: 9px;
    background: var(--cc-surface, #fff);
}
.cc-check-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.cc-check-option span { display: grid; gap: 2px; }
.cc-check-option small { color: var(--cc-muted, #64748b); }

@media (max-width: 760px) {
    .cc-branding-editor { align-items: flex-start; flex-direction: column; }
    .cc-permission-grid, .cc-check-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   BLOQUE 3 · AJUSTE VISUAL / ENDURECIMIENTO RESPONSIVE
   Implantación, usuarios, roles y configuración institucional
   ============================================================ */
.cc-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px 13px;
    border-bottom: 1px solid var(--cc-border-soft);
}

.cc-panel-header > div {
    min-width: 0;
}

.cc-panel-header .cc-section-title {
    margin: 0;
}

.cc-panel-body {
    min-width: 0;
    padding: 18px;
}

.cc-panel-body-flush {
    padding: 0;
}

.cc-grid-scroll {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.cc-grid-scroll > .rz-data-grid {
    min-width: 760px;
}

.cc-security-page,
.cc-implantation-page {
    min-width: 0;
}

/* Seguridad · usuarios */
.cc-security-users-panel {
    overflow: hidden;
}

.cc-security-users-grid {
    min-width: 1040px;
}

.cc-security-users-grid .rz-cell-data,
.cc-security-role-grid .rz-cell-data,
.cc-implantation-history-grid .rz-cell-data,
.cc-implantation-preview-grid .rz-cell-data {
    min-width: 0;
}

.cc-role-tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    min-width: 0;
    padding: 2px 0;
}

.cc-role-tag {
    display: inline-flex;
    align-items: center;
    max-width: 180px;
    min-height: 24px;
    padding: 3px 8px;
    overflow: hidden;
    color: var(--cc-text-secondary);
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 650;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-role-tag.is-empty {
    color: var(--cc-text-muted);
    font-weight: 500;
}

.cc-security-row-actions {
    min-width: 110px;
}

/* Seguridad · roles y permisos */
.cc-security-create-card {
    margin-bottom: 14px;
    overflow: hidden;
}

.cc-security-role-create {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(360px, .95fr);
    align-items: center;
    gap: 20px;
    padding: 16px 18px;
}

.cc-security-role-create > div:first-child {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.cc-security-role-create strong {
    color: var(--cc-text);
    font-size: 13px;
}

.cc-security-role-create > div:first-child span {
    color: var(--cc-text-muted);
    font-size: 11px;
    line-height: 1.4;
}

.cc-security-role-create-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.cc-security-layout {
    display: grid;
    grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
    align-items: start;
    gap: 14px;
    min-width: 0;
}

.cc-security-role-list,
.cc-security-permissions-panel {
    min-width: 0;
    overflow: hidden;
}

.cc-security-role-grid {
    min-width: 410px;
}

.cc-security-empty {
    display: grid;
    justify-items: center;
    gap: 8px;
    min-height: 310px;
    padding: 48px 24px;
    place-content: center;
    text-align: center;
}

.cc-security-empty-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: 2px;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-radius: 14px;
}

.cc-security-empty-icon .rzi {
    font-size: 25px;
}

.cc-security-empty strong {
    color: var(--cc-text);
    font-size: 13.5px;
}

.cc-security-empty span {
    max-width: 420px;
    color: var(--cc-text-muted);
    font-size: 11.5px;
    line-height: 1.45;
}

.cc-security-permissions-head {
    align-items: center;
}

.cc-security-role-title-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.cc-security-permissions-body {
    display: grid;
    gap: 12px;
    padding: 16px 18px 18px;
}

.cc-security-protected-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 11px 12px;
    color: var(--cc-text-secondary);
    background: color-mix(in srgb, var(--cc-primary) 5%, var(--cc-surface));
    border: 1px solid color-mix(in srgb, var(--cc-primary) 18%, var(--cc-border));
    border-radius: 9px;
}

.cc-security-protected-note.compact {
    margin-bottom: 10px;
}

.cc-security-protected-note > .rzi {
    flex: 0 0 auto;
    margin-top: 1px;
    color: var(--cc-primary);
    font-size: 18px;
}

.cc-security-protected-note > div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.cc-security-protected-note strong {
    color: var(--cc-text);
    font-size: 11.5px;
}

.cc-security-protected-note span {
    color: var(--cc-text-muted);
    font-size: 10.5px;
    line-height: 1.4;
}

.cc-permission-group {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--cc-border-soft);
    border-radius: 10px;
    background: var(--cc-surface-soft);
}

.cc-permission-group-head {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--cc-border-soft);
}

.cc-permission-group-icon {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-radius: 8px;
}

.cc-permission-group-head > div:last-child {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.cc-permission-group-head strong {
    color: var(--cc-text);
    font-size: 11.5px;
}

.cc-permission-group-head span {
    color: var(--cc-text-muted);
    font-size: 9.5px;
}

.cc-permission-group .cc-permission-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 7px;
    padding: 10px;
}

.cc-permission-item {
    min-width: 0;
    min-height: 42px;
    align-items: center;
    padding: 8px 10px;
    cursor: pointer;
    transition: border-color .12s ease, background .12s ease;
}

.cc-permission-item > span {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--cc-text-secondary);
    font-size: 11px;
    line-height: 1.35;
}

.cc-permission-item.is-selected {
    border-color: color-mix(in srgb, var(--cc-primary) 30%, var(--cc-border));
    background: color-mix(in srgb, var(--cc-primary) 4%, var(--cc-surface));
}

/* Seguridad · diálogos */
.cc-security-dialog {
    max-height: min(72vh, 720px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 2px 4px 4px 2px;
}

.cc-security-dialog .cc-dialog-section {
    min-width: 0;
    padding: 14px;
}

.cc-security-dialog .cc-dialog-section-title {
    margin-bottom: 11px;
}

.cc-security-form-grid > * {
    min-width: 0;
}

.cc-security-field-block {
    display: grid;
    gap: 5px;
    margin-top: 12px;
    min-width: 0;
}

.cc-field-help {
    color: var(--cc-text-muted);
    font-size: 10.5px;
    line-height: 1.4;
}

.cc-security-role-options {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 8px;
}

.cc-security-role-options .cc-check-option,
.cc-security-policy-option {
    min-width: 0;
    overflow: hidden;
}

.cc-security-role-options .cc-check-option.is-selected,
.cc-security-policy-option:has(input:checked) {
    border-color: color-mix(in srgb, var(--cc-primary) 30%, var(--cc-border));
    background: color-mix(in srgb, var(--cc-primary) 4%, var(--cc-surface));
}

.cc-security-policy-option {
    margin-top: 12px;
}

.cc-security-dialog-actions {
    position: sticky;
    bottom: -4px;
    z-index: 2;
    margin-top: 0;
    padding: 12px 2px 2px;
    background: linear-gradient(to bottom, transparent 0, var(--cc-surface) 22px);
}

.cc-security-user-summary {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
    background: var(--cc-surface-soft);
}

.cc-security-user-avatar {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-radius: 9px;
}

.cc-security-user-summary > div:nth-child(2) {
    display: grid;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.cc-security-user-summary strong,
.cc-security-user-summary span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-security-user-summary strong {
    color: var(--cc-text);
    font-size: 12px;
}

.cc-security-user-summary > div:nth-child(2) span {
    color: var(--cc-text-muted);
    font-size: 10.5px;
}

.cc-security-password-action {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.cc-security-loading {
    padding: 18px 4px;
}

/* Implantación */
.cc-implantation-summary,
.cc-implantation-workspace,
.cc-implantation-history,
.cc-implantation-secondary-panel {
    margin-top: 14px;
    overflow: hidden;
}

.cc-implantation-summary:first-of-type {
    margin-top: 0;
}

.cc-implantation-summary-body .cc-metric-strip {
    margin-bottom: 0;
}

.cc-implantation-metrics-second {
    margin-top: 10px;
}

.cc-implantation-selector {
    display: grid;
    grid-template-columns: minmax(300px, 1.15fr) minmax(300px, .85fr);
    align-items: end;
    gap: 14px;
    min-width: 0;
}

.cc-template-download {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 0;
    min-height: 42px;
}

.cc-template-download > span {
    min-width: 0;
    color: var(--cc-text-muted);
    font-size: 10.5px;
    line-height: 1.35;
    text-align: right;
}

.cc-template-download .rz-button {
    flex: 0 0 auto;
}

.cc-implantation-type-info {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 14px;
    padding: 11px 12px;
}

.cc-implantation-type-info > div:last-child {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.cc-implantation-type-info strong,
.cc-implantation-type-info span {
    overflow-wrap: anywhere;
}

.cc-implantation-type-icon {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-radius: 8px;
}

.cc-requirements-panel {
    overflow: hidden;
}

.cc-requirements-head {
    min-height: 58px;
}

.cc-requirements-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 28px;
    padding: 4px 8px;
    flex: 0 0 auto;
    color: #9a5c05;
    background: rgba(217, 119, 6, .09);
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 750;
}

.cc-requirements-count.is-ready {
    color: #15803d;
    background: rgba(22, 163, 74, .09);
}

.cc-requirements-list {
    display: grid;
}

.cc-requirement-row {
    min-width: 0;
}

.cc-requirement-row.is-complete {
    min-height: 50px;
    padding-top: 8px;
    padding-bottom: 8px;
}

.cc-requirement-row.is-missing {
    min-height: 58px;
    background: rgba(217, 119, 6, .035);
}

.cc-requirement-row > .rzi {
    flex: 0 0 auto;
}

.cc-requirement-row > div {
    overflow-wrap: anywhere;
}

.cc-requirement-row > .rz-button {
    flex: 0 0 auto;
}

.cc-implantation-upload-block {
    margin-top: 16px;
    padding-top: 15px;
    border-top: 1px solid var(--cc-border-soft);
}

.cc-implantation-upload-heading {
    display: grid;
    gap: 2px;
    margin-bottom: 10px;
}

.cc-implantation-upload-heading strong {
    color: var(--cc-text);
    font-size: 12px;
}

.cc-implantation-upload-heading span {
    color: var(--cc-text-muted);
    font-size: 10.5px;
    line-height: 1.4;
}

.cc-implantation-upload-grid {
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(300px, 1fr);
    align-items: stretch;
    gap: 14px;
    min-width: 0;
}

.cc-file-upload-large {
    justify-content: flex-start;
    min-width: 0;
    min-height: 43px;
    padding: 7px 12px;
}

.cc-file-upload-large > .rzi {
    flex: 0 0 auto;
    font-size: 18px;
}

.cc-file-upload-large > span {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.cc-file-upload-large strong,
.cc-file-upload-large small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-file-upload-large strong {
    font-size: 11.5px;
}

.cc-file-upload-large small {
    color: var(--cc-text-muted);
    font-size: 9.5px;
    font-weight: 500;
}

.cc-implantation-upload-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.cc-implantation-history-grid {
    min-width: 1110px;
}

.cc-implantation-preview-grid {
    min-width: 1010px;
}

/* Institución */
.cc-logo-action-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 3px;
}

.cc-logo-upload {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 0 11px;
    color: var(--cc-primary);
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: 6px;
    font-size: 11.5px;
    font-weight: 650;
    cursor: pointer;
}

.cc-logo-upload:hover {
    border-color: var(--cc-primary);
}

.cc-logo-upload input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.cc-institution-card,
.cc-branding-editor,
.cc-institution-grid,
.cc-institution-grid > *,
.cc-logo-actions {
    min-width: 0;
}

.cc-implantation-status {
    margin: 16px;
}

@media (max-width: 1180px) {
    .cc-security-layout {
        grid-template-columns: minmax(280px, 330px) minmax(0, 1fr);
    }

    .cc-permission-group .cc-permission-grid {
        grid-template-columns: 1fr;
    }

    .cc-security-role-create {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

@media (max-width: 900px) {
    .cc-security-layout {
        grid-template-columns: 1fr;
    }

    .cc-security-role-list {
        max-height: none;
    }

    .cc-implantation-selector,
    .cc-implantation-upload-grid {
        grid-template-columns: 1fr;
    }

    .cc-template-download {
        justify-content: space-between;
    }

    .cc-template-download > span {
        text-align: left;
    }
}

@media (max-width: 760px) {
    .cc-panel-header,
    .cc-security-permissions-head {
        align-items: stretch;
        flex-direction: column;
        padding: 14px;
    }

    .cc-panel-body,
    .cc-security-permissions-body {
        padding: 14px;
    }

    .cc-panel-body-flush {
        padding: 0;
    }

    .cc-security-role-create {
        padding: 14px;
    }

    .cc-security-role-create-actions {
        grid-template-columns: 1fr;
    }

    .cc-security-role-create-actions .rz-button {
        width: 100%;
    }

    .cc-security-role-options,
    .cc-permission-group .cc-permission-grid {
        grid-template-columns: 1fr;
    }

    .cc-security-dialog {
        max-height: 70vh;
    }

    .cc-template-download {
        align-items: stretch;
        flex-direction: column;
    }

    .cc-template-download .rz-button,
    .cc-implantation-upload-actions .rz-button {
        width: 100%;
    }

    .cc-requirements-head {
        padding: 12px 13px;
    }

    .cc-requirement-row {
        align-items: flex-start;
        flex-wrap: wrap;
        padding: 10px 13px;
    }

    .cc-requirement-row > .rz-button {
        width: 100%;
        margin-left: 30px;
    }

    .cc-branding-editor {
        padding: 14px;
    }

    .cc-implantation-status {
        align-items: flex-start;
        flex-wrap: wrap;
        margin: 14px;
    }

    .cc-implantation-status .rz-button {
        width: 100%;
        margin-left: 30px;
    }
}

/* =========================================================
   Bloque 4 — analítica, archivo documental y plantillas
   ========================================================= */
.cc-page-eyebrow {
    margin-bottom: 4px;
    color: var(--cc-primary);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.cc-button-link {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 13px;
    color: var(--cc-text);
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: 7px;
    font-size: 11.5px;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
}
.cc-button-link:hover { color: var(--cc-primary); border-color: #d7c2cd; text-decoration: none; }
.cc-button-light { background: var(--cc-surface); }

.cc-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
    gap: 14px;
    margin-bottom: 14px;
}
.cc-dashboard-panel { min-width: 0; padding: 16px; }
.cc-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 13px;
}
.cc-panel-heading h2,
.cc-panel-heading strong { margin: 0; color: var(--cc-text); font-size: 14px; font-weight: 720; }
.cc-panel-heading p,
.cc-panel-heading span { display: block; margin: 3px 0 0; color: var(--cc-text-muted); font-size: 10.5px; line-height: 1.4; }

.cc-trend-list { display: grid; gap: 9px; }
.cc-trend-row {
    display: grid;
    grid-template-columns: 88px minmax(120px, 1fr) 125px;
    align-items: center;
    gap: 10px;
    min-height: 26px;
    font-size: 11px;
}
.cc-trend-row > span { color: var(--cc-text-secondary); }
.cc-trend-row > strong { text-align: right; font-variant-numeric: tabular-nums; }
.cc-trend-track { height: 8px; overflow: hidden; background: var(--cc-surface-soft); border-radius: 999px; }
.cc-trend-track > i { display: block; height: 100%; min-width: 2px; background: var(--cc-primary); border-radius: inherit; }
.cc-trend-track > i.cc-trend-negative { background: var(--cc-danger); }

.cc-alert-list { display: grid; gap: 8px; }
.cc-alert-item {
    display: block;
    width: 100%;
    padding: 11px 12px;
    color: inherit;
    background: #fff;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
}
.cc-alert-item:hover { border-color: #d8c3ce; background: #fcfafb; }
.cc-alert-item strong { display: block; color: var(--cc-text); font-size: 11.5px; }
.cc-alert-item span { display: block; margin-top: 3px; color: var(--cc-text-muted); font-size: 10.5px; line-height: 1.4; }
.cc-empty-compact { min-height: 0; padding: 18px; }

.cc-kpi-strip {
    display: grid;
    gap: 1px;
    overflow: hidden;
    margin-bottom: 14px;
    background: var(--cc-border-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: var(--cc-radius-lg);
    box-shadow: var(--cc-shadow-sm);
}
.cc-kpi-strip-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cc-kpi-mini { min-width: 0; padding: 12px 14px; background: var(--cc-surface); }
.cc-kpi-mini span { display: block; color: var(--cc-text-muted); font-size: 9.5px; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.cc-kpi-mini strong { display: block; margin-top: 4px; overflow: hidden; color: var(--cc-text); font-size: 16px; font-weight: 720; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }

.cc-analyst-table-card { min-width: 0; overflow: hidden; }
.cc-table-toolbar {
    display: flex;
    min-height: 52px;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 14px;
    border-bottom: 1px solid var(--cc-border-soft);
}
.cc-table-toolbar strong { display: block; color: var(--cc-text); font-size: 12.5px; }
.cc-table-toolbar span { display: block; margin-top: 2px; color: var(--cc-text-muted); font-size: 10px; }
.cc-table-scroll { width: 100%; overflow-x: auto; }
.cc-data-table { width: 100%; min-width: 960px; border-collapse: separate; border-spacing: 0; font-size: 11px; }
.cc-data-table th { padding: 9px 10px; color: var(--cc-text-muted); background: #fafafd; border-bottom: 1px solid var(--cc-border); font-size: 9.5px; font-weight: 700; letter-spacing: .035em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.cc-data-table td { padding: 8px 10px; border-bottom: 1px solid var(--cc-border-soft); vertical-align: middle; }
.cc-data-table tbody tr:last-child td { border-bottom: 0; }
.cc-data-table tbody tr:hover td { background: #fcfbfc; }
.cc-data-table-roomy td { padding-top: 10px; padding-bottom: 10px; }
.cc-data-table .cc-money,
.cc-data-table .cc-number { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cc-actions-cell { width: 1%; text-align: right; white-space: nowrap; }
.cc-inline-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 5px; }
.cc-icon-action:not(.rz-button) {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    padding: 0;
    color: var(--cc-text-secondary);
    background: #fff;
    border: 1px solid var(--cc-border-soft);
    border-radius: 7px;
    cursor: pointer;
    text-decoration: none;
}
.cc-icon-action:not(.rz-button):hover { color: var(--cc-primary); border-color: #d8c3ce; background: #fcfafb; }
.cc-icon-action .rz-icon { font-size: 17px; }

.cc-doc-legend { display: flex; align-items: center; gap: 7px; }

.cc-template-layout {
    display: grid;
    grid-template-columns: minmax(250px, 330px) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}
.cc-template-list,
.cc-template-editor { min-width: 0; padding: 14px; }
.cc-template-list { max-height: calc(100vh - 205px); overflow-y: auto; }
.cc-template-list-item {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 7px;
    padding: 10px 11px;
    color: inherit;
    background: #fff;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
}
.cc-template-list-item:last-child { margin-bottom: 0; }
.cc-template-list-item:hover { border-color: #d8c3ce; }
.cc-template-list-item.is-selected { background: var(--cc-primary-soft); border-color: #d7becb; }
.cc-template-list-item > div { min-width: 0; }
.cc-template-list-item strong { display: block; overflow: hidden; font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.cc-template-list-item span:not(.cc-status) { display: block; margin-top: 3px; overflow: hidden; color: var(--cc-text-muted); font-size: 9.8px; text-overflow: ellipsis; white-space: nowrap; }
.cc-template-switches { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 12px 0; color: var(--cc-text-secondary); font-size: 11px; }
.cc-template-switches span + .rz-checkbox { margin-left: 10px; }
.cc-template-variables { margin-top: 12px; padding: 11px 12px; background: var(--cc-surface-soft); border: 1px solid var(--cc-border-soft); border-radius: 8px; }
.cc-template-variables > strong { display: block; margin-bottom: 8px; font-size: 10.5px; }
.cc-template-variables > div { display: flex; flex-wrap: wrap; gap: 5px; }
.cc-template-variables button { padding: 4px 7px; color: var(--cc-primary); background: #fff; border: 1px solid #dccbd4; border-radius: 5px; cursor: pointer; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9.5px; }
.cc-template-variables button:hover { background: var(--cc-primary-soft); }
.cc-form-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }

.cc-share-dialog { display: grid; gap: 12px; }
.cc-document-share-summary { display: flex; align-items: center; gap: 10px; padding: 11px 12px; background: var(--cc-surface-soft); border: 1px solid var(--cc-border-soft); border-radius: 8px; }
.cc-document-share-summary > .rz-icon { color: var(--cc-primary); font-size: 22px; }
.cc-document-share-summary strong { display: block; font-size: 12px; }
.cc-document-share-summary span { display: block; margin-top: 2px; color: var(--cc-text-muted); font-size: 10.5px; }
.cc-share-result { padding: 11px 12px; background: #f8fafc; border: 1px solid #dbe5ec; border-radius: 8px; }
.cc-share-result > span { display: block; margin-bottom: 5px; color: var(--cc-text-muted); font-size: 9.5px; font-weight: 700; text-transform: uppercase; }
.cc-share-result small { display: block; margin-top: 5px; color: var(--cc-text-muted); font-size: 9.5px; }
.cc-share-url { display: grid; grid-template-columns: minmax(0, 1fr) 34px; overflow: hidden; background: #fff; border: 1px solid var(--cc-border); border-radius: 6px; }
.cc-share-url input { width: 100%; min-width: 0; padding: 7px 8px; border: 0; outline: 0; font-size: 10px; }
.cc-share-url button { display: grid; place-items: center; padding: 0; color: var(--cc-primary); background: transparent; border: 0; border-left: 1px solid var(--cc-border-soft); cursor: pointer; }

@media (max-width: 1100px) {
    .cc-dashboard-grid { grid-template-columns: 1fr; }
    .cc-kpi-strip-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cc-template-layout { grid-template-columns: 1fr; }
    .cc-template-list { max-height: 340px; }
}

@media (max-width: 760px) {
    .cc-kpi-strip-4 { grid-template-columns: 1fr; }
    .cc-trend-row { grid-template-columns: 72px minmax(80px, 1fr) 92px; gap: 7px; }
    .cc-table-toolbar { align-items: flex-start; flex-direction: column; }
    .cc-template-editor,
    .cc-template-list { padding: 11px; }
    .cc-document-share-summary { align-items: flex-start; }
}
.cc-analyst-page,
.cc-documents-page,
.cc-template-page { min-width: 0; }

/* Bloque 4 — detalles de acciones documentales */
.cc-empty {
    padding: 24px;
    color: var(--cc-text-muted);
    text-align: center;
}

.cc-loan-documents-panel {
    margin-bottom: 16px;
    padding: 14px 16px;
}

.cc-document-actions,
.cc-simulation-document-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.cc-text-link {
    color: var(--cc-primary);
    font-size: 10.5px;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
}
.cc-text-link:hover { text-decoration: underline; }

.cc-reference-line,
.cc-reference-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.cc-report-totals-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

@media (max-width: 1100px) {
    .cc-report-totals-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .cc-document-actions,
    .cc-simulation-document-actions { align-items: stretch; flex-direction: column; }
    .cc-document-actions .rz-button,
    .cc-simulation-document-actions .rz-button { width: 100%; }
    .cc-report-totals-6 { grid-template-columns: 1fr; }
}

/* ===== Bloque 5: dashboards, espaciado y visor documental ===== */
.cc-dashboard-page .cc-page-header,
.cc-home-dashboard .cc-page-header { margin-bottom: 16px; }

.cc-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}
.cc-panel-heading > div { min-width: 0; }
.cc-panel-heading h2 { margin: 0; }
.cc-panel-heading p,
.cc-panel-heading span { margin-top: 4px; line-height: 1.45; }
.cc-panel-heading-compact { margin-top: 2px; }
.cc-panel-link {
    flex: 0 0 auto;
    padding: 4px 2px;
    color: var(--cc-primary);
    font-size: 11px;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
}
.cc-panel-link:hover { text-decoration: underline; }

.cc-metric-button {
    width: 100%;
    min-width: 0;
    margin: 0;
    font: inherit;
    text-align: left;
    cursor: pointer;
    border: 0;
    border-left: 1px solid var(--cc-border-soft);
}
.cc-metric-button:first-child { border-left: 0; }
.cc-metric-button:hover { background: color-mix(in srgb, var(--cc-primary) 5%, #fff); }
.cc-metric-button:focus-visible { position: relative; z-index: 1; outline: 2px solid color-mix(in srgb, var(--cc-primary) 55%, transparent); outline-offset: -2px; }

.cc-dashboard-grid-risk { grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr); }
.cc-dashboard-grid-alerts { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
.cc-dashboard-divider { height: 1px; margin: 17px 0 14px; background: var(--cc-border-soft); }

.cc-aging-chart { display: grid; gap: 7px; }
.cc-aging-row {
    display: grid;
    grid-template-columns: 92px minmax(90px,1fr) 118px 70px;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 7px 5px;
    background: transparent;
    border: 0;
    border-radius: 7px;
    color: inherit;
    text-align: left;
    cursor: pointer;
}
.cc-aging-row:hover { background: var(--cc-surface-soft); }
.cc-aging-label { color: var(--cc-text-secondary); font-size: 11px; font-weight: 650; }
.cc-aging-bar-track { height: 9px; overflow: hidden; background: var(--cc-surface-soft); border-radius: 999px; }
.cc-aging-bar-track i { display: block; height: 100%; min-width: 2px; background: var(--cc-danger); border-radius: inherit; }
.cc-aging-row > strong { text-align: right; font-size: 11.5px; font-variant-numeric: tabular-nums; }
.cc-aging-row > small { color: var(--cc-text-muted); font-size: 10px; text-align: right; }
.cc-chart-footnote { margin-top: 12px; color: var(--cc-text-muted); font-size: 10px; line-height: 1.45; }

.cc-bucket-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.cc-bucket-card { padding: 12px; background: var(--cc-surface-soft); border: 1px solid var(--cc-border-soft); border-radius: 8px; text-align: left; cursor: pointer; }
.cc-bucket-card:hover { border-color: color-mix(in srgb, var(--cc-primary) 35%, var(--cc-border)); }
.cc-bucket-card span,.cc-bucket-card small { display: block; color: var(--cc-text-muted); font-size: 9.8px; }
.cc-bucket-card strong { display: block; margin: 5px 0 4px; font-size: 14px; font-variant-numeric: tabular-nums; }

.cc-dual-chart { display: grid; gap: 10px; }
.cc-dual-row { display: grid; grid-template-columns: 74px minmax(100px,1fr) 104px; align-items: center; gap: 10px; }
.cc-dual-row > span { color: var(--cc-text-secondary); font-size: 10.5px; }
.cc-dual-row > strong { text-align: right; font-size: 10.8px; font-variant-numeric: tabular-nums; }
.cc-dual-bars { display: grid; gap: 4px; }
.cc-dual-bars > div { position: relative; height: 11px; overflow: hidden; background: var(--cc-surface-soft); border-radius: 999px; }
.cc-dual-bars i { display: block; height: 100%; min-width: 2px; border-radius: inherit; }
.cc-dual-bars small { position: absolute; inset: 0 5px; color: var(--cc-text-muted); font-size: 7.5px; line-height: 11px; text-align: right; pointer-events: none; }
.cc-bar-positive { background: color-mix(in srgb, var(--cc-primary) 75%, #fff); }
.cc-bar-neutral { background: color-mix(in srgb, var(--cc-text-muted) 42%, #fff); }

.cc-composition-list { display: grid; gap: 4px; }
.cc-composition-row { display: grid; grid-template-columns: minmax(120px,1fr) minmax(100px,1.1fr) 118px; align-items: center; gap: 12px; width: 100%; padding: 8px 6px; background: transparent; border: 0; border-radius: 7px; text-align: left; cursor: pointer; }
.cc-composition-row:hover { background: var(--cc-surface-soft); }
.cc-composition-row > span:first-child { min-width: 0; }
.cc-composition-row > span:first-child strong,.cc-composition-row > span:first-child small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cc-composition-row > span:first-child strong { font-size: 11px; }
.cc-composition-row > span:first-child small { margin-top: 2px; color: var(--cc-text-muted); font-size: 9.5px; }
.cc-composition-bar { height: 9px; overflow: hidden; background: var(--cc-surface-soft); border-radius: 999px; }
.cc-composition-bar i { display: block; height: 100%; min-width: 2px; background: var(--cc-primary); border-radius: inherit; }
.cc-composition-values { text-align: right; }
.cc-composition-values strong,.cc-composition-values small { display: block; }
.cc-composition-values strong { font-size: 10.8px; font-variant-numeric: tabular-nums; }
.cc-composition-values small { color: var(--cc-text-muted); font-size: 9px; }

.cc-ratio-block { padding: 12px 2px 4px; }
.cc-ratio-head,.cc-ratio-foot { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.cc-ratio-head span,.cc-ratio-foot span { color: var(--cc-text-muted); font-size: 10.5px; }
.cc-ratio-head strong { font-size: 13px; }
.cc-ratio-track { height: 12px; overflow: hidden; margin: 10px 0 7px; background: var(--cc-surface-soft); border-radius: 999px; }
.cc-ratio-track i { display: block; height: 100%; min-width: 1px; background: var(--cc-primary); border-radius: inherit; }
.cc-ratio-track i.cc-ratio-danger { background: var(--cc-danger); }

.cc-home-module-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-bottom: 14px; }
.cc-home-module-card { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 12px; min-width: 0; padding: 16px; background: #fff; border: 1px solid var(--cc-border); border-radius: var(--cc-radius-lg); box-shadow: var(--cc-shadow-sm); text-align: left; cursor: pointer; }
.cc-home-module-card:hover { border-color: color-mix(in srgb,var(--cc-primary) 28%,var(--cc-border)); box-shadow: 0 5px 16px rgba(32,24,29,.07); }
.cc-home-module-icon { display: grid; place-items: center; width: 40px; height: 40px; color: var(--cc-primary); background: var(--cc-primary-soft); border-radius: 10px; }
.cc-home-module-copy { min-width: 0; }
.cc-home-module-copy small,.cc-home-module-copy strong,.cc-home-module-copy em { display: block; }
.cc-home-module-copy small { color: var(--cc-text-muted); font-size: 10px; font-weight: 650; text-transform: uppercase; }
.cc-home-module-copy strong { margin: 3px 0; font-size: 18px; font-style: normal; font-variant-numeric: tabular-nums; }
.cc-home-module-copy em { overflow: hidden; color: var(--cc-text-secondary); font-size: 10px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.cc-home-module-status { padding: 5px 8px; border-radius: 999px; font-size: 9.5px; font-weight: 650; white-space: nowrap; }
.cc-home-status-ok { color: #166534; background: #ecfdf3; }
.cc-home-status-info { color: #1e40af; background: #eff6ff; }
.cc-home-status-warning { color: #92400e; background: #fff7ed; }
.cc-home-status-danger { color: #991b1b; background: #fef2f2; }
.cc-home-main-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-bottom: 14px; }
.cc-home-alerts { display: grid; gap: 6px; }
.cc-home-alert-row { display: grid; grid-template-columns: minmax(0,1fr) 120px 130px; align-items: center; gap: 10px; padding: 10px 11px; background: var(--cc-surface-soft); border: 1px solid transparent; border-radius: 8px; text-align: left; cursor: pointer; }
.cc-home-alert-row:hover { border-color: var(--cc-border); }
.cc-home-alert-row > span { display: flex; align-items: center; gap: 7px; min-width: 0; }
.cc-home-alert-row > span strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.cc-home-alert-row em { color: var(--cc-text-muted); font-size: 9.5px; font-style: normal; }
.cc-home-alert-row b { font-size: 11px; text-align: right; font-variant-numeric: tabular-nums; }
.cc-home-alert-row.is-danger b { color: var(--cc-danger); }
.cc-home-alert-row.is-warning b { color: #9a5b14; }
.cc-home-flow-list { display: grid; gap: 0; }
.cc-home-flow-row { display: grid; grid-template-columns: 100px 68px 1fr 78px 1fr; gap: 8px; align-items: center; padding: 11px 2px; border-bottom: 1px solid var(--cc-border-soft); }
.cc-home-flow-row:last-child { border-bottom: 0; }
.cc-home-flow-row > span { font-size: 11px; font-weight: 650; }
.cc-home-flow-row small { color: var(--cc-text-muted); font-size: 9px; }
.cc-home-flow-row strong { font-size: 10.5px; text-align: right; font-variant-numeric: tabular-nums; }
.cc-quick-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.cc-quick-actions button { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 10px 12px; color: var(--cc-text); background: var(--cc-surface-soft); border: 1px solid var(--cc-border-soft); border-radius: 8px; cursor: pointer; }
.cc-quick-actions button:hover { color: var(--cc-primary); border-color: color-mix(in srgb,var(--cc-primary) 32%,var(--cc-border)); }
.cc-quick-actions .rz-icon { font-size: 18px; }
.cc-quick-actions span { font-size: 10.5px; font-weight: 650; }
.cc-home-empty { display: flex; align-items: center; gap: 14px; padding: 22px; }
.cc-home-empty .rz-icon { color: var(--cc-primary); font-size: 30px; }
.cc-home-empty strong,.cc-home-empty span { display: block; }
.cc-home-empty span { margin-top: 4px; color: var(--cc-text-secondary); font-size: 11px; }

.cc-simulation-document-actions { margin-bottom: 16px; padding: 14px 16px; }
.cc-simulation-document-actions .cc-panel-heading { align-items: center; }
.cc-simulation-document-actions .cc-panel-heading strong { display: block; font-size: 12px; }
.cc-simulation-document-actions .cc-panel-heading span { display: block; color: var(--cc-text-muted); font-size: 10px; }
.cc-simulation-document-actions .rz-button { flex: 0 0 auto; }

.cc-pdf-viewer { position: fixed; inset: 0; z-index: 10050; display: grid; place-items: stretch; padding: 18px; background: rgba(24,20,23,.78); backdrop-filter: blur(3px); }
.cc-pdf-viewer-shell { display: grid; grid-template-rows: auto minmax(0,1fr); width: min(1320px,100%); height: 100%; margin: 0 auto; overflow: hidden; background: #242424; border: 1px solid rgba(255,255,255,.08); border-radius: 14px; box-shadow: 0 24px 70px rgba(0,0,0,.35); }
.cc-pdf-viewer-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 62px; padding: 10px 14px 10px 18px; background: #fff; border-bottom: 1px solid #e8e2e8; }
.cc-pdf-viewer-title { display: flex; align-items: center; min-width: 0; }
.cc-pdf-viewer-title-copy { min-width: 0; }
.cc-pdf-viewer-title strong,.cc-pdf-viewer-title small { display: block; }
.cc-pdf-viewer-title strong { color: var(--cc-text); font-size: 13px; font-weight: 800; letter-spacing: .01em; }
.cc-pdf-viewer-title small { max-width: 520px; overflow: hidden; margin-top: 3px; color: var(--cc-text-muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.cc-pdf-viewer-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.cc-pdf-viewer-button { display: inline-flex; align-items: center; justify-content: center; min-height: 32px; padding: 0 12px; color: #fff; background: var(--cc-primary); border: 1px solid var(--cc-primary); border-radius: 8px; font-size: 11px; font-weight: 700; line-height: 1; letter-spacing: .01em; white-space: nowrap; cursor: pointer; transition: background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease; }
.cc-pdf-viewer-button:hover:not(:disabled) { box-shadow: 0 8px 16px rgba(74,43,67,.16); transform: translateY(-1px); }
.cc-pdf-viewer-button.is-subtle { color: var(--cc-text); background: #fff; border-color: #d6d0d5; }
.cc-pdf-viewer-button.is-subtle:hover:not(:disabled) { box-shadow: 0 8px 16px rgba(0,0,0,.08); }
.cc-pdf-viewer-button:disabled { cursor: not-allowed; opacity: .45; box-shadow: none; transform: none; }
.cc-pdf-viewer-frame { width: 100%; height: 100%; min-height: 0; background: #3a3a3a; border: 0; }

@media (max-width: 1100px) {
    .cc-dashboard-grid-risk,.cc-dashboard-grid-alerts,.cc-home-main-grid { grid-template-columns: 1fr; }
    .cc-home-module-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .cc-panel-heading { align-items: stretch; flex-direction: column; gap: 6px; }
    .cc-panel-link { align-self: flex-start; }
    .cc-aging-row { grid-template-columns: 78px minmax(70px,1fr) 98px; }
    .cc-aging-row > small { display: none; }
    .cc-dual-row { grid-template-columns: 66px minmax(80px,1fr) 90px; }
    .cc-composition-row { grid-template-columns: minmax(100px,1fr) 1fr; }
    .cc-composition-values { display: none; }
    .cc-bucket-grid { grid-template-columns: 1fr; }
    .cc-home-alert-row { grid-template-columns: minmax(0,1fr) 100px; }
    .cc-home-alert-row em { display: none; }
    .cc-home-flow-row { grid-template-columns: 1fr auto; }
    .cc-home-flow-row small { display: none; }
    .cc-quick-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cc-pdf-viewer { padding: 0; }
    .cc-pdf-viewer-shell { border-radius: 0; }
    .cc-pdf-viewer-toolbar { align-items: stretch; flex-direction: column; padding: 12px 14px; }
    .cc-pdf-viewer-title small { max-width: 100%; }
    .cc-pdf-viewer-actions { width: 100%; overflow-x: auto; justify-content: flex-start; padding-bottom: 2px; }
    .cc-pdf-viewer-button { flex: 0 0 auto; }
}

/* Bloque 5 - microajustes de separación en encabezados/acciones */
.cc-record-section-header { justify-content: space-between; gap: 16px; }
.cc-record-section-header > :first-child { min-width: 0; }
.cc-record-section-header .cc-record-link { flex: 0 0 auto; margin-left: auto; white-space: nowrap; }
.cc-inline-actions-spaced { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.cc-account-table-head { gap: 16px; }
.cc-account-table-head > div { min-width: 0; }
.cc-account-table-head > .rz-button { flex: 0 0 auto; }

/* Roles y permisos · listado visual */
.cc-security-role-list-head { align-items: center; }
.cc-security-role-total {
    flex: 0 0 auto;
    color: var(--cc-text-muted);
    font-size: 10px;
    white-space: nowrap;
}
.cc-security-role-cards {
    display: grid;
    gap: 8px;
    padding: 12px;
}
.cc-security-role-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    overflow: hidden;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border-soft);
    border-radius: 10px;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.cc-security-role-card:hover {
    border-color: color-mix(in srgb, var(--cc-primary) 24%, var(--cc-border));
    box-shadow: 0 5px 16px rgba(35, 27, 33, .05);
}
.cc-security-role-card.is-selected {
    background: color-mix(in srgb, var(--cc-primary) 5%, var(--cc-surface));
    border-color: color-mix(in srgb, var(--cc-primary) 36%, var(--cc-border));
    box-shadow: inset 3px 0 0 var(--cc-primary);
}
.cc-security-role-card-main {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 11px 10px 11px 12px;
    color: inherit;
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
}
.cc-security-role-card-icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-radius: 9px;
}
.cc-security-role-card-icon .rz-icon { font-size: 18px; }
.cc-security-role-card-copy { display: grid; gap: 5px; min-width: 0; }
.cc-security-role-card-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    min-width: 0;
}
.cc-security-role-card-title strong {
    overflow: hidden;
    color: var(--cc-text);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cc-security-role-card-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px 12px;
    color: var(--cc-text-muted);
    font-size: 9.8px;
}
.cc-security-role-card-meta b { color: var(--cc-text-secondary); font-weight: 700; }
.cc-security-role-chevron { color: var(--cc-text-muted); font-size: 17px; }
.cc-security-role-delete {
    display: grid;
    place-items: center;
    width: 38px;
    padding: 0;
    color: var(--cc-text-muted);
    background: transparent;
    border: 0;
    border-left: 1px solid var(--cc-border-soft);
    cursor: pointer;
}
.cc-security-role-delete:hover { color: var(--rz-danger); background: #fff7f7; }
.cc-security-role-delete .rz-icon { font-size: 17px; }
.cc-security-permission-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}
.cc-security-permission-actions .cc-panel-link {
    padding: 5px 2px;
    background: transparent;
    border: 0;
    cursor: pointer;
}

/* Plantillas legales · biblioteca y editor */
.cc-template-layout { grid-template-columns: minmax(280px, 320px) minmax(0, 1fr); gap: 16px; }
.cc-template-list { padding: 0; overflow: hidden; }
.cc-template-list-head { padding: 14px 14px 11px; border-bottom: 1px solid var(--cc-border-soft); }
.cc-template-list-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 12px 12px 8px;
}
.cc-template-summary-card {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 9px 10px;
    color: var(--cc-text-secondary);
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
    cursor: pointer;
    text-align: left;
}
.cc-template-summary-card:hover { border-color: #d8c3ce; background: var(--cc-primary-soft); }
.cc-template-summary-card > .rz-icon { flex: 0 0 auto; color: var(--cc-primary); font-size: 18px; }
.cc-template-summary-card > span { min-width: 0; }
.cc-template-summary-card strong,
.cc-template-summary-card small { display: block; }
.cc-template-summary-card strong { color: var(--cc-text); font-size: 10.8px; }
.cc-template-summary-card small { margin-top: 2px; color: var(--cc-text-muted); font-size: 8.8px; line-height: 1.25; }
.cc-template-filter-row {
    display: grid;
    gap: 7px;
    padding: 0 12px 10px;
}
.cc-template-version-list {
    display: grid;
    gap: 8px;
    max-height: calc(100vh - 390px);
    overflow-y: auto;
    padding: 0 12px 12px;
}
.cc-template-list-item {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: start;
    gap: 9px;
    margin: 0;
    padding: 11px;
    border-radius: 10px;
}
.cc-template-list-item.is-selected { box-shadow: inset 3px 0 0 var(--cc-primary); }
.cc-template-item-icon {
    display: grid !important;
    place-items: center;
    width: 34px;
    height: 34px;
    margin: 0 !important;
    color: var(--cc-primary) !important;
    background: var(--cc-primary-soft);
    border-radius: 9px;
}
.cc-template-item-icon .rz-icon { font-size: 18px; }
.cc-template-list-item > .cc-template-item-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.cc-template-list-item > .cc-template-item-copy > .cc-template-item-title {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    margin: 0;
    color: var(--cc-text);
    font-size: 11px;
}
.cc-template-list-item > .cc-template-item-copy > .cc-template-item-title strong {
    min-width: 0;
    overflow: hidden;
    font-size: 11.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cc-template-version {
    display: inline-flex !important;
    align-items: center;
    flex: 0 0 auto;
    min-height: 19px;
    margin: 0 !important;
    padding: 1px 6px;
    color: var(--cc-primary) !important;
    background: var(--cc-primary-soft);
    border-radius: 999px;
    font-size: 8.5px !important;
    font-weight: 750;
}
.cc-template-list-item > .cc-template-item-copy > .cc-template-item-code {
    display: block;
    margin: 0;
    overflow: hidden;
    color: var(--cc-text-secondary);
    font-size: 9.5px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cc-template-list-item > .cc-template-item-copy > .cc-template-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 3px 9px;
    margin: 0;
    overflow: visible;
    color: var(--cc-text-muted);
    font-size: 8.9px;
    white-space: normal;
}
.cc-template-list-item > .cc-template-item-copy > .cc-template-item-meta > span {
    display: inline;
    margin: 0;
    overflow: visible;
    color: inherit;
    font-size: inherit;
    white-space: normal;
}
.cc-template-item-state {
    display: grid !important;
    justify-items: end;
    gap: 5px;
    margin: 0 !important;
}
.cc-template-review-flag {
    display: inline-flex !important;
    margin: 0 !important;
    padding: 2px 6px;
    color: #7d5a00 !important;
    background: #fff8db;
    border: 1px solid #f0df99;
    border-radius: 999px;
    font-size: 8px !important;
    font-weight: 700;
    white-space: nowrap;
}
.cc-template-empty {
    display: grid;
    justify-items: center;
    gap: 6px;
    padding: 28px 18px;
    color: var(--cc-text-muted);
    text-align: center;
}
.cc-template-empty > .rz-icon { color: var(--cc-primary); font-size: 26px; }
.cc-template-empty strong { color: var(--cc-text-secondary); font-size: 11px; }
.cc-template-empty span { max-width: 240px; font-size: 9.5px; line-height: 1.4; }

.cc-template-editor { padding: 0; overflow: hidden; }
.cc-template-editor-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 17px;
    border-bottom: 1px solid var(--cc-border-soft);
}
.cc-template-editor-head > div:first-child { min-width: 0; }
.cc-template-editor-kicker {
    display: block;
    margin-bottom: 3px;
    color: var(--cc-primary);
    font-size: 8.5px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}
.cc-template-editor-title-line { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; min-width: 0; }
.cc-template-editor-title-line h3 { margin: 0; color: var(--cc-text); font-size: 15px; }
.cc-template-editor-head p { max-width: 720px; margin: 4px 0 0; color: var(--cc-text-muted); font-size: 10px; line-height: 1.4; }
.cc-template-editor-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.cc-template-section { padding: 15px 17px; border-bottom: 1px solid var(--cc-border-soft); }
.cc-template-section:last-child { border-bottom: 0; }
.cc-template-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.cc-template-section-heading > div:first-child { display: grid; gap: 2px; min-width: 0; }
.cc-template-section-heading strong { color: var(--cc-text); font-size: 11.5px; }
.cc-template-section-heading span { color: var(--cc-text-muted); font-size: 9.5px; line-height: 1.35; }
.cc-template-option-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 11px; }
.cc-template-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 9px;
    padding: 10px 11px;
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
    cursor: pointer;
}
.cc-template-option.is-selected { border-color: color-mix(in srgb, var(--cc-primary) 28%, var(--cc-border)); background: color-mix(in srgb, var(--cc-primary) 4%, var(--cc-surface)); }
.cc-template-option > span { display: grid; gap: 2px; min-width: 0; }
.cc-template-option strong { color: var(--cc-text-secondary); font-size: 10.5px; }
.cc-template-option small { color: var(--cc-text-muted); font-size: 9px; line-height: 1.35; }
.cc-template-content-head { align-items: flex-end; }
.cc-template-content-actions { display: flex; align-items: center; gap: 9px; flex: 0 0 auto; }
.cc-template-content-actions > span { color: var(--cc-text-muted); font-size: 9px; white-space: nowrap; }
.cc-template-content-actions .cc-button-link { min-height: 30px; padding: 5px 9px; font-size: 9.5px; cursor: pointer; }
.cc-template-content-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 310px);
    align-items: start;
    gap: 12px;
}
.cc-template-editor-field { min-width: 0; }
.cc-template-editor-field .rz-textarea { min-height: 520px; resize: vertical; }
.cc-template-editor-hint { display: block; margin-top: 6px; color: var(--cc-text-muted); font-size: 9px; }
.cc-template-variables {
    position: sticky;
    top: 12px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 10px;
}
.cc-template-variables-head { display: grid; gap: 2px; padding: 10px 11px; border-bottom: 1px solid var(--cc-border-soft); }
.cc-template-variables-head strong { margin: 0; color: var(--cc-text); font-size: 10.5px; }
.cc-template-variables-head span { color: var(--cc-text-muted); font-size: 8.8px; line-height: 1.35; }
.cc-template-variable-list { display: grid; gap: 5px; max-height: 470px; overflow-y: auto; padding: 8px; }
.cc-template-variables .cc-template-variable-list button {
    display: grid;
    gap: 3px;
    width: 100%;
    padding: 7px 8px;
    color: inherit;
    background: #fff;
    border: 1px solid var(--cc-border-soft);
    border-radius: 7px;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
}
.cc-template-variables .cc-template-variable-list button:hover { background: var(--cc-primary-soft); border-color: #d8c3ce; }
.cc-template-variable-list button > span { color: var(--cc-text-secondary); font-size: 9.2px; line-height: 1.3; }
.cc-template-variable-list button > code { overflow: hidden; color: var(--cc-primary); font-size: 8.2px; text-overflow: ellipsis; white-space: nowrap; }
.cc-template-observation-section { background: color-mix(in srgb, var(--cc-surface-soft) 65%, transparent); }

@media (max-width: 1250px) {
    .cc-template-content-layout { grid-template-columns: 1fr; }
    .cc-template-variables { position: static; }
    .cc-template-variable-list { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 280px; }
}

@media (max-width: 1100px) {
    .cc-template-layout { grid-template-columns: 1fr; }
    .cc-template-version-list { max-height: 360px; }
    .cc-template-list { max-height: none; }
}

@media (max-width: 760px) {
    .cc-security-role-create { grid-template-columns: 1fr; gap: 10px; }
    .cc-security-permissions-head { align-items: stretch; }
    .cc-security-permission-actions { justify-content: flex-start; }
    .cc-template-editor-head { align-items: flex-start; flex-direction: column; }
    .cc-template-editor-actions { width: 100%; justify-content: flex-start; }
    .cc-template-section { padding: 13px 12px; }
    .cc-template-option-grid,
    .cc-template-list-summary,
    .cc-template-variable-list { grid-template-columns: 1fr; }
    .cc-template-section-heading { align-items: flex-start; flex-direction: column; }
    .cc-template-content-actions { width: 100%; justify-content: space-between; }
    .cc-template-editor-field .rz-textarea { min-height: 420px; }
}


/* Ajustes de edición legal · contenido primero y formato básico */
.cc-security-role-create-actions .cc-security-create-button.rz-primary,
.cc-security-role-create-actions .cc-security-create-button.rz-primary .rz-button-text,
.cc-security-role-create-actions .cc-security-create-button.rz-primary .rz-button-icon {
    color: #fff;
}

.cc-template-content-section {
    background: color-mix(in srgb, var(--cc-primary) 1.5%, var(--cc-surface));
}
.cc-template-content-section .cc-template-section-heading { margin-bottom: 10px; }
.cc-template-content-layout {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 255px);
    gap: 10px;
}
.cc-template-editor-field { min-width: 0; }
.cc-template-rich-editor {
    overflow: hidden;
    background: #fff;
    border-radius: 9px;
}
.cc-template-editor-field .rz-html-editor {
    border: 1px solid var(--cc-border);
    border-radius: 9px;
    box-shadow: none;
}
.cc-template-editor-field .rz-html-editor-toolbar {
    padding: 6px 8px;
    background: var(--cc-surface-soft);
    border-bottom: 1px solid var(--cc-border-soft);
}
.cc-template-editor-field .rz-html-editor-content {
    padding: 16px 18px;
    font-family: var(--cc-font);
    font-size: 12px;
    line-height: 1.72;
}
.cc-template-editor-field .rz-html-editor-content p { margin: 0 0 10px; }
.cc-template-editor-field .rz-html-editor-content h1,
.cc-template-editor-field .rz-html-editor-content h2,
.cc-template-editor-field .rz-html-editor-content h3,
.cc-template-editor-field .rz-html-editor-content h4,
.cc-template-editor-field .rz-html-editor-content h5,
.cc-template-editor-field .rz-html-editor-content h6 {
    margin: 14px 0 7px;
    color: var(--cc-text);
    font-size: 13px;
    line-height: 1.35;
}
.cc-template-editor-field .rz-html-editor-content ul,
.cc-template-editor-field .rz-html-editor-content ol { margin: 7px 0 10px; padding-left: 24px; }
.cc-template-editor-field .rz-html-editor-content li { margin: 3px 0; }
.cc-template-variables { top: 10px; background: #fff; }
.cc-template-variable-list {
    display: block;
    max-height: 560px;
    padding: 7px;
}
.cc-template-variable-group + .cc-template-variable-group {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--cc-border-soft);
}
.cc-template-variable-group-title {
    margin: 0 3px 5px;
    color: var(--cc-text-muted);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.cc-template-variable-group button + button { margin-top: 4px; }
.cc-template-settings-section { background: var(--cc-surface); }
.cc-template-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.cc-template-settings-card {
    min-width: 0;
    padding: 11px;
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
}
.cc-template-settings-card-title {
    margin-bottom: 9px;
    color: var(--cc-text-secondary);
    font-size: 10px;
    font-weight: 750;
}
.cc-template-observation-field { margin-top: 10px; }

@media (max-width: 1250px) {
    .cc-template-content-layout { grid-template-columns: 1fr; }
    .cc-template-variable-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 310px; gap: 8px; }
    .cc-template-variable-group + .cc-template-variable-group { margin-top: 0; padding-top: 0; border-top: 0; }
}

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

@media (max-width: 760px) {
    .cc-template-editor-field .rz-html-editor { min-height: 470px; }
    .cc-template-editor-field .rz-html-editor-content { padding: 13px; font-size: 11.5px; }
    .cc-template-variable-list { grid-template-columns: 1fr; }
}

/* Plantillas legales · endurecimiento de versiones y edición */
.cc-template-conflict-alert { display: grid; gap: 3px; margin-bottom: 12px; }
.cc-template-conflict-alert strong { font-size: 11px; }
.cc-template-conflict-alert span { font-size: 9.5px; line-height: 1.4; }
.cc-template-lock-flag,
.cc-template-conflict-flag {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 3px 6px;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 750;
    white-space: nowrap;
}
.cc-template-lock-flag { color: #5d5660; background: #f0edf0; }
.cc-template-lock-flag .rz-icon { font-size: 11px; }
.cc-template-conflict-flag { color: #a12d2d; background: #fdeaea; }
.cc-template-lock-note {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    align-items: start;
    gap: 9px;
    margin: 12px 16px 0;
    padding: 10px 12px;
    color: var(--cc-text-secondary);
    background: #f7f5f7;
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
}
.cc-template-lock-note > .rz-icon { margin-top: 1px; color: var(--cc-primary); font-size: 17px; }
.cc-template-lock-note > div { display: grid; gap: 2px; }
.cc-template-lock-note strong { font-size: 10.5px; }
.cc-template-lock-note span { color: var(--cc-text-muted); font-size: 9px; line-height: 1.4; }
.cc-template-publication-note {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    align-items: start;
    gap: 8px;
    margin-top: 11px;
    padding: 9px 11px;
    color: var(--cc-text-secondary);
    background: color-mix(in srgb, var(--cc-primary) 3%, #fff);
    border: 1px solid color-mix(in srgb, var(--cc-primary) 14%, var(--cc-border-soft));
    border-radius: 9px;
    font-size: 9px;
    line-height: 1.4;
}
.cc-template-publication-note > .rz-icon { color: var(--cc-primary); font-size: 16px; }
.cc-template-option.is-disabled { opacity: .68; cursor: not-allowed; }
.cc-template-variables .cc-template-variable-list button:disabled { cursor: not-allowed; opacity: .48; background: var(--cc-surface-soft); }
.cc-template-editor-field .rz-html-editor[aria-disabled="true"],
.cc-template-editor-field .rz-state-disabled { opacity: .82; }


/* Plantillas legales · editor estable y estados compactos */
.cc-template-item-state .cc-status {
    min-height: 19px;
    padding: 1px 6px;
    font-size: 8.5px;
    font-weight: 700;
}
.cc-template-item-state { gap: 3px; }
.cc-template-lock-flag,
.cc-template-conflict-flag {
    min-height: 18px;
    padding: 1px 5px;
    font-size: 7.6px;
    font-weight: 700;
}
.cc-template-lock-flag .rz-icon { font-size: 10px; }
.cc-template-editor-guide {
    display: grid;
    gap: 3px;
    margin-top: 7px;
    padding: 7px 9px;
    color: var(--cc-text-muted);
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 7px;
    font-size: 8.8px;
    line-height: 1.4;
}
.cc-template-editor-guide strong { color: var(--cc-text-secondary); }
.cc-template-editor-field .rz-html-editor-toolbar {
    min-height: 38px;
}
.cc-template-editor-field .rz-html-editor-toolbar .rz-html-editor-dropdown {
    max-width: 150px;
}

/* ============================================================
   Navegación principal · modo contraído persistente
   ============================================================ */
.cc-sidebar {
    transition: width .18s ease, min-width .18s ease;
    overflow-x: hidden;
}
.cc-sidebar-control {
    position: sticky;
    top: 0;
    z-index: 3;
    display: flex;
    justify-content: flex-end;
    padding: 8px 10px 5px;
    background: var(--cc-surface);
    border-bottom: 1px solid color-mix(in srgb, var(--cc-border-soft) 70%, transparent);
}
.cc-sidebar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    padding: 0 9px;
    color: var(--cc-text-muted);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 7px;
    font: inherit;
    font-size: 10px;
    font-weight: 650;
    cursor: pointer;
}
.cc-sidebar-toggle:hover {
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-color: color-mix(in srgb, var(--cc-primary) 14%, transparent);
}
.cc-sidebar-toggle .rz-icon { font-size: 17px; }
.cc-sidebar.is-collapsed {
    width: 62px;
    min-width: 62px;
}
.cc-sidebar.is-collapsed .cc-sidebar-control {
    justify-content: center;
    padding-inline: 6px;
}
.cc-sidebar.is-collapsed .cc-sidebar-toggle {
    width: 40px;
    padding: 0;
}
.cc-nav.cc-menu.is-compact {
    padding-inline: 7px;
}
.cc-nav.cc-menu.is-compact .cc-menu-home,
.cc-nav.cc-menu.is-compact .cc-menu-module {
    justify-content: center;
    min-height: 40px;
    padding-inline: 0;
}
.cc-nav.cc-menu.is-compact .cc-menu-label,
.cc-nav.cc-menu.is-compact .cc-menu-chevron {
    display: none;
}
.cc-nav.cc-menu.is-compact .cc-menu-icon {
    width: 24px;
    min-width: 24px;
}
.cc-nav.cc-menu.is-compact .cc-menu-icon .rz-icon {
    font-size: 19px;
}
.cc-nav.cc-menu.is-compact .cc-menu-home.active::before,
.cc-nav.cc-menu.is-compact .cc-menu-module.is-current::before {
    top: 9px;
    bottom: 9px;
}

/* ============================================================
   Plantillas legales · biblioteca documental por tipo/versiones
   ============================================================ */
.cc-template-layout {
    grid-template-columns: minmax(330px, 360px) minmax(0, 1fr);
}
.cc-template-list {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 185px);
    padding: 0;
    overflow: hidden;
}
.cc-template-list-head {
    flex: 0 0 auto;
    padding: 14px 14px 11px;
}
.cc-template-type-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 11px 12px 8px;
    border-bottom: 1px solid var(--cc-border-soft);
}
.cc-template-type-tab {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    min-width: 0;
    padding: 8px 9px;
    color: var(--cc-text-secondary);
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.cc-template-type-tab:hover {
    color: var(--cc-primary);
    border-color: #d8c3ce;
}
.cc-template-type-tab.is-active {
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-color: #d8c3ce;
    box-shadow: inset 0 -2px 0 var(--cc-primary);
}
.cc-template-type-tab > .rz-icon { font-size: 18px; }
.cc-template-type-tab > span { min-width: 0; }
.cc-template-type-tab strong,
.cc-template-type-tab small { display: block; }
.cc-template-type-tab strong { color: var(--cc-text); font-size: 10.5px; }
.cc-template-type-tab small { margin-top: 1px; color: var(--cc-text-muted); font-size: 8.4px; }
.cc-template-filter-row-single {
    flex: 0 0 auto;
    padding: 9px 12px 8px;
}
.cc-template-type-context {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    margin: 0 12px 8px;
    padding: 8px 9px;
    color: var(--cc-text-secondary);
    background: #fff;
    border: 1px solid var(--cc-border-soft);
    border-radius: 8px;
}
.cc-template-type-context-icon {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    color: var(--cc-primary);
    background: var(--cc-primary-soft);
    border-radius: 7px;
}
.cc-template-type-context-icon .rz-icon { font-size: 17px; }
.cc-template-type-context > span:last-child { min-width: 0; }
.cc-template-type-context strong,
.cc-template-type-context small { display: block; }
.cc-template-type-context strong { color: var(--cc-text); font-size: 10.5px; }
.cc-template-type-context small { margin-top: 2px; color: var(--cc-text-muted); font-size: 8.5px; line-height: 1.3; }
.cc-template-version-list {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    padding: 0 12px 10px;
}
.cc-template-list-item-v2 {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: start;
    gap: 9px;
    width: 100%;
    min-width: 0;
    margin: 0 0 7px;
    padding: 9px 9px 9px 8px;
    background: #fff;
    border: 1px solid var(--cc-border-soft);
    border-radius: 9px;
}
.cc-template-list-item-v2:hover { border-color: #d8c3ce; background: #fdfbfd; }
.cc-template-list-item-v2.is-selected {
    background: var(--cc-primary-soft);
    border-color: #d7becb;
    box-shadow: inset 3px 0 0 var(--cc-primary);
}
.cc-template-version-block {
    display: grid !important;
    place-items: center;
    align-content: center;
    width: 46px;
    min-height: 42px;
    margin: 0 !important;
    padding: 5px 3px;
    color: var(--cc-primary) !important;
    background: var(--cc-primary-soft);
    border-radius: 8px;
}
.cc-template-version-block strong {
    display: block;
    color: inherit;
    font-size: 13px;
    line-height: 1;
}
.cc-template-version-block small {
    display: block;
    margin-top: 3px;
    color: var(--cc-text-muted);
    font-size: 7.2px;
    font-weight: 700;
    line-height: 1;
}
.cc-template-list-item-v2 .cc-template-item-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}
.cc-template-list-item-v2 .cc-template-item-title {
    display: block;
    min-width: 0;
    margin: 0;
}
.cc-template-list-item-v2 .cc-template-item-title strong {
    display: block;
    overflow: hidden;
    color: var(--cc-text);
    font-size: 10.8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cc-template-item-scope {
    display: block !important;
    margin: 0 !important;
    overflow: hidden;
    color: var(--cc-text-secondary) !important;
    font-size: 8.8px !important;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cc-template-list-item-v2 .cc-template-item-code {
    margin: 0;
    color: var(--cc-text-muted);
    font-size: 8px;
    font-weight: 600;
}
.cc-template-item-period {
    display: flex !important;
    flex-wrap: wrap;
    gap: 2px 7px;
    margin: 1px 0 0 !important;
    color: var(--cc-text-muted) !important;
    font-size: 8px !important;
    line-height: 1.25;
}
.cc-template-item-period > span {
    display: inline !important;
    margin: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    white-space: nowrap;
}
.cc-template-list-item-v2 .cc-template-item-state {
    align-self: start;
    gap: 3px;
}
.cc-template-history-icon {
    display: inline-flex !important;
    align-items: center;
    gap: 2px;
    min-height: 17px;
    margin: 0 !important;
    padding: 1px 4px;
    color: var(--cc-text-muted) !important;
    background: #f2eff2;
    border-radius: 999px;
    font-size: 7.2px !important;
    font-weight: 700;
    white-space: nowrap;
}
.cc-template-history-icon .rz-icon { font-size: 9px; }
.cc-template-library-footer {
    flex: 0 0 auto;
    padding: 8px 12px 12px;
    border-top: 1px solid var(--cc-border-soft);
}
.cc-template-new-type {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 100%;
    min-height: 32px;
    color: var(--cc-primary);
    background: #fff;
    border: 1px solid #d8c3ce;
    border-radius: 7px;
    font: inherit;
    font-size: 9.5px;
    font-weight: 700;
    cursor: pointer;
}
.cc-template-new-type:hover { background: var(--cc-primary-soft); }
.cc-template-new-type .rz-icon { font-size: 15px; }

@media (max-width: 1100px) {
    .cc-template-layout { grid-template-columns: 1fr; }
    .cc-template-list { max-height: none; }
    .cc-template-version-list { max-height: 360px; }
}

@media (max-width: 700px) {
    .cc-sidebar-control { display: none; }
}

/* =========================================================
   Bloque 5 — analítica y reportería avanzada
   ========================================================= */
.cc-dashboard-kpis-secondary { margin-top: 12px; }
.cc-filter-grid-secondary { margin-top: 10px; }
.cc-alert-warning {
    color: #72520a;
    background: #fffaf0;
    border-color: #ead9aa;
}
.cc-row-warning td,
.cc-report-row-warning td { background: #fffdf6; }
.cc-row-warning:hover td,
.cc-report-row-warning:hover td { background: #fff9e8; }

.cc-financial-summary-document { display: flex; flex-direction: column; gap: 0; }
.cc-financial-summary-section {
    padding: 18px 22px;
    border-bottom: 1px solid var(--cc-border-soft);
}
.cc-financial-summary-section:last-child { border-bottom: 0; }
.cc-financial-summary-section .cc-panel-heading { margin-bottom: 12px; }
.cc-financial-summary-section .cc-panel-heading h2 { margin: 0; font-size: 14px; }
.cc-financial-summary-section .cc-panel-heading p { margin: 3px 0 0; color: var(--cc-text-muted); font-size: 10.5px; }
.cc-financial-summary-section .cc-kpi-strip { margin-bottom: 0; box-shadow: none; }
.cc-financial-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-bottom: 1px solid var(--cc-border-soft);
}
.cc-financial-summary-grid .cc-financial-summary-section { border-bottom: 0; }
.cc-financial-summary-grid .cc-financial-summary-section + .cc-financial-summary-section { border-left: 1px solid var(--cc-border-soft); }
.cc-summary-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.cc-summary-detail-grid > span {
    min-width: 0;
    padding: 10px 11px;
    color: var(--cc-text-muted);
    background: var(--cc-surface-soft);
    border: 1px solid var(--cc-border-soft);
    border-radius: 7px;
    font-size: 9.5px;
}
.cc-summary-detail-grid > span strong {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: var(--cc-text);
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cc-report-totals-6 { flex-wrap: wrap; row-gap: 8px; }
.cc-report-totals-6 > span { flex: 1 1 145px; }

@media (max-width: 1100px) {
    .cc-financial-summary-grid { grid-template-columns: 1fr; }
    .cc-financial-summary-grid .cc-financial-summary-section + .cc-financial-summary-section { border-left: 0; border-top: 1px solid var(--cc-border-soft); }
    .cc-summary-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .cc-summary-detail-grid { grid-template-columns: 1fr; }
    .cc-financial-summary-section { padding: 14px; }
}

/* Bloque 6 - estados financieros y conciliación */
.cc-financial-statement-grid { display: grid; gap: 14px; }
.cc-financial-section { overflow: hidden; border: 1px solid var(--cc-border); border-radius: 10px; background: #fff; }
.cc-financial-section h3 { margin: 0; padding: 10px 14px; background: var(--cc-surface-soft); border-bottom: 1px solid var(--cc-border); color: var(--cc-text); font-size: 12px; letter-spacing: .04em; }
.cc-financial-line,.cc-financial-total { display: grid; grid-template-columns: minmax(0,1fr) 150px 150px; align-items: center; gap: 12px; min-height: 38px; padding: 7px 14px; border-bottom: 1px solid rgba(0,0,0,.045); }
.cc-financial-line:last-child { border-bottom: 0; }
.cc-financial-line span,.cc-financial-total span { min-width: 0; }
.cc-financial-line strong,.cc-financial-total strong,.cc-financial-line em,.cc-financial-total em { text-align: right; font-style: normal; white-space: nowrap; }
.cc-financial-line em,.cc-financial-total em { color: var(--cc-text-muted); }
.cc-financial-total { border: 1px solid var(--cc-border); border-radius: 9px; background: var(--cc-surface-soft); font-weight: 700; }
.cc-financial-result { background: rgba(107,63,91,.07); border-color: rgba(107,63,91,.18); }
.cc-text-danger { color: #c73737 !important; }
.cc-status-ok,.cc-status-danger { display:inline-flex; align-items:center; min-height:22px; padding:2px 8px; border-radius:999px; font-size:10px; font-weight:700; }
.cc-status-ok { color:#17714a; background:#e8f6ef; }
.cc-status-danger { color:#a82929; background:#fdecec; }
.cc-field-help { display:block; margin-top:-4px; color:var(--cc-text-muted); font-size:10px; line-height:1.35; }
@media (max-width:760px){.cc-financial-line,.cc-financial-total{grid-template-columns:minmax(0,1fr) 110px}.cc-financial-line em,.cc-financial-total em{display:none}}

/* Bloque 6.1 - estados financieros, reportes y conciliación */
.cc-financial-report-page { display: flex; flex-direction: column; gap: 14px; }

.cc-financial-filter {
    display: grid;
    grid-template-columns: minmax(190px, .55fr) minmax(0, 1.45fr);
    align-items: center;
    gap: 20px;
    padding: 14px 16px;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-lg);
    box-shadow: var(--cc-shadow-sm);
}
.cc-financial-filter-copy strong { display: block; color: var(--cc-text); font-size: 12px; }
.cc-financial-filter-copy span { display: block; margin-top: 3px; color: var(--cc-text-muted); font-size: 10.5px; line-height: 1.4; }
.cc-financial-filter-fields { display: grid; grid-template-columns: repeat(2,minmax(150px,1fr)) auto; align-items: end; gap: 10px; }
.cc-financial-filter-fields-4 { grid-template-columns: repeat(4,minmax(130px,1fr)) auto; }
.cc-financial-filter-fields > .rz-button { min-height: 38px; }

.cc-financial-overview {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    overflow: hidden;
    background: var(--cc-surface);
    border: 1px solid var(--cc-border);
    border-radius: var(--cc-radius-lg);
    box-shadow: var(--cc-shadow-sm);
}
.cc-financial-overview-5 { grid-template-columns: repeat(5,minmax(0,1fr)); }
.cc-financial-overview-item { min-width: 0; padding: 13px 15px; border-left: 1px solid var(--cc-border-soft); }
.cc-financial-overview-item:first-child { border-left: 0; }
.cc-financial-overview-item span { display: block; color: var(--cc-text-muted); font-size: 9.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.cc-financial-overview-item strong { display: block; margin-top: 5px; color: var(--cc-text); font-size: 17px; font-weight: 750; font-variant-numeric: tabular-nums; }
.cc-financial-overview-result { background: linear-gradient(180deg,rgba(107,63,91,.065),rgba(107,63,91,.025)); }
.cc-financial-overview-result strong { color: var(--cc-primary); }

.cc-financial-statement {
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--cc-border);
    border-radius: 12px;
    box-shadow: var(--cc-shadow-sm);
}
.cc-financial-statement-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 20px 22px 18px;
    border-bottom: 1px solid var(--cc-border);
}
.cc-financial-statement-head h2 { margin: 8px 0 0; color: var(--cc-text); font-size: 19px; font-weight: 760; }
.cc-financial-statement-head p { margin: 4px 0 0; color: var(--cc-text-muted); font-size: 11px; }
.cc-financial-statement-status { display: flex; align-items: center; gap: 9px; min-width: 150px; padding: 9px 11px; border: 1px solid var(--cc-border-soft); border-radius: 9px; background: var(--cc-surface-soft); }
.cc-financial-statement-status > .rz-icon { font-size: 20px; }
.cc-financial-statement-status span { display: block; color: var(--cc-text-muted); font-size: 9px; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.cc-financial-statement-status strong { display: block; margin-top: 2px; font-size: 12px; }
.cc-financial-statement-status.is-ok { color: #176d49; background: #f1faf6; border-color: #d9eee4; }
.cc-financial-statement-status.is-alert { color: #a82929; background: #fff5f5; border-color: #f2d6d6; }

.cc-financial-columns,
.cc-financial-statement-row,
.cc-financial-section-total,
.cc-financial-special-row,
.cc-financial-subtotal,
.cc-financial-grand-total {
    display: grid;
    grid-template-columns: minmax(0,1fr) 160px;
    align-items: center;
    gap: 12px;
}
.cc-financial-columns.has-comparison,
.cc-financial-statement-row.has-comparison,
.cc-financial-section-total.has-comparison,
.cc-financial-special-row.has-comparison,
.cc-financial-subtotal.has-comparison,
.cc-financial-grand-total.has-comparison { grid-template-columns: minmax(0,1fr) 155px 155px 155px; }
.cc-financial-columns { min-height: 34px; padding: 7px 18px; color: var(--cc-text-muted); background: #faf9fb; border-bottom: 1px solid var(--cc-border-soft); font-size: 9.5px; letter-spacing: .035em; text-transform: uppercase; }
.cc-financial-columns strong { text-align: right; font-size: 9.5px; font-weight: 700; }
.cc-financial-statement-section { border-bottom: 1px solid var(--cc-border); }
.cc-financial-section-title { padding: 12px 18px 8px; color: var(--cc-primary); font-size: 10.5px; font-weight: 800; letter-spacing: .055em; }
.cc-financial-statement-row { min-height: 43px; padding: 7px 18px; border-top: 1px solid rgba(0,0,0,.035); }
.cc-financial-statement-row:hover { background: #fdfcfd; }
.cc-financial-account { min-width: 0; }
.cc-financial-account strong { display: block; overflow: hidden; color: var(--cc-text); font-size: 11.5px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.cc-financial-account small { display: block; margin-top: 2px; color: var(--cc-text-muted); font-size: 9.5px; }
.cc-financial-statement-row > strong,
.cc-financial-statement-row > em,
.cc-financial-section-total > strong,
.cc-financial-section-total > em,
.cc-financial-special-row > strong,
.cc-financial-special-row > em,
.cc-financial-subtotal > strong,
.cc-financial-subtotal > em,
.cc-financial-grand-total > strong,
.cc-financial-grand-total > em { text-align: right; font-style: normal; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cc-financial-statement-row > strong { font-size: 11.5px; }
.cc-financial-statement-row > em { color: var(--cc-text-secondary); font-size: 11px; }
.cc-financial-statement-row > em.is-negative { color: var(--cc-danger); }
.cc-financial-section-total { min-height: 42px; padding: 8px 18px; background: #faf9fb; border-top: 1px solid var(--cc-border-soft); font-size: 11.5px; font-weight: 750; }
.cc-financial-section-total > em { color: var(--cc-text-secondary); }
.cc-financial-empty-row { padding: 9px 18px 12px; color: var(--cc-text-muted); font-size: 10.5px; }
.cc-financial-special-row { min-height: 44px; padding: 9px 18px; color: var(--cc-text-secondary); background: #fff; border-bottom: 1px solid var(--cc-border-soft); font-size: 11px; }
.cc-financial-special-row strong { color: var(--cc-text); }
.cc-financial-subtotal { min-height: 46px; padding: 9px 18px; background: #f7f5f7; border-bottom: 1px solid var(--cc-border); font-size: 11.5px; font-weight: 800; }
.cc-financial-grand-total { min-height: 50px; padding: 10px 18px; background: #f6f2f5; border-top: 1px solid rgba(107,63,91,.14); color: var(--cc-text); font-size: 11.5px; font-weight: 800; }
.cc-financial-grand-total strong { color: var(--cc-primary); font-size: 13px; }
.cc-financial-grand-result { background: linear-gradient(90deg,rgba(107,63,91,.075),rgba(107,63,91,.035)); }

.cc-reconciliation-overview { display: grid; grid-template-columns: minmax(230px,.75fr) minmax(0,1.25fr); gap: 12px; }
.cc-reconciliation-score { display: flex; align-items: center; gap: 12px; min-height: 88px; padding: 15px 16px; border: 1px solid var(--cc-border); border-radius: var(--cc-radius-lg); background: var(--cc-surface); box-shadow: var(--cc-shadow-sm); }
.cc-reconciliation-score > .rz-icon { font-size: 28px; }
.cc-reconciliation-score span { display: block; color: var(--cc-text-muted); font-size: 9.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.cc-reconciliation-score strong { display: block; margin-top: 2px; color: var(--cc-text); font-size: 16px; }
.cc-reconciliation-score small { display: block; margin-top: 3px; color: var(--cc-text-muted); font-size: 10px; }
.cc-reconciliation-score.is-ok > .rz-icon { color: #17714a; }
.cc-reconciliation-score.is-alert > .rz-icon { color: var(--cc-danger); }
.cc-reconciliation-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); overflow: hidden; border: 1px solid var(--cc-border); border-radius: var(--cc-radius-lg); background: var(--cc-surface); box-shadow: var(--cc-shadow-sm); }
.cc-reconciliation-metrics > div { padding: 15px; border-left: 1px solid var(--cc-border-soft); }
.cc-reconciliation-metrics > div:first-child { border-left: 0; }
.cc-reconciliation-metrics span { display: block; color: var(--cc-text-muted); font-size: 9.5px; font-weight: 700; text-transform: uppercase; }
.cc-reconciliation-metrics strong { display: block; margin-top: 5px; color: var(--cc-text); font-size: 17px; font-variant-numeric: tabular-nums; }
.cc-reconciliation-card,.cc-financial-detail-card { min-width: 0; overflow: hidden; }
.cc-reconciliation-table { min-width: 900px; }

.cc-report-hub-page { display: flex; flex-direction: column; gap: 18px; }
.cc-report-hub-section { display: grid; gap: 10px; }
.cc-report-hub-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.cc-report-hub-heading strong { display: block; color: var(--cc-text); font-size: 13px; }
.cc-report-hub-heading span { display: block; margin-top: 2px; color: var(--cc-text-muted); font-size: 10.5px; }
.cc-report-catalog-featured .cc-report-card { min-height: 106px; }

@media (max-width: 1200px) {
    .cc-financial-filter { grid-template-columns: 1fr; gap: 10px; }
    .cc-financial-filter-fields-4 { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cc-financial-filter-fields-4 > .rz-button { grid-column: 2; justify-self: end; }
    .cc-financial-overview-5 { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 900px) {
    .cc-financial-overview { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cc-financial-overview-item:nth-child(odd) { border-left: 0; }
    .cc-reconciliation-overview { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .cc-financial-filter-fields,.cc-financial-filter-fields-4 { grid-template-columns: 1fr; }
    .cc-financial-filter-fields-4 > .rz-button { grid-column: auto; justify-self: stretch; }
    .cc-financial-overview,.cc-financial-overview-5 { grid-template-columns: 1fr; }
    .cc-financial-overview-item { border-left: 0; border-top: 1px solid var(--cc-border-soft); }
    .cc-financial-overview-item:first-child { border-top: 0; }
    .cc-financial-statement-head { flex-direction: column; }
    .cc-financial-statement-status { width: 100%; }
    .cc-financial-columns.has-comparison,
    .cc-financial-statement-row.has-comparison,
    .cc-financial-section-total.has-comparison,
    .cc-financial-special-row.has-comparison,
    .cc-financial-subtotal.has-comparison,
    .cc-financial-grand-total.has-comparison { grid-template-columns: minmax(0,1fr) 112px; }
    .cc-financial-columns.has-comparison > :nth-child(n+3),
    .cc-financial-statement-row.has-comparison > :nth-child(n+3),
    .cc-financial-section-total.has-comparison > :nth-child(n+3),
    .cc-financial-special-row.has-comparison > :nth-child(n+3),
    .cc-financial-subtotal.has-comparison > :nth-child(n+3),
    .cc-financial-grand-total.has-comparison > :nth-child(n+3) { display: none; }
    .cc-reconciliation-metrics { grid-template-columns: 1fr; }
    .cc-reconciliation-metrics > div { border-left: 0; border-top: 1px solid var(--cc-border-soft); }
    .cc-reconciliation-metrics > div:first-child { border-top: 0; }
}

/* Bloque 7 · navegación, auxiliares y estados detallados */
.cc-breadcrumbs{display:flex;align-items:center;gap:.3rem;min-height:28px;margin:0 0 .65rem;padding:0 .15rem;color:var(--rz-text-secondary-color,#667085);font-size:.78rem;white-space:nowrap;overflow-x:auto}.cc-breadcrumbs a{color:inherit;text-decoration:none}.cc-breadcrumbs a:hover{color:var(--cc-accent,#7a4d6d);text-decoration:underline}.cc-breadcrumbs .is-current{font-weight:650;color:var(--rz-text-color,#1f2937)}.cc-breadcrumb-separator{font-size:1rem;opacity:.55;flex:0 0 auto}
.cc-financial-view-mode{display:inline-flex;align-self:center;padding:3px;border:1px solid var(--rz-base-300,#d7dbe2);border-radius:9px;background:var(--rz-base-100,#fff)}.cc-financial-view-mode button{border:0;background:transparent;border-radius:6px;padding:.42rem .75rem;font:inherit;font-size:.78rem;cursor:pointer;color:var(--rz-text-secondary-color,#667085)}.cc-financial-view-mode button.is-active{background:var(--cc-accent-soft,#f2eaf0);color:var(--cc-accent,#744967);font-weight:700}.cc-financial-account a{color:inherit;text-decoration:none;font-weight:700}.cc-financial-account.is-movement a:hover{text-decoration:underline;color:var(--cc-accent,#744967)}
.cc-inline-editor{padding:1rem 1.1rem;margin-bottom:1rem}.cc-section-heading{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1rem}.cc-section-heading>div{display:flex;flex-direction:column;gap:.18rem}.cc-section-heading strong{font-size:.95rem}.cc-section-heading span{color:var(--rz-text-secondary-color,#667085);font-size:.78rem}.cc-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.cc-form-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cc-form-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.cc-form-grid label{display:flex;flex-direction:column;gap:.28rem;font-size:.76rem;color:var(--rz-text-secondary-color,#667085)}.cc-form-grid label>span{font-weight:600}.cc-form-span-2{grid-column:span 2}.cc-form-span-3{grid-column:span 3}.cc-input{width:100%;min-height:38px;padding:.5rem .65rem;border:1px solid var(--rz-base-400,#c9ced6);border-radius:6px;background:var(--rz-base-background-color,#fff);color:var(--rz-text-color,#1f2937);font:inherit;box-sizing:border-box}.cc-input:focus{outline:2px solid color-mix(in srgb,var(--cc-accent,#744967) 22%,transparent);border-color:var(--cc-accent,#744967)}textarea.cc-input{resize:vertical}.cc-check-row{display:flex;flex-wrap:wrap;gap:1.1rem;margin-top:.8rem;font-size:.82rem}.cc-check-row label{display:flex;align-items:center;gap:.4rem}.cc-form-actions{display:flex;justify-content:flex-end;gap:.55rem;margin-top:1rem}.cc-info-strip{display:flex;align-items:flex-start;gap:.55rem;padding:.72rem .85rem;margin-bottom:1rem;border:1px solid var(--rz-base-300,#d7dbe2);border-radius:8px;background:var(--rz-base-50,#fafafa);font-size:.79rem;color:var(--rz-text-secondary-color,#667085)}.cc-info-strip .rzi{margin-top:.05rem}.cc-text-muted{color:var(--rz-text-secondary-color,#667085)}.cc-text-success{color:#138a56;font-weight:650}.cc-icon-link{display:inline-flex;align-items:center;justify-content:center;padding:.3rem;color:var(--cc-accent,#744967);text-decoration:none}.cc-details summary{cursor:pointer;color:var(--cc-accent,#744967);font-weight:600}.cc-details ul{margin:.45rem 0 .2rem 1rem;padding:0;font-size:.76rem;max-width:520px}.cc-alert-success{border-color:#bfe5d2!important;background:#f1fbf6!important;color:#126c47!important}
@media(max-width:1100px){.cc-form-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.cc-form-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.cc-form-grid,.cc-form-grid-3,.cc-form-grid-4{grid-template-columns:1fr}.cc-form-span-2,.cc-form-span-3{grid-column:span 1}.cc-financial-view-mode{width:100%}.cc-financial-view-mode button{flex:1}.cc-breadcrumbs{margin-bottom:.45rem}}

.cc-link-button{background:none;border:0;padding:0;font:inherit;cursor:pointer;text-align:left}.cc-link-button:hover{text-decoration:underline}

/* Bloque 7.2.1 · detalle operativo de CxP/CxC */
.cc-aux-dialog-form{display:flex;flex-direction:column;gap:.85rem}.cc-aux-detail,.cc-aux-payment-detail{display:flex;flex-direction:column;gap:1rem;min-width:0}.cc-aux-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.cc-aux-detail-head>div:first-child{min-width:0}.cc-aux-detail-kicker{margin-bottom:.18rem;color:var(--cc-accent,#744967);font-size:.67rem;font-weight:750;letter-spacing:.055em;text-transform:uppercase}.cc-aux-detail-head h2{margin:0;color:var(--rz-text-color,#1f2937);font-size:1.15rem;line-height:1.25}.cc-aux-detail-head p{margin:.25rem 0 0;color:var(--rz-text-secondary-color,#667085);font-size:.8rem;line-height:1.35}.cc-aux-detail-actions{display:flex;align-items:center;gap:.5rem;flex:0 0 auto}.cc-aux-overview{margin:0;box-shadow:none}.cc-aux-overview-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cc-aux-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden;border:1px solid var(--cc-border,var(--rz-base-300,#d7dbe2));border-radius:9px;background:var(--rz-base-background-color,#fff)}.cc-aux-info-item{min-width:0;padding:.75rem .85rem;border-bottom:1px solid var(--cc-border-soft,var(--rz-base-200,#e7e9ed))}.cc-aux-info-item:nth-child(odd){border-right:1px solid var(--cc-border-soft,var(--rz-base-200,#e7e9ed))}.cc-aux-info-item:nth-last-child(-n+2){border-bottom:0}.cc-aux-info-item span{display:block;margin-bottom:.2rem;color:var(--rz-text-secondary-color,#667085);font-size:.66rem;font-weight:700;letter-spacing:.025em;text-transform:uppercase}.cc-aux-info-item strong,.cc-aux-info-item .cc-record-link{display:block;overflow-wrap:anywhere;color:var(--rz-text-color,#1f2937);font-size:.81rem;font-weight:650}.cc-aux-info-span{grid-column:1/-1;border-right:0!important}.cc-aux-tabs{min-width:0}.cc-aux-tabs .rz-tabview-panels{padding:1rem 0 0}.cc-aux-tab-body{min-width:0}.cc-aux-section-note{margin:0 0 .7rem;color:var(--rz-text-secondary-color,#667085);font-size:.76rem}.cc-aux-detail-footer{margin-top:0;padding-top:.2rem}.cc-aux-reversal-box{padding:.9rem;border:1px solid color-mix(in srgb,var(--cc-danger,#b42318) 28%,transparent);border-radius:9px;background:color-mix(in srgb,var(--cc-danger,#b42318) 5%,var(--rz-base-background-color,#fff))}.cc-aux-reversal-title{margin-bottom:.65rem;color:var(--cc-danger,#b42318);font-size:.78rem;font-weight:750}.cc-aux-reversal-box .cc-aux-info-grid{background:transparent}.cc-aux-payment-detail>.cc-dialog-actions{margin-top:.1rem}.cc-aux-detail .rz-data-grid,.cc-aux-detail .rz-datatable{min-width:0}
@media(max-width:760px){.cc-aux-detail-head{flex-direction:column}.cc-aux-detail-actions,.cc-aux-detail-actions .rz-button{width:100%}.cc-aux-overview-3{grid-template-columns:1fr}.cc-aux-info-grid{grid-template-columns:1fr}.cc-aux-info-item,.cc-aux-info-item:nth-child(odd){border-right:0}.cc-aux-info-item:nth-last-child(-n+2){border-bottom:1px solid var(--cc-border-soft,var(--rz-base-200,#e7e9ed))}.cc-aux-info-item:last-child{border-bottom:0}.cc-aux-info-span{grid-column:auto}}

/* Bloque 8.2A.4 - Administrativo y sobregiro */
.cc-overdraft-dialog{gap:.8rem}.cc-overdraft-account{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:.85rem .95rem;border:1px solid var(--cc-border,var(--rz-base-300,#d7dbe2));border-radius:9px;background:var(--rz-base-background-color,#fff)}.cc-overdraft-account>div{min-width:0}.cc-overdraft-account strong{display:block;font-size:.95rem;color:var(--rz-text-color,#1f2937)}.cc-overdraft-account span:not(.cc-status){display:block;margin-top:.2rem;color:var(--rz-text-secondary-color,#667085);font-size:.76rem}.cc-overdraft-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;border:1px solid var(--cc-border,var(--rz-base-300,#d7dbe2));border-radius:9px;background:var(--rz-base-background-color,#fff)}.cc-overdraft-metric{min-width:0;padding:.7rem .75rem;border-left:1px solid var(--cc-border-soft,var(--rz-base-200,#e7e9ed))}.cc-overdraft-metric:first-child{border-left:0}.cc-overdraft-metric span{display:block;color:var(--rz-text-secondary-color,#667085);font-size:.62rem;font-weight:700;letter-spacing:.025em;text-transform:uppercase}.cc-overdraft-metric strong{display:block;margin-top:.22rem;font-size:.92rem;font-variant-numeric:tabular-nums}.cc-overdraft-metric-primary{background:color-mix(in srgb,var(--cc-accent,#744967) 5%,var(--rz-base-background-color,#fff))}.cc-overdraft-metric-primary strong{color:var(--cc-accent,#744967)}.cc-overdraft-toggle{padding:.25rem 0}.cc-overdraft-current{margin:0}.cc-overdraft-history{padding:.15rem 0}.cc-overdraft-history summary{font-size:.78rem}.cc-overdraft-history-grid{margin-top:.65rem;max-height:260px;overflow:auto}.cc-overdraft-history-grid .rz-data-grid{min-width:640px}
@media(max-width:760px){.cc-overdraft-account{flex-direction:column}.cc-overdraft-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.cc-overdraft-metric:nth-child(3){border-left:0;border-top:1px solid var(--cc-border-soft,var(--rz-base-200,#e7e9ed))}.cc-overdraft-metric:nth-child(4){border-top:1px solid var(--cc-border-soft,var(--rz-base-200,#e7e9ed))}}

/* ============================================================
   Bloque 8.2A.5 · Consistencia visual global
   Espaciado transversal de superficies, tablas y diálogos.
   ============================================================ */
:root {
    --cc-panel-inset-x: 18px;
    --cc-panel-inset-y: 15px;
    --cc-dialog-inset-x: 20px;
    --cc-dialog-inset-y: 18px;
}

/*
   Los contenedores de tabla permanecen "edge to edge", pero sus encabezados
   ya no nacen sobre el borde de la tarjeta. Esto corrige, entre otros,
   Administrativo, dashboards, configuración y varias consultas operativas.
*/
.cc-grid-wrap > .cc-section-heading,
.cc-grid-wrap > .cc-panel-heading {
    margin: 0;
    padding: var(--cc-panel-inset-y) var(--cc-panel-inset-x) 12px;
}

.cc-grid-wrap > .cc-section-heading + .rz-data-grid,
.cc-grid-wrap > .cc-panel-heading + .rz-data-grid,
.cc-grid-wrap > .cc-section-heading + .rz-datatable,
.cc-grid-wrap > .cc-panel-heading + .rz-datatable {
    border-top: 1px solid var(--cc-border-soft);
}

/* Encabezados simples dentro de tarjetas de grilla. Los encabezados que ya
   tienen una composición especializada conservan su propia regla. */
.cc-grid-wrap > .cc-section-header:not(.cc-account-table-head):not(.cc-participant-list-head):not(.cc-table-section-head) {
    padding: 14px var(--cc-panel-inset-x) 11px;
}

/* Un poco más de aire en los extremos de las tablas Radzen sin alterar
   densidad ni alturas de fila. */
.cc-grid-wrap .rz-grid-table > thead > tr > th:first-child,
.cc-grid-wrap .rz-grid-table > tbody > tr > td:first-child,
.cc-grid-wrap .rz-grid-table > tfoot > tr > td:first-child {
    padding-left: 14px;
}

.cc-grid-wrap .rz-grid-table > thead > tr > th:last-child,
.cc-grid-wrap .rz-grid-table > tbody > tr > td:last-child,
.cc-grid-wrap .rz-grid-table > tfoot > tr > td:last-child {
    padding-right: 14px;
}

/* Formularios en línea y paneles de filtros: misma respiración visual que las
   tarjetas de detalle, sin volver las pantallas excesivamente espaciosas. */
.cc-inline-editor {
    padding: 18px 20px;
}

.cc-filter-panel {
    padding: 18px;
}

.cc-dashboard-panel {
    padding: 18px;
}

/* Diálogos Radzen: encabezado, cuerpo y pie con una separación consistente.
   El visor PDF no usa esta estructura y por tanto no se ve afectado. */
.rz-dialog .rz-dialog-titlebar {
    padding: 14px var(--cc-dialog-inset-x) 12px;
}

.rz-dialog .rz-dialog-content {
    padding: var(--cc-dialog-inset-y) var(--cc-dialog-inset-x) 20px;
}

.rz-dialog .rz-dialog-content > .cc-dialog-form,
.rz-dialog .rz-dialog-content > .cc-aux-dialog-form,
.rz-dialog .rz-dialog-content > .cc-aux-detail,
.rz-dialog .rz-dialog-content > .cc-aux-payment-detail {
    min-width: 0;
    width: 100%;
}

.rz-dialog .rz-dialog-content .cc-dialog-actions,
.rz-dialog .rz-dialog-content .cc-form-actions:last-child {
    margin-top: 4px;
    padding-top: 14px;
    border-top: 1px solid var(--cc-border-soft);
}

/* Los cuadros informativos usados al inicio de formularios no necesitan
   margen adicional contra el nuevo padding del diálogo. */
.rz-dialog .rz-dialog-content .cc-dialog-form > .cc-info-strip:first-child,
.rz-dialog .rz-dialog-content .cc-aux-dialog-form > .cc-info-strip:first-child {
    margin-top: 0;
}

/* Tarjetas de detalle e información: evita que textos largos parezcan pegados
   al borde al hacer wrap. */
.cc-aux-info-item,
.cc-summary-detail-grid > span,
.cc-kpi-mini {
    overflow-wrap: anywhere;
}

/* Espaciado consistente de estados vacíos cuando viven dentro de superficies. */
.cc-surface > .cc-empty-state {
    margin: 0;
}

@media (max-width: 760px) {
    :root {
        --cc-panel-inset-x: 14px;
        --cc-panel-inset-y: 12px;
        --cc-dialog-inset-x: 14px;
        --cc-dialog-inset-y: 14px;
    }

    .cc-inline-editor,
    .cc-filter-panel,
    .cc-dashboard-panel {
        padding: 14px;
    }

    .rz-dialog .rz-dialog-titlebar {
        padding: 12px 14px 10px;
    }

    .rz-dialog .rz-dialog-content {
        padding: 14px 14px 16px;
    }

    .rz-dialog .rz-dialog-content .cc-dialog-actions,
    .rz-dialog .rz-dialog-content .cc-form-actions:last-child {
        padding-top: 12px;
    }
}

/* Documento institucional anulado: conservar el PDF original, pero impedir que la vista previa parezca vigente. */
.cc-pdf-viewer-title.is-annulled strong { color: #b42318; }
.cc-pdf-viewer-title.is-annulled::before { content: "ANULADO"; display: inline-flex; align-items: center; min-height: 24px; margin-right: 10px; padding: 0 9px; border: 1px solid #f0a7a1; border-radius: 999px; color: #b42318; background: #fff1f0; font-size: 10px; font-weight: 800; letter-spacing: .06em; }

/* =========================================================
   Bloque 8.6C · visibilidad operativa y períodos contables
   ========================================================= */
.cc-product-secondary-grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.cc-loan-product-policy {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--cc-border);
}

.cc-loan-product-policy-title {
    margin-bottom: 12px;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .02em;
    color: var(--cc-text-muted);
    text-transform: uppercase;
}

.cc-loan-approval-context {
    display: grid;
    grid-template-columns: minmax(180px, .8fr) minmax(0, 2.2fr);
    gap: 14px;
    padding: 14px;
    margin-bottom: 14px;
    border: 1px solid var(--cc-border);
    border-radius: 12px;
    background: var(--cc-surface-soft);
}

.cc-loan-approval-requested,
.cc-loan-approval-limits > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.cc-loan-approval-requested > span,
.cc-loan-approval-limits span,
.cc-period-metric span,
.cc-period-dialog-summary span {
    font-size: 11px;
    color: var(--cc-text-muted);
}

.cc-loan-approval-requested > strong {
    font-size: 20px;
}

.cc-loan-approval-requested small {
    color: var(--cc-text-muted);
}

.cc-loan-approval-limits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.cc-loan-approval-changes {
    margin-bottom: 14px;
}

.cc-callout {
    padding: 11px 13px;
    border: 1px solid var(--cc-border);
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.45;
}

.cc-callout-info {
    background: color-mix(in srgb, var(--cc-primary) 7%, var(--cc-surface));
    border-color: color-mix(in srgb, var(--cc-primary) 24%, var(--cc-border));
}

.cc-callout-warning {
    background: color-mix(in srgb, #d97706 8%, var(--cc-surface));
    border-color: color-mix(in srgb, #d97706 28%, var(--cc-border));
}

.cc-text-warning {
    color: #b45309;
}

.cc-period-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.cc-period-metric {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    border: 1px solid var(--cc-border);
    border-radius: 12px;
    background: var(--cc-surface);
}

.cc-period-metric strong {
    font-size: 21px;
}

.cc-period-toolbar {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 14px 4px;
}

.cc-period-name {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}

.cc-period-audit-detail {
    margin-top: 2px;
    max-width: 420px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-period-dialog-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 18px;
    padding: 12px 14px;
    border: 1px solid var(--cc-border);
    border-radius: 10px;
    background: var(--cc-surface-soft);
}

.cc-period-dialog-summary > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

@media (max-width: 900px) {
    .cc-period-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cc-loan-approval-context,
    .cc-loan-approval-limits,
    .cc-period-dialog-summary {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .cc-period-metrics {
        grid-template-columns: 1fr;
    }
}

.cc-loan-product-policy.cc-surface {
    padding: 14px;
    margin-bottom: 14px;
}

.cc-loan-product-policy-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.cc-loan-product-policy-heading > div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cc-loan-product-policy-heading span:not(.cc-status) {
    font-size: 12px;
    color: var(--cc-text-muted);
}

.cc-loan-product-policy-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 18px;
}

@media (max-width: 1000px) {
    .cc-loan-product-policy-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .cc-loan-product-policy-grid {
        grid-template-columns: 1fr;
    }

    .cc-loan-product-policy-heading {
        flex-direction: column;
    }
}

/* Bloque 8.6C.2 · períodos por año */
.cc-period-toolbar-year {
    align-items: end;
    justify-content: flex-start;
}

.cc-period-year-selector {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.cc-period-year-selector > span {
    font-size: 11px;
    font-weight: 700;
    color: var(--cc-text-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
}

.cc-period-year-note {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 0 4px;
    color: var(--cc-text-muted);
    font-size: 12px;
}

.cc-period-create-year {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid var(--cc-border);
    border-radius: 12px;
    background: var(--cc-surface-soft);
}

.cc-period-create-year span {
    color: var(--cc-text-muted);
    font-size: 12px;
    font-weight: 650;
}

.cc-period-create-year strong {
    font-size: 24px;
    font-variant-numeric: tabular-nums;
}


/* ===== Bloque 8.6C.3: acciones compactas de panel ===== */
.cc-panel-action.rz-button {
    min-height: 30px;
    padding: 4px 8px;
    color: var(--cc-primary);
    background: transparent;
    border: 1px solid transparent;
    box-shadow: none;
}

.cc-panel-action.rz-button .rz-button-text,
.cc-panel-action.rz-button .rz-button-icon {
    color: inherit;
}

.cc-panel-action.rz-button:hover {
    color: var(--cc-primary-hover);
    background: var(--cc-surface-soft);
    border-color: var(--cc-border);
}

.cc-panel-action.rz-button:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--cc-primary) 42%, transparent);
    outline-offset: 1px;
}