/* Capa exclusiva del portal cliente. No modifica el panel administrativo. */
html[data-portal="client"] {
    --client-green: #087454;
    --client-green-dark: #06563f;
    --client-tint: #eaf6f0;
    --client-ink: #18352d;
    --client-muted: #536960;
    --client-border: #dce8e1;
    --client-bg: #f5f8f6;
    --client-nav-height: 72px;
    --primary-color: var(--client-green);
    --primary-color-dark: var(--client-green-dark);
    --primary-color-light: #149d75;
    --focus-ring: 0 0 0 3px #08745426;
    color-scheme: light;
    scroll-padding-block: 1rem calc(1rem + var(--client-nav-height));
}
html[data-portal="client"] body {
    color: var(--client-ink);
    background-color: var(--client-bg);
    font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
    font-size: 16px;
    line-height: 1.55;
}
html[data-portal="client"] :is(input, select, textarea, button) { font-family: inherit; }
html[data-portal="client"] :is(.form-control, .form-select) {
    min-height: 46px;
    border-radius: 12px;
    border-color: var(--client-border);
    font-size: 1rem;
}
html[data-portal="client"] :is(.form-control, .form-select):focus { border-color: var(--client-green); box-shadow: var(--focus-ring); }
html[data-portal="client"] .btn { min-height: 46px; align-content: center; border-radius: 12px; font-weight: 600; }
html[data-portal="client"] :is(.btn-primary, .btn-success) {
    --bs-btn-bg: var(--client-green); --bs-btn-border-color: var(--client-green);
    --bs-btn-hover-bg: var(--client-green-dark); --bs-btn-hover-border-color: var(--client-green-dark);
    --bs-btn-active-bg: var(--client-green-dark); --bs-btn-active-border-color: var(--client-green-dark);
    background: var(--client-green); border-color: var(--client-green); color: white;
}
html[data-portal="client"] :is(.btn-primary, .btn-success):hover { background: var(--client-green-dark); }
html[data-portal="client"] :is(.card, .card-custom, .update-card, .view-section, .form-section) { border-color: var(--client-border); }
html[data-portal="client"] :is(h1, h2, h3, h4, h5, h6) { text-wrap: balance; }
html[data-portal="client"] :is(p, td, dd, .alert, .form-text) { overflow-wrap: anywhere; }
html[data-portal="client"] :focus-visible { outline: 3px solid var(--client-green); outline-offset: 3px; }
html[data-portal="client"] [aria-invalid="true"] { border-color: #b42318; }
html[data-portal="client"] :is(input, textarea, select, button, [tabindex]) { scroll-margin-block: 90px; }
html[data-portal="client"] .table-responsive { max-width: 100%; overscroll-behavior-x: contain; }
html[data-portal="client"] .navbar-custom { border-bottom: 1px solid var(--client-border); box-shadow: none; }
html[data-portal="client"] .navbar-custom .nav-link.active { color: var(--client-green); background: var(--client-tint); }
.client-bottom-nav { display: none; }
.client-more-menu:not([open]) { display: none; }
html[data-portal="client"] .client-more-menu {
    width: min(100% - 24px, 520px); max-width: 520px; max-height: calc(100dvh - 28px);
    margin: auto auto max(12px, env(safe-area-inset-bottom)); padding: 0;
    border: 1px solid var(--client-border); border-radius: 24px;
    color: var(--client-ink); background: white; overflow-y: auto;
    box-shadow: 0 20px 70px #18352d30; overscroll-behavior: contain;
}
html[data-portal="client"] .client-more-menu::backdrop { background: #142c2670; }
html[data-portal="client"].client-menu-open { overflow: hidden; }
.client-more-header { display: flex; gap: 16px; justify-content: space-between; align-items: center; padding: 22px 20px 16px; }
html[data-portal="client"] .client-more-header h2 { margin: 5px 0 0; font-size: 1.2rem; font-weight: 700; }
.client-eyebrow { font-size: .68rem; font-weight: 800; letter-spacing: .14em; color: #087454; }
.client-menu-close { flex: 0 0 46px; width: 46px; height: 46px; border: 0; border-radius: 50%; background: #f0f5f2; color: #18352d; font-size: 1.7rem; cursor: pointer; }
.client-more-links { padding: 0 12px 14px; }
.client-more-links a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; min-height: 58px; border-radius: 12px; color: #18352d; text-decoration: none; }
.client-more-links a:hover { background: #eaf6f0; color: #06563f; }
.client-more-links strong { display: block; font-size: .94rem; font-weight: 650; }
.client-more-links small { display: block; margin-top: 2px; font-size: .8rem; color: #536960; }
.client-more-links .client-signout { border-top: 1px solid #dce8e1; margin-top: 8px; color: #a52a21; border-radius: 0; }

@media (min-width: 768px) and (max-width: 991.98px) {
    html[data-portal="client"] :is(.main-container, .loan-client-page) {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
        padding-inline: 16px;
    }
}

@media (max-width: 767.98px) {
    html[data-portal="client"].client-has-nav body { padding-bottom: calc(var(--client-nav-height) + env(safe-area-inset-bottom) + 18px) !important; }
    html[data-portal="client"] body {
        overflow-x: hidden;
        overflow-x: clip;
    }
    html[data-portal="client"] :is(.container, .container-fluid, .main-container, .page-container, .dashboard-container, .prestamo-container, .container-main) {
        min-width: 0; max-width: 100%; padding-inline: 16px;
    }
    html[data-portal="client"] :is(.row > *, .d-flex > *, .card-body, .modal-body) { min-width: 0; }
    html[data-portal="client"] :is(h1, .page-title, .hero-title) { font-size: clamp(1.35rem, 6vw, 1.9rem); line-height: 1.2; }
    html[data-portal="client"] :is(.card, .card-custom, .update-card, .view-section) { border-radius: 16px; }
    html[data-portal="client"] :is(.form-section, .card-body) { padding: 18px; }
    html[data-portal="client"] :is(.hero-section, .page-header, .page-header-modern) { padding: 24px 18px; border-radius: 18px; }
    html[data-portal="client"] :is(.btn, .form-control, .form-select, input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"]) { min-height: 46px; font-size: 16px; }
    html[data-portal="client"] :is(.btn, .nav-link) { white-space: normal; }
    html[data-portal="client"] input[type="file"]:not(.sr-only):not(.visually-hidden):not(.file-input) {
        width: 100%; min-width: 0; max-width: 100%;
    }
    html[data-portal="client"] :is(.modal-dialog, .modal-dialog-centered) { margin: 12px; min-height: calc(100% - 24px); }
    html[data-portal="client"] .modal-content { max-height: calc(100dvh - 24px); border-radius: 20px; overflow: hidden; }
    html[data-portal="client"] .modal-body { overflow-y: auto; overscroll-behavior: contain; }
    html[data-portal="client"] .modal-footer { flex-wrap: wrap; gap: 8px; padding-bottom: max(16px, env(safe-area-inset-bottom)); }
    html[data-portal="client"] .modal-footer .btn { flex: 1 1 130px; margin: 0; }
    html[data-portal="client"] .btn-close { box-sizing: border-box; width: 46px; height: 46px; padding: 14px; background-size: 14px; }
    html[data-portal="client"] .client-bottom-nav {
        position: fixed; inset: auto 0 0; z-index: 1030; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
        box-sizing: border-box; width: auto; max-width: 100vw; margin: 0; transform: none;
        min-height: var(--client-nav-height); padding: 7px max(8px, env(safe-area-inset-left)) calc(7px + env(safe-area-inset-bottom));
        border-top: 1px solid var(--client-border); background: #fff; box-shadow: 0 -4px 24px #18352d08;
    }
    html[data-portal="client"] .client-bottom-nav :is(a, button) {
        display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 3px;
        min-width: 0; min-height: 54px; padding: 4px; border: 0; border-radius: 12px;
        background: transparent; color: var(--client-muted); font-size: 11px; font-weight: 650; line-height: 1.3; text-decoration: none; cursor: pointer;
    }
    html[data-portal="client"] .client-bottom-nav :is([aria-current="page"], .is-current, [aria-expanded="true"]) { background: var(--client-tint); color: var(--client-green-dark); }
    .client-bottom-nav svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
    html[data-portal="client"].client-keyboard-open .client-bottom-nav { display: none; }
    html[data-portal="client"] body.modal-open .client-bottom-nav { visibility: hidden; }
    html[data-portal="client"] :is(.toast-notification, .toast-container) { max-width: calc(100vw - 24px); }
    html[data-portal="client"] .steps-progress { scroll-padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    html[data-portal="client"] { scroll-behavior: auto !important; }
    html[data-portal="client"] *, html[data-portal="client"] *::before, html[data-portal="client"] *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}