:root {
    --portal-ink: #102a43;
    --portal-blue: #0d6fca;
    --portal-blue-dark: #0756a0;
    --portal-aqua: #0b9ca4;
    --portal-sky: #eff8ff;
    --portal-line: #d9e7f3;
    --portal-gold: #d9981f;
}

body {
    font-family: "IBM Plex Sans Arabic", Tahoma, sans-serif;
    color: var(--portal-ink);
    background:
        radial-gradient(circle at 8% 5%, rgba(11, 156, 164, .10), transparent 20rem),
        radial-gradient(circle at 94% 36%, rgba(13, 111, 202, .11), transparent 25rem),
        #f7fbff;
}

h1, h2, h3, h4, h5, h6, .form-title, .aside-title, .panel-title {
    font-family: "Tajawal", "IBM Plex Sans Arabic", sans-serif;
}

.topbar {
    background: rgba(255, 255, 255, .86);
    border-bottom-color: rgba(202, 222, 239, .85);
    box-shadow: 0 4px 22px rgba(30, 74, 116, .04);
}

.topbar-inner { min-height: 100px; }
.site-footer { display: grid; justify-items: center; gap: 4px; }
.footer-developer { color: #7a90a2; font-size: .76rem; }
.brand-block { display: inline-flex; flex-direction: column; align-items: center; gap: 1px; text-decoration: none; }
.brand-logo { width: 150px; height: 100px; }
.brand-system-name { color: #365f82; font-family: "Tajawal", sans-serif; font-size: .93rem; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.topbar-button, .button, .primary-link, .outline-link, .mini-link {
    font-family: "Tajawal", sans-serif;
    font-weight: 700;
}

.topbar-button {
    border: 1px solid rgba(13, 111, 202, .28);
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(13, 111, 202, .08);
}

.topbar-dashboard {
    border: 0;
    border-radius: 0;
    width: 100%;
    margin: 0;
    box-shadow: 0 3px 18px rgba(22, 67, 103, .07);
}

.topbar-inner-dashboard {
    width: min(1380px, calc(100% - 34px));
    min-height: 82px;
    gap: 26px;
}

.brand-block-dashboard { text-decoration: none; }
.topbar-dashboard .brand-logo { width: 94px; height: 74px; }
.topbar-dashboard .brand-system-name { font-size: .73rem; }
.topbar-inner-dashboard { position: relative; }
.dashboard-menu-toggle { display: none; align-items: center; justify-content: center; gap: 7px; min-height: 42px; padding: 0 13px; border: 1px solid #d7e7f4; border-radius: 12px; color: #165b9e; background: #f1f8ff; font: inherit; font-size: .83rem; font-weight: 700; cursor: pointer; transition: transform .2s ease, background .2s ease, color .2s ease; }
.dashboard-menu-toggle i { font-size: 1.3rem; line-height: 1; }.dashboard-menu-toggle:hover, .dashboard-menu-toggle[aria-expanded="true"] { color: #fff; background: #0d6fca; transform: translateY(-1px); }
.dashboard-topnav { display:flex; align-items:center; gap:5px; margin-inline:auto; }.dashboard-topnav.is-open { display:flex; }
.dashboard-topnav a { display: inline-flex; align-items: center; gap: 7px; padding: 10px 12px; border-radius: 10px; color: #55718c; font-size: .86rem; font-weight: 700; text-decoration: none; transition: color .2s ease, background .2s ease; }
.dashboard-topnav a:hover, .dashboard-topnav a.is-active { color: #0a6baf; background: #eaf5ff; }
.dashboard-topnav i { font-size: 1rem; }
@keyframes dashboard-menu-in { from { opacity: 0; transform: translateY(-7px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
.dashboard-userbar { gap: 10px; }
.notification-button { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; color: #0d6fca; background: #eef7ff; transition: background .2s ease; }
.notification-button:hover { background: #deefff; }.notification-button svg { width: 22px; height: 22px; }
.user-mini-card { gap: 8px; }.user-mini-text { gap: 1px; }.user-mini-greeting { font-size: .7rem; }.user-mini-name { max-width: 140px; overflow: hidden; color: #284965; font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }.user-mini-avatar { width: 40px; height: 40px; }.user-mini-avatar svg { width: 22px; height: 22px; }
.dashboard-logout { display: inline-flex; align-items: center; gap: 7px; padding: 10px 12px; border: 1px solid #f4d6da; border-radius: 10px; color: #b33f4b; background: #fff8f8; font-size: .8rem; font-weight: 700; text-decoration: none; transition: color .2s ease, background .2s ease, transform .2s ease; }.dashboard-logout:hover { color: #fff; background: #bd4b57; transform: translateY(-1px); }
.admin-impersonation-banner { display:flex; align-items:center; justify-content:space-between; gap:14px; width:min(1380px,calc(100% - 34px)); margin:13px auto -8px; padding:10px 14px; border:1px solid #f2cf8e; border-radius:13px; color:#785315; background:#fff8e9; font-size:.8rem; font-weight:700; }.admin-impersonation-banner span,.admin-impersonation-banner a { display:inline-flex; align-items:center; gap:7px; }.admin-impersonation-banner a { padding:7px 10px; border-radius:9px; color:#fff; background:#a97010; text-decoration:none; white-space:nowrap; }
.hero-support-action { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:43px; padding:0 13px; border:1px solid #cbe3f6; border-radius:12px; color:#176aaf; background:#f1f8ff; font-size:.82rem; font-weight:700; text-decoration:none; transition:transform .18s ease,background .18s ease; }.hero-support-action:hover { color:#fff; background:#176aaf; transform:translateY(-2px); }

.user-installments-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.user-installments-total { position:relative; overflow:hidden; display:grid; gap:11px; padding:20px; border:1px solid #dce8f4; border-radius:18px; background:#fff; box-shadow:0 10px 25px rgba(26,77,124,.06); }.user-installments-total::before { content:""; position:absolute; right:0; top:0; width:5px; height:100%; }.user-installments-total span { display:flex; align-items:center; gap:7px; color:#678098; font-size:.84rem; font-weight:700; }.user-installments-total span i { font-size:1.1rem; }.user-installments-total strong { color:#183e64; font-family:"Tajawal",sans-serif; font-size:1.6rem; }.user-installments-total strong small { color:#8194a7; font-size:.8rem; }.user-installments-total.paid::before { background:#16a56b; }.user-installments-total.paid span i { color:#16a56b; }.user-installments-total.overdue::before { background:#d94d5f; }.user-installments-total.overdue span i { color:#d94d5f; }.user-installments-total.remaining::before { background:#1879d1; }.user-installments-total.remaining span i { color:#1879d1; }

.auth-card, .dashboard-panel, .subcategory-panel, .request-form-panel {
    border: 1px solid rgba(214, 230, 243, .88);
    box-shadow: 0 16px 42px rgba(31, 76, 115, .08);
}

.request-form-layout-single { grid-template-columns:minmax(0, 1fr) !important; }

.auth-card { overflow: hidden; }
.auth-aside {
    background:
        linear-gradient(155deg, rgba(232, 247, 255, .97), rgba(245, 252, 255, .98)),
        linear-gradient(135deg, #e9f6ff, #fff);
}

.auth-aside::after {
    content: "";
    position: absolute;
    width: 15rem;
    height: 15rem;
    border-radius: 50%;
    background: rgba(13, 111, 202, .07);
    left: -7rem;
    bottom: -7rem;
}

.auth-form-panel { background: rgba(255, 255, 255, .94); }
.auth-card-login { grid-template-columns: minmax(0, 560px); justify-content: center; max-width: 560px; margin-inline: auto; }
.auth-card-register { grid-template-columns: minmax(0, 860px); justify-content: center; max-width: 860px; margin-inline: auto; }
.auth-card-login .auth-form-panel { padding: 42px 46px 34px; }
.auth-card-register .auth-form-panel { padding: 42px 46px 34px; }
.login-form-icon { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 16px; border-radius: 18px; color: #0b6fbe; background: linear-gradient(135deg, #e5f3ff, #e2faf6); font-size: 1.5rem; }
.resend-code-form { margin-top: 18px; text-align: center; }.resend-code-form p { margin: 0; color: #71869a; font-size: .85rem; }.resend-code-form button { padding: 0; border: 0; color: #0d6fca; background: transparent; font: inherit; font-weight: 700; cursor: pointer; }
.form-title { letter-spacing: -.02em; color: #083f80; }
.form-subtitle, .field-note { color: #60758d; }

.field label { font-weight: 700; color: #25425e; }
.input-wrap input, .field > input, .field > select, .flatpickr-input {
    border-color: #d4e3ef;
    background: #fbfdff;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.input-wrap:focus-within input, .field > input:focus, .field > select:focus, .flatpickr-input:focus {
    border-color: var(--portal-blue);
    background: #fff;
    box-shadow: 0 0 0 .22rem rgba(13, 111, 202, .13);
}

.button {
    background: linear-gradient(115deg, var(--portal-blue-dark), var(--portal-aqua));
    border: 0;
    box-shadow: 0 14px 24px rgba(13, 111, 202, .19);
}

.button:hover { transform: translateY(-2px); filter: saturate(1.08); }
.dashboard-panel { background: rgba(255, 255, 255, .91); }
.dashboard-greeting { background: linear-gradient(140deg, #fff 20%, #eef9ff); }
.request-hero { background: linear-gradient(120deg, #0a579d, #0a8993); color: #fff; }
.request-hero h2, .request-hero p { color: #fff; }
.request-hero .outline-link { color: #fff; border-color: rgba(255, 255, 255, .62); }
.request-hero .outline-link:hover { background: rgba(255, 255, 255, .16); }

.category-card, .subcategory-card, .followup-request-card {
    border-color: #dcebf5;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.category-card:hover, .subcategory-card:hover, .followup-request-card:hover {
    transform: translateY(-4px);
    border-color: rgba(13, 111, 202, .34);
    box-shadow: 0 18px 34px rgba(13, 111, 202, .12);
}

.category-card.is-active { border-color: var(--portal-blue); box-shadow: 0 14px 28px rgba(13, 111, 202, .13); }
.form-section { border-color: #dcebf5; background: linear-gradient(160deg, #fff, #fbfdff); }
.form-section-head { border-bottom-color: #e6f0f7; }
.form-section-head h3::before { background: var(--portal-aqua); }


.dashboard-chart-panel { margin: 20px 0; }
.panel-title .bi { color: var(--portal-blue); margin-left: .4rem; }
.chart-caption { margin: .25rem 0 0; color: #71869b; font-size: .88rem; }
.chart-wrap { height: 230px; max-width: 560px; margin: 0 auto; }

.followup-stat-card { border-top: 3px solid #94c9ec; }
.followup-stat-card.blue { border-top-color: var(--portal-blue); }
.followup-stat-card.green { border-top-color: #16a36c; }
.pill { box-shadow: 0 3px 10px rgba(16, 42, 67, .08); }

.swal2-popup { font-family: "IBM Plex Sans Arabic", sans-serif; border-radius: 20px; }
.swal2-title { font-family: "Tajawal", sans-serif; color: var(--portal-ink); }
.swal2-confirm { font-family: "Tajawal", sans-serif; font-weight: 700; }

@media (max-width: 760px) {
    .topbar-inner { min-height: 84px; }
    .brand-logo { width: 105px; height: 78px; }
    .brand-system-name { font-size: .76rem; }
    .topbar-action { gap: 8px; font-size: 13px; }
    .topbar-button { padding: 10px 13px; }
    .chart-wrap { height: 210px; }
    .auth-card-login .auth-form-panel { padding: 32px 22px 26px; }
    .auth-card-register .auth-form-panel { padding: 32px 22px 26px; }

    .topbar-inner-dashboard { width: min(100% - 22px, 620px); min-height: 70px; gap: 10px; }
    .topbar-dashboard .brand-logo { width: 70px; height: 58px; }
    .topbar-dashboard .brand-system-name { font-size: .58rem; }
    .dashboard-topnav { order: 3; width: 100%; justify-content: space-between; overflow-x: auto; padding-bottom: 8px; }
    .dashboard-topnav a { flex: 0 0 auto; padding: 7px 9px; font-size: .73rem; }
    .dashboard-userbar { gap: 6px; }
    .user-mini-text, .dashboard-logout span { display: none; }
    .dashboard-logout { padding: 10px; }
    .admin-impersonation-banner { width:calc(100% - 22px); align-items:flex-start; flex-direction:column; margin:10px auto -3px; }.admin-impersonation-banner a { width:100%; justify-content:center; }
}

/* Dashboard focused on the beneficiary's live request data. */
.beneficiary-dashboard { display: grid; gap: 22px; width: min(1380px, calc(100% - 34px)); margin: 26px auto 38px; }
.beneficiary-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 30px 34px; border-radius: 26px; color: #fff; background: radial-gradient(circle at 12% 120%, rgba(79, 208, 196, .42), transparent 23rem), linear-gradient(125deg, #073c79, #087f92); box-shadow: 0 20px 45px rgba(4, 71, 121, .22); }
.eyebrow, .section-kicker { display: inline-flex; align-items: center; gap: .45rem; font-size: .82rem; font-weight: 700; }.eyebrow { color: #b9eff3; }.beneficiary-hero h1 { margin: .55rem 0 .4rem; font-size: clamp(1.8rem, 3vw, 2.55rem); color: #fff; }.beneficiary-hero p { margin: 0; color: rgba(255, 255, 255, .8); font-size: 1rem; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }.hero-primary-action, .hero-secondary-action { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; border-radius: 12px; text-decoration: none; font-family: "Tajawal", sans-serif; font-weight: 700; transition: transform .2s ease, background .2s ease; }.hero-primary-action { padding: 13px 18px; color: #073f72; background: #fff; box-shadow: 0 10px 20px rgba(0, 0, 0, .11); }.hero-secondary-action { padding: 12px 15px; color: #fff; border: 1px solid rgba(255, 255, 255, .4); }.hero-primary-action:hover, .hero-secondary-action:hover { transform: translateY(-2px); }.hero-secondary-action:hover { background: rgba(255, 255, 255, .12); }
.beneficiary-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }.beneficiary-kpi { display: flex; align-items: center; gap: 14px; padding: 19px; border: 1px solid #dceaf5; border-radius: 20px; background: rgba(255, 255, 255, .92); box-shadow: 0 9px 25px rgba(36, 83, 120, .06); }.kpi-icon { display: grid; place-items: center; flex: 0 0 50px; height: 50px; border-radius: 16px; font-size: 1.35rem; }.beneficiary-kpi > div { display: grid; min-width: 0; gap: 1px; }.beneficiary-kpi span:not(.kpi-icon), .beneficiary-kpi small { color: #698097; font-size: .78rem; }.beneficiary-kpi strong { color: #153c61; font-size: 1.5rem; line-height: 1.25; }.beneficiary-kpi strong small { font-size: .72rem; font-weight: 700; }.kpi-blue .kpi-icon { color: #0b68bf; background: #e4f1ff; }.kpi-teal .kpi-icon { color: #038a80; background: #dcf8f2; }.kpi-gold .kpi-icon { color: #bf7d09; background: #fff1d9; }.kpi-violet .kpi-icon { color: #7048b8; background: #f0e8ff; }
.beneficiary-content-grid { display: grid; grid-template-columns: minmax(0, 1.48fr) minmax(310px, .8fr); align-items: start; gap: 20px; }.beneficiary-main-column, .beneficiary-side-column { display: grid; gap: 20px; }.request-focus-card, .recent-requests-card, .financial-summary-card, .installment-summary-card, .live-notifications-card { padding: 24px; }.request-focus-card { border-top: 4px solid #0e88a1; }.request-focus-head, .dashboard-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }.section-kicker { color: #0c7796; }.request-focus-head h2, .dashboard-section-head h2 { margin: .35rem 0 0; color: #143a5e; font-size: 1.3rem; }.request-focus-head p { margin: .4rem 0 0; color: #73879b; font-size: .88rem; }
.request-focus-data { display: grid; grid-template-columns: repeat(3, 1fr); margin: 25px 0; border: 1px solid #e2edf5; border-radius: 16px; overflow: hidden; }.request-focus-data div { display: grid; gap: 5px; padding: 15px 17px; border-left: 1px solid #e2edf5; }.request-focus-data div:last-child { border-left: 0; }.request-focus-data span { color: #74889d; font-size: .78rem; }.request-focus-data strong { color: #183f63; font-size: 1rem; }.request-progress-label { display: flex; align-items: center; justify-content: space-between; color: #587189; font-size: .86rem; }.request-progress-label strong { color: #0a7198; }.request-progress-track { height: 9px; margin: 10px 0 12px; overflow: hidden; border-radius: 99px; background: #e7f0f4; }.request-progress-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #0f65b2, #13a69e); }.request-stage-list { display: flex; justify-content: space-between; gap: 5px; color: #91a1af; font-size: .74rem; }.request-stage-list .is-complete { color: #097895; font-weight: 700; }
.request-action-note { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin-top: 22px; padding: 14px; border: 1px solid #f1d49f; border-radius: 14px; background: #fff9ec; }.request-action-note > i { color: #bd7a06; font-size: 1.25rem; }.request-action-note div { display: grid; gap: 3px; }.request-action-note strong { color: #765217; font-size: .87rem; }.request-action-note span { color: #856d42; font-size: .78rem; }.request-action-note a { padding: 9px 12px; border-radius: 9px; color: #fff; background: #b6790d; text-decoration: none; font-size: .8rem; font-weight: 700; }
.dashboard-section-head a { color: #0c6dbb; font-size: .84rem; font-weight: 700; text-decoration: none; }.recent-request-list { margin-top: 17px; }.recent-request-row { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto auto 16px; align-items: center; gap: 12px; padding: 13px 0; color: inherit; text-decoration: none; border-top: 1px solid #e9f0f5; }.recent-request-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; color: #0b6fc3; background: #eaf5ff; }.recent-request-info { display: grid; gap: 3px; }.recent-request-info strong { color: #1d405f; font-size: .9rem; }.recent-request-info small { color: #8293a3; font-size: .75rem; }.recent-request-amount { color: #315672; font-size: .82rem; white-space: nowrap; }.recent-request-arrow { color: #94a9b9; }.inline-empty-state { padding: 24px 0 4px; color: #7a90a2; text-align: center; font-size: .9rem; }
.financial-chart-wrap { height: 210px; margin-top: 8px; }.financial-totals { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }.financial-totals div { display: grid; gap: 4px; padding: 11px; border-radius: 11px; background: #f6faff; }.financial-totals span { color: #72899c; font-size: .74rem; }.financial-totals strong { color: #19466a; font-size: .83rem; }.next-installment { display: grid; gap: 5px; margin-top: 18px; padding: 20px; border-radius: 16px; color: #fff; background: linear-gradient(135deg, #0b609f, #0c9696); }.next-installment span { color: rgba(255,255,255,.77); font-size: .8rem; }.next-installment strong { font-size: 1.6rem; }.next-installment small { color: rgba(255,255,255,.84); }.installment-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 14px; color: #70879a; font-size: .8rem; }.no-installments { display: grid; justify-items: center; gap: 8px; padding: 22px 4px 4px; color: #73899b; text-align: center; }.no-installments i { color: #0b8a97; font-size: 2rem; }.no-installments p { margin: 0; color: #315772; font-weight: 700; }.no-installments small { font-size: .76rem; }
.installment-overview-card { padding: 24px; }.installment-status-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 17px; }.installment-status { display: grid; gap: 4px; padding: 12px 9px; border-radius: 13px; text-align: center; }.installment-status span { display: inline-flex; justify-content: center; align-items: center; gap: 4px; font-size: .73rem; font-weight: 700; }.installment-status strong { font-size: 1.35rem; }.installment-status small { font-size: .72rem; }.installment-status.paid { color: #168455; background: #e9f8ef; }.installment-status.remaining { color: #1472b9; background: #eaf4ff; }.installment-status.overdue { color: #c34a55; background: #fff0f1; }
.installment-overview-content { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr); align-items: center; gap: 20px; }.installment-chart-wrap { height: 205px; }.installment-overview-content .installment-status-grid { margin: 0; }.installment-view-link { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; border-radius: 9px; color: #0b70b9; background: #eef7fd; font-size: .8rem; font-weight: 700; text-decoration: none; }
.user-installments-card { padding: 24px; }.installment-count { padding: 7px 10px; border-radius: 999px; color: #286081; background: #edf6fc; font-size: .78rem; font-weight: 700; }.user-installments-table-wrap { margin-top: 20px; overflow-x: auto; }.user-installments-table { width: 100%; min-width: 780px; border-collapse: collapse; }.user-installments-table th { padding: 12px 10px; color: #71889a; border-bottom: 1px solid #dbe8f2; font-size: .78rem; text-align: right; }.user-installments-table td { padding: 15px 10px; color: #284b65; border-bottom: 1px solid #e8f0f5; font-size: .84rem; }.user-installments-table td strong, .user-installments-table td small { display: block; }.user-installments-table td small { margin-top: 4px; color: #8298a9; font-size: .72rem; }.paid-value { color: #168455 !important; }.remaining-value { color: #1472b9 !important; }.partial-payment-note { color: #b27810 !important; }
.live-notification-list { display: grid; gap: 14px; margin-top: 18px; }.live-notification-item { display: grid; grid-template-columns: 9px 1fr; gap: 10px; }.notification-status-dot { width: 8px; height: 8px; margin-top: 6px; border-radius: 50%; background: #e1a823; }.notification-status-dot.accepted { background: #1aab6c; }.notification-status-dot.rejected { background: #db4c5d; }.notification-status-dot.audit { background: #2072c9; }.notification-status-dot.returned { background: #cc8914; }.live-notification-item strong { color: #244563; font-size: .82rem; }.live-notification-item p { margin: 4px 0; color: #71879a; font-size: .74rem; line-height: 1.6; }.live-notification-item small { color: #98a8b5; font-size: .7rem; }.profile-shortcut-card { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 11px; padding: 15px 17px; }.profile-shortcut-avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; color: #0b6dbc; background: #e8f4ff; font-size: 1.2rem; }.profile-shortcut-card div { display: grid; gap: 3px; }.profile-shortcut-card strong { color: #244563; font-size: .85rem; }.profile-shortcut-card div span { color: #7e93a4; font-size: .75rem; }.profile-shortcut-card a { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 9px; color: #0a70b9; background: #f0f7fc; }.dashboard-empty-request { display: flex; align-items: center; gap: 18px; padding: 30px; }.dashboard-empty-request > span { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 18px; color: #0d789c; background: #e2f7f7; font-size: 1.8rem; }.dashboard-empty-request div { flex: 1; }.dashboard-empty-request h2 { margin: 0 0 5px; color: #1a425f; font-size: 1.2rem; }.dashboard-empty-request p { margin: 0; color: #74899b; font-size: .9rem; }
@media (max-width: 1100px) { .beneficiary-kpi-grid { grid-template-columns: repeat(2, 1fr); }.beneficiary-content-grid { grid-template-columns: 1fr; }.beneficiary-side-column { grid-template-columns: repeat(2, 1fr); }.live-notifications-card, .profile-shortcut-card { grid-column: span 2; } }
@media (max-width: 700px) { .topbar-inner-dashboard { width: calc(100% - 22px); gap: 8px; }.topbar-dashboard .brand-logo { width: 69px; height: 58px; }.topbar-dashboard .brand-system-name { font-size: .56rem; }.dashboard-menu-toggle { display:inline-flex; padding:0; width:42px; }.dashboard-menu-toggle span { display: none; }.dashboard-topnav { position:absolute; z-index:70; top:calc(100% - 4px); right:0; left:0; display:none; min-width:0; padding:9px; border:1px solid #d8e7f5; border-radius:17px; background:rgba(255,255,255,.98); box-shadow:0 18px 42px rgba(27,82,135,.17); }.dashboard-topnav.is-open { display:grid; animation:dashboard-menu-in .18s ease-out both; }.dashboard-topnav a { display:flex; gap:10px; padding:11px 12px; }.beneficiary-dashboard { width: min(100% - 22px, 560px); margin-top: 16px; gap: 14px; }.beneficiary-hero { align-items: flex-start; flex-direction: column; padding: 24px 20px; border-radius: 20px; }.hero-actions { width: 100%; }.hero-primary-action, .hero-secondary-action, .hero-support-action { flex: 1; }.beneficiary-kpi-grid, .beneficiary-side-column { grid-template-columns: 1fr; }.live-notifications-card, .profile-shortcut-card { grid-column: auto; }.request-focus-card, .recent-requests-card, .financial-summary-card, .installment-summary-card, .live-notifications-card { padding: 18px; }.request-focus-head { align-items: flex-start; flex-direction: column; }.request-focus-data { grid-template-columns: 1fr; }.request-focus-data div { border-left: 0; border-bottom: 1px solid #e2edf5; }.request-focus-data div:last-child { border-bottom: 0; }.request-stage-list { font-size: .63rem; }.request-action-note { grid-template-columns: auto 1fr; }.request-action-note a { grid-column: 1 / -1; text-align: center; }.recent-request-row { grid-template-columns: 38px minmax(0, 1fr) 14px; }.recent-request-amount, .recent-request-row .pill { grid-column: 2; }.recent-request-arrow { grid-column: 3; grid-row: 1 / span 2; }.dashboard-empty-request { align-items: flex-start; flex-wrap: wrap; padding: 22px; }.dashboard-empty-request .hero-primary-action { width: 100%; }.financial-chart-wrap { height: 190px; } }

@media (max-width: 760px) { .user-installments-summary { grid-template-columns:1fr; gap:11px; }.user-installments-total { padding:16px; } }
@media (max-width: 700px) { .installment-overview-content { grid-template-columns: 1fr; }.installment-chart-wrap { height: 200px; }.installment-view-link span { display: none; }.user-installments-card { padding: 18px; } }

.request-blocked-card { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 30px; }.request-blocked-icon { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 20px; color: #b9760c; background: #fff2d9; font-size: 1.9rem; }.request-blocked-card h2 { margin: .35rem 0 .5rem; color: #173f61; font-size: 1.45rem; }.request-blocked-card p { margin: 0; color: #667f94; line-height: 1.9; }.request-blocked-details { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }.request-blocked-details span { padding: 6px 9px; border-radius: 8px; color: #41617a; background: #f0f6fa; font-size: .77rem; font-weight: 700; }
@media (max-width: 700px) { .request-blocked-card { grid-template-columns: 1fr; padding: 22px; }.request-blocked-card .hero-primary-action { width: 100%; } }