/* =========================================================
   CONDO_ABC - WEB
   Estilos principales
   ========================================================= */

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    font-family: "Segoe UI", Arial, sans-serif;
    background: #f4f6f9;
    color: #263238;
}

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

/* =========================================================
   LOGIN
   ========================================================= */

.login-screen {
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(
        135deg,
        #eef3f8 0%,
        #f7f9fb 100%
    );
    padding: 30px;
}

.login-card {
    width: 420px;
    max-width: 100%;
    background: #ffffff;
    border-radius: 12px;
    padding: 42px 44px 32px;
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.10);
    border: 1px solid #e1e7ed;
}

.login-logo {
    display: flex;
    justify-content: center;
    margin-bottom: 18px;
}

.logo-box {
    width: 76px;
    height: 76px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #17365d;
    color: #ffffff;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: 1px;
}

.login-card h1 {
    margin: 0;
    text-align: center;
    color: #17365d;
    font-size: 28px;
    font-weight: 700;
}

.login-subtitle {
    margin: 8px 0 32px;
    text-align: center;
    color: #6b7785;
    font-size: 14px;
}

/* =========================================================
   FORMULARIOS
   ========================================================= */

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 7px;
    color: #344454;
    font-size: 14px;
    font-weight: 600;
}

.form-group input {
    width: 100%;
    height: 46px;
    padding: 0 13px;
    border: 1px solid #cbd4dd;
    border-radius: 6px;
    background: #ffffff;
    color: #263238;
    font-size: 15px;
    outline: none;
    transition: border-color 0.15s ease,
                box-shadow 0.15s ease;
}

.form-group input:focus {
    border-color: #2f75b5;
    box-shadow: 0 0 0 3px rgba(47, 117, 181, 0.12);
}

/* =========================================================
   BOTONES
   ========================================================= */

.btn-primary {
    width: 100%;
    height: 46px;
    margin-top: 5px;
    border: none;
    border-radius: 6px;
    background: #17365d;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s ease,
                transform 0.05s ease;
}

.btn-primary:hover {
    background: #214b7c;
}

.btn-primary:active {
    transform: translateY(1px);
}

.btn-primary:disabled {
    background: #9ba8b5;
    cursor: not-allowed;
}

/* =========================================================
   ERRORES DEL LOGIN
   ========================================================= */

.login-error {
    margin: 0 0 16px;
    padding: 11px 12px;
    border-radius: 6px;
    background: #fff1f1;
    border: 1px solid #e5b8b8;
    color: #a12626;
    font-size: 13px;
    line-height: 1.4;
}

/* =========================================================
   FOOTER LOGIN
   ========================================================= */

.login-footer {
    margin-top: 28px;
    text-align: center;
    color: #8a96a3;
    font-size: 11px;
}

/* =========================================================
   APLICACIÓN PRINCIPAL
   ========================================================= */

.app-screen {
    width: 100%;
    height: 100vh;
    display: flex;
    overflow: hidden;
    background: #f4f6f9;
}

/* =========================================================
   SIDEBAR
   ========================================================= */

.sidebar {
    width: 245px;
    min-width: 245px;
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: #17365d;
    color: #ffffff;
}

.sidebar-header {
    min-height: 82px;
    display: flex;
    align-items: center;
    padding: 16px 18px;
    border-bottom: 1px solid rgba(255,255,255,0.12);
}

.sidebar-logo {
    width: 48px;
    height: 48px;
    margin-right: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #ffffff;
    color: #17365d;
    font-size: 18px;
    font-weight: 800;
}

