/* /Components/Dashboard/ActivityCard.razor.rz.scp.css */
.activity-card[b-1afepqzh9d] {
    display: grid;
    grid-template-columns: 32px 1fr auto;
    gap: 12px;
    padding: 10px 0;
}

.activity-card__timeline[b-1afepqzh9d] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.activity-card__bullet[b-1afepqzh9d] {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

[b-1afepqzh9d] .activity-card__bullet .mud-icon-root {
    font-size: 16px;
}

.activity-card__line[b-1afepqzh9d] {
    width: 2px;
    flex: 1;
    background: #e2e8f0;
    margin-top: 6px;
}

.activity-card--last .activity-card__line[b-1afepqzh9d] {
    visibility: hidden;
}

.activity-card__content h5[b-1afepqzh9d] {
    margin: 0;
    color: #1e3a8a;
    font-size: 14px;
    font-weight: 700;
}

.activity-card__content p[b-1afepqzh9d] {
    margin: 2px 0 0;
    color: #64748b;
    font-size: 13px;
}

.activity-card__time[b-1afepqzh9d] {
    color: #64748b;
    font-size: 12px;
    white-space: nowrap;
}
/* /Components/Dashboard/ConfigurationCard.razor.rz.scp.css */
.configuration-card[b-67f8d31ks1] {
    border: 1px solid #e5e7eb;
    min-height: 110px;
    border-radius: 0;
    display: grid;
    grid-template-columns: 48px 1fr 18px;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    cursor: pointer;
    background: #fff;
    transition: background-color .15s ease;
}

.configuration-card:hover[b-67f8d31ks1] {
    background: #f8fafc;
}

.configuration-card__icon[b-67f8d31ks1] {
    width: 48px;
    height: 48px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.configuration-card__text h4[b-67f8d31ks1] {
    margin: 0;
    font-size: 16px;
    color: #1e3a8a;
    font-weight: 700;
}

.configuration-card__text p[b-67f8d31ks1] {
    margin: 3px 0 0;
    font-size: 14px;
    color: #64748b;
    line-height: 1.3;
}

.configuration-card__arrow[b-67f8d31ks1] {
    color: #94a3b8;
    justify-self: end;
}
/* /Components/Dashboard/StatCard.razor.rz.scp.css */
.stat-card[b-jqu3nifapa] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px 16px 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.stat-card__top[b-jqu3nifapa] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.stat-card__icon[b-jqu3nifapa] {
    width: 72px;
    height: 72px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

[b-jqu3nifapa] .stat-card__icon .mud-icon-root {
    font-size: 34px;
}

.stat-card__content[b-jqu3nifapa] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.stat-card__title[b-jqu3nifapa] {
    font-size: 13px;
    color: #64748b;
    font-weight: 700;
    letter-spacing: 0.3px;
}

.stat-card__value[b-jqu3nifapa] {
    font-size: 44px;
    line-height: 1;
    color: #0f172a;
    font-weight: 700;
}

.stat-card__change[b-jqu3nifapa] {
    color: #22c55e;
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

[b-jqu3nifapa] .stat-card__change .mud-icon-root {
    font-size: 16px;
}

.stat-card__action[b-jqu3nifapa] {
    margin-top: 14px;
    height: 40px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
    color: #64748b;
    font-size: 16px;
    font-weight: 600;
}

.stat-card__action:hover[b-jqu3nifapa] {
    background: #f8fafc;
}
/* /Layout/Admin/AdminDashboard.razor.rz.scp.css */
/* =========================================================
   ADMIN DASHBOARD
   Diseño alineado al mockup del rol Administrador HABYTAL.
   ========================================================= */

.admin-dashboard-page[b-bbvzxh44wr] {
    width: 100%;
    min-height: 100vh;
    position: relative;
    background: #f7f9fd;
    overflow-x: hidden;
    box-sizing: border-box;
    color: #0f172a;
}

/* =========================================================
   SECCIÓN: TOPBAR
   ========================================================= */

.admin-dashboard-topbar[b-bbvzxh44wr] {
    position: sticky;
    top: 0;
    z-index: 100;
    height: 82px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 0 32px;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid #e5eaf3;
    box-sizing: border-box;
    backdrop-filter: blur(14px);
}

.admin-tenant-selector[b-bbvzxh44wr] {
    width: min(430px, 42vw);
}

.tenant-select[b-bbvzxh44wr] {
    width: 100%;
}

.admin-topbar-actions[b-bbvzxh44wr] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    min-width: 0;
}

.topbar-icon[b-bbvzxh44wr] {
    color: #33415c !important;
}

.admin-notification-badge[b-bbvzxh44wr] {
    display: inline-flex;
}

.admin-user-card[b-bbvzxh44wr] {
    min-width: 224px;
    height: 58px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding-left: 18px;
    margin-left: 8px;
    border-left: 1px solid #e5eaf3;
}

.admin-avatar[b-bbvzxh44wr] {
    width: 42px;
    height: 42px;
    min-width: 42px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: #ffffff;
    background: linear-gradient(135deg, #ff9f43 0%, #2f80ed 100%);
    font-size: 0.78rem;
    font-weight: 900;
}

.admin-user-info[b-bbvzxh44wr] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

    .admin-user-info strong[b-bbvzxh44wr] {
        color: #0f172a;
        font-size: 0.88rem;
        font-weight: 900;
        white-space: nowrap;
    }

    .admin-user-info span[b-bbvzxh44wr] {
        margin-top: 5px;
        color: #667085;
        font-size: 0.78rem;
        font-weight: 700;
        white-space: nowrap;
    }

/* =========================================================
   SECCIÓN: CONTENIDO
   ========================================================= */

.admin-dashboard-content[b-bbvzxh44wr] {
    width: 100%;
    max-width: 100%;
    padding: 26px 32px 34px 32px;
    box-sizing: border-box;
}

.admin-welcome[b-bbvzxh44wr] {
    margin-bottom: 22px;
}

    .admin-welcome h1[b-bbvzxh44wr] {
        margin: 0;
        color: #0f172a;
        font-size: 1.58rem;
        line-height: 1.2;
        font-weight: 900;
    }

    .admin-welcome p[b-bbvzxh44wr] {
        margin: 7px 0 0;
        color: #667085;
        font-size: 0.94rem;
        font-weight: 600;
    }

/* =========================================================
   SECCIÓN: KPIS
   ========================================================= */

.admin-kpi-grid[b-bbvzxh44wr] {
    display: grid;
    grid-template-columns: repeat(4, minmax(220px, 1fr));
    gap: 18px;
    margin-bottom: 20px;
}

.admin-kpi-card[b-bbvzxh44wr] {
    position: relative;
    min-height: 134px;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 20px 22px;
    border: 1px solid #e4eaf4;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 35, 70, 0.045);
    box-sizing: border-box;
    overflow: hidden;
}

.admin-kpi-icon[b-bbvzxh44wr] {
    width: 76px;
    height: 76px;
    min-width: 76px;
    display: grid;
    place-items: center;
    border-radius: 999px;
}

    .admin-kpi-icon.purple[b-bbvzxh44wr],
    .activity-icon.purple[b-bbvzxh44wr],
    .reservation-icon.purple[b-bbvzxh44wr],
    .quick-action .purple[b-bbvzxh44wr] {
        background: #f0e6ff;
        color: #5f35d8;
    }

    .admin-kpi-icon.green[b-bbvzxh44wr],
    .activity-icon.green[b-bbvzxh44wr],
    .reservation-icon.green[b-bbvzxh44wr],
    .quick-action .green[b-bbvzxh44wr] {
        background: #e8f8ee;
        color: #16a34a;
    }

    .admin-kpi-icon.blue[b-bbvzxh44wr],
    .activity-icon.blue[b-bbvzxh44wr],
    .reservation-icon.blue[b-bbvzxh44wr],
    .quick-action .blue[b-bbvzxh44wr] {
        background: #e8f2ff;
        color: #2563eb;
    }

    .admin-kpi-icon.orange[b-bbvzxh44wr],
    .activity-icon.orange[b-bbvzxh44wr],
    .reservation-icon.orange[b-bbvzxh44wr],
    .quick-action .orange[b-bbvzxh44wr] {
        background: #fff2df;
        color: #ff8a00;
    }

.reservation-icon.cyan[b-bbvzxh44wr],
.quick-action .teal[b-bbvzxh44wr] {
    background: #e9fbfb;
    color: #0ea5a5;
}

.admin-kpi-body[b-bbvzxh44wr] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

    .admin-kpi-body span[b-bbvzxh44wr] {
        color: #111827;
        font-size: 0.84rem;
        font-weight: 900;
    }

    .admin-kpi-body strong[b-bbvzxh44wr] {
        margin-top: 11px;
        color: #0f172a;
        font-size: clamp(1.35rem, 2vw, 1.65rem);
        line-height: 1;
        font-weight: 900;
        white-space: nowrap;
    }

    .admin-kpi-body small[b-bbvzxh44wr] {
        margin-top: 14px;
        color: #667085;
        font-size: 0.80rem;
        font-weight: 800;
        white-space: nowrap;
    }

.trend-positive[b-bbvzxh44wr] {
    color: #03a64a !important;
}

.trend-negative[b-bbvzxh44wr] {
    color: #ef233c !important;
}

.admin-card-menu[b-bbvzxh44wr] {
    position: absolute;
    top: 20px;
    right: 18px;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #42526e;
    cursor: pointer;
}

/* =========================================================
   SECCIÓN: GRID PRINCIPAL
   ========================================================= */

.admin-dashboard-grid[b-bbvzxh44wr] {
    display: grid;
    grid-template-columns: minmax(420px, 1.06fr) minmax(300px, 0.88fr) minmax(440px, 1.20fr);
    gap: 18px;
    align-items: stretch;
}

.admin-panel[b-bbvzxh44wr] {
    min-width: 0;
    border: 1px solid #e4eaf4;
    border-radius: 16px;
    padding: 22px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 35, 70, 0.045);
    box-sizing: border-box;
    overflow: hidden;
}

    .admin-panel h2[b-bbvzxh44wr] {
        margin: 0;
        color: #111827;
        font-size: 1rem;
        line-height: 1.2;
        font-weight: 900;
    }

.admin-panel-header[b-bbvzxh44wr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

    .admin-panel-header a[b-bbvzxh44wr],
    .admin-panel-link[b-bbvzxh44wr] {
        color: #4b22d0;
        font-size: 0.82rem;
        font-weight: 900;
        text-decoration: none;
        cursor: pointer;
    }

.admin-panel-link[b-bbvzxh44wr] {
    display: block;
    margin-top: 18px;
    padding-top: 16px;
    text-align: center;
    border-top: 1px solid #edf1f7;
}

/* =========================================================
   SECCIÓN: ESTADO DE CARTERA
   ========================================================= */

.portfolio-panel[b-bbvzxh44wr],
.reservations-panel[b-bbvzxh44wr],
.activity-panel[b-bbvzxh44wr] {
    min-height: 380px;
}

.portfolio-content[b-bbvzxh44wr] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 42px;
    margin-top: 28px;
    flex-wrap: wrap;
}

.portfolio-donut[b-bbvzxh44wr] {
    width: 210px;
    height: 210px;
    position: relative;
    display: grid;
    place-items: center;
    justify-self: center;
    border-radius: 50%;
    background: conic-gradient(#22c55e 0 68%, #facc15 68% 88%, #fb923c 88% 94%, #ef4444 94% 100%);
}

    .portfolio-donut[b-bbvzxh44wr]::before {
        content: "";
        position: absolute;
        width: 132px;
        height: 132px;
        border-radius: 50%;
        background: #ffffff;
    }

    .portfolio-donut strong[b-bbvzxh44wr],
    .portfolio-donut span[b-bbvzxh44wr] {
        position: relative;
        z-index: 1;
        color: #0f172a;
        font-weight: 900;
    }

    .portfolio-donut strong[b-bbvzxh44wr] {
        align-self: end;
        font-size: 2.4rem;
        line-height: 1;
    }

    .portfolio-donut span[b-bbvzxh44wr] {
        align-self: start;
        margin-top: 5px;
        color: #667085;
        font-size: 0.90rem;
    }

.portfolio-list[b-bbvzxh44wr] {
    display: flex;
    flex-direction: column;
    gap: 17px;
}

.portfolio-row[b-bbvzxh44wr] {
    display: grid;
    grid-template-columns: 12px 1fr auto;
    align-items: center;
    gap: 12px;
    color: #344054;
    font-size: 0.82rem;
    font-weight: 800;
}

    .portfolio-row i[b-bbvzxh44wr] {
        width: 10px;
        height: 10px;
        border-radius: 999px;
    }

        .portfolio-row i.green[b-bbvzxh44wr] {
            background: #22c55e;
        }

        .portfolio-row i.yellow[b-bbvzxh44wr] {
            background: #facc15;
        }

        .portfolio-row i.orange[b-bbvzxh44wr] {
            background: #fb923c;
        }

        .portfolio-row i.red[b-bbvzxh44wr] {
            background: #ef4444;
        }

    .portfolio-row strong[b-bbvzxh44wr] {
        color: #263a5a;
        font-size: 0.78rem;
        font-weight: 900;
    }

/* =========================================================
   SECCIÓN: RESERVAS
   ========================================================= */

.reservation-list[b-bbvzxh44wr] {
    margin-top: 22px;
}

.reservation-item[b-bbvzxh44wr] {
    display: grid;
    grid-template-columns: 48px 1fr auto;
    align-items: center;
    gap: 14px;
    padding: 12px 8px;
    border-bottom: 1px solid #edf1f7;
}

.reservation-icon[b-bbvzxh44wr] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 10px;
}

.reservation-name strong[b-bbvzxh44wr] {
    color: #111827;
    font-size: 0.84rem;
    font-weight: 900;
}

.reservation-count[b-bbvzxh44wr] {
    text-align: right;
}

    .reservation-count strong[b-bbvzxh44wr] {
        display: block;
        color: #0f172a;
        font-size: 1.06rem;
        font-weight: 900;
    }

    .reservation-count span[b-bbvzxh44wr] {
        display: block;
        margin-top: 4px;
        color: #667085;
        font-size: 0.70rem;
        font-weight: 800;
    }

/* =========================================================
   SECCIÓN: ACTIVIDAD
   ========================================================= */

.activity-list[b-bbvzxh44wr] {
    margin-top: 12px;
}

.activity-item[b-bbvzxh44wr] {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid #edf1f7;
}

.activity-icon[b-bbvzxh44wr] {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 10px;
}

.activity-body[b-bbvzxh44wr] {
    min-width: 0;
}

    .activity-body strong[b-bbvzxh44wr],
    .activity-body span[b-bbvzxh44wr] {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .activity-body strong[b-bbvzxh44wr] {
        color: #111827;
        font-size: 0.82rem;
        font-weight: 900;
    }

    .activity-body span[b-bbvzxh44wr] {
        margin-top: 4px;
        color: #667085;
        font-size: 0.78rem;
        font-weight: 700;
    }

.activity-item small[b-bbvzxh44wr] {
    color: #667085;
    font-size: 0.70rem;
    font-weight: 900;
    white-space: nowrap;
}

/* =========================================================
   SECCIÓN: ACCESOS RÁPIDOS
   ========================================================= */

.quick-actions-panel[b-bbvzxh44wr] {
    grid-column: 1 / -1;
    min-height: 178px;
    padding: 20px 24px 22px;
}

.quick-actions-grid[b-bbvzxh44wr] {
    display: grid;
    grid-template-columns: repeat(9, minmax(90px, 1fr));
    gap: 16px;
    margin-top: 20px;
}

.quick-action[b-bbvzxh44wr] {
    min-height: 112px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: #0f172a;
    cursor: pointer;
    font-weight: 900;
    transition: background 170ms ease, transform 170ms ease;
}

    .quick-action:hover[b-bbvzxh44wr] {
        background: #f6f7fb;
        transform: translateY(-2px);
    }

    .quick-action span[b-bbvzxh44wr] {
        width: 62px;
        height: 62px;
        display: grid;
        place-items: center;
        border-radius: 10px;
    }

    .quick-action strong[b-bbvzxh44wr] {
        color: #111827;
        font-size: 0.82rem;
        line-height: 1.25;
        text-align: center;
        font-weight: 900;
    }

/* =========================================================
   SECCIÓN: MODO OSCURO
   ========================================================= */

.admin-dashboard-page.is-dark[b-bbvzxh44wr] {
    background: var(--mud-palette-background, #0f172a);
    color: var(--mud-palette-text-primary, #f8fafc);
}

    .admin-dashboard-page.is-dark .admin-dashboard-topbar[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .admin-kpi-card[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .admin-panel[b-bbvzxh44wr] {
        background: var(--mud-palette-surface, #111c2f);
        border-color: rgba(248, 250, 252, 0.12);
    }

    .admin-dashboard-page.is-dark h1[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark h2[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .admin-kpi-body span[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .admin-kpi-body strong[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .admin-user-info strong[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .reservation-name strong[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .reservation-count strong[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .activity-body strong[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .quick-action strong[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .portfolio-donut strong[b-bbvzxh44wr] {
        color: var(--mud-palette-text-primary, #f8fafc);
    }

    .admin-dashboard-page.is-dark .admin-welcome p[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .admin-user-info span[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .admin-kpi-body small[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .activity-body span[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .activity-item small[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .reservation-count span[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .portfolio-donut span[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .portfolio-row[b-bbvzxh44wr] {
        color: var(--mud-palette-text-secondary, #cbd5e1);
    }

    .admin-dashboard-page.is-dark .portfolio-donut[b-bbvzxh44wr]::before {
        background: var(--mud-palette-surface, #111c2f);
    }

    .admin-dashboard-page.is-dark .admin-panel-link[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .activity-item[b-bbvzxh44wr],
    .admin-dashboard-page.is-dark .reservation-item[b-bbvzxh44wr] {
        border-color: rgba(248, 250, 252, 0.12);
    }

/* =========================================================
   SECCIÓN: RESPONSIVE
   ========================================================= */

@media (max-width: 1500px) {
    .admin-kpi-grid[b-bbvzxh44wr] {
        grid-template-columns: repeat(2, minmax(240px, 1fr));
    }

    .admin-dashboard-grid[b-bbvzxh44wr] {
        grid-template-columns: 1fr 1fr;
    }

    .activity-panel[b-bbvzxh44wr] {
        grid-column: 1 / -1;
    }

    .quick-actions-grid[b-bbvzxh44wr] {
        grid-template-columns: repeat(5, minmax(100px, 1fr));
    }
}

@media (max-width: 1100px) {
    .admin-dashboard-grid[b-bbvzxh44wr] {
        grid-template-columns: 1fr;
    }

    .activity-panel[b-bbvzxh44wr] {
        grid-column: auto;
    }

    .portfolio-content[b-bbvzxh44wr] {
        grid-template-columns: 1fr;
    }

    .quick-actions-grid[b-bbvzxh44wr] {
        grid-template-columns: repeat(3, minmax(100px, 1fr));
    }
}

@media (max-width: 760px) {
    .admin-dashboard-topbar[b-bbvzxh44wr] {
        height: auto;
        align-items: stretch;
        flex-direction: column;
        padding: 16px;
    }

    .admin-tenant-selector[b-bbvzxh44wr] {
        width: 100%;
    }

    .admin-topbar-actions[b-bbvzxh44wr] {
        justify-content: space-between;
    }

    .admin-user-card[b-bbvzxh44wr] {
        min-width: 0;
        padding-left: 10px;
    }

    .admin-dashboard-content[b-bbvzxh44wr] {
        padding: 18px;
    }

    .admin-kpi-grid[b-bbvzxh44wr],
    .quick-actions-grid[b-bbvzxh44wr] {
        grid-template-columns: 1fr;
    }

    .admin-kpi-card[b-bbvzxh44wr] {
        min-height: 120px;
    }
}

/* =========================================================
   SECCIÓN: RESPONSIVE PROFESIONAL Y TEMAS
   Ajustes finales para escritorio, tablet, móvil, modo claro
   y modo oscuro sin cambiar lógica ni contratos del componente.
   ========================================================= */

.admin-dashboard-page[b-bbvzxh44wr] {
    --admin-bg: #f7f9fd;
    --admin-surface: #ffffff;
    --admin-surface-soft: #f6f7fb;
    --admin-border: #e4eaf4;
    --admin-border-soft: #edf1f7;
    --admin-text: #0f172a;
    --admin-text-strong: #111827;
    --admin-text-muted: #667085;
    --admin-link: #4b22d0;
    --admin-shadow: 0 10px 26px rgba(15, 35, 70, 0.045);
    --admin-topbar-bg: rgba(255, 255, 255, 0.96);
    background: var(--admin-bg);
    color: var(--admin-text);
}

    .admin-dashboard-page.is-dark[b-bbvzxh44wr] {
        --admin-bg: #0b1220;
        --admin-surface: #111c2f;
        --admin-surface-soft: #16243a;
        --admin-border: rgba(248, 250, 252, 0.12);
        --admin-border-soft: rgba(248, 250, 252, 0.10);
        --admin-text: #f8fafc;
        --admin-text-strong: #ffffff;
        --admin-text-muted: #cbd5e1;
        --admin-link: #a78bfa;
        --admin-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
        --admin-topbar-bg: rgba(17, 28, 47, 0.94);
    }

.admin-dashboard-topbar[b-bbvzxh44wr],
.admin-kpi-card[b-bbvzxh44wr],
.admin-panel[b-bbvzxh44wr],
.quick-action[b-bbvzxh44wr],
.admin-user-card[b-bbvzxh44wr],
.portfolio-donut[b-bbvzxh44wr]::before {
    transition: background-color 220ms ease, color 220ms ease, border-color 220ms ease, box-shadow 220ms ease, transform 170ms ease;
}

.admin-dashboard-page .admin-dashboard-topbar[b-bbvzxh44wr] {
    background: var(--admin-topbar-bg);
    border-bottom-color: var(--admin-border);
}

.admin-dashboard-page .admin-kpi-card[b-bbvzxh44wr],
.admin-dashboard-page .admin-panel[b-bbvzxh44wr] {
    background: var(--admin-surface);
    border-color: var(--admin-border);
    box-shadow: var(--admin-shadow);
}

.admin-dashboard-page h1[b-bbvzxh44wr],
.admin-dashboard-page h2[b-bbvzxh44wr],
.admin-dashboard-page .admin-kpi-body span[b-bbvzxh44wr],
.admin-dashboard-page .admin-kpi-body strong[b-bbvzxh44wr],
.admin-dashboard-page .admin-user-info strong[b-bbvzxh44wr],
.admin-dashboard-page .reservation-name strong[b-bbvzxh44wr],
.admin-dashboard-page .reservation-count strong[b-bbvzxh44wr],
.admin-dashboard-page .activity-body strong[b-bbvzxh44wr],
.admin-dashboard-page .quick-action strong[b-bbvzxh44wr],
.admin-dashboard-page .portfolio-donut strong[b-bbvzxh44wr] {
    color: var(--admin-text-strong);
}

.admin-dashboard-page .admin-welcome p[b-bbvzxh44wr],
.admin-dashboard-page .admin-user-info span[b-bbvzxh44wr],
.admin-dashboard-page .admin-kpi-body small[b-bbvzxh44wr],
.admin-dashboard-page .activity-body span[b-bbvzxh44wr],
.admin-dashboard-page .activity-item small[b-bbvzxh44wr],
.admin-dashboard-page .reservation-count span[b-bbvzxh44wr],
.admin-dashboard-page .portfolio-donut span[b-bbvzxh44wr],
.admin-dashboard-page .portfolio-row[b-bbvzxh44wr],
.admin-dashboard-page .topbar-icon[b-bbvzxh44wr],
.admin-dashboard-page .admin-card-menu[b-bbvzxh44wr] {
    color: var(--admin-text-muted) !important;
}

.admin-dashboard-page .portfolio-donut[b-bbvzxh44wr]::before {
    background: var(--admin-surface);
}

.admin-dashboard-page .admin-panel-link[b-bbvzxh44wr],
.admin-dashboard-page .admin-panel-header a[b-bbvzxh44wr] {
    color: var(--admin-link);
}

.admin-dashboard-page .activity-item[b-bbvzxh44wr],
.admin-dashboard-page .reservation-item[b-bbvzxh44wr],
.admin-dashboard-page .admin-panel-link[b-bbvzxh44wr],
.admin-dashboard-page .admin-user-card[b-bbvzxh44wr] {
    border-color: var(--admin-border-soft);
}

.admin-dashboard-page .quick-action:hover[b-bbvzxh44wr] {
    background: var(--admin-surface-soft);
}

.admin-dashboard-page.is-dark .portfolio-row strong[b-bbvzxh44wr] {
    color: #e2e8f0;
}

.admin-dashboard-page.is-dark .tenant-select[b-bbvzxh44wr]  .mud-input,
.admin-dashboard-page.is-dark .tenant-select[b-bbvzxh44wr]  .mud-input-control,
.admin-dashboard-page.is-dark .tenant-select[b-bbvzxh44wr]  .mud-select,
.admin-dashboard-page.is-dark .tenant-select[b-bbvzxh44wr]  .mud-select-input,
.admin-dashboard-page.is-dark[b-bbvzxh44wr]  .mud-input,
.admin-dashboard-page.is-dark[b-bbvzxh44wr]  .mud-select-input,
.admin-dashboard-page.is-dark[b-bbvzxh44wr]  .mud-input-slot {
    color: var(--admin-text) !important;
}

.admin-dashboard-page.is-dark[b-bbvzxh44wr]  .mud-input-outlined-border {
    border-color: var(--admin-border) !important;
}

.admin-dashboard-page.is-dark[b-bbvzxh44wr]  .mud-icon-root {
    color: currentColor;
}

.theme-toggle-button[b-bbvzxh44wr] {
    border-radius: 12px !important;
}

/* =========================================================
   SECCIÓN: RESPONSIVE DESKTOP INTERMEDIO
   ========================================================= */

@media (max-width: 1366px) {
    .admin-dashboard-content[b-bbvzxh44wr] {
        padding: 22px 24px 30px 24px;
    }

    .admin-dashboard-topbar[b-bbvzxh44wr] {
        padding: 0 24px;
    }

    .admin-dashboard-grid[b-bbvzxh44wr] {
        grid-template-columns: minmax(360px, 1fr) minmax(300px, 0.85fr);
    }

    .portfolio-panel[b-bbvzxh44wr] {
        grid-column: span 1;
    }

    .reservations-panel[b-bbvzxh44wr] {
        grid-column: span 1;
    }

    .activity-panel[b-bbvzxh44wr] {
        grid-column: 1 / -1;
    }

    .portfolio-content[b-bbvzxh44wr] {
        grid-template-columns: 180px 1fr;
        gap: 22px;
    }

    .quick-actions-grid[b-bbvzxh44wr] {
        grid-template-columns: repeat(6, minmax(92px, 1fr));
    }
}

/* =========================================================
   SECCIÓN: RESPONSIVE TABLET
   ========================================================= */

@media (max-width: 1024px) {
    .admin-dashboard-topbar[b-bbvzxh44wr] {
        position: sticky;
        top: 64px;
        min-height: 76px;
        height: auto;
        align-items: center;
        padding: 14px 18px;
        gap: 14px;
    }

    .admin-tenant-selector[b-bbvzxh44wr] {
        width: min(360px, 48vw);
    }

    .admin-user-card[b-bbvzxh44wr] {
        min-width: 178px;
    }

    .admin-kpi-grid[b-bbvzxh44wr] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .admin-dashboard-grid[b-bbvzxh44wr] {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .portfolio-panel[b-bbvzxh44wr],
    .reservations-panel[b-bbvzxh44wr],
    .activity-panel[b-bbvzxh44wr],
    .quick-actions-panel[b-bbvzxh44wr] {
        grid-column: auto;
    }

    .portfolio-content[b-bbvzxh44wr] {
        grid-template-columns: 190px 1fr;
    }

    .quick-actions-grid[b-bbvzxh44wr] {
        grid-template-columns: repeat(4, minmax(90px, 1fr));
    }
}

/* =========================================================
   SECCIÓN: RESPONSIVE MÓVIL
   ========================================================= */

@media (max-width: 760px) {
    .admin-dashboard-page[b-bbvzxh44wr] {
        min-width: 0;
    }

    .admin-dashboard-topbar[b-bbvzxh44wr] {
        top: 64px;
        padding: 14px 14px 16px 72px;
        gap: 12px;
        border-radius: 0;
    }

    .admin-tenant-selector[b-bbvzxh44wr] {
        width: 100%;
    }

    .admin-topbar-actions[b-bbvzxh44wr] {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(4, 42px) minmax(0, 1fr);
        justify-content: stretch;
        align-items: center;
        gap: 6px;
    }

    .admin-user-card[b-bbvzxh44wr] {
        min-width: 0;
        width: 100%;
        height: 46px;
        justify-content: flex-end;
        padding-left: 8px;
        margin-left: 0;
        border-left: 0;
    }

    .admin-avatar[b-bbvzxh44wr] {
        width: 36px;
        height: 36px;
        min-width: 36px;
    }

    .admin-user-info[b-bbvzxh44wr] {
        display: none;
    }

    .admin-dashboard-content[b-bbvzxh44wr] {
        padding: 18px 14px 26px 14px;
    }

    .admin-welcome h1[b-bbvzxh44wr] {
        font-size: 1.34rem;
    }

    .admin-kpi-grid[b-bbvzxh44wr] {
        grid-template-columns: 1fr;
    }

    .admin-kpi-card[b-bbvzxh44wr] {
        min-height: 116px;
        padding: 16px;
        gap: 14px;
    }

    .admin-kpi-icon[b-bbvzxh44wr] {
        width: 62px;
        height: 62px;
        min-width: 62px;
    }

    .admin-kpi-body strong[b-bbvzxh44wr] {
        font-size: 1.28rem;
    }

    .admin-panel[b-bbvzxh44wr] {
        padding: 18px 16px;
        border-radius: 14px;
    }

    .portfolio-panel[b-bbvzxh44wr],
    .reservations-panel[b-bbvzxh44wr],
    .activity-panel[b-bbvzxh44wr] {
        min-height: auto;
    }

    .portfolio-content[b-bbvzxh44wr] {
        grid-template-columns: 1fr;
        margin-top: 24px;
    }

    .portfolio-list[b-bbvzxh44wr] {
        gap: 13px;
    }

    .portfolio-row[b-bbvzxh44wr] {
        grid-template-columns: 12px 1fr;
    }

        .portfolio-row strong[b-bbvzxh44wr] {
            grid-column: 2;
            justify-self: start;
            margin-top: -6px;
        }

    .activity-item[b-bbvzxh44wr] {
        grid-template-columns: 40px minmax(0, 1fr);
        align-items: start;
    }

        .activity-item small[b-bbvzxh44wr] {
            grid-column: 2;
            margin-top: -8px;
        }

    .quick-actions-grid[b-bbvzxh44wr] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .quick-action[b-bbvzxh44wr] {
        min-height: 104px;
        border: 1px solid var(--admin-border);
        background: color-mix(in srgb, var(--admin-surface) 92%, var(--admin-surface-soft));
    }
}

@media (max-width: 420px) {
    .admin-dashboard-topbar[b-bbvzxh44wr] {
        padding-left: 66px;
    }

    .admin-topbar-actions[b-bbvzxh44wr] {
        grid-template-columns: repeat(4, 38px) minmax(0, 1fr);
    }

    .admin-dashboard-content[b-bbvzxh44wr] {
        padding-left: 12px;
        padding-right: 12px;
    }

    .reservation-item[b-bbvzxh44wr] {
        grid-template-columns: 44px 1fr;
    }

    .reservation-count[b-bbvzxh44wr] {
        grid-column: 2;
        text-align: left;
        margin-top: -7px;
    }

    .quick-actions-grid[b-bbvzxh44wr] {
        grid-template-columns: 1fr;
    }
}
/* /Layout/Admin/AdminMainLayout.razor.rz.scp.css */
/* =========================================================
   ADMIN MAIN LAYOUT - COMPATIBLE CON HABYTAL NAVMENU
   ========================================================= */
.admin-shell[b-188t6mp99h] {
    min-height: 100vh;
    background: #f4f7fb;
}

.admin-content[b-188t6mp99h] {
    min-height: 100vh;
    margin-left: 244px;
    transition: margin-left .25s ease;
    background: #f4f7fb;
}

.admin-content.sidebar-hidden[b-188t6mp99h] {
    margin-left: 0;
}

.admin-sidebar-restore-button[b-188t6mp99h] {
    position: fixed;
    top: 18px;
    left: 18px;
    z-index: 1200;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 14px;
    display: none;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    color: #0f1f39;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .12);
    cursor: pointer;
}

.admin-sidebar-restore-button.show[b-188t6mp99h] {
    display: inline-flex;
}


/* =========================================================
   FIX MOBILE MENU STATE
   En móvil no se usa el modo sidebar-hidden de escritorio.
   ========================================================= */
@media (max-width: 960px) {
    .admin-content[b-188t6mp99h],
    .admin-content.sidebar-hidden[b-188t6mp99h] {
        margin-left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .admin-sidebar-restore-button[b-188t6mp99h],
    .admin-sidebar-restore-button.show[b-188t6mp99h] {
        display: none !important;
    }
}
/* /Layout/Admin/AdminNavMenu.razor.rz.scp.css */
/* =========================================================
   ADMIN NAV MENU - HABYTAL
   Tema SaaS Cloud Blue con hover/activo azul corporativo.
   El menú mantiene una experiencia clara incluso si MudBlazor
   o el body activan modo oscuro.
   ========================================================= */

/* =========================================================
   SECCIÓN 1: VARIABLES VISUALES
   ========================================================= */

:root[b-5hakldxz9g] {
    --admin-sidebar-width: 248px;
    --admin-sidebar-collapsed-width: 72px;

    --admin-primary: #2563eb;
    --admin-primary-hover: #2563eb;
    --admin-primary-active: #1d4ed8;
    --admin-primary-soft: #eef4ff;
    --admin-primary-border: #d9e8ff;

    --admin-sidebar-bg-top: #f8fafd;
    --admin-sidebar-bg-bottom: #f2f6fc;
    --admin-surface: #ffffff;
    --admin-border: #e5edf8;

    --admin-text: #172033;
    --admin-text-soft: #475569;
    --admin-muted: #64748b;
    --admin-white: #ffffff;

    --admin-dashboard: #2563eb;
    --admin-residents: #0ea5e9;
    --admin-properties: #2563eb;
    --admin-finance: #16a34a;
    --admin-communications: #f97316;
    --admin-security: #7c3aed;
    --admin-reports: #0891b2;
    --admin-settings: #64748b;
}

/* =========================================================
   SECCIÓN 2: CONTENEDOR PRINCIPAL
   ========================================================= */

.admin-menu-sidebar[b-5hakldxz9g] {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1200;
    width: var(--admin-sidebar-width) !important;
    min-width: var(--admin-sidebar-width);
    height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    color: var(--admin-text) !important;
    background: linear-gradient(180deg, var(--admin-sidebar-bg-top) 0%, var(--admin-sidebar-bg-bottom) 100%) !important;
    border-right: 1px solid var(--admin-border);
    box-shadow: 10px 0 28px rgba(15, 35, 75, 0.055);
    box-sizing: border-box;
    scrollbar-width: thin;
    scrollbar-color: #c8d5e7 transparent;
    transition: transform 220ms ease, width 220ms ease, box-shadow 220ms ease;
}

.admin-menu-sidebar[b-5hakldxz9g]::-webkit-scrollbar {
    width: 5px;
}

.admin-menu-sidebar[b-5hakldxz9g]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: #c8d5e7;
}

/* =========================================================
   SECCIÓN 3: MARCA / LOGO
   ========================================================= */

.admin-menu-brand[b-5hakldxz9g] {
    min-height: 112px;
    padding: 28px 22px 18px;
    display: flex;
    align-items: flex-start;
    box-sizing: border-box;
}

.admin-brand-header[b-5hakldxz9g] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.admin-brand-title[b-5hakldxz9g] {
    margin: 0;
    color: var(--admin-primary) !important;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.admin-brand[b-5hakldxz9g] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--admin-text) !important;
    text-decoration: none !important;
}

.admin-brand-icon[b-5hakldxz9g] {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 16px;
    background: #eaf2ff !important;
    color: var(--admin-primary) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.08);
}

.admin-brand-icon .mud-icon-root[b-5hakldxz9g] {
    font-size: 30px;
}

.admin-brand-text[b-5hakldxz9g] {
    color: var(--admin-text) !important;
    font-size: 1.20rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1;
}

/* =========================================================
   SECCIÓN 4: NAVEGACIÓN PRINCIPAL
   ========================================================= */

.admin-menu-nav[b-5hakldxz9g] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 10px 18px 18px;
    box-sizing: border-box;
}

.admin-menu-section-title[b-5hakldxz9g] {
    margin: 0 0 14px 2px;
    color: var(--admin-muted) !important;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.055em;
    line-height: 1;
    text-transform: uppercase;
}

.admin-menu-item[b-5hakldxz9g] {
    width: 100%;
    display: flex;
    flex-direction: column;
}

/* =========================================================
   SECCIÓN 5: LINKS PRINCIPALES
   Estado normal, hover y activo.
   Hover y activo usan azul corporativo con texto blanco.
   ========================================================= */

.admin-menu-link[b-5hakldxz9g],
.admin-menu-expandable[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable {
    position: relative;
    width: 100% !important;
    min-height: 46px;
    margin: 0;
    padding: 0 14px !important;
    display: flex !important;
    align-items: center !important;
    border: 0 !important;
    border-radius: 13px;
    color: var(--admin-text-soft) !important;
    background: transparent !important;
    text-align: left;
    text-decoration: none !important;
    font-family: inherit;
    font-size: 0.92rem;
    font-weight: 500;
    line-height: 1;
    outline: none;
    box-sizing: border-box;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    transition: background 170ms ease, color 170ms ease, box-shadow 170ms ease, transform 170ms ease;
}

.admin-menu-link:hover[b-5hakldxz9g],
.admin-menu-expandable:hover[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link:hover,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable:hover {
    color: var(--admin-white) !important;
    background: var(--admin-primary-hover) !important;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.18) !important;
    transform: translateX(1px);
}

.admin-menu-link-active[b-5hakldxz9g],
.admin-menu-link.active[b-5hakldxz9g],
.admin-menu-expandable.admin-menu-link-active[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link-active,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link.active,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable.admin-menu-link-active {
    color: var(--admin-white) !important;
    background: var(--admin-primary-active) !important;
    font-weight: 700;
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.24) !important;
}

.admin-menu-link-content[b-5hakldxz9g] {
    width: 100%;
    min-width: 0;
    display: flex !important;
    align-items: center !important;
    gap: 12px;
    color: inherit !important;
}

.admin-menu-label[b-5hakldxz9g] {
    min-width: 0;
    flex: 1 1 auto;
    display: inline-block !important;
    color: inherit !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-menu-chevron[b-5hakldxz9g] {
    width: 18px;
    min-width: 18px;
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit !important;
    opacity: 0.88;
    transition: transform 170ms ease;
}

.admin-menu-chevron.expanded[b-5hakldxz9g] {
    transform: rotate(180deg);
}

/* =========================================================
   SECCIÓN 6: ICONOS POR MÓDULO
   En estado normal cada módulo conserva su color.
   En hover y activo todos los iconos pasan a blanco.
   ========================================================= */

.admin-menu-icon-shell[b-5hakldxz9g] {
    width: 24px;
    height: 24px;
    min-width: 24px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1;
}

.admin-menu-icon[b-5hakldxz9g] {
    font-size: 24px !important;
}

.admin-menu-icon-dashboard[b-5hakldxz9g],
[b-5hakldxz9g] .admin-menu-icon-dashboard {
    color: var(--admin-dashboard) !important;
}

.admin-menu-icon-residents[b-5hakldxz9g],
[b-5hakldxz9g] .admin-menu-icon-residents {
    color: var(--admin-residents) !important;
}

.admin-menu-icon-properties[b-5hakldxz9g],
[b-5hakldxz9g] .admin-menu-icon-properties {
    color: var(--admin-properties) !important;
}

.admin-menu-icon-finance[b-5hakldxz9g],
[b-5hakldxz9g] .admin-menu-icon-finance {
    color: var(--admin-finance) !important;
}

.admin-menu-icon-communications[b-5hakldxz9g],
[b-5hakldxz9g] .admin-menu-icon-communications {
    color: var(--admin-communications) !important;
}

.admin-menu-icon-security[b-5hakldxz9g],
[b-5hakldxz9g] .admin-menu-icon-security {
    color: var(--admin-security) !important;
}

.admin-menu-icon-reports[b-5hakldxz9g],
[b-5hakldxz9g] .admin-menu-icon-reports {
    color: var(--admin-reports) !important;
}

.admin-menu-icon-settings[b-5hakldxz9g],
[b-5hakldxz9g] .admin-menu-icon-settings {
    color: var(--admin-settings) !important;
}

.admin-menu-link:hover .admin-menu-icon[b-5hakldxz9g],
.admin-menu-expandable:hover .admin-menu-icon[b-5hakldxz9g],
.admin-menu-link-active .admin-menu-icon[b-5hakldxz9g],
.admin-menu-link.active .admin-menu-icon[b-5hakldxz9g],
.admin-menu-expandable.admin-menu-link-active .admin-menu-icon[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link:hover .admin-menu-icon,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable:hover .admin-menu-icon,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link-active .admin-menu-icon,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link.active .admin-menu-icon,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable.admin-menu-link-active .admin-menu-icon {
    color: var(--admin-white) !important;
    fill: var(--admin-white) !important;
    stroke: var(--admin-white) !important;
}

/* =========================================================
   SECCIÓN 7: SUBMENÚS
   ========================================================= */

.admin-menu-subnav[b-5hakldxz9g] {
    margin: 8px 0 10px 18px;
    padding: 8px 0 8px 20px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border-left: 2px solid #e4ecf8;
}

.admin-menu-sublink[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-sublink {
    min-height: 30px;
    padding: 0 8px;
    display: flex !important;
    align-items: center !important;
    gap: 11px;
    border-radius: 9px;
    color: #475569 !important;
    text-decoration: none !important;
    font-size: 0.80rem;
    font-weight: 500;
    line-height: 1.1;
    transition: background 170ms ease, color 170ms ease, transform 170ms ease;
}

.admin-menu-sublink:hover[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-sublink:hover {
    color: var(--admin-primary) !important;
    background: #eef4ff !important;
    transform: translateX(1px);
}

.admin-menu-sublink-active[b-5hakldxz9g],
.admin-menu-sublink.active[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-sublink-active,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-sublink.active {
    color: var(--admin-primary) !important;
    background: transparent !important;
    font-weight: 700;
}

.admin-menu-subdot[b-5hakldxz9g] {
    width: 6px;
    height: 6px;
    min-width: 6px;
    border-radius: 999px;
    background: #a9b6c7;
}

.admin-menu-sublink-active .admin-menu-subdot[b-5hakldxz9g],
.admin-menu-sublink.active .admin-menu-subdot[b-5hakldxz9g],
.admin-menu-sublink:hover .admin-menu-subdot[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-sublink-active .admin-menu-subdot,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-sublink.active .admin-menu-subdot,
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-sublink:hover .admin-menu-subdot {
    background: var(--admin-primary);
}

.admin-menu-sublabel[b-5hakldxz9g] {
    min-width: 0;
    display: inline-block;
    color: inherit !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* =========================================================
   SECCIÓN 8: USUARIO FOOTER
   ========================================================= */

.admin-menu-user[b-5hakldxz9g] {
    min-height: 74px;
    margin: 0 16px 20px;
    padding: 12px 12px;
    display: grid;
    grid-template-columns: 42px 1fr 18px;
    align-items: center;
    gap: 11px;
    border: 1px solid var(--admin-border);
    border-radius: 16px;
    color: var(--admin-text) !important;
    background: rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 10px 24px rgba(15, 35, 75, 0.055);
    box-sizing: border-box;
}

.admin-user-avatar[b-5hakldxz9g] {
    width: 42px;
    height: 42px;
    min-width: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: #ffffff !important;
    background: linear-gradient(135deg, #60a5fa 0%, #2563eb 100%) !important;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.18);
}

.admin-user-info[b-5hakldxz9g] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.admin-user-info strong[b-5hakldxz9g] {
    color: var(--admin-text) !important;
    font-size: 0.80rem;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-user-info small[b-5hakldxz9g] {
    color: var(--admin-muted) !important;
    font-size: 0.70rem;
    font-weight: 500;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-user-chevron[b-5hakldxz9g] {
    color: var(--admin-text-soft) !important;
    opacity: 0.9;
}

/* =========================================================
   SECCIÓN 9: BOTÓN MÓVIL Y OVERLAY
   ========================================================= */

.admin-mobile-menu-button[b-5hakldxz9g] {
    display: none !important;
}

.admin-mobile-overlay[b-5hakldxz9g] {
    display: none;
}

/* =========================================================
   SECCIÓN 10: ESCRITORIO CONTRAÍDO
   ========================================================= */

@media (min-width: 961px) {
    .admin-menu-sidebar[b-5hakldxz9g] {
        transform: none !important;
    }

    .admin-menu-sidebar.desktop-hidden[b-5hakldxz9g] {
        width: var(--admin-sidebar-collapsed-width) !important;
        min-width: var(--admin-sidebar-collapsed-width);
    }

    .admin-menu-sidebar.desktop-hidden .admin-brand-text[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden .admin-menu-section-title[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden .admin-menu-label[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden .admin-menu-chevron[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden .admin-menu-subnav[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden .admin-user-info[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden .admin-user-chevron[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden .admin-brand-title[b-5hakldxz9g] {
        display: none !important;
    }

    .admin-menu-sidebar.desktop-hidden .admin-menu-brand[b-5hakldxz9g] {
        min-height: 82px;
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .admin-menu-sidebar.desktop-hidden .admin-brand[b-5hakldxz9g] {
        justify-content: center;
        width: 100%;
    }

    .admin-menu-sidebar.desktop-hidden .admin-menu-nav[b-5hakldxz9g] {
        padding-left: 10px;
        padding-right: 10px;
    }

    .admin-menu-sidebar.desktop-hidden .admin-menu-link[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden .admin-menu-expandable[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden[b-5hakldxz9g]  .admin-menu-link,
    .admin-menu-sidebar.desktop-hidden[b-5hakldxz9g]  .admin-menu-expandable {
        min-height: 46px;
        justify-content: center;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .admin-menu-sidebar.desktop-hidden .admin-menu-link-content[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden[b-5hakldxz9g]  .admin-menu-link-content {
        justify-content: center;
    }

    .admin-menu-sidebar.desktop-hidden .admin-menu-user[b-5hakldxz9g] {
        display: flex;
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }
}

/* =========================================================
   SECCIÓN 11: RESPONSIVE
   ========================================================= */

@media (max-width: 960px) {
    .admin-mobile-menu-button[b-5hakldxz9g] {
        position: fixed;
        top: 12px;
        left: 12px;
        z-index: 1300;
        width: 42px;
        height: 42px;
        display: grid !important;
        place-items: center;
        border: 1px solid #d8e3f2;
        border-radius: 12px;
        color: var(--admin-primary) !important;
        background: #ffffff;
        box-shadow: 0 12px 28px rgba(15, 35, 75, 0.13);
        cursor: pointer;
    }

    .admin-mobile-overlay[b-5hakldxz9g] {
        position: fixed;
        inset: 0;
        z-index: 1310;
        display: block;
        border: 0;
        background: rgba(15, 23, 42, 0.38);
        opacity: 0;
        pointer-events: none;
        transition: opacity 190ms ease;
    }

    .admin-mobile-overlay.show[b-5hakldxz9g] {
        opacity: 1;
        pointer-events: auto;
    }

    .admin-menu-sidebar[b-5hakldxz9g],
    .admin-menu-sidebar.desktop-hidden[b-5hakldxz9g] {
        z-index: 1320;
        width: min(var(--admin-sidebar-width), 88vw) !important;
        min-width: 0;
        max-width: 88vw;
        transform: translateX(-104%);
    }

    .admin-menu-sidebar.mobile-open[b-5hakldxz9g] {
        transform: translateX(0);
    }
}

/* =========================================================
   SECCIÓN 12: DARK MODE CONTROLADO
   El sidebar conserva el tema claro Cloud Blue aunque la app esté
   en modo oscuro. Esto evita cuadros grises o textos blancos sobre
   fondos claros.
   ========================================================= */

:global(.mud-theme-dark) .admin-menu-sidebar[b-5hakldxz9g],
:global(body.dark) .admin-menu-sidebar[b-5hakldxz9g],
:global(.dark) .admin-menu-sidebar[b-5hakldxz9g] {
    color: var(--admin-text) !important;
    background: linear-gradient(180deg, var(--admin-sidebar-bg-top) 0%, var(--admin-sidebar-bg-bottom) 100%) !important;
    border-right-color: var(--admin-border) !important;
    box-shadow: 10px 0 28px rgba(15, 35, 75, 0.055) !important;
}

:global(.mud-theme-dark) .admin-brand[b-5hakldxz9g],
:global(.mud-theme-dark) .admin-brand-text[b-5hakldxz9g],
:global(body.dark) .admin-brand[b-5hakldxz9g],
:global(body.dark) .admin-brand-text[b-5hakldxz9g],
:global(.dark) .admin-brand[b-5hakldxz9g],
:global(.dark) .admin-brand-text[b-5hakldxz9g] {
    color: var(--admin-text) !important;
}

:global(.mud-theme-dark) .admin-brand-icon[b-5hakldxz9g],
:global(body.dark) .admin-brand-icon[b-5hakldxz9g],
:global(.dark) .admin-brand-icon[b-5hakldxz9g] {
    background: #eaf2ff !important;
    color: var(--admin-primary) !important;
}

:global(.mud-theme-dark) .admin-menu-link[b-5hakldxz9g],
:global(.mud-theme-dark) .admin-menu-expandable[b-5hakldxz9g],
:global(.mud-theme-dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link,
:global(.mud-theme-dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable,
:global(body.dark) .admin-menu-link[b-5hakldxz9g],
:global(body.dark) .admin-menu-expandable[b-5hakldxz9g],
:global(body.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link,
:global(body.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable,
:global(.dark) .admin-menu-link[b-5hakldxz9g],
:global(.dark) .admin-menu-expandable[b-5hakldxz9g],
:global(.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link,
:global(.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable {
    color: var(--admin-text-soft) !important;
    background: transparent !important;
}

:global(.mud-theme-dark) .admin-menu-link:hover[b-5hakldxz9g],
:global(.mud-theme-dark) .admin-menu-expandable:hover[b-5hakldxz9g],
:global(.mud-theme-dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link:hover,
:global(.mud-theme-dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable:hover,
:global(body.dark) .admin-menu-link:hover[b-5hakldxz9g],
:global(body.dark) .admin-menu-expandable:hover[b-5hakldxz9g],
:global(body.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link:hover,
:global(body.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable:hover,
:global(.dark) .admin-menu-link:hover[b-5hakldxz9g],
:global(.dark) .admin-menu-expandable:hover[b-5hakldxz9g],
:global(.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link:hover,
:global(.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable:hover {
    color: var(--admin-white) !important;
    background: var(--admin-primary-hover) !important;
}

:global(.mud-theme-dark) .admin-menu-link-active[b-5hakldxz9g],
:global(.mud-theme-dark) .admin-menu-link.active[b-5hakldxz9g],
:global(.mud-theme-dark) .admin-menu-expandable.admin-menu-link-active[b-5hakldxz9g],
:global(.mud-theme-dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link-active,
:global(.mud-theme-dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link.active,
:global(.mud-theme-dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable.admin-menu-link-active,
:global(body.dark) .admin-menu-link-active[b-5hakldxz9g],
:global(body.dark) .admin-menu-link.active[b-5hakldxz9g],
:global(body.dark) .admin-menu-expandable.admin-menu-link-active[b-5hakldxz9g],
:global(body.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link-active,
:global(body.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link.active,
:global(body.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable.admin-menu-link-active,
:global(.dark) .admin-menu-link-active[b-5hakldxz9g],
:global(.dark) .admin-menu-link.active[b-5hakldxz9g],
:global(.dark) .admin-menu-expandable.admin-menu-link-active[b-5hakldxz9g],
:global(.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link-active,
:global(.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-link.active,
:global(.dark) .admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable.admin-menu-link-active {
    color: var(--admin-white) !important;
    background: var(--admin-primary-active) !important;
}

:global(.mud-theme-dark) .admin-menu-section-title[b-5hakldxz9g],
:global(body.dark) .admin-menu-section-title[b-5hakldxz9g],
:global(.dark) .admin-menu-section-title[b-5hakldxz9g] {
    color: var(--admin-muted) !important;
}

:global(.mud-theme-dark) .admin-menu-user[b-5hakldxz9g],
:global(body.dark) .admin-menu-user[b-5hakldxz9g],
:global(.dark) .admin-menu-user[b-5hakldxz9g] {
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: var(--admin-border) !important;
}

:global(.mud-theme-dark) .admin-user-info strong[b-5hakldxz9g],
:global(body.dark) .admin-user-info strong[b-5hakldxz9g],
:global(.dark) .admin-user-info strong[b-5hakldxz9g] {
    color: var(--admin-text) !important;
}

:global(.mud-theme-dark) .admin-user-info small[b-5hakldxz9g],
:global(body.dark) .admin-user-info small[b-5hakldxz9g],
:global(.dark) .admin-user-info small[b-5hakldxz9g] {
    color: var(--admin-muted) !important;
}
.admin-menu-expandable-expanded[b-5hakldxz9g],
.admin-menu-sidebar[b-5hakldxz9g]  .admin-menu-expandable-expanded {
    color: #2563eb !important;
    background: #eef4ff !important;
    font-weight: 700;
}

/* =========================================================
   FIX MOBILE SIDEBAR CLOSE BUTTON
   En móvil el botón de flecha del sidebar no contrae el menú
   a estado desktop-hidden. Se oculta para evitar que desaparezca
   el menú y se mantiene el cierre con overlay/hamburguesa.
   ========================================================= */
@media (max-width: 960px) {
    .admin-menu-sidebar.desktop-hidden[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open.desktop-hidden[b-5hakldxz9g] {
        width: min(var(--admin-sidebar-width), 88vw) !important;
        max-width: 88vw !important;
        min-width: 0 !important;
    }

    .admin-menu-sidebar.mobile-open[b-5hakldxz9g] {
        transform: translateX(0) !important;
    }

    .admin-menu-sidebar.mobile-open .admin-brand-text[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-menu-section-title[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-menu-label[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-menu-chevron[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-user-info[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-user-chevron[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-brand-title[b-5hakldxz9g] {
        display: initial !important;
    }

    .admin-menu-sidebar.mobile-open .admin-brand-text[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-menu-section-title[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-menu-label[b-5hakldxz9g] {
        display: inline-block !important;
    }

    .admin-menu-sidebar.mobile-open .admin-menu-chevron[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-user-chevron[b-5hakldxz9g] {
        display: inline-flex !important;
    }

    .admin-menu-sidebar.mobile-open .admin-user-info[b-5hakldxz9g] {
        display: flex !important;
    }

    .admin-menu-sidebar.mobile-open .admin-menu-subnav[b-5hakldxz9g] {
        display: flex !important;
    }

    .admin-menu-sidebar.mobile-open .admin-menu-link[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-menu-expandable[b-5hakldxz9g] {
        justify-content: flex-start !important;
        padding: 0 14px !important;
    }

    .admin-menu-sidebar.mobile-open .admin-menu-link-content[b-5hakldxz9g] {
        justify-content: flex-start !important;
    }

    .admin-menu-sidebar.mobile-open .admin-menu-user[b-5hakldxz9g] {
        display: grid !important;
        grid-template-columns: 42px 1fr 18px !important;
        justify-content: initial !important;
        padding: 12px !important;
    }

    .admin-menu-sidebar.mobile-open .admin-menu-collapse-button[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-sidebar-collapse-button[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-menu-toggle[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-brand-toggle[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open .admin-nav-toggle[b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open button[aria-label*="contraer" i][b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open button[aria-label*="colapsar" i][b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open button[title*="contraer" i][b-5hakldxz9g],
    .admin-menu-sidebar.mobile-open button[title*="colapsar" i][b-5hakldxz9g] {
        display: none !important;
        pointer-events: none !important;
    }
}
/* /Layout/AuthLayout.razor.rz.scp.css */

/* =========================================================
   1. AUTH LAYOUT - CONTENEDOR PRINCIPAL
   ========================================================= */

.auth-layout[b-vyp20lsn3g] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
}


/* =========================================================
   2. CENTRADO DE CONTENIDO
   ========================================================= */

.auth-layout[b-vyp20lsn3g] {
    justify-content: center;
    align-items: center;
}


    /* =========================================================
   3. CONTROL DEL BODY DEL LOGIN
   ========================================================= */

    .auth-layout[b-vyp20lsn3g]  .login-page {
        width: 100%;
        min-height: 100vh;
    }


    /* =========================================================
   4. EVITAR HERENCIA DE MUDLAYOUT
   ========================================================= */

    .auth-layout[b-vyp20lsn3g]  .mud-layout {
        background: transparent !important;
    }


/* =========================================================
   5. CONTROL DE SCROLL
   ========================================================= */

.auth-layout[b-vyp20lsn3g] {
    overflow-x: hidden;
}


/* =========================================================
   6. AJUSTE PARA PANTALLAS PEQUEÑAS
   ========================================================= */

@media (max-width: 768px) {

    .auth-layout[b-vyp20lsn3g] {
        padding: 20px;
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
.page[b-r80pdjdqof] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-r80pdjdqof] {
    flex: 1;
}

.sidebar[b-r80pdjdqof] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-r80pdjdqof] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-r80pdjdqof]  a, .top-row[b-r80pdjdqof]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-r80pdjdqof]  a:hover, .top-row[b-r80pdjdqof]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-r80pdjdqof]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-r80pdjdqof] {
        justify-content: space-between;
    }

    .top-row[b-r80pdjdqof]  a, .top-row[b-r80pdjdqof]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-r80pdjdqof] {
        flex-direction: row;
    }

    .sidebar[b-r80pdjdqof] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-r80pdjdqof] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-r80pdjdqof]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-r80pdjdqof], article[b-r80pdjdqof] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-txvozcncud] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-txvozcncud] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-txvozcncud] {
    font-size: 1.1rem;
}

.bi[b-txvozcncud] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-txvozcncud] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-txvozcncud] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-txvozcncud] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-txvozcncud] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-txvozcncud] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-txvozcncud] {
        padding-bottom: 1rem;
    }

    .nav-item[b-txvozcncud]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-txvozcncud]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-txvozcncud]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-txvozcncud] {
        display: none;
    }

    .collapse[b-txvozcncud] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }

    .nav-scrollable[b-txvozcncud] {
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Layout/SuperAdmin/Catalogs/CatalogsIndex.razor.rz.scp.css */
/* =========================================================
   PÁGINA: CATÁLOGOS GENERALES
   Diseño profesional alineado al mockup entregado.
   ========================================================= */

.catalogs-page[b-90zm0vecfw] {
    width: 100%;
    min-height: 100%;
    padding: 28px 36px 32px;
    background: #f4f7fb;
    color: #071b4d;
}

.catalogs-breadcrumb[b-90zm0vecfw] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 28px;
    font-size: 14px;
    font-weight: 600;
    color: #64748b;
}

.catalogs-breadcrumb span:first-child[b-90zm0vecfw] {
    color: #1557d6;
}

.catalogs-breadcrumb strong[b-90zm0vecfw] {
    color: #263b68;
}

.catalogs-title-row[b-90zm0vecfw] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

.catalogs-title-row h1[b-90zm0vecfw] {
    margin: 0 0 8px;
    font-size: 28px;
    line-height: 1.15;
    font-weight: 900;
    letter-spacing: -0.03em;
    color: #071b4d;
}

.catalogs-title-row p[b-90zm0vecfw] {
    margin: 0;
    max-width: 760px;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 500;
    color: #52627f;
}

.catalogs-new-button[b-90zm0vecfw] {
    height: 44px;
    min-width: 190px;
    border: 0;
    border-radius: 8px;
    background: #0b55df;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 15px;
    font-weight: 800;
    box-shadow: 0 8px 16px rgba(11, 85, 223, 0.2);
    cursor: pointer;
}

.catalogs-new-button .mud-icon-root[b-90zm0vecfw] {
    font-size: 20px;
}

.catalogs-toolbar[b-90zm0vecfw] {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.catalogs-search[b-90zm0vecfw] {
    width: 280px;
    height: 44px;
    border: 1px solid #d6deec;
    border-radius: 8px;
    background: #ffffff;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 14px;
    color: #52627f;
    box-shadow: 0 5px 14px rgba(15, 23, 42, 0.03);
}

.catalogs-search .mud-icon-root[b-90zm0vecfw] {
    font-size: 22px;
    color: #52627f;
}

.catalogs-search input[b-90zm0vecfw] {
    width: 100%;
    border: 0;
    outline: none;
    background: transparent;
    color: #071b4d;
    font-size: 14px;
    font-weight: 600;
}

.catalogs-search input[b-90zm0vecfw]::placeholder {
    color: #71809b;
}

.catalogs-grid[b-90zm0vecfw] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px 20px;
}

.catalogs-statistics[b-90zm0vecfw] {
    margin-top: 20px;
    padding: 18px 26px 22px;
    border: 1px solid #dbe4f2;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.catalogs-statistics h2[b-90zm0vecfw] {
    margin: 0 0 16px;
    font-size: 15px;
    font-weight: 900;
    color: #0a1745;
}

.catalogs-statistics-grid[b-90zm0vecfw] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 20px;
}

.catalogs-stat-item[b-90zm0vecfw] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.catalogs-stat-icon[b-90zm0vecfw] {
    width: 56px;
    height: 56px;
    min-width: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.catalogs-stat-icon .mud-icon-root[b-90zm0vecfw] {
    font-size: 30px;
}

.catalogs-stat-label[b-90zm0vecfw] {
    display: block;
    font-size: 12px;
    font-weight: 800;
    color: #71809b;
}

.catalogs-stat-item strong[b-90zm0vecfw] {
    display: block;
    margin-top: 3px;
    font-size: 22px;
    line-height: 1.1;
    font-weight: 900;
    color: #071b4d;
}

.catalogs-stat-item small[b-90zm0vecfw] {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #52627f;
}

.stat-icon-blue[b-90zm0vecfw] { background: #eaf2ff; color: #1557d6; }
.stat-icon-purple[b-90zm0vecfw] { background: #eadcff; color: #7c3aed; }
.stat-icon-green[b-90zm0vecfw] { background: #dcfce7; color: #16a34a; }
.stat-icon-yellow[b-90zm0vecfw] { background: #fff2c8; color: #d97706; }
.stat-icon-sky[b-90zm0vecfw] { background: #e7f1ff; color: #2563eb; }

@media (max-width: 1400px) {
    .catalogs-grid[b-90zm0vecfw] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .catalogs-statistics-grid[b-90zm0vecfw] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .catalogs-page[b-90zm0vecfw] {
        padding: 22px;
    }

    .catalogs-title-row[b-90zm0vecfw] {
        align-items: flex-start;
        flex-direction: column;
    }

    .catalogs-grid[b-90zm0vecfw] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .catalogs-statistics-grid[b-90zm0vecfw] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .catalogs-page[b-90zm0vecfw] {
        padding: 18px 14px;
    }

    .catalogs-grid[b-90zm0vecfw],
    .catalogs-statistics-grid[b-90zm0vecfw] {
        grid-template-columns: 1fr;
    }

    .catalogs-search[b-90zm0vecfw],
    .catalogs-new-button[b-90zm0vecfw] {
        width: 100%;
    }
}

/* =========================================================
   MODO OSCURO
   ========================================================= */

:global(.mud-theme-dark) .catalogs-page[b-90zm0vecfw],
:global(body.dark) .catalogs-page[b-90zm0vecfw],
:global(.dark) .catalogs-page[b-90zm0vecfw] {
    background: #0f172a;
    color: #e5ecff;
}

:global(.mud-theme-dark) .catalogs-title-row h1[b-90zm0vecfw],
:global(body.dark) .catalogs-title-row h1[b-90zm0vecfw],
:global(.dark) .catalogs-title-row h1[b-90zm0vecfw],
:global(.mud-theme-dark) .catalogs-stat-item strong[b-90zm0vecfw],
:global(body.dark) .catalogs-stat-item strong[b-90zm0vecfw],
:global(.dark) .catalogs-stat-item strong[b-90zm0vecfw],
:global(.mud-theme-dark) .catalogs-statistics h2[b-90zm0vecfw],
:global(body.dark) .catalogs-statistics h2[b-90zm0vecfw],
:global(.dark) .catalogs-statistics h2[b-90zm0vecfw] {
    color: #f8fafc;
}

:global(.mud-theme-dark) .catalogs-title-row p[b-90zm0vecfw],
:global(body.dark) .catalogs-title-row p[b-90zm0vecfw],
:global(.dark) .catalogs-title-row p[b-90zm0vecfw],
:global(.mud-theme-dark) .catalogs-stat-item small[b-90zm0vecfw],
:global(body.dark) .catalogs-stat-item small[b-90zm0vecfw],
:global(.dark) .catalogs-stat-item small[b-90zm0vecfw] {
    color: #b6c2d9;
}

:global(.mud-theme-dark) .catalogs-search[b-90zm0vecfw],
:global(body.dark) .catalogs-search[b-90zm0vecfw],
:global(.dark) .catalogs-search[b-90zm0vecfw],
:global(.mud-theme-dark) .catalogs-statistics[b-90zm0vecfw],
:global(body.dark) .catalogs-statistics[b-90zm0vecfw],
:global(.dark) .catalogs-statistics[b-90zm0vecfw] {
    border-color: rgba(148, 163, 184, 0.24);
    background: #111c32;
}

:global(.mud-theme-dark) .catalogs-search input[b-90zm0vecfw],
:global(body.dark) .catalogs-search input[b-90zm0vecfw],
:global(.dark) .catalogs-search input[b-90zm0vecfw] {
    color: #f8fafc;
}
/* /Layout/SuperAdmin/SuperDashboard.razor.rz.scp.css */

/* =========================================================
   SECCIÓN: TOKENS DE GRÁFICAS APEXCHARTS
   Corrige etiquetas invisibles sin modificar layout ni datos.
   ========================================================= */

.super-dashboard-page[b-vi0yj4yiei] {
    --habytal-chart-label-color: #0f172a;
    --habytal-chart-axis-color: #334155;
    --habytal-chart-grid-color: rgba(15, 23, 42, 0.14);
    --habytal-chart-tooltip-bg: #ffffff;
    --habytal-chart-tooltip-text: #0f172a;
    --habytal-chart-tooltip-border: rgba(15, 23, 42, 0.14);
    --habytal-chart-menu-bg: #ffffff;
    --habytal-chart-menu-hover-bg: rgba(37, 99, 235, 0.08);
    --habytal-chart-toolbar-color: #475569;
}

.super-dashboard-page.is-dark[b-vi0yj4yiei] {
    --habytal-chart-label-color: #f8fafc;
    --habytal-chart-axis-color: #cbd5e1;
    --habytal-chart-grid-color: rgba(248, 250, 252, 0.20);
    --habytal-chart-tooltip-bg: #0f172a;
    --habytal-chart-tooltip-text: #f8fafc;
    --habytal-chart-tooltip-border: rgba(248, 250, 252, 0.18);
    --habytal-chart-menu-bg: #0f172a;
    --habytal-chart-menu-hover-bg: rgba(96, 165, 250, 0.18);
    --habytal-chart-toolbar-color: #cbd5e1;
}

/* =========================================================
   SUPER ADMIN DASHBOARD
   Dashboard ajustado para vivir dentro del offset del layout
   ========================================================= */

.super-dashboard-page[b-vi0yj4yiei] {
    width: 100%;
    min-height: 100vh;
    position: relative;
    background: var(--mud-palette-background, #f3f7fc);
    overflow-x: hidden;
    box-sizing: border-box;
}

.super-dashboard-topbar[b-vi0yj4yiei] {
    position: sticky;
    top: 0;
    z-index: 100;
    height: 78px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 0 30px;
    background: color-mix(in srgb, var(--mud-palette-surface, #ffffff) 96%, transparent);
    border-bottom: 1px solid var(--mud-palette-lines-default, #dfe7f2);
    box-sizing: border-box;
}

.super-platform-selector[b-vi0yj4yiei] { width: min(420px, 42vw); }
.platform-select[b-vi0yj4yiei] { width: 100%; }

.super-topbar-actions[b-vi0yj4yiei] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.topbar-icon[b-vi0yj4yiei] { color: var(--mud-palette-text-primary, #0d1b3d) !important; }

.super-account-menu[b-vi0yj4yiei] {
    position: relative;
    margin-left: 8px;
}

.super-admin-user[b-vi0yj4yiei] {
    min-width: 270px;
    height: 58px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 14px 0 18px;
    border: 0;
    border-left: 1px solid var(--mud-palette-lines-default, #dfe7f2);
    border-radius: 0;
    color: var(--mud-palette-text-primary, #07142f);
    background: transparent;
    cursor: pointer;
    text-align: left;
    transition: background-color 180ms ease, border-color 180ms ease;
}

.super-admin-user:hover[b-vi0yj4yiei],
.super-admin-user[aria-expanded="True"][b-vi0yj4yiei] {
    background: color-mix(in srgb, var(--mud-palette-primary, #1f6fff) 8%, transparent);
}

.super-avatar[b-vi0yj4yiei],
.super-account-summary-avatar[b-vi0yj4yiei] {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 900;
    background: linear-gradient(135deg, #2174ff 0%, #082f6f 100%);
    box-shadow: 0 10px 24px rgba(31, 111, 255, 0.28);
}

.super-user-info[b-vi0yj4yiei] { min-width: 0; flex: 1; display: flex; flex-direction: column; line-height: 1.1; }
.super-user-info strong[b-vi0yj4yiei] { color: var(--mud-palette-text-primary, #07142f); font-size: 0.88rem; font-weight: 900; white-space: nowrap; }
.super-user-info span[b-vi0yj4yiei] { margin-top: 4px; color: var(--mud-palette-text-secondary, #60708a); font-size: 0.76rem; white-space: nowrap; }

.super-account-dropdown[b-vi0yj4yiei] {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    z-index: 250;
    width: 322px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default, #dfe7f2) 84%, transparent);
    border-radius: 10px;
    background: color-mix(in srgb, var(--mud-palette-surface, #ffffff) 98%, transparent);
    box-shadow: 0 24px 60px rgba(2, 12, 34, 0.22);
}

.super-account-summary[b-vi0yj4yiei] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 22px 20px 18px;
}

.super-account-summary-avatar[b-vi0yj4yiei] {
    width: 52px;
    height: 52px;
    flex-basis: 52px;
    font-size: 0.9rem;
}

.super-account-summary-text[b-vi0yj4yiei] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 4px;
}

.super-account-summary-text strong[b-vi0yj4yiei] {
    color: var(--mud-palette-text-primary, #07142f);
    font-size: 0.92rem;
    font-weight: 900;
}

.super-account-summary-text span[b-vi0yj4yiei] {
    color: var(--mud-palette-text-secondary, #60708a);
    font-size: 0.82rem;
    font-weight: 700;
}

.super-account-summary-text small[b-vi0yj4yiei] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #16c784;
    font-size: 0.76rem;
    font-weight: 800;
}

.super-account-summary-text small i[b-vi0yj4yiei] {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #16c784;
    box-shadow: 0 0 0 4px rgba(22, 199, 132, 0.14);
}

.super-account-section[b-vi0yj4yiei] {
    padding: 12px 16px 14px;
    border-top: 1px solid color-mix(in srgb, var(--mud-palette-lines-default, #dfe7f2) 78%, transparent);
}

.super-account-section h3[b-vi0yj4yiei] {
    margin: 0 0 8px;
    color: var(--mud-palette-text-secondary, #60708a);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.05em;
}

.super-account-option[b-vi0yj4yiei] {
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 8px;
    border-radius: 8px;
    color: var(--mud-palette-text-primary, #07142f);
    font-size: 0.84rem;
    font-weight: 750;
    text-decoration: none;
    transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.super-account-option:hover[b-vi0yj4yiei] {
    color: #1f6fff;
    background: rgba(31, 111, 255, 0.10);
    transform: translateX(2px);
}

.super-account-option .mud-icon-root[b-vi0yj4yiei] {
    width: 20px;
    color: currentColor;
}

.super-account-option span[b-vi0yj4yiei] {
    flex: 1;
    min-width: 0;
}

.super-account-option em[b-vi0yj4yiei] {
    min-width: 20px;
    height: 20px;
    display: inline-grid;
    place-items: center;
    padding: 0 6px;
    border-radius: 999px;
    background: #ff3b4a;
    color: #ffffff;
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 900;
}

.super-account-option.danger[b-vi0yj4yiei] {
    color: #ff4d5d;
    font-weight: 900;
}

.super-account-option.danger:hover[b-vi0yj4yiei] {
    background: rgba(255, 77, 93, 0.10);
}

.super-dashboard-content[b-vi0yj4yiei] {
    width: 100%;
    max-width: 100%;
    padding: 26px 30px 34px;
    box-sizing: border-box;
}

.super-welcome[b-vi0yj4yiei] { margin-bottom: 20px; }
.super-welcome h1[b-vi0yj4yiei] { margin: 0; color: var(--mud-palette-text-primary, #07142f); font-size: 1.42rem; line-height: 1.2; font-weight: 900; }
.super-welcome p[b-vi0yj4yiei] { margin: 6px 0 0; color: var(--mud-palette-text-secondary, #53637c); font-size: 0.94rem; font-weight: 600; }

.super-kpi-grid[b-vi0yj4yiei] {
    display: grid;
    grid-template-columns: repeat(4, minmax(210px, 1fr));
    gap: 18px;
    margin-bottom: 18px;
}

.super-kpi-card[b-vi0yj4yiei] {
    min-height: 124px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    border: 1px solid var(--mud-palette-lines-default, #e0e8f3);
    border-radius: 18px;
    background: var(--mud-palette-surface, #ffffff);
    box-shadow: 0 10px 26px rgba(15, 35, 70, 0.05);
    box-sizing: border-box;
    overflow: hidden;
}

.super-kpi-icon[b-vi0yj4yiei] {
    width: 66px;
    height: 66px;
    min-width: 66px;
    display: grid;
    place-items: center;
    border-radius: 16px;
}

.super-dashboard-page .blue[b-vi0yj4yiei],
.super-kpi-icon.blue[b-vi0yj4yiei],
.metric-icon.blue[b-vi0yj4yiei],
.activity-icon.blue[b-vi0yj4yiei] { background: #eaf2ff; color: #1f6fff; }

.super-dashboard-page .green[b-vi0yj4yiei],
.super-kpi-icon.green[b-vi0yj4yiei],
.metric-icon.green[b-vi0yj4yiei],
.activity-icon.green[b-vi0yj4yiei] { background: #eaf8f0; color: #21a957; }

.super-dashboard-page .purple[b-vi0yj4yiei],
.super-kpi-icon.purple[b-vi0yj4yiei],
.metric-icon.purple[b-vi0yj4yiei],
.activity-icon.purple[b-vi0yj4yiei] { background: #f1e9ff; color: #7a42d9; }

.super-dashboard-page .orange[b-vi0yj4yiei],
.super-kpi-icon.orange[b-vi0yj4yiei],
.metric-icon.orange[b-vi0yj4yiei],
.activity-icon.orange[b-vi0yj4yiei] { background: #fff2df; color: #ff8a00; }

.super-dashboard-page .red[b-vi0yj4yiei],
.activity-icon.red[b-vi0yj4yiei] { background: #ffe9ed; color: #ef233c; }

.super-kpi-body[b-vi0yj4yiei] { min-width: 0; display: flex; flex-direction: column; }
.super-kpi-body span[b-vi0yj4yiei] { color: var(--mud-palette-text-primary, #14213d); font-size: 0.84rem; font-weight: 900; }
.super-kpi-body strong[b-vi0yj4yiei] { margin-top: 6px; color: var(--mud-palette-text-primary, #07142f); font-size: clamp(1.35rem, 2vw, 1.78rem); line-height: 1; font-weight: 900; white-space: nowrap; }
.super-kpi-body small[b-vi0yj4yiei] { margin-top: 9px; font-size: 0.80rem; font-weight: 900; white-space: nowrap; }

.trend-positive[b-vi0yj4yiei] { color: #04a857; }
.trend-negative[b-vi0yj4yiei] { color: #ef233c; }

.super-kpi-sparkline[b-vi0yj4yiei] {
    width: 70px;
    height: 30px;
    margin-left: auto;
    border-bottom: 5px solid #1f6fff;
    border-radius: 50%;
    transform: rotate(-10deg);
    opacity: 0.95;
}

.super-dashboard-grid[b-vi0yj4yiei] {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(360px, 1.25fr) minmax(320px, 1fr);
    gap: 18px;
    align-items: stretch;
}

.super-panel[b-vi0yj4yiei] {
    min-width: 0;
    border: 1px solid var(--mud-palette-lines-default, #e0e8f3);
    border-radius: 18px;
    padding: 22px;
    background: var(--mud-palette-surface, #ffffff);
    box-shadow: 0 10px 26px rgba(15, 35, 70, 0.05);
    box-sizing: border-box;
    overflow: hidden;
}

.super-panel h2[b-vi0yj4yiei] { margin: 0; color: var(--mud-palette-text-primary, #07142f); font-size: 1rem; line-height: 1.2; font-weight: 900; }

.super-panel-header[b-vi0yj4yiei] { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.super-panel-header button[b-vi0yj4yiei] { display: flex; align-items: center; gap: 4px; border: 0; background: transparent; color: var(--mud-palette-text-primary, #14213d); font-weight: 700; cursor: pointer; }
.super-panel-header a[b-vi0yj4yiei], .panel-link[b-vi0yj4yiei] { color: #005cff; font-size: 0.84rem; font-weight: 900; text-decoration: none; cursor: pointer; }
.panel-link[b-vi0yj4yiei] { display: block; margin-top: 18px; text-align: center; }

.chart-panel[b-vi0yj4yiei], .plan-panel[b-vi0yj4yiei], .activity-panel[b-vi0yj4yiei] { min-height: 300px; }

.line-chart[b-vi0yj4yiei] {
    position: relative;
    height: 178px;
    margin-top: 18px;
    border-bottom: 1px solid var(--mud-palette-lines-default, #e7edf6);
    background:
        linear-gradient(to bottom, transparent 24%, #edf2f8 25%, transparent 26%),
        linear-gradient(to bottom, transparent 49%, #edf2f8 50%, transparent 51%),
        linear-gradient(to bottom, transparent 74%, #edf2f8 75%, transparent 76%);
}

.chart-line[b-vi0yj4yiei] { position: absolute; left: 18px; right: 18px; top: 84px; height: 4px; border-radius: 999px; background: #1f6fff; transform: rotate(-16deg); }
.chart-point[b-vi0yj4yiei] { position: absolute; width: 11px; height: 11px; border: 3px solid #ffffff; border-radius: 50%; background: #1f6fff; box-shadow: 0 0 0 1px #1f6fff; }
.chart-point.p1[b-vi0yj4yiei] { left: 5%; top: 112px; }
.chart-point.p2[b-vi0yj4yiei] { left: 28%; top: 72px; }
.chart-point.p3[b-vi0yj4yiei] { left: 50%; top: 86px; }
.chart-point.p4[b-vi0yj4yiei] { left: 72%; top: 58px; }
.chart-point.p5[b-vi0yj4yiei] { left: 92%; top: 42px; }

.chart-months[b-vi0yj4yiei] { display: flex; justify-content: space-between; padding-top: 12px; color: var(--mud-palette-text-secondary, #53637c); font-size: 0.78rem; font-weight: 800; }

.plan-content[b-vi0yj4yiei] { display: grid; grid-template-columns: 190px 1fr; gap: 26px; align-items: center; margin-top: 24px; }

.plan-donut[b-vi0yj4yiei] {
    width: 154px;
    height: 154px;
    position: relative;
    display: grid;
    place-items: center;
    justify-self: center;
    border-radius: 50%;
    background: conic-gradient(#1f6fff 0 35%, #31b85b 35% 65%, #7a42d9 65% 87%, #ff961e 87% 100%);
}

.plan-donut[b-vi0yj4yiei]::before { content: ""; position: absolute; width: 94px; height: 94px; border-radius: 50%; background: var(--mud-palette-surface, #ffffff); }
.plan-donut strong[b-vi0yj4yiei], .plan-donut span[b-vi0yj4yiei] { position: relative; z-index: 1; color: var(--mud-palette-text-primary, #07142f); font-weight: 900; }
.plan-donut strong[b-vi0yj4yiei] { margin-top: 8px; font-size: 1.8rem; }
.plan-donut span[b-vi0yj4yiei] { margin-top: 46px; margin-left: -54px; color: var(--mud-palette-text-secondary, #53637c); font-size: 0.88rem; }

.plan-list[b-vi0yj4yiei] { display: flex; flex-direction: column; gap: 15px; }
.plan-row[b-vi0yj4yiei] { display: grid; grid-template-columns: 12px 1fr auto; align-items: center; gap: 12px; color: var(--mud-palette-text-primary, #14213d); font-size: 0.86rem; font-weight: 800; }
.plan-row strong[b-vi0yj4yiei] { color: var(--mud-palette-text-primary, #07142f); }
.plan-dot[b-vi0yj4yiei] { width: 10px; height: 10px; border-radius: 50%; }
.plan-dot.blue[b-vi0yj4yiei] { background: #1f6fff; }
.plan-dot.green[b-vi0yj4yiei] { background: #31b85b; }
.plan-dot.purple[b-vi0yj4yiei] { background: #7a42d9; }
.plan-dot.orange[b-vi0yj4yiei] { background: #ff961e; }

.activity-list[b-vi0yj4yiei] { margin-top: 12px; }
.activity-item[b-vi0yj4yiei] { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--mud-palette-lines-default, #e8eef7); }
.activity-icon[b-vi0yj4yiei] { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; }
.activity-body[b-vi0yj4yiei] { min-width: 0; }
.activity-body strong[b-vi0yj4yiei], .activity-body span[b-vi0yj4yiei] { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.activity-body strong[b-vi0yj4yiei] { color: var(--mud-palette-text-primary, #07142f); font-size: 0.82rem; font-weight: 900; }
.activity-body span[b-vi0yj4yiei] { margin-top: 3px; color: var(--mud-palette-text-secondary, #53637c); font-size: 0.76rem; font-weight: 700; }
.activity-item small[b-vi0yj4yiei] { color: var(--mud-palette-text-secondary, #53637c); font-size: 0.74rem; font-weight: 800; white-space: nowrap; }

.tenant-panel[b-vi0yj4yiei], .income-panel[b-vi0yj4yiei], .metrics-panel[b-vi0yj4yiei] { min-height: 260px; }
.tenant-status-row[b-vi0yj4yiei] { display: flex; justify-content: space-between; padding: 14px 0; color: var(--mud-palette-text-primary, #14213d); font-weight: 800; border-bottom: 1px solid var(--mud-palette-lines-default, #edf2f8); }

.bar-chart[b-vi0yj4yiei] { height: 172px; display: flex; align-items: end; justify-content: space-around; gap: 18px; margin-top: 22px; border-bottom: 1px solid var(--mud-palette-lines-default, #e7edf6); }
.bar-item[b-vi0yj4yiei] { display: flex; align-items: center; flex-direction: column; gap: 9px; color: var(--mud-palette-text-secondary, #53637c); font-size: 0.76rem; font-weight: 800; }
.bar[b-vi0yj4yiei] { width: 38px; display: block; border-radius: 6px 6px 0 0; }
.bar.blue[b-vi0yj4yiei] { background: #1f6fff; }
.bar.green[b-vi0yj4yiei] { background: #31b85b; }
.bar.purple[b-vi0yj4yiei] { background: #7a42d9; }
.bar.orange[b-vi0yj4yiei] { background: #ff961e; }

.metrics-grid[b-vi0yj4yiei] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 18px; }
.metric-card[b-vi0yj4yiei] { display: grid; grid-template-columns: 50px 1fr; gap: 12px; align-items: center; padding: 14px; border-radius: 14px; background: color-mix(in srgb, var(--mud-palette-surface, #ffffff) 90%, var(--mud-palette-background, #f3f7fc)); }
.metric-icon[b-vi0yj4yiei] { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 12px; }
.metric-card span[b-vi0yj4yiei], .metric-card strong[b-vi0yj4yiei], .metric-card small[b-vi0yj4yiei] { display: block; }
.metric-card span[b-vi0yj4yiei] { color: var(--mud-palette-text-primary, #14213d); font-size: 0.78rem; font-weight: 900; }
.metric-card strong[b-vi0yj4yiei] { margin-top: 4px; color: var(--mud-palette-text-primary, #07142f); font-size: 1.12rem; font-weight: 900; }
.metric-card small[b-vi0yj4yiei] { margin-top: 4px; font-size: 0.72rem; font-weight: 900; }

.quick-actions-panel[b-vi0yj4yiei] { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(7, 1fr); gap: 14px; min-height: auto; }
.quick-action[b-vi0yj4yiei] { min-height: 104px; border: 0; border-radius: 16px; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; background: var(--mud-palette-surface, #ffffff); color: var(--mud-palette-text-primary, #07142f); cursor: pointer; font-weight: 900; }
.quick-action:hover[b-vi0yj4yiei] { background: color-mix(in srgb, var(--mud-palette-surface, #ffffff) 80%, var(--mud-palette-primary, #2563eb)); }
.quick-action span[b-vi0yj4yiei] { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 14px; }

@media (max-width: 1500px) {
    .super-kpi-grid[b-vi0yj4yiei] { grid-template-columns: repeat(2, minmax(240px, 1fr)); }
    .super-dashboard-grid[b-vi0yj4yiei] { grid-template-columns: 1fr 1fr; }
    .quick-actions-panel[b-vi0yj4yiei] { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 1100px) {
    .super-dashboard-grid[b-vi0yj4yiei] { grid-template-columns: 1fr; }
    .plan-content[b-vi0yj4yiei] { grid-template-columns: 1fr; }
    .quick-actions-panel[b-vi0yj4yiei] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
    .super-dashboard-topbar[b-vi0yj4yiei] { height: auto; align-items: stretch; flex-direction: column; padding: 16px; }
    .super-platform-selector[b-vi0yj4yiei] { width: 100%; }
    .super-topbar-actions[b-vi0yj4yiei] { justify-content: space-between; }
    .super-admin-user[b-vi0yj4yiei] { min-width: 0; padding-left: 10px; }
    .super-dashboard-content[b-vi0yj4yiei] { padding: 18px; }
    .super-kpi-grid[b-vi0yj4yiei], .metrics-grid[b-vi0yj4yiei], .quick-actions-panel[b-vi0yj4yiei] { grid-template-columns: 1fr; }
}


/* =========================================================
   SECCIÓN: SOPORTE MODO OSCURO
   Ajustes visuales sin alterar estructura ni datos del dashboard.
   ========================================================= */

.super-dashboard-page[b-vi0yj4yiei],
.super-dashboard-topbar[b-vi0yj4yiei],
.super-kpi-card[b-vi0yj4yiei],
.super-panel[b-vi0yj4yiei],
.metric-card[b-vi0yj4yiei],
.quick-action[b-vi0yj4yiei] {
    transition:
        background-color 220ms ease,
        color 220ms ease,
        border-color 220ms ease,
        box-shadow 220ms ease;
}

.super-dashboard-page .mud-input[b-vi0yj4yiei],
.super-dashboard-page .mud-input-control[b-vi0yj4yiei],
.super-dashboard-page .mud-select[b-vi0yj4yiei],
.super-dashboard-page .mud-select-input[b-vi0yj4yiei] {
    color: var(--mud-palette-text-primary, #07142f);
}

.plan-donut[b-vi0yj4yiei]::before {
    background: var(--mud-palette-surface, #ffffff);
}

.line-chart[b-vi0yj4yiei] {
    background:
        linear-gradient(to bottom, transparent 24%, var(--mud-palette-lines-default, #edf2f8) 25%, transparent 26%),
        linear-gradient(to bottom, transparent 49%, var(--mud-palette-lines-default, #edf2f8) 50%, transparent 51%),
        linear-gradient(to bottom, transparent 74%, var(--mud-palette-lines-default, #edf2f8) 75%, transparent 76%);
}


/* =========================================================
   SECCIÓN: COMPONENTES SHARED/CHARTS
   Ajustes para gráficas reales con Blazor-ApexCharts.
   ========================================================= */

.donut-wrapper[b-vi0yj4yiei] {
    flex: 1 1 260px;
    min-width: 240px;
}

.plan-content-chart[b-vi0yj4yiei] {
    align-items: center;
    gap: 18px;
}

.apexcharts-canvas[b-vi0yj4yiei],
.apexcharts-svg[b-vi0yj4yiei],
.apexcharts-canvas foreignObject[b-vi0yj4yiei] {
    background: transparent !important;
}

.apexcharts-tooltip[b-vi0yj4yiei] {
    border-radius: 12px !important;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.16) !important;
    border: 1px solid var(--mud-palette-lines-default, #dfe7f2) !important;
}

/* Oculta las gráficas simuladas anteriores si quedan clases antiguas en caché */
.line-chart[b-vi0yj4yiei],
.chart-months[b-vi0yj4yiei],
.bar-chart[b-vi0yj4yiei],
.plan-donut[b-vi0yj4yiei] {
    display: none !important;
}

@media (max-width: 1100px) {
    .plan-content-chart[b-vi0yj4yiei] {
        flex-direction: column;
        align-items: stretch;
    }

    .donut-wrapper[b-vi0yj4yiei] {
        min-width: 100%;
    }
}




/* =========================================================
   SECCIÓN: CORRECCIÓN DONUT APEXCHARTS
   Evita que los gráficos tipo donut se deformen horizontalmente
   dentro de paneles anchos. La causa era el escalado global del
   SVG a width: 100%, que en ApexCharts puede convertir el círculo
   en óvalo cuando el contenedor tiene más ancho que alto.
   ========================================================= */

.plan-panel[b-vi0yj4yiei] {
    display: flex;
    flex-direction: column;
}

.plan-panel[b-vi0yj4yiei]  .plan-content-chart,
.tenant-panel[b-vi0yj4yiei]  .plan-content-chart {
    width: 100%;
    display: flex;
    align-items: center;
}

.plan-panel[b-vi0yj4yiei]  .donut-wrapper,
.tenant-panel[b-vi0yj4yiei]  .donut-wrapper {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

.plan-panel[b-vi0yj4yiei]  .donut-wrapper {
    width: 255px;
    min-width: 255px;
    height: 255px;
}

.tenant-panel[b-vi0yj4yiei]  .donut-wrapper {
    width: 220px;
    min-width: 220px;
    height: 220px;
}

.plan-panel[b-vi0yj4yiei]  .apexcharts-canvas,
.plan-panel[b-vi0yj4yiei]  .apexcharts-svg,
.plan-panel[b-vi0yj4yiei]  .apexcharts-canvas foreignObject {
    width: 255px !important;
    height: 255px !important;
    max-width: 255px !important;
}

.tenant-panel[b-vi0yj4yiei]  .apexcharts-canvas,
.tenant-panel[b-vi0yj4yiei]  .apexcharts-svg,
.tenant-panel[b-vi0yj4yiei]  .apexcharts-canvas foreignObject {
    width: 220px !important;
    height: 220px !important;
    max-width: 220px !important;
}

.plan-panel[b-vi0yj4yiei]  .apexcharts-pie,
.tenant-panel[b-vi0yj4yiei]  .apexcharts-pie {
    transform-origin: center center;
}

.plan-panel[b-vi0yj4yiei]  .apexcharts-inner,
.tenant-panel[b-vi0yj4yiei]  .apexcharts-inner {
    transform-origin: center center;
}

@media (max-width: 1100px) {
    .plan-panel[b-vi0yj4yiei]  .plan-content-chart,
    .tenant-panel[b-vi0yj4yiei]  .plan-content-chart {
        flex-direction: column;
        align-items: center;
    }
}

@media (max-width: 520px) {
    .plan-panel[b-vi0yj4yiei]  .donut-wrapper,
    .tenant-panel[b-vi0yj4yiei]  .donut-wrapper {
        width: 200px;
        min-width: 200px;
        height: 200px;
    }

    .plan-panel[b-vi0yj4yiei]  .apexcharts-canvas,
    .plan-panel[b-vi0yj4yiei]  .apexcharts-svg,
    .plan-panel[b-vi0yj4yiei]  .apexcharts-canvas foreignObject,
    .tenant-panel[b-vi0yj4yiei]  .apexcharts-canvas,
    .tenant-panel[b-vi0yj4yiei]  .apexcharts-svg,
    .tenant-panel[b-vi0yj4yiei]  .apexcharts-canvas foreignObject {
        width: 200px !important;
        height: 200px !important;
        max-width: 200px !important;
    }
}

/* =========================================================
   SECCIÓN: APEXCHARTS DARK MODE FIX
   Mejora legibilidad de ejes, leyendas, tooltips y menús.
   ========================================================= */

.dark-mode .apexcharts-text[b-vi0yj4yiei],
.dark-mode .apexcharts-title-text[b-vi0yj4yiei],
.dark-mode .apexcharts-subtitle-text[b-vi0yj4yiei],
.dark-mode .apexcharts-legend-text[b-vi0yj4yiei],
.dark-mode .apexcharts-xaxis text[b-vi0yj4yiei],
.dark-mode .apexcharts-yaxis text[b-vi0yj4yiei],
.dark-mode .apexcharts-datalabel[b-vi0yj4yiei],
.dark-mode .apexcharts-data-labels text[b-vi0yj4yiei],
.dark-mode .apexcharts-pie-label[b-vi0yj4yiei],
.dark-mode .apexcharts-donut-label[b-vi0yj4yiei],
.dark-mode .apexcharts-datalabel-label[b-vi0yj4yiei],
.dark-mode .apexcharts-datalabel-value[b-vi0yj4yiei],
.dark-mode .apexcharts-datalabel-total[b-vi0yj4yiei],
.dark-mode .apexcharts-yaxis-label[b-vi0yj4yiei],
.dark-mode .apexcharts-xaxis-label[b-vi0yj4yiei] {
    fill: var(--habytal-chart-label-color) !important;
    color: var(--habytal-chart-label-color) !important;
}

.dark-mode .apexcharts-xaxis-label[b-vi0yj4yiei],
.dark-mode .apexcharts-yaxis-label[b-vi0yj4yiei],
.dark-mode .apexcharts-legend-text[b-vi0yj4yiei] {
    opacity: 1 !important;
}

.dark-mode .apexcharts-gridline[b-vi0yj4yiei] {
    stroke: var(--habytal-chart-grid-color) !important;
}

.dark-mode .apexcharts-xaxis line[b-vi0yj4yiei],
.dark-mode .apexcharts-yaxis line[b-vi0yj4yiei],
.dark-mode .apexcharts-xaxis-tick[b-vi0yj4yiei] {
    stroke: var(--habytal-chart-grid-color) !important;
}

.dark-mode .apexcharts-tooltip[b-vi0yj4yiei] {
    background: var(--habytal-chart-tooltip-bg) !important;
    color: var(--habytal-chart-tooltip-text) !important;
    border: 1px solid var(--habytal-chart-tooltip-border) !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38) !important;
}

.dark-mode .apexcharts-tooltip *[b-vi0yj4yiei],
.dark-mode .apexcharts-tooltip-text[b-vi0yj4yiei],
.dark-mode .apexcharts-tooltip-text-y-label[b-vi0yj4yiei],
.dark-mode .apexcharts-tooltip-text-y-value[b-vi0yj4yiei],
.dark-mode .apexcharts-tooltip-series-group[b-vi0yj4yiei],
.dark-mode .apexcharts-tooltip-marker[b-vi0yj4yiei] {
    color: var(--habytal-chart-tooltip-text) !important;
}

.dark-mode .apexcharts-tooltip-title[b-vi0yj4yiei] {
    background: #1e293b !important;
    border-bottom: 1px solid rgba(248, 250, 252, 0.14) !important;
    color: var(--habytal-chart-tooltip-text) !important;
}

.dark-mode .apexcharts-menu[b-vi0yj4yiei] {
    background: var(--habytal-chart-menu-bg) !important;
    border: 1px solid var(--habytal-chart-tooltip-border) !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38) !important;
}

.dark-mode .apexcharts-menu-item[b-vi0yj4yiei] {
    color: var(--habytal-chart-tooltip-text) !important;
}

.dark-mode .apexcharts-menu-item:hover[b-vi0yj4yiei] {
    background: var(--habytal-chart-menu-hover-bg) !important;
}

.dark-mode .apexcharts-toolbar svg[b-vi0yj4yiei],
.dark-mode .apexcharts-zoom-icon svg[b-vi0yj4yiei],
.dark-mode .apexcharts-zoomin-icon svg[b-vi0yj4yiei],
.dark-mode .apexcharts-zoomout-icon svg[b-vi0yj4yiei],
.dark-mode .apexcharts-reset-icon svg[b-vi0yj4yiei],
.dark-mode .apexcharts-pan-icon svg[b-vi0yj4yiei],
.dark-mode .apexcharts-menu-icon svg[b-vi0yj4yiei] {
    fill: var(--habytal-chart-toolbar-color) !important;
}

.dark-mode .apexcharts-toolbar svg:hover[b-vi0yj4yiei] {
    fill: var(--habytal-chart-label-color) !important;
}

.dark-mode .apexcharts-canvas[b-vi0yj4yiei],
.dark-mode .apexcharts-svg[b-vi0yj4yiei],
.dark-mode .apexcharts-canvas foreignObject[b-vi0yj4yiei] {
    background: transparent !important;
}

/* Mantiene el modo claro intacto */
.light-mode .apexcharts-text[b-vi0yj4yiei],
.light-mode .apexcharts-legend-text[b-vi0yj4yiei],
.light-mode .apexcharts-xaxis text[b-vi0yj4yiei],
.light-mode .apexcharts-yaxis text[b-vi0yj4yiei] {
    fill: var(--habytal-chart-axis-color) !important;
    color: var(--habytal-chart-axis-color) !important;
}

/* =========================================================
   SECCIÓN: CORRECCIÓN DEFINITIVA APEXCHARTS CON CSS ISOLATION
   Mantiene intacta la estructura existente y solo refuerza la
   legibilidad de etiquetas, ejes, leyendas, tooltips y toolbar.
   ========================================================= */

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-canvas,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-svg,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-canvas foreignObject {
    width: 100% !important;
    background: transparent !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-text,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-title-text,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-subtitle-text,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-legend-text,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-xaxis text,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-yaxis text,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-datalabel,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-data-labels text,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-pie-label,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-donut-label,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-datalabel-label,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-datalabel-value,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-datalabel-total,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-yaxis-label,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-xaxis-label {
    fill: var(--habytal-chart-label-color) !important;
    color: var(--habytal-chart-label-color) !important;
    opacity: 1 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-legend-text {
    font-size: 13px !important;
    font-weight: 900 !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-gridline {
    stroke: var(--habytal-chart-grid-color) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-xaxis line,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-yaxis line,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-xaxis-tick {
    stroke: var(--habytal-chart-grid-color) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-tooltip {
    background: var(--habytal-chart-tooltip-bg) !important;
    color: var(--habytal-chart-tooltip-text) !important;
    border: 1px solid var(--habytal-chart-tooltip-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-tooltip *,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-tooltip-text,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-tooltip-text-y-label,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-tooltip-text-y-value,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-tooltip-series-group {
    color: var(--habytal-chart-tooltip-text) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-tooltip-title {
    background: #1e293b !important;
    border-bottom: 1px solid rgba(248, 250, 252, 0.14) !important;
    color: var(--habytal-chart-tooltip-text) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-menu {
    background: var(--habytal-chart-menu-bg) !important;
    border: 1px solid var(--habytal-chart-tooltip-border) !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-menu-item {
    color: var(--habytal-chart-tooltip-text) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-menu-item:hover {
    background: var(--habytal-chart-menu-hover-bg) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-toolbar svg,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-zoom-icon svg,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-zoomin-icon svg,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-zoomout-icon svg,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-reset-icon svg,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-pan-icon svg,
.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-menu-icon svg {
    fill: var(--habytal-chart-toolbar-color) !important;
}

.super-dashboard-page[b-vi0yj4yiei]  .apexcharts-toolbar svg:hover {
    fill: var(--habytal-chart-label-color) !important;
}

/* =========================================================
   SECCIÓN: VENTANA MI PERFIL
   Alcance local del Dashboard. No modifica estilos globales.
   ========================================================= */

.super-account-option:is(button)[b-vi0yj4yiei] {
    width: 100%;
    border: 0;
    background: transparent;
    font-family: inherit;
    cursor: pointer;
    text-align: left;
}

.super-profile-overlay[b-vi0yj4yiei] {
    position: fixed;
    inset: 0;
    z-index: 700;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(4, 12, 28, 0.42);
    backdrop-filter: blur(6px);
}

.super-profile-window[b-vi0yj4yiei] {
    width: min(94vw, 520px);
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default, #dfe7f2) 78%, transparent);
    border-radius: 22px;
    background: var(--mud-palette-surface, #ffffff);
    box-shadow: 0 28px 80px rgba(2, 12, 34, 0.30);
}

.super-profile-header[b-vi0yj4yiei] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 22px 24px;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-lines-default, #dfe7f2) 78%, transparent);
}

.super-profile-title-block[b-vi0yj4yiei] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.super-profile-avatar[b-vi0yj4yiei] {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 900;
    background: linear-gradient(135deg, #2174ff 0%, #082f6f 100%);
    box-shadow: 0 10px 24px rgba(31, 111, 255, 0.28);
}

.super-profile-title-block h2[b-vi0yj4yiei] {
    margin: 0;
    color: var(--mud-palette-text-primary, #07142f);
    font-size: 1.2rem;
    font-weight: 900;
}

.super-profile-title-block p[b-vi0yj4yiei] {
    margin: 4px 0 0;
    color: var(--mud-palette-text-secondary, #60708a);
    font-size: 0.84rem;
    font-weight: 650;
}

.super-profile-close[b-vi0yj4yiei] {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 12px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-text-secondary, #60708a);
    background: color-mix(in srgb, var(--mud-palette-background-gray, #f3f6fb) 90%, transparent);
    cursor: pointer;
}

.super-profile-close:hover[b-vi0yj4yiei] {
    color: #1f6fff;
    background: rgba(31, 111, 255, 0.10);
}

.super-profile-body[b-vi0yj4yiei] {
    display: grid;
    gap: 14px;
    padding: 24px;
}

.super-profile-field[b-vi0yj4yiei] {
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default, #dfe7f2) 72%, transparent);
    border-radius: 16px;
    background: color-mix(in srgb, var(--mud-palette-background-gray, #f7f9fd) 72%, transparent);
}

.super-profile-field span[b-vi0yj4yiei] {
    color: var(--mud-palette-text-secondary, #60708a);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.super-profile-field strong[b-vi0yj4yiei] {
    color: var(--mud-palette-text-primary, #07142f);
    font-size: 0.96rem;
    font-weight: 850;
}

.super-profile-status[b-vi0yj4yiei] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    color: #16a86f;
    background: rgba(22, 199, 132, 0.10);
    font-size: 0.82rem;
    font-weight: 900;
}

.super-profile-status i[b-vi0yj4yiei] {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #16c784;
    box-shadow: 0 0 0 4px rgba(22, 199, 132, 0.14);
}
/* /Layout/SuperAdmin/SuperMainLayout.razor.rz.scp.css */
/* =========================================================
   SUPER ADMIN MAIN LAYOUT
   Mantiene el contenido desacoplado del menú lateral.
   ========================================================= */

.habytal-shell[b-53pyoirwye] {
    width: 100%;
    min-height: 100vh;
    background: var(--mud-palette-background, #f3f7fc);
    overflow-x: hidden;
    transition: background-color 220ms ease;
}

.habytal-content[b-53pyoirwye] {
    min-height: 100vh;
    margin-left: 288px;
    width: calc(100% - 288px);
    background: var(--mud-palette-background, #f3f7fc);
    padding-left: 24px;
    box-sizing: border-box;
    transition: margin-left 220ms ease, width 220ms ease, padding-left 220ms ease, background-color 220ms ease;
}

.habytal-content.sidebar-hidden[b-53pyoirwye] {
    margin-left: 72px;
    width: calc(100% - 72px);
    padding-left: 24px;
}

.super-sidebar-restore-button[b-53pyoirwye],
.super-sidebar-restore-button.show[b-53pyoirwye] {
    display: none !important;
}

@media (max-width: 960px) {
    .habytal-content[b-53pyoirwye],
    .habytal-content.sidebar-hidden[b-53pyoirwye] {
        margin-left: 0;
        width: 100%;
        padding-left: 0;
        padding-top: 64px;
    }

    .super-sidebar-restore-button[b-53pyoirwye],
    .super-sidebar-restore-button.show[b-53pyoirwye] {
        display: none;
    }
}
/* /Layout/SuperAdmin/SuperNavMenu.razor.rz.scp.css */
/* =========================================================
   SUPER ADMIN NAV MENU
   Diseño alineado al mockup HABYTAL: sidebar azul oscuro,
   tipografía blanca, iconografía blanca y comportamiento responsive.
   ========================================================= */

:root[b-dyrvguf2p4] {
    --super-sidebar-width: 288px;
}

/* =========================================================
   CONTENEDOR PRINCIPAL
   ========================================================= */

.super-menu-sidebar[b-dyrvguf2p4] {
    position: fixed;
    inset: 0 auto 0 0;
    width: var(--super-sidebar-width);
    min-height: 100vh;
    min-height: 100dvh;
    height: 100vh;
    height: 100dvh;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: hidden;
    color: #ffffff !important;
    background:
        radial-gradient(circle at 24px 0, rgba(38, 141, 255, 0.42), transparent 34%),
        linear-gradient(180deg, #082f74 0%, #06285f 44%, #041d46 100%);
    box-shadow: 18px 0 42px rgba(5, 22, 51, 0.32);
    box-sizing: border-box;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

.super-menu-sidebar[b-dyrvguf2p4]::-webkit-scrollbar {
    width: 6px;
}

.super-menu-sidebar[b-dyrvguf2p4]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.24);
}

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

.super-mobile-menu-button[b-dyrvguf2p4] {
    display: none !important;
}

.super-brand-menu-button[b-dyrvguf2p4] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 14px;
    color: #ffffff !important;
    background: transparent;
    cursor: pointer;
    transition: background 180ms ease, transform 180ms ease;
}

.super-brand-menu-button:hover[b-dyrvguf2p4] {
    background: rgba(255, 255, 255, 0.12);
    transform: translateY(-1px);
}

/* =========================================================
   MARCA
   ========================================================= */

.super-menu-brand[b-dyrvguf2p4] {
    min-height: 84px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 20px 14px 20px;
    box-sizing: border-box;
}

.super-brand[b-dyrvguf2p4] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #ffffff !important;
    text-decoration: none !important;
}

.super-brand-icon[b-dyrvguf2p4] {
    width: 46px;
    height: 46px;
    min-width: 46px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    color: #ffffff !important;
    background: linear-gradient(135deg, #35b4ff 0%, #1668ff 100%);
    box-shadow: 0 13px 28px rgba(16, 103, 255, 0.38);
}

.super-brand-text[b-dyrvguf2p4] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.super-brand-text strong[b-dyrvguf2p4] {
    color: #ffffff !important;
    font-size: 1.42rem;
    font-weight: 900;
    letter-spacing: 0.015em;
}

.super-brand-text small[b-dyrvguf2p4] {
    margin-top: 7px;
    color: #c8daf9 !important;
    font-size: 0.70rem;
    font-weight: 900;
    letter-spacing: 0.28em;
}

/* =========================================================
   NAVEGACIÓN
   ========================================================= */

.super-menu-nav[b-dyrvguf2p4] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 20px 10px 18px;
    box-sizing: border-box;
}

.super-menu-section[b-dyrvguf2p4] {
    margin: 20px 8px 8px 8px;
    color: rgba(225, 237, 255, 0.86) !important;
    font-size: 0.76rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.super-menu-link[b-dyrvguf2p4] {
    position: relative;
    min-height: 54px;
    display: flex !important;
    align-items: center !important;
    width: 100%;
    padding: 0 16px;
    border-radius: 14px;
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 0.96rem;
    font-weight: 900;
    letter-spacing: -0.012em;
    opacity: 1 !important;
    outline: none;
    box-sizing: border-box;
    isolation: isolate;
    transition:
        background 170ms ease,
        box-shadow 170ms ease,
        transform 170ms ease,
        border-color 170ms ease;
}

.super-menu-link-content[b-dyrvguf2p4] {
    position: relative;
    z-index: 2;
    width: 100%;
    min-width: 0;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px;
    color: inherit !important;
    line-height: 1.15;
}

.super-menu-link:visited[b-dyrvguf2p4],
.super-menu-link:active[b-dyrvguf2p4],
.super-menu-link:focus[b-dyrvguf2p4] {
    color: #ffffff !important;
    text-decoration: none !important;
}

.super-menu-link:hover[b-dyrvguf2p4] {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.12);
    transform: translateX(2px);
}

/* =========================================================
   ESTADO ACTIVO - EFECTO AZUL MOCKUP
   Se cubren tres escenarios:
   1. ActiveClass de NavLink.
   2. Clase manual is-current calculada por ruta.
   3. Clase active generada por Blazor.
   ========================================================= */

.super-menu-link.super-menu-link-active[b-dyrvguf2p4],
.super-menu-link.is-current[b-dyrvguf2p4],
.super-menu-link.active[b-dyrvguf2p4],
[b-dyrvguf2p4] .super-menu-link.super-menu-link-active,
[b-dyrvguf2p4] .super-menu-link.is-current,
[b-dyrvguf2p4] .super-menu-link.active {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2f84ff 0%, #1769de 100%) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 16px 34px rgba(18, 92, 208, 0.52),
        0 4px 10px rgba(5, 22, 51, 0.20) !important;
    transform: none !important;
}

.super-menu-link.super-menu-link-active[b-dyrvguf2p4]::before,
.super-menu-link.is-current[b-dyrvguf2p4]::before,
.super-menu-link.active[b-dyrvguf2p4]::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
    border: 1px solid rgba(155, 199, 255, 0.38);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.10), transparent);
    pointer-events: none;
}

.super-menu-link.super-menu-link-active .super-menu-icon[b-dyrvguf2p4],
.super-menu-link.is-current .super-menu-icon[b-dyrvguf2p4],
.super-menu-link.active .super-menu-icon[b-dyrvguf2p4],
.super-menu-link.super-menu-link-active .super-menu-label[b-dyrvguf2p4],
.super-menu-link.is-current .super-menu-label[b-dyrvguf2p4],
.super-menu-link.active .super-menu-label[b-dyrvguf2p4] {
    color: #ffffff !important;
    opacity: 1 !important;
}

.super-menu-icon[b-dyrvguf2p4] {
    width: 24px;
    height: 24px;
    min-width: 24px;
    flex: 0 0 24px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
}

.super-menu-label[b-dyrvguf2p4] {
    min-width: 0;
    flex: 1 1 auto;
    display: inline-block !important;
    color: #ffffff !important;
    opacity: 1 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* =========================================================
   FIX ICONOS MUD BLAZOR EN CSS ISOLATION
   ========================================================= */

[b-dyrvguf2p4] .super-menu-sidebar .mud-icon-root,
[b-dyrvguf2p4] .super-menu-sidebar .mud-icon-root svg,
[b-dyrvguf2p4] .super-menu-sidebar .mud-icon-root path,
[b-dyrvguf2p4] .super-menu-sidebar svg,
[b-dyrvguf2p4] .super-menu-sidebar svg *,
[b-dyrvguf2p4] .super-mobile-menu-button .mud-icon-root,
[b-dyrvguf2p4] .super-mobile-menu-button svg,
[b-dyrvguf2p4] .super-mobile-menu-button svg * {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
    opacity: 1 !important;
}

.super-menu-sidebar .mud-icon-root[b-dyrvguf2p4],
.super-menu-sidebar svg[b-dyrvguf2p4],
.super-menu-sidebar svg *[b-dyrvguf2p4],
.super-mobile-menu-button .mud-icon-root[b-dyrvguf2p4],
.super-mobile-menu-button svg[b-dyrvguf2p4],
.super-mobile-menu-button svg *[b-dyrvguf2p4] {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
    opacity: 1 !important;
}

/* =========================================================
   ESTADO DE PLATAFORMA
   ========================================================= */

.super-menu-status[b-dyrvguf2p4] {
    flex: 0 0 auto;
    margin: 10px 22px 18px 22px;
    padding: 17px 15px;
    display: flex;
    align-items: center;
    gap: 13px;
    border-radius: 16px;
    border: 1px solid rgba(141, 184, 255, 0.34);
    color: #ffffff !important;
    background: rgba(5, 42, 99, 0.72);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 32px rgba(0, 0, 0, 0.16);
}

.super-menu-status-icon[b-dyrvguf2p4] {
    width: 48px;
    height: 48px;
    min-width: 48px;
    display: grid;
    place-items: center;
    color: #ffffff !important;
}

.super-menu-status-body[b-dyrvguf2p4] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.super-menu-status-body strong[b-dyrvguf2p4] {
    color: #ffffff !important;
    font-size: 0.84rem;
    font-weight: 900;
    line-height: 1.25;
}

.super-menu-status-state[b-dyrvguf2p4] {
    margin-top: 7px;
    display: flex;
    align-items: center;
    color: #32e76a !important;
    font-size: 0.80rem;
    font-weight: 900;
}

.super-menu-status-state i[b-dyrvguf2p4] {
    width: 9px;
    height: 9px;
    display: inline-block;
    margin-right: 7px;
    border-radius: 999px;
    background: #25e95d;
    box-shadow: 0 0 0 4px rgba(37, 233, 93, 0.14);
}

.super-menu-status-body small[b-dyrvguf2p4] {
    margin-top: 9px;
    color: #dce9ff !important;
    font-size: 0.70rem;
    font-weight: 700;
    line-height: 1.25;
}

/* =========================================================
   ALINEACIÓN HORIZONTAL ICONO + DESCRIPCIÓN
   ========================================================= */

[b-dyrvguf2p4] .super-menu-link,
[b-dyrvguf2p4] .super-menu-link-content {
    flex-direction: row !important;
    align-items: center !important;
}

[b-dyrvguf2p4] .super-menu-link .mud-icon-root {
    display: inline-flex !important;
    width: 22px !important;
    height: 22px !important;
    font-size: 22px !important;
    line-height: 1 !important;
}

/* =========================================================
   OVERLAY Y RESPONSIVE
   ========================================================= */

.super-mobile-overlay[b-dyrvguf2p4] {
    display: none;
}

@media (min-width: 961px) {
    .super-menu-sidebar[b-dyrvguf2p4] {
        transform: none !important;
    }
}

@media (max-width: 960px) {
    .super-mobile-menu-button[b-dyrvguf2p4] {
        position: fixed;
        top: 14px;
        left: 14px;
        z-index: 1180;
        width: 46px;
        height: 46px;
        display: grid !important;
        place-items: center;
        border: 0;
        border-radius: 14px;
        color: #ffffff !important;
        background: #0b3f91;
        box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
        cursor: pointer;
    }

    .super-brand-menu-button[b-dyrvguf2p4] {
        background: rgba(255, 255, 255, 0.10);
    }

    .super-mobile-overlay[b-dyrvguf2p4] {
        position: fixed;
        inset: 0;
        z-index: 1190;
        display: block;
        border: 0;
        background: rgba(2, 16, 38, 0.54);
        opacity: 0;
        pointer-events: none;
        transition: opacity 190ms ease;
    }

    .super-mobile-overlay.show[b-dyrvguf2p4] {
        opacity: 1;
        pointer-events: auto;
    }

    .super-menu-sidebar[b-dyrvguf2p4] {
        width: min(288px, 86vw);
        transform: translateX(-104%);
        transition: transform 220ms ease;
    }

    .super-menu-sidebar.mobile-open[b-dyrvguf2p4] {
        transform: translateX(0);
    }
}

/* =========================================================
   HAMBURGUESA ESCRITORIO - OCULTAR MENÚ SIN ROMPER DISEÑO
   ========================================================= */

@media (min-width: 961px) {
    .super-menu-sidebar.desktop-hidden[b-dyrvguf2p4] {
        width: 72px;
        transform: none !important;
        overflow: hidden;
        box-shadow: 10px 0 28px rgba(5, 22, 51, 0.20);
        transition: width 220ms ease, box-shadow 220ms ease;
    }

    .super-menu-sidebar.desktop-hidden .super-menu-brand[b-dyrvguf2p4] {
        min-height: 84px;
        justify-content: center;
        padding: 18px 12px 14px 12px;
    }

    .super-menu-sidebar.desktop-hidden .super-brand[b-dyrvguf2p4] {
        display: none !important;
    }

    .super-menu-sidebar.desktop-hidden .super-brand-menu-button[b-dyrvguf2p4] {
        width: 44px;
        height: 44px;
        min-width: 44px;
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.12);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.10);
    }

    .super-menu-sidebar.desktop-hidden .super-menu-nav[b-dyrvguf2p4],
    .super-menu-sidebar.desktop-hidden .super-menu-status[b-dyrvguf2p4] {
        display: none !important;
    }
}

@media (max-width: 960px) {
    .super-menu-sidebar.desktop-hidden[b-dyrvguf2p4] {
        width: min(288px, 86vw);
    }
}
/* /Pages/Auth/ConfirmEmail.razor.rz.scp.css */
/* =========================================================
   1. TARJETA PRINCIPAL DE CONFIRMACIÓN
   ========================================================= */
/*
   Este contenedor complementa la tarjeta base reutilizada
   desde el flujo de autenticación. Aquí solo ajustamos
   comportamientos visuales específicos de la pantalla de
   confirmación de correo.
*/
.confirm-card[b-7mixdxsend] {
    width: 100%;
}


/* =========================================================
   2. CONTENEDOR DE LA ILUSTRACIÓN SUPERIOR
   ========================================================= */
/*
   Centra horizontalmente la imagen principal para dar un
   punto focal claro al usuario antes del mensaje de estado.
*/
.confirm-hero[b-7mixdxsend] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 18px;
}


/* =========================================================
   3. IMAGEN / ILUSTRACIÓN DE CONFIRMACIÓN
   ========================================================= */
/*
   Define un tamaño visual agradable para la ilustración sin
   romper el diseño responsive. También evita selección
   accidental de la imagen.
*/
.confirm-hero-image[b-7mixdxsend] {
    width: 150px;
    max-width: 100%;
    height: auto;
    display: block;
    user-select: none;
    -webkit-user-drag: none;
}


/* =========================================================
   4. CONTENEDOR DEL ESTADO DE CARGA
   ========================================================= */
/*
   Se usa mientras el token de confirmación está siendo
   validado contra el API. Alinea spinner y texto en columna.
*/
.confirm-loading[b-7mixdxsend] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px 0 18px 0;
    text-align: center;
}


/* =========================================================
   5. TEXTO DEL ESTADO DE CARGA
   ========================================================= */
/*
   Mensaje secundario que acompaña el spinner durante la
   validación del enlace.
*/
.confirm-loading-text[b-7mixdxsend] {
    margin-top: 14px;
    font-size: 0.95rem;
    line-height: 1.45;
    color: #6b7280;
    text-align: center;
}


/* =========================================================
   6. ALERTA PRINCIPAL DE RESULTADO
   ========================================================= */
/*
   Ajusta la separación y el radio para que el mensaje de
   éxito o error se vea alineado con el estilo general del
   módulo de autenticación.
*/
.confirm-alert[b-7mixdxsend] {
    margin-top: 6px;
    margin-bottom: 18px;
    border-radius: 14px;
    overflow: hidden;
}


/* =========================================================
   7. CAJA INFORMATIVA DE ESPERA DE APROBACIÓN
   ========================================================= */
/*
   Bloque que explica al usuario que su correo ya fue
   confirmado, pero que aún necesita aprobación del
   administrador antes de poder ingresar al sistema.
*/
.confirm-info-box[b-7mixdxsend] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 18px 18px;
    margin-bottom: 18px;
    box-sizing: border-box;
}


/* =========================================================
   8. TÍTULO DE LA CAJA INFORMATIVA
   ========================================================= */
/*
   Resalta la idea principal del siguiente paso del proceso:
   la solicitud quedó correctamente registrada.
*/
.confirm-info-title[b-7mixdxsend] {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    color: #1f2937;
    margin-bottom: 10px;
}


/* =========================================================
   9. TEXTO DESCRIPTIVO DE LA CAJA INFORMATIVA
   ========================================================= */
/*
   Párrafos explicativos que aclaran que el usuario debe
   esperar autorización administrativa y un nuevo correo
   antes de tener acceso real a la plataforma.
*/
.confirm-info-text[b-7mixdxsend] {
    font-size: 0.94rem;
    line-height: 1.55;
    color: #4b5563;
    margin-bottom: 8px;
}


    /* =========================================================
   10. ÚLTIMO TEXTO DE LA CAJA INFORMATIVA
   ========================================================= */
    /*
   Elimina el margen inferior del último párrafo para evitar
   espacio sobrante dentro del bloque informativo.
*/
    .confirm-info-text.last[b-7mixdxsend] {
        margin-bottom: 0;
    }


/* =========================================================
   11. CONTENEDOR DE ACCIONES
   ========================================================= */
/*
   Controla la separación del bloque donde vive el botón
   principal, como "Ir al login".
*/
.confirm-actions[b-7mixdxsend] {
    margin-top: 4px;
    margin-bottom: 14px;
}


/* =========================================================
   12. AJUSTES RESPONSIVE PARA TABLET Y MÓVIL
   ========================================================= */
/*
   Reduce dimensiones y ajusta espacios cuando la pantalla es
   más pequeña para mantener legibilidad y jerarquía visual.
*/
@media (max-width: 768px) {
    .confirm-hero[b-7mixdxsend] {
        margin-bottom: 14px;
    }

    .confirm-hero-image[b-7mixdxsend] {
        width: 128px;
    }

    .confirm-alert[b-7mixdxsend] {
        margin-bottom: 16px;
        border-radius: 12px;
    }

    .confirm-info-box[b-7mixdxsend] {
        padding: 16px 15px;
        border-radius: 14px;
    }

    .confirm-info-title[b-7mixdxsend] {
        font-size: 0.98rem;
    }

    .confirm-info-text[b-7mixdxsend] {
        font-size: 0.92rem;
    }
}


/* =========================================================
   13. AJUSTES RESPONSIVE PARA MÓVILES PEQUEÑOS
   ========================================================= */
/*
   Termina de compactar la interfaz para dispositivos con
   menor ancho, manteniendo buena lectura y proporción.
*/
@media (max-width: 480px) {
    .confirm-hero-image[b-7mixdxsend] {
        width: 112px;
    }

    .confirm-loading[b-7mixdxsend] {
        padding: 6px 0 14px 0;
    }

    .confirm-loading-text[b-7mixdxsend] {
        font-size: 0.90rem;
    }

    .confirm-info-box[b-7mixdxsend] {
        padding: 14px 13px;
    }

    .confirm-info-title[b-7mixdxsend] {
        font-size: 0.95rem;
    }

    .confirm-info-text[b-7mixdxsend] {
        font-size: 0.90rem;
        line-height: 1.5;
    }

    .confirm-actions[b-7mixdxsend] {
        margin-bottom: 10px;
    }
}
/* /Pages/Auth/ForgotPassword.razor.rz.scp.css */
/* =========================================================
   1. PÁGINA PRINCIPAL
   ========================================================= */
.login-page[b-cwc75jbl5d] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 16px 28px 16px;
    background: linear-gradient(rgba(20, 34, 108, 0.12), rgba(20, 34, 108, 0.12)), url('/images/Fondo.png') center center / cover no-repeat;
}


/* =========================================================
   2. CONTENEDOR GENERAL
   ========================================================= */
.login-container[b-cwc75jbl5d] {
    width: 100%;
    max-width: 520px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translateY(-8px);
}


/* =========================================================
   3. LOGO
   ========================================================= */
.login-logo[b-cwc75jbl5d] {
    margin-bottom: 10px;
    text-align: center;
}

    .login-logo img[b-cwc75jbl5d] {
        width: 270px;
        max-width: 100%;
        height: auto;
        display: block;
    }


/* =========================================================
   4. TARJETA
   ========================================================= */
.forgot-card-wrapper[b-cwc75jbl5d] {
    width: 100%;
    max-width: 430px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 12px 28px rgba(8, 16, 64, 0.20), 0 3px 8px rgba(8, 16, 64, 0.08);
    overflow: hidden;
}

[b-cwc75jbl5d] .forgot-card {
    background: #ffffff !important;
    box-shadow: none !important;
    padding: 28px 24px 20px 24px;
    border-radius: 16px;
}


/* =========================================================
   5. HEADER
   ========================================================= */
.forgot-header[b-cwc75jbl5d] {
    text-align: center;
    margin-bottom: 18px;
}

    .forgot-header h1[b-cwc75jbl5d] {
        margin: 0;
        font-size: 1.95rem;
        font-weight: 800;
        line-height: 1.08;
        color: #1b2d63;
    }

    .forgot-header p[b-cwc75jbl5d] {
        margin: 10px 0 0;
        font-size: 0.92rem;
        color: #6f7ca5;
        font-weight: 600;
    }


/* =========================================================
   6. FORMULARIO
   ========================================================= */
.forgot-form[b-cwc75jbl5d] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
}


/* =========================================================
   7. CAMPO DE CORREO
   ========================================================= */
[b-cwc75jbl5d] .forgot-field {
    width: 100%;
}

[b-cwc75jbl5d] .forgot-input .mud-input-control {
    margin-top: 0 !important;
}

[b-cwc75jbl5d] .forgot-input .mud-input-slot {
    min-height: 40px;
    background: #ffffff !important;
}

[b-cwc75jbl5d] .forgot-input .mud-input-root {
    background: #ffffff !important;
    border-radius: 7px;
}

[b-cwc75jbl5d] .forgot-input .mud-input-root-outlined {
    border-radius: 7px;
}

[b-cwc75jbl5d] .forgot-input input {
    color: #4a567d !important;
    font-weight: 500;
    font-size: 0.94rem;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

    [b-cwc75jbl5d] .forgot-input input::placeholder {
        color: #98a3bf !important;
        opacity: 1 !important;
    }

[b-cwc75jbl5d] .forgot-input .mud-input-label {
    display: none !important;
}

[b-cwc75jbl5d] .forgot-input .mud-input-adornment {
    color: #7b86a5 !important;
}

[b-cwc75jbl5d] .forgot-input .mud-input-outlined-border {
    border-color: #d8ddea !important;
}

[b-cwc75jbl5d] .forgot-input:hover .mud-input-outlined-border {
    border-color: #c7d0e4 !important;
}


/* =========================================================
   8. BOTÓN PRINCIPAL
   ========================================================= */
[b-cwc75jbl5d] .forgot-button {
    height: 46px;
    border-radius: 7px;
    text-transform: none;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0;
    background: linear-gradient(90deg, #3d8cff 0%, #165ae5 100%) !important;
    box-shadow: 0 7px 18px rgba(27, 91, 224, 0.30) !important;
    color: #ffffff !important;
}

    [b-cwc75jbl5d] .forgot-button:hover {
        transform: translateY(-1px);
    }

    [b-cwc75jbl5d] .forgot-button .mud-progress-circular {
        color: #ffffff !important;
    }


/* =========================================================
   9. DIVISOR
   ========================================================= */
.forgot-divider[b-cwc75jbl5d] {
    margin-top: 2px;
    height: 1px;
    background: #e8ebf3;
}


/* =========================================================
   10. FOOTER
   ========================================================= */
.forgot-footer[b-cwc75jbl5d] {
    text-align: center;
    color: #4d587d;
    font-weight: 500;
    font-size: 0.92rem;
}

.forgot-link-primary[b-cwc75jbl5d] {
    color: #355fd0;
    font-weight: 700;
    text-decoration: none;
}

    .forgot-link-primary:hover[b-cwc75jbl5d] {
        text-decoration: underline;
    }


/* =========================================================
   11. RESPONSIVE
   ========================================================= */
@media (max-width: 600px) {
    .login-page[b-cwc75jbl5d] {
        padding: 18px 12px 24px 12px;
    }

    .login-container[b-cwc75jbl5d] {
        transform: translateY(-4px);
    }

    .login-logo img[b-cwc75jbl5d] {
        width: 235px;
    }

    .forgot-card-wrapper[b-cwc75jbl5d] {
        max-width: 100%;
    }

    [b-cwc75jbl5d] .forgot-card {
        padding: 24px 18px 18px 18px;
    }

    .forgot-header h1[b-cwc75jbl5d] {
        font-size: 1.75rem;
    }

    .forgot-header p[b-cwc75jbl5d] {
        font-size: 0.88rem;
    }

    .forgot-footer[b-cwc75jbl5d] {
        font-size: 0.9rem;
    }
}
/* /Pages/Auth/Login.razor.rz.scp.css */
/* =========================================================
   1. LOGIN PAGE
   ========================================================= */

.login-page[b-ym0lhgu95r] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 16px 28px;
    background: linear-gradient(rgba(20, 34, 108, 0.10), rgba(20, 34, 108, 0.10)), url('/images/Fondo.png') center center / cover no-repeat;
}


/* =========================================================
   2. LOGIN CONTAINER
   ========================================================= */

.login-container[b-ym0lhgu95r] {
    width: 100%;
    max-width: 520px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translateY(-14px);
}


/* =========================================================
   3. LOGO
   ========================================================= */

.login-logo[b-ym0lhgu95r] {
    margin-bottom: 18px;
    text-align: center;
}

    .login-logo img[b-ym0lhgu95r] {
        width: 270px;
        max-width: 100%;
        height: auto;
        display: block;
    }


/* =========================================================
   4. CARD WRAPPER
   ========================================================= */

.login-card-wrapper[b-ym0lhgu95r] {
    width: 100%;
    max-width: 392px;
    border-radius: 20px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 18px 42px rgba(8, 16, 64, 0.22), 0 4px 12px rgba(8, 16, 64, 0.08);
}


/* =========================================================
   5. LOGIN CARD
   ========================================================= */

[b-ym0lhgu95r](.login-card) {
    background: #ffffff !important;
    box-shadow: none !important;
    border-radius: 20px !important;
    padding: 32px 26px 24px;
}


/* =========================================================
   6. HEADER
   ========================================================= */

.login-header[b-ym0lhgu95r] {
    text-align: center;
    margin-bottom: 24px;
}

    .login-header h1[b-ym0lhgu95r] {
        margin: 0;
        color: #17327a;
        font-size: 2.05rem;
        font-weight: 800;
        line-height: 1.1;
    }

    .login-header p[b-ym0lhgu95r] {
        margin: 10px 0 0;
        color: #7081ad;
        font-size: 0.93rem;
        font-weight: 600;
    }


/* =========================================================
   7. FORM
   ========================================================= */

.login-form[b-ym0lhgu95r] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}


/* =========================================================
   8. INPUTS - MUD STYLE CLEAN
   ========================================================= */

[b-ym0lhgu95r](.login-input) {
    margin: 0 !important;
    background: #ffffff !important;
}

[b-ym0lhgu95r](.login-input .mud-input-root) {
    min-height: 56px !important;
    background: #ffffff !important;
}

[b-ym0lhgu95r](.login-input .mud-input-outlined-border) {
    border-radius: 12px !important;
    border-color: #dce5f0 !important;
}

[b-ym0lhgu95r](.login-input:hover .mud-input-outlined-border) {
    border-color: #9bbcff !important;
}

[b-ym0lhgu95r](.login-input .mud-focused .mud-input-outlined-border),
[b-ym0lhgu95r](.login-input .mud-input-root.mud-focused .mud-input-outlined-border) {
    border-color: #2d6df6 !important;
}

[b-ym0lhgu95r](.login-input .mud-input-adornment) {
    color: #667085 !important;
    background: transparent !important;
}

[b-ym0lhgu95r](.login-input .mud-icon-root) {
    font-size: 22px !important;
    color: #667085 !important;
}

[b-ym0lhgu95r](.login-input:hover .mud-icon-root) {
    color: #2d6df6 !important;
}

[b-ym0lhgu95r](.login-native-input) {
    background: #ffffff !important;
    color: #082b63 !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
}

[b-ym0lhgu95r](.login-native-input::placeholder) {
    color: #98a2b3 !important;
    opacity: 1 !important;
}


/* =========================================================
   9. CHROME / EDGE AUTOCOMPLETE FIX
   ========================================================= */

[b-ym0lhgu95r](input.login-native-input:-webkit-autofill),
[b-ym0lhgu95r](input.login-native-input:-webkit-autofill:hover),
[b-ym0lhgu95r](input.login-native-input:-webkit-autofill:focus),
[b-ym0lhgu95r](input.login-native-input:-webkit-autofill:active) {
    -webkit-text-fill-color: #082b63 !important;
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    caret-color: #082b63 !important;
    transition: background-color 999999s ease-in-out 0s !important;
}


/* =========================================================
   10. OPTIONS
   ========================================================= */

.login-options[b-ym0lhgu95r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: -2px;
}

.login-remember[b-ym0lhgu95r] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #334155;
    font-size: 0.93rem;
    font-weight: 700;
}

.login-options a[b-ym0lhgu95r] {
    color: #4f6fe8;
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 700;
}

    .login-options a:hover[b-ym0lhgu95r] {
        color: #1d4ed8;
        text-decoration: underline;
    }


/* =========================================================
   11. CHECKBOX
   ========================================================= */

[b-ym0lhgu95r](.login-checkbox) {
    margin: 0 !important;
}

[b-ym0lhgu95r](.login-checkbox .mud-button-root) {
    padding: 0 !important;
}

[b-ym0lhgu95r](.login-checkbox .mud-icon-root) {
    font-size: 22px !important;
}


/* =========================================================
   12. BUTTON
   ========================================================= */

[b-ym0lhgu95r](.login-button) {
    height: 48px !important;
    border-radius: 10px !important;
    text-transform: none !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    background: linear-gradient(90deg, #3d8cff 0%, #165ae5 100%) !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
    transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
}

[b-ym0lhgu95r](.login-button:hover) {
    transform: translateY(-1px);
    filter: brightness(1.03);
    box-shadow: 0 14px 28px rgba(37, 99, 235, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
}


/* =========================================================
   13. FOOTER
   ========================================================= */

.login-footer[b-ym0lhgu95r] {
    text-align: center;
    color: #4b5b82;
    font-size: 0.92rem;
    font-weight: 500;
}

    .login-footer a[b-ym0lhgu95r] {
        color: #315fd6;
        font-weight: 800;
        text-decoration: none;
    }

        .login-footer a:hover[b-ym0lhgu95r] {
            text-decoration: underline;
        }


/* =========================================================
   14. RESPONSIVE
   ========================================================= */

@media (max-width: 600px) {
    .login-page[b-ym0lhgu95r] {
        padding: 18px 12px 24px;
    }

    .login-container[b-ym0lhgu95r] {
        transform: translateY(-6px);
    }

    .login-logo img[b-ym0lhgu95r] {
        width: 235px;
    }

    .login-card-wrapper[b-ym0lhgu95r] {
        max-width: 100%;
    }

    [b-ym0lhgu95r](.login-card) {
        padding: 26px 18px 20px;
    }

    .login-header h1[b-ym0lhgu95r] {
        font-size: 1.8rem;
    }

    .login-header p[b-ym0lhgu95r] {
        font-size: 0.9rem;
    }

    .login-options[b-ym0lhgu95r] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

        .login-options a[b-ym0lhgu95r] {
            width: 100%;
            text-align: right;
        }
}
/* /Pages/Auth/MyProfile.razor.rz.scp.css */
/* =========================================================
   SECCIÓN: VARIABLES VISUALES DEL COMPONENTE
   ========================================================= */

.hb-profile-overlay[b-i8twqmt2uh] {
    --hb-profile-bg: #ffffff;
    --hb-profile-page-bg: #eef3fb;
    --hb-profile-text: #101828;
    --hb-profile-muted: #667085;
    --hb-profile-line: #dbe3ef;
    --hb-profile-line-strong: #cbd5e1;
    --hb-profile-primary: #0b63f6;
    --hb-profile-primary-dark: #084ec2;
    --hb-profile-primary-soft: #dbeafe;
    --hb-profile-success: #039855;
    --hb-profile-success-soft: #d1fadf;
    --hb-profile-danger: #e5484d;
    --hb-profile-danger-soft: #fffafa;
    --hb-profile-shadow: 0 26px 80px rgba(15, 23, 42, 0.26);
    --hb-profile-card-shadow: 0 10px 26px rgba(15, 23, 42, 0.045);

    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    justify-content: flex-end;
    background: rgba(15, 23, 42, 0.46);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* =========================================================
   SECCIÓN: BACKDROP Y DRAWER
   ========================================================= */

.hb-profile-backdrop[b-i8twqmt2uh] {
    position: absolute;
    inset: 0;
    border: 0;
    padding: 0;
    cursor: default;
    background: transparent;
}

.hb-profile-drawer[b-i8twqmt2uh] {
    position: relative;
    z-index: 1;
    width: min(760px, 100vw);
    height: 100dvh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    overflow: hidden;
    background: var(--hb-profile-bg);
    border-left: 1px solid rgba(219, 227, 239, 0.95);
    box-shadow: var(--hb-profile-shadow);
}

/* =========================================================
   SECCIÓN: ENCABEZADO
   ========================================================= */

.hb-profile-header[b-i8twqmt2uh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 24px 22px 18px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
    border-bottom: 1px solid rgba(219, 227, 239, 0.82);
}

.hb-profile-title-group[b-i8twqmt2uh] {
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.hb-profile-title-icon[b-i8twqmt2uh] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    color: var(--hb-profile-text);
    background: #f4f7fb;
    border: 1px solid #e4eaf3;
    border-radius: 14px;
    font-size: 24px;
}

.hb-profile-title-group h2[b-i8twqmt2uh] {
    margin: 0;
    color: var(--hb-profile-text);
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.035em;
    line-height: 1.1;
}

.hb-profile-title-group p[b-i8twqmt2uh] {
    margin: 9px 0 0;
    color: var(--hb-profile-muted);
    font-size: 15px;
}

.hb-profile-close[b-i8twqmt2uh] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    color: #111827;
    background: #f5f7fb;
    border: 1px solid #e4eaf3;
    border-radius: 14px;
    font-size: 24px;
    cursor: pointer;
}

/* =========================================================
   SECCIÓN: CONTENIDO
   ========================================================= */

.hb-profile-content[b-i8twqmt2uh] {
    padding: 18px 22px 20px;
    overflow-y: auto;
    background: var(--hb-profile-page-bg);
}

.hb-profile-summary-card[b-i8twqmt2uh],
.hb-profile-card[b-i8twqmt2uh] {
    background: var(--hb-profile-bg);
    border: 1px solid var(--hb-profile-line);
    border-radius: 18px;
    box-shadow: var(--hb-profile-card-shadow);
}

.hb-profile-summary-card[b-i8twqmt2uh] {
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 28px;
    align-items: center;
    min-height: 190px;
    padding: 22px;
    margin-bottom: 22px;
}

.hb-profile-avatar-area[b-i8twqmt2uh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}

.hb-profile-avatar[b-i8twqmt2uh] {
    width: 96px;
    height: 96px;
    display: grid;
    place-items: center;
    color: #ffffff;
    background: linear-gradient(145deg, #2f80ff 0%, #0b63f6 50%, #084ec2 100%);
    border: 5px solid #eef5ff;
    border-radius: 999px;
    box-shadow: 0 18px 36px rgba(11, 99, 246, 0.22);
    font-size: 34px;
    font-weight: 800;
}

.hb-profile-name-row[b-i8twqmt2uh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.hb-profile-name-row h3[b-i8twqmt2uh] {
    margin: 0;
    color: var(--hb-profile-text);
    font-size: 20px;
    font-weight: 800;
}

.hb-role-badge[b-i8twqmt2uh],
.hb-status-badge[b-i8twqmt2uh] {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.hb-role-badge[b-i8twqmt2uh] {
    color: var(--hb-profile-primary);
    background: var(--hb-profile-primary-soft);
    border: 1px solid #bfdbfe;
}

.hb-status-badge[b-i8twqmt2uh] {
    color: var(--hb-profile-success);
    background: var(--hb-profile-success-soft);
    border: 1px solid #a6f4c5;
}

.hb-profile-email[b-i8twqmt2uh] {
    display: flex;
    align-items: center;
    gap: 14px;
    color: #25334d;
    font-size: 16px;
    font-weight: 500;
}

.hb-info-icon[b-i8twqmt2uh] {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    background: #f3f6fb;
    border-radius: 8px;
}

.hb-profile-last-access[b-i8twqmt2uh] {
    margin: 22px 0 0;
    color: #53657d;
    font-size: 13px;
}

.hb-profile-card[b-i8twqmt2uh] {
    padding: 20px;
    margin-bottom: 22px;
}

.hb-card-header[b-i8twqmt2uh] {
    margin-bottom: 18px;
}

.hb-card-header h4[b-i8twqmt2uh] {
    margin: 0;
    color: var(--hb-profile-text);
    font-size: 18px;
    font-weight: 800;
}

/* =========================================================
   SECCIÓN: FORMULARIOS
   ========================================================= */

.hb-form-grid[b-i8twqmt2uh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.hb-field label[b-i8twqmt2uh],
.hb-theme-label[b-i8twqmt2uh] {
    display: block;
    margin: 0 0 10px;
    color: #16223a;
    font-size: 13px;
    font-weight: 800;
}

.hb-field input[b-i8twqmt2uh] {
    width: 100%;
    height: 50px;
    padding: 0 17px;
    color: #24324b;
    background: #fbfdff;
    border: 1px solid var(--hb-profile-line-strong);
    border-radius: 10px;
    outline: none;
    font-size: 15px;
    font-weight: 500;
}

.hb-field input.hb-readonly[b-i8twqmt2uh] {
    color: #667085;
    background: #f4f7fb;
}

.hb-select-visual[b-i8twqmt2uh] {
    position: relative;
}

.hb-select-visual input[b-i8twqmt2uh] {
    padding-right: 46px;
}

.hb-select-visual span[b-i8twqmt2uh] {
    position: absolute;
    top: 50%;
    right: 17px;
    color: #53657d;
    transform: translateY(-50%);
}

/* =========================================================
   SECCIÓN: SEGURIDAD Y PREFERENCIAS
   ========================================================= */

.hb-security-password-row[b-i8twqmt2uh] {
    display: grid;
    grid-template-columns: 1fr 230px;
    gap: 18px;
    align-items: end;
    margin-bottom: 24px;
}

.hb-password-field input[b-i8twqmt2uh] {
    letter-spacing: 0.18em;
}

.hb-password-button[b-i8twqmt2uh] {
    height: 50px;
}

.hb-two-factor-box[b-i8twqmt2uh],
.hb-compact-row[b-i8twqmt2uh] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: center;
    padding-top: 28px;
    border-top: 1px solid #edf1f7;
}

.hb-two-factor-box h5[b-i8twqmt2uh],
.hb-compact-row h5[b-i8twqmt2uh] {
    margin: 0 0 8px;
    color: var(--hb-profile-text);
    font-size: 16px;
    font-weight: 800;
}

.hb-two-factor-box p[b-i8twqmt2uh],
.hb-compact-row p[b-i8twqmt2uh] {
    margin: 0;
    color: var(--hb-profile-muted);
    font-size: 13px;
}

.hb-two-factor-actions[b-i8twqmt2uh] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.hb-theme-section[b-i8twqmt2uh] {
    margin-bottom: 24px;
}

.hb-theme-grid[b-i8twqmt2uh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.hb-theme-button[b-i8twqmt2uh] {
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    color: #24324b;
    background: #ffffff;
    border: 1px solid var(--hb-profile-line);
    border-radius: 12px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 800;
}

.hb-theme-button-active[b-i8twqmt2uh] {
    background: #f8fbff;
    border-color: var(--hb-profile-primary);
    box-shadow: 0 0 0 4px rgba(11, 99, 246, 0.11);
}

.hb-compact-toggle[b-i8twqmt2uh] {
    width: 56px;
    height: 34px;
    position: relative;
    padding: 0;
    background: #98a2b3;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
}

.hb-compact-toggle span[b-i8twqmt2uh] {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 26px;
    height: 26px;
    background: #ffffff;
    border-radius: 999px;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.22);
}

.hb-compact-toggle-active[b-i8twqmt2uh] {
    background: var(--hb-profile-primary);
}

.hb-compact-toggle-active span[b-i8twqmt2uh] {
    transform: translateX(22px);
}

/* =========================================================
   SECCIÓN: BOTONES Y FOOTER
   ========================================================= */

.hb-secondary-button[b-i8twqmt2uh],
.hb-primary-button[b-i8twqmt2uh],
.hb-danger-outline-button[b-i8twqmt2uh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 46px;
    padding: 0 18px;
    border-radius: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 800;
}

.hb-secondary-button[b-i8twqmt2uh] {
    color: #24324b;
    background: #ffffff;
    border: 1px solid #bcc7d8;
}

.hb-avatar-button[b-i8twqmt2uh] {
    width: 190px;
}

.hb-primary-button[b-i8twqmt2uh] {
    min-width: 220px;
    color: #ffffff;
    background: var(--hb-profile-primary);
    border: 1px solid var(--hb-profile-primary);
    box-shadow: 0 12px 26px rgba(11, 99, 246, 0.24);
}

.hb-danger-outline-button[b-i8twqmt2uh] {
    min-width: 260px;
    color: var(--hb-profile-danger);
    background: var(--hb-profile-danger-soft);
    border: 1px solid #ffb4b4;
}

.hb-profile-footer[b-i8twqmt2uh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 22px;
    background: rgba(255, 255, 255, 0.96);
    border-top: 1px solid rgba(219, 227, 239, 0.95);
}

/* =========================================================
   SECCIÓN: RESPONSIVE
   ========================================================= */

@media (max-width: 820px) {
    .hb-profile-summary-card[b-i8twqmt2uh],
    .hb-form-grid[b-i8twqmt2uh],
    .hb-security-password-row[b-i8twqmt2uh],
    .hb-two-factor-box[b-i8twqmt2uh],
    .hb-theme-grid[b-i8twqmt2uh],
    .hb-compact-row[b-i8twqmt2uh] {
        grid-template-columns: 1fr;
    }

    .hb-profile-footer[b-i8twqmt2uh] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .hb-primary-button[b-i8twqmt2uh],
    .hb-danger-outline-button[b-i8twqmt2uh] {
        width: 100%;
        min-width: 0;
    }
}


/* =========================================================
   SECCIÓN: DENSIDAD PARA LAPTOPS Y PANTALLAS BAJAS
   ========================================================= */

@media (max-height: 820px) {
    .hb-profile-drawer[b-i8twqmt2uh] {
        width: min(720px, 100vw);
    }

    .hb-profile-header[b-i8twqmt2uh] {
        padding-top: 20px;
        padding-bottom: 16px;
    }

    .hb-profile-content[b-i8twqmt2uh] {
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .hb-profile-summary-card[b-i8twqmt2uh] {
        min-height: 170px;
        padding: 18px;
        margin-bottom: 16px;
    }

    .hb-profile-card[b-i8twqmt2uh] {
        padding: 18px;
        margin-bottom: 16px;
    }

    .hb-profile-avatar[b-i8twqmt2uh] {
        width: 86px;
        height: 86px;
        font-size: 30px;
    }

    .hb-field input[b-i8twqmt2uh] {
        height: 46px;
    }

    .hb-theme-button[b-i8twqmt2uh] {
        height: 52px;
    }

    .hb-profile-footer[b-i8twqmt2uh] {
        padding-top: 14px;
        padding-bottom: 14px;
    }
}
/* /Pages/Auth/Register.razor.rz.scp.css */
/* =========================================================
   1. PÁGINA DE REGISTRO
   ========================================================= */
/*
   Contenedor principal con el mismo fondo del login.
*/
.login-page[b-wfbu6y9quf] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 16px 28px 16px;
    background: linear-gradient(rgba(20, 34, 108, 0.12), rgba(20, 34, 108, 0.12)), url('/images/Fondo.png') center center / cover no-repeat;
}


/* =========================================================
   2. CONTENEDOR GENERAL
   ========================================================= */
/*
   Agrupa logo y tarjeta.
   Se sube ligeramente para equilibrar visualmente el diseño.
*/
.login-container[b-wfbu6y9quf] {
    width: 100%;
    max-width: 620px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translateY(-8px);
}


/* =========================================================
   3. LOGO SUPERIOR
   ========================================================= */
/*
   Logo más cercano al card, como en el mockup.
*/
.login-logo[b-wfbu6y9quf] {
    margin-bottom: 10px;
    text-align: center;
}

    .login-logo img[b-wfbu6y9quf] {
        width: 270px;
        max-width: 100%;
        height: auto;
        display: block;
    }


/* =========================================================
   4. TARJETA EXTERNA
   ========================================================= */
/*
   Ancho corregido para evitar espacio muerto a la derecha.
*/
.register-card-wrapper[b-wfbu6y9quf] {
    width: 100%;
    max-width: 560px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 12px 28px rgba(8, 16, 64, 0.20), 0 3px 8px rgba(8, 16, 64, 0.08);
    overflow: hidden;
}


/* =========================================================
   5. TARJETA INTERNA MUDPAPER
   ========================================================= */
/*
   El wrapper externo maneja la sombra; el MudPaper queda limpio.
*/
[b-wfbu6y9quf] .register-card {
    background: #ffffff !important;
    box-shadow: none !important;
    padding: 28px 24px 20px 24px;
    border-radius: 16px;
}


/* =========================================================
   6. ENCABEZADO
   ========================================================= */
/*
   Título y subtítulo.
*/
.register-header[b-wfbu6y9quf] {
    text-align: center;
    margin-bottom: 16px;
}

    .register-header h1[b-wfbu6y9quf] {
        margin: 0;
        font-size: 2rem;
        font-weight: 800;
        line-height: 1.08;
        color: #1b2d63;
    }

    .register-header p[b-wfbu6y9quf] {
        margin: 10px 0 0;
        font-size: 0.92rem;
        color: #6f7ca5;
        font-weight: 600;
    }


/* =========================================================
   7. FORMULARIO PRINCIPAL
   ========================================================= */
/*
   El formulario debe usar todo el ancho disponible.
*/
.register-form[b-wfbu6y9quf] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}


/* =========================================================
   8. GRID DEL FORMULARIO
   ========================================================= */
/*
   Se fuerza a ocupar todo el ancho.
*/
.register-grid[b-wfbu6y9quf] {
    width: 100%;
    margin: 0;
}

[b-wfbu6y9quf] .register-grid .mud-grid-item {
    display: flex;
    padding-top: 6px;
    padding-bottom: 6px;
}


/* =========================================================
   9. CAMPOS DEL FORMULARIO
   ========================================================= */
/*
   Cada campo debe expandirse por completo dentro de su columna.
*/
[b-wfbu6y9quf] .register-field {
    width: 100%;
}


/* =========================================================
   10. INPUTS DE TEXTO
   ========================================================= */
/*
   Inputs más compactos y con placeholder visible.
*/
[b-wfbu6y9quf] .register-input .mud-input-control {
    margin-top: 0 !important;
}

[b-wfbu6y9quf] .register-input .mud-input-slot {
    min-height: 38px;
    background: #ffffff !important;
}

[b-wfbu6y9quf] .register-input .mud-input-root {
    background: #ffffff !important;
    border-radius: 7px;
}

[b-wfbu6y9quf] .register-input .mud-input-root-outlined {
    border-radius: 7px;
}

[b-wfbu6y9quf] .register-input input {
    color: #4a567d !important;
    font-weight: 500;
    font-size: 0.92rem;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

    [b-wfbu6y9quf] .register-input input::placeholder {
        color: #98a3bf !important;
        opacity: 1 !important;
    }

[b-wfbu6y9quf] .register-input .mud-input-label {
    display: none !important;
}

[b-wfbu6y9quf] .register-input .mud-input-adornment {
    color: #7b86a5 !important;
}

[b-wfbu6y9quf] .register-input .mud-input-outlined-border {
    border-color: #d8ddea !important;
}

[b-wfbu6y9quf] .register-input:hover .mud-input-outlined-border {
    border-color: #c7d0e4 !important;
}


/* =========================================================
   11. SELECTS Y DATEPICKER
   ========================================================= */
/*
   Ajustes visuales para que parezcan parte del mismo sistema.
*/
[b-wfbu6y9quf] .register-input.mud-input-control,
[b-wfbu6y9quf] .register-datepicker.mud-input-control {
    width: 100%;
}

[b-wfbu6y9quf] .mud-select,
[b-wfbu6y9quf] .mud-picker {
    background: #ffffff !important;
    border-radius: 7px;
}

[b-wfbu6y9quf] .mud-select-input {
    color: #4a567d !important;
    font-weight: 500;
    font-size: 0.92rem;
}

[b-wfbu6y9quf] .mud-input-control .mud-input-label-inputcontrol {
    color: #98a3bf !important;
    font-weight: 500;
}


/* =========================================================
   12. AJUSTE EXTRA DE FONDOS
   ========================================================= */
/*
   Refuerza el fondo blanco en componentes internos de MudBlazor.
*/
[b-wfbu6y9quf] .mud-input-root {
    background: #ffffff !important;
}

[b-wfbu6y9quf] .mud-input-slot {
    background: #ffffff !important;
}


/* =========================================================
   13. TÉRMINOS Y CONDICIONES
   ========================================================= */
/*
   Fila de aceptación de términos.
*/
.register-terms[b-wfbu6y9quf] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 2px;
    flex-wrap: wrap;
}

.register-terms-text[b-wfbu6y9quf] {
    margin-right: auto;
    color: #3d4a71;
    font-weight: 600;
    font-size: 0.92rem;
}

.register-link-secondary[b-wfbu6y9quf] {
    color: #5f7fd8;
    text-decoration: none;
    font-weight: 700;
}

    .register-link-secondary:hover[b-wfbu6y9quf] {
        text-decoration: underline;
    }


/* =========================================================
   14. CHECKBOX
   ========================================================= */
/*
   Alineación fina del checkbox.
*/
[b-wfbu6y9quf] .register-terms .mud-checkbox {
    margin: 0;
    margin-top: -2px;
}

[b-wfbu6y9quf] .register-terms .mud-button-root {
    padding: 0;
}


/* =========================================================
   15. BOTÓN PRINCIPAL
   ========================================================= */
/*
   Botón azul principal del formulario.
*/
[b-wfbu6y9quf] .register-button {
    height: 46px;
    border-radius: 7px;
    text-transform: none;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0;
    background: linear-gradient(90deg, #3d8cff 0%, #165ae5 100%) !important;
    box-shadow: 0 7px 18px rgba(27, 91, 224, 0.30) !important;
    color: #ffffff !important;
}

    [b-wfbu6y9quf] .register-button:hover {
        transform: translateY(-1px);
    }

    [b-wfbu6y9quf] .register-button .mud-progress-circular {
        color: #ffffff !important;
    }


/* =========================================================
   16. DIVISOR
   ========================================================= */
/*
   Línea divisoria antes del footer.
*/
.register-divider[b-wfbu6y9quf] {
    margin-top: 2px;
    height: 1px;
    background: #e8ebf3;
}


/* =========================================================
   17. FOOTER
   ========================================================= */
/*
   Link para volver al login.
*/
.register-footer[b-wfbu6y9quf] {
    text-align: center;
    color: #4d587d;
    font-weight: 500;
    font-size: 0.92rem;
}

.register-link-primary[b-wfbu6y9quf] {
    color: #355fd0;
    font-weight: 700;
    text-decoration: none;
}

    .register-link-primary:hover[b-wfbu6y9quf] {
        text-decoration: underline;
    }


/* =========================================================
   18. RESPONSIVE - TABLET Y MÓVIL
   ========================================================= */
/*
   Ajustes generales para pantallas pequeñas.
*/
@media (max-width: 600px) {
    .login-page[b-wfbu6y9quf] {
        padding: 18px 12px 24px 12px;
    }

    .login-container[b-wfbu6y9quf] {
        transform: translateY(-4px);
    }

    .login-logo[b-wfbu6y9quf] {
        margin-bottom: 10px;
    }

        .login-logo img[b-wfbu6y9quf] {
            width: 235px;
        }

    .register-card-wrapper[b-wfbu6y9quf] {
        max-width: 100%;
    }

    [b-wfbu6y9quf] .register-card {
        padding: 24px 18px 18px 18px;
    }

    .register-header h1[b-wfbu6y9quf] {
        font-size: 1.8rem;
    }

    .register-header p[b-wfbu6y9quf] {
        font-size: 0.9rem;
    }

    .register-terms[b-wfbu6y9quf] {
        align-items: flex-start;
    }

    .register-footer[b-wfbu6y9quf] {
        font-size: 0.9rem;
    }
}


/* =========================================================
   19. RESPONSIVE - AJUSTE FINAL
   ========================================================= */
/*
   Bordes ligeramente más compactos en móviles pequeños.
*/
@media (max-width: 480px) {
    .register-card-wrapper[b-wfbu6y9quf] {
        border-radius: 14px;
    }

    [b-wfbu6y9quf] .register-card {
        border-radius: 14px;
    }
}
/* /Pages/Auth/ResetPassword.razor.rz.scp.css */
/* =========================================================
   1. PÁGINA PRINCIPAL
   ========================================================= */
.login-page[b-p0fttisjds] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 16px 28px 16px;
    background: linear-gradient(rgba(20, 34, 108, 0.12), rgba(20, 34, 108, 0.12)), url('/images/Fondo.png') center center / cover no-repeat;
}


/* =========================================================
   2. CONTENEDOR GENERAL
   ========================================================= */
.login-container[b-p0fttisjds] {
    width: 100%;
    max-width: 520px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translateY(-8px);
}


/* =========================================================
   3. LOGO
   ========================================================= */
.login-logo[b-p0fttisjds] {
    margin-bottom: 10px;
    text-align: center;
}

    .login-logo img[b-p0fttisjds] {
        width: 270px;
        max-width: 100%;
        height: auto;
        display: block;
    }


/* =========================================================
   4. TARJETA
   ========================================================= */
.forgot-card-wrapper[b-p0fttisjds] {
    width: 100%;
    max-width: 430px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 12px 28px rgba(8, 16, 64, 0.20), 0 3px 8px rgba(8, 16, 64, 0.08);
    overflow: hidden;
}

[b-p0fttisjds] .forgot-card {
    background: #ffffff !important;
    box-shadow: none !important;
    padding: 28px 24px 20px 24px;
    border-radius: 16px;
}


/* =========================================================
   5. HEADER
   ========================================================= */
.forgot-header[b-p0fttisjds] {
    text-align: center;
    margin-bottom: 18px;
}

    .forgot-header h1[b-p0fttisjds] {
        margin: 0;
        font-size: 1.95rem;
        font-weight: 800;
        line-height: 1.08;
        color: #1b2d63;
    }

    .forgot-header p[b-p0fttisjds] {
        margin: 10px 0 0;
        font-size: 0.92rem;
        color: #6f7ca5;
        font-weight: 600;
    }


/* =========================================================
   6. FORMULARIO
   ========================================================= */
.forgot-form[b-p0fttisjds] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
}


/* =========================================================
   7. CAMPO DE CORREO
   ========================================================= */
[b-p0fttisjds] .forgot-field {
    width: 100%;
}

[b-p0fttisjds] .forgot-input .mud-input-control {
    margin-top: 0 !important;
}

[b-p0fttisjds] .forgot-input .mud-input-slot {
    min-height: 40px;
    background: #ffffff !important;
}

[b-p0fttisjds] .forgot-input .mud-input-root {
    background: #ffffff !important;
    border-radius: 7px;
}

[b-p0fttisjds] .forgot-input .mud-input-root-outlined {
    border-radius: 7px;
}

[b-p0fttisjds] .forgot-input input {
    color: #4a567d !important;
    font-weight: 500;
    font-size: 0.94rem;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

    [b-p0fttisjds] .forgot-input input::placeholder {
        color: #98a3bf !important;
        opacity: 1 !important;
    }

[b-p0fttisjds] .forgot-input .mud-input-label {
    display: none !important;
}

[b-p0fttisjds] .forgot-input .mud-input-adornment {
    color: #7b86a5 !important;
}

[b-p0fttisjds] .forgot-input .mud-input-outlined-border {
    border-color: #d8ddea !important;
}

[b-p0fttisjds] .forgot-input:hover .mud-input-outlined-border {
    border-color: #c7d0e4 !important;
}


/* =========================================================
   8. BOTÓN PRINCIPAL
   ========================================================= */
[b-p0fttisjds] .forgot-button {
    height: 46px;
    border-radius: 7px;
    text-transform: none;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0;
    background: linear-gradient(90deg, #3d8cff 0%, #165ae5 100%) !important;
    box-shadow: 0 7px 18px rgba(27, 91, 224, 0.30) !important;
    color: #ffffff !important;
}

    [b-p0fttisjds] .forgot-button:hover {
        transform: translateY(-1px);
    }

    [b-p0fttisjds] .forgot-button .mud-progress-circular {
        color: #ffffff !important;
    }


/* =========================================================
   9. DIVISOR
   ========================================================= */
.forgot-divider[b-p0fttisjds] {
    margin-top: 2px;
    height: 1px;
    background: #e8ebf3;
}


/* =========================================================
   10. FOOTER
   ========================================================= */
.forgot-footer[b-p0fttisjds] {
    text-align: center;
    color: #4d587d;
    font-weight: 500;
    font-size: 0.92rem;
}

.forgot-link-primary[b-p0fttisjds] {
    color: #355fd0;
    font-weight: 700;
    text-decoration: none;
}

    .forgot-link-primary:hover[b-p0fttisjds] {
        text-decoration: underline;
    }


/* =========================================================
   11. RESPONSIVE
   ========================================================= */
@media (max-width: 600px) {
    .login-page[b-p0fttisjds] {
        padding: 18px 12px 24px 12px;
    }

    .login-container[b-p0fttisjds] {
        transform: translateY(-4px);
    }

    .login-logo img[b-p0fttisjds] {
        width: 235px;
    }

    .forgot-card-wrapper[b-p0fttisjds] {
        max-width: 100%;
    }

    [b-p0fttisjds] .forgot-card {
        padding: 24px 18px 18px 18px;
    }

    .forgot-header h1[b-p0fttisjds] {
        font-size: 1.75rem;
    }

    .forgot-header p[b-p0fttisjds] {
        font-size: 0.88rem;
    }

    .forgot-footer[b-p0fttisjds] {
        font-size: 0.9rem;
    }
}
/* /Pages/Blocks/BlockFormDialog.razor.rz.scp.css */
/* =========================================================
   BLOCK FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.blocks-dialog[b-ib715v06tz] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.blocks-dialog-header[b-ib715v06tz] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.blocks-dialog-icon[b-ib715v06tz] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .blocks-dialog-icon .mud-icon-root[b-ib715v06tz] {
        font-size: 38px;
    }

.blocks-dialog-title[b-ib715v06tz] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.blocks-dialog-subtitle[b-ib715v06tz] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.blocks-dialog-form[b-ib715v06tz] {
    padding-top: 12px;
}

.blocks-input .mud-input-outlined-border[b-ib715v06tz] {
    border-radius: 12px !important;
}

.blocks-input .mud-input-root[b-ib715v06tz] {
    min-height: 56px;
}

.blocks-input .mud-input-label[b-ib715v06tz] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.blocks-status-box[b-ib715v06tz] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.blocks-status-title[b-ib715v06tz] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.blocks-status-content[b-ib715v06tz] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.blocks-status-help[b-ib715v06tz] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.blocks-dialog-actions[b-ib715v06tz] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .blocks-dialog-actions .mud-button-root[b-ib715v06tz] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .blocks-dialog-header[b-ib715v06tz] {
        align-items: flex-start;
        gap: 14px;
    }

    .blocks-dialog-icon[b-ib715v06tz] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .blocks-dialog-icon .mud-icon-root[b-ib715v06tz] {
            font-size: 30px;
        }

    .blocks-dialog-actions[b-ib715v06tz] {
        flex-direction: column-reverse;
    }

        .blocks-dialog-actions .mud-button-root[b-ib715v06tz] {
            width: 100%;
        }
}
/* /Pages/Blocks/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA BLOCKS - LAYOUT GENERAL
   ========================================================= */

.blocks-page[b-xfukliju05] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.blocks-header[b-xfukliju05] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .blocks-header h1[b-xfukliju05] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .blocks-header p[b-xfukliju05] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-xfukliju05](.btn-new-blocks) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.blocks-summary-card[b-xfukliju05] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-xfukliju05] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-xfukliju05] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-xfukliju05] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-xfukliju05] {
        font-size: 31px;
    }

.summary-blue[b-xfukliju05] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-xfukliju05] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-xfukliju05] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-xfukliju05] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-xfukliju05] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-xfukliju05] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.blocks-toolbar[b-xfukliju05] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-xfukliju05] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-xfukliju05](.blocks-search),
[b-xfukliju05](.blocks-filter) {
    background: #ffffff !important;
}

[b-xfukliju05](.blocks-search .mud-input-outlined-border),
[b-xfukliju05](.blocks-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-xfukliju05](.blocks-search .mud-input-root),
[b-xfukliju05](.blocks-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-xfukliju05](.blocks-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-xfukliju05](.blocks-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-xfukliju05](.blocks-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.blocks-name-cell[b-xfukliju05] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-xfukliju05] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-xfukliju05] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-xfukliju05] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-xfukliju05] {
            background: #12b76a;
        }

    .status-pill.inactive[b-xfukliju05] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-xfukliju05] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.blocks-actions[b-xfukliju05] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-xfukliju05](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-xfukliju05](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-xfukliju05] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .blocks-summary-card[b-xfukliju05] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-xfukliju05] {
        display: none;
    }

    .blocks-toolbar[b-xfukliju05] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-xfukliju05] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/CatalogTimeZones/CatalogTimeZoneFormDialog.razor.rz.scp.css */
/* =========================================================
   CATALOGTIMEZONE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.catalogtimezones-dialog[b-shrmisv2y1] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.catalogtimezones-dialog-header[b-shrmisv2y1] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.catalogtimezones-dialog-icon[b-shrmisv2y1] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .catalogtimezones-dialog-icon .mud-icon-root[b-shrmisv2y1] {
        font-size: 38px;
    }

.catalogtimezones-dialog-title[b-shrmisv2y1] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.catalogtimezones-dialog-subtitle[b-shrmisv2y1] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.catalogtimezones-dialog-form[b-shrmisv2y1] {
    padding-top: 12px;
}

.catalogtimezones-input .mud-input-outlined-border[b-shrmisv2y1] {
    border-radius: 12px !important;
}

.catalogtimezones-input .mud-input-root[b-shrmisv2y1] {
    min-height: 56px;
}

.catalogtimezones-input .mud-input-label[b-shrmisv2y1] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.catalogtimezones-status-box[b-shrmisv2y1] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.catalogtimezones-status-title[b-shrmisv2y1] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.catalogtimezones-status-content[b-shrmisv2y1] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.catalogtimezones-status-help[b-shrmisv2y1] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.catalogtimezones-dialog-actions[b-shrmisv2y1] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .catalogtimezones-dialog-actions .mud-button-root[b-shrmisv2y1] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .catalogtimezones-dialog-header[b-shrmisv2y1] {
        align-items: flex-start;
        gap: 14px;
    }

    .catalogtimezones-dialog-icon[b-shrmisv2y1] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .catalogtimezones-dialog-icon .mud-icon-root[b-shrmisv2y1] {
            font-size: 30px;
        }

    .catalogtimezones-dialog-actions[b-shrmisv2y1] {
        flex-direction: column-reverse;
    }

        .catalogtimezones-dialog-actions .mud-button-root[b-shrmisv2y1] {
            width: 100%;
        }
}
/* /Pages/CatalogTimeZones/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA CATALOGTIMEZONES - LAYOUT GENERAL
   ========================================================= */

.catalogtimezones-page[b-g3cc49opos] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.catalogtimezones-header[b-g3cc49opos] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .catalogtimezones-header h1[b-g3cc49opos] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .catalogtimezones-header p[b-g3cc49opos] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-g3cc49opos](.btn-new-catalogtimezones) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.catalogtimezones-summary-card[b-g3cc49opos] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-g3cc49opos] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-g3cc49opos] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-g3cc49opos] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-g3cc49opos] {
        font-size: 31px;
    }

.summary-blue[b-g3cc49opos] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-g3cc49opos] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-g3cc49opos] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-g3cc49opos] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-g3cc49opos] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-g3cc49opos] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.catalogtimezones-toolbar[b-g3cc49opos] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-g3cc49opos] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-g3cc49opos](.catalogtimezones-search),
[b-g3cc49opos](.catalogtimezones-filter) {
    background: #ffffff !important;
}

[b-g3cc49opos](.catalogtimezones-search .mud-input-outlined-border),
[b-g3cc49opos](.catalogtimezones-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-g3cc49opos](.catalogtimezones-search .mud-input-root),
[b-g3cc49opos](.catalogtimezones-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-g3cc49opos](.catalogtimezones-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-g3cc49opos](.catalogtimezones-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-g3cc49opos](.catalogtimezones-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.catalogtimezones-name-cell[b-g3cc49opos] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-g3cc49opos] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-g3cc49opos] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-g3cc49opos] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-g3cc49opos] {
            background: #12b76a;
        }

    .status-pill.inactive[b-g3cc49opos] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-g3cc49opos] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.catalogtimezones-actions[b-g3cc49opos] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-g3cc49opos](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-g3cc49opos](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-g3cc49opos] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .catalogtimezones-summary-card[b-g3cc49opos] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-g3cc49opos] {
        display: none;
    }

    .catalogtimezones-toolbar[b-g3cc49opos] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-g3cc49opos] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Cities/CityFormDialog.razor.rz.scp.css */
/* =========================================================
   CITY FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.cities-dialog[b-qq6rals172] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.cities-dialog-header[b-qq6rals172] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.cities-dialog-icon[b-qq6rals172] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .cities-dialog-icon .mud-icon-root[b-qq6rals172] {
        font-size: 38px;
    }

.cities-dialog-title[b-qq6rals172] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.cities-dialog-subtitle[b-qq6rals172] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.cities-dialog-form[b-qq6rals172] {
    padding-top: 12px;
}

.cities-input .mud-input-outlined-border[b-qq6rals172] {
    border-radius: 12px !important;
}

.cities-input .mud-input-root[b-qq6rals172] {
    min-height: 56px;
}

.cities-input .mud-input-label[b-qq6rals172] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.cities-status-box[b-qq6rals172] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.cities-status-title[b-qq6rals172] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.cities-status-content[b-qq6rals172] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cities-status-help[b-qq6rals172] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.cities-dialog-actions[b-qq6rals172] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .cities-dialog-actions .mud-button-root[b-qq6rals172] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .cities-dialog-header[b-qq6rals172] {
        align-items: flex-start;
        gap: 14px;
    }

    .cities-dialog-icon[b-qq6rals172] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .cities-dialog-icon .mud-icon-root[b-qq6rals172] {
            font-size: 30px;
        }

    .cities-dialog-actions[b-qq6rals172] {
        flex-direction: column-reverse;
    }

        .cities-dialog-actions .mud-button-root[b-qq6rals172] {
            width: 100%;
        }
}
/* /Pages/Cities/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA CITIES - LAYOUT GENERAL
   ========================================================= */

.cities-page[b-i6b7z51kjh] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.cities-header[b-i6b7z51kjh] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .cities-header h1[b-i6b7z51kjh] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .cities-header p[b-i6b7z51kjh] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-i6b7z51kjh](.btn-new-cities) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.cities-summary-card[b-i6b7z51kjh] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-i6b7z51kjh] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-i6b7z51kjh] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-i6b7z51kjh] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-i6b7z51kjh] {
        font-size: 31px;
    }

.summary-blue[b-i6b7z51kjh] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-i6b7z51kjh] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-i6b7z51kjh] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-i6b7z51kjh] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-i6b7z51kjh] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-i6b7z51kjh] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.cities-toolbar[b-i6b7z51kjh] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-i6b7z51kjh] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-i6b7z51kjh](.cities-search),
[b-i6b7z51kjh](.cities-filter) {
    background: #ffffff !important;
}

[b-i6b7z51kjh](.cities-search .mud-input-outlined-border),
[b-i6b7z51kjh](.cities-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-i6b7z51kjh](.cities-search .mud-input-root),
[b-i6b7z51kjh](.cities-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-i6b7z51kjh](.cities-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-i6b7z51kjh](.cities-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-i6b7z51kjh](.cities-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.cities-name-cell[b-i6b7z51kjh] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-i6b7z51kjh] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-i6b7z51kjh] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-i6b7z51kjh] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-i6b7z51kjh] {
            background: #12b76a;
        }

    .status-pill.inactive[b-i6b7z51kjh] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-i6b7z51kjh] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.cities-actions[b-i6b7z51kjh] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-i6b7z51kjh](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-i6b7z51kjh](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-i6b7z51kjh] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .cities-summary-card[b-i6b7z51kjh] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-i6b7z51kjh] {
        display: none;
    }

    .cities-toolbar[b-i6b7z51kjh] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-i6b7z51kjh] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Countries/CountryFormDialog.razor.rz.scp.css */
/* =========================================================
   COUNTRY FORM DIALOG
   Diseño profesional para modal de creación/edición de país
   ========================================================= */

.country-dialog[b-cu6hvfg6kv] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.country-dialog-header[b-cu6hvfg6kv] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.country-dialog-icon[b-cu6hvfg6kv] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .country-dialog-icon .mud-icon-root[b-cu6hvfg6kv] {
        font-size: 38px;
    }

.country-dialog-title[b-cu6hvfg6kv] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.country-dialog-subtitle[b-cu6hvfg6kv] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.country-dialog-form[b-cu6hvfg6kv] {
    padding-top: 12px;
}

.country-input .mud-input-outlined-border[b-cu6hvfg6kv] {
    border-radius: 12px !important;
}

.country-input .mud-input-root[b-cu6hvfg6kv] {
    min-height: 56px;
}

.country-input .mud-input-label[b-cu6hvfg6kv] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.country-status-box[b-cu6hvfg6kv] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.country-status-title[b-cu6hvfg6kv] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.country-status-content[b-cu6hvfg6kv] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.country-status-help[b-cu6hvfg6kv] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.country-dialog-actions[b-cu6hvfg6kv] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .country-dialog-actions .mud-button-root[b-cu6hvfg6kv] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .country-dialog-header[b-cu6hvfg6kv] {
        align-items: flex-start;
        gap: 14px;
    }

    .country-dialog-icon[b-cu6hvfg6kv] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .country-dialog-icon .mud-icon-root[b-cu6hvfg6kv] {
            font-size: 30px;
        }

    .country-dialog-actions[b-cu6hvfg6kv] {
        flex-direction: column-reverse;
    }

        .country-dialog-actions .mud-button-root[b-cu6hvfg6kv] {
            width: 100%;
        }
}
/* /Pages/Countries/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA COUNTRIES - LAYOUT GENERAL
   ========================================================= */

.countries-page[b-9nhg2bhske] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.countries-header[b-9nhg2bhske] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .countries-header h1[b-9nhg2bhske] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .countries-header p[b-9nhg2bhske] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-9nhg2bhske](.btn-new-country) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.countries-summary-card[b-9nhg2bhske] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-9nhg2bhske] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-9nhg2bhske] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-9nhg2bhske] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-9nhg2bhske] {
        font-size: 31px;
    }

.summary-blue[b-9nhg2bhske] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-9nhg2bhske] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-9nhg2bhske] {
    background: #f2f4f7;
    color: #667085;
}

.summary-purple[b-9nhg2bhske] {
    background: #f2e8ff;
    color: #7f35ff;
}

.summary-item span[b-9nhg2bhske] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-9nhg2bhske] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-9nhg2bhske] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.countries-toolbar[b-9nhg2bhske] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-9nhg2bhske] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-9nhg2bhske](.countries-search),
[b-9nhg2bhske](.countries-filter) {
    background: #ffffff !important;
}

[b-9nhg2bhske](.countries-search .mud-input-outlined-border),
[b-9nhg2bhske](.countries-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-9nhg2bhske](.countries-search .mud-input-root),
[b-9nhg2bhske](.countries-filter .mud-input-root) {
    height: 46px !important;
}

[b-9nhg2bhske](.countries-filter) {
    width: 220px !important;
}

[b-9nhg2bhske](.toolbar-button) {
    height: 46px !important;
    min-width: 128px !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #193963 !important;
    font-weight: 800 !important;
    text-transform: none !important;
    border: 1px solid #dce5f0 !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-9nhg2bhske](.countries-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-9nhg2bhske](.countries-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-9nhg2bhske](.countries-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.country-name-cell[b-9nhg2bhske] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   BANDERAS
   ========================================================= */

.country-flag-image[b-9nhg2bhske] {
    width: 28px;
    height: 20px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #d8e1ee;
    box-shadow: 0 2px 6px rgba(15, 35, 75, .10);
    flex-shrink: 0;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-9nhg2bhske] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-9nhg2bhske] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-9nhg2bhske] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-9nhg2bhske] {
            background: #12b76a;
        }

    .status-pill.inactive[b-9nhg2bhske] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-9nhg2bhske] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.country-actions[b-9nhg2bhske] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-9nhg2bhske](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-9nhg2bhske](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-9nhg2bhske] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .countries-summary-card[b-9nhg2bhske] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-9nhg2bhske] {
        display: none;
    }

    .countries-toolbar[b-9nhg2bhske] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-9nhg2bhske] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Currencies/CurrencyFormDialog.razor.rz.scp.css */
/* =========================================================
   CURRENCY FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.currencies-dialog[b-dfi9vwqk68] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.currencies-dialog-header[b-dfi9vwqk68] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.currencies-dialog-icon[b-dfi9vwqk68] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .currencies-dialog-icon .mud-icon-root[b-dfi9vwqk68] {
        font-size: 38px;
    }

.currencies-dialog-title[b-dfi9vwqk68] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.currencies-dialog-subtitle[b-dfi9vwqk68] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.currencies-dialog-form[b-dfi9vwqk68] {
    padding-top: 12px;
}

.currencies-input .mud-input-outlined-border[b-dfi9vwqk68] {
    border-radius: 12px !important;
}

.currencies-input .mud-input-root[b-dfi9vwqk68] {
    min-height: 56px;
}

.currencies-input .mud-input-label[b-dfi9vwqk68] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.currencies-status-box[b-dfi9vwqk68] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.currencies-status-title[b-dfi9vwqk68] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.currencies-status-content[b-dfi9vwqk68] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.currencies-status-help[b-dfi9vwqk68] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.currencies-dialog-actions[b-dfi9vwqk68] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .currencies-dialog-actions .mud-button-root[b-dfi9vwqk68] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .currencies-dialog-header[b-dfi9vwqk68] {
        align-items: flex-start;
        gap: 14px;
    }

    .currencies-dialog-icon[b-dfi9vwqk68] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .currencies-dialog-icon .mud-icon-root[b-dfi9vwqk68] {
            font-size: 30px;
        }

    .currencies-dialog-actions[b-dfi9vwqk68] {
        flex-direction: column-reverse;
    }

        .currencies-dialog-actions .mud-button-root[b-dfi9vwqk68] {
            width: 100%;
        }
}
/* /Pages/Currencies/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA CURRENCIES - LAYOUT GENERAL
   Esta página usa componentes reutilizables para:
   - Encabezado
   - Resumen
   - Toolbar
   - Badge de estado
   - Menú de acciones por fila
   ========================================================= */

.currencies-page[b-9nhh2mkm3b] {
    min-height: calc(100vh - 56px);
    padding: 28px 32px;
    background: #f3f7fc;
}

/* =========================================================
   TABLA ESPECÍFICA DEL MAESTRO
   La tabla NO se vuelve genérica para permitir columnas propias
   por cada CRUD maestro.
   ========================================================= */

[b-9nhh2mkm3b](.currencies-table-container) {
    margin-top: 0;
    background: #ffffff !important;
    border: 1px solid #dfe7f1 !important;
    border-radius: 14px !important;
    overflow: visible !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-9nhh2mkm3b](.currencies-table) {
    overflow: visible !important;
}

[b-9nhh2mkm3b](.currencies-table .mud-table-container) {
    overflow: visible !important;
}

[b-9nhh2mkm3b](.currencies-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: .02em;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-9nhh2mkm3b](.currencies-table td) {
    height: 64px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.currencies-name-cell[b-9nhh2mkm3b] {
    display: flex;
    align-items: center;
    gap: 13px;
    color: #082b63;
    font-weight: 900;
}

.text-center[b-9nhh2mkm3b] {
    text-align: center !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-9nhh2mkm3b] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 900px) {
    .currencies-page[b-9nhh2mkm3b] {
        padding: 20px 16px;
    }
}
/* /Pages/Dashboard.razor.rz.scp.css */
/* ==========================================
   DASHBOARD RESPONSIVE LAYOUT
   ========================================== */

.dashboard-page[b-56270asfjj] {
    width: 100%;
    min-height: 100%;
    background: var(--gray-50, #f1f4f9);
}

.dashboard-container[b-56270asfjj] {
    width: 100%;
    max-width: 100%;
    padding: 1.5rem 2rem;
    min-height: calc(100vh - 68px);
    color: #1e3a5f;
    box-sizing: border-box;
}

.panel-surface[b-56270asfjj],
.stat-card[b-56270asfjj],
.activity-panel[b-56270asfjj],
.system-info-section[b-56270asfjj] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

/* Hero Section */
.hero-section[b-56270asfjj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.6rem;
    gap: 1rem;
}

.hero-content h1[b-56270asfjj] {
    margin: 0;
    font-size: 2.05rem;
    line-height: 1.2;
    font-weight: 700;
    color: #1e3a5f;
}

.hero-content p[b-56270asfjj] {
    margin: 0.5rem 0 0;
    color: #64748b;
    font-size: 1rem;
}

.hero-date[b-56270asfjj] {
    text-align: right;
    display: flex;
    align-items: flex-start;
    gap: .7rem;
}

.hero-date strong[b-56270asfjj] {
    display: block;
}

.hero-date span[b-56270asfjj] {
    color: #64748b;
    font-size: .92rem;
}

/* Stats Grid - 4 columnas en desktop */
.stats-section[b-56270asfjj] {
    margin-bottom: 1.8rem;
}

.stats-grid[b-56270asfjj] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
}

.stat-card[b-56270asfjj] {
    padding: 1rem;
}

.stat-card-head[b-56270asfjj] {
    display: flex;
    gap: .8rem;
}

.stat-card-icon[b-56270asfjj] {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
}

.stat-card h4[b-56270asfjj] {
    margin: 0;
    font-size: .82rem;
    color: #64748b;
}

.stat-card h3[b-56270asfjj] {
    margin: .2rem 0;
    font-size: 2rem;
    line-height: 1;
}

.stat-card p[b-56270asfjj] {
    margin: 0;
    color: #16a34a;
    font-size: .9rem;
    display: inline-flex;
    align-items: center;
    gap: .2rem;
}

.stat-card > a[b-56270asfjj] {
    margin-top: .85rem;
    display: flex;
    justify-content: center;
    text-decoration: none;
    color: #64748b;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: .55rem;
    font-weight: 600;
}

/* Main Content: Config + Activity */
.content-sections[b-56270asfjj] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 400px;
    gap: 1.5rem;
    margin-bottom: 1.8rem;
    align-items: start;
}

/* Configuration Section */
.configuration-section[b-56270asfjj] {
    padding: 1rem;
}

.configuration-section h2[b-56270asfjj] {
    margin: 0 0 1rem;
    font-size: 2rem;
    font-weight: 600;
}

.config-grid[b-56270asfjj] {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.config-card[b-56270asfjj] {
    text-decoration: none;
    color: inherit;
    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .8rem;
    align-items: center;
    padding: 1rem;
}

.config-card:nth-child(2n)[b-56270asfjj] {
    border-right: none;
}

.config-card:nth-last-child(-n+2)[b-56270asfjj] {
    border-bottom: none;
}

.config-card-icon[b-56270asfjj] {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    display: grid;
    place-items: center;
}

.config-card h4[b-56270asfjj] {
    margin: 0 0 .2rem;
    font-size: 1.5rem;
}

.config-card p[b-56270asfjj] {
    margin: 0;
    color: #64748b;
    font-size: .9rem;
}

/* Activity Panel */
.activity-panel[b-56270asfjj] {
    padding: 1.1rem;
    width: 100%;
    height: fit-content;
    max-height: calc(100vh - 160px);
    overflow-y: auto;
    position: sticky;
    top: 84px;
}

.activity-header[b-56270asfjj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .8rem;
}

.activity-header h2[b-56270asfjj] {
    margin: 0;
    font-size: 2rem;
    line-height: 1.05;
}

.activity-header a[b-56270asfjj] {
    text-decoration: none;
    color: #2563eb;
    font-weight: 600;
}

.activity-item[b-56270asfjj] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .7rem;
    align-items: center;
    padding: .65rem 0;
    border-bottom: 1px solid #eef2f7;
}

.activity-item:last-child[b-56270asfjj] {
    border-bottom: none;
}

.activity-item h5[b-56270asfjj] {
    margin: 0;
    font-size: .95rem;
}

.activity-item p[b-56270asfjj] {
    margin: 0;
    color: #64748b;
    font-size: .9rem;
}

.activity-item span[b-56270asfjj] {
    color: #64748b;
    font-size: .86rem;
}

.activity-icon[b-56270asfjj] {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    display: grid;
    place-items: center;
}

.history-link[b-56270asfjj] {
    margin-top: .8rem;
    text-decoration: none;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: .6rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .4rem;
    color: #64748b;
    font-weight: 600;
}

/* System Info Footer */
.system-info-section[b-56270asfjj] {
    padding: 1rem;
}

.system-info-section h2[b-56270asfjj] {
    margin: 0 0 1rem;
    font-size: 2rem;
}

.system-metrics[b-56270asfjj] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

.system-metric-item[b-56270asfjj] {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
    border-right: 1px solid #e5e7eb;
    padding-right: .8rem;
}

.system-metric-item:last-child[b-56270asfjj] {
    border-right: none;
}

.system-metric-item span[b-56270asfjj] {
    color: #64748b;
    font-size: .86rem;
    display: block;
}

.system-metric-item strong[b-56270asfjj] {
    font-size: 1.1rem;
    color: #334155;
}

.system-metric-item strong i[b-56270asfjj] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #16a34a;
    margin-right: .4rem;
}

.storage-row[b-56270asfjj] {
    display: flex;
    align-items: center;
    gap: .4rem;
}

.storage-track[b-56270asfjj] {
    width: 120px;
    height: 7px;
    border-radius: 999px;
    background: #e5e7eb;
    overflow: hidden;
}

.storage-fill[b-56270asfjj] {
    width: 12.5%;
    height: 100%;
    background: #16a34a;
}

.dashboard-footer[b-56270asfjj] {
    margin: .8rem 0 .2rem;
    display: flex;
    justify-content: space-between;
    color: #64748b;
}

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

/* Tablet: 768px - 1200px */
@media (max-width: 1200px) {
    .stats-grid[b-56270asfjj] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .content-sections[b-56270asfjj] {
        grid-template-columns: 1fr;
    }

    .activity-panel[b-56270asfjj] {
        position: static;
        max-height: 600px;
    }

    .system-metrics[b-56270asfjj] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1rem;
    }

    .system-metric-item[b-56270asfjj] {
        border-right: none;
        border-bottom: 1px solid #e5e7eb;
        padding-bottom: .6rem;
    }

    .system-metric-item:nth-last-child(-n+2)[b-56270asfjj] {
        border-bottom: none;
    }
}

/* Mobile: <768px */
@media (max-width: 768px) {
    .dashboard-container[b-56270asfjj] {
        padding: 1rem;
    }

    .hero-section[b-56270asfjj] {
        flex-direction: column;
        gap: 1rem;
    }

    .hero-date[b-56270asfjj] {
        text-align: left;
    }

    .stats-grid[b-56270asfjj] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .config-grid[b-56270asfjj] {
        grid-template-columns: 1fr;
    }

    .config-card[b-56270asfjj] {
        border-right: none;
    }

    .config-card:nth-last-child(-n+2)[b-56270asfjj] {
        border-bottom: 1px solid #e5e7eb;
    }

    .config-card:last-child[b-56270asfjj] {
        border-bottom: none;
    }

    .activity-panel[b-56270asfjj] {
        width: 100%;
        max-height: none;
        overflow: visible;
    }

    .system-metrics[b-56270asfjj] {
        grid-template-columns: 1fr;
        gap: .75rem;
    }

    .system-metric-item[b-56270asfjj] {
        border-bottom: 1px solid #e5e7eb;
    }

    .system-metric-item:last-child[b-56270asfjj] {
        border-bottom: none;
    }

    .dashboard-footer[b-56270asfjj] {
        flex-direction: column;
        gap: .3rem;
    }
}

/* Small Mobile: <480px */
@media (max-width: 480px) {
    .dashboard-container[b-56270asfjj] {
        padding: 0.75rem;
    }

    .hero-content h1[b-56270asfjj] {
        font-size: 1.5rem;
    }

    .configuration-section h2[b-56270asfjj],
    .activity-header h2[b-56270asfjj],
    .system-info-section h2[b-56270asfjj] {
        font-size: 1.6rem;
    }
}
/* /Pages/DocumentTypes/DocumentTypeFormDialog.razor.rz.scp.css */
/* =========================================================
   DOCUMENTTYPE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.documenttypes-dialog[b-ymqosxt88s] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.documenttypes-dialog-header[b-ymqosxt88s] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.documenttypes-dialog-icon[b-ymqosxt88s] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .documenttypes-dialog-icon .mud-icon-root[b-ymqosxt88s] {
        font-size: 38px;
    }

.documenttypes-dialog-title[b-ymqosxt88s] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.documenttypes-dialog-subtitle[b-ymqosxt88s] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.documenttypes-dialog-form[b-ymqosxt88s] {
    padding-top: 12px;
}

.documenttypes-input .mud-input-outlined-border[b-ymqosxt88s] {
    border-radius: 12px !important;
}

.documenttypes-input .mud-input-root[b-ymqosxt88s] {
    min-height: 56px;
}

.documenttypes-input .mud-input-label[b-ymqosxt88s] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.documenttypes-status-box[b-ymqosxt88s] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.documenttypes-status-title[b-ymqosxt88s] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.documenttypes-status-content[b-ymqosxt88s] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.documenttypes-status-help[b-ymqosxt88s] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.documenttypes-dialog-actions[b-ymqosxt88s] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .documenttypes-dialog-actions .mud-button-root[b-ymqosxt88s] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .documenttypes-dialog-header[b-ymqosxt88s] {
        align-items: flex-start;
        gap: 14px;
    }

    .documenttypes-dialog-icon[b-ymqosxt88s] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .documenttypes-dialog-icon .mud-icon-root[b-ymqosxt88s] {
            font-size: 30px;
        }

    .documenttypes-dialog-actions[b-ymqosxt88s] {
        flex-direction: column-reverse;
    }

        .documenttypes-dialog-actions .mud-button-root[b-ymqosxt88s] {
            width: 100%;
        }
}
/* /Pages/DocumentTypes/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA DOCUMENTTYPES - LAYOUT GENERAL
   ========================================================= */

.documenttypes-page[b-lo8oh9sckv] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.documenttypes-header[b-lo8oh9sckv] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .documenttypes-header h1[b-lo8oh9sckv] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .documenttypes-header p[b-lo8oh9sckv] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-lo8oh9sckv](.btn-new-documenttypes) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.documenttypes-summary-card[b-lo8oh9sckv] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-lo8oh9sckv] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-lo8oh9sckv] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-lo8oh9sckv] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-lo8oh9sckv] {
        font-size: 31px;
    }

.summary-blue[b-lo8oh9sckv] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-lo8oh9sckv] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-lo8oh9sckv] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-lo8oh9sckv] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-lo8oh9sckv] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-lo8oh9sckv] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.documenttypes-toolbar[b-lo8oh9sckv] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-lo8oh9sckv] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-lo8oh9sckv](.documenttypes-search),
[b-lo8oh9sckv](.documenttypes-filter) {
    background: #ffffff !important;
}

[b-lo8oh9sckv](.documenttypes-search .mud-input-outlined-border),
[b-lo8oh9sckv](.documenttypes-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-lo8oh9sckv](.documenttypes-search .mud-input-root),
[b-lo8oh9sckv](.documenttypes-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-lo8oh9sckv](.documenttypes-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-lo8oh9sckv](.documenttypes-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-lo8oh9sckv](.documenttypes-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.documenttypes-name-cell[b-lo8oh9sckv] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-lo8oh9sckv] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-lo8oh9sckv] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-lo8oh9sckv] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-lo8oh9sckv] {
            background: #12b76a;
        }

    .status-pill.inactive[b-lo8oh9sckv] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-lo8oh9sckv] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.documenttypes-actions[b-lo8oh9sckv] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-lo8oh9sckv](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-lo8oh9sckv](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-lo8oh9sckv] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .documenttypes-summary-card[b-lo8oh9sckv] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-lo8oh9sckv] {
        display: none;
    }

    .documenttypes-toolbar[b-lo8oh9sckv] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-lo8oh9sckv] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/FileTypes/FileTypeFormDialog.razor.rz.scp.css */
/* =========================================================
   FILETYPE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.filetypes-dialog[b-w4lfjz8xzr] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.filetypes-dialog-header[b-w4lfjz8xzr] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.filetypes-dialog-icon[b-w4lfjz8xzr] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .filetypes-dialog-icon .mud-icon-root[b-w4lfjz8xzr] {
        font-size: 38px;
    }

.filetypes-dialog-title[b-w4lfjz8xzr] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.filetypes-dialog-subtitle[b-w4lfjz8xzr] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.filetypes-dialog-form[b-w4lfjz8xzr] {
    padding-top: 12px;
}

.filetypes-input .mud-input-outlined-border[b-w4lfjz8xzr] {
    border-radius: 12px !important;
}

.filetypes-input .mud-input-root[b-w4lfjz8xzr] {
    min-height: 56px;
}

.filetypes-input .mud-input-label[b-w4lfjz8xzr] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.filetypes-status-box[b-w4lfjz8xzr] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.filetypes-status-title[b-w4lfjz8xzr] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.filetypes-status-content[b-w4lfjz8xzr] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.filetypes-status-help[b-w4lfjz8xzr] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.filetypes-dialog-actions[b-w4lfjz8xzr] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .filetypes-dialog-actions .mud-button-root[b-w4lfjz8xzr] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .filetypes-dialog-header[b-w4lfjz8xzr] {
        align-items: flex-start;
        gap: 14px;
    }

    .filetypes-dialog-icon[b-w4lfjz8xzr] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .filetypes-dialog-icon .mud-icon-root[b-w4lfjz8xzr] {
            font-size: 30px;
        }

    .filetypes-dialog-actions[b-w4lfjz8xzr] {
        flex-direction: column-reverse;
    }

        .filetypes-dialog-actions .mud-button-root[b-w4lfjz8xzr] {
            width: 100%;
        }
}
/* /Pages/FileTypes/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA FILETYPES - LAYOUT GENERAL
   ========================================================= */

.filetypes-page[b-altx8yiywx] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.filetypes-header[b-altx8yiywx] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .filetypes-header h1[b-altx8yiywx] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .filetypes-header p[b-altx8yiywx] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-altx8yiywx](.btn-new-filetypes) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.filetypes-summary-card[b-altx8yiywx] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-altx8yiywx] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-altx8yiywx] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-altx8yiywx] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-altx8yiywx] {
        font-size: 31px;
    }

.summary-blue[b-altx8yiywx] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-altx8yiywx] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-altx8yiywx] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-altx8yiywx] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-altx8yiywx] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-altx8yiywx] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.filetypes-toolbar[b-altx8yiywx] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-altx8yiywx] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-altx8yiywx](.filetypes-search),
[b-altx8yiywx](.filetypes-filter) {
    background: #ffffff !important;
}

[b-altx8yiywx](.filetypes-search .mud-input-outlined-border),
[b-altx8yiywx](.filetypes-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-altx8yiywx](.filetypes-search .mud-input-root),
[b-altx8yiywx](.filetypes-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-altx8yiywx](.filetypes-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-altx8yiywx](.filetypes-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-altx8yiywx](.filetypes-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.filetypes-name-cell[b-altx8yiywx] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-altx8yiywx] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-altx8yiywx] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-altx8yiywx] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-altx8yiywx] {
            background: #12b76a;
        }

    .status-pill.inactive[b-altx8yiywx] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-altx8yiywx] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.filetypes-actions[b-altx8yiywx] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-altx8yiywx](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-altx8yiywx](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-altx8yiywx] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .filetypes-summary-card[b-altx8yiywx] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-altx8yiywx] {
        display: none;
    }

    .filetypes-toolbar[b-altx8yiywx] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-altx8yiywx] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Home.razor.rz.scp.css */
/* =========================================================
   HOME ROUTER
   Página técnica de redirección por rol
   ========================================================= */

.home-router[b-n3h2epob6r] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f4f7fb;
    color: #0d1b3d;
    font-weight: 700;
}
/* /Pages/InvoiceConcepts/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA INVOICECONCEPTS - LAYOUT GENERAL
   ========================================================= */

.invoiceconcepts-page[b-68bjhtvwpf] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.invoiceconcepts-header[b-68bjhtvwpf] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .invoiceconcepts-header h1[b-68bjhtvwpf] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .invoiceconcepts-header p[b-68bjhtvwpf] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-68bjhtvwpf](.btn-new-invoiceconcepts) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.invoiceconcepts-summary-card[b-68bjhtvwpf] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-68bjhtvwpf] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-68bjhtvwpf] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-68bjhtvwpf] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-68bjhtvwpf] {
        font-size: 31px;
    }

.summary-blue[b-68bjhtvwpf] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-68bjhtvwpf] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-68bjhtvwpf] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-68bjhtvwpf] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-68bjhtvwpf] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-68bjhtvwpf] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.invoiceconcepts-toolbar[b-68bjhtvwpf] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-68bjhtvwpf] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-68bjhtvwpf](.invoiceconcepts-search),
[b-68bjhtvwpf](.invoiceconcepts-filter) {
    background: #ffffff !important;
}

[b-68bjhtvwpf](.invoiceconcepts-search .mud-input-outlined-border),
[b-68bjhtvwpf](.invoiceconcepts-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-68bjhtvwpf](.invoiceconcepts-search .mud-input-root),
[b-68bjhtvwpf](.invoiceconcepts-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-68bjhtvwpf](.invoiceconcepts-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-68bjhtvwpf](.invoiceconcepts-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-68bjhtvwpf](.invoiceconcepts-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.invoiceconcepts-name-cell[b-68bjhtvwpf] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-68bjhtvwpf] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-68bjhtvwpf] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-68bjhtvwpf] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-68bjhtvwpf] {
            background: #12b76a;
        }

    .status-pill.inactive[b-68bjhtvwpf] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-68bjhtvwpf] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.invoiceconcepts-actions[b-68bjhtvwpf] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-68bjhtvwpf](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-68bjhtvwpf](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-68bjhtvwpf] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .invoiceconcepts-summary-card[b-68bjhtvwpf] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-68bjhtvwpf] {
        display: none;
    }

    .invoiceconcepts-toolbar[b-68bjhtvwpf] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-68bjhtvwpf] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/InvoiceConcepts/InvoiceConceptFormDialog.razor.rz.scp.css */
/* =========================================================
   INVOICECONCEPT FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.invoiceconcepts-dialog[b-kryifeahky] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.invoiceconcepts-dialog-header[b-kryifeahky] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.invoiceconcepts-dialog-icon[b-kryifeahky] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .invoiceconcepts-dialog-icon .mud-icon-root[b-kryifeahky] {
        font-size: 38px;
    }

.invoiceconcepts-dialog-title[b-kryifeahky] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.invoiceconcepts-dialog-subtitle[b-kryifeahky] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.invoiceconcepts-dialog-form[b-kryifeahky] {
    padding-top: 12px;
}

.invoiceconcepts-input .mud-input-outlined-border[b-kryifeahky] {
    border-radius: 12px !important;
}

.invoiceconcepts-input .mud-input-root[b-kryifeahky] {
    min-height: 56px;
}

.invoiceconcepts-input .mud-input-label[b-kryifeahky] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.invoiceconcepts-status-box[b-kryifeahky] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.invoiceconcepts-status-title[b-kryifeahky] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.invoiceconcepts-status-content[b-kryifeahky] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.invoiceconcepts-status-help[b-kryifeahky] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.invoiceconcepts-dialog-actions[b-kryifeahky] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .invoiceconcepts-dialog-actions .mud-button-root[b-kryifeahky] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .invoiceconcepts-dialog-header[b-kryifeahky] {
        align-items: flex-start;
        gap: 14px;
    }

    .invoiceconcepts-dialog-icon[b-kryifeahky] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .invoiceconcepts-dialog-icon .mud-icon-root[b-kryifeahky] {
            font-size: 30px;
        }

    .invoiceconcepts-dialog-actions[b-kryifeahky] {
        flex-direction: column-reverse;
    }

        .invoiceconcepts-dialog-actions .mud-button-root[b-kryifeahky] {
            width: 100%;
        }
}
/* /Pages/Languages/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA LANGUAGES - LAYOUT GENERAL
   ========================================================= */

.languages-page[b-hp3gjbt6vs] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.languages-header[b-hp3gjbt6vs] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .languages-header h1[b-hp3gjbt6vs] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .languages-header p[b-hp3gjbt6vs] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-hp3gjbt6vs](.btn-new-languages) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.languages-summary-card[b-hp3gjbt6vs] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-hp3gjbt6vs] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-hp3gjbt6vs] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-hp3gjbt6vs] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-hp3gjbt6vs] {
        font-size: 31px;
    }

.summary-blue[b-hp3gjbt6vs] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-hp3gjbt6vs] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-hp3gjbt6vs] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-hp3gjbt6vs] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-hp3gjbt6vs] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-hp3gjbt6vs] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.languages-toolbar[b-hp3gjbt6vs] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-hp3gjbt6vs] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-hp3gjbt6vs](.languages-search),
[b-hp3gjbt6vs](.languages-filter) {
    background: #ffffff !important;
}

[b-hp3gjbt6vs](.languages-search .mud-input-outlined-border),
[b-hp3gjbt6vs](.languages-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-hp3gjbt6vs](.languages-search .mud-input-root),
[b-hp3gjbt6vs](.languages-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-hp3gjbt6vs](.languages-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-hp3gjbt6vs](.languages-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-hp3gjbt6vs](.languages-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.languages-name-cell[b-hp3gjbt6vs] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-hp3gjbt6vs] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-hp3gjbt6vs] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-hp3gjbt6vs] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-hp3gjbt6vs] {
            background: #12b76a;
        }

    .status-pill.inactive[b-hp3gjbt6vs] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-hp3gjbt6vs] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.languages-actions[b-hp3gjbt6vs] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-hp3gjbt6vs](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-hp3gjbt6vs](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-hp3gjbt6vs] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .languages-summary-card[b-hp3gjbt6vs] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-hp3gjbt6vs] {
        display: none;
    }

    .languages-toolbar[b-hp3gjbt6vs] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-hp3gjbt6vs] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Languages/LanguageFormDialog.razor.rz.scp.css */
/* =========================================================
   LANGUAGE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.languages-dialog[b-4ioel6y9ps] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.languages-dialog-header[b-4ioel6y9ps] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.languages-dialog-icon[b-4ioel6y9ps] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .languages-dialog-icon .mud-icon-root[b-4ioel6y9ps] {
        font-size: 38px;
    }

.languages-dialog-title[b-4ioel6y9ps] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.languages-dialog-subtitle[b-4ioel6y9ps] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.languages-dialog-form[b-4ioel6y9ps] {
    padding-top: 12px;
}

.languages-input .mud-input-outlined-border[b-4ioel6y9ps] {
    border-radius: 12px !important;
}

.languages-input .mud-input-root[b-4ioel6y9ps] {
    min-height: 56px;
}

.languages-input .mud-input-label[b-4ioel6y9ps] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.languages-status-box[b-4ioel6y9ps] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.languages-status-title[b-4ioel6y9ps] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.languages-status-content[b-4ioel6y9ps] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.languages-status-help[b-4ioel6y9ps] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.languages-dialog-actions[b-4ioel6y9ps] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .languages-dialog-actions .mud-button-root[b-4ioel6y9ps] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .languages-dialog-header[b-4ioel6y9ps] {
        align-items: flex-start;
        gap: 14px;
    }

    .languages-dialog-icon[b-4ioel6y9ps] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .languages-dialog-icon .mud-icon-root[b-4ioel6y9ps] {
            font-size: 30px;
        }

    .languages-dialog-actions[b-4ioel6y9ps] {
        flex-direction: column-reverse;
    }

        .languages-dialog-actions .mud-button-root[b-4ioel6y9ps] {
            width: 100%;
        }
}
/* /Pages/Modules/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA MODULES - LAYOUT GENERAL
   ========================================================= */

.modules-page[b-xctu27qbzq] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.modules-header[b-xctu27qbzq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .modules-header h1[b-xctu27qbzq] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .modules-header p[b-xctu27qbzq] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-xctu27qbzq](.btn-new-modules) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.modules-summary-card[b-xctu27qbzq] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-xctu27qbzq] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-xctu27qbzq] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-xctu27qbzq] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-xctu27qbzq] {
        font-size: 31px;
    }

.summary-blue[b-xctu27qbzq] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-xctu27qbzq] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-xctu27qbzq] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-xctu27qbzq] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-xctu27qbzq] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-xctu27qbzq] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.modules-toolbar[b-xctu27qbzq] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-xctu27qbzq] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-xctu27qbzq](.modules-search),
[b-xctu27qbzq](.modules-filter) {
    background: #ffffff !important;
}

[b-xctu27qbzq](.modules-search .mud-input-outlined-border),
[b-xctu27qbzq](.modules-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-xctu27qbzq](.modules-search .mud-input-root),
[b-xctu27qbzq](.modules-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-xctu27qbzq](.modules-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-xctu27qbzq](.modules-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-xctu27qbzq](.modules-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.modules-name-cell[b-xctu27qbzq] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-xctu27qbzq] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-xctu27qbzq] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-xctu27qbzq] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-xctu27qbzq] {
            background: #12b76a;
        }

    .status-pill.inactive[b-xctu27qbzq] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-xctu27qbzq] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.modules-actions[b-xctu27qbzq] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-xctu27qbzq](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-xctu27qbzq](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-xctu27qbzq] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .modules-summary-card[b-xctu27qbzq] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-xctu27qbzq] {
        display: none;
    }

    .modules-toolbar[b-xctu27qbzq] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-xctu27qbzq] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Modules/ModuleFormDialog.razor.rz.scp.css */
/* =========================================================
   MODULE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.modules-dialog[b-4uju07qa5c] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.modules-dialog-header[b-4uju07qa5c] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.modules-dialog-icon[b-4uju07qa5c] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .modules-dialog-icon .mud-icon-root[b-4uju07qa5c] {
        font-size: 38px;
    }

.modules-dialog-title[b-4uju07qa5c] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.modules-dialog-subtitle[b-4uju07qa5c] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.modules-dialog-form[b-4uju07qa5c] {
    padding-top: 12px;
}

.modules-input .mud-input-outlined-border[b-4uju07qa5c] {
    border-radius: 12px !important;
}

.modules-input .mud-input-root[b-4uju07qa5c] {
    min-height: 56px;
}

.modules-input .mud-input-label[b-4uju07qa5c] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.modules-status-box[b-4uju07qa5c] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.modules-status-title[b-4uju07qa5c] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.modules-status-content[b-4uju07qa5c] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modules-status-help[b-4uju07qa5c] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.modules-dialog-actions[b-4uju07qa5c] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .modules-dialog-actions .mud-button-root[b-4uju07qa5c] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .modules-dialog-header[b-4uju07qa5c] {
        align-items: flex-start;
        gap: 14px;
    }

    .modules-dialog-icon[b-4uju07qa5c] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .modules-dialog-icon .mud-icon-root[b-4uju07qa5c] {
            font-size: 30px;
        }

    .modules-dialog-actions[b-4uju07qa5c] {
        flex-direction: column-reverse;
    }

        .modules-dialog-actions .mud-button-root[b-4uju07qa5c] {
            width: 100%;
        }
}
/* /Pages/NotificationChannels/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA NOTIFICATIONCHANNELS - LAYOUT GENERAL
   ========================================================= */

.notificationchannels-page[b-mesvh4grt0] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.notificationchannels-header[b-mesvh4grt0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .notificationchannels-header h1[b-mesvh4grt0] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .notificationchannels-header p[b-mesvh4grt0] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-mesvh4grt0](.btn-new-notificationchannels) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.notificationchannels-summary-card[b-mesvh4grt0] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-mesvh4grt0] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-mesvh4grt0] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-mesvh4grt0] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-mesvh4grt0] {
        font-size: 31px;
    }

.summary-blue[b-mesvh4grt0] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-mesvh4grt0] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-mesvh4grt0] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-mesvh4grt0] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-mesvh4grt0] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-mesvh4grt0] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.notificationchannels-toolbar[b-mesvh4grt0] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-mesvh4grt0] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-mesvh4grt0](.notificationchannels-search),
[b-mesvh4grt0](.notificationchannels-filter) {
    background: #ffffff !important;
}

[b-mesvh4grt0](.notificationchannels-search .mud-input-outlined-border),
[b-mesvh4grt0](.notificationchannels-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-mesvh4grt0](.notificationchannels-search .mud-input-root),
[b-mesvh4grt0](.notificationchannels-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-mesvh4grt0](.notificationchannels-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-mesvh4grt0](.notificationchannels-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-mesvh4grt0](.notificationchannels-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.notificationchannels-name-cell[b-mesvh4grt0] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-mesvh4grt0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-mesvh4grt0] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-mesvh4grt0] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-mesvh4grt0] {
            background: #12b76a;
        }

    .status-pill.inactive[b-mesvh4grt0] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-mesvh4grt0] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.notificationchannels-actions[b-mesvh4grt0] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-mesvh4grt0](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-mesvh4grt0](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-mesvh4grt0] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .notificationchannels-summary-card[b-mesvh4grt0] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-mesvh4grt0] {
        display: none;
    }

    .notificationchannels-toolbar[b-mesvh4grt0] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-mesvh4grt0] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/NotificationChannels/NotificationChannelFormDialog.razor.rz.scp.css */
/* =========================================================
   NOTIFICATIONCHANNEL FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.notificationchannels-dialog[b-cm7vfr58gg] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.notificationchannels-dialog-header[b-cm7vfr58gg] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.notificationchannels-dialog-icon[b-cm7vfr58gg] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .notificationchannels-dialog-icon .mud-icon-root[b-cm7vfr58gg] {
        font-size: 38px;
    }

.notificationchannels-dialog-title[b-cm7vfr58gg] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.notificationchannels-dialog-subtitle[b-cm7vfr58gg] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.notificationchannels-dialog-form[b-cm7vfr58gg] {
    padding-top: 12px;
}

.notificationchannels-input .mud-input-outlined-border[b-cm7vfr58gg] {
    border-radius: 12px !important;
}

.notificationchannels-input .mud-input-root[b-cm7vfr58gg] {
    min-height: 56px;
}

.notificationchannels-input .mud-input-label[b-cm7vfr58gg] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.notificationchannels-status-box[b-cm7vfr58gg] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.notificationchannels-status-title[b-cm7vfr58gg] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.notificationchannels-status-content[b-cm7vfr58gg] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.notificationchannels-status-help[b-cm7vfr58gg] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.notificationchannels-dialog-actions[b-cm7vfr58gg] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .notificationchannels-dialog-actions .mud-button-root[b-cm7vfr58gg] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .notificationchannels-dialog-header[b-cm7vfr58gg] {
        align-items: flex-start;
        gap: 14px;
    }

    .notificationchannels-dialog-icon[b-cm7vfr58gg] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .notificationchannels-dialog-icon .mud-icon-root[b-cm7vfr58gg] {
            font-size: 30px;
        }

    .notificationchannels-dialog-actions[b-cm7vfr58gg] {
        flex-direction: column-reverse;
    }

        .notificationchannels-dialog-actions .mud-button-root[b-cm7vfr58gg] {
            width: 100%;
        }
}
/* /Pages/PaymentGateways/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA PAYMENTGATEWAYS - LAYOUT GENERAL
   ========================================================= */

.paymentgateways-page[b-2et3gulwj9] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.paymentgateways-header[b-2et3gulwj9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .paymentgateways-header h1[b-2et3gulwj9] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .paymentgateways-header p[b-2et3gulwj9] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-2et3gulwj9](.btn-new-paymentgateways) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.paymentgateways-summary-card[b-2et3gulwj9] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-2et3gulwj9] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-2et3gulwj9] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-2et3gulwj9] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-2et3gulwj9] {
        font-size: 31px;
    }

.summary-blue[b-2et3gulwj9] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-2et3gulwj9] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-2et3gulwj9] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-2et3gulwj9] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-2et3gulwj9] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-2et3gulwj9] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.paymentgateways-toolbar[b-2et3gulwj9] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-2et3gulwj9] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-2et3gulwj9](.paymentgateways-search),
[b-2et3gulwj9](.paymentgateways-filter) {
    background: #ffffff !important;
}

[b-2et3gulwj9](.paymentgateways-search .mud-input-outlined-border),
[b-2et3gulwj9](.paymentgateways-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-2et3gulwj9](.paymentgateways-search .mud-input-root),
[b-2et3gulwj9](.paymentgateways-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-2et3gulwj9](.paymentgateways-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-2et3gulwj9](.paymentgateways-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-2et3gulwj9](.paymentgateways-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.paymentgateways-name-cell[b-2et3gulwj9] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-2et3gulwj9] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-2et3gulwj9] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-2et3gulwj9] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-2et3gulwj9] {
            background: #12b76a;
        }

    .status-pill.inactive[b-2et3gulwj9] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-2et3gulwj9] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.paymentgateways-actions[b-2et3gulwj9] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-2et3gulwj9](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-2et3gulwj9](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-2et3gulwj9] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .paymentgateways-summary-card[b-2et3gulwj9] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-2et3gulwj9] {
        display: none;
    }

    .paymentgateways-toolbar[b-2et3gulwj9] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-2et3gulwj9] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/PaymentGateways/PaymentGatewayFormDialog.razor.rz.scp.css */
/* =========================================================
   PAYMENTGATEWAY FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.paymentgateways-dialog[b-s4rmazepft] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.paymentgateways-dialog-header[b-s4rmazepft] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.paymentgateways-dialog-icon[b-s4rmazepft] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .paymentgateways-dialog-icon .mud-icon-root[b-s4rmazepft] {
        font-size: 38px;
    }

.paymentgateways-dialog-title[b-s4rmazepft] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.paymentgateways-dialog-subtitle[b-s4rmazepft] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.paymentgateways-dialog-form[b-s4rmazepft] {
    padding-top: 12px;
}

.paymentgateways-input .mud-input-outlined-border[b-s4rmazepft] {
    border-radius: 12px !important;
}

.paymentgateways-input .mud-input-root[b-s4rmazepft] {
    min-height: 56px;
}

.paymentgateways-input .mud-input-label[b-s4rmazepft] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.paymentgateways-status-box[b-s4rmazepft] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.paymentgateways-status-title[b-s4rmazepft] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.paymentgateways-status-content[b-s4rmazepft] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.paymentgateways-status-help[b-s4rmazepft] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.paymentgateways-dialog-actions[b-s4rmazepft] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .paymentgateways-dialog-actions .mud-button-root[b-s4rmazepft] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .paymentgateways-dialog-header[b-s4rmazepft] {
        align-items: flex-start;
        gap: 14px;
    }

    .paymentgateways-dialog-icon[b-s4rmazepft] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .paymentgateways-dialog-icon .mud-icon-root[b-s4rmazepft] {
            font-size: 30px;
        }

    .paymentgateways-dialog-actions[b-s4rmazepft] {
        flex-direction: column-reverse;
    }

        .paymentgateways-dialog-actions .mud-button-root[b-s4rmazepft] {
            width: 100%;
        }
}
/* /Pages/PaymentMethods/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA PAYMENTMETHODS - LAYOUT GENERAL
   ========================================================= */

.paymentmethods-page[b-5n9iiqsd3p] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.paymentmethods-header[b-5n9iiqsd3p] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .paymentmethods-header h1[b-5n9iiqsd3p] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .paymentmethods-header p[b-5n9iiqsd3p] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-5n9iiqsd3p](.btn-new-paymentmethods) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.paymentmethods-summary-card[b-5n9iiqsd3p] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-5n9iiqsd3p] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-5n9iiqsd3p] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-5n9iiqsd3p] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-5n9iiqsd3p] {
        font-size: 31px;
    }

.summary-blue[b-5n9iiqsd3p] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-5n9iiqsd3p] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-5n9iiqsd3p] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-5n9iiqsd3p] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-5n9iiqsd3p] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-5n9iiqsd3p] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.paymentmethods-toolbar[b-5n9iiqsd3p] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-5n9iiqsd3p] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-5n9iiqsd3p](.paymentmethods-search),
[b-5n9iiqsd3p](.paymentmethods-filter) {
    background: #ffffff !important;
}

[b-5n9iiqsd3p](.paymentmethods-search .mud-input-outlined-border),
[b-5n9iiqsd3p](.paymentmethods-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-5n9iiqsd3p](.paymentmethods-search .mud-input-root),
[b-5n9iiqsd3p](.paymentmethods-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-5n9iiqsd3p](.paymentmethods-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-5n9iiqsd3p](.paymentmethods-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-5n9iiqsd3p](.paymentmethods-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.paymentmethods-name-cell[b-5n9iiqsd3p] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-5n9iiqsd3p] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-5n9iiqsd3p] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-5n9iiqsd3p] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-5n9iiqsd3p] {
            background: #12b76a;
        }

    .status-pill.inactive[b-5n9iiqsd3p] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-5n9iiqsd3p] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.paymentmethods-actions[b-5n9iiqsd3p] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-5n9iiqsd3p](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-5n9iiqsd3p](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-5n9iiqsd3p] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .paymentmethods-summary-card[b-5n9iiqsd3p] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-5n9iiqsd3p] {
        display: none;
    }

    .paymentmethods-toolbar[b-5n9iiqsd3p] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-5n9iiqsd3p] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/PaymentMethods/PaymentMethodFormDialog.razor.rz.scp.css */
/* =========================================================
   PAYMENTMETHOD FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.paymentmethods-dialog[b-hiv8jaqic0] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.paymentmethods-dialog-header[b-hiv8jaqic0] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.paymentmethods-dialog-icon[b-hiv8jaqic0] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .paymentmethods-dialog-icon .mud-icon-root[b-hiv8jaqic0] {
        font-size: 38px;
    }

.paymentmethods-dialog-title[b-hiv8jaqic0] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.paymentmethods-dialog-subtitle[b-hiv8jaqic0] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.paymentmethods-dialog-form[b-hiv8jaqic0] {
    padding-top: 12px;
}

.paymentmethods-input .mud-input-outlined-border[b-hiv8jaqic0] {
    border-radius: 12px !important;
}

.paymentmethods-input .mud-input-root[b-hiv8jaqic0] {
    min-height: 56px;
}

.paymentmethods-input .mud-input-label[b-hiv8jaqic0] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.paymentmethods-status-box[b-hiv8jaqic0] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.paymentmethods-status-title[b-hiv8jaqic0] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.paymentmethods-status-content[b-hiv8jaqic0] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.paymentmethods-status-help[b-hiv8jaqic0] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.paymentmethods-dialog-actions[b-hiv8jaqic0] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .paymentmethods-dialog-actions .mud-button-root[b-hiv8jaqic0] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .paymentmethods-dialog-header[b-hiv8jaqic0] {
        align-items: flex-start;
        gap: 14px;
    }

    .paymentmethods-dialog-icon[b-hiv8jaqic0] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .paymentmethods-dialog-icon .mud-icon-root[b-hiv8jaqic0] {
            font-size: 30px;
        }

    .paymentmethods-dialog-actions[b-hiv8jaqic0] {
        flex-direction: column-reverse;
    }

        .paymentmethods-dialog-actions .mud-button-root[b-hiv8jaqic0] {
            width: 100%;
        }
}
/* /Pages/PlanModules/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA PLANMODULES - LAYOUT GENERAL
   ========================================================= */

.planmodules-page[b-ocku01k2o0] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.planmodules-header[b-ocku01k2o0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .planmodules-header h1[b-ocku01k2o0] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .planmodules-header p[b-ocku01k2o0] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-ocku01k2o0](.btn-new-planmodules) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.planmodules-summary-card[b-ocku01k2o0] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-ocku01k2o0] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-ocku01k2o0] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-ocku01k2o0] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-ocku01k2o0] {
        font-size: 31px;
    }

.summary-blue[b-ocku01k2o0] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-ocku01k2o0] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-ocku01k2o0] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-ocku01k2o0] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-ocku01k2o0] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-ocku01k2o0] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.planmodules-toolbar[b-ocku01k2o0] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-ocku01k2o0] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-ocku01k2o0](.planmodules-search),
[b-ocku01k2o0](.planmodules-filter) {
    background: #ffffff !important;
}

[b-ocku01k2o0](.planmodules-search .mud-input-outlined-border),
[b-ocku01k2o0](.planmodules-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-ocku01k2o0](.planmodules-search .mud-input-root),
[b-ocku01k2o0](.planmodules-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-ocku01k2o0](.planmodules-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-ocku01k2o0](.planmodules-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-ocku01k2o0](.planmodules-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.planmodules-name-cell[b-ocku01k2o0] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-ocku01k2o0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-ocku01k2o0] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-ocku01k2o0] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-ocku01k2o0] {
            background: #12b76a;
        }

    .status-pill.inactive[b-ocku01k2o0] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-ocku01k2o0] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.planmodules-actions[b-ocku01k2o0] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-ocku01k2o0](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-ocku01k2o0](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-ocku01k2o0] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .planmodules-summary-card[b-ocku01k2o0] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-ocku01k2o0] {
        display: none;
    }

    .planmodules-toolbar[b-ocku01k2o0] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-ocku01k2o0] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/PlanModules/PlanModuleFormDialog.razor.rz.scp.css */
/* =========================================================
   PLANMODULE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.planmodules-dialog[b-1jfq2skecl] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.planmodules-dialog-header[b-1jfq2skecl] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.planmodules-dialog-icon[b-1jfq2skecl] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .planmodules-dialog-icon .mud-icon-root[b-1jfq2skecl] {
        font-size: 38px;
    }

.planmodules-dialog-title[b-1jfq2skecl] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.planmodules-dialog-subtitle[b-1jfq2skecl] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.planmodules-dialog-form[b-1jfq2skecl] {
    padding-top: 12px;
}

.planmodules-input .mud-input-outlined-border[b-1jfq2skecl] {
    border-radius: 12px !important;
}

.planmodules-input .mud-input-root[b-1jfq2skecl] {
    min-height: 56px;
}

.planmodules-input .mud-input-label[b-1jfq2skecl] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.planmodules-status-box[b-1jfq2skecl] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.planmodules-status-title[b-1jfq2skecl] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.planmodules-status-content[b-1jfq2skecl] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.planmodules-status-help[b-1jfq2skecl] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.planmodules-dialog-actions[b-1jfq2skecl] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .planmodules-dialog-actions .mud-button-root[b-1jfq2skecl] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .planmodules-dialog-header[b-1jfq2skecl] {
        align-items: flex-start;
        gap: 14px;
    }

    .planmodules-dialog-icon[b-1jfq2skecl] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .planmodules-dialog-icon .mud-icon-root[b-1jfq2skecl] {
            font-size: 30px;
        }

    .planmodules-dialog-actions[b-1jfq2skecl] {
        flex-direction: column-reverse;
    }

        .planmodules-dialog-actions .mud-button-root[b-1jfq2skecl] {
            width: 100%;
        }
}
/* /Pages/Plans/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA PLANS - LAYOUT GENERAL
   ========================================================= */

.plans-page[b-w3ngy7loz4] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.plans-header[b-w3ngy7loz4] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .plans-header h1[b-w3ngy7loz4] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .plans-header p[b-w3ngy7loz4] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-w3ngy7loz4](.btn-new-plans) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.plans-summary-card[b-w3ngy7loz4] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-w3ngy7loz4] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-w3ngy7loz4] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-w3ngy7loz4] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-w3ngy7loz4] {
        font-size: 31px;
    }

.summary-blue[b-w3ngy7loz4] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-w3ngy7loz4] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-w3ngy7loz4] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-w3ngy7loz4] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-w3ngy7loz4] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-w3ngy7loz4] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.plans-toolbar[b-w3ngy7loz4] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-w3ngy7loz4] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-w3ngy7loz4](.plans-search),
[b-w3ngy7loz4](.plans-filter) {
    background: #ffffff !important;
}

[b-w3ngy7loz4](.plans-search .mud-input-outlined-border),
[b-w3ngy7loz4](.plans-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-w3ngy7loz4](.plans-search .mud-input-root),
[b-w3ngy7loz4](.plans-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-w3ngy7loz4](.plans-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-w3ngy7loz4](.plans-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-w3ngy7loz4](.plans-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.plans-name-cell[b-w3ngy7loz4] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-w3ngy7loz4] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-w3ngy7loz4] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-w3ngy7loz4] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-w3ngy7loz4] {
            background: #12b76a;
        }

    .status-pill.inactive[b-w3ngy7loz4] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-w3ngy7loz4] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.plans-actions[b-w3ngy7loz4] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-w3ngy7loz4](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-w3ngy7loz4](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-w3ngy7loz4] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .plans-summary-card[b-w3ngy7loz4] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-w3ngy7loz4] {
        display: none;
    }

    .plans-toolbar[b-w3ngy7loz4] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-w3ngy7loz4] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Plans/PlanFormDialog.razor.rz.scp.css */
/* =========================================================
   PLAN FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.plans-dialog[b-a333ckb8xr] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.plans-dialog-header[b-a333ckb8xr] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.plans-dialog-icon[b-a333ckb8xr] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .plans-dialog-icon .mud-icon-root[b-a333ckb8xr] {
        font-size: 38px;
    }

.plans-dialog-title[b-a333ckb8xr] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.plans-dialog-subtitle[b-a333ckb8xr] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.plans-dialog-form[b-a333ckb8xr] {
    padding-top: 12px;
}

.plans-input .mud-input-outlined-border[b-a333ckb8xr] {
    border-radius: 12px !important;
}

.plans-input .mud-input-root[b-a333ckb8xr] {
    min-height: 56px;
}

.plans-input .mud-input-label[b-a333ckb8xr] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.plans-status-box[b-a333ckb8xr] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.plans-status-title[b-a333ckb8xr] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.plans-status-content[b-a333ckb8xr] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.plans-status-help[b-a333ckb8xr] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.plans-dialog-actions[b-a333ckb8xr] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .plans-dialog-actions .mud-button-root[b-a333ckb8xr] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .plans-dialog-header[b-a333ckb8xr] {
        align-items: flex-start;
        gap: 14px;
    }

    .plans-dialog-icon[b-a333ckb8xr] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .plans-dialog-icon .mud-icon-root[b-a333ckb8xr] {
            font-size: 30px;
        }

    .plans-dialog-actions[b-a333ckb8xr] {
        flex-direction: column-reverse;
    }

        .plans-dialog-actions .mud-button-root[b-a333ckb8xr] {
            width: 100%;
        }
}
/* /Pages/Properties/Blocks/BlocksFormDialog.razor.rz.scp.css */
/* =========================================================
   BLOCKS FORM DIALOG
   Estándar visual HABYTAL basado en PropertiesFormDialog.
   ========================================================= */

.blocks-dialog[b-m3579dlvxo] {
    border-radius: 20px !important;
    overflow: hidden;
}

.blocks-dialog-header[b-m3579dlvxo] {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 6px 12px;
}

.blocks-dialog-icon[b-m3579dlvxo] {
    width: 64px;
    height: 64px;
    min-width: 64px;
    border-radius: 18px;
    background: #e8f2ff;
    color: #0b5ee8;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-dialog-title[b-m3579dlvxo] {
    color: #082b63;
    font-weight: 700;
    letter-spacing: -0.4px;
}

.blocks-dialog-subtitle[b-m3579dlvxo] {
    margin-top: 4px;
    color: #64748b;
}

.blocks-dialog-form[b-m3579dlvxo] {
    padding-top: 14px;
}

[b-m3579dlvxo](.blocks-input .mud-input-outlined-border) {
    border-radius: 12px !important;
    border-color: #d7e3f2 !important;
}

[b-m3579dlvxo](.blocks-input .mud-input-root) {
    min-height: 54px;
}

.blocks-dialog-actions[b-m3579dlvxo] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 14px;
    padding: 18px 4px 4px;
    border-top: 1px solid #e4eaf3;
}

.blocks-dialog-actions .mud-button-root[b-m3579dlvxo] {
    min-width: 138px;
    height: 44px;
    border-radius: 10px;
    font-weight: 700;
    text-transform: none;
}
/* /Pages/Properties/Blocks/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA BLOCKS
   Estándar visual HABYTAL basado en Properties.
   ========================================================= */

.blocks-page[b-zh0ddox3t9] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-zh0ddox3t9] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-zh0ddox3t9] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-zh0ddox3t9] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-zh0ddox3t9] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-zh0ddox3t9] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-zh0ddox3t9] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-zh0ddox3t9] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-zh0ddox3t9] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-zh0ddox3t9] {
    text-align: center !important;
}

.blocks-name-cell[b-zh0ddox3t9] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-zh0ddox3t9] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-zh0ddox3t9] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-zh0ddox3t9] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-zh0ddox3t9] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-zh0ddox3t9] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-zh0ddox3t9] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-zh0ddox3t9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-zh0ddox3t9] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-zh0ddox3t9] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-zh0ddox3t9] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Properties/CommonAreas/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA COMMON AREAS
   Estándar visual HABYTAL basado en Blocks.
   ========================================================= */

.blocks-page[b-m2h5cky98o] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-m2h5cky98o] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-m2h5cky98o] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-m2h5cky98o] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-m2h5cky98o] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-m2h5cky98o] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-m2h5cky98o] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-m2h5cky98o] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-m2h5cky98o] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-m2h5cky98o] {
    text-align: center !important;
}

.blocks-name-cell[b-m2h5cky98o] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-m2h5cky98o] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-m2h5cky98o] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-m2h5cky98o] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-m2h5cky98o] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-m2h5cky98o] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-m2h5cky98o] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-m2h5cky98o] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-m2h5cky98o] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-m2h5cky98o] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-m2h5cky98o] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Properties/CommunitySettings.razor.rz.scp.css */
/* =========================================================
   COMMUNITY SETTINGS
   Mockup visual para configuración del conjunto.
   ========================================================= */

/* =========================================================
   SECCIÓN: CONTENEDOR PRINCIPAL
   ========================================================= */

.community-settings-page[b-d6rkm9n5tu] {
    width: 100%;
    min-height: calc(100vh - 32px);
    padding: 16px 16px 36px;
    box-sizing: border-box;
    background: #f5f7fb;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #101b3d;
}

.community-settings-card[b-d6rkm9n5tu] {
    width: 100%;
    min-height: 0;
    overflow: hidden;
    border: 1px solid #e5ebf5;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
}

/* =========================================================
   SECCIÓN: ENCABEZADO
   ========================================================= */

.community-settings-header[b-d6rkm9n5tu] {
    padding: 26px 28px 8px;
}

.community-settings-title-row[b-d6rkm9n5tu] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.community-settings-icon[b-d6rkm9n5tu] {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: grid;
    place-items: center;
    color: #293bd8;
}

.community-settings-icon svg[b-d6rkm9n5tu],
.field-control-icon-wrapper svg[b-d6rkm9n5tu],
.audit-card svg[b-d6rkm9n5tu],
.button svg[b-d6rkm9n5tu] {
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.community-settings-icon svg[b-d6rkm9n5tu] {
    width: 28px;
    height: 28px;
}

.community-settings-header h1[b-d6rkm9n5tu] {
    margin: 0;
    color: #101b3d;
    font-size: 1.35rem;
    font-weight: 900;
    line-height: 1.18;
    letter-spacing: -0.025em;
}

.community-settings-header p[b-d6rkm9n5tu] {
    margin: 8px 0 0;
    color: #536184;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.4;
}

/* =========================================================
   SECCIÓN: FORMULARIO
   ========================================================= */

.community-settings-form[b-d6rkm9n5tu] {
    display: block;
}

.community-settings-grid[b-d6rkm9n5tu] {
    padding: 32px 28px 28px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 30px;
    row-gap: 31px;
}

.field-group[b-d6rkm9n5tu] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.field-group label[b-d6rkm9n5tu] {
    margin: 0 0 10px;
    color: #283b68;
    font-size: 0.83rem;
    font-weight: 900;
    line-height: 1.1;
}

.field-group label span[b-d6rkm9n5tu] {
    color: #d43f6d;
}

.field-group small[b-d6rkm9n5tu] {
    margin-top: 8px;
    color: #5d6b8d;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.35;
}

.field-control[b-d6rkm9n5tu] {
    width: 100%;
    height: 38px;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid #ccd6e6;
    border-radius: 6px;
    outline: none;
    box-sizing: border-box;
    color: #101b3d;
    background: #ffffff;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 750;
    line-height: 38px;
    box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.02);
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.field-control:focus[b-d6rkm9n5tu] {
    border-color: #5264ee;
    box-shadow: 0 0 0 3px rgba(82, 100, 238, 0.13);
}

.field-control[b-d6rkm9n5tu]::placeholder {
    color: #9aa7bf;
    font-weight: 600;
}

.field-control-select[b-d6rkm9n5tu] {
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    padding-right: 38px;
    background-image:
        linear-gradient(45deg, transparent 50%, #42547a 50%),
        linear-gradient(135deg, #42547a 50%, transparent 50%);
    background-position:
        calc(100% - 18px) 16px,
        calc(100% - 13px) 16px;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
}

.field-control-icon-wrapper[b-d6rkm9n5tu] {
    position: relative;
    width: 100%;
}

.field-control-icon-wrapper svg[b-d6rkm9n5tu] {
    position: absolute;
    top: 50%;
    left: 13px;
    width: 17px;
    height: 17px;
    transform: translateY(-50%);
    color: #2d416e;
    z-index: 1;
}

.field-control-with-icon[b-d6rkm9n5tu] {
    padding-left: 42px;
}

/* =========================================================
   SECCIÓN: CONTROL SEGMENTADO
   ========================================================= */

.segmented-control[b-d6rkm9n5tu] {
    width: 166px;
    height: 38px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    overflow: hidden;
    border: 1px solid #ccd6e6;
    border-radius: 6px;
    background: #ffffff;
}

.segmented-control-button[b-d6rkm9n5tu] {
    height: 38px;
    border: 0;
    color: #101b3d;
    background: #ffffff;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 900;
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.segmented-control-button-active[b-d6rkm9n5tu] {
    color: #ffffff;
    background: linear-gradient(135deg, #5b6df1 0%, #4b55dc 100%);
    box-shadow: 0 8px 18px rgba(73, 85, 220, 0.24);
}

/* =========================================================
   SECCIÓN: AUDITORÍA
   ========================================================= */

.audit-grid[b-d6rkm9n5tu] {
    padding: 6px 28px 16px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.audit-card[b-d6rkm9n5tu] {
    min-height: 64px;
    display: flex;
    align-items: center;
    gap: 17px;
    padding: 0 26px;
    border-radius: 6px;
    background: linear-gradient(180deg, #f3f6fb 0%, #eef2f8 100%);
    box-sizing: border-box;
}

.audit-card svg[b-d6rkm9n5tu] {
    width: 19px;
    height: 19px;
    color: #536184;
}

.audit-card span[b-d6rkm9n5tu] {
    display: block;
    margin-bottom: 4px;
    color: #516282;
    font-size: 0.73rem;
    font-weight: 850;
}

.audit-card strong[b-d6rkm9n5tu] {
    display: block;
    color: #101b3d;
    font-size: 0.76rem;
    font-weight: 950;
}

/* =========================================================
   SECCIÓN: ACCIONES
   ========================================================= */

.community-settings-actions[b-d6rkm9n5tu] {
    min-height: 78px;
    padding: 20px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #e8edf5;
    box-sizing: border-box;
}

.button[b-d6rkm9n5tu] {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 5px;
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.button:hover[b-d6rkm9n5tu] {
    transform: translateY(-1px);
}

.button-secondary[b-d6rkm9n5tu] {
    padding: 0 15px;
    border: 1px solid #cbd6e8;
    color: #203154;
    background: #ffffff;
}

.button-primary[b-d6rkm9n5tu] {
    padding: 0 18px;
    border: 1px solid transparent;
    color: #ffffff;
    background: linear-gradient(135deg, #5b6df1 0%, #4b55dc 100%);
    box-shadow: 0 9px 20px rgba(75, 85, 220, 0.22);
}

.button-primary svg[b-d6rkm9n5tu] {
    width: 16px;
    height: 16px;
}

/* =========================================================
   SECCIÓN: RESPONSIVE
   ========================================================= */

@media (max-width: 1200px) {
    .community-settings-grid[b-d6rkm9n5tu] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .community-settings-page[b-d6rkm9n5tu] {
        padding: 12px;
    }

    .community-settings-header[b-d6rkm9n5tu],
    .community-settings-grid[b-d6rkm9n5tu],
    .audit-grid[b-d6rkm9n5tu],
    .community-settings-actions[b-d6rkm9n5tu] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .community-settings-grid[b-d6rkm9n5tu],
    .audit-grid[b-d6rkm9n5tu] {
        grid-template-columns: 1fr;
    }

    .community-settings-actions[b-d6rkm9n5tu] {
        gap: 12px;
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .button[b-d6rkm9n5tu] {
        width: 100%;
    }
}
/* /Pages/Properties/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA PROPERTIES
   Listado general del módulo con estándar visual HABYTAL.
   ========================================================= */

.properties-page[b-unfsjsw5qk] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

/* =========================================================
   FILTROS DEL CRUD TOOLBAR
   ========================================================= */

.properties-toolbar-filter[b-unfsjsw5qk] {
    min-width: 178px;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.properties-toolbar-filter label[b-unfsjsw5qk] {
    color: #15244b;
    font-size: 12px;
    font-weight: 600;
}

.properties-toolbar-filter select[b-unfsjsw5qk] {
    width: 100%;
    height: 44px;
    padding: 0 12px;
    border: 1px solid #d8dfed;
    border-radius: 8px;
    background: #ffffff;
    color: #071b4d;
    font-size: 14px;
    font-weight: 400;
    outline: none;
}

.properties-toolbar-filter select:focus[b-unfsjsw5qk] {
    border-color: #5966f2;
    box-shadow: 0 0 0 3px rgba(89, 102, 242, 0.12);
}

.properties-filter-action[b-unfsjsw5qk] {
    height: 44px;
    align-self: end;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 16px;
    border: 1px solid #082b63;
    border-radius: 8px;
    background: #ffffff;
    color: #082b63;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.18s ease;
}

.properties-filter-action:hover[b-unfsjsw5qk] {
    background: #082b63;
    color: #ffffff;
}

.properties-filter-action[b-unfsjsw5qk]  .mud-icon-root {
    font-size: 18px;
}


.properties-list-card[b-unfsjsw5qk],
.properties-table[b-unfsjsw5qk] {
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
}

/* =========================================================
   TABLA PROPIA DEL MÓDULO PROPERTIES
   ========================================================= */

.properties-list-card[b-unfsjsw5qk] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.properties-list-header[b-unfsjsw5qk] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.properties-list-title[b-unfsjsw5qk] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.properties-list-title strong[b-unfsjsw5qk] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.properties-table-scroll[b-unfsjsw5qk] {
    width: 100%;
    overflow-x: auto;
}

.properties-table[b-unfsjsw5qk] {
    width: 100%;
    min-width: 1280px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.properties-table thead th[b-unfsjsw5qk] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
}

.properties-table tbody td[b-unfsjsw5qk] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.properties-table tbody tr:last-child td[b-unfsjsw5qk] {
    border-bottom: 0;
}

.properties-table tbody tr[b-unfsjsw5qk] {
    transition: background 0.18s ease;
}

.properties-table tbody tr:hover[b-unfsjsw5qk] {
    background: #f8fbff;
}

.properties-cell-center[b-unfsjsw5qk] {
    text-align: center !important;
}

.properties-code[b-unfsjsw5qk] {
    color: #2563eb;
    font-weight: 600;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

.properties-name-cell[b-unfsjsw5qk] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 260px;
}

.properties-name-icon[b-unfsjsw5qk] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.properties-name-icon[b-unfsjsw5qk]  .mud-icon-root {
    font-size: 22px;
}

.properties-name-cell strong[b-unfsjsw5qk] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.properties-name-cell span[b-unfsjsw5qk] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.properties-muted[b-unfsjsw5qk] {
    color: #64748b;
    font-weight: 400;
}

.properties-admin-name[b-unfsjsw5qk] {
    display: inline-block;
    max-width: 190px;
    color: #334155;
    font-size: 13px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.properties-contact-cell[b-unfsjsw5qk] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 170px;
}

.properties-contact-cell span[b-unfsjsw5qk] {
    color: #334155;
    font-weight: 500;
}

.properties-contact-cell small[b-unfsjsw5qk] {
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.properties-location-cell[b-unfsjsw5qk] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 190px;
    color: #475569;
    font-weight: 400;
}

.properties-location-cell[b-unfsjsw5qk]  .mud-icon-root {
    color: #64748b;
    font-size: 18px;
}

.properties-units[b-unfsjsw5qk] {
    display: inline-flex;
    min-width: 42px;
    height: 28px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #eef4ff;
    color: #2563eb;
    font-size: 12.5px;
    font-weight: 600;
}

.properties-status-badge[b-unfsjsw5qk] {
    min-width: 78px;
    height: 28px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.properties-status-active[b-unfsjsw5qk] {
    background: #dcfce7;
    color: #15803d;
}

.properties-status-inactive[b-unfsjsw5qk] {
    background: #f1f5f9;
    color: #64748b;
}

.properties-date-cell[b-unfsjsw5qk] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 96px;
}

.properties-date-cell strong[b-unfsjsw5qk] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.properties-date-cell span[b-unfsjsw5qk] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.properties-row-actions[b-unfsjsw5qk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.properties-action-button[b-unfsjsw5qk] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.18s ease;
}

.properties-action-button:hover[b-unfsjsw5qk] {
    border-color: #2563eb;
    background: #eef4ff;
    transform: translateY(-1px);
}

.properties-action-button[b-unfsjsw5qk]  .mud-icon-root {
    font-size: 19px;
}

.properties-action-danger[b-unfsjsw5qk] {
    color: #dc2626;
}

.properties-action-danger:hover[b-unfsjsw5qk] {
    border-color: #fecaca;
    background: #fff1f2;
}

.properties-empty-state[b-unfsjsw5qk] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.properties-empty-state[b-unfsjsw5qk]  .mud-icon-root {
    color: #94a3b8;
    font-size: 42px;
}

.properties-empty-state strong[b-unfsjsw5qk] {
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.properties-empty-state span[b-unfsjsw5qk] {
    font-size: 13px;
    font-weight: 400;
}

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

@media (max-width: 768px) {
    .properties-page[b-unfsjsw5qk] {
        padding: 18px 12px 28px;
    }

    .properties-toolbar-filter[b-unfsjsw5qk] {
        min-width: 100%;
    }

    .properties-filter-action[b-unfsjsw5qk] {
        width: 100%;
    }

    .properties-list-card[b-unfsjsw5qk] {
        border-radius: 12px;
    }
}

/* =========================================================
   MODO OSCURO
   ========================================================= */

:global(.mud-theme-dark) .properties-page[b-unfsjsw5qk],
:global(body.dark) .properties-page[b-unfsjsw5qk],
:global(.dark) .properties-page[b-unfsjsw5qk] {
    background: #0b1220;
}

:global(.mud-theme-dark) .properties-toolbar-filter label[b-unfsjsw5qk],
:global(body.dark) .properties-toolbar-filter label[b-unfsjsw5qk],
:global(.dark) .properties-toolbar-filter label[b-unfsjsw5qk] {
    color: #e2e8f0;
}

:global(.mud-theme-dark) .properties-toolbar-filter select[b-unfsjsw5qk],
:global(body.dark) .properties-toolbar-filter select[b-unfsjsw5qk],
:global(.dark) .properties-toolbar-filter select[b-unfsjsw5qk] {
    border-color: rgba(148, 163, 184, 0.4);
    background: #0f172a;
    color: #f8fafc;
}

:global(.mud-theme-dark) .properties-list-card[b-unfsjsw5qk],
:global(body.dark) .properties-list-card[b-unfsjsw5qk],
:global(.dark) .properties-list-card[b-unfsjsw5qk] {
    border-color: rgba(148, 163, 184, 0.22);
    background: #111827;
}

:global(.mud-theme-dark) .properties-list-header[b-unfsjsw5qk],
:global(body.dark) .properties-list-header[b-unfsjsw5qk],
:global(.dark) .properties-list-header[b-unfsjsw5qk] {
    border-color: rgba(148, 163, 184, 0.22);
    background: #111827;
}

:global(.mud-theme-dark) .properties-list-title[b-unfsjsw5qk],
:global(.mud-theme-dark) .properties-code[b-unfsjsw5qk],
:global(.mud-theme-dark) .properties-name-cell strong[b-unfsjsw5qk],
:global(.mud-theme-dark) .properties-date-cell strong[b-unfsjsw5qk],
:global(.mud-theme-dark) .properties-empty-state strong[b-unfsjsw5qk],
:global(body.dark) .properties-list-title[b-unfsjsw5qk],
:global(body.dark) .properties-code[b-unfsjsw5qk],
:global(body.dark) .properties-name-cell strong[b-unfsjsw5qk],
:global(body.dark) .properties-date-cell strong[b-unfsjsw5qk],
:global(body.dark) .properties-empty-state strong[b-unfsjsw5qk],
:global(.dark) .properties-list-title[b-unfsjsw5qk],
:global(.dark) .properties-code[b-unfsjsw5qk],
:global(.dark) .properties-name-cell strong[b-unfsjsw5qk],
:global(.dark) .properties-date-cell strong[b-unfsjsw5qk],
:global(.dark) .properties-empty-state strong[b-unfsjsw5qk] {
    color: #f8fafc;
}

:global(.mud-theme-dark) .properties-table thead th[b-unfsjsw5qk],
:global(body.dark) .properties-table thead th[b-unfsjsw5qk],
:global(.dark) .properties-table thead th[b-unfsjsw5qk] {
    border-color: rgba(148, 163, 184, 0.22);
    background: #0f172a;
    color: #e2e8f0;
}

:global(.mud-theme-dark) .properties-table tbody td[b-unfsjsw5qk],
:global(body.dark) .properties-table tbody td[b-unfsjsw5qk],
:global(.dark) .properties-table tbody td[b-unfsjsw5qk] {
    border-color: rgba(148, 163, 184, 0.16);
    color: #cbd5e1;
}

:global(.mud-theme-dark) .properties-table tbody tr:hover[b-unfsjsw5qk],
:global(body.dark) .properties-table tbody tr:hover[b-unfsjsw5qk],
:global(.dark) .properties-table tbody tr:hover[b-unfsjsw5qk] {
    background: rgba(37, 99, 235, 0.08);
}

:global(.mud-theme-dark) .properties-name-cell span[b-unfsjsw5qk],
:global(.mud-theme-dark) .properties-muted[b-unfsjsw5qk],
:global(.mud-theme-dark) .properties-contact-cell small[b-unfsjsw5qk],
:global(.mud-theme-dark) .properties-date-cell span[b-unfsjsw5qk],
:global(body.dark) .properties-name-cell span[b-unfsjsw5qk],
:global(body.dark) .properties-muted[b-unfsjsw5qk],
:global(body.dark) .properties-contact-cell small[b-unfsjsw5qk],
:global(body.dark) .properties-date-cell span[b-unfsjsw5qk],
:global(.dark) .properties-name-cell span[b-unfsjsw5qk],
:global(.dark) .properties-muted[b-unfsjsw5qk],
:global(.dark) .properties-contact-cell small[b-unfsjsw5qk],
:global(.dark) .properties-date-cell span[b-unfsjsw5qk] {
    color: #94a3b8;
}

:global(.mud-theme-dark) .properties-action-button[b-unfsjsw5qk],
:global(body.dark) .properties-action-button[b-unfsjsw5qk],
:global(.dark) .properties-action-button[b-unfsjsw5qk] {
    border-color: rgba(148, 163, 184, 0.28);
    background: #0f172a;
}
/* /Pages/Properties/IndexCommunitySettings.razor.rz.scp.css */
/* =========================================================
   INDEX COMMUNITY SETTINGS
   Visual del listado de conjuntos para el módulo Properties.
   ========================================================= */

/* =========================================================
   SECCIÓN: VARIABLES Y CONTENEDOR
   ========================================================= */

.community-index[b-wrcx9yw0g3] {
    width: 100%;
    min-height: calc(100vh - 32px);
    padding: 22px 28px 28px;
    box-sizing: border-box;
    color: #344054;
    font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
}

.community-index *[b-wrcx9yw0g3] {
    box-sizing: border-box;
}

/* =========================================================
   SECCIÓN: ENCABEZADO
   ========================================================= */

.community-index__header[b-wrcx9yw0g3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 22px;
}

.community-index__title-group[b-wrcx9yw0g3] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.community-index__title-icon[b-wrcx9yw0g3] {
    width: 62px;
    height: 62px;
    min-width: 62px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    color: #4e58f1;
    background: #f0efff;
}

.community-index__title-icon svg[b-wrcx9yw0g3] {
    width: 35px;
    height: 35px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.community-index__header h1[b-wrcx9yw0g3] {
    margin: 0;
    color: #233876;
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: -0.045em;
    line-height: 1.08;
}

.community-index__header p[b-wrcx9yw0g3] {
    margin: 8px 0 0;
    color: #536283;
    font-size: 0.97rem;
    font-weight: 500;
    line-height: 1.45;
}

.community-index__primary-button[b-wrcx9yw0g3] {
    height: 44px;
    min-width: 174px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 6px;
    color: #ffffff;
    background: linear-gradient(135deg, #5d6df6 0%, #4b54e7 100%);
    box-shadow: 0 8px 18px rgba(74, 84, 232, 0.25);
    font-size: 0.94rem;
    font-weight: 800;
    cursor: pointer;
    transition: transform 170ms ease, box-shadow 170ms ease;
}

.community-index__primary-button:hover[b-wrcx9yw0g3] {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(74, 84, 232, 0.32);
}

.community-index__primary-button span[b-wrcx9yw0g3] {
    font-size: 1.35rem;
    font-weight: 400;
    line-height: 1;
}

/* =========================================================
   SECCIÓN: KPI CARDS
   ========================================================= */

.community-index__kpis[b-wrcx9yw0g3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 18px;
    margin-bottom: 20px;
}

.kpi-card[b-wrcx9yw0g3] {
    min-height: 108px;
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 20px 29px;
    border: 1px solid #dfe5f0;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(23, 35, 68, 0.06);
}

.kpi-card__icon[b-wrcx9yw0g3] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    display: grid;
    place-items: center;
    border-radius: 50%;
}

.kpi-card__icon svg[b-wrcx9yw0g3] {
    width: 30px;
    height: 30px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.95;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.kpi-card__icon--blue[b-wrcx9yw0g3] {
    color: #4c55f0;
    background: #efefff;
}

.kpi-card__icon--green[b-wrcx9yw0g3] {
    color: #23b15f;
    background: #e5f8e9;
}

.kpi-card__icon--red[b-wrcx9yw0g3] {
    color: #e7334d;
    background: #fee2e8;
}

.kpi-card__content[b-wrcx9yw0g3] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.kpi-card__content strong[b-wrcx9yw0g3] {
    color: #111d43;
    font-size: 1.85rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.035em;
}

.kpi-card__content span[b-wrcx9yw0g3] {
    margin-top: 6px;
    color: #17264c;
    font-size: 0.98rem;
    font-weight: 850;
}

.kpi-card__content small[b-wrcx9yw0g3] {
    margin-top: 7px;
    color: #6d7896;
    font-size: 0.86rem;
    font-weight: 500;
}

/* =========================================================
   SECCIÓN: FILTROS
   ========================================================= */

.community-index__filters[b-wrcx9yw0g3] {
    display: grid;
    grid-template-columns: minmax(320px, 2fr) minmax(180px, 1fr) minmax(180px, 1fr) auto;
    align-items: end;
    gap: 18px;
    margin-bottom: 24px;
    padding: 18px 20px;
    border: 1px solid #dfe5f0;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(23, 35, 68, 0.05);
}

.filter-field[b-wrcx9yw0g3] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.filter-field label[b-wrcx9yw0g3] {
    color: #15244b;
    font-size: 0.82rem;
    font-weight: 850;
}

.filter-control[b-wrcx9yw0g3] {
    width: 100%;
    height: 41px;
    border: 1px solid #d8dfed;
    border-radius: 6px;
    color: #1a294f;
    background: #ffffff;
    padding: 0 14px;
    font-size: 0.91rem;
    font-weight: 650;
    outline: none;
    transition: border-color 170ms ease, box-shadow 170ms ease;
}

select.filter-control[b-wrcx9yw0g3] {
    appearance: auto;
    cursor: pointer;
}

.filter-control:focus[b-wrcx9yw0g3],
.filter-control--icon:focus-within[b-wrcx9yw0g3] {
    border-color: #5966f2;
    box-shadow: 0 0 0 3px rgba(89, 102, 242, 0.12);
}

.filter-control--icon[b-wrcx9yw0g3] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 14px;
}

.filter-control--icon svg[b-wrcx9yw0g3] {
    width: 18px;
    height: 18px;
    min-width: 18px;
    fill: none;
    stroke: #536283;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.filter-control--icon input[b-wrcx9yw0g3] {
    width: 100%;
    min-width: 0;
    height: 100%;
    border: 0;
    color: #1a294f;
    background: transparent;
    outline: none;
    font-size: 0.91rem;
    font-weight: 650;
}

.filter-control--icon input[b-wrcx9yw0g3]::placeholder {
    color: #8b96af;
    font-weight: 600;
}

.filter-field--button[b-wrcx9yw0g3] {
    justify-content: flex-end;
}

.community-index__clear-button[b-wrcx9yw0g3] {
    height: 41px;
    min-width: 138px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #a8adff;
    border-radius: 6px;
    color: #4f56ee;
    background: #ffffff;
    font-size: 0.85rem;
    font-weight: 850;
    cursor: pointer;
    transition: background 170ms ease, transform 170ms ease;
}

.community-index__clear-button:hover[b-wrcx9yw0g3] {
    background: #f6f7ff;
    transform: translateY(-1px);
}

.community-index__clear-button svg[b-wrcx9yw0g3] {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* =========================================================
   SECCIÓN: TABLA
   ========================================================= */

.community-index__table-card[b-wrcx9yw0g3] {
    overflow: hidden;
    border: 1px solid #dfe5f0;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(23, 35, 68, 0.05);
}

.community-index__table-header[b-wrcx9yw0g3] {
    min-height: 52px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 18px;
    border-bottom: 1px solid #dfe5f0;
}

.community-index__table-header h2[b-wrcx9yw0g3] {
    margin: 0;
    color: #233876;
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.community-index__table-header span[b-wrcx9yw0g3] {
    min-width: 28px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #5a6581;
    background: #eef2f8;
    font-size: 0.78rem;
    font-weight: 850;
}

.community-index__table-wrapper[b-wrcx9yw0g3] {
    width: 100%;
    overflow-x: auto;
}

.community-index__table[b-wrcx9yw0g3] {
    width: 100%;
    min-width: 1100px;
    border-collapse: collapse;
}

.community-index__table th[b-wrcx9yw0g3],
.community-index__table td[b-wrcx9yw0g3] {
    height: 47px;
    padding: 0 28px;
    border-bottom: 1px solid #dfe5f0;
    color: #27375d;
    text-align: left;
    font-size: 0.84rem;
    vertical-align: middle;
    white-space: nowrap;
}

.community-index__table th[b-wrcx9yw0g3] {
    height: 46px;
    color: #12214a;
    background: #fbfcff;
    font-size: 0.78rem;
    font-weight: 900;
}

.community-index__table th span[b-wrcx9yw0g3] {
    margin-left: 4px;
    color: #33456e;
    font-size: 0.78rem;
}

.community-index__table tbody tr:hover[b-wrcx9yw0g3] {
    background: #fbfcff;
}

.community-index__table tbody tr:last-child td[b-wrcx9yw0g3] {
    border-bottom: 0;
}

.community-code[b-wrcx9yw0g3] {
    color: #32456e !important;
    font-weight: 750;
}

.city-cell[b-wrcx9yw0g3] {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.city-cell svg[b-wrcx9yw0g3] {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: #4c5875;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.status-pill[b-wrcx9yw0g3] {
    height: 28px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 12px;
    border-radius: 9px;
    font-size: 0.79rem;
    font-weight: 850;
}

.status-pill i[b-wrcx9yw0g3] {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: currentColor;
}

.status-pill--active[b-wrcx9yw0g3] {
    color: #17a956;
    background: #e7f8ed;
}

.status-pill--inactive[b-wrcx9yw0g3] {
    color: #dc2847;
    background: #ffe4eb;
}

.text-center[b-wrcx9yw0g3] {
    text-align: center !important;
}

.table-action-button[b-wrcx9yw0g3] {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #a6adff;
    border-radius: 6px;
    color: #4e56ef;
    background: #ffffff;
    cursor: pointer;
    transition: background 170ms ease, transform 170ms ease, box-shadow 170ms ease;
}

.table-action-button:hover[b-wrcx9yw0g3] {
    background: #f6f7ff;
    transform: translateY(-1px);
    box-shadow: 0 8px 16px rgba(78, 86, 239, 0.12);
}

.table-action-button svg[b-wrcx9yw0g3] {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* =========================================================
   SECCIÓN: PAGINACIÓN
   ========================================================= */

.community-index__pagination[b-wrcx9yw0g3] {
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 12px 20px;
    border-top: 1px solid #dfe5f0;
}

.page-size[b-wrcx9yw0g3] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #5b6684;
    font-size: 0.83rem;
    font-weight: 650;
}

.page-size select[b-wrcx9yw0g3] {
    width: 62px;
    height: 34px;
    border: 1px solid #d8dfed;
    border-radius: 6px;
    color: #1d2b50;
    background: #ffffff;
    padding: 0 10px;
    font-size: 0.87rem;
    font-weight: 750;
}

.pagination-buttons[b-wrcx9yw0g3] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pagination-buttons button[b-wrcx9yw0g3],
.pagination-buttons span[b-wrcx9yw0g3] {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    color: #132144;
    background: transparent;
    font-size: 0.86rem;
    font-weight: 800;
}

.pagination-buttons button[b-wrcx9yw0g3] {
    border: 1px solid transparent;
    cursor: pointer;
    transition: background 170ms ease, border-color 170ms ease, color 170ms ease;
}

.pagination-buttons button:hover:not(:disabled)[b-wrcx9yw0g3] {
    border-color: #d8dfed;
    background: #f8faff;
}

.pagination-buttons button:first-child[b-wrcx9yw0g3],
.pagination-buttons button:last-child[b-wrcx9yw0g3] {
    border-color: #d8dfed;
    color: #31405f;
    font-size: 1.3rem;
    font-weight: 500;
}

.pagination-buttons button.active[b-wrcx9yw0g3] {
    border-color: #4f57ef;
    color: #ffffff;
    background: linear-gradient(135deg, #5d6df6 0%, #4b54e7 100%);
    box-shadow: 0 6px 14px rgba(74, 84, 232, 0.25);
}

.pagination-buttons button:disabled[b-wrcx9yw0g3] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* =========================================================
   SECCIÓN: RESPONSIVE
   ========================================================= */

@media (max-width: 1400px) {
    .community-index[b-wrcx9yw0g3] {
        padding: 20px 22px 26px;
    }

    .community-index__kpis[b-wrcx9yw0g3] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1200px) {
    .community-index__filters[b-wrcx9yw0g3] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .filter-field--button[b-wrcx9yw0g3] {
        grid-column: span 2;
        align-items: stretch;
    }

    .community-index__clear-button[b-wrcx9yw0g3] {
        width: 100%;
    }
}

@media (max-width: 900px) {
    .community-index__header[b-wrcx9yw0g3] {
        align-items: flex-start;
        flex-direction: column;
    }

    .community-index__primary-button[b-wrcx9yw0g3] {
        width: 100%;
    }

    .community-index__title-group[b-wrcx9yw0g3] {
        align-items: flex-start;
    }

    .community-index__header h1[b-wrcx9yw0g3] {
        font-size: 1.65rem;
        letter-spacing: -0.025em;
    }

    .community-index__header p[b-wrcx9yw0g3] {
        font-size: 0.93rem;
    }
}

@media (max-width: 768px) {
    .community-index[b-wrcx9yw0g3] {
        padding: 16px;
        min-height: auto;
    }

    .community-index__title-icon[b-wrcx9yw0g3] {
        width: 54px;
        height: 54px;
        min-width: 54px;
        border-radius: 14px;
    }

    .community-index__title-icon svg[b-wrcx9yw0g3] {
        width: 30px;
        height: 30px;
    }

    .community-index__kpis[b-wrcx9yw0g3],
    .community-index__filters[b-wrcx9yw0g3] {
        grid-template-columns: 1fr;
    }

    .kpi-card[b-wrcx9yw0g3] {
        min-height: 98px;
        padding: 18px;
    }

    .kpi-card__content strong[b-wrcx9yw0g3] {
        font-size: 1.65rem;
    }

    .filter-field--button[b-wrcx9yw0g3] {
        grid-column: auto;
    }

    .community-index__table-header[b-wrcx9yw0g3] {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        padding: 14px 16px;
    }

    .community-index__pagination[b-wrcx9yw0g3] {
        align-items: stretch;
        flex-direction: column;
    }

    .page-size[b-wrcx9yw0g3] {
        flex-wrap: wrap;
    }

    .pagination-buttons[b-wrcx9yw0g3] {
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }
}

@media (max-width: 480px) {
    .community-index[b-wrcx9yw0g3] {
        padding: 14px 12px 20px;
    }

    .community-index__title-group[b-wrcx9yw0g3] {
        gap: 12px;
    }

    .community-index__header h1[b-wrcx9yw0g3] {
        font-size: 1.42rem;
    }

    .community-index__header p[b-wrcx9yw0g3] {
        font-size: 0.88rem;
    }

    .community-index__primary-button[b-wrcx9yw0g3],
    .community-index__clear-button[b-wrcx9yw0g3],
    .filter-control[b-wrcx9yw0g3] {
        height: 44px;
    }

    .community-index__filters[b-wrcx9yw0g3] {
        padding: 15px;
    }

    .kpi-card[b-wrcx9yw0g3] {
        gap: 14px;
    }

    .kpi-card__icon[b-wrcx9yw0g3] {
        width: 50px;
        height: 50px;
        min-width: 50px;
    }

    .kpi-card__icon svg[b-wrcx9yw0g3] {
        width: 25px;
        height: 25px;
    }
}


/* =========================================================
   INTEGRACIÓN CRUD TOOLBAR ESTÁNDAR - CORREGIDA
   ========================================================= */

.community-index[b-wrcx9yw0g3]  .crud-toolbar {
    margin-bottom: 24px;
}

.community-index[b-wrcx9yw0g3]  .crud-toolbar-filter-box {
    overflow: hidden;
}

.community-index[b-wrcx9yw0g3]  .crud-toolbar-filters {
    height: 100%;
}

.community-index[b-wrcx9yw0g3]  .crud-toolbar-filters select {
    appearance: auto;
    cursor: pointer;
    padding: 0 8px;
}

@media (max-width: 1100px) {
    .community-index[b-wrcx9yw0g3]  .crud-toolbar {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Properties/NewProperty.razor.rz.scp.css */
/* =========================================================
       NUEVO INMUEBLE - VISUAL MOCKUP
       ========================================================= */

.new-property-page[b-ff1n2nttrf] {
    width: 100%;
    min-height: 100vh;
    padding: 26px 32px 32px;
    box-sizing: border-box;
    background: #f7f9fd;
    color: #0f172a;
}

/* =========================================================
       SECCIÓN: HEADER
       ========================================================= */

.new-property-header[b-ff1n2nttrf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 26px;
}

.new-property-breadcrumb[b-ff1n2nttrf] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    color: #53657d;
    font-size: 0.86rem;
    font-weight: 800;
}

    .new-property-breadcrumb a[b-ff1n2nttrf] {
        color: #53657d;
        text-decoration: none;
    }

    .new-property-breadcrumb strong[b-ff1n2nttrf] {
        color: #0b63f6;
    }

.new-property-header h1[b-ff1n2nttrf] {
    margin: 0;
    color: #101828;
    font-size: 1.65rem;
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: -0.03em;
}

.new-property-header p[b-ff1n2nttrf] {
    margin: 9px 0 0;
    color: #53657d;
    font-size: 0.94rem;
    font-weight: 700;
}

.new-property-cancel-top[b-ff1n2nttrf] {
    min-width: 112px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 16px;
    color: #0b63f6;
    background: #ffffff;
    border: 1px solid #8fa2bf;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.86rem;
    font-weight: 900;
}

/* =========================================================
       SECCIÓN: PASOS
       ========================================================= */

.new-property-steps[b-ff1n2nttrf] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    margin-bottom: 0;
    border-bottom: 1px solid #cfd8e6;
}

.step-item[b-ff1n2nttrf] {
    height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: #0f172a;
    font-size: 0.84rem;
    font-weight: 900;
    cursor: pointer;
    white-space: nowrap;
}

    .step-item span[b-ff1n2nttrf] {
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        flex: 0 0 42px;
        border: 1.5px solid #b8c8de;
        border-radius: 999px;
        color: #0f172a;
        background: #ffffff;
        font-size: 0.9rem;
        font-weight: 900;
        box-shadow: 0 10px 24px rgba(15, 35, 70, 0.06);
    }

    .step-item.active span[b-ff1n2nttrf] {
        color: #ffffff;
        background: #0b63f6;
        border-color: #0b63f6;
        box-shadow: 0 12px 26px rgba(11, 99, 246, 0.28);
    }

    .step-item.completed span[b-ff1n2nttrf] {
        color: #16a34a;
        background: #ecfdf3;
        border-color: #22c55e;
    }

    .step-item.active span[b-ff1n2nttrf] {
        color: #ffffff;
        background: #0b63f6;
        border-color: #0b63f6;
    }
/* =========================================================
       SECCIÓN: LAYOUT
       ========================================================= */

.new-property-layout[b-ff1n2nttrf] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 28px;
    align-items: start;
}

.new-property-form-card[b-ff1n2nttrf],
.new-property-summary-card[b-ff1n2nttrf] {
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 7px;
    box-shadow: 0 10px 26px rgba(15, 35, 70, 0.025);
}

.new-property-form-card[b-ff1n2nttrf] {
    overflow: hidden;
}

.form-card-header[b-ff1n2nttrf] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 30px 24px 24px;
}

    .form-card-header h2[b-ff1n2nttrf],
    .new-property-summary-card h2[b-ff1n2nttrf] {
        margin: 0;
        color: #111827;
        font-size: 1.05rem;
        font-weight: 900;
    }

    .form-card-header .mud-icon-root[b-ff1n2nttrf] {
        color: #344054;
    }
/* =========================================================
       SECCIÓN: FORMULARIO
       ========================================================= */

.form-grid[b-ff1n2nttrf] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px 22px;
    padding: 0 24px 30px;
}

.field[b-ff1n2nttrf] {
    min-width: 0;
}

    .field.span-1[b-ff1n2nttrf] {
        grid-column: span 1;
    }

    .field.span-2[b-ff1n2nttrf] {
        grid-column: span 2;
    }

    .field label[b-ff1n2nttrf] {
        display: block;
        margin: 0 0 9px;
        color: #53657d;
        font-size: 0.82rem;
        font-weight: 900;
    }

        .field label strong[b-ff1n2nttrf] {
            color: #ef4444;
        }

    .field input[b-ff1n2nttrf],
    .field textarea[b-ff1n2nttrf],
    .select-visual[b-ff1n2nttrf],
    .input-icon[b-ff1n2nttrf] {
        width: 100%;
        border: 1px solid #cfd8e6;
        border-radius: 5px;
        background: #ffffff;
        color: #263a5a;
        box-sizing: border-box;
        font-size: 0.88rem;
        font-weight: 700;
        outline: none;
    }

    .field input[b-ff1n2nttrf],
    .select-visual[b-ff1n2nttrf],
    .input-icon[b-ff1n2nttrf] {
        height: 44px;
    }

    .field input[b-ff1n2nttrf] {
        padding: 0 13px;
    }

    .field textarea[b-ff1n2nttrf] {
        min-height: 92px;
        resize: none;
        padding: 13px;
        line-height: 1.5;
    }

    .field small[b-ff1n2nttrf] {
        display: block;
        margin-top: 8px;
        color: #53657d;
        font-size: 0.76rem;
        font-weight: 700;
    }

.select-visual[b-ff1n2nttrf],
.input-icon[b-ff1n2nttrf] {
    display: flex;
    align-items: center;
    padding-right: 12px;
}

    .select-visual input[b-ff1n2nttrf],
    .input-icon input[b-ff1n2nttrf] {
        flex: 1;
        border: 0;
        height: 100%;
        background: transparent;
    }

    .select-visual .mud-icon-root[b-ff1n2nttrf],
    .input-icon .mud-icon-root[b-ff1n2nttrf] {
        color: #344054;
    }
/* =========================================================
       SECCIÓN: ACCIONES
       ========================================================= */

.form-actions[b-ff1n2nttrf] {
    min-height: 82px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    border-top: 1px solid #dbe3ef;
}

.secondary-button[b-ff1n2nttrf],
.primary-button[b-ff1n2nttrf] {
    height: 42px;
    min-width: 106px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 0.84rem;
    font-weight: 900;
    cursor: pointer;
}

.secondary-button[b-ff1n2nttrf] {
    color: #344054;
    background: #ffffff;
    border: 1px solid #8fa2bf;
}

.primary-button[b-ff1n2nttrf] {
    min-width: 124px;
    color: #ffffff;
    background: #0b63f6;
    border: 1px solid #0b63f6;
    box-shadow: 0 12px 24px rgba(11, 99, 246, 0.20);
}
/* =========================================================
       SECCIÓN: RESUMEN
       ========================================================= */

.new-property-summary-card[b-ff1n2nttrf] {
    padding: 24px 20px;
}

.summary-image[b-ff1n2nttrf] {
    width: 100%;
    height: 118px;
    margin: 20px 0 22px;
    border-radius: 6px;
    object-fit: cover;
}

.summary-list[b-ff1n2nttrf] {
    display: grid;
    gap: 20px;
    padding-bottom: 24px;
    border-bottom: 1px solid #edf1f7;
}

.summary-row[b-ff1n2nttrf] {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) minmax(78px, 1fr);
    gap: 12px;
    align-items: start;
}

    .summary-row .mud-icon-root[b-ff1n2nttrf] {
        color: #53657d;
    }

    .summary-row span[b-ff1n2nttrf] {
        color: #53657d;
        font-size: 0.76rem;
        font-weight: 800;
    }

    .summary-row strong[b-ff1n2nttrf] {
        color: #111827;
        font-size: 0.76rem;
        line-height: 1.35;
        font-weight: 900;
    }

    .summary-row em[b-ff1n2nttrf] {
        display: inline-flex;
        align-items: center;
        min-height: 24px;
        padding: 0 10px;
        border-radius: 999px;
        color: #16a34a;
        background: #dcfce7;
        font-style: normal;
    }

.summary-alert[b-ff1n2nttrf] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 24px;
    padding: 16px;
    color: #0b63f6;
    background: #e8f2ff;
    border-radius: 5px;
    font-size: 0.82rem;
    line-height: 1.55;
    font-weight: 800;
}
/* =========================================================
       SECCIÓN: RESPONSIVE
       ========================================================= */

@media (max-width: 1300px) {
    .new-property-layout[b-ff1n2nttrf] {
        grid-template-columns: 1fr;
    }

    .new-property-summary-card[b-ff1n2nttrf] {
        max-width: none;
    }
}

@media (max-width: 960px) {
    .new-property-page[b-ff1n2nttrf] {
        padding: 20px;
    }

    .new-property-header[b-ff1n2nttrf],
    .form-actions[b-ff1n2nttrf] {
        flex-direction: column;
        align-items: stretch;
    }

    .new-property-steps[b-ff1n2nttrf] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .form-grid[b-ff1n2nttrf] {
        grid-template-columns: 1fr;
    }

    .field.span-1[b-ff1n2nttrf],
    .field.span-2[b-ff1n2nttrf] {
        grid-column: auto;
    }
}

/* =========================================================
   RESPONSIVE STEPPER FIX - Desktop horizontal / Mobile boxed
   ========================================================= */
@media (min-width: 769px) {
    .new-property-steps[b-ff1n2nttrf] {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0;
        margin: 28px 0 0;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .step-item[b-ff1n2nttrf] {
        position: relative;
        min-height: 58px;
        padding: 0 12px 14px;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .step-item.active[b-ff1n2nttrf] {
        border-color: transparent;
        background: transparent;
        box-shadow: none;
    }

    .step-item.active[b-ff1n2nttrf]::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -1px;
        height: 3px;
        border-radius: 999px;
        background: #2563eb;
    }

    .step-item span[b-ff1n2nttrf] {
        width: 36px;
        height: 36px;
        border-radius: 999px;
        border: 1px solid #cbd5e1;
        background: #ffffff;
        color: #0f172a;
        box-shadow: none;
    }

    .step-item.completed span[b-ff1n2nttrf] {
        border-color: #86efac;
        background: #ffffff;
        color: #16a34a;
    }

    .step-item.active span[b-ff1n2nttrf] {
        border-color: #2563eb;
        background: #2563eb;
        color: #ffffff;
        box-shadow: 0 10px 24px rgba(37, 99, 235, 0.22);
    }
}

@media (max-width: 768px) {
    .new-property-steps[b-ff1n2nttrf] {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        margin: 14px 0 18px;
    }

    .step-item[b-ff1n2nttrf] {
        justify-content: flex-start;
        min-height: 50px;
        padding: 8px 12px;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035);
    }

    .step-item.active[b-ff1n2nttrf],
    .step-item.completed[b-ff1n2nttrf] {
        background: #ffffff;
        border-color: #bfdbfe;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035);
    }

    .step-item.active[b-ff1n2nttrf]::after {
        display: none;
    }

    .step-item span[b-ff1n2nttrf] {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        border: 1px solid #cbd5e1;
        background: #ffffff;
        color: #0f172a;
    }

    .step-item.completed span[b-ff1n2nttrf] {
        border-color: #34d399;
        background: #ecfdf5;
        color: #16a34a;
    }

    .step-item.active span[b-ff1n2nttrf] {
        border-color: #2563eb;
        background: #2563eb;
        color: #ffffff;
    }
}

/* =========================================================
   STEPPER UNIFICADO - DESKTOP HORIZONTAL / MOBILE EN CAJAS
   ========================================================= */
@media (min-width: 769px) {
    .new-property-steps[b-ff1n2nttrf],
    .owner-steps[b-ff1n2nttrf],
    .summary-property-stepper[b-ff1n2nttrf],
    .unit-details-steps[b-ff1n2nttrf],
    .unit-feature-steps[b-ff1n2nttrf] {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #cfd8e6 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .step-item[b-ff1n2nttrf],
    .owner-step[b-ff1n2nttrf],
    .summary-property-step[b-ff1n2nttrf],
    .unit-details-step[b-ff1n2nttrf],
    .unit-feature-steps .step-item[b-ff1n2nttrf] {
        position: relative !important;
        height: 78px !important;
        min-height: 78px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 14px !important;
        padding: 0 12px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #0f172a !important;
        font-size: 0.84rem !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .step-item.active[b-ff1n2nttrf]::after,
    .owner-step.is-active[b-ff1n2nttrf]::after,
    .summary-property-step.is-active[b-ff1n2nttrf]::after,
    .unit-details-step.is-active[b-ff1n2nttrf]::after,
    .unit-feature-steps .step-item.active[b-ff1n2nttrf]::after {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        bottom: -1px !important;
        height: 3px !important;
        border-radius: 999px 999px 0 0 !important;
        background: #0b63f6 !important;
        display: block !important;
    }

    .step-item span[b-ff1n2nttrf],
    .owner-step-circle[b-ff1n2nttrf],
    .summary-property-step-number[b-ff1n2nttrf],
    .unit-details-step-circle[b-ff1n2nttrf],
    .unit-feature-steps .step-item span[b-ff1n2nttrf] {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        flex: 0 0 42px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1.5px solid #b8c8de !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        color: #0f172a !important;
        font-size: 0.9rem !important;
        font-weight: 900 !important;
        box-shadow: 0 10px 24px rgba(15, 35, 70, 0.06) !important;
    }

    .step-item.completed span[b-ff1n2nttrf],
    .owner-step.is-done .owner-step-circle[b-ff1n2nttrf],
    .summary-property-step.is-completed .summary-property-step-number[b-ff1n2nttrf],
    .unit-details-step.is-completed .unit-details-step-circle[b-ff1n2nttrf],
    .unit-feature-steps .step-item.completed span[b-ff1n2nttrf] {
        color: #16a34a !important;
        background: #ffffff !important;
        border-color: #86efac !important;
        box-shadow: none !important;
    }

    .step-item.active span[b-ff1n2nttrf],
    .owner-step.is-active .owner-step-circle[b-ff1n2nttrf],
    .summary-property-step.is-active .summary-property-step-number[b-ff1n2nttrf],
    .unit-details-step.is-active .unit-details-step-circle[b-ff1n2nttrf],
    .unit-feature-steps .step-item.active span[b-ff1n2nttrf] {
        color: #ffffff !important;
        background: #0b63f6 !important;
        border-color: #0b63f6 !important;
        box-shadow: 0 12px 26px rgba(11, 99, 246, 0.28) !important;
    }

    .step-item.active[b-ff1n2nttrf],
    .owner-step.is-active[b-ff1n2nttrf],
    .summary-property-step.is-active[b-ff1n2nttrf],
    .unit-details-step.is-active[b-ff1n2nttrf],
    .unit-feature-steps .step-item.active[b-ff1n2nttrf],
    .owner-step.is-active .owner-step-label[b-ff1n2nttrf],
    .summary-property-step.is-active .summary-property-step-text strong[b-ff1n2nttrf],
    .unit-details-step.is-active[b-ff1n2nttrf],
    .unit-feature-steps .step-item.active[b-ff1n2nttrf] {
        color: #0b63f6 !important;
        font-weight: 900 !important;
    }

    .summary-property-step-text span[b-ff1n2nttrf] {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .new-property-steps[b-ff1n2nttrf],
    .owner-steps[b-ff1n2nttrf],
    .summary-property-stepper[b-ff1n2nttrf],
    .unit-details-steps[b-ff1n2nttrf],
    .unit-feature-steps[b-ff1n2nttrf] {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        width: 100% !important;
        margin: 14px 0 18px !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .step-item[b-ff1n2nttrf],
    .owner-step[b-ff1n2nttrf],
    .summary-property-step[b-ff1n2nttrf],
    .unit-details-step[b-ff1n2nttrf],
    .unit-feature-steps .step-item[b-ff1n2nttrf] {
        position: relative !important;
        min-height: 50px !important;
        height: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 12px !important;
        padding: 8px 12px !important;
        border: 1px solid #bfdbfe !important;
        border-radius: 8px !important;
        background: #ffffff !important;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035) !important;
        color: #0f172a !important;
        font-size: 0.84rem !important;
        font-weight: 900 !important;
        line-height: 1.15 !important;
        white-space: normal !important;
    }

    .step-item.active[b-ff1n2nttrf]::after,
    .owner-step.is-active[b-ff1n2nttrf]::after,
    .summary-property-step.is-active[b-ff1n2nttrf]::after,
    .unit-details-step.is-active[b-ff1n2nttrf]::after,
    .unit-feature-steps .step-item.active[b-ff1n2nttrf]::after,
    .unit-details-step[b-ff1n2nttrf]::after {
        display: none !important;
        content: none !important;
    }

    .step-item span[b-ff1n2nttrf],
    .owner-step-circle[b-ff1n2nttrf],
    .summary-property-step-number[b-ff1n2nttrf],
    .unit-details-step-circle[b-ff1n2nttrf],
    .unit-feature-steps .step-item span[b-ff1n2nttrf] {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        flex: 0 0 34px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        color: #0f172a !important;
        font-size: 0.82rem !important;
        font-weight: 900 !important;
        box-shadow: none !important;
    }

    .step-item.completed span[b-ff1n2nttrf],
    .owner-step.is-done .owner-step-circle[b-ff1n2nttrf],
    .summary-property-step.is-completed .summary-property-step-number[b-ff1n2nttrf],
    .unit-details-step.is-completed .unit-details-step-circle[b-ff1n2nttrf],
    .unit-feature-steps .step-item.completed span[b-ff1n2nttrf] {
        border-color: #34d399 !important;
        background: #ecfdf5 !important;
        color: #16a34a !important;
    }

    .step-item.active span[b-ff1n2nttrf],
    .owner-step.is-active .owner-step-circle[b-ff1n2nttrf],
    .summary-property-step.is-active .summary-property-step-number[b-ff1n2nttrf],
    .unit-details-step.is-active .unit-details-step-circle[b-ff1n2nttrf],
    .unit-feature-steps .step-item.active span[b-ff1n2nttrf] {
        border-color: #2563eb !important;
        background: #2563eb !important;
        color: #ffffff !important;
    }

    .step-item.active[b-ff1n2nttrf],
    .owner-step.is-active[b-ff1n2nttrf],
    .summary-property-step.is-active[b-ff1n2nttrf],
    .unit-details-step.is-active[b-ff1n2nttrf],
    .unit-feature-steps .step-item.active[b-ff1n2nttrf] {
        color: #0b63f6 !important;
    }

    .summary-property-step-text span[b-ff1n2nttrf] {
        display: none !important;
    }
}
/* /Pages/Properties/OwnerResponsibleProperty.razor.rz.scp.css */
/* =========================================================
   BASE PAGE
   ========================================================= */
.owner-page[b-wfe4ou9hsa] {
    min-height: 100vh;
    padding: 18px 18px 14px;
    background: #ffffff;
    color: #111827;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.owner-topbar[b-wfe4ou9hsa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.owner-breadcrumb[b-wfe4ou9hsa] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    color: #213762;
    font-size: 14px;
    font-weight: 600;
}

.owner-breadcrumb i[b-wfe4ou9hsa] {
    color: #42577e;
    font-size: 11px;
}

.owner-breadcrumb strong[b-wfe4ou9hsa] {
    color: #075bed;
    font-weight: 800;
}

.owner-cancel[b-wfe4ou9hsa] {
    height: 46px;
    min-width: 126px;
    border: 1px solid #7d8bab;
    border-radius: 7px;
    background: #ffffff;
    color: #075bed;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-weight: 800;
    box-shadow: 0 1px 1px rgba(16, 24, 40, .03);
}

.owner-title-area[b-wfe4ou9hsa] {
    margin-bottom: 32px;
}

.owner-title-area h1[b-wfe4ou9hsa] {
    margin: 0 0 6px;
    font-size: 29px;
    line-height: 1.05;
    font-weight: 900;
    letter-spacing: -.045em;
}

.owner-title-area p[b-wfe4ou9hsa] {
    margin: 0;
    color: #213762;
    font-size: 15px;
    font-weight: 600;
}

/* =========================================================
   STEPS
   ========================================================= */
.owner-steps[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: 1fr 1.15fr 1fr 1.3fr .95fr;
    align-items: center;
    column-gap: 34px;
    margin: 0 22px 0 24px;
}

.owner-step[b-wfe4ou9hsa] {
    position: relative;
    height: 62px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: #253b66;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.owner-step.is-active[b-wfe4ou9hsa]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: #0b63f6;
}

.owner-step-circle[b-wfe4ou9hsa] {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: 1.5px solid #c8d2e4;
    background: #ffffff;
    color: #0f2447;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 800;
    flex: 0 0 auto;
}

.owner-step.is-done .owner-step-circle[b-wfe4ou9hsa] {
    border-color: #8be0b0;
    color: #20b368;
    font-size: 22px;
}

.owner-step.is-active .owner-step-circle[b-wfe4ou9hsa] {
    border-color: #0b63f6;
    background: #075bed;
    color: #ffffff;
    box-shadow: 0 12px 22px rgba(7, 91, 237, .2);
}

.owner-step.is-active .owner-step-label[b-wfe4ou9hsa] {
    color: #075bed;
    font-weight: 900;
}

/* =========================================================
   LAYOUT
   ========================================================= */
.owner-grid[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 350px;
    gap: 34px;
    align-items: start;
}

.owner-card[b-wfe4ou9hsa] {
    border: 1px solid #dfe6f2;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .02);
}

.owner-form-card[b-wfe4ou9hsa] {
    min-height: 796px;
    padding: 28px 26px 24px;
}

.owner-card-title[b-wfe4ou9hsa] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 26px;
}

.owner-card-icon[b-wfe4ou9hsa] {
    width: 20px;
    height: 20px;
    color: #0f2447;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-top: 2px;
    font-size: 18px;
}

.owner-card-title h2[b-wfe4ou9hsa],
.owner-summary-card h2[b-wfe4ou9hsa],
.owner-progress-card h2[b-wfe4ou9hsa] {
    margin: 0;
    color: #111827;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: -.025em;
}

.owner-card-title p[b-wfe4ou9hsa] {
    margin: 7px 0 0;
    color: #33486d;
    font-size: 13px;
    font-weight: 600;
}

/* =========================================================
   FORM
   ========================================================= */
.owner-choice-row[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 54px;
    margin-bottom: 34px;
}

.owner-choice[b-wfe4ou9hsa] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    color: #152947;
}

.owner-radio[b-wfe4ou9hsa] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1.5px solid #aebbd0;
    margin-top: 2px;
    position: relative;
    flex: 0 0 auto;
}

.owner-choice.is-selected .owner-radio[b-wfe4ou9hsa] {
    border: 2px solid #1264ff;
}

.owner-choice.is-selected .owner-radio[b-wfe4ou9hsa]::after {
    content: "";
    position: absolute;
    inset: 4px;
    border-radius: 50%;
    background: #1264ff;
}

.owner-choice strong[b-wfe4ou9hsa] {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    font-weight: 900;
}

.owner-choice small[b-wfe4ou9hsa] {
    color: #34496e;
    font-size: 13px;
    font-weight: 600;
}

.owner-section-heading[b-wfe4ou9hsa] {
    margin: 0 0 18px;
}

.owner-section-heading h3[b-wfe4ou9hsa] {
    margin: 0 0 7px;
    color: #111827;
    font-size: 17px;
    font-weight: 900;
    letter-spacing: -.025em;
}

.owner-section-heading p[b-wfe4ou9hsa] {
    margin: 0;
    color: #34496e;
    font-size: 13px;
    font-weight: 600;
}

.owner-form-grid[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px 32px;
    margin-bottom: 18px;
}

.owner-contact-grid[b-wfe4ou9hsa] {
    grid-template-columns: 440px 154px;
    align-items: end;
    margin-bottom: 26px;
}

.owner-field[b-wfe4ou9hsa] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: #263b64;
    font-size: 13px;
    font-weight: 700;
}

.owner-field b[b-wfe4ou9hsa] {
    color: #f13658;
}

.owner-input[b-wfe4ou9hsa],
.owner-textarea[b-wfe4ou9hsa] {
    min-height: 38px;
    width: 100%;
    border: 1px solid #cfd8e7;
    border-radius: 5px;
    background: #ffffff;
    color: #17233c;
    display: flex;
    align-items: center;
    padding: 0 15px;
    font-size: 14px;
    font-weight: 700;
    box-shadow: inset 0 1px 1px rgba(16, 24, 40, .02);
}

.owner-select[b-wfe4ou9hsa],
.owner-input-info[b-wfe4ou9hsa],
.owner-input-with-icon[b-wfe4ou9hsa] {
    justify-content: space-between;
    gap: 12px;
}

.owner-input-with-icon i[b-wfe4ou9hsa] {
    color: #2e4164;
    font-size: 17px;
}

.owner-input-with-icon span[b-wfe4ou9hsa] {
    flex: 1;
}

.owner-input em[b-wfe4ou9hsa] {
    color: #61708c;
    font-style: normal;
    font-size: 13px;
}

.owner-new-contact[b-wfe4ou9hsa] {
    height: 40px;
    border: 1px solid #0b63f6;
    border-radius: 5px;
    background: #ffffff;
    color: #075bed;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 900;
}

.owner-new-contact i[b-wfe4ou9hsa] {
    font-size: 17px;
}

.owner-address-heading[b-wfe4ou9hsa] {
    margin-top: 2px;
}

.owner-full-field[b-wfe4ou9hsa] {
    margin-top: 10px;
}

.owner-textarea[b-wfe4ou9hsa] {
    height: 42px;
    resize: none;
    padding-top: 11px;
    align-items: flex-start;
    line-height: 1.35;
    font-family: inherit;
}

.owner-check[b-wfe4ou9hsa] {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 14px;
    color: #253b66;
    font-size: 13px;
    font-weight: 700;
}

.owner-check span[b-wfe4ou9hsa] {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    background: #1264ff;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
}

.owner-actions[b-wfe4ou9hsa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 34px;
}

.owner-secondary[b-wfe4ou9hsa],
.owner-primary[b-wfe4ou9hsa] {
    height: 44px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-size: 14px;
    font-weight: 800;
}

.owner-secondary[b-wfe4ou9hsa] {
    min-width: 136px;
    border: 1px solid #7d8bab;
    background: #ffffff;
    color: #1c335d;
}

.owner-primary[b-wfe4ou9hsa] {
    min-width: 146px;
    border: 1px solid #075bed;
    background: #075bed;
    color: #ffffff;
    box-shadow: 0 10px 20px rgba(7, 91, 237, .2);
}

/* =========================================================
   SIDEBAR
   ========================================================= */
.owner-sidebar[b-wfe4ou9hsa] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.owner-summary-card[b-wfe4ou9hsa],
.owner-progress-card[b-wfe4ou9hsa] {
    padding: 24px 22px;
}

.owner-unit-head[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: 144px 1fr;
    gap: 18px;
    align-items: center;
    margin-top: 26px;
}

.owner-unit-head img[b-wfe4ou9hsa] {
    width: 144px;
    height: 114px;
    border-radius: 8px;
    object-fit: cover;
    box-shadow: 0 12px 24px rgba(16, 24, 40, .13);
}

.owner-unit-head h3[b-wfe4ou9hsa] {
    margin: 0 0 10px;
    color: #111827;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: -.02em;
}

.owner-unit-head span[b-wfe4ou9hsa] {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 12px;
    border-radius: 6px;
    background: #d8f6e2;
    color: #1d8554;
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 12px;
}

.owner-unit-head p[b-wfe4ou9hsa] {
    margin: 0 0 9px;
    color: #34496e;
    font-size: 13px;
    font-weight: 700;
}

.owner-summary-list[b-wfe4ou9hsa] {
    margin: 30px 0 28px;
}

.owner-summary-list div[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    margin-bottom: 22px;
}

.owner-summary-list dt[b-wfe4ou9hsa] {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #34496e;
    font-size: 13px;
    font-weight: 700;
}

.owner-summary-list dt i[b-wfe4ou9hsa] {
    width: 15px;
    color: #455b82;
    font-size: 15px;
}

.owner-summary-list dd[b-wfe4ou9hsa] {
    margin: 0;
    color: #18243c;
    font-size: 13px;
    font-weight: 900;
}

.owner-detail-button[b-wfe4ou9hsa] {
    width: 100%;
    height: 40px;
    border: 1px solid #075bed;
    border-radius: 5px;
    background: #ffffff;
    color: #075bed;
    font-size: 13px;
    font-weight: 900;
}

.owner-progress-card h2[b-wfe4ou9hsa] {
    font-size: 17px;
    margin-bottom: 22px;
}

.owner-progress-line[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: center;
    margin-bottom: 23px;
}

.owner-progress-line span[b-wfe4ou9hsa] {
    height: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, #29b965 0%, #29b965 83%, #e1e7f0 83%, #e1e7f0 100%);
}

.owner-progress-line strong[b-wfe4ou9hsa] {
    color: #13213a;
    font-size: 13px;
    font-weight: 900;
}

.owner-progress-list[b-wfe4ou9hsa] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.owner-progress-list li[b-wfe4ou9hsa] {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #33496f;
    font-size: 13px;
    font-weight: 700;
}

.owner-progress-list li span[b-wfe4ou9hsa] {
    width: 16px;
    height: 16px;
    border-radius: 999px;
    border: 1.5px solid #b8c5d8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.owner-progress-list li.is-done span[b-wfe4ou9hsa] {
    background: #28b96b;
    border-color: #28b96b;
    color: #ffffff;
    font-size: 10px;
}

.owner-progress-list li.is-active span[b-wfe4ou9hsa] {
    border-color: #1264ff;
    background: #1264ff;
}

.owner-progress-list li.is-active span i[b-wfe4ou9hsa] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #ffffff;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1180px) {
    .owner-grid[b-wfe4ou9hsa] {
        grid-template-columns: 1fr;
    }

    .owner-sidebar[b-wfe4ou9hsa] {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 860px) {
    .owner-page[b-wfe4ou9hsa] {
        padding: 16px;
    }

    .owner-steps[b-wfe4ou9hsa],
    .owner-form-grid[b-wfe4ou9hsa],
    .owner-choice-row[b-wfe4ou9hsa],
    .owner-sidebar[b-wfe4ou9hsa] {
        grid-template-columns: 1fr;
    }

    .owner-contact-grid[b-wfe4ou9hsa] {
        grid-template-columns: 1fr;
    }

    .owner-step[b-wfe4ou9hsa] {
        height: auto;
        padding: 8px 0;
    }

    .owner-step.is-active[b-wfe4ou9hsa]::after {
        display: none;
    }
}


/* =========================================================
   EVENTOS / BOTONES CLICABLES SIN ALTERAR EL MOCKUP
   ========================================================= */
.owner-step[b-wfe4ou9hsa],
.owner-choice[b-wfe4ou9hsa] {
    border: 0;
    background: transparent;
    font: inherit;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.owner-input[role="button"][b-wfe4ou9hsa] {
    cursor: pointer;
}

.owner-inline-icon-button[b-wfe4ou9hsa] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.owner-check[b-wfe4ou9hsa] {
    position: relative;
    cursor: pointer;
}

.owner-check-input[b-wfe4ou9hsa] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

/* =========================================================
   RESPONSIVE STEPPER FIX - Desktop horizontal / Mobile boxed
   ========================================================= */
@media (min-width: 769px) {
    .owner-steps[b-wfe4ou9hsa] {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0;
        margin: 28px 0 0;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .owner-step[b-wfe4ou9hsa] {
        position: relative;
        min-height: 58px;
        padding: 0 12px 14px;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .owner-step.is-active[b-wfe4ou9hsa] {
        border-color: transparent;
        background: transparent;
        box-shadow: none;
    }

    .owner-step.is-active[b-wfe4ou9hsa]::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -1px;
        height: 3px;
        border-radius: 999px;
        background: #2563eb;
    }

    .owner-step-circle[b-wfe4ou9hsa] {
        width: 36px;
        height: 36px;
        border-radius: 999px;
        border: 1px solid #cbd5e1;
        background: #ffffff;
        color: #0f172a;
        box-shadow: none;
    }

    .owner-step.is-done .owner-step-circle[b-wfe4ou9hsa] {
        border-color: #86efac;
        background: #ffffff;
        color: #16a34a;
    }

    .owner-step.is-active .owner-step-circle[b-wfe4ou9hsa] {
        border-color: #2563eb;
        background: #2563eb;
        color: #ffffff;
        box-shadow: 0 10px 24px rgba(37, 99, 235, 0.22);
    }
}

@media (max-width: 768px) {
    .owner-steps[b-wfe4ou9hsa] {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        margin: 14px 0 18px;
    }

    .owner-step[b-wfe4ou9hsa] {
        justify-content: flex-start;
        min-height: 50px;
        padding: 8px 12px;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035);
    }

    .owner-step.is-active[b-wfe4ou9hsa],
    .owner-step.is-done[b-wfe4ou9hsa] {
        background: #ffffff;
        border-color: #bfdbfe;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035);
    }

    .owner-step.is-active[b-wfe4ou9hsa]::after {
        display: none;
    }

    .owner-step-circle[b-wfe4ou9hsa] {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        border: 1px solid #cbd5e1;
        background: #ffffff;
        color: #0f172a;
    }

    .owner-step.is-done .owner-step-circle[b-wfe4ou9hsa] {
        border-color: #34d399;
        background: #ecfdf5;
        color: #16a34a;
    }

    .owner-step.is-active .owner-step-circle[b-wfe4ou9hsa] {
        border-color: #2563eb;
        background: #2563eb;
        color: #ffffff;
    }
}

/* =========================================================
   STEPPER UNIFICADO - DESKTOP HORIZONTAL / MOBILE EN CAJAS
   ========================================================= */
@media (min-width: 769px) {
    .new-property-steps[b-wfe4ou9hsa],
    .owner-steps[b-wfe4ou9hsa],
    .summary-property-stepper[b-wfe4ou9hsa],
    .unit-details-steps[b-wfe4ou9hsa],
    .unit-feature-steps[b-wfe4ou9hsa] {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #cfd8e6 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .step-item[b-wfe4ou9hsa],
    .owner-step[b-wfe4ou9hsa],
    .summary-property-step[b-wfe4ou9hsa],
    .unit-details-step[b-wfe4ou9hsa],
    .unit-feature-steps .step-item[b-wfe4ou9hsa] {
        position: relative !important;
        height: 78px !important;
        min-height: 78px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 14px !important;
        padding: 0 12px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #0f172a !important;
        font-size: 0.84rem !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .step-item.active[b-wfe4ou9hsa]::after,
    .owner-step.is-active[b-wfe4ou9hsa]::after,
    .summary-property-step.is-active[b-wfe4ou9hsa]::after,
    .unit-details-step.is-active[b-wfe4ou9hsa]::after,
    .unit-feature-steps .step-item.active[b-wfe4ou9hsa]::after {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        bottom: -1px !important;
        height: 3px !important;
        border-radius: 999px 999px 0 0 !important;
        background: #0b63f6 !important;
        display: block !important;
    }

    .step-item span[b-wfe4ou9hsa],
    .owner-step-circle[b-wfe4ou9hsa],
    .summary-property-step-number[b-wfe4ou9hsa],
    .unit-details-step-circle[b-wfe4ou9hsa],
    .unit-feature-steps .step-item span[b-wfe4ou9hsa] {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        flex: 0 0 42px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1.5px solid #b8c8de !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        color: #0f172a !important;
        font-size: 0.9rem !important;
        font-weight: 900 !important;
        box-shadow: 0 10px 24px rgba(15, 35, 70, 0.06) !important;
    }

    .step-item.completed span[b-wfe4ou9hsa],
    .owner-step.is-done .owner-step-circle[b-wfe4ou9hsa],
    .summary-property-step.is-completed .summary-property-step-number[b-wfe4ou9hsa],
    .unit-details-step.is-completed .unit-details-step-circle[b-wfe4ou9hsa],
    .unit-feature-steps .step-item.completed span[b-wfe4ou9hsa] {
        color: #16a34a !important;
        background: #ffffff !important;
        border-color: #86efac !important;
        box-shadow: none !important;
    }

    .step-item.active span[b-wfe4ou9hsa],
    .owner-step.is-active .owner-step-circle[b-wfe4ou9hsa],
    .summary-property-step.is-active .summary-property-step-number[b-wfe4ou9hsa],
    .unit-details-step.is-active .unit-details-step-circle[b-wfe4ou9hsa],
    .unit-feature-steps .step-item.active span[b-wfe4ou9hsa] {
        color: #ffffff !important;
        background: #0b63f6 !important;
        border-color: #0b63f6 !important;
        box-shadow: 0 12px 26px rgba(11, 99, 246, 0.28) !important;
    }

    .step-item.active[b-wfe4ou9hsa],
    .owner-step.is-active[b-wfe4ou9hsa],
    .summary-property-step.is-active[b-wfe4ou9hsa],
    .unit-details-step.is-active[b-wfe4ou9hsa],
    .unit-feature-steps .step-item.active[b-wfe4ou9hsa],
    .owner-step.is-active .owner-step-label[b-wfe4ou9hsa],
    .summary-property-step.is-active .summary-property-step-text strong[b-wfe4ou9hsa],
    .unit-details-step.is-active[b-wfe4ou9hsa],
    .unit-feature-steps .step-item.active[b-wfe4ou9hsa] {
        color: #0b63f6 !important;
        font-weight: 900 !important;
    }

    .summary-property-step-text span[b-wfe4ou9hsa] {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .new-property-steps[b-wfe4ou9hsa],
    .owner-steps[b-wfe4ou9hsa],
    .summary-property-stepper[b-wfe4ou9hsa],
    .unit-details-steps[b-wfe4ou9hsa],
    .unit-feature-steps[b-wfe4ou9hsa] {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        width: 100% !important;
        margin: 14px 0 18px !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .step-item[b-wfe4ou9hsa],
    .owner-step[b-wfe4ou9hsa],
    .summary-property-step[b-wfe4ou9hsa],
    .unit-details-step[b-wfe4ou9hsa],
    .unit-feature-steps .step-item[b-wfe4ou9hsa] {
        position: relative !important;
        min-height: 50px !important;
        height: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 12px !important;
        padding: 8px 12px !important;
        border: 1px solid #bfdbfe !important;
        border-radius: 8px !important;
        background: #ffffff !important;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035) !important;
        color: #0f172a !important;
        font-size: 0.84rem !important;
        font-weight: 900 !important;
        line-height: 1.15 !important;
        white-space: normal !important;
    }

    .step-item.active[b-wfe4ou9hsa]::after,
    .owner-step.is-active[b-wfe4ou9hsa]::after,
    .summary-property-step.is-active[b-wfe4ou9hsa]::after,
    .unit-details-step.is-active[b-wfe4ou9hsa]::after,
    .unit-feature-steps .step-item.active[b-wfe4ou9hsa]::after,
    .unit-details-step[b-wfe4ou9hsa]::after {
        display: none !important;
        content: none !important;
    }

    .step-item span[b-wfe4ou9hsa],
    .owner-step-circle[b-wfe4ou9hsa],
    .summary-property-step-number[b-wfe4ou9hsa],
    .unit-details-step-circle[b-wfe4ou9hsa],
    .unit-feature-steps .step-item span[b-wfe4ou9hsa] {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        flex: 0 0 34px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        color: #0f172a !important;
        font-size: 0.82rem !important;
        font-weight: 900 !important;
        box-shadow: none !important;
    }

    .step-item.completed span[b-wfe4ou9hsa],
    .owner-step.is-done .owner-step-circle[b-wfe4ou9hsa],
    .summary-property-step.is-completed .summary-property-step-number[b-wfe4ou9hsa],
    .unit-details-step.is-completed .unit-details-step-circle[b-wfe4ou9hsa],
    .unit-feature-steps .step-item.completed span[b-wfe4ou9hsa] {
        border-color: #34d399 !important;
        background: #ecfdf5 !important;
        color: #16a34a !important;
    }

    .step-item.active span[b-wfe4ou9hsa],
    .owner-step.is-active .owner-step-circle[b-wfe4ou9hsa],
    .summary-property-step.is-active .summary-property-step-number[b-wfe4ou9hsa],
    .unit-details-step.is-active .unit-details-step-circle[b-wfe4ou9hsa],
    .unit-feature-steps .step-item.active span[b-wfe4ou9hsa] {
        border-color: #2563eb !important;
        background: #2563eb !important;
        color: #ffffff !important;
    }

    .step-item.active[b-wfe4ou9hsa],
    .owner-step.is-active[b-wfe4ou9hsa],
    .summary-property-step.is-active[b-wfe4ou9hsa],
    .unit-details-step.is-active[b-wfe4ou9hsa],
    .unit-feature-steps .step-item.active[b-wfe4ou9hsa] {
        color: #0b63f6 !important;
    }

    .summary-property-step-text span[b-wfe4ou9hsa] {
        display: none !important;
    }
}

/* =========================================================
   NUEVO CONTACTO MODAL - SOLO VISUAL
   ========================================================= */
.owner-modal-backdrop[b-wfe4ou9hsa] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(15, 23, 42, 0.52);
    backdrop-filter: blur(4px);
}

.owner-contact-modal[b-wfe4ou9hsa] {
    width: min(650px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    background: #ffffff;
    border: 1px solid #d7e1ef;
    border-radius: 2px;
    box-shadow: 0 30px 80px rgba(15, 23, 42, 0.32);
}

.owner-modal-header[b-wfe4ou9hsa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 30px 30px 18px;
}

.owner-modal-header h2[b-wfe4ou9hsa] {
    margin: 0 0 16px;
    color: #0f172a;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.1;
}

.owner-modal-header p[b-wfe4ou9hsa] {
    margin: 0;
    color: #263b66;
    font-size: 14px;
    font-weight: 600;
}

.owner-modal-close[b-wfe4ou9hsa] {
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: #172b4d;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    cursor: pointer;
}

.owner-modal-grid[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 24px;
    padding: 0 30px 24px;
}

.owner-modal-field[b-wfe4ou9hsa] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: #263b66;
    font-size: 13px;
    font-weight: 800;
}

.owner-modal-field b[b-wfe4ou9hsa] {
    color: #ef3340;
}

.owner-modal-field input[b-wfe4ou9hsa],
.owner-modal-field select[b-wfe4ou9hsa],
.owner-modal-field textarea[b-wfe4ou9hsa] {
    width: 100%;
    height: 42px;
    border: 1px solid #cdd8e8;
    border-radius: 5px;
    background: #ffffff;
    color: #111827;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    outline: none;
    padding: 0 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

.owner-modal-field textarea[b-wfe4ou9hsa] {
    min-height: 70px;
    height: 70px;
    resize: vertical;
    padding-top: 12px;
    line-height: 1.35;
}

.owner-modal-field small[b-wfe4ou9hsa] {
    color: #5b6f92;
    font-size: 13px;
    font-weight: 700;
}

.owner-modal-full[b-wfe4ou9hsa] {
    grid-column: 1 / -1;
}

.owner-phone-input[b-wfe4ou9hsa],
.owner-date-input[b-wfe4ou9hsa] {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    height: 42px;
    border: 1px solid #cdd8e8;
    border-radius: 5px;
    overflow: hidden;
    background: #ffffff;
}

.owner-date-input[b-wfe4ou9hsa] {
    grid-template-columns: minmax(0, 1fr) 48px;
}

.owner-phone-input button[b-wfe4ou9hsa],
.owner-date-input button[b-wfe4ou9hsa] {
    border: 0;
    background: #ffffff;
    color: #263b66;
    font-size: 15px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.owner-phone-input button[b-wfe4ou9hsa] {
    border-right: 1px solid #cdd8e8;
}

.owner-date-input button[b-wfe4ou9hsa] {
    border-left: 1px solid #cdd8e8;
}

.owner-phone-input input[b-wfe4ou9hsa],
.owner-date-input input[b-wfe4ou9hsa] {
    height: 40px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.owner-modal-actions[b-wfe4ou9hsa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 24px 30px 30px;
    border-top: 1px solid #e4ebf5;
}

.owner-modal-cancel[b-wfe4ou9hsa],
.owner-modal-save[b-wfe4ou9hsa] {
    height: 42px;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 24px;
    font-size: 14px;
    font-weight: 800;
}

.owner-modal-cancel[b-wfe4ou9hsa] {
    min-width: 104px;
    border: 1px solid #8796b2;
    background: #ffffff;
    color: #243856;
}

.owner-modal-save[b-wfe4ou9hsa] {
    min-width: 170px;
    border: 1px solid #075bed;
    background: #075bed;
    color: #ffffff;
    box-shadow: 0 12px 24px rgba(7, 91, 237, 0.2);
}

@media (max-width: 768px) {
    .owner-modal-backdrop[b-wfe4ou9hsa] {
        align-items: flex-start;
        padding: 16px;
        overflow-y: auto;
    }

    .owner-modal-header[b-wfe4ou9hsa],
    .owner-modal-grid[b-wfe4ou9hsa],
    .owner-modal-actions[b-wfe4ou9hsa] {
        padding-left: 20px;
        padding-right: 20px;
    }

    .owner-modal-grid[b-wfe4ou9hsa] {
        grid-template-columns: 1fr;
    }

    .owner-modal-actions[b-wfe4ou9hsa] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .owner-modal-cancel[b-wfe4ou9hsa],
    .owner-modal-save[b-wfe4ou9hsa] {
        width: 100%;
    }
}
/* /Pages/Properties/Parkings/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TOWERS
   Estándar visual HABYTAL basado en Blocks.
   ========================================================= */

.blocks-page[b-vok236vbe7] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-vok236vbe7] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-vok236vbe7] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-vok236vbe7] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-vok236vbe7] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-vok236vbe7] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-vok236vbe7] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-vok236vbe7] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-vok236vbe7] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-vok236vbe7] {
    text-align: center !important;
}

.blocks-name-cell[b-vok236vbe7] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-vok236vbe7] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-vok236vbe7] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-vok236vbe7] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-vok236vbe7] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-vok236vbe7] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-vok236vbe7] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-vok236vbe7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-vok236vbe7] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-vok236vbe7] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-vok236vbe7] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Properties/ParkingZones/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TOWERS
   Estándar visual HABYTAL basado en Blocks.
   ========================================================= */

.blocks-page[b-1w09aizyou] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-1w09aizyou] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-1w09aizyou] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-1w09aizyou] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-1w09aizyou] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-1w09aizyou] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-1w09aizyou] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-1w09aizyou] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-1w09aizyou] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-1w09aizyou] {
    text-align: center !important;
}

.blocks-name-cell[b-1w09aizyou] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-1w09aizyou] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-1w09aizyou] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-1w09aizyou] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-1w09aizyou] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-1w09aizyou] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-1w09aizyou] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-1w09aizyou] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-1w09aizyou] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-1w09aizyou] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-1w09aizyou] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Properties/Properties.razor.rz.scp.css */
/* =========================================================
   SECCIÓN: CONTENEDOR PRINCIPAL
   ========================================================= */

.properties-page[b-o6yczummqn] {
    width: 100%;
    min-height: 100vh;
    padding: 28px 32px 32px;
    box-sizing: border-box;
    background: #f7f9fd;
    color: #0f172a;
}
/* =========================================================
   BOTÓN NUEVO INMUEBLE
   ========================================================= */

.properties-primary-button[b-o6yczummqn] {
    height: 52px;
    min-width: 180px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 22px;
    border: 0;
    border-radius: 12px;
    background: #0b63f6;
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 0.92rem;
    font-weight: 800;
    box-shadow: 0 14px 30px rgba(11, 99, 246, 0.22);
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
    cursor: pointer;
}

    .properties-primary-button:hover[b-o6yczummqn] {
        background: #0957d9;
        color: #ffffff !important;
        transform: translateY(-2px);
        box-shadow: 0 18px 34px rgba(11, 99, 246, 0.28);
    }

    .properties-primary-button:active[b-o6yczummqn] {
        transform: translateY(0);
    }

    .properties-primary-button span[b-o6yczummqn] {
        font-size: 1.2rem;
        line-height: 1;
    }
/* =========================================================
   SECCIÓN: HEADER
   ========================================================= */

.properties-header[b-o6yczummqn] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 28px;
}

.properties-header h1[b-o6yczummqn] {
    margin: 0;
    color: #0f172a;
    font-size: 1.75rem;
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: -0.035em;
}

.properties-header p[b-o6yczummqn] {
    margin: 8px 0 0;
    color: #475467;
    font-size: 0.96rem;
    font-weight: 600;
}

.properties-primary-button[b-o6yczummqn] {
    height: 52px;
    min-width: 176px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 22px;
    border: 0;
    border-radius: 10px;
    background: #0b63f6;
    color: #ffffff;
    box-shadow: 0 13px 25px rgba(11, 99, 246, 0.22);
    font-size: 0.92rem;
    font-weight: 800;
    cursor: pointer;
}

.properties-primary-button span[b-o6yczummqn] {
    font-size: 1.35rem;
    font-weight: 500;
}

/* =========================================================
   SECCIÓN: KPIS
   ========================================================= */

.properties-kpi-grid[b-o6yczummqn] {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.properties-kpi-card[b-o6yczummqn] {
    min-height: 116px;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 20px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(15, 35, 70, 0.035);
}

.properties-kpi-icon[b-o6yczummqn] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 0;
    font-weight: 900;
}

.properties-kpi-icon.blue[b-o6yczummqn] {
    color: #0b63f6;
    background: #e8f2ff;
}

.properties-kpi-icon.green[b-o6yczummqn] {
    color: #16a34a;
    background: #e8f8ee;
}

.properties-kpi-icon.purple[b-o6yczummqn] {
    color: #7c3aed;
    background: #f0e6ff;
}

.properties-kpi-icon.amber[b-o6yczummqn] {
    color: #f59e0b;
    background: #fff2df;
}

.properties-kpi-card span[b-o6yczummqn] {
    display: block;
    color: #111827;
    font-size: 0.82rem;
    font-weight: 900;
}

.properties-kpi-card strong[b-o6yczummqn] {
    display: block;
    margin-top: 6px;
    color: #0f172a;
    font-size: 1.72rem;
    line-height: 1;
    font-weight: 900;
}

.properties-kpi-card small[b-o6yczummqn] {
    display: block;
    margin-top: 10px;
    color: #667085;
    font-size: 0.76rem;
    font-weight: 700;
}

/* =========================================================
   SECCIÓN: GRID DE CONTENIDO
   ========================================================= */

.properties-content-grid[b-o6yczummqn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 402px;
    gap: 22px;
    align-items: start;
}

.properties-list-card[b-o6yczummqn],
.properties-detail-panel[b-o6yczummqn] {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(15, 35, 70, 0.035);
}

/* =========================================================
   SECCIÓN: LISTADO
   ========================================================= */

.properties-list-card[b-o6yczummqn] {
    min-width: 0;
    overflow: hidden;
}

.properties-list-header[b-o6yczummqn] {
    padding: 26px 24px 0;
}

.properties-list-header h2[b-o6yczummqn],
.detail-panel-header h2[b-o6yczummqn] {
    margin: 0;
    color: #111827;
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: -0.015em;
}

.properties-toolbar[b-o6yczummqn] {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 160px 160px 132px;
    gap: 14px;
    padding: 22px 24px;
}

.properties-search[b-o6yczummqn] {
    position: relative;
}

.properties-search span[b-o6yczummqn] {
    position: absolute;
    top: 50%;
    left: 14px;
    color: #98a2b3;
    transform: translateY(-50%);
}

.properties-search input[b-o6yczummqn] {
    padding-left: 40px !important;
}

.properties-toolbar input[b-o6yczummqn],
.properties-toolbar select[b-o6yczummqn],
.properties-filter-button[b-o6yczummqn] {
    width: 100%;
    height: 46px;
    border: 1px solid #d7dfeb;
    border-radius: 8px;
    background: #ffffff;
    color: #344054;
    font-size: 0.82rem;
    font-weight: 700;
    outline: 0;
}

.properties-toolbar input[b-o6yczummqn],
.properties-toolbar select[b-o6yczummqn] {
    padding: 0 14px;
}

.properties-filter-button[b-o6yczummqn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    cursor: pointer;
}

.properties-table-wrapper[b-o6yczummqn] {
    overflow-x: auto;
}

.properties-table[b-o6yczummqn] {
    width: 100%;
    min-width: 880px;
    border-collapse: collapse;
}

.properties-table th[b-o6yczummqn] {
    padding: 14px 18px;
    color: #0f172a;
    font-size: 0.76rem;
    font-weight: 900;
    text-align: left;
}

.properties-table td[b-o6yczummqn] {
    padding: 15px 18px;
    border-top: 1px solid #edf1f7;
    color: #1f2a44;
    font-size: 0.82rem;
    font-weight: 700;
    vertical-align: middle;
}

.properties-table tr.selected[b-o6yczummqn] {
    background: #f4f9ff;
}

.property-main-cell[b-o6yczummqn] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.property-main-cell img[b-o6yczummqn] {
    width: 56px;
    height: 56px;
    min-width: 56px;
    border-radius: 7px;
    object-fit: cover;
    background: #dbeafe;
}

.property-main-cell strong[b-o6yczummqn] {
    display: block;
    color: #111827;
    font-size: 0.84rem;
    font-weight: 900;
}

.property-main-cell span[b-o6yczummqn] {
    display: block;
    margin-top: 5px;
    color: #475467;
    font-size: 0.76rem;
    font-weight: 700;
}

.occupancy-cell[b-o6yczummqn] {
    display: grid;
    grid-template-columns: 98px auto;
    align-items: center;
    gap: 12px;
}

.progress[b-o6yczummqn] {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #e5e7eb;
}

.progress span[b-o6yczummqn] {
    display: block;
    height: 100%;
    border-radius: inherit;
}

.progress.blue span[b-o6yczummqn] {
    background: #0b63f6;
}

.progress.green span[b-o6yczummqn] {
    background: #22c55e;
}

.occupancy-cell small[b-o6yczummqn] {
    display: inline-block;
    min-width: 48px;
    color: #344054;
    font-size: 0.76rem;
    font-weight: 800;
}

.occupancy-cell strong[b-o6yczummqn] {
    margin-left: 12px;
    color: #0f172a;
    font-size: 0.82rem;
    font-weight: 900;
}

.status[b-o6yczummqn] {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 11px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 900;
}

.status.active[b-o6yczummqn] {
    color: #16a34a;
    background: #dcfce7;
}

.row-action[b-o6yczummqn] {
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: #0f172a;
    font-size: 1.2rem;
    cursor: pointer;
}

.properties-table-footer[b-o6yczummqn] {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 24px;
    border-top: 1px solid #edf1f7;
}

.properties-table-footer span[b-o6yczummqn] {
    color: #344054;
    font-size: 0.84rem;
    font-weight: 700;
}

.pagination[b-o6yczummqn] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.pagination button[b-o6yczummqn] {
    width: 36px;
    height: 36px;
    border: 1px solid #d7dfeb;
    border-radius: 8px;
    background: #ffffff;
    color: #344054;
    cursor: pointer;
}

.pagination button.current[b-o6yczummqn] {
    color: #0b63f6;
    border-color: #0b63f6;
    background: #eff6ff;
}

/* =========================================================
   SECCIÓN: DETALLE
   ========================================================= */

.properties-detail-panel[b-o6yczummqn] {
    min-width: 0;
    padding: 22px;
}

.detail-panel-header[b-o6yczummqn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}

.detail-panel-header h2[b-o6yczummqn] {
    font-size: 1.05rem;
}

.detail-panel-header button[b-o6yczummqn] {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #1f2a44;
    font-size: 1.4rem;
    cursor: pointer;
}

.detail-hero[b-o6yczummqn] {
    display: grid;
    grid-template-columns: 96px 1fr;
    gap: 18px;
    align-items: center;
    margin-bottom: 20px;
}

.detail-hero img[b-o6yczummqn] {
    width: 96px;
    height: 96px;
    border-radius: 8px;
    object-fit: cover;
}

.detail-title-row[b-o6yczummqn] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.detail-title-row h3[b-o6yczummqn] {
    margin: 0;
    color: #111827;
    font-size: 1.34rem;
    font-weight: 900;
}

.detail-hero p[b-o6yczummqn] {
    margin: 10px 0 0;
    color: #344054;
    font-size: 0.88rem;
    font-weight: 700;
}

.detail-hero small[b-o6yczummqn] {
    display: block;
    margin-top: 12px;
    color: #344054;
    font-size: 0.82rem;
    font-weight: 700;
}

.detail-tabs[b-o6yczummqn] {
    display: grid;
    grid-template-columns: repeat(4, auto);
    gap: 16px;
    margin: 4px 0 18px;
    border-bottom: 1px solid #edf1f7;
}

.detail-tabs button[b-o6yczummqn] {
    min-height: 38px;
    padding: 0;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #344054;
    font-size: 0.74rem;
    font-weight: 800;
    cursor: pointer;
}

.detail-tabs button.active[b-o6yczummqn] {
    color: #0b63f6;
    border-bottom-color: #0b63f6;
}

.detail-card[b-o6yczummqn] {
    padding: 20px 18px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
}

.detail-card + .detail-card[b-o6yczummqn] {
    margin-top: 12px;
}

.detail-card h4[b-o6yczummqn] {
    margin: 0 0 20px;
    color: #111827;
    font-size: 0.92rem;
    font-weight: 900;
}

.detail-info-list[b-o6yczummqn] {
    display: grid;
    gap: 18px;
}

.detail-info-row[b-o6yczummqn],
.summary-row[b-o6yczummqn] {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) minmax(120px, 1fr);
    gap: 10px;
    align-items: start;
}

.detail-info-row span[b-o6yczummqn],
.summary-row span[b-o6yczummqn] {
    color: #53657d;
    font-size: 0.82rem;
}

.detail-info-row p[b-o6yczummqn],
.summary-row p[b-o6yczummqn] {
    margin: 0;
    color: #53657d;
    font-size: 0.78rem;
    font-weight: 700;
}

.detail-info-row strong[b-o6yczummqn],
.summary-row strong[b-o6yczummqn] {
    color: #111827;
    font-size: 0.78rem;
    line-height: 1.35;
    font-weight: 900;
}

.summary-row[b-o6yczummqn] {
    align-items: center;
}

.summary-row + .summary-row[b-o6yczummqn] {
    margin-top: 18px;
}

.dot[b-o6yczummqn] {
    width: 8px;
    height: 8px;
    margin-top: 3px;
    border-radius: 999px;
}

.dot.blue[b-o6yczummqn] {
    background: #0b63f6;
}

.dot.green[b-o6yczummqn] {
    background: #22c55e;
}

.detail-actions[b-o6yczummqn] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 20px;
}

.detail-actions button[b-o6yczummqn] {
    height: 42px;
    border-radius: 8px;
    background: #ffffff;
    font-size: 0.78rem;
    font-weight: 900;
    cursor: pointer;
}

.detail-actions .edit[b-o6yczummqn] {
    color: #0b63f6;
    border: 1px solid #0b63f6;
}

.detail-actions .danger[b-o6yczummqn] {
    color: #ef4444;
    border: 1px solid #ef4444;
}

/* =========================================================
   SECCIÓN: RESPONSIVE
   ========================================================= */

@media (max-width: 1500px) {
    .properties-content-grid[b-o6yczummqn] {
        grid-template-columns: 1fr;
    }

    .properties-detail-panel[b-o6yczummqn] {
        max-width: none;
    }
}

@media (max-width: 1180px) {
    .properties-kpi-grid[b-o6yczummqn] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .properties-toolbar[b-o6yczummqn] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 760px) {
    .properties-page[b-o6yczummqn] {
        padding: 18px;
    }

    .properties-header[b-o6yczummqn] {
        flex-direction: column;
    }

    .properties-primary-button[b-o6yczummqn] {
        width: 100%;
    }

    .properties-kpi-grid[b-o6yczummqn],
    .properties-toolbar[b-o6yczummqn] {
        grid-template-columns: 1fr;
    }

    .detail-hero[b-o6yczummqn] {
        grid-template-columns: 1fr;
    }

    .detail-tabs[b-o6yczummqn] {
        overflow-x: auto;
    }
}


/* =========================================================
   SECCIÓN: ICONOS MUD BLAZOR KPIS
   ========================================================= */

.properties-kpi-icon .mud-icon-root[b-o6yczummqn] {
    font-size: 34px !important;
}
/* /Pages/Properties/PropertiesFormDialog.razor.rz.scp.css */
/* =========================================================
   PROPERTIES FORM DIALOG
   Formulario estándar para crear y editar conjuntos.
   ========================================================= */

.properties-dialog[b-i1zqmpojq8] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.properties-dialog-header[b-i1zqmpojq8] {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 6px 12px;
}

.properties-dialog-icon[b-i1zqmpojq8] {
    width: 64px;
    height: 64px;
    min-width: 64px;
    border-radius: 18px;
    background: #e8f2ff;
    color: #0b5ee8;
    display: flex;
    align-items: center;
    justify-content: center;
}

.properties-dialog-icon .mud-icon-root[b-i1zqmpojq8] {
    font-size: 34px;
}

.properties-dialog-title[b-i1zqmpojq8] {
    color: #082b63;
    font-weight: 900;
    letter-spacing: -0.4px;
}

.properties-dialog-subtitle[b-i1zqmpojq8] {
    margin-top: 4px;
    color: #64748b;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.properties-dialog-form[b-i1zqmpojq8] {
    padding-top: 14px;
}

[b-i1zqmpojq8](.properties-input .mud-input-outlined-border) {
    border-radius: 12px !important;
    border-color: #d7e3f2 !important;
}

[b-i1zqmpojq8](.properties-input .mud-input-root) {
    min-height: 54px;
}

[b-i1zqmpojq8](.properties-input .mud-input-label) {
    color: #082b63 !important;
    font-weight: 700 !important;
}

/* =========================================================
   ESTADO
   ========================================================= */

.properties-status-box[b-i1zqmpojq8] {
    margin-top: 4px;
    padding: 16px 18px;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    background: #f8fbff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.properties-status-title[b-i1zqmpojq8] {
    color: #082b63;
    font-weight: 900;
    margin-bottom: 4px;
}

.properties-status-help[b-i1zqmpojq8] {
    color: #7d8798;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.properties-dialog-actions[b-i1zqmpojq8] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 14px;
    padding: 18px 4px 4px;
    border-top: 1px solid #e4eaf3;
}

.properties-dialog-actions .mud-button-root[b-i1zqmpojq8] {
    min-width: 138px;
    height: 44px;
    border-radius: 10px;
    font-weight: 800;
    text-transform: none;
}

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

@media (max-width: 600px) {
    .properties-dialog-header[b-i1zqmpojq8] {
        align-items: flex-start;
        gap: 14px;
    }

    .properties-dialog-icon[b-i1zqmpojq8] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

    .properties-status-box[b-i1zqmpojq8] {
        align-items: flex-start;
        flex-direction: column;
    }

    .properties-dialog-actions[b-i1zqmpojq8] {
        flex-direction: column-reverse;
    }

    .properties-dialog-actions .mud-button-root[b-i1zqmpojq8] {
        width: 100%;
    }
}
/* /Pages/Properties/Rules/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA BLOCKS
   Estándar visual HABYTAL basado en Properties.
   ========================================================= */

.blocks-page[b-0ac4jhywqb] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-0ac4jhywqb] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-0ac4jhywqb] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-0ac4jhywqb] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-0ac4jhywqb] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-0ac4jhywqb] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-0ac4jhywqb] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-0ac4jhywqb] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-0ac4jhywqb] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-0ac4jhywqb] {
    text-align: center !important;
}

.blocks-name-cell[b-0ac4jhywqb] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-0ac4jhywqb] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-0ac4jhywqb] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-0ac4jhywqb] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-0ac4jhywqb] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-0ac4jhywqb] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-0ac4jhywqb] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-0ac4jhywqb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-0ac4jhywqb] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-0ac4jhywqb] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-0ac4jhywqb] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Properties/Schedules/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA BLOCKS
   Estándar visual HABYTAL basado en Properties.
   ========================================================= */

.blocks-page[b-wd4i7177cw] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-wd4i7177cw] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-wd4i7177cw] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-wd4i7177cw] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-wd4i7177cw] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-wd4i7177cw] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-wd4i7177cw] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-wd4i7177cw] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-wd4i7177cw] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-wd4i7177cw] {
    text-align: center !important;
}

.blocks-name-cell[b-wd4i7177cw] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-wd4i7177cw] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-wd4i7177cw] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-wd4i7177cw] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-wd4i7177cw] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-wd4i7177cw] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-wd4i7177cw] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-wd4i7177cw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-wd4i7177cw] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-wd4i7177cw] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-wd4i7177cw] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Properties/SummaryProperty.razor.rz.scp.css */
/* =========================================================
   SUMMARY PROPERTY - MOCKUP 1:1
   Archivo: SummaryProperty.razor.css
   ========================================================= */

.summary-unit-page[b-h1zwsss7e9] {
    min-height: 100vh;
    background: #ffffff;
    color: #07142f;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.summary-unit-shell[b-h1zwsss7e9] {
    width: 100%;
    max-width: 1580px;
    margin: 0 auto;
    padding: 28px 32px 40px;
}

.summary-unit-topbar[b-h1zwsss7e9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.summary-unit-breadcrumb[b-h1zwsss7e9] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px;
    color: #152a55;
    font-size: 14px;
    font-weight: 650;
}

.summary-unit-breadcrumb strong[b-h1zwsss7e9] {
    color: #005cff;
    font-weight: 800;
}

.summary-unit-chevron[b-h1zwsss7e9] {
    color: #5f7197;
    font-size: 25px;
    line-height: 1;
}

.summary-unit-cancel-top[b-h1zwsss7e9] {
    min-width: 118px;
    height: 43px;
    border: 1px solid #8fa2c1;
    border-radius: 7px;
    background: #ffffff;
    color: #005cff;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    cursor: pointer;
}

.summary-unit-cancel-top span[b-h1zwsss7e9] {
    font-size: 27px;
    line-height: 1;
    font-weight: 400;
}

.summary-unit-header[b-h1zwsss7e9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 30px;
}

.summary-unit-header h1[b-h1zwsss7e9] {
    margin: 0 0 8px;
    color: #07111f;
    font-size: 31px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: -0.03em;
}

.summary-unit-header p[b-h1zwsss7e9] {
    margin: 0;
    color: #1c315c;
    font-size: 17px;
    font-weight: 500;
}

.summary-unit-stepper[b-h1zwsss7e9] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: end;
    gap: 24px;
    margin: 0 0 21px;
}

.summary-unit-step[b-h1zwsss7e9] {
    position: relative;
    min-height: 51px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: #1d315a;
    font-size: 14px;
    font-weight: 650;
    white-space: nowrap;
}

.summary-unit-step[b-h1zwsss7e9]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -18px;
    height: 3px;
    background: transparent;
}

.summary-unit-step.is-active[b-h1zwsss7e9]::after {
    background: #0062ff;
}

.summary-unit-step-circle[b-h1zwsss7e9] {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: 1.5px solid #c4d0e2;
    background: #ffffff;
    color: #0c244b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 850;
    flex: 0 0 auto;
}

.summary-unit-step.is-completed .summary-unit-step-circle[b-h1zwsss7e9] {
    border-color: #73d5a2;
    color: #20ae60;
    font-size: 26px;
    font-weight: 600;
}

.summary-unit-step.is-active .summary-unit-step-circle[b-h1zwsss7e9] {
    border-color: #0866f5;
    background: #0866f5;
    color: #ffffff;
    box-shadow: 0 12px 28px rgba(8, 102, 245, 0.24);
}

.summary-unit-step.is-active .summary-unit-step-label[b-h1zwsss7e9] {
    color: #005cff;
    font-weight: 850;
}

.summary-unit-layout[b-h1zwsss7e9] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 365px;
    gap: 31px;
    align-items: start;
}

.summary-unit-main[b-h1zwsss7e9] {
    min-width: 0;
}

.summary-unit-info-banner[b-h1zwsss7e9] {
    height: 50px;
    border-radius: 7px;
    background: #eef5ff;
    color: #0062ff;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 25px;
    margin-bottom: 20px;
    font-size: 14px;
    font-weight: 650;
}

.summary-unit-info-icon[b-h1zwsss7e9] {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    border: 2px solid #1e71ff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 850;
    flex: 0 0 auto;
}

.summary-unit-review-card[b-h1zwsss7e9] {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 18px;
    border: 1px solid #d9e2f1;
    border-radius: 7px;
    background: #ffffff;
    padding: 25px 25px 22px;
    margin-bottom: 18px;
}

.summary-unit-card-icon[b-h1zwsss7e9] {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 27px;
    font-weight: 750;
}

.summary-blue .summary-unit-card-icon[b-h1zwsss7e9] { background: #eaf2ff; color: #0062ff; }
.summary-green .summary-unit-card-icon[b-h1zwsss7e9] { background: #dcf6e7; color: #21a85d; }
.summary-purple .summary-unit-card-icon[b-h1zwsss7e9] { background: #efe8ff; color: #7a4cff; }
.summary-yellow .summary-unit-card-icon[b-h1zwsss7e9] { background: #fff3cc; color: #c89000; }

.summary-unit-card-title-row[b-h1zwsss7e9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 19px;
}

.summary-unit-card-title-row h2[b-h1zwsss7e9] {
    margin: 0;
    color: #07111f;
    font-size: 18px;
    line-height: 1.1;
    font-weight: 850;
}

.summary-unit-edit-button[b-h1zwsss7e9] {
    border: 0;
    background: transparent;
    color: #0062ff;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    padding: 0;
}

.summary-unit-edit-button span[b-h1zwsss7e9] {
    font-size: 21px;
    line-height: 1;
}

.summary-unit-fields[b-h1zwsss7e9],
.summary-unit-feature-head[b-h1zwsss7e9],
.summary-unit-owner-grid[b-h1zwsss7e9] {
    display: grid;
    gap: 16px 30px;
}

.summary-unit-fields-three[b-h1zwsss7e9] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 720px;
}

.summary-unit-details-grid[b-h1zwsss7e9] {
    grid-template-columns: 110px 120px 100px 90px 80px 160px 170px;
}

.summary-unit-fields span[b-h1zwsss7e9],
.summary-unit-feature-head span[b-h1zwsss7e9],
.summary-unit-owner-grid span[b-h1zwsss7e9],
.summary-unit-address-block span[b-h1zwsss7e9] {
    display: block;
    color: #405579;
    font-size: 13px;
    font-weight: 650;
    margin-bottom: 7px;
}

.summary-unit-fields strong[b-h1zwsss7e9],
.summary-unit-feature-head strong[b-h1zwsss7e9],
.summary-unit-owner-grid strong[b-h1zwsss7e9],
.summary-unit-address-block strong[b-h1zwsss7e9] {
    display: block;
    color: #07142f;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 750;
}

.summary-unit-fields em[b-h1zwsss7e9] {
    display: inline-flex;
    margin-left: 11px;
    padding: 4px 12px;
    border-radius: 5px;
    background: #cbf2d9;
    color: #10833c;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}

.summary-tall-card[b-h1zwsss7e9] {
    padding-bottom: 27px;
}

.summary-unit-feature-head[b-h1zwsss7e9] {
    grid-template-columns: 230px 230px 1fr;
    margin-bottom: 24px;
}

.summary-unit-feature-grid[b-h1zwsss7e9] {
    display: grid;
    grid-template-columns: 110px 130px 130px 130px 1fr;
    gap: 22px;
    align-items: start;
}

.summary-unit-feature-grid h3[b-h1zwsss7e9] {
    margin: 0 0 11px;
    color: #405579;
    font-size: 13px;
    font-weight: 650;
}

.summary-unit-feature-grid ul[b-h1zwsss7e9] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 11px;
}

.summary-unit-feature-grid li[b-h1zwsss7e9] {
    position: relative;
    color: #07142f;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 650;
    padding-left: 21px;
}

.summary-unit-feature-grid li[b-h1zwsss7e9]::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: -1px;
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: #22b562;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8px;
    font-weight: 900;
}

.summary-unit-feature-grid p[b-h1zwsss7e9] {
    margin: 0;
    color: #07142f;
    font-size: 13px;
    font-weight: 700;
}

.summary-unit-owner-grid[b-h1zwsss7e9] {
    grid-template-columns: 120px 170px 230px 140px 1fr;
    margin-bottom: 18px;
}

.summary-unit-address-block[b-h1zwsss7e9] {
    margin-top: 5px;
}

.summary-unit-actions[b-h1zwsss7e9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 29px;
}

.summary-unit-action-secondary[b-h1zwsss7e9],
.summary-unit-action-primary[b-h1zwsss7e9] {
    height: 45px;
    border-radius: 7px;
    font-size: 15px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    cursor: pointer;
}

.summary-unit-action-secondary[b-h1zwsss7e9] {
    min-width: 135px;
    border: 1px solid #879ab9;
    background: #ffffff;
    color: #152a55;
}

.summary-unit-action-secondary span[b-h1zwsss7e9] {
    font-size: 34px;
    font-weight: 300;
    line-height: 1;
}

.summary-unit-action-primary[b-h1zwsss7e9] {
    min-width: 205px;
    border: 1px solid #0062ff;
    background: #005ff1;
    color: #ffffff;
    box-shadow: 0 13px 30px rgba(0, 95, 241, 0.23);
}

.summary-unit-action-primary span[b-h1zwsss7e9] {
    font-size: 21px;
    font-weight: 500;
}

.summary-unit-sidebar[b-h1zwsss7e9] {
    display: grid;
    gap: 18px;
}

.summary-side-card[b-h1zwsss7e9] {
    border: 1px solid #d9e2f1;
    border-radius: 7px;
    background: #ffffff;
    padding: 25px 25px 24px;
}

.summary-side-card h2[b-h1zwsss7e9] {
    margin: 0 0 20px;
    color: #07111f;
    font-size: 18px;
    line-height: 1.1;
    font-weight: 850;
}

.summary-side-hero[b-h1zwsss7e9] {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 18px;
    align-items: start;
    margin-bottom: 28px;
}

.summary-side-hero img[b-h1zwsss7e9] {
    width: 140px;
    height: 108px;
    object-fit: cover;
    border-radius: 8px;
    display: block;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.summary-side-hero h3[b-h1zwsss7e9] {
    margin: 8px 0 9px;
    color: #07111f;
    font-size: 20px;
    line-height: 1.1;
    font-weight: 850;
}

.summary-side-status[b-h1zwsss7e9] {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 5px;
    background: #d4f5df;
    color: #10833c;
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 10px;
}

.summary-side-hero p[b-h1zwsss7e9] {
    margin: 0 0 9px;
    color: #1e3158;
    font-size: 14px;
    font-weight: 650;
}

.summary-side-list[b-h1zwsss7e9] {
    display: grid;
    gap: 19px;
    margin-bottom: 31px;
}

.summary-side-list div[b-h1zwsss7e9] {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    color: #17284c;
    font-size: 14px;
}

.summary-side-list span[b-h1zwsss7e9] {
    color: #23375f;
    font-size: 16px;
    text-align: center;
}

.summary-side-list label[b-h1zwsss7e9] {
    color: #31466d;
    font-weight: 650;
}

.summary-side-list strong[b-h1zwsss7e9] {
    color: #07142f;
    font-weight: 850;
}

.summary-side-outline-button[b-h1zwsss7e9] {
    width: 100%;
    height: 43px;
    border: 2px solid #0062ff;
    border-radius: 6px;
    background: #ffffff;
    color: #0062ff;
    font-size: 14px;
    font-weight: 850;
    cursor: pointer;
}

.summary-progress-card[b-h1zwsss7e9] {
    padding-bottom: 29px;
}

.summary-progress-row[b-h1zwsss7e9] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    margin: 0 0 22px;
}

.summary-progress-track[b-h1zwsss7e9] {
    height: 8px;
    border-radius: 999px;
    background: #e1e8f1;
    overflow: hidden;
}

.summary-progress-track span[b-h1zwsss7e9] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #20b564;
}

.summary-progress-row strong[b-h1zwsss7e9] {
    color: #07142f;
    font-size: 15px;
    font-weight: 850;
}

.summary-progress-list[b-h1zwsss7e9] {
    display: grid;
    gap: 18px;
}

.summary-progress-list div[b-h1zwsss7e9] {
    display: flex;
    align-items: center;
    gap: 13px;
    color: #31466d;
    font-size: 14px;
    font-weight: 650;
}

.summary-progress-list span[b-h1zwsss7e9] {
    width: 16px;
    height: 16px;
    border-radius: 999px;
    border: 1.5px solid #b9c8db;
    color: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    font-size: 10px;
    line-height: 1;
}

.summary-progress-list .is-completed span[b-h1zwsss7e9] {
    border-color: #24b665;
    background: #24b665;
    color: #ffffff;
    font-weight: 900;
}

.summary-progress-list .is-active span[b-h1zwsss7e9] {
    border-color: #0062ff;
    background: #0062ff;
    color: #ffffff;
    font-size: 9px;
}

.summary-progress-list .is-active label[b-h1zwsss7e9] {
    color: #143163;
    font-weight: 850;
}

@media (max-width: 1280px) {
    .summary-unit-shell[b-h1zwsss7e9] {
        padding: 24px 20px 36px;
    }

    .summary-unit-layout[b-h1zwsss7e9] {
        grid-template-columns: minmax(0, 1fr) 330px;
        gap: 22px;
    }

    .summary-unit-details-grid[b-h1zwsss7e9],
    .summary-unit-feature-grid[b-h1zwsss7e9],
    .summary-unit-owner-grid[b-h1zwsss7e9] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .summary-unit-layout[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
    }

    .summary-unit-stepper[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .summary-unit-step[b-h1zwsss7e9] {
        border: 1px solid #c7d6ed;
        border-radius: 8px;
        padding: 10px 14px;
        min-height: 48px;
        background: #ffffff;
    }

    .summary-unit-step[b-h1zwsss7e9]::after {
        display: none;
    }

    .summary-unit-review-card[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
    }

    .summary-unit-fields-three[b-h1zwsss7e9],
    .summary-unit-feature-head[b-h1zwsss7e9],
    .summary-unit-details-grid[b-h1zwsss7e9],
    .summary-unit-feature-grid[b-h1zwsss7e9],
    .summary-unit-owner-grid[b-h1zwsss7e9] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .summary-unit-shell[b-h1zwsss7e9] {
        padding: 18px 12px 28px;
    }

    .summary-unit-topbar[b-h1zwsss7e9],
    .summary-unit-actions[b-h1zwsss7e9],
    .summary-unit-card-title-row[b-h1zwsss7e9] {
        flex-direction: column;
        align-items: stretch;
    }

    .summary-unit-header h1[b-h1zwsss7e9] {
        font-size: 25px;
    }

    .summary-unit-info-banner[b-h1zwsss7e9] {
        height: auto;
        min-height: 50px;
        padding: 14px 16px;
        align-items: flex-start;
    }

    .summary-unit-fields-three[b-h1zwsss7e9],
    .summary-unit-feature-head[b-h1zwsss7e9],
    .summary-unit-details-grid[b-h1zwsss7e9],
    .summary-unit-feature-grid[b-h1zwsss7e9],
    .summary-unit-owner-grid[b-h1zwsss7e9],
    .summary-side-hero[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
    }

    .summary-side-hero img[b-h1zwsss7e9] {
        width: 100%;
        height: 170px;
    }

    .summary-unit-action-secondary[b-h1zwsss7e9],
    .summary-unit-action-primary[b-h1zwsss7e9],
    .summary-unit-cancel-top[b-h1zwsss7e9] {
        width: 100%;
    }
}

/* =========================================================
   RESPONSIVE WIDTH FIX - ADMIN LAYOUT COMPATIBILITY
   ========================================================= */
.summary-unit-shell[b-h1zwsss7e9] {
    max-width: none;
    margin: 0;
    padding: clamp(18px, 2vw, 28px) clamp(18px, 2.4vw, 36px) 40px;
}

.summary-unit-layout[b-h1zwsss7e9] {
    grid-template-columns: minmax(0, 1fr) clamp(300px, 23vw, 365px);
    gap: clamp(18px, 2vw, 31px);
}

.summary-unit-stepper[b-h1zwsss7e9] {
    width: 100%;
    gap: clamp(12px, 1.6vw, 24px);
}

.summary-unit-step[b-h1zwsss7e9] {
    min-width: 0;
}

.summary-unit-step-label[b-h1zwsss7e9] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.summary-unit-review-card[b-h1zwsss7e9],
.summary-side-card[b-h1zwsss7e9] {
    box-sizing: border-box;
}

.summary-unit-details-grid[b-h1zwsss7e9] {
    grid-template-columns: repeat(7, minmax(82px, 1fr));
}

.summary-unit-owner-grid[b-h1zwsss7e9] {
    grid-template-columns: 100px 150px minmax(190px, 1.2fr) 120px minmax(150px, 1fr);
}

.summary-unit-feature-grid[b-h1zwsss7e9] {
    grid-template-columns: repeat(5, minmax(90px, 1fr));
}

@media (min-width: 1500px) {
    .summary-unit-shell[b-h1zwsss7e9] {
        padding-left: 44px;
        padding-right: 44px;
    }
}

@media (max-width: 1366px) {
    .summary-unit-shell[b-h1zwsss7e9] {
        padding-left: 24px;
        padding-right: 24px;
    }

    .summary-unit-layout[b-h1zwsss7e9] {
        grid-template-columns: minmax(0, 1fr) 310px;
        gap: 20px;
    }

    .summary-unit-stepper[b-h1zwsss7e9] {
        gap: 12px;
    }

    .summary-unit-step[b-h1zwsss7e9] {
        gap: 10px;
        font-size: 12px;
    }

    .summary-unit-step-circle[b-h1zwsss7e9] {
        width: 34px;
        height: 34px;
        font-size: 14px;
    }

    .summary-unit-step.is-completed .summary-unit-step-circle[b-h1zwsss7e9] {
        font-size: 22px;
    }

    .summary-unit-review-card[b-h1zwsss7e9] {
        padding: 20px 20px 18px;
        gap: 14px;
        grid-template-columns: 48px minmax(0, 1fr);
    }

    .summary-unit-card-icon[b-h1zwsss7e9] {
        width: 44px;
        height: 44px;
        font-size: 23px;
    }

    .summary-unit-card-title-row h2[b-h1zwsss7e9],
    .summary-side-card h2[b-h1zwsss7e9] {
        font-size: 17px;
    }

    .summary-unit-details-grid[b-h1zwsss7e9] {
        grid-template-columns: repeat(4, minmax(95px, 1fr));
    }

    .summary-unit-feature-head[b-h1zwsss7e9] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .summary-unit-feature-grid[b-h1zwsss7e9] {
        grid-template-columns: repeat(4, minmax(95px, 1fr));
    }

    .summary-unit-owner-grid[b-h1zwsss7e9] {
        grid-template-columns: repeat(3, minmax(120px, 1fr));
    }

    .summary-side-card[b-h1zwsss7e9] {
        padding: 20px;
    }

    .summary-side-hero[b-h1zwsss7e9] {
        grid-template-columns: 118px 1fr;
        gap: 14px;
    }

    .summary-side-hero img[b-h1zwsss7e9] {
        width: 118px;
        height: 92px;
    }
}

@media (max-width: 1180px) {
    .summary-unit-layout[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
    }

    .summary-unit-sidebar[b-h1zwsss7e9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .summary-side-card[b-h1zwsss7e9] {
        min-width: 0;
    }
}

@media (max-width: 992px) {
    .summary-unit-shell[b-h1zwsss7e9] {
        padding-left: 16px;
        padding-right: 16px;
    }

    .summary-unit-stepper[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .summary-unit-step[b-h1zwsss7e9] {
        border: 1px solid #c7d6ed;
        border-radius: 8px;
        padding: 10px 14px;
        min-height: 48px;
        background: #ffffff;
        white-space: normal;
    }

    .summary-unit-step[b-h1zwsss7e9]::after {
        display: none;
    }

    .summary-unit-sidebar[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
    }

    .summary-unit-review-card[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
    }

    .summary-unit-fields-three[b-h1zwsss7e9],
    .summary-unit-feature-head[b-h1zwsss7e9],
    .summary-unit-details-grid[b-h1zwsss7e9],
    .summary-unit-feature-grid[b-h1zwsss7e9],
    .summary-unit-owner-grid[b-h1zwsss7e9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .summary-unit-shell[b-h1zwsss7e9] {
        padding: 14px 10px 28px;
    }

    .summary-unit-topbar[b-h1zwsss7e9],
    .summary-unit-actions[b-h1zwsss7e9],
    .summary-unit-card-title-row[b-h1zwsss7e9] {
        flex-direction: column;
        align-items: stretch;
    }

    .summary-unit-header h1[b-h1zwsss7e9] {
        font-size: 25px;
    }

    .summary-unit-info-banner[b-h1zwsss7e9] {
        height: auto;
        min-height: 50px;
        padding: 14px 16px;
        align-items: flex-start;
    }

    .summary-unit-fields-three[b-h1zwsss7e9],
    .summary-unit-feature-head[b-h1zwsss7e9],
    .summary-unit-details-grid[b-h1zwsss7e9],
    .summary-unit-feature-grid[b-h1zwsss7e9],
    .summary-unit-owner-grid[b-h1zwsss7e9],
    .summary-side-hero[b-h1zwsss7e9] {
        grid-template-columns: 1fr;
    }

    .summary-side-hero img[b-h1zwsss7e9] {
        width: 100%;
        height: 170px;
    }

    .summary-unit-action-secondary[b-h1zwsss7e9],
    .summary-unit-action-primary[b-h1zwsss7e9],
    .summary-unit-cancel-top[b-h1zwsss7e9] {
        width: 100%;
    }
}
/* /Pages/Properties/Towers/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TOWERS
   Estándar visual HABYTAL basado en Blocks.
   ========================================================= */

.blocks-page[b-duy5eyvkac] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-duy5eyvkac] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-duy5eyvkac] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-duy5eyvkac] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-duy5eyvkac] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-duy5eyvkac] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-duy5eyvkac] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-duy5eyvkac] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-duy5eyvkac] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-duy5eyvkac] {
    text-align: center !important;
}

.blocks-name-cell[b-duy5eyvkac] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-duy5eyvkac] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-duy5eyvkac] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-duy5eyvkac] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-duy5eyvkac] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-duy5eyvkac] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-duy5eyvkac] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-duy5eyvkac] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-duy5eyvkac] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-duy5eyvkac] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-duy5eyvkac] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Properties/UnitDetailsProperty.razor.rz.scp.css */
/* =========================================================
   HABYTAL - DETALLES DE LA UNIDAD
   Archivo aislado por CSS isolation.
   No modifica estilos globales ni layout compartido.
   ========================================================= */

.unit-details-page[b-qxz7eizoog] {
    width: 100%;
    min-height: 100%;
    color: #0f1f3d;
    background: #f8fbff;
}

.unit-details-shell[b-qxz7eizoog] {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 28px 32px 36px;
    box-sizing: border-box;
}

.unit-details-header[b-qxz7eizoog] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 26px;
}

.unit-details-breadcrumb[b-qxz7eizoog] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
    font-size: 13px;
    font-weight: 700;
    color: #50627f;
}

.unit-details-breadcrumb strong[b-qxz7eizoog] {
    color: #005eff;
}

.unit-details-heading h1[b-qxz7eizoog] {
    margin: 0 0 8px;
    font-size: 30px;
    line-height: 1.15;
    font-weight: 900;
    color: #071833;
    letter-spacing: -0.04em;
}

.unit-details-heading p[b-qxz7eizoog] {
    margin: 0;
    color: #40516f;
    font-size: 16px;
    font-weight: 500;
}

.unit-details-cancel[b-qxz7eizoog],
.unit-details-secondary[b-qxz7eizoog],
.unit-details-primary[b-qxz7eizoog] {
    border: 0;
    outline: none;
    cursor: pointer;
    font-family: inherit;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

.unit-details-cancel[b-qxz7eizoog] {
    min-width: 126px;
    height: 44px;
    border: 1px solid #8aa3cc;
    border-radius: 6px;
    background: #ffffff;
    color: #005eff;
    margin-top: 42px;
}

.unit-details-cancel:hover[b-qxz7eizoog],
.unit-details-secondary:hover[b-qxz7eizoog],
.unit-details-primary:hover[b-qxz7eizoog] {
    transform: translateY(-1px);
}

.unit-details-steps[b-qxz7eizoog] {
    display: grid;
    grid-template-columns: repeat(5, minmax(130px, 1fr));
    align-items: center;
    border-bottom: 1px solid #cbd8eb;
    margin-bottom: 0;
}

.unit-details-step[b-qxz7eizoog] {
    position: relative;
    min-height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: #253956;
    font-size: 14px;
    font-weight: 800;
}

.unit-details-step[b-qxz7eizoog]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 3px;
    background: transparent;
}

.unit-details-step-circle[b-qxz7eizoog] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b9c9df;
    background: #fff;
    color: #1d355f;
    font-weight: 900;
}

.unit-details-step.is-completed .unit-details-step-circle[b-qxz7eizoog] {
    border-color: #36c778;
    color: #24b86b;
    background: #f2fff8;
}

.unit-details-step.is-active[b-qxz7eizoog] {
    color: #005eff;
}

.unit-details-step.is-active[b-qxz7eizoog]::after {
    background: #005eff;
}

.unit-details-step.is-active .unit-details-step-circle[b-qxz7eizoog] {
    border-color: #005eff;
    background: #005eff;
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(0, 94, 255, .28);
}

.unit-details-content[b-qxz7eizoog] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 32px;
    width: 100%;
    margin-top: 0;
    align-items: start;
}

.unit-details-card[b-qxz7eizoog],
.unit-details-summary-card[b-qxz7eizoog],
.unit-details-progress-card[b-qxz7eizoog] {
    background: #ffffff;
    border: 1px solid #d5e0f0;
    border-radius: 8px;
    box-shadow: 0 16px 40px rgba(28, 50, 88, .06);
}

.unit-details-card[b-qxz7eizoog] {
    min-width: 0;
    padding: 30px 34px 26px;
}

.unit-details-card-title[b-qxz7eizoog] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 28px;
}

.unit-details-card-title h2[b-qxz7eizoog],
.unit-details-summary-card h2[b-qxz7eizoog],
.unit-details-progress-card h2[b-qxz7eizoog] {
    margin: 0;
    font-size: 20px;
    font-weight: 900;
    color: #071833;
    letter-spacing: -0.025em;
}

.unit-details-card-title p[b-qxz7eizoog] {
    margin: 8px 0 0;
    color: #3f526f;
    font-size: 15px;
    font-weight: 500;
}

.unit-details-form[b-qxz7eizoog] {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.unit-details-grid[b-qxz7eizoog] {
    display: grid;
    gap: 28px;
}

.unit-details-grid-3[b-qxz7eizoog] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.unit-details-grid-bottom[b-qxz7eizoog] {
    grid-template-columns: 260px 260px minmax(320px, 1fr);
    align-items: start;
}

.unit-details-field[b-qxz7eizoog] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.unit-details-field span[b-qxz7eizoog] {
    font-size: 14px;
    color: #344864;
    font-weight: 800;
}

.unit-details-field b[b-qxz7eizoog] {
    color: #e9284f;
}

.unit-details-field input[b-qxz7eizoog],
.unit-details-field select[b-qxz7eizoog],
.unit-details-field textarea[b-qxz7eizoog] {
    width: 100%;
    min-height: 48px;
    border: 1px solid #cbd8eb;
    border-radius: 6px;
    background: #ffffff;
    color: #0f1f3d;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    padding: 0 16px;
    box-sizing: border-box;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.unit-details-field select[b-qxz7eizoog] {
    appearance: auto;
}

.unit-details-field textarea[b-qxz7eizoog] {
    min-height: 78px;
    resize: vertical;
    padding: 16px;
    font-weight: 600;
}

.unit-details-field input:focus[b-qxz7eizoog],
.unit-details-field select:focus[b-qxz7eizoog],
.unit-details-field textarea:focus[b-qxz7eizoog] {
    outline: none;
    border-color: #005eff;
    box-shadow: 0 0 0 4px rgba(0, 94, 255, .08);
}

.unit-details-field small[b-qxz7eizoog] {
    color: #526783;
    font-size: 13px;
    font-weight: 500;
}

.unit-details-input-icon[b-qxz7eizoog] {
    position: relative;
    display: flex;
    align-items: center;
}

.unit-details-input-icon input[b-qxz7eizoog] {
    padding-right: 48px;
}

.unit-details-input-icon .mud-icon-root[b-qxz7eizoog] {
    position: absolute;
    right: 14px;
    color: #233653;
}

.unit-details-info[b-qxz7eizoog] {
    min-height: 48px;
    border-radius: 6px;
    background: #eaf3ff;
    color: #0064ff;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 18px;
    font-size: 14px;
    font-weight: 800;
}

.unit-details-actions[b-qxz7eizoog] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e1e9f5;
    padding-top: 22px;
}

.unit-details-secondary[b-qxz7eizoog] {
    min-width: 156px;
    height: 52px;
    border: 1px solid #7e98c2;
    border-radius: 6px;
    background: #ffffff;
    color: #243856;
    font-size: 16px;
}

.unit-details-primary[b-qxz7eizoog] {
    min-width: 170px;
    height: 52px;
    border-radius: 6px;
    background: #005eff;
    color: #ffffff;
    font-size: 16px;
    box-shadow: 0 14px 30px rgba(0, 94, 255, .28);
}

.unit-details-sidebar[b-qxz7eizoog] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

.unit-details-summary-card[b-qxz7eizoog],
.unit-details-progress-card[b-qxz7eizoog] {
    padding: 26px;
}

.unit-details-building-header[b-qxz7eizoog] {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 18px;
    margin: 22px 0 28px;
    align-items: center;
}

.unit-details-building-image[b-qxz7eizoog] {
    width: 110px;
    height: 96px;
    border-radius: 8px;
    background:
        linear-gradient(140deg, rgba(0, 94, 255, .12), rgba(15, 31, 61, .18)),
        linear-gradient(135deg, #e8eef8 0%, #7e98bc 52%, #243856 100%);
    box-shadow: inset 0 0 22px rgba(255, 255, 255, .35);
}

.unit-details-title-row[b-qxz7eizoog] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.unit-details-title-row h3[b-qxz7eizoog] {
    margin: 0;
    font-size: 22px;
    line-height: 1;
    font-weight: 900;
    color: #071833;
}

.unit-details-title-row span[b-qxz7eizoog],
.unit-details-summary-item strong:last-child[b-qxz7eizoog] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 0 10px;
    border-radius: 5px;
    background: #bff3d6;
    color: #098547;
    font-size: 12px;
    font-weight: 900;
}

.unit-details-building-header p[b-qxz7eizoog],
.unit-details-building-header small[b-qxz7eizoog] {
    display: block;
    margin: 8px 0 0;
    color: #1f3657;
    font-weight: 700;
}

.unit-details-summary-list[b-qxz7eizoog] {
    display: flex;
    flex-direction: column;
    gap: 19px;
}

.unit-details-summary-item[b-qxz7eizoog] {
    display: grid;
    grid-template-columns: 22px minmax(90px, 120px) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    color: #263b59;
}

.unit-details-summary-item .mud-icon-root[b-qxz7eizoog] {
    color: #263b59;
}

.unit-details-summary-item span[b-qxz7eizoog] {
    font-size: 13px;
    font-weight: 800;
    color: #50617d;
}

.unit-details-summary-item strong[b-qxz7eizoog] {
    color: #0c1f3f;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 900;
}

.unit-details-summary-item strong:last-child:not(:only-child)[b-qxz7eizoog] {
    background: transparent;
    color: #0c1f3f;
    padding: 0;
    justify-content: flex-start;
}

.unit-details-summary-item:last-child strong[b-qxz7eizoog] {
    width: fit-content;
    background: #bff3d6 !important;
    color: #098547 !important;
    padding: 0 10px !important;
}

.unit-details-progress-header[b-qxz7eizoog] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.unit-details-progress-header strong[b-qxz7eizoog] {
    font-size: 16px;
    font-weight: 900;
    color: #071833;
}

.unit-details-progress-bar[b-qxz7eizoog] {
    width: 100%;
    height: 8px;
    border-radius: 999px;
    background: #dfe7f2;
    overflow: hidden;
    margin-bottom: 22px;
}

.unit-details-progress-bar span[b-qxz7eizoog] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #27c46e;
}

.unit-details-progress-list[b-qxz7eizoog] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.unit-details-progress-item[b-qxz7eizoog] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.unit-details-progress-item span[b-qxz7eizoog] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid #a9bdd7;
    background: #ffffff;
}

.unit-details-progress-item p[b-qxz7eizoog] {
    margin: 0;
    color: #253956;
    font-size: 14px;
    font-weight: 700;
}

.unit-details-progress-item.is-completed span[b-qxz7eizoog] {
    border-color: #2bc978;
    background: #2bc978;
    position: relative;
}

.unit-details-progress-item.is-active span[b-qxz7eizoog] {
    border: 5px solid #0064ff;
}

@media (max-width: 1500px) {
    .unit-details-content[b-qxz7eizoog] {
        grid-template-columns: minmax(0, 1fr) 330px;
        gap: 24px;
    }

    .unit-details-grid-bottom[b-qxz7eizoog] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .unit-details-observations[b-qxz7eizoog] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 1180px) {
    .unit-details-content[b-qxz7eizoog] {
        grid-template-columns: 1fr;
    }

    .unit-details-steps[b-qxz7eizoog] {
        grid-template-columns: 1fr;
        border-bottom: 0;
        gap: 10px;
    }

    .unit-details-step[b-qxz7eizoog] {
        justify-content: flex-start;
        min-height: 54px;
        border: 1px solid #d5e0f0;
        border-radius: 8px;
        padding: 0 14px;
        background: #fff;
    }

    .unit-details-step[b-qxz7eizoog]::after {
        display: none;
    }
}

@media (max-width: 900px) {
    .unit-details-shell[b-qxz7eizoog] {
        padding: 20px 16px 28px;
    }

    .unit-details-header[b-qxz7eizoog] {
        flex-direction: column;
    }

    .unit-details-cancel[b-qxz7eizoog] {
        margin-top: 0;
    }

    .unit-details-card[b-qxz7eizoog] {
        padding: 24px 18px;
    }

    .unit-details-grid-3[b-qxz7eizoog],
    .unit-details-grid-bottom[b-qxz7eizoog] {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   RESPONSIVE STEPPER FIX - Desktop horizontal / Mobile boxed
   ========================================================= */
@media (min-width: 769px) {
    .unit-details-steps[b-qxz7eizoog] {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0;
        margin: 28px 0 0;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .unit-details-step[b-qxz7eizoog] {
        min-height: 58px;
        padding: 0 12px 14px;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .unit-details-step.is-active[b-qxz7eizoog] {
        border-color: transparent;
        background: transparent;
        box-shadow: none;
    }

    .unit-details-step.is-active[b-qxz7eizoog]::after {
        left: 0;
        right: 0;
        bottom: -1px;
        height: 3px;
        border-radius: 999px;
        background: #2563eb;
    }

    .unit-details-step-circle[b-qxz7eizoog] {
        width: 36px;
        height: 36px;
        border-radius: 999px;
        border: 1px solid #cbd5e1;
        background: #ffffff;
        color: #0f172a;
        box-shadow: none;
    }

    .unit-details-step.is-completed .unit-details-step-circle[b-qxz7eizoog] {
        border-color: #86efac;
        background: #ffffff;
        color: #16a34a;
    }

    .unit-details-step.is-active .unit-details-step-circle[b-qxz7eizoog] {
        border-color: #2563eb;
        background: #2563eb;
        color: #ffffff;
        box-shadow: 0 10px 24px rgba(37, 99, 235, 0.22);
    }
}

@media (max-width: 768px) {
    .unit-details-steps[b-qxz7eizoog] {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        margin: 14px 0 18px;
    }

    .unit-details-step[b-qxz7eizoog] {
        justify-content: flex-start;
        min-height: 50px;
        padding: 8px 12px;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035);
    }

    .unit-details-step.is-active[b-qxz7eizoog],
    .unit-details-step.is-completed[b-qxz7eizoog] {
        background: #ffffff;
        border-color: #bfdbfe;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035);
    }

    .unit-details-step.is-active[b-qxz7eizoog]::after,
    .unit-details-step[b-qxz7eizoog]::after {
        display: none;
    }

    .unit-details-step-circle[b-qxz7eizoog] {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        border: 1px solid #cbd5e1;
        background: #ffffff;
        color: #0f172a;
    }

    .unit-details-step.is-completed .unit-details-step-circle[b-qxz7eizoog] {
        border-color: #34d399;
        background: #ecfdf5;
        color: #16a34a;
    }

    .unit-details-step.is-active .unit-details-step-circle[b-qxz7eizoog] {
        border-color: #2563eb;
        background: #2563eb;
        color: #ffffff;
    }
}

/* =========================================================
   STEPPER UNIFICADO - DESKTOP HORIZONTAL / MOBILE EN CAJAS
   ========================================================= */
@media (min-width: 769px) {
    .new-property-steps[b-qxz7eizoog],
    .owner-steps[b-qxz7eizoog],
    .summary-property-stepper[b-qxz7eizoog],
    .unit-details-steps[b-qxz7eizoog],
    .unit-feature-steps[b-qxz7eizoog] {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #cfd8e6 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .step-item[b-qxz7eizoog],
    .owner-step[b-qxz7eizoog],
    .summary-property-step[b-qxz7eizoog],
    .unit-details-step[b-qxz7eizoog],
    .unit-feature-steps .step-item[b-qxz7eizoog] {
        position: relative !important;
        height: 78px !important;
        min-height: 78px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 14px !important;
        padding: 0 12px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #0f172a !important;
        font-size: 0.84rem !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .step-item.active[b-qxz7eizoog]::after,
    .owner-step.is-active[b-qxz7eizoog]::after,
    .summary-property-step.is-active[b-qxz7eizoog]::after,
    .unit-details-step.is-active[b-qxz7eizoog]::after,
    .unit-feature-steps .step-item.active[b-qxz7eizoog]::after {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        bottom: -1px !important;
        height: 3px !important;
        border-radius: 999px 999px 0 0 !important;
        background: #0b63f6 !important;
        display: block !important;
    }

    .step-item span[b-qxz7eizoog],
    .owner-step-circle[b-qxz7eizoog],
    .summary-property-step-number[b-qxz7eizoog],
    .unit-details-step-circle[b-qxz7eizoog],
    .unit-feature-steps .step-item span[b-qxz7eizoog] {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        flex: 0 0 42px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1.5px solid #b8c8de !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        color: #0f172a !important;
        font-size: 0.9rem !important;
        font-weight: 900 !important;
        box-shadow: 0 10px 24px rgba(15, 35, 70, 0.06) !important;
    }

    .step-item.completed span[b-qxz7eizoog],
    .owner-step.is-done .owner-step-circle[b-qxz7eizoog],
    .summary-property-step.is-completed .summary-property-step-number[b-qxz7eizoog],
    .unit-details-step.is-completed .unit-details-step-circle[b-qxz7eizoog],
    .unit-feature-steps .step-item.completed span[b-qxz7eizoog] {
        color: #16a34a !important;
        background: #ffffff !important;
        border-color: #86efac !important;
        box-shadow: none !important;
    }

    .step-item.active span[b-qxz7eizoog],
    .owner-step.is-active .owner-step-circle[b-qxz7eizoog],
    .summary-property-step.is-active .summary-property-step-number[b-qxz7eizoog],
    .unit-details-step.is-active .unit-details-step-circle[b-qxz7eizoog],
    .unit-feature-steps .step-item.active span[b-qxz7eizoog] {
        color: #ffffff !important;
        background: #0b63f6 !important;
        border-color: #0b63f6 !important;
        box-shadow: 0 12px 26px rgba(11, 99, 246, 0.28) !important;
    }

    .step-item.active[b-qxz7eizoog],
    .owner-step.is-active[b-qxz7eizoog],
    .summary-property-step.is-active[b-qxz7eizoog],
    .unit-details-step.is-active[b-qxz7eizoog],
    .unit-feature-steps .step-item.active[b-qxz7eizoog],
    .owner-step.is-active .owner-step-label[b-qxz7eizoog],
    .summary-property-step.is-active .summary-property-step-text strong[b-qxz7eizoog],
    .unit-details-step.is-active[b-qxz7eizoog],
    .unit-feature-steps .step-item.active[b-qxz7eizoog] {
        color: #0b63f6 !important;
        font-weight: 900 !important;
    }

    .summary-property-step-text span[b-qxz7eizoog] {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .new-property-steps[b-qxz7eizoog],
    .owner-steps[b-qxz7eizoog],
    .summary-property-stepper[b-qxz7eizoog],
    .unit-details-steps[b-qxz7eizoog],
    .unit-feature-steps[b-qxz7eizoog] {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        width: 100% !important;
        margin: 14px 0 18px !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .step-item[b-qxz7eizoog],
    .owner-step[b-qxz7eizoog],
    .summary-property-step[b-qxz7eizoog],
    .unit-details-step[b-qxz7eizoog],
    .unit-feature-steps .step-item[b-qxz7eizoog] {
        position: relative !important;
        min-height: 50px !important;
        height: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 12px !important;
        padding: 8px 12px !important;
        border: 1px solid #bfdbfe !important;
        border-radius: 8px !important;
        background: #ffffff !important;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035) !important;
        color: #0f172a !important;
        font-size: 0.84rem !important;
        font-weight: 900 !important;
        line-height: 1.15 !important;
        white-space: normal !important;
    }

    .step-item.active[b-qxz7eizoog]::after,
    .owner-step.is-active[b-qxz7eizoog]::after,
    .summary-property-step.is-active[b-qxz7eizoog]::after,
    .unit-details-step.is-active[b-qxz7eizoog]::after,
    .unit-feature-steps .step-item.active[b-qxz7eizoog]::after,
    .unit-details-step[b-qxz7eizoog]::after {
        display: none !important;
        content: none !important;
    }

    .step-item span[b-qxz7eizoog],
    .owner-step-circle[b-qxz7eizoog],
    .summary-property-step-number[b-qxz7eizoog],
    .unit-details-step-circle[b-qxz7eizoog],
    .unit-feature-steps .step-item span[b-qxz7eizoog] {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        flex: 0 0 34px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        color: #0f172a !important;
        font-size: 0.82rem !important;
        font-weight: 900 !important;
        box-shadow: none !important;
    }

    .step-item.completed span[b-qxz7eizoog],
    .owner-step.is-done .owner-step-circle[b-qxz7eizoog],
    .summary-property-step.is-completed .summary-property-step-number[b-qxz7eizoog],
    .unit-details-step.is-completed .unit-details-step-circle[b-qxz7eizoog],
    .unit-feature-steps .step-item.completed span[b-qxz7eizoog] {
        border-color: #34d399 !important;
        background: #ecfdf5 !important;
        color: #16a34a !important;
    }

    .step-item.active span[b-qxz7eizoog],
    .owner-step.is-active .owner-step-circle[b-qxz7eizoog],
    .summary-property-step.is-active .summary-property-step-number[b-qxz7eizoog],
    .unit-details-step.is-active .unit-details-step-circle[b-qxz7eizoog],
    .unit-feature-steps .step-item.active span[b-qxz7eizoog] {
        border-color: #2563eb !important;
        background: #2563eb !important;
        color: #ffffff !important;
    }

    .step-item.active[b-qxz7eizoog],
    .owner-step.is-active[b-qxz7eizoog],
    .summary-property-step.is-active[b-qxz7eizoog],
    .unit-details-step.is-active[b-qxz7eizoog],
    .unit-feature-steps .step-item.active[b-qxz7eizoog] {
        color: #0b63f6 !important;
    }

    .summary-property-step-text span[b-qxz7eizoog] {
        display: none !important;
    }
}
/* /Pages/Properties/UnitFeatureProperty.razor.rz.scp.css */
/* =========================================================
   HABYTAL - AGREGAR UNIDAD / CARACTERÍSTICAS
   Solo diseño visual. No incluye Layout ni NavMenu.
   ========================================================= */

.unit-feature-page[b-wyx1vgislq] {
    width: 100%;
    min-height: 100vh;
    padding: 24px 32px 34px;
    box-sizing: border-box;
    background: #f7f9fd;
    color: #0f172a;
}

/* HEADER */
.unit-feature-header[b-wyx1vgislq] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 28px;
}

.unit-feature-breadcrumb[b-wyx1vgislq] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 18px;
    color: #52627a;
    font-size: .84rem;
    font-weight: 800;
}

.unit-feature-breadcrumb a[b-wyx1vgislq] {
    color: #52627a;
    text-decoration: none;
}

.unit-feature-breadcrumb strong[b-wyx1vgislq] {
    color: #0b63f6;
}

.unit-feature-header h1[b-wyx1vgislq] {
    margin: 0;
    color: #101828;
    font-size: 1.72rem;
    line-height: 1.1;
    font-weight: 900;
    letter-spacing: -.035em;
}

.unit-feature-header p[b-wyx1vgislq] {
    margin: 10px 0 0;
    color: #40516d;
    font-size: .95rem;
    font-weight: 700;
}

.unit-feature-cancel[b-wyx1vgislq] {
    min-width: 112px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 16px;
    color: #0b63f6;
    background: #fff;
    border: 1px solid #8fa2bf;
    border-radius: 6px;
    text-decoration: none;
    font-size: .85rem;
    font-weight: 900;
}

/* STEPPER */
.unit-feature-steps[b-wyx1vgislq] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: end;
    gap: 18px;
    width: 100%;
    margin-bottom: 0;
    border-bottom: 1px solid #cfd8e6;
}

.step-item[b-wyx1vgislq] {
    min-width: 0;
    width: 100%;
    height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: #0f172a;
    font-size: .84rem;
    font-weight: 900;
    white-space: nowrap;
}

.step-item span[b-wyx1vgislq] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    border: 1.5px solid #b8c8de;
    border-radius: 999px;
    color: #0f172a;
    background: #fff;
    font-size: .9rem;
    font-weight: 900;
    box-shadow: 0 10px 24px rgba(15, 35, 70, .06);
}

.step-item.active[b-wyx1vgislq] {
    color: #0b63f6;
    border-bottom-color: #0b63f6;
}

.step-item.active span[b-wyx1vgislq] {
    color: #fff;
    background: #0b63f6;
    border-color: #0b63f6;
    box-shadow: 0 12px 26px rgba(11, 99, 246, .28);
}

.step-item.completed span[b-wyx1vgislq] {
    color: #16a34a;
    background: #ecfdf3;
    border-color: #22c55e;
}

/* LAYOUT */
.unit-feature-layout[b-wyx1vgislq] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 28px;
    align-items: start;
}

.unit-feature-card[b-wyx1vgislq],
.summary-card[b-wyx1vgislq],
.progress-card[b-wyx1vgislq] {
    background: #fff;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    box-shadow: 0 12px 30px rgba(15, 35, 70, .025);
}

.unit-feature-card[b-wyx1vgislq] {
    padding: 24px;
}

.feature-card-header h2[b-wyx1vgislq],
.summary-card h2[b-wyx1vgislq],
.progress-card h2[b-wyx1vgislq] {
    margin: 0;
    color: #111827;
    font-size: 1.05rem;
    font-weight: 900;
}

.feature-card-header p[b-wyx1vgislq] {
    margin: 8px 0 0;
    color: #40516d;
    font-size: .84rem;
    font-weight: 700;
}

.feature-grid[b-wyx1vgislq] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 44px;
    margin-top: 24px;
}

.field-block[b-wyx1vgislq] {
    margin-bottom: 28px;
}

.field-block label[b-wyx1vgislq] {
    display: block;
    margin-bottom: 7px;
    color: #354664;
    font-size: .84rem;
    font-weight: 900;
}

.field-block label strong[b-wyx1vgislq] {
    color: #ef4444;
}

.field-block label span[b-wyx1vgislq],
.field-block p[b-wyx1vgislq] {
    color: #52627a;
    font-size: .79rem;
    font-weight: 700;
}

.field-block p[b-wyx1vgislq] {
    margin: 0 0 14px;
}

.usage-grid[b-wyx1vgislq] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.usage-card[b-wyx1vgislq] {
    min-height: 78px;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid #d4deec;
    border-radius: 7px;
    background: #fff;
}

.usage-card.selected[b-wyx1vgislq] {
    border-color: #0b63f6;
    background: linear-gradient(180deg, #fff, #f6faff);
    box-shadow: 0 12px 26px rgba(11, 99, 246, .08);
}

.usage-icon[b-wyx1vgislq] {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: #0b63f6;
    background: #eef5ff;
}

.usage-card strong[b-wyx1vgislq] {
    display: block;
    color: #17345f;
    font-size: .86rem;
    font-weight: 900;
}

.usage-card small[b-wyx1vgislq] {
    display: block;
    margin-top: 4px;
    color: #52627a;
    font-size: .75rem;
    font-weight: 700;
}

.checkbox-grid[b-wyx1vgislq] {
    display: grid;
    gap: 12px;
}

.checkbox-grid.three-columns[b-wyx1vgislq] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.checkbox-grid.two-columns[b-wyx1vgislq] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.check-card[b-wyx1vgislq] {
    min-height: 43px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 0 12px !important;
    border: 1px solid #d4deec;
    border-radius: 6px;
    background: #fff;
    color: #263a5a;
    font-size: .79rem;
    font-weight: 800;
    line-height: 1 !important;
    cursor: pointer;
    user-select: none;
}

.check-card.checked[b-wyx1vgislq] {
    border-color: #93c5fd;
    background: #f7fbff;
}

.check-card-input[b-wyx1vgislq],
.check-card input[type="checkbox"][b-wyx1vgislq] {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

.check-card-icon[b-wyx1vgislq] {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1.5px solid #aebed4;
    border-radius: 4px;
    background: #fff;
    color: #fff;
    line-height: 1 !important;
}

.check-card.checked .check-card-icon[b-wyx1vgislq] {
    border-color: #0b63f6;
    background: #0b63f6;
}

.check-card.checked .check-card-icon[b-wyx1vgislq]::after {
    content: "✓";
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
    line-height: 1;
}

.check-card-text[b-wyx1vgislq] {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 0;
    color: #263a5a;
    font-size: .79rem;
    font-weight: 800;
    line-height: 1.15 !important;
    white-space: normal;
}

.select-control[b-wyx1vgislq] {
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 14px;
    border: 1px solid #cfd8e6;
    border-radius: 6px;
    color: #263a5a;
    background: #fff;
    font-size: .84rem;
    font-weight: 800;
}

.select-control.with-icon[b-wyx1vgislq] {
    justify-content: flex-start;
}

.select-control.with-icon span[b-wyx1vgislq] {
    flex: 1;
}

.feature-info[b-wyx1vgislq] {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 6px;
    padding: 0 16px;
    border-radius: 6px;
    color: #0b63f6;
    background: #eaf3ff;
    font-size: .83rem;
    font-weight: 800;
}

.feature-actions[b-wyx1vgislq] {
    min-height: 82px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin-top: 20px;
}

.secondary-button[b-wyx1vgislq],
.primary-button[b-wyx1vgislq],
.details-button[b-wyx1vgislq] {
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 6px;
    text-decoration: none;
    font-size: .84rem;
    font-weight: 900;
}

.secondary-button[b-wyx1vgislq] {
    min-width: 118px;
    color: #344054;
    background: #fff;
    border: 1px solid #8fa2bf;
}

.primary-button[b-wyx1vgislq] {
    min-width: 128px;
    color: #fff;
    background: #0b63f6;
    border: 1px solid #0b63f6;
    box-shadow: 0 14px 26px rgba(11, 99, 246, .24);
}

/* SIDEBAR */
.unit-feature-sidebar[b-wyx1vgislq] {
    display: grid;
    gap: 16px;
}

.summary-card[b-wyx1vgislq],
.progress-card[b-wyx1vgislq] {
    padding: 24px 20px;
}

.unit-summary-head[b-wyx1vgislq] {
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    gap: 18px;
    margin: 20px 0 24px;
}

.unit-summary-head img[b-wyx1vgislq] {
    width: 118px;
    height: 94px;
    object-fit: cover;
    border-radius: 7px;
}

.unit-summary-head h3[b-wyx1vgislq] {
    margin: 4px 0 7px;
    color: #111827;
    font-size: 1.05rem;
    font-weight: 900;
}

.unit-summary-head span[b-wyx1vgislq] {
    display: inline-flex;
    padding: 4px 10px;
    border-radius: 999px;
    color: #16a34a;
    background: #dcfce7;
    font-size: .76rem;
    font-weight: 900;
}

.unit-summary-head p[b-wyx1vgislq] {
    margin: 10px 0 0;
    color: #40516d;
    font-size: .83rem;
    font-weight: 700;
}

.summary-list[b-wyx1vgislq] {
    display: grid;
    gap: 18px;
    margin-bottom: 24px;
}

.summary-row[b-wyx1vgislq] {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) minmax(78px, auto);
    gap: 12px;
    align-items: center;
}

.summary-row .mud-icon-root[b-wyx1vgislq],
.progress-item span[b-wyx1vgislq] {
    color: #53657d;
}

.summary-row span[b-wyx1vgislq] {
    color: #53657d;
    font-size: .78rem;
    font-weight: 800;
}

.summary-row strong[b-wyx1vgislq] {
    color: #111827;
    font-size: .78rem;
    font-weight: 900;
}

.details-button[b-wyx1vgislq] {
    width: 100%;
    color: #0b63f6;
    background: #fff;
    border: 1px solid #0b63f6;
}

.progress-title-row[b-wyx1vgislq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.progress-title-row strong[b-wyx1vgislq] {
    color: #111827;
    font-size: .86rem;
    font-weight: 900;
}

.progress-bar[b-wyx1vgislq] {
    height: 7px;
    margin: 18px 0 20px;
    overflow: hidden;
    border-radius: 999px;
    background: #e5ebf4;
}

.progress-bar span[b-wyx1vgislq] {
    display: block;
    width: 60%;
    height: 100%;
    border-radius: inherit;
    background: #22c55e;
}

.progress-list[b-wyx1vgislq] {
    display: grid;
    gap: 17px;
}

.progress-item[b-wyx1vgislq] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #40516d;
    font-size: .82rem;
    font-weight: 800;
}

.progress-item span[b-wyx1vgislq] {
    width: 17px;
    height: 17px;
    display: grid;
    place-items: center;
    border: 1.5px solid #b8c8de;
    border-radius: 999px;
    background: #fff;
}

.progress-item.done span[b-wyx1vgislq] {
    border-color: #22c55e;
    background: #22c55e;
}

.progress-item.done span[b-wyx1vgislq]::after {
    content: "✓";
    color: #fff;
    font-size: .62rem;
    font-weight: 900;
}

.progress-item.active span[b-wyx1vgislq] {
    border-color: #0b63f6;
    background: #0b63f6;
    box-shadow: inset 0 0 0 5px #0b63f6;
}

/* RESPONSIVE */
@media (max-width: 1400px) {
    .unit-feature-layout[b-wyx1vgislq] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1100px) {
    .unit-feature-steps[b-wyx1vgislq] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .feature-grid[b-wyx1vgislq],
    .checkbox-grid.three-columns[b-wyx1vgislq] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .unit-feature-page[b-wyx1vgislq] {
        padding: 20px;
    }

    .unit-feature-header[b-wyx1vgislq],
    .feature-actions[b-wyx1vgislq] {
        flex-direction: column;
        align-items: stretch;
    }

    .unit-feature-steps[b-wyx1vgislq],
    .checkbox-grid.two-columns[b-wyx1vgislq],
    .usage-grid[b-wyx1vgislq] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Properties/Units/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TOWERS
   Estándar visual HABYTAL basado en Blocks.
   ========================================================= */

.blocks-page[b-bie7zsoy8f] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-bie7zsoy8f] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-bie7zsoy8f] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-bie7zsoy8f] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-bie7zsoy8f] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-bie7zsoy8f] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-bie7zsoy8f] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-bie7zsoy8f] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-bie7zsoy8f] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-bie7zsoy8f] {
    text-align: center !important;
}

.blocks-name-cell[b-bie7zsoy8f] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-bie7zsoy8f] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-bie7zsoy8f] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-bie7zsoy8f] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-bie7zsoy8f] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-bie7zsoy8f] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-bie7zsoy8f] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-bie7zsoy8f] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-bie7zsoy8f] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-bie7zsoy8f] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-bie7zsoy8f] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Properties/UnitTypes/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TOWERS
   Estándar visual HABYTAL basado en Blocks.
   ========================================================= */

.blocks-page[b-ii5vpzynoz] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

.blocks-list-card[b-ii5vpzynoz] {
    margin-top: 14px;
    border: 1px solid #d7e3f2;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.blocks-list-header[b-ii5vpzynoz] {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.blocks-list-title[b-ii5vpzynoz] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #071b4d;
    font-size: 15px;
    font-weight: 600;
}

.blocks-list-title strong[b-ii5vpzynoz] {
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.blocks-table-scroll[b-ii5vpzynoz] {
    width: 100%;
    overflow-x: auto;
}

.blocks-table[b-ii5vpzynoz] {
    width: 100%;
    min-width: 920px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.blocks-table thead th[b-ii5vpzynoz] {
    height: 44px;
    padding: 0 16px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.blocks-table tbody td[b-ii5vpzynoz] {
    height: 68px;
    padding: 10px 16px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 13px;
    font-weight: 400;
    vertical-align: middle;
}

.blocks-cell-center[b-ii5vpzynoz] {
    text-align: center !important;
}

.blocks-name-cell[b-ii5vpzynoz] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.blocks-name-icon[b-ii5vpzynoz] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blocks-name-cell strong[b-ii5vpzynoz] {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}

.blocks-name-cell span[b-ii5vpzynoz] {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

.blocks-date-cell[b-ii5vpzynoz] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.blocks-date-cell strong[b-ii5vpzynoz] {
    color: #334155;
    font-size: 13px;
    font-weight: 500;
}

.blocks-date-cell span[b-ii5vpzynoz] {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

.blocks-row-actions[b-ii5vpzynoz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.blocks-action-button[b-ii5vpzynoz] {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e3f2;
    border-radius: 10px;
    background: #ffffff;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.blocks-empty-state[b-ii5vpzynoz] {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    text-align: center;
}

.blocks-pagination[b-ii5vpzynoz] {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #edf2f8;
}
/* /Pages/Residents/Index.razor.rz.scp.css */
/* =========================================================
   HABYTAL - Residentes / Listado estilo mockup
   Solo aplica a /admin/residents.
   Se mantienen intactos CrudPageHeader, CrudSummaryCards y CrudToolbar.
   ========================================================= */

/* =========================================================
   PÁGINA
   ========================================================= */

.residents-page[b-t3mn8tjibw] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
    color: #071b4d;
}

/* =========================================================
   LISTADO - CONTENEDOR
   ========================================================= */

.residents-list-card[b-t3mn8tjibw] {
    margin-top: 16px;
    border: 1px solid #d7e3f2;
    border-radius: 16px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .055);
}

.residents-list-header[b-t3mn8tjibw] {
    min-height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 22px;
    border-bottom: 1px solid #e6edf7;
    background: #ffffff;
}

.residents-list-title[b-t3mn8tjibw] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.residents-list-title h2[b-t3mn8tjibw] {
    margin: 0;
    color: #071b4d;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.015em;
}

.residents-list-title strong[b-t3mn8tjibw] {
    min-width: 34px;
    height: 24px;
    padding: 0 10px;
    border-radius: 999px;
    background: #eef4ff;
    color: #2f5cf6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
}

/* =========================================================
   TABLA
   ========================================================= */

.residents-table-scroll[b-t3mn8tjibw] {
    width: 100%;
    overflow-x: auto;
}

.residents-table[b-t3mn8tjibw] {
    width: 100%;
    min-width: 1160px;
    border-collapse: separate;
    border-spacing: 0;
    color: #071b4d;
}

.residents-table thead th[b-t3mn8tjibw] {
    height: 48px;
    padding: 0 22px;
    border-bottom: 1px solid #e6edf7;
    background: #f7faff;
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.residents-table tbody td[b-t3mn8tjibw] {
    height: 78px;
    padding: 14px 22px;
    border-bottom: 1px solid #edf2f8;
    color: #203154;
    font-size: 14px;
    font-weight: 500;
    vertical-align: middle;
}

.residents-table tbody tr[b-t3mn8tjibw] {
    transition: background .18s ease, box-shadow .18s ease;
}

.residents-table tbody tr:hover[b-t3mn8tjibw] {
    background: #f9fbff;
}

.residents-table tbody tr:last-child td[b-t3mn8tjibw] {
    border-bottom: 0;
}

.residents-cell-actions[b-t3mn8tjibw] {
    text-align: center !important;
    white-space: nowrap;
}

/* =========================================================
   COLUMNA RESIDENTE
   ========================================================= */

.resident-identity-cell[b-t3mn8tjibw] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.resident-avatar[b-t3mn8tjibw] {
    width: 52px;
    height: 52px;
    min-width: 52px;
    border-radius: 999px;
    background: linear-gradient(145deg, #dce9ff, #eef5ff);
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.resident-avatar .mud-icon-root[b-t3mn8tjibw] {
    font-size: 28px;
}

.resident-avatar-img[b-t3mn8tjibw] {
    width: 52px;
    height: 52px;
    border-radius: 999px;
    object-fit: cover;
    display: block;
}

.resident-primary-text[b-t3mn8tjibw] {
    min-width: 0;
}

.resident-primary-text strong[b-t3mn8tjibw] {
    display: block;
    max-width: 240px;
    color: #0f172a;
    font-size: 14px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.resident-primary-text span[b-t3mn8tjibw] {
    display: block;
    margin-top: 5px;
    color: #64748b;
    font-size: 12.5px;
    font-weight: 500;
}

/* =========================================================
   COLUMNA UNIDAD
   ========================================================= */

.resident-unit-cell[b-t3mn8tjibw] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.resident-unit-cell strong[b-t3mn8tjibw] {
    color: #0f172a;
    font-size: 14px;
    font-weight: 800;
}

.resident-unit-cell span[b-t3mn8tjibw] {
    color: #64748b;
    font-size: 12.5px;
    font-weight: 500;
}

/* =========================================================
   COLUMNA CONTACTO
   ========================================================= */

.resident-contact-cell[b-t3mn8tjibw] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.resident-contact-cell span[b-t3mn8tjibw] {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    color: #334155;
    font-size: 13px;
    line-height: 1.25;
}

.resident-contact-cell .mud-icon-root[b-t3mn8tjibw] {
    color: #475569;
    font-size: 17px !important;
}

/* =========================================================
   TIPO / ROL
   ========================================================= */

.resident-type-text[b-t3mn8tjibw],
.resident-role-text[b-t3mn8tjibw] {
    color: #203154;
    font-size: 13.5px;
    font-weight: 600;
}

/* =========================================================
   FECHA REGISTRO
   ========================================================= */

.resident-date-cell[b-t3mn8tjibw] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.resident-date-cell strong[b-t3mn8tjibw] {
    color: #334155;
    font-size: 13px;
    font-weight: 700;
}

.resident-date-cell span[b-t3mn8tjibw] {
    color: #64748b;
    font-size: 12.5px;
    font-weight: 500;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.resident-actions-cell[b-t3mn8tjibw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.resident-action-button[b-t3mn8tjibw] {
    width: 34px !important;
    height: 34px !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #475569 !important;
    transition: background .18s ease, color .18s ease, transform .18s ease;
}

.resident-action-button:hover[b-t3mn8tjibw] {
    background: #eef4ff !important;
    color: #2563eb !important;
    transform: translateY(-1px);
}

.resident-action-more:hover[b-t3mn8tjibw] {
    color: #0f172a !important;
}

/* =========================================================
   ESTADO VACÍO
   ========================================================= */

.residents-empty-state[b-t3mn8tjibw] {
    min-height: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #64748b;
    text-align: center;
}

.residents-empty-icon[b-t3mn8tjibw] {
    width: 62px;
    height: 62px;
    border-radius: 999px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.residents-empty-icon .mud-icon-root[b-t3mn8tjibw] {
    font-size: 32px;
}

.residents-empty-state strong[b-t3mn8tjibw] {
    color: #0f172a;
    font-size: 15px;
    font-weight: 800;
}

.residents-empty-state span[b-t3mn8tjibw] {
    color: #64748b;
    font-size: 13px;
}

/* =========================================================
   PIE / PAGINACIÓN
   ========================================================= */

.residents-list-footer[b-t3mn8tjibw] {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 22px;
    border-top: 1px solid #edf2f8;
    background: #ffffff;
}

.residents-list-footer > span[b-t3mn8tjibw] {
    color: #475569;
    font-size: 13.5px;
    font-weight: 500;
}

/* =========================================================
   COMPATIBILIDAD TEMPORAL
   ========================================================= */

.blocks-page[b-t3mn8tjibw] {
    min-height: calc(100vh - 56px);
    padding: 24px 28px 34px;
    background: #f3f7fc;
    box-sizing: border-box;
}

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

@media (max-width: 1200px) {
    .residents-page[b-t3mn8tjibw] {
        padding: 20px;
    }

    .residents-list-footer[b-t3mn8tjibw] {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .residents-page[b-t3mn8tjibw] {
        padding: 16px;
    }

    .residents-list-header[b-t3mn8tjibw] {
        align-items: flex-start;
        flex-direction: column;
    }

    .resident-primary-text strong[b-t3mn8tjibw] {
        max-width: 170px;
    }
}

/* =========================================================
   DARK MODE
   ========================================================= */

@media (prefers-color-scheme: dark) {
    .residents-page[b-t3mn8tjibw],
    .blocks-page[b-t3mn8tjibw] {
        background: #0b1220;
        color: #eef4ff;
    }

    .residents-list-card[b-t3mn8tjibw],
    .residents-list-header[b-t3mn8tjibw],
    .residents-list-footer[b-t3mn8tjibw] {
        background: #111827;
        border-color: #243148;
    }

    .residents-table thead th[b-t3mn8tjibw] {
        background: #172033;
        border-color: #243148;
        color: #a9b5cc;
    }

    .residents-table tbody td[b-t3mn8tjibw] {
        border-color: #1f2a3d;
        color: #d8e2f5;
    }

    .residents-table tbody tr:hover[b-t3mn8tjibw] {
        background: #162033;
    }

    .residents-list-title h2[b-t3mn8tjibw],
    .resident-primary-text strong[b-t3mn8tjibw],
    .resident-unit-cell strong[b-t3mn8tjibw],
    .residents-empty-state strong[b-t3mn8tjibw] {
        color: #eef4ff;
    }

    .resident-primary-text span[b-t3mn8tjibw],
    .resident-unit-cell span[b-t3mn8tjibw],
    .resident-contact-cell span[b-t3mn8tjibw],
    .resident-date-cell span[b-t3mn8tjibw],
    .residents-list-footer > span[b-t3mn8tjibw] {
        color: #a9b5cc;
    }
}
/* /Pages/Residents/NewResident.razor.rz.scp.css */
/* =========================================================
   HABYTAL - Nuevo Residente / Información Personal
   ========================================================= */

.new-resident-page[b-frcuk11ibd] {
    --primary: #1565ff;
    --primary-hover: #084fc7;
    --primary-soft: #eaf2ff;
    --text-main: #111827;
    --text-muted: #5f6b85;
    --border: #dde5f2;
    --surface: #ffffff;
    --surface-soft: #f8fbff;
    padding: 28px 40px 32px;
    color: var(--text-main);
}

/* =========================================================
   ENCABEZADO
   ========================================================= */

.resident-header[b-frcuk11ibd] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 28px;
}

.resident-breadcrumb[b-frcuk11ibd] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--text-muted);
    font-size: .9rem;
    margin-bottom: 14px;
}

    .resident-breadcrumb strong[b-frcuk11ibd] {
        color: var(--primary);
        font-weight: 700;
    }

.resident-header h1[b-frcuk11ibd] {
    margin: 0;
    font-size: 1.85rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.resident-header p[b-frcuk11ibd] {
    margin: 8px 0 0;
    color: var(--text-muted);
}

.resident-cancel-top[b-frcuk11ibd] {
    border-radius: 8px !important;
    padding-inline: 20px !important;
}

/* =========================================================
   STEPPER SUPERIOR
   ========================================================= */

.resident-stepper[b-frcuk11ibd] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.resident-step[b-frcuk11ibd] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: var(--text-muted);
    text-align: left;
    cursor: default;
}

    .resident-step span[b-frcuk11ibd],
    .summary-steps li > span[b-frcuk11ibd] {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #b9c4d8;
        background: #ffffff;
        color: #32405c;
        font-weight: 700;
    }

    .resident-step.active[b-frcuk11ibd] {
        color: var(--primary);
        border-bottom-color: var(--primary);
    }

        .resident-step.active span[b-frcuk11ibd],
        .summary-steps li.active > span[b-frcuk11ibd] {
            background: var(--primary);
            color: #ffffff;
            border-color: var(--primary);
            box-shadow: 0 10px 22px rgba(21, 101, 255, .24);
        }

/* =========================================================
   LAYOUT PRINCIPAL
   ========================================================= */

.resident-content-grid[b-frcuk11ibd] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 28px;
    align-items: start;
}

.resident-form-card[b-frcuk11ibd],
.resident-summary-card[b-frcuk11ibd] {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface);
    box-shadow: 0 18px 48px rgba(15, 23, 42, .04);
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.resident-form-section[b-frcuk11ibd] {
    padding: 30px 32px;
}

.section-title[b-frcuk11ibd] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
}

    .section-title h2[b-frcuk11ibd] {
        margin: 0;
        font-size: 1.13rem;
        font-weight: 800;
    }

    .section-title span[b-frcuk11ibd] {
        color: var(--text-muted);
        font-size: .9rem;
        font-weight: 500;
    }

    .section-title .mud-icon-root[b-frcuk11ibd] {
        color: #24324d;
    }

.resident-form-grid[b-frcuk11ibd] {
    display: grid;
    gap: 22px 26px;
}

.four-columns[b-frcuk11ibd] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.three-columns[b-frcuk11ibd] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.vehicle-grid[b-frcuk11ibd] {
    grid-template-columns: 220px repeat(3, minmax(0, 1fr));
}

.vehicle-toggle label[b-frcuk11ibd] {
    display: block;
    margin-bottom: 9px;
    color: #24324d;
    font-size: .86rem;
    font-weight: 600;
}

.vehicle-button-group[b-frcuk11ibd] {
    width: 100%;
}

    .vehicle-button-group .mud-button-root[b-frcuk11ibd] {
        flex: 1;
        min-height: 45px;
    }

/* =========================================================
   ACCIONES
   ========================================================= */

.resident-actions[b-frcuk11ibd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 32px;
    border-top: 1px solid var(--border);
}

    .resident-actions .mud-button-root[b-frcuk11ibd] {
        min-width: 126px;
        min-height: 46px;
        border-radius: 8px !important;
    }

/* =========================================================
   RESUMEN LATERAL
   ========================================================= */

.resident-summary-card[b-frcuk11ibd] {
    padding: 32px 30px;
    position: sticky;
    top: 92px;
}

    .resident-summary-card h3[b-frcuk11ibd] {
        margin: 0 0 28px;
        font-size: 1.02rem;
        font-weight: 800;
    }

    .resident-summary-card h4[b-frcuk11ibd] {
        text-align: center;
        margin: 0 0 26px;
        font-size: 1.05rem;
        font-weight: 800;
    }

/* =========================================================
   FOTO DEL RESIDENTE
   ========================================================= */

.resident-summary-photo[b-frcuk11ibd] {
    position: relative;
    width: 112px;
    height: 112px;
    margin: 0 auto 16px;
    border-radius: 50%;
    background: linear-gradient(145deg,#dce9ff,#eef5ff);
    display: flex;
    align-items: center;
    justify-content: center;
}

.resident-summary-photo-img[b-frcuk11ibd] {
    width: 112px;
    height: 112px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid #fff;
    box-shadow: 0 10px 26px rgba(15,23,42,.12);
}

.resident-summary-photo-icon[b-frcuk11ibd] {
    color: #8fb4ff;
    font-size: 64px !important;
}

.resident-camera-input[b-frcuk11ibd] {
    display: none !important;
}

.resident-camera-button[b-frcuk11ibd] {
    position: absolute;
    right: 0;
    bottom: 4px;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 4px solid #ffffff;
    background: #1565ff;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(21,101,255,.30);
}

    .resident-camera-button:hover[b-frcuk11ibd] {
        background: #084fc7;
    }

.resident-camera-icon[b-frcuk11ibd] {
    color: #ffffff !important;
    font-size: 20px !important;
}

/* =========================================================
   PASOS DEL RESUMEN
   ========================================================= */

.summary-steps[b-frcuk11ibd] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 22px;
}

    .summary-steps li[b-frcuk11ibd] {
        display: grid;
        grid-template-columns: 36px 1fr;
        gap: 12px;
        position: relative;
    }

        .summary-steps li:not(:last-child)[b-frcuk11ibd]::after {
            content: "";
            position: absolute;
            left: 17px;
            top: 40px;
            bottom: -18px;
            width: 1px;
            background: var(--border);
        }

    .summary-steps strong[b-frcuk11ibd] {
        display: block;
        font-size: .9rem;
        color: #273652;
        margin-bottom: 6px;
    }

    .summary-steps p[b-frcuk11ibd] {
        margin: 0;
        color: var(--text-muted);
        font-size: .83rem;
        line-height: 1.45;
    }

.summary-note[b-frcuk11ibd] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-top: 34px;
    padding: 18px;
    border-radius: 8px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: .88rem;
    line-height: 1.5;
}

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

@media (max-width: 1200px) {
    .resident-content-grid[b-frcuk11ibd] {
        grid-template-columns: 1fr;
    }

    .resident-summary-card[b-frcuk11ibd] {
        position: static;
    }

    .four-columns[b-frcuk11ibd],
    .vehicle-grid[b-frcuk11ibd] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .new-resident-page[b-frcuk11ibd] {
        padding: 20px 16px;
    }

    .resident-header[b-frcuk11ibd] {
        flex-direction: column;
    }

    .resident-stepper[b-frcuk11ibd] {
        grid-template-columns: 1fr;
        gap: 8px;
        margin-bottom: 16px;
    }

    .resident-step[b-frcuk11ibd] {
        border: 1px solid var(--border);
        border-radius: 12px;
        padding: 10px 12px;
    }

        .resident-step.active[b-frcuk11ibd] {
            border-color: var(--primary);
        }

    .four-columns[b-frcuk11ibd],
    .three-columns[b-frcuk11ibd],
    .vehicle-grid[b-frcuk11ibd] {
        grid-template-columns: 1fr;
    }

    .resident-form-section[b-frcuk11ibd],
    .resident-actions[b-frcuk11ibd] {
        padding: 22px 18px;
    }
}

/* =========================================================
   DARK MODE
   ========================================================= */

@media (prefers-color-scheme: dark) {
    .new-resident-page[b-frcuk11ibd] {
        --text-main: #eef4ff;
        --text-muted: #a9b5cc;
        --border: #243148;
        --surface: #111827;
        --surface-soft: #172033;
        --primary-soft: rgba(21, 101, 255, .16);
    }

    .resident-step span[b-frcuk11ibd],
    .summary-steps li > span[b-frcuk11ibd] {
        background: #111827;
        color: #d8e2f5;
    }

    .resident-form-card[b-frcuk11ibd],
    .resident-summary-card[b-frcuk11ibd] {
        background: var(--surface);
    }

    .section-title .mud-icon-root[b-frcuk11ibd],
    .vehicle-toggle label[b-frcuk11ibd],
    .summary-steps strong[b-frcuk11ibd] {
        color: #e7eefc;
    }
}
/* /Pages/Residents/NewResidentResidentialInfo.razor.rz.scp.css */
/* =========================================================
   HABYTAL - Nuevo Residente / Información Residencial
   Ajuste visual aislado para la opción 2 del wizard.
   ========================================================= */

.resident-residential-page[b-8b66ckk4ph] {
    padding: 28px 32px 32px;
    color: #101828;
    background: #ffffff;
}

.resident-header[b-8b66ckk4ph] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 30px;
}

.resident-breadcrumb[b-8b66ckk4ph] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #475467;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 14px;
}

.resident-breadcrumb strong[b-8b66ckk4ph] {
    color: #005bea;
    font-weight: 700;
}

.resident-header h1[b-8b66ckk4ph] {
    margin: 0 0 8px;
    font-size: 28px;
    line-height: 1.1;
    font-weight: 800;
    color: #101828;
}

.resident-header p[b-8b66ckk4ph] {
    margin: 0;
    color: #475467;
    font-size: 15px;
}

.resident-cancel-top[b-8b66ckk4ph] {
    min-width: 120px;
    height: 44px;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

.resident-stepper[b-8b66ckk4ph] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: end;
    margin-bottom: 0;
}

.resident-step[b-8b66ckk4ph] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 58px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: #344054;
    font: inherit;
    cursor: default;
}

.resident-step span[b-8b66ckk4ph] {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b8c2d6;
    color: #101828;
    background: #ffffff;
    font-weight: 800;
}

.resident-step strong[b-8b66ckk4ph] {
    font-size: 14px;
    font-weight: 700;
}

.resident-step.active[b-8b66ckk4ph] {
    color: #005bea;
    border-bottom-color: #005bea;
}

.resident-step.active span[b-8b66ckk4ph] {
    border-color: #005bea;
    background: #005bea;
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(0, 91, 234, .22);
}

.resident-step.completed span[b-8b66ckk4ph] {
    border-color: #22aa55;
    color: #22aa55;
    background: #ffffff;
    font-size: 22px;
}

.resident-content-grid[b-8b66ckk4ph] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 350px;
    gap: 32px;
    align-items: start;
}

.resident-form-card[b-8b66ckk4ph],
.resident-summary-card[b-8b66ckk4ph] {
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    background: #ffffff;
}

.resident-form-card[b-8b66ckk4ph] {
    overflow: hidden;
}

.resident-form-section[b-8b66ckk4ph] {
    padding: 28px 30px 24px;
}

.section-title[b-8b66ckk4ph] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.section-title .mud-icon-root[b-8b66ckk4ph] {
    color: #344054;
    font-size: 24px;
}

.section-title h2[b-8b66ckk4ph] {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: #101828;
}

.resident-form-grid[b-8b66ckk4ph] {
    display: grid;
    gap: 22px 28px;
}

.resident-form-grid.four-columns[b-8b66ckk4ph] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.resident-form-grid.two-columns[b-8b66ckk4ph] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.resident-info-alert[b-8b66ckk4ph] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 26px;
    padding: 15px 18px;
    border-radius: 8px;
    background: #edf4ff;
    color: #005bea;
    font-size: 14px;
    font-weight: 600;
}

.resident-switch-field label[b-8b66ckk4ph] {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    color: #344054;
    font-weight: 600;
}

.resident-switch-field label span[b-8b66ckk4ph] {
    color: #ef4444;
}

.resident-switch-inline[b-8b66ckk4ph] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
}

.resident-switch-inline strong[b-8b66ckk4ph] {
    color: #101828;
    font-size: 14px;
}

.resident-actions[b-8b66ckk4ph] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 28px 30px;
    border-top: 1px solid #dbe3ef;
}

.resident-actions .mud-button-root[b-8b66ckk4ph] {
    min-width: 130px;
    height: 44px;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

.resident-summary-card[b-8b66ckk4ph] {
    padding: 26px 20px;
    min-height: 650px;
}

.resident-summary-card h3[b-8b66ckk4ph] {
    margin: 0 0 18px;
    font-size: 18px;
    color: #101828;
    font-weight: 800;
}

.summary-person[b-8b66ckk4ph] {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding-bottom: 24px;
    border-bottom: 1px solid #dbe3ef;
}

.summary-avatar-small[b-8b66ckk4ph] {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: #e8f1ff;
    color: #005bea;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.summary-avatar-small .mud-icon-root[b-8b66ckk4ph] {
    font-size: 34px;
}

.summary-avatar-small-img[b-8b66ckk4ph] {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    object-fit: cover;
    display: block;
}

.summary-person h4[b-8b66ckk4ph] {
    margin: 0 0 6px;
    font-size: 15px;
    color: #101828;
    font-weight: 800;
    max-width: 155px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.summary-person p[b-8b66ckk4ph] {
    margin: 0;
    font-size: 13px;
    color: #475467;
}

.summary-badge[b-8b66ckk4ph],
.summary-steps em[b-8b66ckk4ph] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    padding: 4px 9px;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
}

.summary-badge.success[b-8b66ckk4ph],
.summary-steps .completed em[b-8b66ckk4ph] {
    color: #16803a;
    background: #dcf7e4;
}

.summary-steps .active em[b-8b66ckk4ph] {
    color: #005bea;
    background: #e7f0ff;
}

.summary-steps .pending em[b-8b66ckk4ph] {
    color: #667085;
    background: #eef1f5;
}

.summary-steps[b-8b66ckk4ph] {
    list-style: none;
    margin: 22px 0 0;
    padding: 0;
}

.summary-steps li[b-8b66ckk4ph] {
    position: relative;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 14px;
    padding: 0 0 22px;
}

.summary-steps li[b-8b66ckk4ph]::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 30px;
    bottom: 0;
    width: 1px;
    background: #dbe3ef;
}

.summary-steps li:last-child[b-8b66ckk4ph]::before {
    display: none;
}

.summary-steps li > span[b-8b66ckk4ph] {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b8c2d6;
    background: #ffffff;
    color: #344054;
    font-size: 12px;
    font-weight: 800;
    z-index: 1;
}

.summary-steps li.completed > span[b-8b66ckk4ph] {
    border-color: #22aa55;
    background: #22aa55;
    color: #ffffff;
}

.summary-steps li.active[b-8b66ckk4ph] {
    padding: 18px 0 22px;
    margin: 0 -4px 14px;
    background: linear-gradient(90deg, #f0f6ff 0%, #ffffff 100%);
}

.summary-steps li.active > span[b-8b66ckk4ph] {
    border-color: #005bea;
    background: #005bea;
    color: #ffffff;
}

.summary-steps strong[b-8b66ckk4ph] {
    display: inline-block;
    color: #344054;
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 8px;
}

.summary-steps p[b-8b66ckk4ph] {
    margin: 4px 0 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.45;
}

.summary-steps dl[b-8b66ckk4ph] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px 10px;
    margin: 14px 0 0;
    font-size: 12px;
}

.summary-steps dt[b-8b66ckk4ph] {
    color: #667085;
}

.summary-steps dd[b-8b66ckk4ph] {
    margin: 0;
    color: #101828;
    font-weight: 600;
}

.summary-note[b-8b66ckk4ph] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 22px;
    padding: 14px 16px;
    border-radius: 8px;
    background: #eaf2ff;
    color: #005bea;
    font-size: 13px;
    line-height: 1.45;
}

.summary-note .mud-icon-root[b-8b66ckk4ph] {
    font-size: 20px;
}

@media (max-width: 1280px) {
    .resident-content-grid[b-8b66ckk4ph] {
        grid-template-columns: 1fr;
    }

    .resident-summary-card[b-8b66ckk4ph] {
        min-height: auto;
    }
}

@media (max-width: 900px) {
    .resident-residential-page[b-8b66ckk4ph] {
        padding: 20px 16px 28px;
    }

    .resident-header[b-8b66ckk4ph] {
        flex-direction: column;
    }

    .resident-stepper[b-8b66ckk4ph],
    .resident-form-grid.four-columns[b-8b66ckk4ph],
    .resident-form-grid.two-columns[b-8b66ckk4ph] {
        grid-template-columns: 1fr;
    }

    .resident-step[b-8b66ckk4ph] {
        justify-content: flex-start;
        border-bottom: 1px solid #dbe3ef;
    }
}
/* /Pages/Residents/ResidentContactAccess.razor.rz.scp.css */
/* =========================================================
   HABYTAL - Nuevo Residente / Contacto y Acceso
   Ajuste visual aislado para la opción 3 del wizard.
   ========================================================= */

.resident-contact-page[b-mz3yzqnmvt] {
    padding: 28px 32px 32px;
    color: #101828;
    background: #ffffff;
}

.resident-header[b-mz3yzqnmvt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 30px;
}

.resident-breadcrumb[b-mz3yzqnmvt] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #475467;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 14px;
}

.resident-breadcrumb strong[b-mz3yzqnmvt] {
    color: #005bea;
    font-weight: 700;
}

.resident-header h1[b-mz3yzqnmvt] {
    margin: 0 0 8px;
    font-size: 28px;
    line-height: 1.1;
    font-weight: 800;
    color: #101828;
}

.resident-header p[b-mz3yzqnmvt] {
    margin: 0;
    color: #475467;
    font-size: 15px;
}

.resident-cancel-top[b-mz3yzqnmvt] {
    min-width: 120px;
    height: 44px;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

.resident-stepper[b-mz3yzqnmvt] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: end;
    margin-bottom: 0;
}

.resident-step[b-mz3yzqnmvt] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 58px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: #344054;
    font: inherit;
    cursor: default;
}

.resident-step span[b-mz3yzqnmvt] {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b8c2d6;
    color: #101828;
    background: #ffffff;
    font-weight: 800;
}

.resident-step strong[b-mz3yzqnmvt] {
    font-size: 14px;
    font-weight: 700;
}

.resident-step.active[b-mz3yzqnmvt] {
    color: #005bea;
    border-bottom-color: #005bea;
}

.resident-step.active span[b-mz3yzqnmvt] {
    border-color: #005bea;
    background: #005bea;
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(0, 91, 234, .22);
}

.resident-step.completed span[b-mz3yzqnmvt] {
    border-color: #22aa55;
    color: #22aa55;
    background: #ffffff;
    font-size: 22px;
}

.resident-content-grid[b-mz3yzqnmvt] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 350px;
    gap: 32px;
    align-items: start;
}

.resident-form-card[b-mz3yzqnmvt],
.resident-summary-card[b-mz3yzqnmvt] {
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    background: #ffffff;
}

.resident-form-card[b-mz3yzqnmvt] {
    overflow: hidden;
}

.resident-form-section[b-mz3yzqnmvt] {
    padding: 28px 30px 24px;
}

.section-title[b-mz3yzqnmvt] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.section-title .mud-icon-root[b-mz3yzqnmvt] {
    color: #344054;
    font-size: 24px;
}

.section-title h2[b-mz3yzqnmvt] {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: #101828;
}

.resident-form-grid[b-mz3yzqnmvt] {
    display: grid;
    gap: 22px 28px;
}

.resident-form-grid.four-columns[b-mz3yzqnmvt] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.resident-form-grid.two-columns[b-mz3yzqnmvt] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.resident-info-alert[b-mz3yzqnmvt] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 26px;
    padding: 15px 18px;
    border-radius: 8px;
    background: #edf4ff;
    color: #005bea;
    font-size: 14px;
    font-weight: 600;
}

.resident-switch-field label[b-mz3yzqnmvt] {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    color: #344054;
    font-weight: 600;
}

.resident-switch-field label span[b-mz3yzqnmvt] {
    color: #ef4444;
}

.resident-switch-inline[b-mz3yzqnmvt] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
}

.resident-switch-inline strong[b-mz3yzqnmvt] {
    color: #101828;
    font-size: 14px;
}

.resident-actions[b-mz3yzqnmvt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 28px 30px;
    border-top: 1px solid #dbe3ef;
}

.resident-actions .mud-button-root[b-mz3yzqnmvt] {
    min-width: 130px;
    height: 44px;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

.resident-summary-card[b-mz3yzqnmvt] {
    padding: 26px 20px;
    min-height: 650px;
}

.resident-summary-card h3[b-mz3yzqnmvt] {
    margin: 0 0 18px;
    font-size: 18px;
    color: #101828;
    font-weight: 800;
}

.summary-person[b-mz3yzqnmvt] {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding-bottom: 24px;
    border-bottom: 1px solid #dbe3ef;
}

.summary-avatar-small[b-mz3yzqnmvt] {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: #e8f1ff;
    color: #005bea;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.summary-avatar-small .mud-icon-root[b-mz3yzqnmvt] {
    font-size: 34px;
}

.summary-avatar-small-img[b-mz3yzqnmvt] {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    object-fit: cover;
    display: block;
}

.summary-person h4[b-mz3yzqnmvt] {
    margin: 0 0 6px;
    font-size: 15px;
    color: #101828;
    font-weight: 800;
    max-width: 155px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.summary-person p[b-mz3yzqnmvt] {
    margin: 0;
    font-size: 13px;
    color: #475467;
}

.summary-badge[b-mz3yzqnmvt],
.summary-steps em[b-mz3yzqnmvt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    padding: 4px 9px;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
}

.summary-badge.success[b-mz3yzqnmvt],
.summary-steps .completed em[b-mz3yzqnmvt] {
    color: #16803a;
    background: #dcf7e4;
}

.summary-steps .active em[b-mz3yzqnmvt] {
    color: #005bea;
    background: #e7f0ff;
}

.summary-steps .pending em[b-mz3yzqnmvt] {
    color: #667085;
    background: #eef1f5;
}

.summary-steps[b-mz3yzqnmvt] {
    list-style: none;
    margin: 22px 0 0;
    padding: 0;
}

.summary-steps li[b-mz3yzqnmvt] {
    position: relative;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 14px;
    padding: 0 0 22px;
}

.summary-steps li[b-mz3yzqnmvt]::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 30px;
    bottom: 0;
    width: 1px;
    background: #dbe3ef;
}

.summary-steps li:last-child[b-mz3yzqnmvt]::before {
    display: none;
}

.summary-steps li > span[b-mz3yzqnmvt] {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b8c2d6;
    background: #ffffff;
    color: #344054;
    font-size: 12px;
    font-weight: 800;
    z-index: 1;
}

.summary-steps li.completed > span[b-mz3yzqnmvt] {
    border-color: #22aa55;
    background: #22aa55;
    color: #ffffff;
}

.summary-steps li.active[b-mz3yzqnmvt] {
    padding: 18px 0 22px;
    margin: 0 -4px 14px;
    background: linear-gradient(90deg, #f0f6ff 0%, #ffffff 100%);
}

.summary-steps li.active > span[b-mz3yzqnmvt] {
    border-color: #005bea;
    background: #005bea;
    color: #ffffff;
}

.summary-steps li.active > div[b-mz3yzqnmvt] {
    min-width: 0;
    padding-right: 4px;
}

.summary-steps li.active dl[b-mz3yzqnmvt] {
    grid-template-columns: 70px minmax(0, 1fr);
}

.summary-steps strong[b-mz3yzqnmvt] {
    display: inline-block;
    color: #344054;
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 8px;
}

.summary-steps p[b-mz3yzqnmvt] {
    margin: 4px 0 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.45;
}

.summary-steps dl[b-mz3yzqnmvt] {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 12px 12px;
    margin: 14px 0 0;
    font-size: 12px;
    width: 100%;
}

.summary-steps dt[b-mz3yzqnmvt] {
    color: #667085;
    min-width: 0;
}

.summary-steps dd[b-mz3yzqnmvt] {
    margin: 0;
    color: #101828;
    font-weight: 600;
    min-width: 0;
    text-align: left;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.summary-note[b-mz3yzqnmvt] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 22px;
    padding: 14px 16px;
    border-radius: 8px;
    background: #eaf2ff;
    color: #005bea;
    font-size: 13px;
    line-height: 1.45;
}

.summary-note .mud-icon-root[b-mz3yzqnmvt] {
    font-size: 20px;
}

@media (max-width: 1280px) {
    .resident-content-grid[b-mz3yzqnmvt] {
        grid-template-columns: 1fr;
    }

    .resident-summary-card[b-mz3yzqnmvt] {
        min-height: auto;
    }
}

@media (max-width: 900px) {
    .resident-contact-page[b-mz3yzqnmvt] {
        padding: 20px 16px 28px;
    }

    .resident-header[b-mz3yzqnmvt] {
        flex-direction: column;
    }

    .resident-stepper[b-mz3yzqnmvt],
    .resident-form-grid.four-columns[b-mz3yzqnmvt],
    .resident-form-grid.two-columns[b-mz3yzqnmvt] {
        grid-template-columns: 1fr;
    }

    .resident-step[b-mz3yzqnmvt] {
        justify-content: flex-start;
        border-bottom: 1px solid #dbe3ef;
    }
}


/* =========================================================
   CONTACTO Y ACCESO - AJUSTES ESPECÍFICOS
   ========================================================= */

.resident-section-subtitle[b-mz3yzqnmvt] {
    margin: -10px 0 0;
    color: #475467;
    font-size: 14px;
}

.resident-password-row[b-mz3yzqnmvt] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 48px;
    gap: 10px;
    align-items: start;
}

.resident-regenerate-button[b-mz3yzqnmvt] {
    margin-top: 3px !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 8px !important;
}

.summary-steps.detailed li.active[b-mz3yzqnmvt] {
    background: #f3f7ff;
}

@media (max-width: 768px) {
    .resident-password-row[b-mz3yzqnmvt] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Residents/ResidentDocuments.razor.rz.scp.css */
/* ================================================================================================
   HABYTAL - ResidentDocuments
   Paso 4 del wizard: documentos, resumen lateral y acciones de navegación.
   ================================================================================================ */

/* ================================================================================================
   VARIABLES Y CONTENEDOR
   ================================================================================================ */

.resident-documents-page[b-6nkfxcvhmt] {
    --primary: #005bea;
    --primary-soft: #eaf2ff;
    --success: #22aa55;
    --success-soft: #dcf7e4;
    --text-main: #101828;
    --text-muted: #667085;
    --border: #dbe3ef;
    --surface: #ffffff;
    padding: 28px 32px 32px;
    color: var(--text-main);
    background: #ffffff;
}

/* ================================================================================================
   ENCABEZADO
   ================================================================================================ */

.resident-header[b-6nkfxcvhmt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 30px;
}

.resident-breadcrumb[b-6nkfxcvhmt] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #475467;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 14px;
}

.resident-breadcrumb strong[b-6nkfxcvhmt] {
    color: var(--primary);
    font-weight: 700;
}

.resident-header h1[b-6nkfxcvhmt] {
    margin: 0 0 8px;
    font-size: 28px;
    line-height: 1.1;
    font-weight: 800;
    color: var(--text-main);
}

.resident-header p[b-6nkfxcvhmt] {
    margin: 0;
    color: #475467;
    font-size: 15px;
}

.resident-cancel-top[b-6nkfxcvhmt] {
    min-width: 120px;
    height: 44px;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

/* ================================================================================================
   STEPPER SUPERIOR
   ================================================================================================ */

.resident-stepper[b-6nkfxcvhmt] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: end;
    margin-bottom: 0;
}

.resident-step[b-6nkfxcvhmt] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 58px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: #344054;
    font: inherit;
    cursor: default;
}

.resident-step span[b-6nkfxcvhmt] {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b8c2d6;
    color: var(--text-main);
    background: #ffffff;
    font-weight: 800;
}

.resident-step strong[b-6nkfxcvhmt] {
    font-size: 14px;
    font-weight: 700;
}

.resident-step.active[b-6nkfxcvhmt] {
    color: var(--primary);
    border-bottom-color: var(--primary);
}

.resident-step.active span[b-6nkfxcvhmt] {
    border-color: var(--primary);
    background: var(--primary);
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(0, 91, 234, .22);
}

.resident-step.completed span[b-6nkfxcvhmt] {
    border-color: var(--success);
    color: #ffffff;
    background: var(--success);
}

/* ================================================================================================
   LAYOUT PRINCIPAL
   ================================================================================================ */

.resident-content-grid[b-6nkfxcvhmt] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 350px;
    gap: 32px;
    align-items: start;
}

.resident-form-card[b-6nkfxcvhmt],
.resident-summary-card[b-6nkfxcvhmt] {
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
}

.resident-form-card[b-6nkfxcvhmt] {
    overflow: hidden;
}

.resident-form-section[b-6nkfxcvhmt] {
    padding: 28px 30px 24px;
}

.resident-section-title[b-6nkfxcvhmt] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    color: var(--text-main);
    font-size: 18px;
    font-weight: 800;
}

.resident-section-title .mud-icon-root[b-6nkfxcvhmt] {
    color: #344054;
    font-size: 24px;
}

.resident-contact-note[b-6nkfxcvhmt] {
    border-radius: 8px !important;
    font-weight: 600 !important;
}

/* ================================================================================================
   TABLA DE DOCUMENTOS
   ================================================================================================ */

.resident-document-table[b-6nkfxcvhmt] {
    display: grid;
    margin-top: 22px;
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    background: #ffffff;
}

.resident-document-header[b-6nkfxcvhmt],
.resident-document-row[b-6nkfxcvhmt] {
    display: grid;
    grid-template-columns: minmax(220px, 1.15fr) minmax(240px, 1.25fr) minmax(240px, 1fr) 120px;
    gap: 18px;
    align-items: center;
}

.resident-document-header[b-6nkfxcvhmt] {
    padding: 16px 20px;
    background: #f8fbff;
    border-bottom: 1px solid var(--border);
    color: #344054;
    font-size: 13px;
    font-weight: 800;
}

.resident-document-row[b-6nkfxcvhmt] {
    min-height: 96px;
    padding: 18px 20px;
    border-bottom: 1px solid #e7edf6;
}

.resident-document-row:last-child[b-6nkfxcvhmt] {
    border-bottom: 0;
}

/* ================================================================================================
   COLUMNA DOCUMENTO
   ================================================================================================ */

.resident-document-main[b-6nkfxcvhmt] {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    min-width: 0;
}

.resident-doc-icon[b-6nkfxcvhmt] {
    width: 48px;
    height: 48px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.resident-doc-icon .mud-icon-root[b-6nkfxcvhmt] {
    font-size: 24px;
}

.resident-document-name[b-6nkfxcvhmt] {
    min-width: 0;
}

.resident-document-name strong[b-6nkfxcvhmt] {
    display: block;
    color: var(--text-main);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.35;
}

.resident-document-name small[b-6nkfxcvhmt] {
    display: block;
    margin-top: 4px;
    color: var(--text-muted);
    font-size: 12px;
}

.resident-document-blue[b-6nkfxcvhmt] {
    color: var(--primary);
    background: #e7f0ff;
}

.resident-document-green[b-6nkfxcvhmt] {
    color: #16803a;
    background: var(--success-soft);
}

.resident-document-yellow[b-6nkfxcvhmt] {
    color: #b77900;
    background: #fff3d7;
}

.resident-document-purple[b-6nkfxcvhmt] {
    color: #7c3aed;
    background: #eee7ff;
}

.resident-document-pink[b-6nkfxcvhmt] {
    color: #db2777;
    background: #ffe4f1;
}

/* ================================================================================================
   DESCRIPCIÓN Y CARGA
   ================================================================================================ */

.resident-document-description[b-6nkfxcvhmt] {
    margin: 0;
    color: #475467;
    font-size: 13px;
    line-height: 1.45;
}

.resident-upload-cell[b-6nkfxcvhmt] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.resident-upload-box[b-6nkfxcvhmt] {
    width: 100%;
    min-height: 58px;
    border: 1px dashed #b8c7df;
    border-radius: 10px;
    background: #ffffff;
    color: var(--primary);
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 2px 10px;
    align-items: center;
    padding: 10px 14px;
    cursor: pointer;
    text-align: left;
    transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.resident-upload-box:hover[b-6nkfxcvhmt] {
    border-color: var(--primary);
    background: #f3f7ff;
    transform: translateY(-1px);
}

.resident-upload-box .mud-icon-root[b-6nkfxcvhmt] {
    grid-row: 1 / span 2;
    font-size: 22px;
}

.resident-upload-box span[b-6nkfxcvhmt] {
    min-width: 0;
    color: var(--primary);
    font-size: 13px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.resident-upload-box small[b-6nkfxcvhmt] {
    color: var(--text-muted);
    font-size: 11px;
    line-height: 1.2;
}

.resident-upload-box-success[b-6nkfxcvhmt] {
    border-color: var(--success);
    background: #f0fff5;
    color: #16803a;
}

.resident-upload-box-success span[b-6nkfxcvhmt],
.resident-upload-box-success .mud-icon-root[b-6nkfxcvhmt] {
    color: #16803a;
}

.resident-remove-file[b-6nkfxcvhmt] {
    justify-self: start;
    min-height: 28px !important;
    padding-inline: 0 !important;
    font-size: 12px !important;
}

.resident-document-status[b-6nkfxcvhmt] {
    display: flex;
    justify-content: flex-start;
}

.resident-document-table input[type="file"][b-6nkfxcvhmt] {
    display: none !important;
}

/* ================================================================================================
   ACCIONES
   ================================================================================================ */

.resident-actions[b-6nkfxcvhmt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 28px 30px;
    border-top: 1px solid var(--border);
}

.resident-actions .mud-button-root[b-6nkfxcvhmt] {
    min-width: 150px;
    height: 44px;
    border-radius: 8px !important;
    font-weight: 700 !important;
}

/* ================================================================================================
   RESUMEN LATERAL
   ================================================================================================ */

.resident-summary-card[b-6nkfxcvhmt] {
    padding: 26px 20px;
    min-height: 650px;
    position: sticky;
    top: 92px;
}

.resident-summary-card h3[b-6nkfxcvhmt] {
    margin: 0 0 18px;
    font-size: 18px;
    color: var(--text-main);
    font-weight: 800;
}

.summary-person[b-6nkfxcvhmt] {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--border);
}

.summary-avatar-small[b-6nkfxcvhmt] {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: #e8f1ff;
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.summary-avatar-small .mud-icon-root[b-6nkfxcvhmt] {
    font-size: 34px;
}

.summary-avatar-small-img[b-6nkfxcvhmt] {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    object-fit: cover;
    display: block;
}

.summary-person h4[b-6nkfxcvhmt] {
    margin: 0 0 6px;
    font-size: 15px;
    color: var(--text-main);
    font-weight: 800;
    max-width: 145px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.summary-person p[b-6nkfxcvhmt] {
    margin: 0;
    font-size: 13px;
    color: #475467;
}

.summary-badge[b-6nkfxcvhmt],
.summary-steps em[b-6nkfxcvhmt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    padding: 4px 9px;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
}

.summary-badge.success[b-6nkfxcvhmt],
.summary-steps .completed em[b-6nkfxcvhmt] {
    color: #16803a;
    background: var(--success-soft);
}

.summary-steps .active em[b-6nkfxcvhmt] {
    color: var(--primary);
    background: #e7f0ff;
}

.summary-steps .pending em[b-6nkfxcvhmt] {
    color: var(--text-muted);
    background: #eef1f5;
}

.summary-steps[b-6nkfxcvhmt] {
    list-style: none;
    margin: 22px 0 0;
    padding: 0;
}

.summary-steps li[b-6nkfxcvhmt] {
    position: relative;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 14px;
    padding: 0 0 22px;
}

.summary-steps li[b-6nkfxcvhmt]::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 30px;
    bottom: 0;
    width: 1px;
    background: var(--border);
}

.summary-steps li:last-child[b-6nkfxcvhmt]::before {
    display: none;
}

.summary-steps li > span[b-6nkfxcvhmt] {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b8c2d6;
    background: #ffffff;
    color: #344054;
    font-size: 12px;
    font-weight: 800;
    z-index: 1;
}

.summary-steps li.completed > span[b-6nkfxcvhmt] {
    border-color: var(--success);
    background: var(--success);
    color: #ffffff;
}

.summary-steps li.active[b-6nkfxcvhmt] {
    padding: 18px 0 22px;
    margin: 0 -4px 14px;
    background: linear-gradient(90deg, #f0f6ff 0%, #ffffff 100%);
}

.summary-steps li.active > span[b-6nkfxcvhmt] {
    border-color: var(--primary);
    background: var(--primary);
    color: #ffffff;
}

.summary-steps strong[b-6nkfxcvhmt] {
    display: inline-block;
    color: #344054;
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 8px;
}

.summary-steps p[b-6nkfxcvhmt] {
    margin: 4px 0 0;
    color: var(--text-muted);
    font-size: 13px;
    line-height: 1.45;
}

.summary-steps dl[b-6nkfxcvhmt] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 12px;
    margin: 14px 0 0;
    font-size: 12px;
}

.summary-steps dt[b-6nkfxcvhmt] {
    color: var(--text-muted);
}

.summary-steps dd[b-6nkfxcvhmt] {
    margin: 0;
    color: var(--text-main);
    font-weight: 700;
    text-align: left;
}

.summary-note[b-6nkfxcvhmt] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 22px;
    padding: 14px 16px;
    border-radius: 8px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 13px;
    line-height: 1.45;
}

.summary-note .mud-icon-root[b-6nkfxcvhmt] {
    font-size: 20px;
}

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

@media (max-width: 1280px) {
    .resident-content-grid[b-6nkfxcvhmt] {
        grid-template-columns: 1fr;
    }

    .resident-summary-card[b-6nkfxcvhmt] {
        position: static;
        min-height: auto;
    }
}

@media (max-width: 1100px) {
    .resident-document-header[b-6nkfxcvhmt] {
        display: none;
    }

    .resident-document-row[b-6nkfxcvhmt] {
        grid-template-columns: 1fr;
        gap: 14px;
        align-items: start;
    }

    .resident-document-status[b-6nkfxcvhmt] {
        justify-content: flex-start;
    }
}

@media (max-width: 900px) {
    .resident-documents-page[b-6nkfxcvhmt] {
        padding: 20px 16px 28px;
    }

    .resident-header[b-6nkfxcvhmt] {
        flex-direction: column;
    }

    .resident-stepper[b-6nkfxcvhmt] {
        grid-template-columns: 1fr;
        gap: 8px;
        margin-bottom: 16px;
    }

    .resident-step[b-6nkfxcvhmt] {
        justify-content: flex-start;
        border: 1px solid var(--border);
        border-radius: 10px;
        padding: 10px 12px;
    }

    .resident-actions[b-6nkfxcvhmt] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .resident-actions .mud-button-root[b-6nkfxcvhmt] {
        width: 100%;
    }
}
/* /Pages/Residents/ResidentFormDialog.razor.rz.scp.css */
/* =========================================================
   RESIDENT FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.residents-dialog[b-et5zoemfeh] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.residents-dialog-header[b-et5zoemfeh] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.residents-dialog-icon[b-et5zoemfeh] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .residents-dialog-icon .mud-icon-root[b-et5zoemfeh] {
        font-size: 38px;
    }

.residents-dialog-title[b-et5zoemfeh] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.residents-dialog-subtitle[b-et5zoemfeh] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.residents-dialog-form[b-et5zoemfeh] {
    padding-top: 12px;
}

.residents-input .mud-input-outlined-border[b-et5zoemfeh] {
    border-radius: 12px !important;
}

.residents-input .mud-input-root[b-et5zoemfeh] {
    min-height: 56px;
}

.residents-input .mud-input-label[b-et5zoemfeh] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.residents-status-box[b-et5zoemfeh] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.residents-status-title[b-et5zoemfeh] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.residents-status-content[b-et5zoemfeh] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.residents-status-help[b-et5zoemfeh] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.residents-dialog-actions[b-et5zoemfeh] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .residents-dialog-actions .mud-button-root[b-et5zoemfeh] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .residents-dialog-header[b-et5zoemfeh] {
        align-items: flex-start;
        gap: 14px;
    }

    .residents-dialog-icon[b-et5zoemfeh] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .residents-dialog-icon .mud-icon-root[b-et5zoemfeh] {
            font-size: 30px;
        }

    .residents-dialog-actions[b-et5zoemfeh] {
        flex-direction: column-reverse;
    }

        .residents-dialog-actions .mud-button-root[b-et5zoemfeh] {
            width: 100%;
        }
}
/* /Pages/States/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA STATES - LAYOUT GENERAL
   ========================================================= */

.states-page[b-xsfuys65rk] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.states-header[b-xsfuys65rk] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .states-header h1[b-xsfuys65rk] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .states-header p[b-xsfuys65rk] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-xsfuys65rk](.btn-new-states) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.states-summary-card[b-xsfuys65rk] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-xsfuys65rk] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-xsfuys65rk] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-xsfuys65rk] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-xsfuys65rk] {
        font-size: 31px;
    }

.summary-blue[b-xsfuys65rk] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-xsfuys65rk] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-xsfuys65rk] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-xsfuys65rk] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-xsfuys65rk] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-xsfuys65rk] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.states-toolbar[b-xsfuys65rk] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-xsfuys65rk] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-xsfuys65rk](.states-search),
[b-xsfuys65rk](.states-filter) {
    background: #ffffff !important;
}

[b-xsfuys65rk](.states-search .mud-input-outlined-border),
[b-xsfuys65rk](.states-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-xsfuys65rk](.states-search .mud-input-root),
[b-xsfuys65rk](.states-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-xsfuys65rk](.states-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-xsfuys65rk](.states-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-xsfuys65rk](.states-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.states-name-cell[b-xsfuys65rk] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-xsfuys65rk] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-xsfuys65rk] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-xsfuys65rk] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-xsfuys65rk] {
            background: #12b76a;
        }

    .status-pill.inactive[b-xsfuys65rk] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-xsfuys65rk] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.states-actions[b-xsfuys65rk] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-xsfuys65rk](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-xsfuys65rk](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-xsfuys65rk] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .states-summary-card[b-xsfuys65rk] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-xsfuys65rk] {
        display: none;
    }

    .states-toolbar[b-xsfuys65rk] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-xsfuys65rk] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/States/StateFormDialog.razor.rz.scp.css */
/* =========================================================
   STATE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.states-dialog[b-rjhecm37nl] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.states-dialog-header[b-rjhecm37nl] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.states-dialog-icon[b-rjhecm37nl] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .states-dialog-icon .mud-icon-root[b-rjhecm37nl] {
        font-size: 38px;
    }

.states-dialog-title[b-rjhecm37nl] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.states-dialog-subtitle[b-rjhecm37nl] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.states-dialog-form[b-rjhecm37nl] {
    padding-top: 12px;
}

.states-input .mud-input-outlined-border[b-rjhecm37nl] {
    border-radius: 12px !important;
}

.states-input .mud-input-root[b-rjhecm37nl] {
    min-height: 56px;
}

.states-input .mud-input-label[b-rjhecm37nl] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.states-status-box[b-rjhecm37nl] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.states-status-title[b-rjhecm37nl] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.states-status-content[b-rjhecm37nl] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.states-status-help[b-rjhecm37nl] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.states-dialog-actions[b-rjhecm37nl] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .states-dialog-actions .mud-button-root[b-rjhecm37nl] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .states-dialog-header[b-rjhecm37nl] {
        align-items: flex-start;
        gap: 14px;
    }

    .states-dialog-icon[b-rjhecm37nl] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .states-dialog-icon .mud-icon-root[b-rjhecm37nl] {
            font-size: 30px;
        }

    .states-dialog-actions[b-rjhecm37nl] {
        flex-direction: column-reverse;
    }

        .states-dialog-actions .mud-button-root[b-rjhecm37nl] {
            width: 100%;
        }
}
/* /Pages/Tenants/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TENANTS - LAYOUT GENERAL
   ========================================================= */

.tenants-page[b-whyxv2jqr3] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.tenants-header[b-whyxv2jqr3] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .tenants-header h1[b-whyxv2jqr3] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .tenants-header p[b-whyxv2jqr3] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-whyxv2jqr3](.btn-new-tenants) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.tenants-summary-card[b-whyxv2jqr3] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-whyxv2jqr3] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-whyxv2jqr3] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-whyxv2jqr3] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-whyxv2jqr3] {
        font-size: 31px;
    }

.summary-blue[b-whyxv2jqr3] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-whyxv2jqr3] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-whyxv2jqr3] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-whyxv2jqr3] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-whyxv2jqr3] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-whyxv2jqr3] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.tenants-toolbar[b-whyxv2jqr3] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-whyxv2jqr3] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-whyxv2jqr3](.tenants-search),
[b-whyxv2jqr3](.tenants-filter) {
    background: #ffffff !important;
}

[b-whyxv2jqr3](.tenants-search .mud-input-outlined-border),
[b-whyxv2jqr3](.tenants-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-whyxv2jqr3](.tenants-search .mud-input-root),
[b-whyxv2jqr3](.tenants-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-whyxv2jqr3](.tenants-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-whyxv2jqr3](.tenants-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-whyxv2jqr3](.tenants-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.tenants-name-cell[b-whyxv2jqr3] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-whyxv2jqr3] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-whyxv2jqr3] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-whyxv2jqr3] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-whyxv2jqr3] {
            background: #12b76a;
        }

    .status-pill.inactive[b-whyxv2jqr3] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-whyxv2jqr3] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.tenants-actions[b-whyxv2jqr3] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-whyxv2jqr3](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-whyxv2jqr3](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-whyxv2jqr3] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .tenants-summary-card[b-whyxv2jqr3] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-whyxv2jqr3] {
        display: none;
    }

    .tenants-toolbar[b-whyxv2jqr3] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-whyxv2jqr3] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Tenants/TenantFormDialog.razor.rz.scp.css */
/* =========================================================
   TENANT FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.tenants-dialog[b-6ov2kr8l45] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.tenants-dialog-header[b-6ov2kr8l45] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.tenants-dialog-icon[b-6ov2kr8l45] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .tenants-dialog-icon .mud-icon-root[b-6ov2kr8l45] {
        font-size: 38px;
    }

.tenants-dialog-title[b-6ov2kr8l45] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.tenants-dialog-subtitle[b-6ov2kr8l45] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.tenants-dialog-form[b-6ov2kr8l45] {
    padding-top: 12px;
}

.tenants-input .mud-input-outlined-border[b-6ov2kr8l45] {
    border-radius: 12px !important;
}

.tenants-input .mud-input-root[b-6ov2kr8l45] {
    min-height: 56px;
}

.tenants-input .mud-input-label[b-6ov2kr8l45] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.tenants-status-box[b-6ov2kr8l45] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.tenants-status-title[b-6ov2kr8l45] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.tenants-status-content[b-6ov2kr8l45] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.tenants-status-help[b-6ov2kr8l45] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.tenants-dialog-actions[b-6ov2kr8l45] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .tenants-dialog-actions .mud-button-root[b-6ov2kr8l45] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .tenants-dialog-header[b-6ov2kr8l45] {
        align-items: flex-start;
        gap: 14px;
    }

    .tenants-dialog-icon[b-6ov2kr8l45] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .tenants-dialog-icon .mud-icon-root[b-6ov2kr8l45] {
            font-size: 30px;
        }

    .tenants-dialog-actions[b-6ov2kr8l45] {
        flex-direction: column-reverse;
    }

        .tenants-dialog-actions .mud-button-root[b-6ov2kr8l45] {
            width: 100%;
        }
}
/* /Pages/TicketCategories/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TICKETCATEGORIES - LAYOUT GENERAL
   ========================================================= */

.ticketcategories-page[b-fsdi4t7a42] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.ticketcategories-header[b-fsdi4t7a42] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .ticketcategories-header h1[b-fsdi4t7a42] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .ticketcategories-header p[b-fsdi4t7a42] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-fsdi4t7a42](.btn-new-ticketcategories) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.ticketcategories-summary-card[b-fsdi4t7a42] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-fsdi4t7a42] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-fsdi4t7a42] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-fsdi4t7a42] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-fsdi4t7a42] {
        font-size: 31px;
    }

.summary-blue[b-fsdi4t7a42] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-fsdi4t7a42] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-fsdi4t7a42] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-fsdi4t7a42] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-fsdi4t7a42] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-fsdi4t7a42] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.ticketcategories-toolbar[b-fsdi4t7a42] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-fsdi4t7a42] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-fsdi4t7a42](.ticketcategories-search),
[b-fsdi4t7a42](.ticketcategories-filter) {
    background: #ffffff !important;
}

[b-fsdi4t7a42](.ticketcategories-search .mud-input-outlined-border),
[b-fsdi4t7a42](.ticketcategories-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-fsdi4t7a42](.ticketcategories-search .mud-input-root),
[b-fsdi4t7a42](.ticketcategories-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-fsdi4t7a42](.ticketcategories-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-fsdi4t7a42](.ticketcategories-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-fsdi4t7a42](.ticketcategories-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.ticketcategories-name-cell[b-fsdi4t7a42] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-fsdi4t7a42] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-fsdi4t7a42] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-fsdi4t7a42] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-fsdi4t7a42] {
            background: #12b76a;
        }

    .status-pill.inactive[b-fsdi4t7a42] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-fsdi4t7a42] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.ticketcategories-actions[b-fsdi4t7a42] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-fsdi4t7a42](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-fsdi4t7a42](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-fsdi4t7a42] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .ticketcategories-summary-card[b-fsdi4t7a42] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-fsdi4t7a42] {
        display: none;
    }

    .ticketcategories-toolbar[b-fsdi4t7a42] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-fsdi4t7a42] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/TicketCategories/TicketCategoryFormDialog.razor.rz.scp.css */
/* =========================================================
   TICKETCATEGORY FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.ticketcategories-dialog[b-qchbwefux7] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.ticketcategories-dialog-header[b-qchbwefux7] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.ticketcategories-dialog-icon[b-qchbwefux7] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .ticketcategories-dialog-icon .mud-icon-root[b-qchbwefux7] {
        font-size: 38px;
    }

.ticketcategories-dialog-title[b-qchbwefux7] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.ticketcategories-dialog-subtitle[b-qchbwefux7] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.ticketcategories-dialog-form[b-qchbwefux7] {
    padding-top: 12px;
}

.ticketcategories-input .mud-input-outlined-border[b-qchbwefux7] {
    border-radius: 12px !important;
}

.ticketcategories-input .mud-input-root[b-qchbwefux7] {
    min-height: 56px;
}

.ticketcategories-input .mud-input-label[b-qchbwefux7] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.ticketcategories-status-box[b-qchbwefux7] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.ticketcategories-status-title[b-qchbwefux7] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.ticketcategories-status-content[b-qchbwefux7] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ticketcategories-status-help[b-qchbwefux7] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.ticketcategories-dialog-actions[b-qchbwefux7] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .ticketcategories-dialog-actions .mud-button-root[b-qchbwefux7] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .ticketcategories-dialog-header[b-qchbwefux7] {
        align-items: flex-start;
        gap: 14px;
    }

    .ticketcategories-dialog-icon[b-qchbwefux7] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .ticketcategories-dialog-icon .mud-icon-root[b-qchbwefux7] {
            font-size: 30px;
        }

    .ticketcategories-dialog-actions[b-qchbwefux7] {
        flex-direction: column-reverse;
    }

        .ticketcategories-dialog-actions .mud-button-root[b-qchbwefux7] {
            width: 100%;
        }
}
/* /Pages/TicketPriorities/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TICKETPRIORITIES - LAYOUT GENERAL
   ========================================================= */

.ticketpriorities-page[b-6c4592wqhw] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.ticketpriorities-header[b-6c4592wqhw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .ticketpriorities-header h1[b-6c4592wqhw] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .ticketpriorities-header p[b-6c4592wqhw] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-6c4592wqhw](.btn-new-ticketpriorities) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.ticketpriorities-summary-card[b-6c4592wqhw] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-6c4592wqhw] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-6c4592wqhw] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-6c4592wqhw] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-6c4592wqhw] {
        font-size: 31px;
    }

.summary-blue[b-6c4592wqhw] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-6c4592wqhw] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-6c4592wqhw] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-6c4592wqhw] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-6c4592wqhw] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-6c4592wqhw] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.ticketpriorities-toolbar[b-6c4592wqhw] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-6c4592wqhw] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-6c4592wqhw](.ticketpriorities-search),
[b-6c4592wqhw](.ticketpriorities-filter) {
    background: #ffffff !important;
}

[b-6c4592wqhw](.ticketpriorities-search .mud-input-outlined-border),
[b-6c4592wqhw](.ticketpriorities-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-6c4592wqhw](.ticketpriorities-search .mud-input-root),
[b-6c4592wqhw](.ticketpriorities-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-6c4592wqhw](.ticketpriorities-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-6c4592wqhw](.ticketpriorities-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-6c4592wqhw](.ticketpriorities-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.ticketpriorities-name-cell[b-6c4592wqhw] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-6c4592wqhw] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-6c4592wqhw] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-6c4592wqhw] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-6c4592wqhw] {
            background: #12b76a;
        }

    .status-pill.inactive[b-6c4592wqhw] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-6c4592wqhw] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.ticketpriorities-actions[b-6c4592wqhw] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-6c4592wqhw](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-6c4592wqhw](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-6c4592wqhw] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .ticketpriorities-summary-card[b-6c4592wqhw] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-6c4592wqhw] {
        display: none;
    }

    .ticketpriorities-toolbar[b-6c4592wqhw] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-6c4592wqhw] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/TicketPriorities/TicketPriorityFormDialog.razor.rz.scp.css */
/* =========================================================
   TICKETPRIORITY FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.ticketpriorities-dialog[b-mvgla57sgk] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.ticketpriorities-dialog-header[b-mvgla57sgk] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.ticketpriorities-dialog-icon[b-mvgla57sgk] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .ticketpriorities-dialog-icon .mud-icon-root[b-mvgla57sgk] {
        font-size: 38px;
    }

.ticketpriorities-dialog-title[b-mvgla57sgk] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.ticketpriorities-dialog-subtitle[b-mvgla57sgk] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.ticketpriorities-dialog-form[b-mvgla57sgk] {
    padding-top: 12px;
}

.ticketpriorities-input .mud-input-outlined-border[b-mvgla57sgk] {
    border-radius: 12px !important;
}

.ticketpriorities-input .mud-input-root[b-mvgla57sgk] {
    min-height: 56px;
}

.ticketpriorities-input .mud-input-label[b-mvgla57sgk] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.ticketpriorities-status-box[b-mvgla57sgk] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.ticketpriorities-status-title[b-mvgla57sgk] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.ticketpriorities-status-content[b-mvgla57sgk] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ticketpriorities-status-help[b-mvgla57sgk] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.ticketpriorities-dialog-actions[b-mvgla57sgk] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .ticketpriorities-dialog-actions .mud-button-root[b-mvgla57sgk] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .ticketpriorities-dialog-header[b-mvgla57sgk] {
        align-items: flex-start;
        gap: 14px;
    }

    .ticketpriorities-dialog-icon[b-mvgla57sgk] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .ticketpriorities-dialog-icon .mud-icon-root[b-mvgla57sgk] {
            font-size: 30px;
        }

    .ticketpriorities-dialog-actions[b-mvgla57sgk] {
        flex-direction: column-reverse;
    }

        .ticketpriorities-dialog-actions .mud-button-root[b-mvgla57sgk] {
            width: 100%;
        }
}
/* /Pages/Towers/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA TOWERS - LAYOUT GENERAL
   ========================================================= */

.towers-page[b-6vgevz8oj9] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.towers-header[b-6vgevz8oj9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .towers-header h1[b-6vgevz8oj9] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .towers-header p[b-6vgevz8oj9] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-6vgevz8oj9](.btn-new-towers) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.towers-summary-card[b-6vgevz8oj9] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-6vgevz8oj9] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-6vgevz8oj9] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-6vgevz8oj9] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-6vgevz8oj9] {
        font-size: 31px;
    }

.summary-blue[b-6vgevz8oj9] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-6vgevz8oj9] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-6vgevz8oj9] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-6vgevz8oj9] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-6vgevz8oj9] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-6vgevz8oj9] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.towers-toolbar[b-6vgevz8oj9] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-6vgevz8oj9] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-6vgevz8oj9](.towers-search),
[b-6vgevz8oj9](.towers-filter) {
    background: #ffffff !important;
}

[b-6vgevz8oj9](.towers-search .mud-input-outlined-border),
[b-6vgevz8oj9](.towers-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-6vgevz8oj9](.towers-search .mud-input-root),
[b-6vgevz8oj9](.towers-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-6vgevz8oj9](.towers-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-6vgevz8oj9](.towers-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-6vgevz8oj9](.towers-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.towers-name-cell[b-6vgevz8oj9] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-6vgevz8oj9] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-6vgevz8oj9] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-6vgevz8oj9] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-6vgevz8oj9] {
            background: #12b76a;
        }

    .status-pill.inactive[b-6vgevz8oj9] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-6vgevz8oj9] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.towers-actions[b-6vgevz8oj9] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-6vgevz8oj9](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-6vgevz8oj9](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-6vgevz8oj9] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .towers-summary-card[b-6vgevz8oj9] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-6vgevz8oj9] {
        display: none;
    }

    .towers-toolbar[b-6vgevz8oj9] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-6vgevz8oj9] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Towers/TowerFormDialog.razor.rz.scp.css */
/* =========================================================
   TOWER FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.towers-dialog[b-wn6gq1keiq] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.towers-dialog-header[b-wn6gq1keiq] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.towers-dialog-icon[b-wn6gq1keiq] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .towers-dialog-icon .mud-icon-root[b-wn6gq1keiq] {
        font-size: 38px;
    }

.towers-dialog-title[b-wn6gq1keiq] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.towers-dialog-subtitle[b-wn6gq1keiq] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.towers-dialog-form[b-wn6gq1keiq] {
    padding-top: 12px;
}

.towers-input .mud-input-outlined-border[b-wn6gq1keiq] {
    border-radius: 12px !important;
}

.towers-input .mud-input-root[b-wn6gq1keiq] {
    min-height: 56px;
}

.towers-input .mud-input-label[b-wn6gq1keiq] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.towers-status-box[b-wn6gq1keiq] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.towers-status-title[b-wn6gq1keiq] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.towers-status-content[b-wn6gq1keiq] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.towers-status-help[b-wn6gq1keiq] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.towers-dialog-actions[b-wn6gq1keiq] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .towers-dialog-actions .mud-button-root[b-wn6gq1keiq] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .towers-dialog-header[b-wn6gq1keiq] {
        align-items: flex-start;
        gap: 14px;
    }

    .towers-dialog-icon[b-wn6gq1keiq] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .towers-dialog-icon .mud-icon-root[b-wn6gq1keiq] {
            font-size: 30px;
        }

    .towers-dialog-actions[b-wn6gq1keiq] {
        flex-direction: column-reverse;
    }

        .towers-dialog-actions .mud-button-root[b-wn6gq1keiq] {
            width: 100%;
        }
}
/* /Pages/Units/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA UNITS - LAYOUT GENERAL
   ========================================================= */

.units-page[b-0e5iq8om1e] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.units-header[b-0e5iq8om1e] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .units-header h1[b-0e5iq8om1e] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .units-header p[b-0e5iq8om1e] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-0e5iq8om1e](.btn-new-units) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.units-summary-card[b-0e5iq8om1e] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-0e5iq8om1e] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-0e5iq8om1e] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-0e5iq8om1e] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-0e5iq8om1e] {
        font-size: 31px;
    }

.summary-blue[b-0e5iq8om1e] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-0e5iq8om1e] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-0e5iq8om1e] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-0e5iq8om1e] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-0e5iq8om1e] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-0e5iq8om1e] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.units-toolbar[b-0e5iq8om1e] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-0e5iq8om1e] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-0e5iq8om1e](.units-search),
[b-0e5iq8om1e](.units-filter) {
    background: #ffffff !important;
}

[b-0e5iq8om1e](.units-search .mud-input-outlined-border),
[b-0e5iq8om1e](.units-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-0e5iq8om1e](.units-search .mud-input-root),
[b-0e5iq8om1e](.units-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-0e5iq8om1e](.units-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-0e5iq8om1e](.units-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-0e5iq8om1e](.units-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.units-name-cell[b-0e5iq8om1e] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-0e5iq8om1e] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-0e5iq8om1e] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-0e5iq8om1e] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-0e5iq8om1e] {
            background: #12b76a;
        }

    .status-pill.inactive[b-0e5iq8om1e] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-0e5iq8om1e] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.units-actions[b-0e5iq8om1e] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-0e5iq8om1e](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-0e5iq8om1e](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-0e5iq8om1e] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .units-summary-card[b-0e5iq8om1e] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-0e5iq8om1e] {
        display: none;
    }

    .units-toolbar[b-0e5iq8om1e] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-0e5iq8om1e] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/Units/UnitFormDialog.razor.rz.scp.css */
/* =========================================================
   UNIT FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.units-dialog[b-96hstoh9o9] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.units-dialog-header[b-96hstoh9o9] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.units-dialog-icon[b-96hstoh9o9] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .units-dialog-icon .mud-icon-root[b-96hstoh9o9] {
        font-size: 38px;
    }

.units-dialog-title[b-96hstoh9o9] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.units-dialog-subtitle[b-96hstoh9o9] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.units-dialog-form[b-96hstoh9o9] {
    padding-top: 12px;
}

.units-input .mud-input-outlined-border[b-96hstoh9o9] {
    border-radius: 12px !important;
}

.units-input .mud-input-root[b-96hstoh9o9] {
    min-height: 56px;
}

.units-input .mud-input-label[b-96hstoh9o9] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.units-status-box[b-96hstoh9o9] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.units-status-title[b-96hstoh9o9] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.units-status-content[b-96hstoh9o9] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.units-status-help[b-96hstoh9o9] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.units-dialog-actions[b-96hstoh9o9] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .units-dialog-actions .mud-button-root[b-96hstoh9o9] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .units-dialog-header[b-96hstoh9o9] {
        align-items: flex-start;
        gap: 14px;
    }

    .units-dialog-icon[b-96hstoh9o9] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .units-dialog-icon .mud-icon-root[b-96hstoh9o9] {
            font-size: 30px;
        }

    .units-dialog-actions[b-96hstoh9o9] {
        flex-direction: column-reverse;
    }

        .units-dialog-actions .mud-button-root[b-96hstoh9o9] {
            width: 100%;
        }
}
/* /Pages/UnitTypes/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA UNITTYPES - LAYOUT GENERAL
   ========================================================= */

.unittypes-page[b-d8tm16j9w1] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.unittypes-header[b-d8tm16j9w1] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .unittypes-header h1[b-d8tm16j9w1] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .unittypes-header p[b-d8tm16j9w1] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-d8tm16j9w1](.btn-new-unittypes) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.unittypes-summary-card[b-d8tm16j9w1] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-d8tm16j9w1] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-d8tm16j9w1] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-d8tm16j9w1] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-d8tm16j9w1] {
        font-size: 31px;
    }

.summary-blue[b-d8tm16j9w1] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-d8tm16j9w1] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-d8tm16j9w1] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-d8tm16j9w1] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-d8tm16j9w1] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-d8tm16j9w1] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.unittypes-toolbar[b-d8tm16j9w1] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-d8tm16j9w1] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-d8tm16j9w1](.unittypes-search),
[b-d8tm16j9w1](.unittypes-filter) {
    background: #ffffff !important;
}

[b-d8tm16j9w1](.unittypes-search .mud-input-outlined-border),
[b-d8tm16j9w1](.unittypes-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-d8tm16j9w1](.unittypes-search .mud-input-root),
[b-d8tm16j9w1](.unittypes-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-d8tm16j9w1](.unittypes-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-d8tm16j9w1](.unittypes-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-d8tm16j9w1](.unittypes-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.unittypes-name-cell[b-d8tm16j9w1] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-d8tm16j9w1] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-d8tm16j9w1] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-d8tm16j9w1] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-d8tm16j9w1] {
            background: #12b76a;
        }

    .status-pill.inactive[b-d8tm16j9w1] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-d8tm16j9w1] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.unittypes-actions[b-d8tm16j9w1] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-d8tm16j9w1](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-d8tm16j9w1](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-d8tm16j9w1] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .unittypes-summary-card[b-d8tm16j9w1] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-d8tm16j9w1] {
        display: none;
    }

    .unittypes-toolbar[b-d8tm16j9w1] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-d8tm16j9w1] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/UnitTypes/UnitTypeFormDialog.razor.rz.scp.css */
/* =========================================================
   UNITTYPE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.unittypes-dialog[b-e2ryy6m7l0] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.unittypes-dialog-header[b-e2ryy6m7l0] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.unittypes-dialog-icon[b-e2ryy6m7l0] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .unittypes-dialog-icon .mud-icon-root[b-e2ryy6m7l0] {
        font-size: 38px;
    }

.unittypes-dialog-title[b-e2ryy6m7l0] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.unittypes-dialog-subtitle[b-e2ryy6m7l0] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.unittypes-dialog-form[b-e2ryy6m7l0] {
    padding-top: 12px;
}

.unittypes-input .mud-input-outlined-border[b-e2ryy6m7l0] {
    border-radius: 12px !important;
}

.unittypes-input .mud-input-root[b-e2ryy6m7l0] {
    min-height: 56px;
}

.unittypes-input .mud-input-label[b-e2ryy6m7l0] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.unittypes-status-box[b-e2ryy6m7l0] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.unittypes-status-title[b-e2ryy6m7l0] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.unittypes-status-content[b-e2ryy6m7l0] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.unittypes-status-help[b-e2ryy6m7l0] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.unittypes-dialog-actions[b-e2ryy6m7l0] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .unittypes-dialog-actions .mud-button-root[b-e2ryy6m7l0] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .unittypes-dialog-header[b-e2ryy6m7l0] {
        align-items: flex-start;
        gap: 14px;
    }

    .unittypes-dialog-icon[b-e2ryy6m7l0] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .unittypes-dialog-icon .mud-icon-root[b-e2ryy6m7l0] {
            font-size: 30px;
        }

    .unittypes-dialog-actions[b-e2ryy6m7l0] {
        flex-direction: column-reverse;
    }

        .unittypes-dialog-actions .mud-button-root[b-e2ryy6m7l0] {
            width: 100%;
        }
}
/* /Pages/VehicleTypes/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA VEHICLETYPES - LAYOUT GENERAL
   ========================================================= */

.vehicletypes-page[b-88c72c8a1u] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.vehicletypes-header[b-88c72c8a1u] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .vehicletypes-header h1[b-88c72c8a1u] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .vehicletypes-header p[b-88c72c8a1u] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-88c72c8a1u](.btn-new-vehicletypes) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.vehicletypes-summary-card[b-88c72c8a1u] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-88c72c8a1u] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-88c72c8a1u] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-88c72c8a1u] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-88c72c8a1u] {
        font-size: 31px;
    }

.summary-blue[b-88c72c8a1u] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-88c72c8a1u] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-88c72c8a1u] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-88c72c8a1u] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-88c72c8a1u] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-88c72c8a1u] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.vehicletypes-toolbar[b-88c72c8a1u] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-88c72c8a1u] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-88c72c8a1u](.vehicletypes-search),
[b-88c72c8a1u](.vehicletypes-filter) {
    background: #ffffff !important;
}

[b-88c72c8a1u](.vehicletypes-search .mud-input-outlined-border),
[b-88c72c8a1u](.vehicletypes-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-88c72c8a1u](.vehicletypes-search .mud-input-root),
[b-88c72c8a1u](.vehicletypes-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-88c72c8a1u](.vehicletypes-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-88c72c8a1u](.vehicletypes-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-88c72c8a1u](.vehicletypes-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.vehicletypes-name-cell[b-88c72c8a1u] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-88c72c8a1u] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-88c72c8a1u] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-88c72c8a1u] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-88c72c8a1u] {
            background: #12b76a;
        }

    .status-pill.inactive[b-88c72c8a1u] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-88c72c8a1u] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.vehicletypes-actions[b-88c72c8a1u] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-88c72c8a1u](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-88c72c8a1u](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-88c72c8a1u] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .vehicletypes-summary-card[b-88c72c8a1u] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-88c72c8a1u] {
        display: none;
    }

    .vehicletypes-toolbar[b-88c72c8a1u] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-88c72c8a1u] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/VehicleTypes/VehicleTypeFormDialog.razor.rz.scp.css */
/* =========================================================
   VEHICLETYPE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.vehicletypes-dialog[b-0ah4juj1uv] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.vehicletypes-dialog-header[b-0ah4juj1uv] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.vehicletypes-dialog-icon[b-0ah4juj1uv] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .vehicletypes-dialog-icon .mud-icon-root[b-0ah4juj1uv] {
        font-size: 38px;
    }

.vehicletypes-dialog-title[b-0ah4juj1uv] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.vehicletypes-dialog-subtitle[b-0ah4juj1uv] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.vehicletypes-dialog-form[b-0ah4juj1uv] {
    padding-top: 12px;
}

.vehicletypes-input .mud-input-outlined-border[b-0ah4juj1uv] {
    border-radius: 12px !important;
}

.vehicletypes-input .mud-input-root[b-0ah4juj1uv] {
    min-height: 56px;
}

.vehicletypes-input .mud-input-label[b-0ah4juj1uv] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.vehicletypes-status-box[b-0ah4juj1uv] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.vehicletypes-status-title[b-0ah4juj1uv] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.vehicletypes-status-content[b-0ah4juj1uv] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.vehicletypes-status-help[b-0ah4juj1uv] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.vehicletypes-dialog-actions[b-0ah4juj1uv] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .vehicletypes-dialog-actions .mud-button-root[b-0ah4juj1uv] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .vehicletypes-dialog-header[b-0ah4juj1uv] {
        align-items: flex-start;
        gap: 14px;
    }

    .vehicletypes-dialog-icon[b-0ah4juj1uv] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .vehicletypes-dialog-icon .mud-icon-root[b-0ah4juj1uv] {
            font-size: 30px;
        }

    .vehicletypes-dialog-actions[b-0ah4juj1uv] {
        flex-direction: column-reverse;
    }

        .vehicletypes-dialog-actions .mud-button-root[b-0ah4juj1uv] {
            width: 100%;
        }
}
/* /Pages/VoteTypes/Index.razor.rz.scp.css */
/* =========================================================
   PÁGINA VOTETYPES - LAYOUT GENERAL
   ========================================================= */

.votetypes-page[b-497ksi72kz] {
    padding: 34px 38px;
    background: #f3f7fc;
    min-height: calc(100vh - 56px);
}

.votetypes-header[b-497ksi72kz] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 26px;
}

    .votetypes-header h1[b-497ksi72kz] {
        margin: 0;
        color: #082b63;
        font-size: 34px;
        font-weight: 900;
        letter-spacing: -0.6px;
    }

    .votetypes-header p[b-497ksi72kz] {
        margin: 7px 0 0 0;
        color: #62718a;
        font-size: 14px;
    }

/* =========================================================
   BOTÓN NUEVO
   ========================================================= */

[b-497ksi72kz](.btn-new-votetypes) {
    height: 44px;
    min-width: 145px;
    border-radius: 9px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    box-shadow: 0 10px 22px rgba(20, 78, 180, .25) !important;
}

/* =========================================================
   TARJETA DE MÉTRICAS
   ========================================================= */

.votetypes-summary-card[b-497ksi72kz] {
    width: 100%;
    min-height: 112px;
    display: grid;
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    align-items: center;
    gap: 24px;
    padding: 24px 32px;
    margin-bottom: 26px;
    background: #ffffff;
    border: 1px solid #e2eaf5;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 35, 75, 0.07);
    box-sizing: border-box;
}

.summary-item[b-497ksi72kz] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.summary-divider[b-497ksi72kz] {
    width: 1px;
    height: 62px;
    background: #e6edf6;
}

.summary-icon[b-497ksi72kz] {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .summary-icon .mud-icon-root[b-497ksi72kz] {
        font-size: 31px;
    }

.summary-blue[b-497ksi72kz] {
    background: #e8f2ff;
    color: #1261e5;
}

.summary-green[b-497ksi72kz] {
    background: #e7f8ef;
    color: #12b76a;
}

.summary-gray[b-497ksi72kz] {
    background: #f2f4f7;
    color: #667085;
}

.summary-item span[b-497ksi72kz] {
    display: block;
    color: #21395f;
    font-size: 14px;
    font-weight: 800;
}

.summary-item strong[b-497ksi72kz] {
    display: block;
    margin-top: 5px;
    color: #082b63;
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}

.summary-item small[b-497ksi72kz] {
    display: block;
    margin-top: 7px;
    color: #70809a;
    font-size: 13px;
}

/* =========================================================
   TOOLBAR
   ========================================================= */

.votetypes-toolbar[b-497ksi72kz] {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
}

.toolbar-actions[b-497ksi72kz] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

[b-497ksi72kz](.votetypes-search),
[b-497ksi72kz](.votetypes-filter) {
    background: #ffffff !important;
}

[b-497ksi72kz](.votetypes-search .mud-input-outlined-border),
[b-497ksi72kz](.votetypes-filter .mud-input-outlined-border) {
    border-radius: 11px !important;
    border-color: #dce5f0 !important;
}

[b-497ksi72kz](.votetypes-search .mud-input-root),
[b-497ksi72kz](.votetypes-filter .mud-input-root) {
    height: 46px !important;
}

/* =========================================================
   TABLA
   ========================================================= */

[b-497ksi72kz](.votetypes-table-container) {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f1 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(15, 35, 75, .08) !important;
}

[b-497ksi72kz](.votetypes-table th) {
    height: 58px !important;
    color: #17345f !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-bottom: 1px solid #e4eaf3 !important;
    background: #ffffff !important;
}

[b-497ksi72kz](.votetypes-table td) {
    height: 66px !important;
    color: #17345f !important;
    font-size: 14px !important;
    border-bottom: 1px solid #edf1f6 !important;
}

.votetypes-name-cell[b-497ksi72kz] {
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 900;
    color: #082b63;
}

/* =========================================================
   ESTADO
   ========================================================= */

.status-pill[b-497ksi72kz] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

    .status-pill span[b-497ksi72kz] {
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }

    .status-pill.active[b-497ksi72kz] {
        color: #079455;
        background: #dcfce7;
    }

        .status-pill.active span[b-497ksi72kz] {
            background: #12b76a;
        }

    .status-pill.inactive[b-497ksi72kz] {
        color: #667085;
        background: #f2f4f7;
    }

        .status-pill.inactive span[b-497ksi72kz] {
            background: #98a2b3;
        }

/* =========================================================
   ACCIONES
   ========================================================= */

.votetypes-actions[b-497ksi72kz] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-497ksi72kz](.action-edit) {
    width: 38px !important;
    height: 38px !important;
    color: #1556d8 !important;
    background: #eaf2ff !important;
    border-radius: 10px !important;
}

[b-497ksi72kz](.action-delete) {
    width: 38px !important;
    height: 38px !important;
    color: #f04438 !important;
    background: #ffe8e8 !important;
    border-radius: 10px !important;
}

/* =========================================================
   LOADING
   ========================================================= */

.loading-box[b-497ksi72kz] {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #60708a;
}

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

@media (max-width: 1100px) {
    .votetypes-summary-card[b-497ksi72kz] {
        grid-template-columns: 1fr 1fr;
    }

    .summary-divider[b-497ksi72kz] {
        display: none;
    }

    .votetypes-toolbar[b-497ksi72kz] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-497ksi72kz] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
/* /Pages/VoteTypes/VoteTypeFormDialog.razor.rz.scp.css */
/* =========================================================
   VOTETYPE FORM DIALOG
   Diseño profesional para modal de creación/edición
   ========================================================= */

.votetypes-dialog[b-kdykiojznt] {
    border-radius: 20px !important;
    overflow: hidden;
}

/* =========================================================
   HEADER
   ========================================================= */

.votetypes-dialog-header[b-kdykiojznt] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 6px 10px 6px;
}

.votetypes-dialog-icon[b-kdykiojznt] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    border-radius: 50%;
    background: #e8f2ff;
    color: #174a9c;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .votetypes-dialog-icon .mud-icon-root[b-kdykiojznt] {
        font-size: 38px;
    }

.votetypes-dialog-title[b-kdykiojznt] {
    color: #082b63;
    font-weight: 800;
    letter-spacing: -0.4px;
}

.votetypes-dialog-subtitle[b-kdykiojznt] {
    color: #6b7890;
    margin-top: 4px;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.votetypes-dialog-form[b-kdykiojznt] {
    padding-top: 12px;
}

.votetypes-input .mud-input-outlined-border[b-kdykiojznt] {
    border-radius: 12px !important;
}

.votetypes-input .mud-input-root[b-kdykiojznt] {
    min-height: 56px;
}

.votetypes-input .mud-input-label[b-kdykiojznt] {
    color: #082b63 !important;
    font-weight: 600;
}

/* =========================================================
   ESTADO
   ========================================================= */

.votetypes-status-box[b-kdykiojznt] {
    height: 100%;
    min-height: 98px;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.votetypes-status-title[b-kdykiojznt] {
    color: #082b63;
    font-weight: 700;
    margin-bottom: 10px;
}

.votetypes-status-content[b-kdykiojznt] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.votetypes-status-help[b-kdykiojznt] {
    color: #7d8798;
    margin-top: 8px;
}

/* =========================================================
   ACCIONES
   ========================================================= */

.votetypes-dialog-actions[b-kdykiojznt] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 18px 4px 4px 4px;
    border-top: 1px solid #e4e8f0;
}

    .votetypes-dialog-actions .mud-button-root[b-kdykiojznt] {
        min-width: 140px;
        height: 44px;
        border-radius: 10px;
        font-weight: 700;
        text-transform: none;
    }

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

@media (max-width: 600px) {
    .votetypes-dialog-header[b-kdykiojznt] {
        align-items: flex-start;
        gap: 14px;
    }

    .votetypes-dialog-icon[b-kdykiojznt] {
        width: 54px;
        height: 54px;
        min-width: 54px;
    }

        .votetypes-dialog-icon .mud-icon-root[b-kdykiojznt] {
            font-size: 30px;
        }

    .votetypes-dialog-actions[b-kdykiojznt] {
        flex-direction: column-reverse;
    }

        .votetypes-dialog-actions .mud-button-root[b-kdykiojznt] {
            width: 100%;
        }
}
/* /Shared/Charts/IncomeBarChart.razor.rz.scp.css */
/* =========================================================
   INCOME BAR CHART
   Gráfica de barras reutilizable para dashboard HABYTAL.
   ========================================================= */

.habytal-chart[b-zb1cr6omls] {
    width: 100%;
    min-width: 0;
    overflow: visible;
}

.income-bar-chart[b-zb1cr6omls] {
    min-height: 220px;
}

/* =========================================================
   SECCIÓN: APEXCHARTS - LEGIBILIDAD
   ::deep permite aplicar estilos a los SVG generados por ApexCharts
   dentro de componentes con CSS isolation.
   ========================================================= */

.habytal-chart[b-zb1cr6omls]  .apexcharts-canvas,
.habytal-chart[b-zb1cr6omls]  .apexcharts-svg,
.habytal-chart[b-zb1cr6omls]  .apexcharts-canvas foreignObject {
    width: 100% !important;
    background: transparent !important;
}

.habytal-chart[b-zb1cr6omls]  .apexcharts-text,
.habytal-chart[b-zb1cr6omls]  .apexcharts-title-text,
.habytal-chart[b-zb1cr6omls]  .apexcharts-subtitle-text,
.habytal-chart[b-zb1cr6omls]  .apexcharts-xaxis text,
.habytal-chart[b-zb1cr6omls]  .apexcharts-yaxis text,
.habytal-chart[b-zb1cr6omls]  .apexcharts-xaxis-label,
.habytal-chart[b-zb1cr6omls]  .apexcharts-yaxis-label,
.habytal-chart[b-zb1cr6omls]  .apexcharts-legend-text {
    fill: var(--habytal-chart-axis, #0f172a) !important;
    color: var(--habytal-chart-axis, #0f172a) !important;
    opacity: 1 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.habytal-chart[b-zb1cr6omls]  .apexcharts-legend-text {
    font-size: 13px !important;
    font-weight: 800 !important;
}

.habytal-chart[b-zb1cr6omls]  .apexcharts-gridline {
    stroke: var(--habytal-chart-grid, #e2e8f0) !important;
}

.habytal-chart[b-zb1cr6omls]  .apexcharts-xaxis line,
.habytal-chart[b-zb1cr6omls]  .apexcharts-yaxis line,
.habytal-chart[b-zb1cr6omls]  .apexcharts-xaxis-tick {
    stroke: var(--habytal-chart-grid, #e2e8f0) !important;
}

.habytal-chart[b-zb1cr6omls]  .apexcharts-toolbar svg,
.habytal-chart[b-zb1cr6omls]  .apexcharts-menu-icon svg,
.habytal-chart[b-zb1cr6omls]  .apexcharts-zoom-icon svg,
.habytal-chart[b-zb1cr6omls]  .apexcharts-zoomin-icon svg,
.habytal-chart[b-zb1cr6omls]  .apexcharts-zoomout-icon svg,
.habytal-chart[b-zb1cr6omls]  .apexcharts-reset-icon svg,
.habytal-chart[b-zb1cr6omls]  .apexcharts-pan-icon svg {
    fill: var(--habytal-chart-muted, #334155) !important;
}

.habytal-chart[b-zb1cr6omls]  .apexcharts-tooltip {
    background: #0f172a !important;
    color: #f8fafc !important;
    border: 1px solid rgba(248, 250, 252, 0.18) !important;
    border-radius: 12px !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38) !important;
}

.habytal-chart[b-zb1cr6omls]  .apexcharts-tooltip *,
.habytal-chart[b-zb1cr6omls]  .apexcharts-tooltip-title {
    color: #f8fafc !important;
}

.habytal-chart[b-zb1cr6omls]  .apexcharts-tooltip-title {
    background: #1e293b !important;
    border-bottom: 1px solid rgba(248, 250, 252, 0.14) !important;
}
/* /Shared/Charts/KpiSparklineChart.razor.rz.scp.css */
/* =========================================================
   KPI SPARKLINE CHART
   ========================================================= */

.kpi-sparkline-container[b-0dlpuy3zt2] {
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kpi-sparkline-container[b-0dlpuy3zt2]  .apexcharts-canvas {
    background: transparent !important;
}

.kpi-sparkline-container[b-0dlpuy3zt2]  svg {
    overflow: visible;
}
/* /Shared/Charts/RevenueLineChart.razor.rz.scp.css */
/* =========================================================
   REVENUE LINE CHART
   Gráfica lineal reutilizable para dashboard HABYTAL.
   ========================================================= */

.habytal-chart[b-7zqaoxw3w1] {
    width: 100%;
    min-width: 0;
    overflow: visible;
}

.revenue-line-chart[b-7zqaoxw3w1] {
    min-height: 220px;
}

/* =========================================================
   SECCIÓN: APEXCHARTS - LEGIBILIDAD
   ::deep permite aplicar estilos a los SVG generados por ApexCharts
   dentro de componentes con CSS isolation.
   ========================================================= */

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-canvas,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-svg,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-canvas foreignObject {
    width: 100% !important;
    background: transparent !important;
}

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-text,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-title-text,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-subtitle-text,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-xaxis text,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-yaxis text,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-xaxis-label,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-yaxis-label,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-legend-text {
    fill: var(--habytal-chart-axis, #0f172a) !important;
    color: var(--habytal-chart-axis, #0f172a) !important;
    opacity: 1 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-legend-text {
    font-size: 13px !important;
    font-weight: 800 !important;
}

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-gridline {
    stroke: var(--habytal-chart-grid, #e2e8f0) !important;
}

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-xaxis line,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-yaxis line,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-xaxis-tick {
    stroke: var(--habytal-chart-grid, #e2e8f0) !important;
}

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-toolbar svg,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-menu-icon svg,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-zoom-icon svg,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-zoomin-icon svg,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-zoomout-icon svg,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-reset-icon svg,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-pan-icon svg {
    fill: var(--habytal-chart-muted, #334155) !important;
}

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-tooltip {
    background: #0f172a !important;
    color: #f8fafc !important;
    border: 1px solid rgba(248, 250, 252, 0.18) !important;
    border-radius: 12px !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38) !important;
}

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-tooltip *,
.habytal-chart[b-7zqaoxw3w1]  .apexcharts-tooltip-title {
    color: #f8fafc !important;
}

.habytal-chart[b-7zqaoxw3w1]  .apexcharts-tooltip-title {
    background: #1e293b !important;
    border-bottom: 1px solid rgba(248, 250, 252, 0.14) !important;
}
/* /Shared/Charts/TenantDonutChart.razor.rz.scp.css */
/* =========================================================
   TENANT DONUT CHART
   Componente reutilizable con SVG, leyenda y tooltip individual.
   Ajustado para conservar uniformidad visual en modo claro y oscuro.
   ========================================================= */

.tenant-donut-chart[b-e0ipy5ae4q] {
    display: grid;
    grid-template-columns: minmax(150px, 220px) minmax(0, 1fr);
    align-items: center;
    justify-content: center;
    column-gap: clamp(18px, 3vw, 38px);

    width: 100%;
    min-height: 220px;
    padding: 14px 18px 0 18px;
    box-sizing: border-box;
    overflow: hidden;
}

/* =========================================================
   SECCIÓN: DONUT SVG
   Mantiene el gráfico perfectamente circular, sin importar el
   alto enviado desde el dashboard.
   ========================================================= */

.tenant-donut-chart__graphic[b-e0ipy5ae4q] {
    position: relative;

    width: clamp(150px, 17vw, 220px);
    height: clamp(150px, 17vw, 220px);
    aspect-ratio: 1 / 1;
    margin: 0 auto;
    flex-shrink: 0;
}

.tenant-donut-chart__svg[b-e0ipy5ae4q] {
    position: relative;
    z-index: 1;

    display: block;
    width: 100%;
    height: 100%;

    overflow: visible;
    filter: drop-shadow(0 14px 24px rgba(15, 23, 42, 0.10));
}

.tenant-donut-chart__track[b-e0ipy5ae4q] {
    fill: none;
    stroke: rgba(226, 232, 240, 0.88);
    stroke-width: 36;
}

.tenant-donut-chart__segment[b-e0ipy5ae4q] {
    fill: none;
    stroke-width: 36;
    stroke-linecap: butt;
    transform: rotate(-90deg);
    transform-origin: 110px 110px;
    cursor: pointer;
    transition: filter 160ms ease, opacity 160ms ease;
}

.tenant-donut-chart__segment:hover[b-e0ipy5ae4q],
.tenant-donut-chart__segment:focus[b-e0ipy5ae4q] {
    filter: brightness(1.08);
    outline: none;
}

.tenant-donut-chart__center[b-e0ipy5ae4q] {
    position: absolute;
    inset: 17.25%;
    z-index: 2;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border-radius: 50%;
    background: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.05);
    pointer-events: none;
}

.tenant-donut-chart__total[b-e0ipy5ae4q] {
    color: #020617 !important;
    font-size: clamp(1.75rem, 3vw, 2.15rem);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.035em;
}

.tenant-donut-chart__total-label[b-e0ipy5ae4q] {
    margin-top: 7px;

    color: #475569 !important;
    font-size: 0.86rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.01em;
}

/* =========================================================
   SECCIÓN: TOOLTIP INDIVIDUAL
   ========================================================= */

.tenant-donut-chart__tooltip[b-e0ipy5ae4q] {
    position: absolute;
    z-index: 5;

    display: grid;
    grid-template-columns: 10px auto auto;
    align-items: center;
    gap: 8px;

    min-width: 158px;
    padding: 10px 12px;

    color: #0f172a;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 10px;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.22);

    font-size: 0.82rem;
    font-weight: 800;

    transform: translate(-50%, -115%);
    pointer-events: none;
    white-space: nowrap;
}

.tenant-donut-chart__tooltip-dot[b-e0ipy5ae4q] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.tenant-donut-chart__tooltip-label[b-e0ipy5ae4q],
.tenant-donut-chart__tooltip-value[b-e0ipy5ae4q] {
    color: #0f172a;
}

.tenant-donut-chart__tooltip-value[b-e0ipy5ae4q] {
    font-weight: 900;
}

/* =========================================================
   SECCIÓN: LEYENDA
   ========================================================= */

.tenant-donut-chart__legend[b-e0ipy5ae4q] {
    display: flex;
    flex-direction: column;
    gap: clamp(13px, 1.8vw, 19px);

    width: 100%;
    min-width: 0;
    overflow: hidden;
}

.tenant-donut-chart__legend-row[b-e0ipy5ae4q] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 16px;

    width: 100%;
    min-width: 0;
}

.tenant-donut-chart__legend-label[b-e0ipy5ae4q] {
    display: flex;
    align-items: center;
    gap: 12px;

    min-width: 0;

    color: #0f172a;
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.2;
}

.tenant-donut-chart__legend-label span:last-child[b-e0ipy5ae4q] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tenant-donut-chart__dot[b-e0ipy5ae4q] {
    width: 12px;
    height: 12px;
    min-width: 12px;

    border-radius: 50%;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
}

.tenant-donut-chart__legend-value[b-e0ipy5ae4q] {
    display: flex;
    align-items: center;
    gap: 7px;

    min-width: max-content;
    color: #0f172a;
    font-size: 0.95rem;
    font-weight: 900;
    white-space: nowrap;
}

.tenant-donut-chart__legend-value span[b-e0ipy5ae4q] {
    color: #334155;
    font-size: 0.86rem;
    font-weight: 900;
}

/* =========================================================
   SECCIÓN: FOOTER
   ========================================================= */

.tenant-donut-chart__footer[b-e0ipy5ae4q] {
    margin-top: 6px;
    text-align: center;
}

.tenant-donut-chart__footer a[b-e0ipy5ae4q] {
    color: #2563eb;
    font-size: 0.9rem;
    font-weight: 900;
    text-decoration: none;
}

/* =========================================================
   SECCIÓN: MODO OSCURO
   Objetivo puntual:
   - Uniformar el 128 entre ambos donuts.
   - Mantener el tamaño, peso y contraste del total central.
   - Resaltar el texto "Total" sin hacerlo más grande.
   - No alterar el modo claro.
   ========================================================= */

.dark .tenant-donut-chart__center[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__center[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__center[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__center[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__center[b-e0ipy5ae4q] {
    background: #ffffff;
    box-shadow:
        inset 0 0 0 1px rgba(15, 23, 42, 0.08),
        0 16px 38px rgba(2, 6, 23, 0.28);
}

.dark .tenant-donut-chart__total[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__total[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__total[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__total[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__total[b-e0ipy5ae4q] {
    color: #020617 !important;
    -webkit-text-fill-color: #020617 !important;
    opacity: 1 !important;
    font-size: clamp(1.75rem, 3vw, 2.15rem) !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -0.035em;
    text-shadow: none !important;
}

.dark .tenant-donut-chart__total-label[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__total-label[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__total-label[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__total-label[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__total-label[b-e0ipy5ae4q] {
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
    opacity: 1 !important;
    font-size: 0.86rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-shadow: 0 0 0 currentColor;
}

.dark .tenant-donut-chart__legend-label[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__legend-label[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__legend-label[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__legend-label[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__legend-label[b-e0ipy5ae4q],
.dark .tenant-donut-chart__legend-value[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__legend-value[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__legend-value[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__legend-value[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__legend-value[b-e0ipy5ae4q] {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
    font-weight: 900 !important;
}

.dark .tenant-donut-chart__legend-value span[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__legend-value span[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__legend-value span[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__legend-value span[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__legend-value span[b-e0ipy5ae4q] {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
    font-weight: 900 !important;
}

.dark .tenant-donut-chart__tooltip[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__tooltip[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__tooltip[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__tooltip[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__tooltip[b-e0ipy5ae4q] {
    color: #0f172a;
    background: #ffffff;
    border-color: rgba(226, 232, 240, 0.55);
}

.dark .tenant-donut-chart__tooltip-label[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__tooltip-label[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__tooltip-label[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__tooltip-label[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__tooltip-label[b-e0ipy5ae4q],
.dark .tenant-donut-chart__tooltip-value[b-e0ipy5ae4q],
body.dark .tenant-donut-chart__tooltip-value[b-e0ipy5ae4q],
.mud-theme-dark .tenant-donut-chart__tooltip-value[b-e0ipy5ae4q],
.dark-mode .tenant-donut-chart__tooltip-value[b-e0ipy5ae4q],
.super-dashboard-page.is-dark .tenant-donut-chart__tooltip-value[b-e0ipy5ae4q] {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
}

/* =========================================================
   SECCIÓN: RESPONSIVE
   ========================================================= */

@media (max-width: 1200px) {
    .tenant-donut-chart[b-e0ipy5ae4q] {
        grid-template-columns: minmax(145px, 180px) minmax(0, 1fr);
        column-gap: 20px;
    }

    .tenant-donut-chart__graphic[b-e0ipy5ae4q] {
        width: clamp(145px, 23vw, 190px);
        height: clamp(145px, 23vw, 190px);
    }
}

@media (max-width: 900px) {
    .tenant-donut-chart[b-e0ipy5ae4q] {
        grid-template-columns: 1fr;
        row-gap: 24px;
        padding-inline: 12px;
        overflow: visible;
    }

    .tenant-donut-chart__graphic[b-e0ipy5ae4q] {
        width: clamp(170px, 52vw, 220px);
        height: clamp(170px, 52vw, 220px);
    }

    .tenant-donut-chart__legend[b-e0ipy5ae4q] {
        max-width: 420px;
        margin-inline: auto;
    }
}

@media (max-width: 520px) {
    .tenant-donut-chart[b-e0ipy5ae4q] {
        padding-inline: 4px;
    }

    .tenant-donut-chart__legend-row[b-e0ipy5ae4q] {
        column-gap: 10px;
    }

    .tenant-donut-chart__legend-label[b-e0ipy5ae4q] {
        font-size: 0.88rem;
    }

    .tenant-donut-chart__legend-value[b-e0ipy5ae4q] {
        font-size: 0.88rem;
    }

    .tenant-donut-chart__legend-value span[b-e0ipy5ae4q] {
        font-size: 0.78rem;
    }
}
/* /Shared/Components/Catalogs/CatalogCard.razor.rz.scp.css */
/* =========================================================
   COMPONENTE: CATALOG CARD
   Estructura visual: icono | título | menú, registros, badge y botón.
   ========================================================= */

.catalog-card[b-tlxkwl5i7f] {
    position: relative;
    min-height: 172px;
    padding: 22px 24px 18px 116px;
    border: 1px solid #e0e7f3;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.035);
    display: flex;
    align-items: flex-start;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.catalog-card:hover[b-tlxkwl5i7f] {
    transform: translateY(-2px);
    border-color: #c7d4ea;
    box-shadow: 0 16px 32px rgba(15, 23, 42, 0.07);
}

.catalog-card-menu[b-tlxkwl5i7f] {
    position: absolute;
    top: 20px;
    right: 18px;
    width: 24px;
    height: 28px;
    border: 0;
    background: transparent;
    color: #213b6b;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
}

.catalog-card-menu .mud-icon-root[b-tlxkwl5i7f] {
    font-size: 24px;
}

.catalog-card-icon[b-tlxkwl5i7f] {
    position: absolute;
    top: 22px;
    left: 24px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.catalog-card-icon .mud-icon-root[b-tlxkwl5i7f] {
    font-size: 38px;
}

.catalog-card-content[b-tlxkwl5i7f] {
    width: 100%;
    min-width: 0;
    padding-right: 28px;
}

.catalog-card-content h3[b-tlxkwl5i7f] {
    margin: 4px 0 12px;
    font-size: 16px;
    line-height: 1.14;
    font-weight: 900;
    letter-spacing: -0.015em;
    color: #071b4d;
}

.catalog-card-content p[b-tlxkwl5i7f] {
    margin: 0 0 12px;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 700;
    color: #52627f;
}

.catalog-card-badge[b-tlxkwl5i7f] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 22px;
    min-width: 58px;
    padding: 0 13px;
    border-radius: 999px;
    background: #d8f8e4;
    color: #0aa257;
    font-size: 12px;
    line-height: 1;
    font-weight: 900;
}

.catalog-card-button[b-tlxkwl5i7f] {
    margin-top: 14px;
    min-width: 130px;
    height: 38px;
    padding: 0 14px;
    border: 1px solid #c8d4e7;
    border-radius: 6px;
    background: #ffffff;
    color: #0b55df;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 900;
    text-transform: none;
    cursor: pointer;
    transition: border-color 180ms ease, background 180ms ease, color 180ms ease;
}

.catalog-card-button .mud-icon-root[b-tlxkwl5i7f] {
    font-size: 20px;
}

.catalog-card-button:hover[b-tlxkwl5i7f] {
    border-color: #0b55df;
    background: #f3f7ff;
}

.catalog-icon-blue[b-tlxkwl5i7f] { background: #eaf2ff; color: #1557d6; }
.catalog-icon-purple[b-tlxkwl5i7f] { background: #eee2ff; color: #7c3aed; }
.catalog-icon-green[b-tlxkwl5i7f] { background: #d9fbe8; color: #0ba75a; }
.catalog-icon-orange[b-tlxkwl5i7f] { background: #ffead2; color: #f97316; }
.catalog-icon-pink[b-tlxkwl5i7f] { background: #ffe0ef; color: #ec4899; }
.catalog-icon-yellow[b-tlxkwl5i7f] { background: #fff0bf; color: #d97706; }
.catalog-icon-sky[b-tlxkwl5i7f] { background: #e8f2ff; color: #2563eb; }
.catalog-icon-violet[b-tlxkwl5i7f] { background: #f0e0ff; color: #8b5cf6; }
.catalog-icon-mint[b-tlxkwl5i7f] { background: #dcfce7; color: #16a34a; }
.catalog-icon-lightblue[b-tlxkwl5i7f] { background: #e7f1ff; color: #2563eb; }
.catalog-icon-red[b-tlxkwl5i7f] { background: #ffe1e1; color: #ef4444; }
.catalog-icon-amber[b-tlxkwl5i7f] { background: #fff1bf; color: #d97706; }

@media (max-width: 640px) {
    .catalog-card[b-tlxkwl5i7f] {
        min-height: 160px;
        padding-left: 104px;
    }

    .catalog-card-icon[b-tlxkwl5i7f] {
        width: 62px;
        height: 62px;
    }
}

/* =========================================================
   MODO OSCURO
   ========================================================= */

:global(.mud-theme-dark) .catalog-card[b-tlxkwl5i7f],
:global(body.dark) .catalog-card[b-tlxkwl5i7f],
:global(.dark) .catalog-card[b-tlxkwl5i7f] {
    border-color: rgba(148, 163, 184, 0.24);
    background: #111c32;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
}

:global(.mud-theme-dark) .catalog-card-content h3[b-tlxkwl5i7f],
:global(body.dark) .catalog-card-content h3[b-tlxkwl5i7f],
:global(.dark) .catalog-card-content h3[b-tlxkwl5i7f] {
    color: #f8fafc;
}

:global(.mud-theme-dark) .catalog-card-content p[b-tlxkwl5i7f],
:global(body.dark) .catalog-card-content p[b-tlxkwl5i7f],
:global(.dark) .catalog-card-content p[b-tlxkwl5i7f] {
    color: #cbd5e1;
}

:global(.mud-theme-dark) .catalog-card-button[b-tlxkwl5i7f],
:global(body.dark) .catalog-card-button[b-tlxkwl5i7f],
:global(.dark) .catalog-card-button[b-tlxkwl5i7f] {
    border-color: rgba(96, 165, 250, 0.55);
    background: transparent;
    color: #60a5fa;
}

:global(.mud-theme-dark) .catalog-card-menu[b-tlxkwl5i7f],
:global(body.dark) .catalog-card-menu[b-tlxkwl5i7f],
:global(.dark) .catalog-card-menu[b-tlxkwl5i7f] {
    color: #dbeafe;
}
/* /Shared/Components/Crud/CrudActionFooter.razor.rz.scp.css */
/* =========================================================
   COMPONENTE: CRUD ACTION FOOTER
   ========================================================= */

.crud-action-footer[b-iujguv2l1h] {
    width: 100%;
    padding-top: 18px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.crud-footer-secondary[b-iujguv2l1h],
.crud-footer-primary[b-iujguv2l1h] {
    min-height: 42px;
    padding: 0 18px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 900;
    cursor: pointer;
}

.crud-footer-secondary[b-iujguv2l1h] {
    border: 1px solid #c8d4e7;
    background: #ffffff;
    color: #52627f;
}

.crud-footer-secondary:hover[b-iujguv2l1h] {
    border-color: #0b55df;
    color: #0b55df;
    background: #f3f7ff;
}

.crud-footer-primary[b-iujguv2l1h] {
    border: 0;
    background: #0b55df;
    color: #ffffff;
    box-shadow: 0 12px 24px rgba(11, 85, 223, 0.22);
}

.crud-footer-primary:hover[b-iujguv2l1h] {
    background: #0847bf;
}

@media (max-width: 560px) {
    .crud-action-footer[b-iujguv2l1h] {
        flex-direction: column-reverse;
    }

    .crud-footer-secondary[b-iujguv2l1h],
    .crud-footer-primary[b-iujguv2l1h] {
        width: 100%;
    }
}

:global(.mud-theme-dark) .crud-footer-secondary[b-iujguv2l1h],
:global(body.dark) .crud-footer-secondary[b-iujguv2l1h],
:global(.dark) .crud-footer-secondary[b-iujguv2l1h] {
    border-color: rgba(96, 165, 250, 0.55);
    background: transparent;
    color: #60a5fa;
}
/* /Shared/Components/Crud/CrudActionMenuButton.razor.rz.scp.css */
/* =========================================================
   COMPONENTE: CRUD ACTION MENU BUTTON
   ========================================================= */

.crud-action-menu-wrapper[b-agcpuv257w] {
    position: relative;
    display: inline-flex;
    justify-content: center;
}

.crud-action-trigger[b-agcpuv257w] {
    width: 36px;
    height: 36px;
    border: 1px solid #d7e1f1;
    border-radius: 12px;
    background: #ffffff;
    color: #0b55df;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.crud-action-trigger:hover[b-agcpuv257w] {
    border-color: #0b55df;
    background: #f3f7ff;
}

.crud-action-trigger .mud-icon-root[b-agcpuv257w] {
    font-size: 20px;
}

.crud-action-backdrop[b-agcpuv257w] {
    position: fixed;
    inset: 0;
    z-index: 29;
    background: transparent;
}

.crud-action-popover[b-agcpuv257w] {
    position: absolute;
    top: 42px;
    right: 0;
    z-index: 30;
    width: 172px;
    padding: 8px;
    border: 1px solid #e0e7f3;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 20px 42px rgba(15, 23, 42, 0.16);
}

.crud-action-popover button[b-agcpuv257w] {
    width: 100%;
    min-height: 38px;
    padding: 0 10px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #1e2d4f;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 850;
    text-align: left;
    cursor: pointer;
}

.crud-action-popover button:hover[b-agcpuv257w] {
    background: #f3f7ff;
    color: #0b55df;
}

.crud-action-popover .crud-action-danger[b-agcpuv257w] {
    color: #dc2626;
}

.crud-action-popover .crud-action-danger:hover[b-agcpuv257w] {
    background: #fff1f2;
    color: #dc2626;
}

:global(.mud-theme-dark) .crud-action-trigger[b-agcpuv257w],
:global(body.dark) .crud-action-trigger[b-agcpuv257w],
:global(.dark) .crud-action-trigger[b-agcpuv257w] {
    border-color: rgba(96, 165, 250, 0.45);
    background: #0f172a;
    color: #60a5fa;
}

:global(.mud-theme-dark) .crud-action-popover[b-agcpuv257w],
:global(body.dark) .crud-action-popover[b-agcpuv257w],
:global(.dark) .crud-action-popover[b-agcpuv257w] {
    border-color: rgba(148, 163, 184, 0.24);
    background: #111c32;
}

:global(.mud-theme-dark) .crud-action-popover button[b-agcpuv257w],
:global(body.dark) .crud-action-popover button[b-agcpuv257w],
:global(.dark) .crud-action-popover button[b-agcpuv257w] {
    color: #e2e8f0;
}
/* /Shared/Components/Crud/CrudColumn.razor.rz.scp.css */
/* Este componente no requiere estilos propios. */
/* /Shared/Components/Crud/CrudPageHeader.razor.rz.scp.css */
/* =========================================================
   COMPONENTE: CRUD PAGE HEADER
   Encabezado dinámico estándar para todos los CRUD.
   ========================================================= */

.crud-page-header[b-ztixaeoodr] {
    width: 100%;
    margin-bottom: 20px;
    min-height: 96px;
    padding: 22px 24px;
    border: 1px solid #dce6f3;
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
    box-shadow: 0 12px 30px rgba(15, 35, 75, 0.055);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    box-sizing: border-box;
}

.crud-page-header-main[b-ztixaeoodr] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 16px;
}

.crud-page-header-icon[b-ztixaeoodr] {
    width: 52px;
    height: 52px;
    min-width: 52px;
    border-radius: 16px;
    background: #eaf2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8e7ff;
}

.crud-page-header-icon[b-ztixaeoodr]  .mud-icon-root,
.crud-page-header-mud-icon[b-ztixaeoodr] {
    font-size: 28px !important;
    color: currentColor !important;
}

.crud-page-header-copy[b-ztixaeoodr] {
    min-width: 0;
}

.crud-page-header-eyebrow[b-ztixaeoodr] {
    display: inline-flex;
    margin-bottom: 5px;
    font-size: 11px;
    font-weight: 600;
    color: #2563eb;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.crud-page-header-copy h1[b-ztixaeoodr] {
    margin: 0;
    color: #071b4d;
    font-size: clamp(1.42rem, 2vw, 1.72rem);
    line-height: 1.12;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.crud-page-header-copy p[b-ztixaeoodr] {
    margin: 7px 0 0;
    color: #64748b;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 400;
}

.crud-page-header-count[b-ztixaeoodr] {
    display: inline-flex;
    margin-top: 10px;
    height: 22px;
    align-items: center;
    padding: 0 12px;
    border-radius: 999px;
    background: #eef5ff;
    color: #1557d6;
    font-size: 12px;
    font-weight: 600;
}

.crud-page-header-button[b-ztixaeoodr] {
    min-height: 42px;
    min-width: 154px;
    padding: 0 18px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, #5d6df6 0%, #4b54e7 100%);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 12px 24px rgba(74, 84, 232, 0.26);
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.crud-page-header-button:hover[b-ztixaeoodr] {
    transform: translateY(-1px);
    box-shadow: 0 16px 30px rgba(74, 84, 232, 0.34);
}

@media (max-width: 760px) {
    .crud-page-header[b-ztixaeoodr] {
        align-items: stretch;
        flex-direction: column;
        padding: 18px;
        gap: 16px;
    }

    .crud-page-header-main[b-ztixaeoodr] {
        align-items: flex-start;
    }

    .crud-page-header-button[b-ztixaeoodr] {
        width: 100%;
    }
}

:global(.mud-theme-dark) .crud-page-header[b-ztixaeoodr],
:global(body.dark) .crud-page-header[b-ztixaeoodr],
:global(.dark) .crud-page-header[b-ztixaeoodr] {
    border-color: rgba(148, 163, 184, 0.24);
    background: #111c32;
}

:global(.mud-theme-dark) .crud-page-header-copy h1[b-ztixaeoodr],
:global(body.dark) .crud-page-header-copy h1[b-ztixaeoodr],
:global(.dark) .crud-page-header-copy h1[b-ztixaeoodr] {
    color: #f8fafc;
}

:global(.mud-theme-dark) .crud-page-header-copy p[b-ztixaeoodr],
:global(body.dark) .crud-page-header-copy p[b-ztixaeoodr],
:global(.dark) .crud-page-header-copy p[b-ztixaeoodr] {
    color: #cbd5e1;
}
/* /Shared/Components/Crud/CrudStatusBadge.razor.rz.scp.css */
/* =========================================================
   COMPONENTE: CRUD STATUS BADGE
   ========================================================= */

.crud-status-badge[b-y5oqjfbm6n] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 26px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
    font-weight: 900;
    white-space: nowrap;
}

.crud-status-dot[b-y5oqjfbm6n] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

.crud-status-active[b-y5oqjfbm6n] {
    background: #d8f8e4;
    color: #0aa257;
}

.crud-status-inactive[b-y5oqjfbm6n] {
    background: #ffe1e1;
    color: #ef4444;
}

.crud-status-pending[b-y5oqjfbm6n] {
    background: #fff0bf;
    color: #d97706;
}
/* /Shared/Components/Crud/CrudSummaryCards.razor.rz.scp.css */
/* =========================================================
   COMPONENTE: CRUD SUMMARY CARDS
   Indicadores dinámicos estándar para todos los CRUD.
   ========================================================= */

.crud-summary-panel[b-br1m19xc9f] {
    width: 100%;
    margin-bottom: 18px;
    min-height: 102px;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.crud-summary-item[b-br1m19xc9f] {
    min-width: 0;
    min-height: 102px;
    padding: 18px 20px;
    border: 1px solid #dce6f3;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 12px 26px rgba(15, 35, 75, 0.045);
    display: flex;
    align-items: center;
    gap: 16px;
    box-sizing: border-box;
}

.crud-summary-divider[b-br1m19xc9f] {
    display: none;
}

.crud-summary-icon[b-br1m19xc9f] {
    width: 54px;
    height: 54px;
    min-width: 54px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}

.crud-summary-icon[b-br1m19xc9f]  .mud-icon-root,
.crud-summary-mud-icon[b-br1m19xc9f] {
    width: 29px !important;
    height: 29px !important;
    font-size: 29px !important;
    color: currentColor !important;
    fill: currentColor !important;
}

.crud-summary-copy[b-br1m19xc9f] {
    min-width: 0;
}

.crud-summary-copy strong[b-br1m19xc9f] {
    display: block;
    color: #071b4d;
    font-size: 1.62rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -0.045em;
}

.crud-summary-title[b-br1m19xc9f] {
    display: block;
    margin-top: 6px;
    color: #334155;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.1;
}

.crud-summary-copy small[b-br1m19xc9f] {
    display: block;
    margin-top: 7px;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}

/* Variantes semánticas */
.crud-summary-blue .crud-summary-icon[b-br1m19xc9f] { background: #eaf2ff; color: #2563eb; border-color: #d6e6ff; }
.crud-summary-green .crud-summary-icon[b-br1m19xc9f] { background: #ecfdf3; color: #16a34a; border-color: #c8f3d8; }
.crud-summary-emerald .crud-summary-icon[b-br1m19xc9f] { background: #dcfce7; color: #059669; border-color: #bbf7d0; }
.crud-summary-orange .crud-summary-icon[b-br1m19xc9f] { background: #fff2df; color: #f97316; border-color: #fed7aa; }
.crud-summary-red .crud-summary-icon[b-br1m19xc9f] { background: #fee2e2; color: #dc2626; border-color: #fecaca; }
.crud-summary-purple .crud-summary-icon[b-br1m19xc9f] { background: #eee2ff; color: #7c3aed; border-color: #ddd6fe; }
.crud-summary-gray .crud-summary-icon[b-br1m19xc9f] { background: #eef2f7; color: #475569; border-color: #d8e1ec; }

@media (max-width: 1200px) {
    .crud-summary-panel[b-br1m19xc9f] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .crud-summary-panel[b-br1m19xc9f] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .crud-summary-item[b-br1m19xc9f] {
        min-height: 92px;
        padding: 16px;
        border-radius: 12px;
    }

    .crud-summary-icon[b-br1m19xc9f] {
        width: 50px;
        height: 50px;
        min-width: 50px;
        border-radius: 15px;
    }

    .crud-summary-icon[b-br1m19xc9f]  .mud-icon-root,
    .crud-summary-mud-icon[b-br1m19xc9f] {
        width: 27px !important;
        height: 27px !important;
        font-size: 27px !important;
    }
}

:global(.mud-theme-dark) .crud-summary-item[b-br1m19xc9f],
:global(body.dark) .crud-summary-item[b-br1m19xc9f],
:global(.dark) .crud-summary-item[b-br1m19xc9f] {
    border-color: rgba(148, 163, 184, 0.24);
    background: #111c32;
}

:global(.mud-theme-dark) .crud-summary-title[b-br1m19xc9f],
:global(.mud-theme-dark) .crud-summary-copy strong[b-br1m19xc9f],
:global(body.dark) .crud-summary-title[b-br1m19xc9f],
:global(body.dark) .crud-summary-copy strong[b-br1m19xc9f],
:global(.dark) .crud-summary-title[b-br1m19xc9f],
:global(.dark) .crud-summary-copy strong[b-br1m19xc9f] {
    color: #f8fafc;
}

:global(.mud-theme-dark) .crud-summary-copy small[b-br1m19xc9f],
:global(body.dark) .crud-summary-copy small[b-br1m19xc9f],
:global(.dark) .crud-summary-copy small[b-br1m19xc9f] {
    color: #cbd5e1;
}
/* /Shared/Components/Crud/CrudTable.razor.rz.scp.css */
/* =========================================================
   COMPONENTE: CRUD TABLE
   Tabla dinámica estándar para todos los CRUD.
   ========================================================= */

.crud-table-columns-host[b-vnzgg2zexm] {
    display: none;
}

.crud-table-card[b-vnzgg2zexm] {
    width: 100%;
    border: 1px solid #dce6f3;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(15, 35, 75, 0.045);
    overflow: hidden;
}

.crud-table-header[b-vnzgg2zexm] {
    min-height: 52px;
    padding: 0 18px;
    border-bottom: 1px solid #e7eef8;
    display: flex;
    align-items: center;
    gap: 10px;
}

.crud-table-header h2[b-vnzgg2zexm] {
    margin: 0;
    color: #071b4d;
    font-size: 15px;
    font-weight: 950;
}

.crud-table-header span[b-vnzgg2zexm] {
    min-width: 24px;
    height: 22px;
    padding: 0 9px;
    border-radius: 999px;
    background: #eef2f7;
    color: #52627f;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 900;
}

.crud-table-responsive[b-vnzgg2zexm] {
    width: 100%;
    overflow-x: auto;
}

.crud-table[b-vnzgg2zexm] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 760px;
}

.crud-table thead th[b-vnzgg2zexm] {
    height: 46px;
    padding: 0 18px;
    border-bottom: 1px solid #e7eef8;
    background: #f8fbff;
    color: #52627f;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.035em;
    white-space: nowrap;
}

.crud-table tbody td[b-vnzgg2zexm] {
    min-height: 54px;
    padding: 13px 18px;
    border-bottom: 1px solid #eef3fb;
    color: #1e2d4f;
    font-size: 14px;
    font-weight: 700;
    vertical-align: middle;
}

.crud-table tbody tr:last-child td[b-vnzgg2zexm] {
    border-bottom: 0;
}

.crud-table tbody tr:hover td[b-vnzgg2zexm] {
    background: #f8fbff;
}

.crud-table-align-left[b-vnzgg2zexm] { text-align: left; }
.crud-table-align-center[b-vnzgg2zexm] { text-align: center; }
.crud-table-align-right[b-vnzgg2zexm] { text-align: right; }

.crud-table-actions-header[b-vnzgg2zexm],
.crud-table-actions-cell[b-vnzgg2zexm] {
    width: 96px;
    text-align: center;
}

.crud-table-empty[b-vnzgg2zexm] {
    height: 92px;
    text-align: center;
    color: #64748b;
    font-weight: 850;
}

@media (max-width: 760px) {
    .crud-table-card[b-vnzgg2zexm] {
        border-radius: 12px;
    }

    .crud-table-header[b-vnzgg2zexm] {
        padding: 0 14px;
    }
}

:global(.mud-theme-dark) .crud-table-card[b-vnzgg2zexm],
:global(body.dark) .crud-table-card[b-vnzgg2zexm],
:global(.dark) .crud-table-card[b-vnzgg2zexm] {
    border-color: rgba(148, 163, 184, 0.24);
    background: #111c32;
}

:global(.mud-theme-dark) .crud-table-header[b-vnzgg2zexm],
:global(body.dark) .crud-table-header[b-vnzgg2zexm],
:global(.dark) .crud-table-header[b-vnzgg2zexm] {
    border-bottom-color: rgba(148, 163, 184, 0.18);
}

:global(.mud-theme-dark) .crud-table-header h2[b-vnzgg2zexm],
:global(body.dark) .crud-table-header h2[b-vnzgg2zexm],
:global(.dark) .crud-table-header h2[b-vnzgg2zexm] {
    color: #f8fafc;
}

:global(.mud-theme-dark) .crud-table thead th[b-vnzgg2zexm],
:global(body.dark) .crud-table thead th[b-vnzgg2zexm],
:global(.dark) .crud-table thead th[b-vnzgg2zexm] {
    border-bottom-color: rgba(148, 163, 184, 0.18);
    background: #0f172a;
    color: #cbd5e1;
}

:global(.mud-theme-dark) .crud-table tbody td[b-vnzgg2zexm],
:global(body.dark) .crud-table tbody td[b-vnzgg2zexm],
:global(.dark) .crud-table tbody td[b-vnzgg2zexm] {
    border-bottom-color: rgba(148, 163, 184, 0.14);
    color: #e2e8f0;
}

:global(.mud-theme-dark) .crud-table tbody tr:hover td[b-vnzgg2zexm],
:global(body.dark) .crud-table tbody tr:hover td[b-vnzgg2zexm],
:global(.dark) .crud-table tbody tr:hover td[b-vnzgg2zexm] {
    background: rgba(96, 165, 250, 0.06);
}
/* /Shared/Components/Crud/CrudToolbar.razor.rz.scp.css */
/* =========================================================
   COMPONENTE: CRUD TOOLBAR
   Estándar único HABYTAL: búsqueda | estado | acciones.
   ========================================================= */

.crud-toolbar[b-m6p42c93a5] {
    width: 100%;
    margin-bottom: 18px;
    display: grid;
    grid-template-columns: minmax(260px, 386px) minmax(320px, 1fr) auto;
    gap: 14px;
    align-items: center;
    box-sizing: border-box;
}

.crud-toolbar-search[b-m6p42c93a5],
.crud-toolbar-filter-box[b-m6p42c93a5] {
    height: 50px;
    min-width: 0;
    padding: 0 15px;
    border: 1px solid #9aa8bd;
    border-radius: 3px;
    background: #ffffff;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #52627f;
    box-sizing: border-box;
    transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.crud-toolbar-filter-box[b-m6p42c93a5] {
    width: 100%;
    padding: 0 12px;
}

.crud-toolbar-search:hover[b-m6p42c93a5],
.crud-toolbar-filter-box:hover[b-m6p42c93a5] {
    border-color: #718096;
}

.crud-toolbar-search:focus-within[b-m6p42c93a5],
.crud-toolbar-filter-box:focus-within[b-m6p42c93a5] {
    border-color: #2f6df6;
    box-shadow: 0 0 0 1px #2f6df6;
}

.crud-toolbar-search[b-m6p42c93a5]  .mud-icon-root,
.crud-toolbar-filter-box[b-m6p42c93a5]  .mud-icon-root {
    font-size: 20px;
    color: #52627f;
}

.crud-toolbar-search input[b-m6p42c93a5] {
    width: 100%;
    min-width: 0;
    height: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: #24324a;
    font-size: 14px;
    font-weight: 400;
}

.crud-toolbar-search input[b-m6p42c93a5]::placeholder {
    color: #8a96aa;
    font-weight: 400;
}

.crud-toolbar-status-filter[b-m6p42c93a5] {
    width: 100%;
}

.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-control {
    width: 100%;
    margin: 0 !important;
}

.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-root {
    width: 100%;
    min-height: 48px !important;
    margin: 0 !important;
    padding-top: 0 !important;
    color: #24324a !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-slot {
    color: #24324a !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-adornment-start {
    margin-right: 10px !important;
}

.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-underline:before,
.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-underline:after,
.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-outlined-border {
    border: 0 !important;
    box-shadow: none !important;
}

.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-root:focus,
.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-root:focus-within,
.crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-control:focus-within {
    outline: 0 !important;
    box-shadow: none !important;
}

.crud-toolbar-actions[b-m6p42c93a5] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    white-space: nowrap;
}

.crud-toolbar-secondary[b-m6p42c93a5] {
    height: 42px;
    min-width: 136px;
    padding: 0 16px;
    border: 1px solid #071b4d;
    border-radius: 4px;
    background: #ffffff;
    color: #071b4d;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .01em;
    text-transform: uppercase;
    cursor: pointer;
    box-sizing: border-box;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.crud-toolbar-secondary[b-m6p42c93a5]  .mud-icon-root {
    font-size: 18px;
    color: currentColor;
}

.crud-toolbar-secondary:hover[b-m6p42c93a5] {
    border-color: #2f6df6;
    color: #2f6df6;
    background: #f5f8ff;
    transform: translateY(-1px);
}

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

@media (max-width: 1100px) {
    .crud-toolbar[b-m6p42c93a5] {
        grid-template-columns: 1fr;
    }

    .crud-toolbar-actions[b-m6p42c93a5] {
        width: 100%;
        justify-content: stretch;
    }

    .crud-toolbar-secondary[b-m6p42c93a5] {
        flex: 1 1 0;
    }
}

@media (max-width: 640px) {
    .crud-toolbar[b-m6p42c93a5] {
        gap: 10px;
    }

    .crud-toolbar-search[b-m6p42c93a5],
    .crud-toolbar-filter-box[b-m6p42c93a5] {
        height: 44px;
    }

    .crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-root {
        min-height: 42px !important;
    }

    .crud-toolbar-actions[b-m6p42c93a5] {
        flex-direction: column;
    }

    .crud-toolbar-secondary[b-m6p42c93a5] {
        width: 100%;
    }
}

/* =========================================================
   MODO OSCURO
   ========================================================= */

:global(.mud-theme-dark) .crud-toolbar-search[b-m6p42c93a5],
:global(.mud-theme-dark) .crud-toolbar-filter-box[b-m6p42c93a5],
:global(body.dark) .crud-toolbar-search[b-m6p42c93a5],
:global(body.dark) .crud-toolbar-filter-box[b-m6p42c93a5],
:global(.dark) .crud-toolbar-search[b-m6p42c93a5],
:global(.dark) .crud-toolbar-filter-box[b-m6p42c93a5] {
    border-color: rgba(148, 163, 184, .38);
    background: #0f172a;
    color: #cbd5e1;
}

:global(.mud-theme-dark) .crud-toolbar-search input[b-m6p42c93a5],
:global(body.dark) .crud-toolbar-search input[b-m6p42c93a5],
:global(.dark) .crud-toolbar-search input[b-m6p42c93a5],
:global(.mud-theme-dark) .crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-root,
:global(body.dark) .crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-root,
:global(.dark) .crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-root,
:global(.mud-theme-dark) .crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-slot,
:global(body.dark) .crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-slot,
:global(.dark) .crud-toolbar-status-filter[b-m6p42c93a5]  .mud-input-slot {
    color: #f8fafc !important;
}

:global(.mud-theme-dark) .crud-toolbar-secondary[b-m6p42c93a5],
:global(body.dark) .crud-toolbar-secondary[b-m6p42c93a5],
:global(.dark) .crud-toolbar-secondary[b-m6p42c93a5] {
    border-color: rgba(203, 213, 225, .72);
    background: #0f172a;
    color: #f8fafc;
}
/* /Shared/Components/Dashboard/ActivityList.razor.rz.scp.css */
/* =========================================================
   SECCIÓN: ACTIVITY LIST
   ========================================================= */
.activity-list[b-2hkitu2eg5]{display:flex;flex-direction:column}.activity-item[b-2hkitu2eg5]{display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #edf2f7}.activity-item:last-child[b-2hkitu2eg5]{border-bottom:0}.activity-icon[b-2hkitu2eg5]{width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center}.activity-blue[b-2hkitu2eg5]{background:#eaf2ff;color:#2563eb}.activity-green[b-2hkitu2eg5]{background:#e9f9f0;color:#16a34a}.activity-purple[b-2hkitu2eg5]{background:#f1e9ff;color:#7c3aed}.activity-orange[b-2hkitu2eg5]{background:#fff2df;color:#f97316}.activity-title[b-2hkitu2eg5]{font-size:13px;font-weight:900;color:#18223b}.activity-description[b-2hkitu2eg5]{font-size:12px;color:#475569}.activity-time[b-2hkitu2eg5]{font-size:12px;color:#64748b;font-weight:700;white-space:nowrap}
/* /Shared/Components/Dashboard/DashboardSection.razor.rz.scp.css */
/* =========================================================
   SECCIÓN: CONTENEDOR
   ========================================================= */

.dashboard-section[b-p76xvgcu6l] {
    width: 100%;
    border: 1px solid #e5eaf3;
    border-radius: 18px;
    background: #ffffff;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
}

/* =========================================================
   SECCIÓN: ENCABEZADO
   ========================================================= */

.dashboard-section-header[b-p76xvgcu6l] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.dashboard-section-title[b-p76xvgcu6l] {
    font-weight: 800 !important;
    color: #0f172a;
}

.dashboard-section-subtitle[b-p76xvgcu6l] {
    margin-top: 4px;
    color: #64748b;
}

.dashboard-section-actions[b-p76xvgcu6l] {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* =========================================================
   SECCIÓN: CONTENIDO
   ========================================================= */

.dashboard-section-body[b-p76xvgcu6l] {
    width: 100%;
}
/* /Shared/Components/Dashboard/KpiCard.razor.rz.scp.css */
/* =========================================================
   SECCIÓN: KPI CARD
   ========================================================= */

.kpi-card[b-j24hcuahe8] {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 132px;
    padding: 22px 24px;
    border: 1px solid #e5ebf5;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
    overflow: hidden;
}

.kpi-icon[b-j24hcuahe8] {
    width: 76px;
    height: 76px;
    min-width: 76px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 24px;
}

.kpi-icon-blue[b-j24hcuahe8] { background: #eaf2ff; color: #2563eb; }
.kpi-icon-green[b-j24hcuahe8] { background: #e9f9f0; color: #16a34a; }
.kpi-icon-purple[b-j24hcuahe8] { background: #f1e9ff; color: #7c3aed; }
.kpi-icon-orange[b-j24hcuahe8] { background: #fff2df; color: #f97316; }

.kpi-content[b-j24hcuahe8] { z-index: 1; }
.kpi-title[b-j24hcuahe8] { color: #18223b; font-weight: 800; margin-bottom: 8px; }
.kpi-value[b-j24hcuahe8] { color: #111827; font-weight: 900; letter-spacing: -.4px; }

.kpi-trend[b-j24hcuahe8] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 8px;
    font-size: 12px;
    font-weight: 800;
}

.kpi-trend-positive[b-j24hcuahe8] { color: #16a34a; }
.kpi-trend-negative[b-j24hcuahe8] { color: #ef4444; }
.kpi-trend-muted[b-j24hcuahe8] { color: #64748b; font-weight: 600; margin-left: 2px; }

.kpi-sparkline[b-j24hcuahe8] {
    position: absolute;
    right: 18px;
    bottom: 20px;
    width: 110px;
    height: 42px;
    fill: none;
}

.kpi-sparkline-path[b-j24hcuahe8] { stroke-width: 4; stroke-linecap: round; }
.kpi-sparkline-blue[b-j24hcuahe8] { stroke: #2563eb; }
.kpi-sparkline-green[b-j24hcuahe8] { stroke: #16a34a; }
.kpi-sparkline-purple[b-j24hcuahe8] { stroke: #7c3aed; }
.kpi-sparkline-orange[b-j24hcuahe8] { stroke: #f97316; }
/* /Shared/Components/Dashboard/QuickActionCard.razor.rz.scp.css */
/* =========================================================
   SECCIÓN: QUICK ACTION CARD
   ========================================================= */
.quick-action-link[b-8xgvp33tui]{display:block;color:#23314f!important}.quick-action-card[b-8xgvp33tui]{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:13px;font-weight:800;transition:transform .18s ease,color .18s ease}.quick-action-card:hover[b-8xgvp33tui]{transform:translateY(-3px);color:#0d6efd}.quick-action-icon[b-8xgvp33tui]{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center}.quick-action-blue[b-8xgvp33tui]{background:#eaf2ff;color:#2563eb}.quick-action-green[b-8xgvp33tui]{background:#e9f9f0;color:#16a34a}.quick-action-purple[b-8xgvp33tui]{background:#f1e9ff;color:#7c3aed}.quick-action-orange[b-8xgvp33tui]{background:#fff2df;color:#f97316}.quick-action-red[b-8xgvp33tui]{background:#fff0f0;color:#ef4444}
/* /Shared/Components/Dashboard/StatusBadge.razor.rz.scp.css */
/* =========================================================
   SECCIÓN: STATUS BADGE
   ========================================================= */
.status-badge[b-5446k9xxoa]{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:800;border-radius:999px;padding:5px 10px}.status-dot[b-5446k9xxoa]{width:8px;height:8px;border-radius:50%;background:currentColor}.status-badge-green[b-5446k9xxoa]{color:#16a34a;background:#eafaf1}.status-badge-blue[b-5446k9xxoa]{color:#2563eb;background:#eaf2ff}.status-badge-orange[b-5446k9xxoa]{color:#f97316;background:#fff2df}.status-badge-red[b-5446k9xxoa]{color:#ef4444;background:#fff0f0}.status-badge-purple[b-5446k9xxoa]{color:#7c3aed;background:#f1e9ff}
/* /Shared/Navigation/HabytalNavMenu.razor.rz.scp.css */
/* =========================================================
   HABYTAL NAVMENU - VARIABLES
   ========================================================= */
.habytal-nav-shell[b-qoo7sac1qp] {
    --habytal-nav-width: 244px;
    --habytal-nav-bg: #f3f7fc;
    --habytal-nav-text: #0f1f39;
    --habytal-nav-muted: #40516a;
    --habytal-nav-blue: #2f6df6;
    --habytal-nav-blue-soft: #edf4ff;
    --habytal-nav-white: #ffffff;
    --habytal-nav-border: rgba(15, 23, 42, .06);
    --habytal-nav-shadow: 14px 0 32px rgba(15, 23, 42, .08);
    --habytal-nav-active-shadow: 0 14px 30px rgba(48, 111, 232, .16);

    --admin-dashboard: #3b82f6;
    --admin-residents: #8b5cf6;
    --admin-properties: #2563eb;
    --admin-finance: #16a34a;
    --admin-communications: #f97316;
    --admin-security: #dc2626;
    --admin-reports: #0f172a;
    --admin-settings: #475569;
}

/* =========================================================
   HABYTAL NAVMENU - SHELL BASE
   ========================================================= */
.habytal-nav-shell[b-qoo7sac1qp] {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    width: var(--habytal-nav-width);
    min-width: var(--habytal-nav-width);
    height: 100vh;
    padding: 30px 14px 16px;
    display: flex;
    flex-direction: column;
    background: var(--habytal-nav-bg);
    border-right: 1px solid var(--habytal-nav-border);
    box-shadow: var(--habytal-nav-shadow);
    color: var(--habytal-nav-text);
    overflow: hidden;
    transition: transform .25s ease;
}

.habytal-nav-shell.is-desktop-hidden[b-qoo7sac1qp] {
    transform: translateX(-100%);
}

/* =========================================================
   MARCA
   ========================================================= */
.habytal-nav-brand[b-qoo7sac1qp] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 4px 4px 34px 14px;
}

.habytal-brand-icon[b-qoo7sac1qp] {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: #eef5ff;
    color: var(--habytal-nav-text);
}

.habytal-brand-text[b-qoo7sac1qp] {
    flex: 1;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--habytal-nav-text);
}

.habytal-nav-toggle[b-qoo7sac1qp] {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border: 0;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: var(--habytal-nav-white);
    color: var(--habytal-nav-text);
    box-shadow: 0 10px 22px rgba(15, 23, 42, .08);
    cursor: pointer;
}

/* =========================================================
   CONTENIDO DEL MENÚ
   ========================================================= */
.habytal-nav-content[b-qoo7sac1qp] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 2px;
}

.habytal-nav-section-title[b-qoo7sac1qp] {
    margin: 0 0 16px 4px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    color: var(--habytal-nav-text);
}

.habytal-nav-link[b-qoo7sac1qp] {
    width: 100%;
    min-height: 42px;
    padding: 0 14px;
    margin-bottom: 8px;
    border: 0;
    border-radius: 11px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: transparent;
    color: var(--habytal-nav-text);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

.habytal-nav-link:hover[b-qoo7sac1qp],
.habytal-nav-link.active[b-qoo7sac1qp] {
    background: var(--habytal-nav-white);
    color: var(--habytal-nav-text);
    box-shadow: var(--habytal-nav-active-shadow);
}

.habytal-nav-link.active[b-qoo7sac1qp] {
    border-left: 4px solid var(--habytal-nav-blue);
    padding-left: 10px;
}

/* =========================================================
   ICONOS DINÁMICOS SIN CÓDIGO DUPLICADO
   ========================================================= */
.habytal-nav-icon[b-qoo7sac1qp],
.habytal-nav-chevron[b-qoo7sac1qp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}

.habytal-nav-icon[b-qoo7sac1qp] {
    width: 28px;
    min-width: 28px;
    height: 28px;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.habytal-nav-chevron[b-qoo7sac1qp] {
    width: 18px;
    min-width: 18px;
    margin-left: auto;
    color: var(--habytal-nav-text);
}

/* =========================================================
   ICONOS DEL MENÚ POR MÓDULO - FLAT + COLOR
   ========================================================= */
.admin-menu-icon[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon,
.admin-menu-icon-svg[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-svg,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-svg {
    font-size: 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    line-height: 1 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* El color se aplica al wrapper y al SVG interno para evitar que MudBlazor o el link activo lo sobreescriban. */
.habytal-nav-icon.admin-menu-icon-dashboard[b-qoo7sac1qp],
.habytal-nav-icon.admin-menu-icon-dashboard .mud-icon-root[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-dashboard,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-dashboard {
    color: var(--admin-dashboard, #3b82f6) !important;
    fill: currentColor !important;
}

.habytal-nav-icon.admin-menu-icon-residents[b-qoo7sac1qp],
.habytal-nav-icon.admin-menu-icon-residents .mud-icon-root[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-residents,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-residents {
    color: var(--admin-residents, #8b5cf6) !important;
    fill: currentColor !important;
}

.habytal-nav-icon.admin-menu-icon-properties[b-qoo7sac1qp],
.habytal-nav-icon.admin-menu-icon-properties .mud-icon-root[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-properties,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-properties {
    color: var(--admin-properties, #2563eb) !important;
    fill: currentColor !important;
}

.habytal-nav-icon.admin-menu-icon-finance[b-qoo7sac1qp],
.habytal-nav-icon.admin-menu-icon-finance .mud-icon-root[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-finance,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-finance {
    color: var(--admin-finance, #16a34a) !important;
    fill: currentColor !important;
}

.habytal-nav-icon.admin-menu-icon-communications[b-qoo7sac1qp],
.habytal-nav-icon.admin-menu-icon-communications .mud-icon-root[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-communications,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-communications {
    color: var(--admin-communications, #f97316) !important;
    fill: currentColor !important;
}

.habytal-nav-icon.admin-menu-icon-security[b-qoo7sac1qp],
.habytal-nav-icon.admin-menu-icon-security .mud-icon-root[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-security,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-security {
    color: var(--admin-security, #dc2626) !important;
    fill: currentColor !important;
}

.habytal-nav-icon.admin-menu-icon-reports[b-qoo7sac1qp],
.habytal-nav-icon.admin-menu-icon-reports .mud-icon-root[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-reports,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-reports {
    color: var(--admin-reports, #0f172a) !important;
    fill: currentColor !important;
}

.habytal-nav-icon.admin-menu-icon-settings[b-qoo7sac1qp],
.habytal-nav-icon.admin-menu-icon-settings .mud-icon-root[b-qoo7sac1qp],
[b-qoo7sac1qp] .admin-menu-icon-settings,
[b-qoo7sac1qp] .mud-icon-root.admin-menu-icon-settings {
    color: var(--admin-settings, #475569) !important;
    fill: currentColor !important;
}

/* Mantiene el item activo blanco, pero NO apaga los colores de los iconos. */
.habytal-nav-link:hover .habytal-nav-label[b-qoo7sac1qp],
.habytal-nav-link.active .habytal-nav-label[b-qoo7sac1qp] {
    color: var(--habytal-nav-text);
}

/* =========================================================
   TEXTO
   ========================================================= */
.habytal-nav-label[b-qoo7sac1qp] {
    flex: 1;
    text-align: left;
    white-space: nowrap;
}

/* =========================================================
   GRUPOS Y SUBMENÚS
   ========================================================= */
.habytal-nav-group[b-qoo7sac1qp] {
    margin-bottom: 10px;
}

.habytal-nav-parent[b-qoo7sac1qp] {
    font-family: inherit;
}

.habytal-nav-group.is-active > .habytal-nav-parent[b-qoo7sac1qp],
.habytal-nav-parent:hover[b-qoo7sac1qp] {
    background: var(--habytal-nav-blue-soft);
    color: var(--habytal-nav-blue);
    box-shadow: none;
}

.habytal-nav-children[b-qoo7sac1qp] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 7px 0 10px 44px;
}

.habytal-nav-child[b-qoo7sac1qp] {
    min-height: 31px;
    display: flex;
    align-items: center;
    gap: 11px;
    color: var(--habytal-nav-muted);
    text-decoration: none;
    font-size: 12px;
    font-weight: 500;
    transition: color .18s ease;
}

.habytal-nav-child:hover[b-qoo7sac1qp],
.habytal-nav-child.active[b-qoo7sac1qp] {
    color: var(--habytal-nav-blue);
}

.habytal-child-dot[b-qoo7sac1qp] {
    width: 5px;
    height: 5px;
    min-width: 5px;
    border-radius: 50%;
    background: #aebbd0;
}

.habytal-nav-child.active .habytal-child-dot[b-qoo7sac1qp],
.habytal-nav-child:hover .habytal-child-dot[b-qoo7sac1qp] {
    background: var(--habytal-nav-blue);
}

/* =========================================================
   USUARIO INFERIOR
   ========================================================= */
.habytal-nav-user[b-qoo7sac1qp] {
    min-height: 67px;
    padding: 12px 10px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--habytal-nav-white);
    box-shadow: 0 14px 30px rgba(15, 23, 42, .08);
}

.habytal-user-avatar[b-qoo7sac1qp] {
    width: 39px;
    height: 39px;
    min-width: 39px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #5c96ff, var(--habytal-nav-blue));
    color: var(--habytal-nav-white);
}

.habytal-user-info[b-qoo7sac1qp] {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.habytal-user-info strong[b-qoo7sac1qp] {
    font-size: 12px;
    line-height: 1.2;
    color: var(--habytal-nav-text);
}

.habytal-user-info span[b-qoo7sac1qp] {
    font-size: 10px;
    line-height: 1.3;
    color: var(--habytal-nav-text);
    opacity: .86;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.habytal-user-action[b-qoo7sac1qp] {
    width: 26px;
    height: 26px;
    min-width: 26px;
    border: 0;
    border-radius: 8px;
    display: grid;
    place-items: center;
    background: transparent;
    color: var(--habytal-nav-text);
    cursor: pointer;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 768px) {
    .habytal-nav-shell[b-qoo7sac1qp] {
        transform: translateX(0);
    }
}