.sidebar-title {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sidebar-title strong {
    font-size: 15px;
    line-height: 1.2;
}

.sidebar-title span {
    margin-top: 3px;
    color: #cbd8e6;
    font-size: 11px;
}

/* =========================================================
   MENÚ
   ========================================================= */

.main-menu {
    flex: 1;
    padding: 18px 10px;
    overflow-y: auto;
}

.menu-item {
    width: 100%;
    height: 44px;
    margin-bottom: 5px;
    padding: 0 13px;
    display: flex;
    align-items: center;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #dbe5ef;
    text-align: left;
    font-size: 14px;
    cursor: pointer;
}

.menu-item:hover {
    background: rgba(255,255,255,0.09);
    color: #ffffff;
}

.menu-item.active {
    background: rgba(255,255,255,0.16);
    color: #ffffff;
    font-weight: 600;
}

.menu-icon {
    width: 28px;
    margin-right: 7px;
    text-align: center;
    font-size: 17px;
}

/* =========================================================
   USUARIO / LOGOUT
   ========================================================= */

.sidebar-bottom {
    padding: 14px 12px;
    border-top: 1px solid rgba(255,255,255,0.12);
}

.logged-user {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.user-avatar {
    width: 38px;
    height: 38px;
    margin-right: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffffff;
    color: #17365d;
    font-weight: 700;
}

.user-info {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.user-info strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
}

.user-info span {
    margin-top: 2px;
    color: #cbd8e6;
    font-size: 10px;
}

.logout-button {
    width: 100%;
    height: 38px;
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 5px;
    background: transparent;
    color: #ffffff;
    font-size: 12px;
    cursor: pointer;
}

.logout-button:hover {
    background: rgba(255,255,255,0.10);
}

/* =========================================================
   CONTENIDO PRINCIPAL
   ========================================================= */

.main-content {
    flex: 1;
    min-width: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
}

.topbar {
    min-height: 76px;
    padding: 0 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff;
    border-bottom: 1px solid #dfe5eb;
}

.topbar h2 {
    margin: 0;
    color: #17365d;
    font-size: 21px;
}

.topbar span {
    display: block;
    margin-top: 4px;
    color: #7a8794;
    font-size: 12px;
}

.topbar-user {
    color: #526171;
    font-size: 13px;
    font-weight: 600;
}

/* =========================================================
   ÁREA DE CONTENIDO
   ========================================================= */

.content-area {
    flex: 1;
    overflow-y: auto;
    padding: 26px;
}

.page-section {
    width: 100%;
}

.section-header {
    margin-bottom: 22px;
}

.section-header h1 {
    margin: 0;
    color: #17365d;
    font-size: 24px;
}

.section-header p {
    margin: 6px 0 0;
    color: #73808e;
    font-size: 13px;
}

/* =========================================================
   DASHBOARD
   ========================================================= */

.welcome-card {
    padding: 32px;
    background: #ffffff;
    border: 1px solid #e0e6ec;
    border-radius: 9px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.welcome-card h1 {
    margin: 0 0 8px;
    color: #17365d;
    font-size: 26px;
}

.welcome-card p {
    margin: 5px 0;
    color: #526171;
}

.muted {
    color: #8995a2 !important;
    font-size: 13px;
}

/* =========================================================
   PLACEHOLDER
   ========================================================= */

.placeholder-card {
    padding: 35px;
    background: #ffffff;
    border: 1px solid #e0e6ec;
    border-radius: 8px;
    color: #7a8794;
    text-align: center;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 800px) {

    .sidebar {
        width: 205px;
        min-width: 205px;
    }

    .topbar {
        padding: 0 18px;
    }

    .content-area {
        padding: 18px;
    }

}

@media (max-width: 650px) {

    .sidebar {
        width: 68px;
        min-width: 68px;
    }

    .sidebar-title,
    .menu-item span:not(.menu-icon),
    .logged-user .user-info,
    .logout-button {
        display: none;
    }

    .sidebar-header {
        justify-content: center;
        padding: 15px 8px;
    }

    .sidebar-logo {
        margin-right: 0;
    }

    .menu-item {
        justify-content: center;
        padding: 0;
    }

    .menu-icon {
        margin-right: 0;
    }

    .sidebar-bottom {
        display: flex;
        justify-content: center;
    }

    .logged-user {
        margin: 0;
    }

    .user-avatar {
        margin: 0;
    }

    .topbar-user {
        display: none;
    }
}

/* ============================================================
   CONDO_ABC - DASHBOARD
   ============================================================ */

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(220px, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.dashboard-card {
    background: #ffffff;
    border: 1px solid #dfe5ec;
    border-radius: 12px;
    padding: 22px 24px;
    min-height: 135px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.dashboard-card-title {
    color: #1f4168;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
}

.dashboard-card-value {
    color: #173d66;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 8px;
}

.dashboard-card-label {
    color: #718096;
    font-size: 14px;
    line-height: 1.3;
}

.dashboard-finance {
    grid-column: span 3;
    min-height: 150px;
}

.dashboard-finance .dashboard-card-value {
    font-size: 30px;
}

.dashboard-secondary-value {
    color: #2f5d88;
    font-size: 24px;
    font-weight: 600;
    margin-top: 10px;
}

.dashboard-info-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;

    background: #ffffff;
    border: 1px solid #dfe5ec;
    border-radius: 12px;
    padding: 28px 32px;

    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.dashboard-info-card h2 {
    margin: 0 0 8px 0;
    color: #173d66;
    font-size: 28px;
    font-weight: 700;
}

.dashboard-info-card p {
    margin: 6px 0;
    color: #718096;
    font-size: 16px;
}

.dashboard-user-info {
    margin-top: 16px !important;
}

.dashboard-user-info strong {
    color: #173d66;
}

.dashboard-rate {
    min-width: 220px;
    text-align: right;
    padding-left: 25px;
    border-left: 1px solid #e1e6ec;
}

.dashboard-rate-title {
    color: #718096;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
}

.dashboard-rate-value {
    color: #173d66;
    font-size: 26px;
    font-weight: 700;
}

.dashboard-rate-date {
    color: #718096;
    font-size: 13px;
    margin-top: 6px;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 1100px) {

    .dashboard-grid {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }

    .dashboard-finance {
        grid-column: span 2;
    }
}

@media (max-width: 700px) {

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

    .dashboard-finance {
        grid-column: span 1;
    }

    .dashboard-info-card {
        flex-direction: column;
        align-items: flex-start;
    }

    .dashboard-rate {
        width: 100%;
        min-width: 0;
        text-align: left;
        padding-left: 0;
        padding-top: 20px;
        border-left: none;
        border-top: 1px solid #e1e6ec;
    }
}
/* =========================================================
   CONDO_ABC - DASHBOARD MODERNO FINAL
   ========================================================= */
.dashboard-modern{width:100%;max-width:1250px;margin:0 auto}
.dashboard-hero{position:relative;min-height:245px;margin:0 0 24px;overflow:hidden;border-radius:28px;background:linear-gradient(110deg,#fff 0%,#f5f9ff 52%,#e1efff 100%);border:1px solid #dce8f5;box-shadow:0 12px 32px rgba(31,65,104,.08)}
.dashboard-hero::before{content:"";position:absolute;inset:-80px -80px auto auto;width:620px;height:400px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(104,169,232,.22),rgba(104,169,232,.06) 55%,transparent 70%);pointer-events:none}
.dashboard-hero::after{content:"";position:absolute;right:-160px;bottom:-150px;width:760px;height:320px;border-radius:50%;background:rgba(120,181,235,.10);transform:rotate(-8deg);pointer-events:none}
.dashboard-hero-content{position:relative;z-index:2;min-height:245px;display:flex;align-items:center;justify-content:space-between;padding:30px 48px}
.dashboard-hero-text{max-width:600px}
.dashboard-eyebrow{color:#3377bb;font-size:13px;font-weight:800;letter-spacing:2px;margin-bottom:10px}
.dashboard-hero-text h1{margin:0;color:#173d66;font-size:38px;line-height:1.1;font-weight:800}
.dashboard-hero-text p{margin:12px 0 0;color:#6c84a0;font-size:19px}
.dashboard-hero-logo{position:relative;width:280px;height:220px;display:flex;align-items:center;justify-content:center}
.dashboard-hero-logo img{display:block;width:190px;height:190px;max-width:190px;max-height:190px;object-fit:contain;border-radius:50%;background:#fff;padding:6px;border:5px solid #fff;box-shadow:0 8px 26px rgba(23,61,102,.18)}
.dashboard-modern-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:18px}
.modern-card{position:relative;min-height:175px;padding:22px 25px;overflow:hidden;border-radius:22px;border:1px solid rgba(205,218,232,.85);box-shadow:0 8px 24px rgba(42,74,110,.07);transition:transform .18s ease,box-shadow .18s ease}
.modern-card:hover{transform:translateY(-2px);box-shadow:0 13px 30px rgba(42,74,110,.11)}
.card-blue{background:linear-gradient(135deg,#f2f8ff,#e6f1ff)}
.card-orange{background:linear-gradient(135deg,#fff9f1,#fff0df)}
.card-green{background:linear-gradient(135deg,#f0fcf8,#e2f8ef)}
.card-purple{background:linear-gradient(135deg,#f8f3ff,#eee8ff)}
.card-red{background:linear-gradient(135deg,#fff5f6,#ffeaed)}
.card-light-blue{background:linear-gradient(135deg,#f1f8ff,#e4f0ff)}
.card-finance-green{background:linear-gradient(135deg,#effbf6,#def6eb)}
.card-finance-yellow{background:linear-gradient(135deg,#fffaf0,#fff3d7)}
.modern-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.modern-icon{width:46px;height:46px;display:flex;align-items:center;justify-content:center;border-radius:15px;background:rgba(255,255,255,.65);font-size:22px;font-weight:700;box-shadow:0 3px 10px rgba(30,60,90,.04)}
.card-blue .modern-icon,.card-light-blue .modern-icon{color:#2872d4}.card-orange .modern-icon{color:#df7c00}.card-green .modern-icon,.card-finance-green .modern-icon{color:#079b68}.card-purple .modern-icon{color:#7042dc}.card-red .modern-icon{color:#d83b4c}.card-finance-yellow .modern-icon{color:#c98a00}
.modern-arrow{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.75);color:#2670d4;font-size:28px;line-height:1}
.modern-card-title{color:#173d66;font-size:19px;font-weight:800;line-height:1.2;margin-bottom:3px}
.modern-card-label{color:#6d87a4;font-size:14px;line-height:1.3;margin-bottom:11px}
.modern-card-value{color:#173d66;font-size:40px;line-height:1;font-weight:800}
.rate-value{font-size:28px}.rate-value span{font-size:20px;font-weight:700}.finance-value{font-size:29px;white-space:nowrap}
.modern-card-decoration{position:absolute;right:18px;bottom:-8px;font-size:55px;font-weight:900;opacity:.07;color:#2470d5;pointer-events:none}
.card-orange .modern-card-decoration{color:#df7c00}.card-green .modern-card-decoration{color:#079b68}.card-purple .modern-card-decoration{color:#7042dc}.card-red .modern-card-decoration{color:#d83b4c}.card-finance-yellow .modern-card-decoration{color:#c98a00}
.dashboard-user-card{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px 22px;margin-bottom:14px;background:#fff;border:1px solid #e2eaf2;border-radius:18px;box-shadow:0 6px 20px rgba(35,65,95,.05)}
.dashboard-user-card-left{display:flex;align-items:center;gap:13px}.dashboard-user-avatar{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#e9f3ff;color:#286fcb;font-size:18px;font-weight:800}.dashboard-user-title{color:#8494a5;font-size:12px;font-weight:600}.dashboard-user-name{color:#173d66;font-size:16px;font-weight:800;margin-top:2px}.dashboard-user-role{color:#72869b;font-size:12px;margin-top:2px}.dashboard-user-status{display:flex;align-items:center;gap:7px;color:#4d718d;font-size:13px;font-weight:600}.dashboard-status-dot{width:9px;height:9px;border-radius:50%;background:#3caf79;box-shadow:0 0 0 4px rgba(60,175,121,.12)}
.dashboard-accounting-note{display:flex;align-items:center;gap:15px;min-height:58px;padding:11px 20px;margin-bottom:10px;border-radius:18px;background:#fff;border:1px solid #e2eaf2;box-shadow:0 6px 20px rgba(35,65,95,.05);color:#6d8198;font-size:14px}.accounting-icon{flex:0 0 auto;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#e8f3ff;color:#2874d7;font-weight:800;font-size:17px}.dashboard-loading{padding:45px;text-align:center;color:#6d8198;font-size:17px}
@media(max-width:1100px){.dashboard-modern-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-hero-content{padding:28px}.dashboard-hero-text h1{font-size:32px}}
@media(max-width:760px){.dashboard-modern-grid{grid-template-columns:1fr}.dashboard-hero-content{flex-direction:column;text-align:center;padding:28px 18px}.dashboard-hero-logo{width:100%;height:auto;margin-top:18px}.dashboard-hero-logo img{width:145px;height:145px}.dashboard-hero-text h1{font-size:29px}.dashboard-hero-text p{font-size:16px}.dashboard-user-card{align-items:flex-start;flex-direction:column}.finance-value{font-size:26px}}


/* === DISEÑO REFERENCIA 17 OCT 2026: override acotado === */
[hidden]{display:none!important}
html,body{overflow:hidden;font-family:Arial,"Segoe UI",sans-serif;color:#0b285d}
.app-screen{background:#eaf3ff}
.sidebar{width:230px;min-width:230px;background:linear-gradient(160deg,#064d99 0%,#07336d 45%,#062b62 100%)}
.sidebar-header{height:105px;min-height:105px;padding:13px 12px;gap:9px}
.sidebar-logo{width:75px;height:75px;flex:0 0 75px;margin:0;background:transparent;border-radius:50%;overflow:hidden}
.sidebar-logo img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.sidebar-title strong{font-size:17px;line-height:1.05;letter-spacing:-.4px}
.sidebar-title span{font-size:9px;white-space:nowrap}
.main-menu{padding:12px;overflow-y:auto}
.menu-item{height:43px;margin:0 0 1px;border-radius:9px;color:#fff;font-size:13px;gap:7px}
.menu-item.active{background:linear-gradient(110deg,#1295f4,#0564d1);box-shadow:0 4px 13px #002e6c55}
.menu-icon{font-size:21px;width:23px;margin:0}
.sidebar-bottom{padding:12px;border-color:#ffffff24}
.topbar{position:absolute;top:0;right:0;width:calc(100% - 230px);height:0;min-height:0;padding:0;border:0;z-index:10;pointer-events:none;background:transparent}
.topbar>div:first-child{display:none}
.topbar-user{position:absolute;right:16px;top:10px;display:flex;align-items:center;gap:8px;border-radius:18px;background:#e8f3ffdf;padding:8px 12px;pointer-events:auto;color:#09245a;font-size:12px;box-shadow:0 3px 15px #1d63ac20}
.topbar-user-symbol{display:flex!important;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:white;color:#0d5cc2;font-size:15px;margin:0!important}
.topbar-user-details{display:flex;flex-direction:column}
.topbar-user-details span{margin:0;color:#0b285d;font-size:12px;font-weight:700}
.topbar-user-details small{font-size:9px;color:#47618a;margin-top:2px}
.content-area{padding:0;overflow-x:hidden;overflow-y:auto;scrollbar-gutter:stable;background:linear-gradient(130deg,#eaf4ff,#f3f7ff)}
#section-dashboard{padding:0}
.dashboard-reference{width:100%;max-width:1500px;margin:auto;padding:0 18px 12px}
.reference-hero{height:160px;position:relative;margin:0 -18px 8px;padding:28px 30px;overflow:hidden;background:linear-gradient(95deg,#f1f8ff 0%,#cdeaff 50%,#87c8f5 100%)}
.reference-hero:before{content:"";position:absolute;right:0;top:0;height:100%;width:50%;background-image:linear-gradient(90deg,#bfe4ff 0%,transparent 28%),url('../assets/edificio_banner.jpg');background-size:cover;background-position:center right;opacity:.95}
.reference-hero:after{content:"";position:absolute;bottom:-45px;left:-8%;width:118%;height:73px;background:#eaf4ff;border-radius:50% 50% 0 0 / 100% 100% 0 0;opacity:.7}
.reference-heading{position:relative;z-index:2}
.reference-heading h1{font-size:35px;color:#0b2a61;margin:0 0 6px;font-weight:800;letter-spacing:-1px}
.reference-heading p{font-size:17px;color:#6283aa;margin:0}
.reference-logo{position:absolute;z-index:3;width:126px;height:126px;object-fit:cover;left:47%;top:17px;border-radius:50%;border:4px solid #fff;box-shadow:0 2px 9px #0a387455}
.reference-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.metric-card{grid-column:span 2;position:relative;display:flex;align-items:flex-start;gap:14px;min-width:0;min-height:106px;padding:13px 12px;border:1px solid #dce9f7;border-radius:11px;box-shadow:0 4px 13px #315b8c12;overflow:hidden}
.metric-wide{grid-column:span 3;min-height:94px}
.metric-blue{background:linear-gradient(110deg,#f5faff,#e3f0ff)}.metric-orange{background:linear-gradient(110deg,#fff8f0,#ffeddf)}.metric-mint{background:linear-gradient(110deg,#effff8,#dff9ed)}.metric-purple{background:linear-gradient(110deg,#f9f4ff,#eee6ff)}.metric-rose{background:linear-gradient(110deg,#fff7f9,#ffe9ef)}.metric-sky{background:linear-gradient(110deg,#f3f9ff,#e4efff)}.metric-green{background:linear-gradient(110deg,#edfff7,#dcf8eb)}.metric-gold{background:linear-gradient(110deg,#fffaf0,#fff0d3)}
.metric-icon{flex:0 0 46px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;border-radius:12px;font-size:26px;font-weight:800;background:#d9eaff;color:#1265e2}
.metric-orange .metric-icon{background:#ffe1ca;color:#dc6c0b}.metric-mint .metric-icon,.metric-green .metric-icon{background:#c9f6e2;color:#02a567}.metric-purple .metric-icon{background:#e5d6ff;color:#7d3ae3}.metric-rose .metric-icon{background:#ffdbe2;color:#e33751}.metric-gold .metric-icon{background:#ffebad;color:#d79500}
.metric-copy{position:relative;z-index:2;min-width:0;padding-top:1px;flex:1}
.metric-title{font-size:13px;font-weight:800;color:#09245d;white-space:nowrap}
.metric-subtitle{font-size:11px;color:#5078a6;margin:3px 0 11px;white-space:nowrap}
.metric-value{font-size:27px;line-height:1;font-weight:800;letter-spacing:-.5px;color:#09245d;white-space:nowrap;font-variant-numeric:tabular-nums}
.metric-sky .metric-value,.metric-wide .metric-value{font-size:23px}
.metric-arrow{position:absolute;top:13px;right:12px;width:24px;height:24px;border-radius:50%;background:#ffffffa6;color:#0064d9;font-size:24px;line-height:20px;text-align:center;font-weight:700}
.metric-decor{position:absolute;right:12px;bottom:0;font-size:43px;color:#408cfa;opacity:.16;font-weight:900;pointer-events:none}
.metric-orange .metric-decor{color:#f58a36}.metric-mint .metric-decor,.metric-green .metric-decor{color:#00bd7a}.metric-purple .metric-decor{color:#9a68f3}.metric-rose .metric-decor{color:#e74c68}.metric-gold .metric-decor{color:#eebc35}
.reference-note{margin-top:8px;display:flex;align-items:center;gap:10px;min-height:42px;padding:8px 13px;border-radius:10px;background:#f7fbff;border:1px solid #e0ecfa;color:#476c9a;font-size:12px}
.reference-info{display:flex;align-items:center;justify-content:center;width:23px;height:23px;flex:0 0 23px;border-radius:50%;background:#0875e9;color:white;font-weight:800}
.brand-login-img{width:78px;height:78px;object-fit:cover;border-radius:50%}
@media(max-width:1100px){.metric-card{gap:8px;padding:12px 8px}.metric-icon{width:36px;height:36px;flex-basis:36px;font-size:20px}.metric-value{font-size:24px}.metric-sky .metric-value,.metric-wide .metric-value{font-size:20px}.metric-title{font-size:12px}.metric-subtitle{font-size:10px}}
@media(max-width:780px){.sidebar{width:68px;min-width:68px}.sidebar-header{padding:10px 5px}.sidebar-logo{width:54px;height:54px;flex-basis:54px}.sidebar-title{display:none}.topbar{width:calc(100% - 68px)}.dashboard-reference{padding:0 10px 12px}.reference-hero{margin:0 -10px 8px}.reference-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric-card,.metric-wide{grid-column:span 1}.reference-logo{width:85px;height:85px;left:auto;right:14px;top:52px}.reference-heading h1{font-size:25px}.reference-heading p{font-size:12px}.metric-value,.metric-wide .metric-value{font-size:19px}.metric-sky .metric-value{font-size:17px}}
@media(max-width:500px){.reference-grid{grid-template-columns:1fr}.metric-card,.metric-wide{grid-column:span 1}.topbar-user{padding:5px}.topbar-user-details span{font-size:10px}}
/* CONDO ABC — UNIDADES (agregar al final de style.css) */
.units-panel,.units-detail-card{background:#fff;border:1px solid #dbe6f5;border-radius:20px;padding:24px;box-shadow:0 12px 32px rgba(20,56,101,.06);margin:16px 0;color:#17385f}.units-heading,.units-detail-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.units-heading h2,.units-detail-head h3{font-size:25px;margin:6px 0;color:#163b6c}.units-heading p,.units-detail-head p{color:#64809f;margin:0}.units-eyebrow{color:#1677d2;font-size:12px;font-weight:800;letter-spacing:1.6px}.units-total{background:#eff7ff;padding:12px 22px;border-radius:16px;text-align:center;display:flex;flex-direction:column}.units-total strong{font-size:28px}.units-total span,.units-hint{font-size:12px;color:#7189a5}.units-toolbar{display:flex;align-items:center;gap:12px;margin:22px 0 12px;flex-wrap:wrap}.units-search-label{font-weight:700}.units-toolbar input{flex:1;min-width:220px;padding:13px 15px;border:1px solid #cfdeed;border-radius:12px;font:inherit}.units-toolbar button,.units-pagination button,.units-view,.units-detail-head button{border:1px solid #cddff1;border-radius:10px;background:#f0f7ff;color:#15569a;font:inherit;font-weight:700;padding:9px 14px;cursor:pointer}.units-view{white-space:nowrap}.units-pagination button:disabled{opacity:.4;cursor:default}.units-summary{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}.units-chip{background:#f0f5fb;border-radius:99px;padding:7px 12px;font-size:12px;color:#3a5b7e}.units-table-wrap{overflow-x:auto;border:1px solid #e1e9f3;border-radius:14px}.units-table{width:100%;border-collapse:collapse;min-width:760px;text-align:left}.units-table th{background:#f3f8ff;color:#426487;font-size:13px;padding:13px}.units-table td{padding:13px;border-top:1px solid #eaf0f7;font-size:14px}.units-table tbody tr:hover{background:#f7fbff}.units-type{background:#eaf4ff;border-radius:8px;padding:5px 8px;font-size:12px}.units-empty{text-align:center;color:#7c8da1}.units-pagination{display:flex;justify-content:space-between;align-items:center;margin-top:18px;gap:12px}.units-pagination div{display:flex;gap:8px}.units-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:20px 0}.units-field{background:#f4f8fd;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:6px;overflow-wrap:anywhere}.units-field span{font-size:12px;color:#64809f}.units-detail-card h4{margin:18px 0 12px}@media(max-width:650px){.units-panel,.units-detail-card{padding:14px}.units-heading h2{font-size:21px}}

/* Ventana modal Unidades: aislada del dashboard */
.units-modal-open{overflow:hidden!important}
.units-modal-overlay{position:fixed;inset:0;z-index:99999;background:rgba(5,24,55,.60);display:flex;align-items:center;justify-content:center;padding:20px}
.units-modal{width:min(1040px,100%);max-height:min(90vh,900px);background:white;border-radius:20px;box-shadow:0 24px 80px #061b3d66;display:flex;flex-direction:column;overflow:hidden;color:#163b6c}
.units-modal-header{display:flex;align-items:center;justify-content:space-between;padding:22px 28px;border-bottom:1px solid #dfeaf5;background:#f5faff}
.units-modal-header h2{margin:5px 0;font-size:27px}.units-modal-header p{margin:0;color:#6581a1}
.units-modal-x{border:0;background:#e7f1fd;color:#174b88;border-radius:10px;font-size:26px;width:42px;height:42px;cursor:pointer}
.units-modal-body{padding:8px 28px 24px;overflow-y:auto;min-height:0}.units-modal-body h3{font-size:17px;margin:22px 0 12px}
.units-modal-actions{padding:15px 28px;border-top:1px solid #dfeaf5;display:flex;justify-content:flex-end;gap:12px;background:#fff}
.units-modal-actions button,#units-error-close{border:1px solid #cddff1;border-radius:10px;background:#f0f7ff;color:#15569a;font:inherit;font-weight:700;padding:11px 20px;cursor:pointer}
.units-modal-actions .units-action-primary{background:#086ed5;color:#fff;border-color:#086ed5}
.units-modal-actions button:disabled{opacity:.6;cursor:wait}
.units-edit-field{display:flex;flex-direction:column;gap:7px;background:#f4f8fd;border-radius:12px;padding:12px;min-width:0}
.units-edit-field span{font-size:12px;color:#64809f}.units-edit-field input,.units-edit-field textarea{width:100%;min-width:0;border:1px solid #cbdced;border-radius:8px;padding:9px;color:#163b6c;background:#fff;font:inherit}
#units-save-error{color:#b42318;font-weight:600;margin:10px 0}.units-modal-loading{padding:40px;text-align:center}
@media(max-width:650px){.units-modal-overlay{padding:8px}.units-modal{max-height:96vh}.units-modal-header,.units-modal-actions{padding:14px}.units-modal-body{padding:8px 14px 16px}}


/* UNIDADES V2: cabecera y filtros fijos, desplazamiento únicamente de la tabla */
#section-unidades{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}
#section-unidades[hidden]{display:none!important}
#section-unidades>.section-header{display:none!important}
#unidades-content{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
#unidades-content>.units-panel{flex:1;min-height:0;display:flex;flex-direction:column;margin:12px 16px 14px;overflow:hidden}
.units-panel>.units-heading,.units-panel>.units-toolbar,.units-panel>.units-summary,.units-panel>.units-pagination{flex-shrink:0}
.units-panel>.units-table-wrap{flex:1;min-height:100px;overflow:auto;overscroll-behavior:contain}
.units-panel .units-table thead{position:sticky;top:0;z-index:2}
.units-panel .units-table thead th{position:sticky;top:0;background:#f3f8ff;z-index:2}

/* UNIDADES V2: estructura flex vertical; acciones siempre visibles */
#units-modal-content{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}
.units-modal{height:min(88dvh,860px);max-height:calc(100dvh - 28px);min-height:0}
.units-modal-header{flex:0 0 auto}
.units-modal-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.units-modal-actions{flex:0 0 auto;position:relative;z-index:2;box-shadow:0 -4px 15px rgba(20,56,101,.06)}
@media(max-width:650px){#unidades-content>.units-panel{margin:8px;padding:12px}.units-modal{height:calc(100dvh - 16px)}}

/* PROPIETARIOS WEB - diseño independiente */
#section-propietarios{height:100%;min-height:0;overflow:hidden}#section-propietarios>.section-header{display:none}#propietarios-content{height:100%;min-height:0;display:flex;flex-direction:column}.owners-panel{display:flex;flex-direction:column;flex:1;min-height:0;background:#fff;border:1px solid #dbe6f5;border-radius:22px;margin:12px 16px;padding:24px;color:#17385f}.owners-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.owners-heading h2{margin:7px 0;font-size:27px}.owners-heading p{margin:0;color:#64809f}.owners-toolbar{display:flex;align-items:center;gap:12px;margin:24px 0 14px}.owners-toolbar label{font-weight:700;white-space:nowrap}.owners-toolbar input{flex:1;min-width:0;border:1px solid #cfdeed;border-radius:12px;padding:13px 15px;font-size:16px}.owners-toolbar button,.owners-view,.owners-modal-actions button{border:1px solid #cddff1;border-radius:10px;background:#f0f7ff;color:#15569a;padding:10px 15px;font-weight:700;cursor:pointer}.owners-primary,.owners-modal-actions .owners-primary{background:#0877dc;color:#fff;border:1px solid #0877dc;border-radius:10px;padding:11px 18px;font-weight:700;cursor:pointer}.owners-count{color:#64809f;margin-bottom:10px}.owners-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e1e9f3;border-radius:14px}.owners-table{width:100%;min-width:900px;border-collapse:collapse;text-align:left}.owners-table th{position:sticky;top:0;background:#f3f8ff;color:#426487;padding:14px;z-index:1}.owners-table td{border-top:1px solid #eaf0f7;padding:12px}.owners-table tbody tr:hover{background:#f7fbff}.owners-overlay{position:fixed;inset:0;z-index:99999;background:#05183799;display:flex;align-items:center;justify-content:center;padding:20px}.owners-modal{width:min(1100px,100%);height:min(88dvh,850px);background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 24px 80px #061b3d66}.owners-modal #owners-modal-content{height:100%;display:flex;flex-direction:column;min-height:0}.owners-modal-head{display:flex;justify-content:space-between;align-items:center;padding:20px 28px;background:#f5faff;border-bottom:1px solid #dfeaf5}.owners-modal-head h2{margin:5px 0;font-size:25px}.owners-modal-head button{border:0;border-radius:10px;background:#e7f1fd;color:#174b88;font-size:26px;width:42px;height:42px;cursor:pointer}.owners-tabs{display:flex;gap:6px;padding:12px 25px 0;overflow-x:auto;border-bottom:1px solid #e1e9f3}.owners-tab{white-space:nowrap;padding:11px 15px;border:1px solid #dce8f6;border-radius:10px 10px 0 0;background:#f5f8fc;color:#335b86;cursor:pointer}.owners-tab.active{background:#0877dc;color:#fff}.owners-modal-body{flex:1;min-height:0;overflow:auto;padding:18px 28px}.owners-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.owners-field{display:flex;flex-direction:column;gap:7px;padding:12px;background:#f3f8fe;border-radius:12px;min-width:0}.owners-field span{font-size:12px;color:#64809f}.owners-field strong{overflow-wrap:anywhere}.owners-field input{width:100%;padding:9px;border:1px solid #cbdced;border-radius:8px;font:inherit}.owners-modal-actions{flex-shrink:0;display:flex;justify-content:flex-end;gap:10px;padding:14px 28px;border-top:1px solid #dfeaf5}#owners-error{color:#b42318;font-weight:600}.owners-tab-placeholder{padding:18px;background:#f4f8fd;border-radius:12px}@media(max-width:750px){.owners-fields{grid-template-columns:1fr 1fr}.owners-toolbar{flex-wrap:wrap}.owners-panel{padding:12px;margin:8px}}@media(max-width:500px){.owners-fields{grid-template-columns:1fr}.owners-heading{flex-wrap:wrap}.owners-modal-body{padding:12px}}


/* ============================================================
   CONDO ABC | SISTEMA VISUAL UNIFICADO 2026-10-18
   Una sola fuente de estilos para todas las páginas.
   Conserva estructura, scroll, eventos y cálculos.
   ============================================================ */
:root{--abc-navy:#0b2c61;--abc-blue:#0878dc;--abc-ink:#153b6d;--abc-line:#d8e8fa;--abc-muted:#587da7;--abc-shadow:0 12px 34px rgba(15,65,125,.095)}
#app-screen{background:#eaf4ff}
.content-area{background:linear-gradient(125deg,#edf6ff 0%,#dceeff 48%,#f1f7ff 100%);background-attachment:local}
.page-section:not(#section-dashboard){position:relative;isolation:isolate;min-width:0}
.page-section:not(#section-dashboard)::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:0 0 auto;height:200px;background:linear-gradient(105deg,#f0f8ff 0%,#cde9ff 62%,#a8dbfc 100%);border-radius:0 0 34px 34px}
/* Los paneles se separan del fondo con una sombra limpia; el hero es parte de cada tarjeta. */
#section-propietarios .owners-panel,#section-unidades .units-panel,
#section-finanzas .finanzas-subpage,#section-finanzas #finanzas-contenido-original,
#section-reportes>.placeholder-card,#section-auditoria>.placeholder-card,#section-configuracion>.placeholder-card{
 background:#fff!important;border:1px solid var(--abc-line)!important;border-radius:22px!important;
 box-shadow:var(--abc-shadow)!important;color:var(--abc-ink);
}
#section-propietarios .owners-panel,#section-unidades .units-panel{padding:18px!important;margin:12px 16px 14px!important;overflow:hidden}
/* Cabeceras equivalentes para directorios y para las demás secciones. */
#section-propietarios .owners-heading,#section-unidades .units-heading,
#section-finanzas .finanzas-subpage>.abc-page-hero,
.page-section>.section-header{
 position:relative;isolation:isolate;overflow:hidden;min-height:112px;
 display:flex;align-items:center;justify-content:space-between;gap:18px;
 padding:22px 28px!important;margin:0 0 18px!important;
 border-radius:18px;border:1px solid #cce4f8;
 background:linear-gradient(105deg,#e9f5ff 0%,#d3ebff 65%,#b6defb 100%)!important;
}
#section-propietarios .owners-heading::after,#section-unidades .units-heading::after,
#section-finanzas .abc-page-hero::after,.page-section>.section-header::after{
 content:"";position:absolute;z-index:-1;right:-58px;top:-125px;width:280px;height:280px;
 border:27px solid rgba(255,255,255,.3);border-radius:50%;pointer-events:none;
}
#section-propietarios .owners-heading h2,#section-unidades .units-heading h2,
#section-finanzas .abc-page-hero h2,.page-section>.section-header h1{
 margin:4px 0!important;font-size:26px!important;font-weight:800;color:var(--abc-navy)!important;letter-spacing:-.6px;
}
#section-propietarios .owners-heading p,#section-unidades .units-heading p,
#section-finanzas .abc-page-hero p,.page-section>.section-header p{margin:3px 0!important;color:#557ba4!important;font-size:14px!important}
#section-propietarios .units-eyebrow,#section-unidades .units-eyebrow{font-size:11px;letter-spacing:1.8px}
/* Las secciones tradicionales (reportes, auditoría, configuración) también usan la misma tarjeta. */
#section-reportes,#section-auditoria,#section-configuracion{padding:14px 18px 22px}
#section-reportes>.section-header,#section-auditoria>.section-header,#section-configuracion>.section-header{margin-bottom:14px!important}
#section-reportes>.placeholder-card,#section-auditoria>.placeholder-card,#section-configuracion>.placeholder-card{padding:30px}
/* Finanzas: eliminar caja blanca plana y darle cabecera de marca a cada subpágina. */
#section-finanzas{padding:12px 16px 20px}
#section-finanzas>.section-header{display:none!important}
#section-finanzas .finanzas-subpage{padding:18px!important;margin:0!important;min-width:0}
#section-finanzas .finanzas-subpage>.abc-page-hero{margin-bottom:18px!important}
#section-finanzas .finanzas-subpage>.abc-page-hero h2{margin:0!important}
#section-finanzas .finanzas-subpage>div:not(.abc-page-hero){max-width:100%}
/* Controles institucionales: excluye botones de la barra lateral y los del dashboard. */
.page-section:not(#section-dashboard) button:not(.owners-modal-head button):not(.units-modal-x){border-radius:10px;transition:box-shadow .15s ease,filter .15s ease}
.page-section:not(#section-dashboard) button:hover:not(:disabled){filter:brightness(.985);box-shadow:0 3px 10px rgba(19,85,159,.12)}
.page-section:not(#section-dashboard) input:focus-visible,.page-section:not(#section-dashboard) select:focus-visible{outline:2px solid #6fb9f6;outline-offset:1px}
/* Tablas: evitar anchos artificiales, preservar contenido y permitir scroll cuando corresponda. */
.owners-table,.units-table{table-layout:auto}
.owners-table th,.units-table th{font-size:12px!important;padding:10px 9px!important}
.owners-table td,.units-table td{font-size:12px!important;padding:9px 8px!important;line-height:1.35}
.owners-view,.units-view{font-size:12px!important;white-space:nowrap!important;padding:8px 10px!important}
#section-finanzas table{font-size:12px!important;border-collapse:collapse;table-layout:auto}
#section-finanzas table th,#section-finanzas table td{font-size:12px!important;line-height:1.3!important;padding:8px 7px!important;overflow-wrap:normal;word-break:normal}
#section-finanzas table th{background:#e9f3ff!important;color:#183d70!important;font-weight:800}
#section-finanzas table tbody tr:nth-child(even){background:#f8fbff}
#section-finanzas table tbody tr:hover{background:#edf6ff}
/* Sobrescribir min-width inline de 1480px para que el navegador calcule el mínimo real. */
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table{min-width:1080px!important;width:100%!important}
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table th,
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table td{font-size:11px!important;padding:7px 5px!important}
/* Modales: tipografía más compacta sin comprometer controles. */
:is(.owners-modal,.units-modal,dialog.extras-modal,#gastos-catalogo-overlay,#gastos-alicuota-overlay){font-size:13px!important;color:var(--abc-ink)}
:is(.owners-modal-head,.units-modal-header){background:linear-gradient(105deg,#edf7ff,#dcefff)!important;padding:14px 20px!important}
:is(.owners-modal-head h2,.units-modal-header h2){font-size:22px!important}
:is(.owners-modal-body,.units-modal-body){padding:12px 20px!important}
:is(.owners-modal,.units-modal,dialog.extras-modal) :is(input,select,textarea){font-size:13px!important}
:is(.owners-modal,.units-modal,dialog.extras-modal) button{font-size:12px!important}
.owners-tab{font-size:12px!important;padding:8px 11px!important}
.owners-field,.units-edit-field{padding:9px!important;gap:5px!important}
.owners-modal-actions,.units-modal-actions{padding:10px 20px!important}
@media(max-width:850px){#section-propietarios .owners-panel,#section-unidades .units-panel{margin:8px!important;padding:10px!important}#section-finanzas{padding:8px}#section-finanzas .finanzas-subpage{padding:10px!important}#section-propietarios .owners-heading,#section-unidades .units-heading,#section-finanzas .abc-page-hero{padding:16px!important;min-height:95px}}
@media(prefers-reduced-motion:reduce){.page-section button{transition:none!important}}

/* CONDO ABC V5 — Correcciones de legibilidad verificadas en capturas 18-10-2026 */
/* Evitar botones nativos grises, especialmente en Gastos. */
#section-finanzas .finanzas-subpage button,
#section-finanzas .finanzas-subpage select,
#section-finanzas .finanzas-subpage input:not([type="checkbox"]):not([type="radio"]){font:inherit;font-size:13px;min-height:35px;border:1px solid #c8def3;border-radius:10px;background:#f1f7ff;color:#164675;box-shadow:none;padding:7px 12px;vertical-align:middle}
#section-finanzas .finanzas-subpage button{font-weight:700;cursor:pointer;white-space:normal;line-height:1.25}
#section-finanzas .finanzas-subpage button:hover:not(:disabled){background:#e1f0ff;border-color:#8bbdf1}
#section-finanzas .finanzas-subpage button:disabled{opacity:.48;cursor:not-allowed}
#section-finanzas .finanzas-subpage button[id="gasto-nuevo"],
#section-finanzas .finanzas-subpage button[id="gasto-nuevo-gasto"],
#section-finanzas .finanzas-subpage button[id="gasto-agregar"]{background:#0878dc;color:#fff;border-color:#0878dc}
#section-finanzas .finanzas-subpage button[id="gasto-nuevo"]:hover:not(:disabled),
#section-finanzas .finanzas-subpage button[id="gasto-nuevo-gasto"]:hover:not(:disabled){background:#0865ba}
#section-finanzas .finanzas-subpage input[type="checkbox"]{accent-color:#0878dc;width:16px;height:16px}
/* El encabezado financiero debe permitir acciones sin apretar el título. */
#section-finanzas .abc-page-hero{min-height:124px!important;gap:20px!important;flex-wrap:wrap}
#section-finanzas .abc-page-hero>div{min-width:0;max-width:100%;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#section-finanzas .abc-page-hero h2{flex:1 1 320px;line-height:1.2}
#section-finanzas .abc-page-hero button{background:#fff!important;border-color:#a7cfee!important;color:#125a9e!important;white-space:nowrap!important;font-size:12px!important}
/* Gastos: no partir palabras como CÓDIGO, MONEDA, RECURRENTE. Scroll horizontal en tabla. */
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table{min-width:1320px!important;width:100%!important;table-layout:auto!important}
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table th,
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table td{white-space:nowrap!important;overflow-wrap:normal!important;word-break:keep-all!important;hyphens:none!important;padding:10px 12px!important;font-size:12px!important;line-height:1.35!important}
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table th{font-weight:800!important}
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table td:nth-child(5){white-space:normal!important;min-width:180px}
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] table td:nth-child(4){min-width:125px}
/* El contenedor de tabla conserva el desplazamiento horizontal, sin encoger columnas. */
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"]{overflow-x:hidden}
#section-finanzas .finanzas-subpage[data-finanzas-page="gastos"] div:has(> table){max-width:100%;overflow-x:auto;scrollbar-color:#a8c6e6 #f2f7fc}
/* Propietarios / Unidades: reducir espacio desperdiciado en cabeceras y búsqueda. */
#section-propietarios .owners-heading,#section-unidades .units-heading{min-height:118px!important;padding:19px 26px!important;margin-bottom:12px!important}
#section-propietarios .owners-toolbar{margin:14px 0 10px!important}
#section-propietarios .owners-panel,#section-unidades .units-panel{padding:16px!important}
#section-propietarios .owners-table th,#section-unidades .units-table th{white-space:nowrap!important;word-break:normal!important}
#section-propietarios .owners-table td,#section-unidades .units-table td{overflow-wrap:anywhere}
#section-propietarios .owners-table-wrap,#section-unidades .units-table-wrap{scrollbar-color:#a8c6e6 #f2f7fc}
/* Mantener marca y un aspecto consistente en todas las secciones. */
#section-finanzas .finanzas-subpage,#section-reportes>.placeholder-card,#section-auditoria>.placeholder-card,#section-configuracion>.placeholder-card{box-shadow:0 12px 32px rgba(15,65,125,.08)!important}
@media(max-width:900px){#section-finanzas .abc-page-hero{padding:16px!important}#section-finanzas .abc-page-hero>div{width:100%}#section-propietarios .owners-heading,#section-unidades .units-heading{padding:16px!important}}

/* Dashboard agrupado v2: aislado del resto de módulos */
#section-dashboard .ed-dashboard{max-width:1560px;margin:0 auto;color:#17365d;font-family:inherit}
#section-dashboard .ed-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:0 0 20px;flex-wrap:wrap}
#section-dashboard .ed-eyebrow{font-size:11px;letter-spacing:1.6px;font-weight:800;color:#357ec1}
#section-dashboard .ed-heading h1{font-size:27px;margin:4px 0;color:#103768}
#section-dashboard .ed-heading p{margin:0;color:#64819f;font-size:13px}
#section-dashboard .ed-rate{display:flex;flex-direction:column;background:#fff;border:1px solid #dce8f5;padding:12px 20px;border-radius:15px;box-shadow:0 5px 20px #133b6810}
#section-dashboard .ed-rate span{font-size:12px;color:#5d7b9d}#section-dashboard .ed-rate strong{font-size:17px}
#section-dashboard .ed-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:16px}
#section-dashboard .ed-kpi{min-width:0;padding:19px 18px;border-radius:17px;border:1px solid #dce9f6;display:flex;flex-direction:column;gap:8px;box-shadow:0 7px 19px #133b680e}
#section-dashboard .ed-kpi.blue{background:linear-gradient(125deg,#f1f8ff,#ddecff)}#section-dashboard .ed-kpi.purple{background:linear-gradient(125deg,#fbf7ff,#eee5ff)}#section-dashboard .ed-kpi.green{background:linear-gradient(125deg,#f3fff9,#dff9ed)}#section-dashboard .ed-kpi.amber{background:linear-gradient(125deg,#fffaf0,#ffebd3)}
#section-dashboard .ed-kpi-label{font-size:12px;font-weight:750}#section-dashboard .ed-kpi strong{font-size:clamp(16px,1.5vw,23px);overflow-wrap:anywhere;color:#092f62}#section-dashboard .ed-kpi small{font-size:12px;color:#547395}
#section-dashboard .ed-main-grid{display:grid;grid-template-columns:1fr 1.35fr 1fr;gap:15px}#section-dashboard .ed-bottom-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:15px;margin-top:15px}
#section-dashboard .ed-panel{background:#fff;border:1px solid #dce7f4;border-radius:17px;overflow:hidden;box-shadow:0 8px 24px #133b6812;min-width:0}
#section-dashboard .ed-panel h2{background:linear-gradient(105deg,#15558e,#0c376b);color:white;margin:0;padding:13px 17px;font-size:15px;font-weight:750}#section-dashboard .ed-panel-body{padding:15px}
#section-dashboard .ed-unit-list>div,#section-dashboard .ed-detail-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 3px;border-bottom:1px solid #e5edf7;font-size:13px}#section-dashboard .ed-unit-list strong,#section-dashboard .ed-detail-row strong{font-size:17px;color:#123c75;text-align:right;overflow-wrap:anywhere}
#section-dashboard .ed-unit-list .ed-unit-total{background:#e7f2ff;padding:13px;border-radius:10px;margin-top:9px;font-weight:800;border:0}#section-dashboard .ed-owner-summary{display:flex;justify-content:space-between;padding:14px 4px 0;font-size:13px}
#section-dashboard .ed-fund{border-radius:13px;padding:14px;margin-bottom:10px}#section-dashboard .ed-fund.reserve{background:#e8faf0}#section-dashboard .ed-fund.benefits{background:#e8f3ff}#section-dashboard .ed-fund-main{display:flex;justify-content:space-between;gap:10px;align-items:center}#section-dashboard .ed-fund-label{font-size:13px;font-weight:750}#section-dashboard .ed-fund-value{font-size:20px;font-weight:850;margin:5px 0;overflow-wrap:anywhere}#section-dashboard .ed-fund-usd{font-size:13px;color:#52749b}#section-dashboard .ed-fund-percent{font-weight:800;font-size:12px;background:white;border-radius:18px;padding:5px 9px}#section-dashboard .ed-progress{height:7px;background:#ffffffa8;border-radius:20px;overflow:hidden;margin-top:10px}#section-dashboard .ed-progress span{display:block;height:100%;background:#13a36a;border-radius:20px}#section-dashboard .benefits .ed-progress span{background:#237cdd}
#section-dashboard .ed-fund-total{display:flex;flex-direction:column;gap:5px;background:#fff4df;border-radius:12px;padding:14px}#section-dashboard .ed-fund-total span{font-size:13px;font-weight:700}#section-dashboard .ed-fund-total strong{font-size:20px;overflow-wrap:anywhere}#section-dashboard .ed-fund-total small{color:#647c95}
#section-dashboard .ed-available{background:#ecfaf3;padding:17px;border-radius:12px;margin-bottom:12px;display:flex;flex-direction:column;gap:9px}#section-dashboard .ed-available:nth-child(2){background:#edf5ff}#section-dashboard .ed-available span{font-size:13px;font-weight:700}#section-dashboard .ed-available strong{font-size:21px;overflow-wrap:anywhere}#section-dashboard .ed-explain{font-size:12px;color:#66809a;line-height:1.55;margin:12px 0 0}#section-dashboard .ed-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}#section-dashboard .ed-actions button{min-height:75px;padding:12px;background:#e9f4ff;border:1px solid #c7e1fa;border-radius:12px;color:#164b80;font-weight:750;cursor:pointer}#section-dashboard .ed-actions button:hover{background:#d9edff}#section-dashboard .ed-actions button:focus-visible{outline:3px solid #3285e0;outline-offset:2px}#section-dashboard .ed-footnote{font-size:11px;color:#64809b;margin-top:13px;padding:10px 15px;background:#fff;border-radius:10px}
@media(max-width:1200px){#section-dashboard .ed-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}#section-dashboard .ed-main-grid{grid-template-columns:1fr 1fr}#section-dashboard .ed-available-panel{grid-column:1/-1}}
@media(max-width:750px){#section-dashboard .ed-kpis,#section-dashboard .ed-main-grid,#section-dashboard .ed-bottom-grid{grid-template-columns:1fr}#section-dashboard .ed-available-panel{grid-column:auto}#section-dashboard .ed-heading h1{font-size:23px}}
@media(max-width:450px){#section-dashboard .ed-kpis{grid-template-columns:1fr}#section-dashboard .ed-actions{grid-template-columns:1fr}}