/* UMOJA DS5 v6.1.0 — production convergence bundle. Legacy DS4 selectors are retained as internal compatibility aliases while screens migrate; no DS4 asset dependency remains. */
/* ---- migrated from ds4-core.css ---- */
/*
 * UMOJA Design System v4.0 — Sprint 1: Core Foundation
 * Loaded after global.css. Progressive enhancement only: legacy pages keep working.
 */
:root {
  --ds4-brand-50:#faf5fb; --ds4-brand-100:#f3e8f5; --ds4-brand-500:#81207f;
  --ds4-brand-600:#731f71; --ds4-brand-700:#5e185d; --ds4-brand-900:#351034;
  --ds4-neutral-0:#fff; --ds4-neutral-25:#fcfcfd; --ds4-neutral-50:#f7f8fa;
  --ds4-neutral-100:#eef0f4; --ds4-neutral-200:#dfe3e9; --ds4-neutral-300:#c8ced8;
  --ds4-neutral-500:#667085; --ds4-neutral-700:#344054; --ds4-neutral-900:#101828;
  --ds4-success:#087a55; --ds4-success-bg:#ecfdf3; --ds4-warning:#a15c00; --ds4-warning-bg:#fff8e6;
  --ds4-danger:#b42318; --ds4-danger-bg:#fff1f0; --ds4-info:#175cd3; --ds4-info-bg:#eff8ff;
  --ds4-space-1:.25rem; --ds4-space-2:.5rem; --ds4-space-3:.75rem; --ds4-space-4:1rem;
  --ds4-space-5:1.25rem; --ds4-space-6:1.5rem; --ds4-space-8:2rem; --ds4-space-10:2.5rem;
  --ds4-radius-sm:.5rem; --ds4-radius-md:.75rem; --ds4-radius-lg:1rem; --ds4-radius-xl:1.25rem; --ds4-radius-pill:999px;
  --ds4-shadow-sm:0 1px 2px rgba(16,24,40,.05); --ds4-shadow-md:0 8px 24px rgba(16,24,40,.08);
  --ds4-font:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ds4-text-xs:.75rem; --ds4-text-sm:.875rem; --ds4-text-md:1rem; --ds4-text-lg:1.125rem;
  --ds4-text-xl:1.25rem; --ds4-text-2xl:1.5rem; --ds4-text-3xl:1.875rem;
  --ds4-control-h:44px; --ds4-content-max:1480px; --ds4-focus:0 0 0 3px rgba(115,31,113,.18);
}
html { font-family:var(--ds4-font); text-rendering:optimizeLegibility; }
body { color:var(--ds4-neutral-900); }
:where(.admin-portal-page,.portal-page) :where(button,a,input,select,textarea):focus-visible { outline:none; box-shadow:var(--ds4-focus); }
:where(.admin-portal-page,.portal-page) main { min-width:0; }
:where(.admin-portal-page,.portal-page) .page-content,
:where(.admin-portal-page,.portal-page) .content-inner,
:where(.admin-portal-page,.portal-page) .admin-main-inner { width:min(100%,var(--ds4-content-max)); margin-inline:auto; }

/* Type */
.ds4-eyebrow,.eyebrow { font-size:var(--ds4-text-xs); font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--ds4-brand-600); }
.ds4-page-title { margin:0; font-size:clamp(1.75rem,2.4vw,2.5rem); line-height:1.12; letter-spacing:-.035em; }
.ds4-section-title { margin:0; font-size:var(--ds4-text-xl); line-height:1.3; letter-spacing:-.015em; }
.ds4-muted,.muted { color:var(--ds4-neutral-500); }

/* Page shell/header */
.ds4-page { display:grid; gap:var(--ds4-space-6); min-width:0; }
.ds4-page-header,.ds-page-hero { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--ds4-space-6); margin:0 0 var(--ds4-space-6); }
.ds4-page-header__copy,.ds-page-hero>div:first-child { min-width:0; max-width:760px; }
.ds4-page-header__description,.ds-page-hero .muted { margin:.5rem 0 0; max-width:68ch; }
.ds4-page-header__actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:var(--ds4-space-2); }

/* Surface/card */
.ds4-card,.ds-card { min-width:0; border:1px solid var(--ds4-neutral-200); border-radius:var(--ds4-radius-lg); background:var(--ds4-neutral-0); box-shadow:var(--ds4-shadow-sm); }
.ds4-card__header { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--ds4-space-4); padding:var(--ds4-space-5) var(--ds4-space-6); border-bottom:1px solid var(--ds4-neutral-100); }
.ds4-card__body { padding:var(--ds4-space-6); }
.ds4-card__footer { display:flex; justify-content:flex-end; gap:var(--ds4-space-2); padding:var(--ds4-space-4) var(--ds4-space-6); border-top:1px solid var(--ds4-neutral-100); background:var(--ds4-neutral-25); border-radius:0 0 var(--ds4-radius-lg) var(--ds4-radius-lg); }
.ds4-card--flat { box-shadow:none; }
.ds4-card--compact .ds4-card__header,.ds4-card--compact .ds4-card__body { padding:var(--ds4-space-4); }

/* Buttons */
.ds4-btn { min-height:var(--ds4-control-h); display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.625rem 1rem; border:1px solid transparent; border-radius:var(--ds4-radius-md); font:inherit; font-size:var(--ds4-text-sm); font-weight:750; line-height:1; text-decoration:none; white-space:nowrap; cursor:pointer; transition:background .16s,border-color .16s,transform .16s; }
.ds4-btn:hover { transform:translateY(-1px); }
.ds4-btn:active { transform:none; }
.ds4-btn--primary { background:var(--ds4-brand-600); color:#fff; }
.ds4-btn--primary:hover { background:var(--ds4-brand-700); color:#fff; }
.ds4-btn--secondary { border-color:var(--ds4-neutral-300); background:#fff; color:var(--ds4-neutral-700); }
.ds4-btn--secondary:hover { background:var(--ds4-neutral-50); color:var(--ds4-neutral-900); }
.ds4-btn--danger { background:var(--ds4-danger); color:#fff; }
.ds4-btn--ghost { background:transparent; color:var(--ds4-neutral-700); }
.ds4-btn--sm { min-height:36px; padding:.45rem .75rem; }
.ds4-icon-btn { width:40px; height:40px; display:inline-grid; place-items:center; flex:0 0 40px; padding:0; border:1px solid var(--ds4-neutral-300); border-radius:var(--ds4-radius-md); background:#fff; color:var(--ds4-neutral-700); cursor:pointer; }
.ds4-icon-btn:hover { background:var(--ds4-neutral-50); color:var(--ds4-brand-700); }
.ds4-icon-btn[disabled],.ds4-btn[disabled] { opacity:.55; cursor:not-allowed; transform:none; }

/* Forms */
.ds4-form { display:grid; gap:var(--ds4-space-5); }
.ds4-form-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:var(--ds4-space-4); }
.ds4-col-12{grid-column:span 12}.ds4-col-8{grid-column:span 8}.ds4-col-6{grid-column:span 6}.ds4-col-4{grid-column:span 4}.ds4-col-3{grid-column:span 3}
.ds4-field { display:grid; align-content:start; gap:.45rem; min-width:0; }
.ds4-label { color:var(--ds4-neutral-700); font-size:var(--ds4-text-sm); font-weight:700; }
.ds4-required { color:var(--ds4-danger); }
.ds4-input,.ds4-select,.ds4-textarea { width:100%; min-height:var(--ds4-control-h); border:1px solid var(--ds4-neutral-300); border-radius:var(--ds4-radius-md); background:#fff; color:var(--ds4-neutral-900); font:inherit; font-size:var(--ds4-text-sm); }
.ds4-input,.ds4-select { padding:0 .875rem; }
.ds4-textarea { min-height:112px; padding:.75rem .875rem; resize:vertical; }
.ds4-input:hover,.ds4-select:hover,.ds4-textarea:hover { border-color:#98a2b3; }
.ds4-input:focus,.ds4-select:focus,.ds4-textarea:focus { border-color:var(--ds4-brand-500); outline:none; box-shadow:var(--ds4-focus); }
.ds4-help,.ds4-error { margin:0; font-size:var(--ds4-text-xs); }
.ds4-help { color:var(--ds4-neutral-500); }.ds4-error { color:var(--ds4-danger); }
.ds4-field.has-error :where(.ds4-input,.ds4-select,.ds4-textarea) { border-color:var(--ds4-danger); }
.ds4-form-actions { position:sticky; bottom:0; z-index:5; display:flex; justify-content:flex-end; gap:var(--ds4-space-2); padding:var(--ds4-space-4); border-top:1px solid var(--ds4-neutral-200); background:rgba(255,255,255,.94); backdrop-filter:blur(10px); }

/* Alerts/status */
.ds4-alert { display:flex; align-items:flex-start; gap:.75rem; padding:var(--ds4-space-4); border:1px solid; border-radius:var(--ds4-radius-md); font-size:var(--ds4-text-sm); }
.ds4-alert--success{color:var(--ds4-success);background:var(--ds4-success-bg);border-color:#abefc6}.ds4-alert--warning{color:var(--ds4-warning);background:var(--ds4-warning-bg);border-color:#fedf89}.ds4-alert--danger{color:var(--ds4-danger);background:var(--ds4-danger-bg);border-color:#fecdca}.ds4-alert--info{color:var(--ds4-info);background:var(--ds4-info-bg);border-color:#b2ddff}
.ds4-badge,.ds-status { display:inline-flex; align-items:center; min-height:26px; padding:.25rem .625rem; border-radius:var(--ds4-radius-pill); background:var(--ds4-neutral-100); color:var(--ds4-neutral-700); font-size:var(--ds4-text-xs); font-weight:750; white-space:nowrap; }
.ds4-badge--success,.ds-status.is-approved,.ds-status.is-completed,.ds-status.is-active,.ds-status.is-paid,.ds-status.is-read { background:var(--ds4-success-bg);color:var(--ds4-success); }
.ds4-badge--warning,.ds-status.is-pending,.ds-status.is-awaiting,.ds-status.is-unread { background:var(--ds4-warning-bg);color:var(--ds4-warning); }
.ds4-badge--danger,.ds-status.is-rejected,.ds-status.is-failed,.ds-status.is-cancelled { background:var(--ds4-danger-bg);color:var(--ds4-danger); }
.ds4-badge--info,.ds-status.is-processing { background:var(--ds4-info-bg);color:var(--ds4-info); }

/* Stats/grids */
.ds4-grid { display:grid; gap:var(--ds4-space-4); min-width:0; }
.ds4-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds4-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds4-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ds4-stat-strip,.ds-stat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:var(--ds4-space-3); }
.ds4-stat,.ds-stat-card { min-width:0; padding:var(--ds4-space-4); border:1px solid var(--ds4-neutral-200); border-radius:var(--ds4-radius-md); background:#fff; }
.ds4-stat__label,.ds-stat-card>span { display:flex; align-items:center; gap:.4rem; color:var(--ds4-neutral-500); font-size:var(--ds4-text-xs); font-weight:700; }
.ds4-stat__value,.ds-stat-card>strong { display:block; margin-top:.35rem; font-size:clamp(1.25rem,2vw,1.65rem); line-height:1.15; }

/* Toolbar/table */
.ds4-toolbar,.ds-action-bar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--ds4-space-3); min-width:0; }
.ds4-toolbar__group,.ds-action-bar-actions { display:flex; align-items:center; flex-wrap:wrap; gap:var(--ds4-space-2); }
.ds4-search { position:relative; flex:1 1 240px; max-width:460px; }
.ds4-search .ds4-input { padding-left:2.5rem; }.ds4-search__icon { position:absolute; left:.85rem; top:50%; transform:translateY(-50%); pointer-events:none; color:var(--ds4-neutral-500); }
.ds4-table-wrap,.ds-table-wrap { width:100%; overflow:auto; border:1px solid var(--ds4-neutral-200); border-radius:var(--ds4-radius-lg); background:#fff; }
.ds4-table,.ds-table { width:100%; border-collapse:separate; border-spacing:0; font-size:var(--ds4-text-sm); }
.ds4-table th,.ds4-table td,.ds-table th,.ds-table td { padding:.8rem 1rem; text-align:left; vertical-align:middle; border-bottom:1px solid var(--ds4-neutral-100); }
.ds4-table th,.ds-table th { position:sticky; top:0; z-index:1; background:var(--ds4-neutral-50); color:var(--ds4-neutral-500); font-size:var(--ds4-text-xs); letter-spacing:.025em; text-transform:uppercase; }
.ds4-table tbody tr:hover,.ds-table tbody tr:hover { background:var(--ds4-neutral-25); }
.ds4-table tr:last-child td,.ds-table tr:last-child td { border-bottom:0; }
.ds4-actions { display:inline-flex; align-items:center; gap:.375rem; white-space:nowrap; }

/* Disclosure / reduced clutter */
.ds4-disclosure { border:1px solid var(--ds4-neutral-200); border-radius:var(--ds4-radius-md); background:#fff; }
.ds4-disclosure>summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:var(--ds4-space-4); cursor:pointer; font-weight:750; list-style:none; }
.ds4-disclosure>summary::-webkit-details-marker{display:none}.ds4-disclosure>summary::after{content:"⌄";transition:transform .2s}.ds4-disclosure[open]>summary::after{transform:rotate(180deg)}
.ds4-disclosure__body { padding:0 var(--ds4-space-4) var(--ds4-space-4); }
.ds4-empty,.ds-empty { display:grid; place-items:center; gap:.5rem; min-height:180px; padding:var(--ds4-space-8); text-align:center; color:var(--ds4-neutral-500); }
.ds4-sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
[data-ds4-tooltip] { position:relative; }

@media (max-width:1023px){
  .ds4-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}.ds4-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ds4-col-8,.ds4-col-6,.ds4-col-4,.ds4-col-3{grid-column:span 6}
}
@media (max-width:767px){
  :root{--ds4-control-h:46px}
  .ds4-page,.ds4-grid{gap:var(--ds4-space-4)}
  .ds4-page-header,.ds-page-hero{display:grid;gap:var(--ds4-space-4);margin-bottom:var(--ds4-space-4)}
  .ds4-page-header__actions,.ds4-page-hero>.ds-action-bar{justify-content:flex-start;width:100%}
  .ds4-card__header,.ds4-card__body{padding:var(--ds4-space-4)}
  .ds4-grid--2,.ds4-grid--3,.ds4-grid--4{grid-template-columns:1fr}
  .ds4-col-8,.ds4-col-6,.ds4-col-4,.ds4-col-3{grid-column:span 12}
  .ds4-stat-strip,.ds-stat-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.25rem;scrollbar-width:thin}
  .ds4-stat,.ds-stat-card{flex:0 0 min(72vw,220px);scroll-snap-align:start}
  .ds4-toolbar{align-items:stretch}.ds4-toolbar__group{width:100%}.ds4-search{max-width:none;flex-basis:100%}
  .ds4-btn[data-ds4-mobile-icon] .ds4-btn__label{display:none}.ds4-btn[data-ds4-mobile-icon]{width:44px;padding:0}
  .ds4-form-actions{margin-inline:calc(var(--ds4-space-4)*-1);padding-bottom:max(var(--ds4-space-4),env(safe-area-inset-bottom))}
  .ds4-table-wrap[data-ds4-mobile-cards] { border:0; overflow:visible; background:transparent; }
  .ds4-table-wrap[data-ds4-mobile-cards] table,.ds4-table-wrap[data-ds4-mobile-cards] thead { display:block; }
  .ds4-table-wrap[data-ds4-mobile-cards] thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .ds4-table-wrap[data-ds4-mobile-cards] tbody,.ds4-table-wrap[data-ds4-mobile-cards] tr,.ds4-table-wrap[data-ds4-mobile-cards] td { display:block; width:100%; }
  .ds4-table-wrap[data-ds4-mobile-cards] tbody { display:grid; gap:var(--ds4-space-3); }
  .ds4-table-wrap[data-ds4-mobile-cards] tr { padding:var(--ds4-space-4); border:1px solid var(--ds4-neutral-200); border-radius:var(--ds4-radius-lg); background:#fff; box-shadow:var(--ds4-shadow-sm); }
  .ds4-table-wrap[data-ds4-mobile-cards] td { display:grid; grid-template-columns:minmax(90px,38%) 1fr; gap:.75rem; padding:.45rem 0; border:0; }
  .ds4-table-wrap[data-ds4-mobile-cards] td::before { content:attr(data-label); color:var(--ds4-neutral-500); font-size:var(--ds4-text-xs); font-weight:750; }
  .ds4-table-wrap[data-ds4-mobile-cards] td:last-child { display:flex; justify-content:flex-end; padding-top:.75rem; border-top:1px solid var(--ds4-neutral-100); }
  [data-ds4-hide-mobile]{display:none!important}
}
@media (hover:hover) and (pointer:fine){
 [data-ds4-tooltip]:hover::after,[data-ds4-tooltip]:focus-visible::after{content:attr(data-ds4-tooltip);position:absolute;z-index:1000;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);padding:.4rem .55rem;border-radius:.4rem;background:var(--ds4-neutral-900);color:#fff;font-size:.72rem;font-weight:600;white-space:nowrap;box-shadow:var(--ds4-shadow-md);pointer-events:none}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}



/* DS4 financial value protection
 * Currency and other large numeric values should never be hidden behind an
 * ellipsis. JS progressively scales only values that genuinely need it.
 */
.ds4-financial-value,
[data-ds4-financial-value],
.ds4-stat__value,
.ds-stat-card > strong {
  min-width: 0;
  max-width: 100%;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.025em;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

.ds4-financial-value,
[data-ds4-financial-value] {
  display: block;
  width: 100%;
  line-height: 1.12;
}

/* Preserve readable financial values on two-column mobile cards. */
@media (max-width: 760px) {
  .ds4-financial-value,
  [data-ds4-financial-value],
  .ds4-stat__value,
  .ds-stat-card > strong {
    font-size: clamp(.82rem, 4vw, 1.2rem);
  }
}

/* ---- migrated from ds4-navigation.css ---- */
/* UMOJA Design System v4.0 — Sprint 2 Navigation */
:root {
    --ds4-nav-height: 68px;
    --ds4-mobile-nav-height: 68px;
    --ds4-nav-z: 900;
}

.ds4-enabled .portal-header,
.ds4-enabled .admin-topbar {
    backdrop-filter: saturate(140%) blur(12px);
    -webkit-backdrop-filter: saturate(140%) blur(12px);
}

.ds4-enabled .portal-header {
    min-height: var(--ds4-nav-height);
    position: sticky;
    top: 0;
    z-index: var(--ds4-nav-z);
    border-bottom: 1px solid var(--ds4-border, #e6e9ef);
}

.ds4-enabled .client-quick-action,
.ds4-enabled .admin-side-link {
    transition: background-color .15s ease, color .15s ease, transform .15s ease;
}

.ds4-enabled .client-quick-action:focus-visible,
.ds4-enabled .admin-side-link:focus-visible,
.ds4-mobile-nav__item:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ds4-primary, #6f2a78) 28%, transparent);
    outline-offset: 2px;
}

.ds4-enabled .client-quick-action.is-active {
    position: relative;
}

.ds4-enabled .client-quick-action.is-active::after {
    content: "";
    position: absolute;
    left: 22%;
    right: 22%;
    bottom: -1px;
    height: 3px;
    border-radius: 999px 999px 0 0;
    background: var(--ds4-primary, #6f2a78);
}

.ds4-breadcrumbs {
    width: min(100%, var(--ds4-content-max, 1480px));
    margin: 0 auto var(--ds4-space-3, 12px);
    padding-inline: var(--ds4-space-1, 4px);
    color: var(--ds4-text-muted, #667085);
    font-size: .82rem;
}

.ds4-breadcrumbs ol {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    white-space: nowrap;
}

.ds4-breadcrumbs li { display: inline-flex; align-items: center; min-width: 0; }
.ds4-breadcrumbs a { color: inherit; text-decoration: none; }
.ds4-breadcrumbs a:hover { color: var(--ds4-primary, #6f2a78); }
.ds4-breadcrumbs li:last-child span { max-width: 260px; overflow: hidden; text-overflow: ellipsis; color: var(--ds4-text, #171a21); font-weight: 650; }
.ds4-breadcrumbs__separator { margin-inline: 2px; opacity: .55; }

.ds4-action-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ds4-space-4, 16px);
    margin-bottom: var(--ds4-space-5, 20px);
}
.ds4-action-toolbar__title { font-size: 1rem; }
.ds4-action-toolbar__actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.ds4-nav-search { min-width: 220px; min-height: 42px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid var(--ds4-border, #e6e9ef); border-radius: var(--ds4-radius-md, 12px); background: #fff; }
.ds4-nav-search input { width: 100%; border: 0; outline: 0; background: transparent; font: inherit; }

.ds4-mobile-nav {
    display: none;
    position: fixed;
    inset: auto 0 0 0;
    z-index: 980;
    min-height: calc(var(--ds4-mobile-nav-height) + env(safe-area-inset-bottom));
    padding: 7px max(8px, env(safe-area-inset-right)) max(7px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
    grid-template-columns: repeat(5, minmax(0, 1fr));
    border-top: 1px solid var(--ds4-border, #e6e9ef);
    background: rgba(255,255,255,.96);
    box-shadow: 0 -10px 26px rgba(20, 24, 34, .08);
    backdrop-filter: blur(14px);
}

.ds4-mobile-nav__item {
    min-width: 0;
    min-height: 52px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 4px 2px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--ds4-text-muted, #667085);
    text-decoration: none;
    font: inherit;
    cursor: pointer;
}
.ds4-mobile-nav__item.is-active { color: var(--ds4-primary, #6f2a78); background: color-mix(in srgb, var(--ds4-primary, #6f2a78) 8%, white); }
.ds4-mobile-nav__icon { position: relative; display: grid; place-items: center; font-size: 1.3rem; line-height: 1; }
.ds4-mobile-nav__label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; font-size: .68rem; font-weight: 680; white-space: nowrap; }
.ds4-mobile-nav__badge { position: absolute; top: -7px; right: -10px; min-width: 17px; height: 17px; display: grid; place-items: center; padding: 0 4px; border: 2px solid #fff; border-radius: 999px; background: var(--ds4-danger, #c93f50); color: #fff; font-size: .58rem; font-weight: 800; }

.ds4-enabled .admin-side-dropdown-title,
.ds4-enabled .admin-side-link { min-height: 44px; }
.ds4-enabled .admin-side-link.is-active { box-shadow: inset 3px 0 0 var(--admin-accent, var(--ds4-primary, #6f2a78)); }

@media (max-width: 767.98px) {
    .ds4-mobile-nav { display: grid; }
    .ds4-enabled { padding-bottom: calc(var(--ds4-mobile-nav-height) + env(safe-area-inset-bottom)); }
    .ds4-enabled .portal-footer { padding-bottom: 12px; }
    .ds4-enabled .client-main-nav { display: none !important; }
    .ds4-enabled .portal-header { min-height: 60px; padding-block: 8px; }
    .ds4-breadcrumbs { display: none; }
    .ds4-action-toolbar { align-items: stretch; }
    .ds4-action-toolbar__title { display: none; }
    .ds4-action-toolbar__actions { width: 100%; }
    .ds4-nav-search { min-width: 0; flex: 1; }
    .ds4-btn--icon-mobile span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .ds4-btn--icon-mobile { width: 42px; padding-inline: 0; }
}

@media (min-width: 768px) and (max-width: 1100px) {
    .ds4-enabled .client-quick-action span { font-size: .78rem; }
    .ds4-enabled .portal-header { padding-inline: 18px; }
}

@media (prefers-reduced-motion: reduce) {
    .ds4-enabled .client-quick-action,
    .ds4-enabled .admin-side-link { transition: none; }
}

/* ---- migrated from ds4-layout.css ---- */
/* UMOJA Design System v4.0 — Pack 1 Shared Layouts */

:root {
    --ds4-shell-max: 1480px;
    --ds4-shell-gutter: clamp(16px, 2.2vw, 32px);
    --ds4-shell-block-gap: clamp(18px, 2vw, 28px);
    --ds4-footer-height: 58px;
}

.ds4-enabled {
    min-height: 100dvh;
}

.ds4-skip-link {
    position: fixed;
    inset: 12px auto auto 12px;
    z-index: 10000;
    padding: 10px 14px;
    border-radius: 10px;
    background: #171a21;
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transform: translateY(-180%);
    transition: transform .18s ease;
}

.ds4-skip-link:focus {
    transform: translateY(0);
}

/* Consistent content shell across Member, Client and Agent. */
.ds4-enabled:not(.admin-page) .portal-main {
    width: min(calc(100% - (var(--ds4-shell-gutter) * 2)), var(--ds4-shell-max));
    min-width: 0;
    min-height: calc(100dvh - 150px);
    margin-inline: auto;
    padding-block: var(--ds4-shell-block-gap) 42px;
}

.ds4-enabled .portal-main > * {
    min-width: 0;
}

.admin-page.ds4-enabled .admin-content {
    min-width: 0;
}

.ds4-app-footer {
    min-height: var(--ds4-footer-height);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px var(--ds4-shell-gutter);
    border-top: 1px solid rgba(17, 24, 39, .08);
    color: #667085;
    background: rgba(255, 255, 255, .82);
}

.ds4-app-footer p {
    margin: 0;
    text-align: center;
    font-size: 12px;
    line-height: 1.5;
}

/* Keep content clear of DS4 bottom navigation on compact screens. */
@media (max-width: 767px) {
    .ds4-enabled:not(.admin-page) .portal-main {
        width: 100%;
        padding: 16px 14px calc(104px + env(safe-area-inset-bottom));
    }

    .ds4-enabled .ds4-app-footer {
        padding-bottom: calc(82px + env(safe-area-inset-bottom));
    }

    .ds4-enabled .ds4-breadcrumbs {
        margin-bottom: 14px;
    }
}

@media (min-width: 768px) and (max-width: 1100px) {
    .ds4-enabled:not(.admin-page) .portal-main {
        width: 100%;
        padding-inline: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ds4-skip-link { transition: none; }
}

/* ---- migrated from ds4-components.css ---- */
/* UMOJA DS4 shared components — Sprint 4 / Pack 1 */
.ds4-summary-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--ds4-space-3,12px);margin:0 0 var(--ds4-space-5,24px)}
.ds4-summary-item{position:relative;display:flex;align-items:center;gap:12px;min-width:0;padding:14px 16px;border:1px solid var(--ds4-border,#e5e7eb);border-radius:var(--ds4-radius-lg,14px);background:var(--ds4-surface,#fff);color:inherit;text-decoration:none;box-shadow:var(--ds4-shadow-sm,0 1px 2px rgba(0,0,0,.04))}
.ds4-summary-item[href]:hover{border-color:color-mix(in srgb,var(--ds4-primary,#731f71) 35%,var(--ds4-border,#e5e7eb));transform:translateY(-1px)}
.ds4-summary-item__icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:12px;background:var(--ds4-surface-muted,#f6f7f9);font-size:20px;color:var(--ds4-primary,#731f71)}
.ds4-summary-item__copy{display:grid;min-width:0;gap:2px}.ds4-summary-item__label{font-size:12px;color:var(--ds4-text-muted,#6b7280)}.ds4-summary-item__value{font-size:18px;line-height:1.15}.ds4-summary-item small{font-size:11px;color:var(--ds4-text-muted,#6b7280)}.ds4-summary-item__arrow{margin-left:auto;color:var(--ds4-text-muted,#6b7280)}
.ds4-info-card{border:1px solid var(--ds4-border,#e5e7eb);border-radius:var(--ds4-radius-lg,14px);background:var(--ds4-surface,#fff);overflow:hidden}.ds4-info-card__header{display:flex;align-items:center;gap:12px;padding:18px 20px 10px}.ds4-info-card__icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--ds4-surface-muted,#f6f7f9);color:var(--ds4-primary,#731f71);font-size:21px}.ds4-info-card__body{padding:10px 20px 18px}.ds4-info-card__footer{padding:12px 20px;border-top:1px solid var(--ds4-border,#e5e7eb);background:var(--ds4-surface-muted,#fafafa)}
.ds4-action-card{display:flex;align-items:center;gap:12px;padding:13px 14px;border:1px solid var(--ds4-border,#e5e7eb);border-radius:12px;text-decoration:none;color:inherit;background:var(--ds4-surface,#fff)}.ds4-action-card:hover{border-color:color-mix(in srgb,var(--ds4-primary,#731f71) 35%,var(--ds4-border,#e5e7eb))}.ds4-action-card__icon{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--ds4-surface-muted,#f6f7f9);color:var(--ds4-primary,#731f71);font-size:19px}.ds4-action-card__copy{display:grid;gap:2px;min-width:0}.ds4-action-card__copy small{color:var(--ds4-text-muted,#6b7280);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds4-action-card__arrow{margin-left:auto}.ds4-action-card__badge{margin-left:auto;min-width:22px;height:22px;padding:0 7px;border-radius:999px;display:grid;place-items:center;background:var(--ds4-primary,#731f71);color:#fff;font-size:11px;font-weight:700}
.ds4-timeline{display:grid}.ds4-timeline__item{position:relative;display:grid;grid-template-columns:34px 1fr;gap:10px;padding:0 0 18px}.ds4-timeline__item:not(:last-child)::before{content:"";position:absolute;left:16px;top:30px;bottom:0;width:1px;background:var(--ds4-border,#e5e7eb)}.ds4-timeline__marker{z-index:1;display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--ds4-border,#e5e7eb);border-radius:50%;background:var(--ds4-surface,#fff);color:var(--ds4-primary,#731f71)}.ds4-timeline__head{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.ds4-timeline__head time{font-size:11px;color:var(--ds4-text-muted,#6b7280);white-space:nowrap}.ds4-timeline__content p{margin:4px 0;color:var(--ds4-text,#374151);font-size:14px}.ds4-timeline__content small{color:var(--ds4-text-muted,#6b7280)}.ds4-timeline__empty{display:flex;align-items:center;gap:8px;color:var(--ds4-text-muted,#6b7280);padding:16px 0}
.ds4-skeleton{display:grid;gap:10px}.ds4-skeleton__row{display:grid;grid-template-columns:42px 1fr 20%;gap:10px;align-items:center}.ds4-skeleton__row>*{display:block;height:14px;border-radius:7px;background:linear-gradient(90deg,#eef0f3 25%,#f7f8fa 37%,#eef0f3 63%);background-size:400% 100%;animation:ds4Shimmer 1.4s ease infinite}.ds4-skeleton__row i{height:34px;border-radius:10px}.ds4-skeleton__row em{height:10px}@keyframes ds4Shimmer{0%{background-position:100% 0}100%{background-position:0 0}}@media(prefers-reduced-motion:reduce){.ds4-skeleton__row>*{animation:none}}
.ds4-detail-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-top:1px solid var(--ds4-border,#e5e7eb);border-left:1px solid var(--ds4-border,#e5e7eb);border-radius:12px;overflow:hidden}.ds4-detail-list--1{grid-template-columns:1fr}.ds4-detail-list--3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds4-detail-list__item{padding:13px 15px;border-right:1px solid var(--ds4-border,#e5e7eb);border-bottom:1px solid var(--ds4-border,#e5e7eb);min-width:0}.ds4-detail-list dt{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ds4-text-muted,#6b7280);font-weight:700}.ds4-detail-list dd{margin:4px 0 0;font-weight:600;word-break:break-word}.ds4-detail-list small{display:block;margin-top:3px;color:var(--ds4-text-muted,#6b7280)}
.ds4-filter-panel{border:1px solid var(--ds4-border,#e5e7eb);border-radius:12px;background:var(--ds4-surface,#fff);margin-bottom:16px}.ds4-filter-panel>summary{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;cursor:pointer;font-weight:700;list-style:none}.ds4-filter-panel>summary::-webkit-details-marker{display:none}.ds4-filter-panel>summary span{display:flex;align-items:center;gap:8px}.ds4-filter-panel__chevron{transition:transform .16s ease}.ds4-filter-panel[open] .ds4-filter-panel__chevron{transform:rotate(180deg)}.ds4-filter-panel__body{padding:15px;border-top:1px solid var(--ds4-border,#e5e7eb)}.ds4-filter-panel__actions{display:flex;justify-content:flex-end;gap:8px;padding:0 15px 15px}
.ds4-tabs{display:flex;gap:4px;overflow-x:auto;padding:3px;border-bottom:1px solid var(--ds4-border,#e5e7eb);scrollbar-width:none}.ds4-tabs::-webkit-scrollbar{display:none}.ds4-tab{display:flex;align-items:center;gap:7px;min-height:40px;padding:8px 12px;border-radius:9px 9px 0 0;color:var(--ds4-text-muted,#6b7280);text-decoration:none;white-space:nowrap;font-weight:600;font-size:14px}.ds4-tab:hover{background:var(--ds4-surface-muted,#f6f7f9);color:var(--ds4-text,#1f2937)}.ds4-tab.is-active{color:var(--ds4-primary,#731f71);background:color-mix(in srgb,var(--ds4-primary,#731f71) 8%,white);box-shadow:inset 0 -2px var(--ds4-primary,#731f71)}.ds4-tab small{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--ds4-surface-muted,#eef0f3);font-size:10px}
.ds4-data-table-wrap{width:100%;overflow:auto;border:1px solid var(--ds4-border,#e5e7eb);border-radius:12px;background:#fff}.ds4-data-table{width:100%;border-collapse:collapse}.ds4-data-table th{padding:10px 13px;background:var(--ds4-surface-muted,#f7f8fa);text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ds4-text-muted,#6b7280);white-space:nowrap}.ds4-data-table td{padding:12px 13px;border-top:1px solid var(--ds4-border,#e5e7eb);vertical-align:middle}.ds4-data-table tbody tr:hover{background:#fcfcfd}.ds4-data-table__empty{border:0}.ds4-mobile-hide{display:table-cell}
.ds4-modal{padding:0;border:0;border-radius:16px;max-width:min(92vw,430px);box-shadow:0 24px 64px rgba(0,0,0,.2)}.ds4-modal::backdrop{background:rgba(17,24,39,.45);backdrop-filter:blur(2px)}.ds4-modal__panel{display:grid;grid-template-columns:44px 1fr;gap:14px;padding:22px;margin:0}.ds4-modal__icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;font-size:22px;background:#fff4f4;color:#b42318}.ds4-modal__icon--primary{background:#f5ecf5;color:var(--ds4-primary,#731f71)}.ds4-modal__copy h2{margin:0 0 6px;font-size:18px}.ds4-modal__copy p{margin:0;color:var(--ds4-text-muted,#6b7280)}.ds4-modal__actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin-top:8px}
@media(max-width:767px){.ds4-summary-strip{display:flex;overflow-x:auto;gap:10px;margin-inline:-4px;padding:2px 4px 8px;scroll-snap-type:x proximity;scrollbar-width:none}.ds4-summary-strip::-webkit-scrollbar{display:none}.ds4-summary-item{min-width:155px;padding:11px 12px;scroll-snap-align:start}.ds4-summary-item__icon{width:34px;height:34px;flex-basis:34px}.ds4-summary-item__value{font-size:16px}.ds4-summary-item small,.ds4-summary-item__arrow{display:none}.ds4-detail-list,.ds4-detail-list--3{grid-template-columns:1fr}.ds4-data-table-wrap{border:0;overflow:visible;background:transparent}.ds4-data-table,.ds4-data-table tbody{display:block}.ds4-data-table thead{display:none}.ds4-data-table tr{display:grid;margin-bottom:10px;padding:8px 12px;border:1px solid var(--ds4-border,#e5e7eb);border-radius:12px;background:#fff}.ds4-data-table td{display:grid;grid-template-columns:minmax(88px,36%) 1fr;gap:10px;padding:7px 0;border:0;border-bottom:1px solid #f0f1f3}.ds4-data-table td:last-child{border-bottom:0}.ds4-data-table td::before{content:attr(data-label);font-size:11px;font-weight:700;color:var(--ds4-text-muted,#6b7280)}.ds4-data-table .ds4-mobile-hide{display:none}.ds4-filter-panel__body{padding:12px}.ds4-tab{padding-inline:10px}.ds4-timeline__head{align-items:flex-start;flex-direction:column;gap:2px}.ds4-modal__panel{padding:18px}.ds4-modal__actions{display:grid;grid-template-columns:1fr 1fr}.ds4-modal__actions .ds4-btn{justify-content:center}}


/* Financial values in reusable summary strips */
.ds4-summary-item__copy{min-width:0}
.ds4-summary-item__value.ds4-financial-value{max-width:100%;overflow:visible;text-overflow:clip;white-space:nowrap;font-variant-numeric:tabular-nums}

/* ---- migrated from ds4-finance-modules.css ---- */
/* UMOJA DS4 Pack 2 — Loans & Transfers
   Module migration layer. Keeps existing business markup intact while
   standardising density, responsive behaviour and interaction patterns. */

.ds4-module {
  --ds4-module-gap: var(--ds4-space-5, 1.25rem);
  --ds4-module-muted: var(--ds4-text-muted, #667085);
  --ds4-module-border: var(--ds4-border, #e4e7ec);
  --ds4-module-surface: var(--ds4-surface, #fff);
  width: min(100%, 1450px);
  margin-inline: auto;
  display: grid;
  gap: var(--ds4-module-gap);
}

.ds4-module :where(h1,h2,h3,p) { margin-top: 0; }
.ds4-module :where(h1) { font-size: clamp(1.55rem, 2.2vw, 2rem); line-height: 1.15; }
.ds4-module :where(h2) { font-size: clamp(1.05rem, 1.7vw, 1.25rem); line-height: 1.25; }
.ds4-module .eyebrow { margin-bottom: .35rem; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ds4-module .muted { color: var(--ds4-module-muted); }

/* Standardise legacy hero/page headers without requiring a full template rewrite. */
.ds4-module :where(
  .loan-v4__hero,
  .membership-head,
  .transfer-centre__hero,
  .transfer-show-v3__hero,
  .admin-requests__head,
  .loan-detail-v3__hero,
  .admin-transfers-v3__hero,
  .admin-transfer-detail-v3__hero,
  .agent-transfer-create-v3__hero,
  .agent-payment-confirm-v3__hero
) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 0;
  margin: 0 0 .25rem;
  background: transparent;
  border: 0;
  box-shadow: none;
}

/* Shared surface treatment. Deliberately broad enough to tame legacy cards. */
.ds4-module :where(
  .loan-v4__active-card,
  .loan-v4__policy,
  .request-card,
  .transfer-card,
  .transfer-summary-card,
  .transfer-show-v3__card,
  .loan-detail-v3__card,
  .admin-transfer-card,
  .agent-transfer-owner-card,
  .agent-transfer-step-card,
  .agent-payment-confirm-v3__reference,
  .agent-payment-confirm-v3__card
) {
  border: 1px solid var(--ds4-module-border);
  border-radius: var(--ds4-radius-lg, 16px);
  background: var(--ds4-module-surface);
  box-shadow: var(--ds4-shadow-sm, 0 1px 2px rgba(16,24,40,.05));
}

/* Compact financial/KPI values. */
.ds4-module :where(
  .loan-v4__active-grid,
  .loan-totals,
  .transfer-summary,
  .transfer-show-v3__stats,
  .agent-payment-confirm-v3__stats
) {
  gap: .75rem;
}

.ds4-module :where(
  .loan-v4__active-grid article,
  .loan-totals span,
  .transfer-summary article,
  .transfer-show-v3__stats article,
  .agent-payment-confirm-v3__stats article
) {
  min-width: 0;
}

/* Tables: dense desktop, card-based mobile populated by ds4-finance-modules.js. */
.ds4-module .ds4-responsive-table,
.ds4-module .table-responsive,
.ds4-module .table-wrap,
.ds4-module .requests-table-wrap,
.ds4-module .admin-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--ds4-module-border);
  border-radius: var(--ds4-radius-lg, 16px);
  background: var(--ds4-module-surface);
}

.ds4-module table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.ds4-module table th { white-space: nowrap; font-size: .74rem; letter-spacing: .035em; text-transform: uppercase; color: var(--ds4-module-muted); }
.ds4-module table :where(th,td) { padding: .78rem .85rem; vertical-align: middle; }
.ds4-module table tbody tr + tr { border-top: 1px solid var(--ds4-module-border); }
.ds4-module table tbody tr:hover { background: color-mix(in srgb, var(--ds4-primary, #731f71) 3%, white); }

/* Action groups: same density everywhere. */
.ds4-module :where(.actions,.table-actions,.request-actions,.settings-actions,.admin-actions,.transfer-actions) {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
}

.ds4-module .ds4-icon-action {
  width: 2.5rem;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center;
  border-radius: .7rem !important;
  font-size: 0 !important;
  line-height: 1 !important;
}
.ds4-module .ds4-icon-action iconify-icon { font-size: 1.18rem !important; }

/* Form controls */
.ds4-module :where(input,select,textarea) { max-width: 100%; }
.ds4-module :where(input[type=text],input[type=search],input[type=number],input[type=tel],input[type=date],select,textarea) {
  min-height: 2.75rem;
  border-radius: var(--ds4-radius-md, 12px);
}
.ds4-module textarea { min-height: 7rem; }

/* Status badges: make legacy states visually consistent. */
.ds4-module :where(.request-status,[class*="status-badge"]) {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: .25rem .6rem;
  border-radius: 999px;
  font-size: .74rem;
  font-weight: 700;
  white-space: nowrap;
}

/* Tablet: optimise usable width rather than collapsing too early. */
@media (min-width: 768px) and (max-width: 1100px) {
  .ds4-module { --ds4-module-gap: 1rem; }
  .ds4-module :where(.loan-v4__active-grid,.transfer-show-v3__stats,.agent-payment-confirm-v3__stats) {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .ds4-module :where(.request-list,.transfer-list) { gap: .8rem; }
}

/* Mobile: prioritise the task, hide repeated helper copy and turn data tables into cards. */
@media (max-width: 767px) {
  .ds4-module {
    --ds4-module-gap: .85rem;
    width: 100%;
  }

  .ds4-module :where(
    .loan-v4__hero,
    .membership-head,
    .transfer-centre__hero,
    .transfer-show-v3__hero,
    .admin-requests__head,
    .loan-detail-v3__hero,
    .admin-transfers-v3__hero,
    .admin-transfer-detail-v3__hero,
    .agent-transfer-create-v3__hero,
    .agent-payment-confirm-v3__hero
  ) { flex-direction: column; gap: .6rem; }

  .ds4-module :where(h1) { font-size: 1.45rem; }
  .ds4-module .eyebrow { font-size: .68rem; }

  /* Reduce verbose descriptions when the heading already conveys the task. */
  .ds4-module [data-ds4-mobile-secondary],
  .ds4-module .ds4-mobile-secondary { display: none !important; }

  /* Horizontal metric strips avoid tall stacks. */
  .ds4-module :where(.loan-v4__active-grid,.loan-totals,.transfer-summary,.transfer-show-v3__stats,.agent-payment-confirm-v3__stats) {
    display: flex !important;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    gap: .55rem;
    padding-bottom: .1rem;
  }
  .ds4-module :where(.loan-v4__active-grid,.loan-totals,.transfer-summary,.transfer-show-v3__stats,.agent-payment-confirm-v3__stats)::-webkit-scrollbar { display: none; }
  .ds4-module :where(.loan-v4__active-grid article,.loan-totals span,.transfer-summary article,.transfer-show-v3__stats article,.agent-payment-confirm-v3__stats article) {
    flex: 0 0 min(72vw, 15rem);
    scroll-snap-align: start;
  }

  /* Responsive tables -> record cards. */
  .ds4-module table[data-ds4-mobile-table] { display: block; border: 0; background: transparent; }
  .ds4-module table[data-ds4-mobile-table] thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); }
  .ds4-module table[data-ds4-mobile-table] tbody { display: grid; gap: .7rem; }
  .ds4-module table[data-ds4-mobile-table] tr {
    display: grid;
    gap: .55rem;
    padding: .85rem;
    border: 1px solid var(--ds4-module-border) !important;
    border-radius: var(--ds4-radius-lg, 16px);
    background: var(--ds4-module-surface);
    box-shadow: var(--ds4-shadow-sm, 0 1px 2px rgba(16,24,40,.05));
  }
  .ds4-module table[data-ds4-mobile-table] td {
    display: grid;
    grid-template-columns: minmax(6.4rem, 38%) 1fr;
    align-items: start;
    gap: .55rem;
    padding: 0;
    border: 0;
    min-width: 0;
  }
  .ds4-module table[data-ds4-mobile-table] td::before {
    content: attr(data-ds4-label);
    font-size: .72rem;
    font-weight: 700;
    color: var(--ds4-module-muted);
    text-transform: uppercase;
    letter-spacing: .025em;
  }
  .ds4-module table[data-ds4-mobile-table] td[data-ds4-empty-label]::before { display: none; }
  .ds4-module table[data-ds4-mobile-table] td[data-ds4-empty-label] { grid-template-columns: 1fr; }

  /* Keep action rows compact and thumb-friendly. */
  .ds4-module :where(.actions,.table-actions,.request-actions,.settings-actions,.admin-actions,.transfer-actions) {
    width: 100%;
    justify-content: flex-end;
  }
  .ds4-module :where(button,a,input,select) { touch-action: manipulation; }

  /* Forms use one column and sticky primary actions when explicitly marked by JS. */
  .ds4-module form .ds4-sticky-actions {
    position: sticky;
    bottom: calc(.4rem + env(safe-area-inset-bottom));
    z-index: 10;
    margin-inline: -.25rem;
    padding: .55rem;
    border: 1px solid var(--ds4-module-border);
    border-radius: 1rem;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(10px);
    box-shadow: 0 10px 30px rgba(16,24,40,.12);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ds4-module * { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}


/* =========================================================
   UMOJA TRANSFERS — COMPLETE MOBILE RESPONSIVENESS OVERRIDE
   Scope: member/client, agent and admin transfer workflows.
   DS4's generic horizontal KPI-strip behaviour is deliberately
   overridden for transfer financial data on phones.
   ========================================================= */
@media (max-width: 767px) {
  /* Universal containment for transfer modules. */
  .ds4-module--transfers,
  .ds4-module--transfers *,
  .transfer-page,
  .transfer-page *,
  .agent-transfer-create-v3,
  .agent-transfer-create-v3 *,
  .agent-payment-confirm-v3,
  .agent-payment-confirm-v3 *,
  .admin-transfers-v3,
  .admin-transfers-v3 *,
  .admin-transfer-detail-v3,
  .admin-transfer-detail-v3 * {
    box-sizing: border-box;
  }

  .ds4-module--transfers,
  .transfer-page,
  .agent-transfer-create-v3,
  .agent-payment-confirm-v3,
  .admin-transfers-v3,
  .admin-transfer-detail-v3 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: clip !important;
  }

  .ds4-module--transfers :where(
    .request-card,
    .transfer-panel-modern,
    .transfer-confirmation-card,
    .transfer-detail-summary-card,
    .transfer-detail-status-card,
    .transfer-payment-v3-card,
    .transfer-submissions-card,
    .transfer-v3-awaiting-card,
    .agent-transfer-owner-card,
    .agent-transfer-step-card,
    .agent-transfer-step-body,
    .agent-transfer-summary,
    .agent-payment-confirm-v3__reference,
    .agent-payment-confirm-v3__card,
    .admin-transfers-v3__records
  ) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* Never use sideways-scrolling financial cards in transfer workflows. */
  .ds4-module--transfers :where(
    .transfer-summary,
    .transfer-summary-grid,
    .transfer-show-v3__stats,
    .agent-transfer-summary-grid,
    .agent-payment-confirm-v3__stats,
    .admin-transfers-v3__summary,
    .admin-transfer-financial-grid
  ) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: .65rem !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
    padding-bottom: 0 !important;
  }

  .ds4-module--transfers :where(
    .transfer-summary article,
    .transfer-summary-grid article,
    .transfer-show-v3__stats article,
    .agent-transfer-summary-grid article,
    .agent-payment-confirm-v3__stats article,
    .admin-transfers-v3__summary article,
    .admin-transfer-financial-grid article
  ) {
    flex: none !important;
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    scroll-snap-align: none !important;
  }

  /* Agent payment page: Sender pays / Commission / Receiver gets / rate. */
  .agent-payment-confirm-v3__stats {
    overflow-x: visible !important;
  }

  .agent-payment-confirm-v3__stats > * {
    min-height: 0 !important;
    padding: .85rem !important;
  }

  .agent-payment-confirm-v3__stats :where(strong,span,small,p),
  .agent-transfer-summary-grid :where(strong,span,small,p) {
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    text-overflow: clip !important;
  }

  /* Parties, payment forms and detail layouts collapse cleanly. */
  .ds4-module--transfers :where(
    .transfer-detail-grid,
    .transfer-detail-parties,
    .transfer-payment-v3-grid,
    .agent-transfer-amount-grid,
    .agent-transfer-authorisation,
    .agent-payment-confirm-v3__parties,
    .agent-payment-confirm-v3__flow,
    .admin-transfer-detail-grid,
    .admin-transfer-parties
  ) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: .75rem !important;
  }

  .ds4-module--transfers :where(
    .transfer-party-card,
    .agent-payment-confirm-v3__parties > *,
    .admin-transfer-person
  ) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .ds4-module--transfers :where(
    .transfer-party-arrow,
    .agent-payment-confirm-v3__flow > iconify-icon,
    .admin-transfer-parties__arrow
  ) {
    justify-self: center !important;
    transform: rotate(90deg);
  }

  /* Headers/actions/forms must stay inside the viewport. */
  .ds4-module--transfers :where(
    .transfer-detail-hero,
    .transfer-detail-hero__actions,
    .admin-transfers-v3__hero,
    .admin-transfers-v3__hero-actions,
    .admin-transfer-detail-hero,
    .admin-transfer-detail-hero__actions,
    .agent-transfer-create-hero,
    .agent-payment-confirm-v3__hero,
    .agent-payment-confirm-v3__actions
  ) {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .ds4-module--transfers :where(
    .transfer-detail-hero__actions,
    .admin-transfers-v3__hero-actions,
    .admin-transfer-detail-hero__actions,
    .agent-payment-confirm-v3__actions
  ) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
  }

  .ds4-module--transfers :where(
    button,
    .button-primary,
    .button-secondary,
    input,
    select,
    textarea,
    label,
    form
  ) {
    min-width: 0;
    max-width: 100%;
  }

  /* Long references and phone/currency strings may wrap, never widen a card. */
  .ds4-module--transfers :where(
    .agent-payment-confirm-v3__reference,
    .transfer-reference-block,
    .transfer-detail-facts,
    .transfer-amount-cell,
    strong,
    small,
    p
  ) {
    overflow-wrap: anywhere;
  }

  /* Admin record table: use the existing mobile-card representation and
     prevent the desktop table wrapper from forcing document width. */
  .admin-transfers-v3__table-wrap {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .admin-transfers-v3__table {
    max-width: 100% !important;
  }
}


/* =========================================================
   AGENT PAYMENT FLOW ARROW — MOBILE FIX
   Keeps the Sender → Receiver connector as a compact circular
   down-arrow instead of stretching it to the full card width.
   ========================================================= */
@media (max-width: 767px) {
  .ds4-module--transfers .agent-payment-confirm-v3__parties {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .75rem !important;
    width: 100% !important;
  }

  .ds4-module--transfers .agent-payment-confirm-v3__parties > article {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .ds4-module--transfers .agent-payment-confirm-v3__flow {
    display: grid !important;
    place-items: center !important;
    justify-self: center !important;
    align-self: center !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    margin: 0 auto !important;
    border-radius: 999px !important;
    overflow: hidden !important;
  }

  .ds4-module--transfers .agent-payment-confirm-v3__flow > iconify-icon {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    font-size: 20px !important;
    transform: rotate(90deg) !important;
  }
}


/* =========================================================
   AGENT PAYMENT FLOW ICON DIRECTION FIX
   Use an explicit down-arrow glyph on mobile rather than
   rotating the desktop right-arrow.
   ========================================================= */
.agent-payment-confirm-v3__flow-icon--mobile {
  display: none;
}

@media (max-width: 767px) {
  .ds4-module--transfers .agent-payment-confirm-v3__flow-icon--desktop {
    display: none !important;
  }

  .ds4-module--transfers .agent-payment-confirm-v3__flow-icon--mobile {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    font-size: 20px !important;
    transform: none !important;
  }

  .ds4-module--transfers .agent-payment-confirm-v3__flow > iconify-icon {
    transform: none !important;
  }
}

/* ---- migrated from ds4-people-projects.css ---- */
/** UMOJA DS4 Pack 3 — People & Projects
 * Centralizes legacy module-local styles and adds cross-device DS4 overrides.
 */

/* Migrated from app/Views/admin/users.php */
.admin-users-v3 {
        width: 100%;
        max-width: none;
        display: grid;
        gap: 14px;
    }

    .auv3-hero,
    .auv3-summary article,
    .auv3-filter-card,
    .auv3-records {
        border: 1px solid rgba(var(--primary-rgb), .12);
        background: #fff;
        box-shadow: var(--shadow-card);
    }

    .auv3-hero {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 18px;
        border-radius: 17px;
    }

    .auv3-hero__main {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 13px;
    }

    .auv3-hero__icon {
        width: 48px;
        height: 48px;
        flex: 0 0 48px;
        display: grid;
        place-items: center;
        border-radius: 13px;
        background: rgba(var(--primary-rgb), .09);
        color: var(--primary-dark);
        font-size: 22px;
    }

    .auv3-hero h1 {
        margin: 2px 0 4px;
        font-size: clamp(24px, 3vw, 34px);
    }

    .auv3-hero p {
        margin-bottom: 0;
    }

    .auv3-hero__actions {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        flex-wrap: wrap;
    }

    .auv3-counter-link {
        position: relative;
    }

    .auv3-counter-link strong {
        min-width: 20px;
        height: 20px;
        display: inline-grid;
        place-items: center;
        padding: 0 5px;
        border-radius: 999px;
        background: var(--primary);
        color: #fff;
        font-size: 9px;
    }

    .auv3-summary {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 9px;
    }

    .auv3-summary article {
        min-height: 92px;
        display: grid;
        align-content: center;
        gap: 4px;
        padding: 13px;
        border-radius: 13px;
    }

    .auv3-summary article.is-success {
        background: rgba(24, 169, 87, .07);
        border-color: rgba(24, 169, 87, .18);
    }

    .auv3-summary article.is-warning {
        background: rgba(224, 149, 15, .07);
        border-color: rgba(224, 149, 15, .20);
    }

    .auv3-summary article.is-muted {
        background: #f8f9fb;
    }

    .auv3-summary span {
        color: #667085;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .03em;
        text-transform: uppercase;
    }

    .auv3-summary strong {
        color: #101828;
        font-size: 19px;
        line-height: 1.15;
    }

    .auv3-summary small {
        color: #667085;
        font-size: 9px;
    }

    .auv3-filter-card,
    .auv3-records {
        padding: 15px;
        border-radius: 16px;
    }

    .auv3-filter-form {
        display: grid;
        grid-template-columns:
            minmax(280px, 1.5fr)
            minmax(150px, .7fr)
            minmax(150px, .7fr)
            minmax(110px, .5fr)
            auto;
        align-items: end;
        gap: 9px;
    }

    .auv3-filter-form label {
        min-width: 0;
        display: grid;
        gap: 5px;
    }

    .auv3-filter-form label > span {
        color: #475467;
        font-size: 9px;
        font-weight: 800;
        text-transform: uppercase;
    }

    .auv3-search-control {
        position: relative;
    }

    .auv3-search-control iconify-icon {
        position: absolute;
        top: 50%;
        left: 12px;
        transform: translateY(-50%);
        color: #98a2b3;
        pointer-events: none;
    }

    .auv3-search-control input {
        width: 100%;
        padding-left: 36px !important;
    }

    .auv3-filter-form input,
    .auv3-filter-form select {
        min-height: 40px;
        font-size: 11px;
    }

    .auv3-filter-actions,
    .auv3-toolbar__actions {
        display: flex;
        align-items: center;
        gap: 8px;
        flex-wrap: wrap;
    }

    .auv3-filter-actions .button-primary,
    .auv3-filter-actions .button-secondary,
    .auv3-toolbar__actions .button-primary,
    .auv3-toolbar__actions .button-secondary {
        min-height: 40px;
        white-space: nowrap;
    }

    .auv3-toolbar {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 14px;
        margin-bottom: 10px;
    }

    .auv3-toolbar h2 {
        margin: 2px 0 3px;
        font-size: 18px;
    }

    .auv3-toolbar p {
        margin-bottom: 0;
    }

    .auv3-toolbar__actions {
        justify-content: flex-end;
    }

    .auv3-toolbar__actions .button-primary:disabled {
        cursor: not-allowed;
        opacity: .52;
    }

    .auv3-selection-note {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 8px;
        color: #667085;
        font-size: 10px;
        font-weight: 700;
    }

    .auv3-table-wrap {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .auv3-table {
        width: 100%;
        min-width: 1100px;
        table-layout: fixed;
        border-collapse: collapse;
    }

    .auv3-col-select {
        width: 46px;
    }

    .auv3-col-user {
        width: 260px;
    }

    .auv3-col-phone {
        width: 145px;
    }

    .auv3-col-registered {
        width: 155px;
    }

    .auv3-col-status {
        width: 140px;
    }

    .auv3-col-role {
        width: 220px;
    }

    .auv3-col-action {
        width: 54px;
    }

    .auv3-table th,
    .auv3-table td {
        padding: 13px 12px;
        border-bottom: 1px solid #edf0f4;
        text-align: left;
        vertical-align: middle;
    }

    .auv3-table thead th {
        background: #f8fafc;
        color: #667085;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0;
        line-height: 1.25;
        text-transform: none;
        white-space: nowrap;
    }

    .auv3-table td {
        color: #344054;
        font-size: 12px;
        line-height: 1.4;
        overflow: hidden;
    }

    .auv3-table td:last-child {
        overflow: visible;
    }

    .auv3-table tbody tr:hover {
        background: #fbfcfe;
    }

    .auv3-table th:first-child,
    .auv3-table td:first-child,
    .auv3-table th:last-child,
    .auv3-table td:last-child {
        text-align: center;
    }

    .auv3-sort-button {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 0;
        border: 0;
        background: transparent;
        color: #667085;
        font: inherit;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0;
        line-height: 1.25;
        text-transform: none;
        cursor: pointer;
        transition:
            color .18s ease,
            opacity .18s ease;
    }

    .auv3-sort-button:hover {
        color: var(--primary-dark);
    }

    .auv3-sort-button iconify-icon {
        color: #98a2b3;
        font-size: 13px;
        opacity: .82;
    }

    .auv3-sort-button.is-sorted-asc,
    .auv3-sort-button.is-sorted-desc {
        color: var(--primary-dark);
    }

    .auv3-sort-button.is-sorted-asc iconify-icon,
    .auv3-sort-button.is-sorted-desc iconify-icon {
        color: var(--primary-dark);
        opacity: 1;
    }

    .auv3-user-cell {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 9px;
    }

    .auv3-user-cell img {
        width: 38px;
        height: 38px;
        flex: 0 0 38px;
        border-radius: 10px;
        object-fit: cover;
        background: #f2f4f7;
    }

    .auv3-user-cell > div {
        min-width: 0;
        display: grid;
        gap: 2px;
    }

    .auv3-user-cell strong,
    .auv3-user-cell small,
    .auv3-phone-cell,
    .auv3-date-cell {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .auv3-user-cell strong {
        color: #101828;
        font-size: 13px;
        font-weight: 650;
        line-height: 1.3;
    }

    .auv3-user-cell small,
    .auv3-date-cell {
        color: #667085;
        font-size: 10px;
        font-weight: 500;
        line-height: 1.3;
    }

    .auv3-phone-cell {
        color: #344054;
        font-size: 12px;
        font-weight: 650;
    }

    .auv3-role-list {
        display: flex;
        align-items: center;
        gap: 5px;
        flex-wrap: wrap;
    }

    .auv3-role-pill {
        min-height: 24px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0 8px;
        border-radius: 999px;
        background: rgba(var(--primary-rgb), .08);
        color: var(--primary-dark);
        font-size: 9px;
        font-weight: 800;
        white-space: nowrap;
    }

    .auv3-role-pill.is-member {
        background: rgba(24, 169, 87, .09);
        color: #16834a;
    }

    .auv3-role-pill.is-client {
        background: rgba(47, 128, 237, .09);
        color: #175cd3;
    }

    .auv3-role-pill.is-agent {
        background: rgba(224, 149, 15, .10);
        color: #a15c00;
    }

    .auv3-role-pill.is-admin,
    .auv3-role-pill.is-root {
        background: rgba(var(--primary-rgb), .11);
        color: var(--primary-dark);
    }

    .auv3-row-actions {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .auv3-action-menu {
        position: relative;
        z-index: 50;
    }

    .auv3-action-menu > summary {
        width: 32px;
        height: 32px;
        display: inline-grid;
        place-items: center;
        padding: 0;
        border: 1px solid rgba(var(--primary-rgb), .14);
        border-radius: 8px;
        background: #fff;
        color: var(--primary-dark);
        cursor: pointer;
        list-style: none;
        transition:
            border-color .18s ease,
            background-color .18s ease,
            box-shadow .18s ease;
    }

    .auv3-action-menu > summary:hover,
    .auv3-action-menu[open] > summary {
        border-color: rgba(var(--primary-rgb), .30);
        background: rgba(var(--primary-rgb), .06);
        box-shadow: 0 5px 14px rgba(15, 23, 42, .08);
    }

    .auv3-action-menu > summary::-webkit-details-marker {
        display: none;
    }

    .auv3-action-menu > summary::marker {
        content: "";
    }

    .auv3-action-menu__panel {
        display: none;
        position: fixed;
        left: var(--auv3-menu-left, auto);
        top: var(--auv3-menu-top, auto);
        z-index: 99999;
        width: 196px;
        padding: 6px;
        border: 1px solid rgba(var(--primary-rgb), .14);
        border-radius: 11px;
        background: #fff;
        box-shadow: 0 18px 42px rgba(15, 23, 42, .20);
    }

    .auv3-action-menu[open] > .auv3-action-menu__panel {
        display: grid;
        gap: 2px;
    }

    .auv3-action-menu__panel a,
    .auv3-action-menu__panel button {
        width: 100%;
        min-height: 38px;
        display: grid;
        grid-template-columns: 20px minmax(0, 1fr);
        align-items: center;
        gap: 8px;
        padding: 0 10px;
        border: 0;
        border-radius: 8px;
        background: transparent;
        color: #344054;
        font: inherit;
        font-size: 10px;
        font-weight: 700;
        text-align: left;
        text-decoration: none;
        cursor: pointer;
        white-space: nowrap;
    }

    .auv3-action-menu__panel iconify-icon {
        color: var(--primary-dark);
        font-size: 16px;
    }

    .auv3-action-menu__panel a:hover,
    .auv3-action-menu__panel button:hover,
    .auv3-action-menu__panel a:focus-visible,
    .auv3-action-menu__panel button:focus-visible {
        background: rgba(var(--primary-rgb), .06);
        color: var(--primary-dark);
        outline: none;
    }

    .auv3-action-menu__panel .is-danger {
        color: #c22b1c;
    }

    .auv3-action-menu__panel .is-danger iconify-icon {
        color: #c22b1c;
    }

    .auv3-mobile-list {
        display: none;
    }

    .auv3-pagination {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-top: 13px;
    }

    .auv3-pagination > span {
        color: #667085;
        font-size: 10px;
        font-weight: 700;
    }

    .auv3-pagination > div {
        display: flex;
        align-items: center;
        gap: 7px;
        flex-wrap: wrap;
    }

    .auv3-pagination .button-primary,
    .auv3-pagination .button-secondary {
        min-height: 34px;
        padding: 0 10px;
        font-size: 10px;
    }

    @media (max-width: 1280px) {
        .auv3-summary {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
    }

    @media (max-width: 1000px) {
        .auv3-filter-form {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .auv3-filter-search {
            grid-column: span 2;
        }

        .auv3-filter-actions {
            grid-column: span 2;
        }

        .auv3-toolbar {
            align-items: stretch;
            flex-direction: column;
        }

        .auv3-toolbar__actions {
            justify-content: flex-start;
        }
    }

    @media (max-width: 760px) {
        .auv3-hero {
            align-items: flex-start;
            flex-direction: column;
        }

        .auv3-hero__actions {
            width: 100%;
            display: grid;
            grid-template-columns: 1fr;
        }

        .auv3-hero__actions .button-primary,
        .auv3-hero__actions .button-secondary {
            width: 100%;
        }

        .auv3-summary {
            grid-template-columns: 1fr;
        }

        .auv3-filter-form {
            grid-template-columns: 1fr;
        }

        .auv3-filter-search,
        .auv3-filter-actions {
            grid-column: auto;
        }

        .auv3-filter-actions,
        .auv3-toolbar__actions {
            display: grid;
            grid-template-columns: 1fr;
        }

        .auv3-filter-actions .button-primary,
        .auv3-filter-actions .button-secondary,
        .auv3-toolbar__actions .button-primary,
        .auv3-toolbar__actions .button-secondary {
            width: 100%;
        }

        .auv3-table-wrap {
            display: none;
        }

        .auv3-mobile-list {
            display: grid;
            gap: 10px;
        }

        .auv3-mobile-card {
            padding: 12px;
            border: 1px solid #e5e8ee;
            border-radius: 13px;
            background: #fff;
        }

        .auv3-mobile-card > header {
            display: grid;
            grid-template-columns: auto 42px minmax(0, 1fr) auto;
            align-items: center;
            gap: 9px;
        }

        .auv3-mobile-card > header img {
            width: 42px;
            height: 42px;
            border-radius: 11px;
            object-fit: cover;
        }

        .auv3-mobile-card > header > div {
            min-width: 0;
            display: grid;
            gap: 2px;
        }

        .auv3-mobile-card > header strong,
        .auv3-mobile-card > header span:not(.user-status-badge) {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .auv3-mobile-card__meta {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
            margin: 10px 0;
        }

        .auv3-mobile-card__meta > div {
            display: grid;
            gap: 3px;
            padding: 9px;
            border-radius: 9px;
            background: #f8f9fb;
        }

        .auv3-mobile-card__meta span {
            color: #667085;
            font-size: 9px;
            font-weight: 800;
            text-transform: uppercase;
        }

        .auv3-mobile-card__meta strong {
            overflow: hidden;
            font-size: 11px;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .auv3-mobile-card__roles {
            display: flex;
            align-items: center;
            gap: 6px;
            flex-wrap: wrap;
            margin-bottom: 10px;
        }

        .auv3-mobile-card__actions {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .auv3-mobile-card__actions .button-secondary {
            width: 100%;
        }

        .auv3-pagination {
            align-items: stretch;
            flex-direction: column;
        }
    }

    @media (max-width: 480px) {
        .auv3-mobile-card > header {
            grid-template-columns: auto 40px minmax(0, 1fr);
        }

        .auv3-mobile-card > header .user-status-badge {
            grid-column: 2 / -1;
            justify-self: start;
        }

        .auv3-mobile-card__meta,
        .auv3-mobile-card__actions {
            grid-template-columns: 1fr;
        }
    }

/* Migrated from app/Views/admin/user_detail.php */
.admin-user-detail-v3 {
    width: 100%;
    max-width: none;
    display: grid;
    gap: 14px;
}

.audv3-hero,
.audv3-stats article,
.audv3-action-card,
.audv3-card {
    border: 1px solid rgba(var(--primary-rgb), .12);
    background: #fff;
    box-shadow: var(--shadow-card);
}

.audv3-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 17px;
    border-radius: 17px;
}

.audv3-hero__identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 13px;
}

.audv3-avatar {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    border-radius: 15px;
    object-fit: cover;
    background: #f2f4f7;
}

.audv3-avatar--initials {
    display: grid;
    place-items: center;
    background: rgba(var(--primary-rgb), .10);
    color: var(--primary-dark);
    font-size: 18px;
    font-weight: 800;
}

.audv3-hero__copy {
    min-width: 0;
}

.audv3-hero__copy h1 {
    margin: 2px 0 5px;
    color: #101828;
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.12;
}

.audv3-hero__meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 7px;
}

.audv3-hero__meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #667085;
    font-size: 10px;
}

.audv3-role-list {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

.audv3-role-pill {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(var(--primary-rgb), .08);
    color: var(--primary-dark);
    font-size: 9px;
    font-weight: 750;
    white-space: nowrap;
}

.audv3-role-pill.is-member {
    background: rgba(24, 169, 87, .09);
    color: #16834a;
}

.audv3-role-pill.is-client {
    background: rgba(47, 128, 237, .09);
    color: #175cd3;
}

.audv3-role-pill.is-agent {
    background: rgba(224, 149, 15, .10);
    color: #a15c00;
}

.audv3-role-pill.is-admin,
.audv3-role-pill.is-root {
    background: rgba(var(--primary-rgb), .11);
    color: var(--primary-dark);
}

.audv3-hero__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.audv3-stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 9px;
}

.audv3-stats article {
    min-height: 84px;
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 12px;
    border-radius: 13px;
}

.audv3-stats article.is-purple { background: rgba(var(--primary-rgb), .06); }
.audv3-stats article.is-blue { background: rgba(47, 128, 237, .06); }
.audv3-stats article.is-warning { background: rgba(224, 149, 15, .07); }
.audv3-stats article.is-green { background: rgba(24, 169, 87, .07); }

.audv3-stats span {
    color: #667085;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.audv3-stats strong {
    color: #101828;
    font-size: 17px;
    line-height: 1.15;
}

.audv3-stats small {
    color: #667085;
    font-size: 8px;
}

.audv3-actions {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 9px;
}

.audv3-action-card {
    min-width: 0;
    min-height: 74px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border-radius: 12px;
    color: #344054;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.audv3-action-card:hover {
    border-color: rgba(var(--primary-rgb), .28);
    background: rgba(var(--primary-rgb), .035);
    box-shadow: 0 8px 18px rgba(16, 24, 40, .07);
    transform: translateY(-1px);
}

.audv3-action-card > span:first-child {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: rgba(var(--primary-rgb), .09);
    color: var(--primary-dark);
    font-size: 18px;
}

.audv3-action-card > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.audv3-action-card strong {
    color: #344054;
    font-size: 10px;
    font-weight: 800;
}

.audv3-action-card small {
    overflow: hidden;
    color: #667085;
    font-size: 8px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.audv3-action-card__arrow {
    color: #98a2b3;
    font-size: 16px;
}

.audv3-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
    gap: 14px;
}

.audv3-card {
    padding: 15px;
    border-radius: 16px;
}

.audv3-card__head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 13px;
}

.audv3-card__head > span {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    flex: 0 0 40px;
    border-radius: 11px;
    background: rgba(var(--primary-rgb), .08);
    color: var(--primary-dark);
    font-size: 19px;
}

.audv3-card__head > div { min-width: 0; }

.audv3-card__head h2 {
    margin: 2px 0 3px;
    color: #101828;
    font-size: 18px;
}

.audv3-card__head p {
    margin: 0;
    color: #667085;
    font-size: 9px;
}

.audv3-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin: 0;
}

.audv3-info-grid > div,
.audv3-info-list > div {
    display: grid;
    gap: 5px;
    padding: 11px;
    border: 1px solid #edf0f4;
    border-radius: 11px;
    background: #fafbfc;
}

.audv3-info-grid > div.is-wide { grid-column: 1 / -1; }

.audv3-info-grid dt,
.audv3-info-list dt {
    color: #667085;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.audv3-info-grid dd,
.audv3-info-list dd {
    margin: 0;
    color: #344054;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.audv3-info-list {
    display: grid;
    gap: 9px;
    margin: 0;
}

.audv3-rating {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.audv3-rating span {
    color: #f79009;
    letter-spacing: 1px;
}

.audv3-rating strong {
    color: #344054;
    font-size: 10px;
}

@media (max-width: 1200px) {
    .audv3-stats,
    .audv3-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .audv3-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .audv3-hero__actions {
        width: 100%;
        justify-content: flex-start;
    }

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

@media (max-width: 680px) {
    .audv3-hero__identity {
        align-items: flex-start;
    }

    .audv3-hero__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .audv3-hero__actions .button-primary,
    .audv3-hero__actions .button-secondary {
        width: 100%;
    }

    .audv3-stats,
    .audv3-actions,
    .audv3-info-grid {
        grid-template-columns: 1fr;
    }

    .audv3-info-grid > div.is-wide {
        grid-column: auto;
    }
}

/* Migrated from app/Views/admin/projects.php */
.admin-projects-v3{width:100%;max-width:none;display:grid;gap:14px}
.apv3-hero,.apv3-summary article,.apv3-project-form-panel,.apv3-filter-card,.apv3-records{border:1px solid rgba(var(--primary-rgb),.12);background:#fff;box-shadow:var(--shadow-card)}
.apv3-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;border-radius:17px}
.apv3-hero__main{min-width:0;display:flex;align-items:center;gap:13px}
.apv3-hero__icon{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:13px;background:rgba(var(--primary-rgb),.09);color:var(--primary-dark);font-size:22px}
.apv3-hero h1{margin:2px 0 4px;font-size:clamp(24px,3vw,34px)}
.apv3-hero p{margin-bottom:0}
.apv3-hero__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.apv3-summary{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.apv3-summary article{min-height:92px;display:grid;align-content:center;gap:4px;padding:13px;border-radius:13px}
.apv3-summary .is-success{background:rgba(24,169,87,.07);border-color:rgba(24,169,87,.18)}
.apv3-summary .is-completed{background:rgba(47,128,237,.06);border-color:rgba(47,128,237,.15)}
.apv3-summary .is-money{background:rgba(var(--primary-rgb),.05)}
.apv3-summary span,.apv3-project-form label>span,.apv3-filter-form label>span{color:#667085;font-size:9px;font-weight:800;letter-spacing:.03em;text-transform:uppercase}
.apv3-summary strong{color:#101828;font-size:18px}
.apv3-summary small{color:#667085;font-size:9px}
.apv3-project-form-panel,.apv3-filter-card,.apv3-records{padding:15px;border-radius:16px}
.apv3-records{position:relative;overflow:visible}
.apv3-project-form-panel[hidden]{display:none!important}
.apv3-section-head,.apv3-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.apv3-section-head{margin-bottom:12px}.apv3-toolbar{margin-bottom:10px}
.apv3-section-head h2,.apv3-toolbar h2{margin:2px 0 3px;font-size:18px}
.apv3-section-head p,.apv3-toolbar p{margin-bottom:0}
.apv3-close-button{width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(var(--primary-rgb),.14);border-radius:9px;background:#fff;color:var(--primary-dark);cursor:pointer}
.apv3-project-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.apv3-project-form label{display:grid;gap:5px}.apv3-form-wide{grid-column:1/-1}
.apv3-project-form input,.apv3-project-form select,.apv3-project-form textarea,.apv3-filter-form input,.apv3-filter-form select{min-height:40px;font-size:11px}
.apv3-manager-panel{padding:12px;border-radius:12px;background:#f8f9fb}
.apv3-manager-panel h3{margin:2px 0 3px;font-size:16px}
.apv3-manager-panel p{margin-bottom:10px}
.apv3-form-actions{display:flex;justify-content:flex-end;gap:8px}
.apv3-filter-form{display:grid;grid-template-columns:minmax(260px,1.4fr) minmax(140px,.65fr) minmax(170px,.8fr) minmax(140px,.65fr) minmax(140px,.65fr) minmax(100px,.45fr) auto;align-items:end;gap:9px}
.apv3-filter-form label{min-width:0;display:grid;gap:5px}
.apv3-search-control{position:relative}.apv3-search-control iconify-icon{position:absolute;top:50%;left:12px;transform:translateY(-50%);color:#98a2b3;pointer-events:none}.apv3-search-control input{width:100%;padding-left:36px!important}
.apv3-filter-actions,.apv3-toolbar__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.apv3-filter-count{color:#667085;font-size:10px;font-weight:700;white-space:nowrap}
.apv3-toolbar__actions{justify-content:flex-end}.apv3-toolbar__actions .button-primary:disabled{opacity:.52;cursor:not-allowed}
.apv3-selection-note{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;color:#667085;font-size:10px;font-weight:700}
.apv3-table-wrap{width:100%;overflow-x:auto}.apv3-table{width:100%;min-width:1120px;table-layout:fixed;border-collapse:collapse}
.apv3-col-select{width:46px}.apv3-col-project{width:245px}.apv3-col-manager{width:190px}.apv3-col-balance{width:140px}.apv3-col-members{width:100px}.apv3-col-assets{width:100px}.apv3-col-status{width:135px}.apv3-col-action{width:78px}
.apv3-table th,.apv3-table td{padding:10px 9px;border-bottom:1px solid #edf0f4;text-align:left;vertical-align:middle}
.apv3-table th{background:#f8fafc;color:#667085;font-size:9px;font-weight:800;text-transform:uppercase;white-space:nowrap}
.apv3-table td{color:#344054;font-size:11px}.apv3-table th:first-child,.apv3-table td:first-child,.apv3-table th:last-child,.apv3-table td:last-child{text-align:center}
.apv3-project-cell{display:flex;align-items:center;gap:9px;min-width:0}.apv3-project-cell>span{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border-radius:10px;background:rgba(var(--primary-rgb),.08);color:var(--primary-dark)}.apv3-project-cell>div,.apv3-manager-cell{min-width:0;display:grid;gap:2px}.apv3-project-cell strong,.apv3-project-cell small,.apv3-manager-cell strong,.apv3-manager-cell small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.apv3-project-cell small,.apv3-manager-cell small{color:#667085;font-size:9px}
.apv3-balance-cell{font-size:12px;white-space:nowrap}.apv3-count-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;background:#f2f4f7;font-size:10px;font-weight:800}
.apv3-row-actions{display:inline-flex;gap:5px;position:relative;overflow:visible}.apv3-view-action,.apv3-action-menu>summary{width:34px;height:34px;display:inline-grid;place-items:center;border:1px solid rgba(var(--primary-rgb),.14);border-radius:8px;background:#fff;color:var(--primary-dark);text-decoration:none;cursor:pointer;list-style:none}
.apv3-action-menu{position:relative;z-index:50}.apv3-action-menu>summary::-webkit-details-marker{display:none}.apv3-action-menu>summary::marker{display:none;content:''}.apv3-action-menu[open]>summary{background:rgba(var(--primary-rgb),.07);border-color:rgba(var(--primary-rgb),.28)}.apv3-action-menu>div{display:none;position:fixed;left:var(--apv3-menu-left,auto);top:var(--apv3-menu-top,auto);right:auto;z-index:99999;min-width:190px;padding:6px;border:1px solid rgba(var(--primary-rgb),.12);border-radius:12px;background:#fff;box-shadow:0 18px 42px rgba(15,23,42,.20)}.apv3-action-menu[open]>div{display:block}
.apv3-action-menu a,.apv3-action-menu button{width:100%;min-height:36px;display:flex;align-items:center;gap:8px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:#344054;font:inherit;font-size:11px;font-weight:700;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer}.apv3-action-menu a:hover,.apv3-action-menu button:hover,.apv3-action-menu a:focus-visible,.apv3-action-menu button:focus-visible{background:#f6f7f9;outline:none}.apv3-action-menu .is-danger{color:#c22b1c}.apv3-action-menu .is-danger:hover{background:rgba(194,43,28,.07)}
.apv3-mobile-list{display:none}.apv3-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px}.apv3-pagination>span{color:#667085;font-size:10px;font-weight:700}.apv3-pagination>div{display:flex;gap:7px;flex-wrap:wrap}
.apv3-table tbody tr.is-filtered-out{display:none}
@media(max-width:1280px){.apv3-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.apv3-filter-form{grid-template-columns:repeat(3,minmax(0,1fr))}.apv3-filter-search{grid-column:span 2}.apv3-filter-actions{grid-column:span 3}}
@media(max-width:900px){.apv3-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.apv3-toolbar{align-items:stretch;flex-direction:column}.apv3-toolbar__actions{justify-content:flex-start}}
@media(max-width:760px){.apv3-hero{align-items:flex-start;flex-direction:column}.apv3-hero__actions{width:100%;display:grid;grid-template-columns:1fr}.apv3-hero__actions .button-primary,.apv3-hero__actions .button-secondary{width:100%}.apv3-summary,.apv3-project-form,.apv3-filter-form{grid-template-columns:1fr}.apv3-form-wide,.apv3-filter-search,.apv3-filter-actions{grid-column:auto}.apv3-filter-actions,.apv3-toolbar__actions{display:grid;grid-template-columns:1fr}.apv3-filter-actions .button-primary,.apv3-filter-actions .button-secondary,.apv3-toolbar__actions .button-primary,.apv3-toolbar__actions .button-secondary{width:100%}.apv3-table-wrap{display:none}.apv3-mobile-list{display:grid;gap:10px}.apv3-mobile-card{padding:12px;border:1px solid #e5e8ee;border-radius:13px;background:#fff}.apv3-mobile-card>header{display:grid;grid-template-columns:auto 38px minmax(0,1fr) auto;align-items:center;gap:9px}.apv3-mobile-card__icon{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:rgba(var(--primary-rgb),.08);color:var(--primary-dark)}.apv3-mobile-card>header>div{min-width:0;display:grid;gap:2px}.apv3-mobile-card>header strong,.apv3-mobile-card>header small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.apv3-mobile-card__manager{display:grid;gap:3px;margin-top:10px;padding:9px;border-radius:9px;background:#f8f9fb}.apv3-mobile-card__manager span,.apv3-mobile-card__metrics span{color:#667085;font-size:9px;font-weight:800;text-transform:uppercase}.apv3-mobile-card__metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}.apv3-mobile-card__metrics>div{display:grid;gap:3px;padding:9px;border-radius:9px;background:#f8f9fb}.apv3-mobile-card__actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.apv3-mobile-card__actions .button-secondary{width:100%}.apv3-pagination{align-items:stretch;flex-direction:column}}
@media(max-width:480px){.apv3-mobile-card>header{grid-template-columns:auto 36px minmax(0,1fr)}.apv3-mobile-card>header .request-status{grid-column:3;justify-self:start}.apv3-mobile-card__metrics,.apv3-mobile-card__actions{grid-template-columns:1fr}}

/* Migrated from app/Views/admin/project_detail.php */
.pdv3{display:grid;gap:14px;width:100%}.pdv3-hero,.pdv3-kpis article,.pdv3-tabs,.pdv3-actions,.pdv3-card{background:#fff;border:1px solid rgba(var(--primary-rgb),.12);box-shadow:var(--shadow-card)}.pdv3-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;border-radius:17px}.pdv3-hero-main{display:flex;align-items:center;gap:13px;min-width:0}.pdv3-hero-icon{width:48px;height:48px;display:grid;place-items:center;flex:0 0 48px;border-radius:13px;background:rgba(var(--primary-rgb),.09);color:var(--primary-dark);font-size:22px}.pdv3-hero h1{margin:2px 0 5px;font-size:clamp(24px,3vw,34px)}.pdv3-meta{display:flex;gap:10px;flex-wrap:wrap;color:#667085;font-size:10px}.pdv3-meta span{display:inline-flex;align-items:center;gap:5px}.pdv3-hero-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.pdv3-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.pdv3-kpis article{min-height:92px;display:grid;align-content:center;gap:4px;padding:13px;border-radius:13px}.pdv3-kpis span,.pdv3-filters label>span,.pdv3-modal label>span{font-size:9px;font-weight:800;text-transform:uppercase;color:#667085}.pdv3-kpis strong{font-size:18px}.pdv3-kpis small{font-size:9px;color:#667085}.pdv3-kpis .is-success{background:rgba(24,169,87,.07)}.pdv3-kpis .is-warning{background:rgba(224,149,15,.07)}.pdv3-kpis .is-money,.pdv3-kpis .is-net{background:rgba(var(--primary-rgb),.05)}.pdv3-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:6px;border-radius:13px}.pdv3-tabs a{min-height:42px;display:flex;align-items:center;justify-content:center;gap:7px;border-radius:9px;color:#667085;font-size:11px;font-weight:800;text-decoration:none}.pdv3-tabs a.is-active{background:rgba(var(--primary-rgb),.09);color:var(--primary-dark)}.pdv3-actions{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:10px;border-radius:13px}.pdv3-actions a,.pdv3-actions button{min-height:42px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(var(--primary-rgb),.12);border-radius:9px;background:#fff;color:var(--primary-dark);font:inherit;font-size:10px;font-weight:800;text-decoration:none;cursor:pointer}.pdv3-actions button:disabled{opacity:.45;cursor:not-allowed}.pdv3-card{padding:15px;border-radius:16px}.pdv3-overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.pdv3-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.pdv3-head h2{margin:2px 0 3px;font-size:18px}.pdv3-head p{margin-bottom:0}.pdv3-description{display:grid;grid-template-columns:42px 1fr;gap:12px}.pdv3-description>span{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;background:rgba(var(--primary-rgb),.08);color:var(--primary-dark)}.pdv3-description p{margin:0;color:#475467;line-height:1.65;white-space:pre-line}.pdv3-details{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:0}.pdv3-details>div{padding:10px;border-radius:10px;background:#f8f9fb}.pdv3-details dt{font-size:9px;font-weight:800;text-transform:uppercase;color:#667085}.pdv3-details dd{margin:4px 0 0;font-size:11px;font-weight:700}.pdv3-list{display:grid;gap:8px}.pdv3-list-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;padding:9px;border:1px solid #edf0f4;border-radius:10px}.pdv3-list-row>div{display:grid;min-width:0}.pdv3-list-row small{font-size:9px;color:#667085}.pdv3-avatar{width:36px;height:36px;display:grid;place-items:center;flex:0 0 36px;border-radius:10px;background:rgba(var(--primary-rgb),.08);color:var(--primary-dark);font-weight:800}.pdv3-filters{display:grid;grid-template-columns:minmax(260px,1.4fr) minmax(150px,.7fr) auto;align-items:end;gap:9px}.pdv3-filters label{display:grid;gap:5px}.pdv3-filters .search>div{position:relative}.pdv3-filters .search iconify-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#98a2b3}.pdv3-filters .search input{padding-left:36px!important;width:100%}.pdv3-filters input,.pdv3-filters select,.pdv3-modal select{min-height:40px;font-size:11px}.pdv3-filters>div{display:flex;align-items:center;gap:8px}.pdv3-filters>div>span{font-size:10px;font-weight:700;color:#667085}.pdv3-table-wrap{overflow-x:auto}.pdv3-table{width:100%;min-width:900px;border-collapse:collapse}.pdv3-table th,.pdv3-table td{padding:10px 9px;border-bottom:1px solid #edf0f4;text-align:left;vertical-align:middle}.pdv3-table th{font-size:9px;text-transform:uppercase;color:#667085;background:#f8fafc}.pdv3-table td{font-size:11px}.pdv3-table th:last-child,.pdv3-table td:last-child{text-align:center}.pdv3-person{display:flex;align-items:center;gap:9px}.danger-icon{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(180,35,24,.18);border-radius:8px;background:#fff;color:#b42318}.positive{color:#087443}.negative-text{color:#b42318}.direction{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:800}.direction.positive{background:rgba(24,169,87,.08)}.direction.negative{background:rgba(180,35,24,.07);color:#b42318}.pdv3-table tr.filtered{display:none}.pdv3-modal{position:fixed;inset:0;z-index:10000}.pdv3-modal[hidden]{display:none}.modal-backdrop{position:absolute;inset:0;background:rgba(16,24,40,.42);backdrop-filter:blur(2px)}.modal-dialog{position:relative;z-index:1;width:min(520px,calc(100% - 28px));margin:8vh auto 0;padding:16px;border-radius:16px;background:#fff;box-shadow:0 24px 60px rgba(15,23,42,.25)}.modal-dialog>header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}.modal-dialog>header button{width:36px;height:36px;border:1px solid rgba(var(--primary-rgb),.14);border-radius:9px;background:#fff}.modal-dialog form,.modal-dialog label{display:grid;gap:8px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}body.modal-open{overflow:hidden}@media(max-width:1280px){.pdv3-kpis{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.pdv3-overview{grid-template-columns:1fr}.pdv3-actions{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.pdv3-hero{align-items:flex-start;flex-direction:column}.pdv3-hero-actions{width:100%;display:grid;grid-template-columns:1fr}.pdv3-kpis,.pdv3-tabs,.pdv3-actions,.pdv3-filters,.pdv3-details{grid-template-columns:1fr}.pdv3-head{flex-direction:column}.pdv3-filters>div{display:grid}.pdv3-head .button-primary,.pdv3-head .button-secondary,.pdv3-hero-actions .button-secondary{width:100%}}

/* Migrated from app/Views/projects/member_index.php */
.member-project-tabs {
        display: grid;
        gap: 14px;
    }

    .member-project-tab-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 6px;
        border: 1px solid rgba(var(--primary-rgb), 0.12);
        border-radius: 15px;
        background: #fff;
        box-shadow: var(--shadow-card);
    }

    .member-project-tab {
        min-height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        padding: 0 14px;
        border: 1px solid transparent;
        border-radius: 11px;
        background: transparent;
        color: #667085;
        cursor: pointer;
        font: inherit;
        font-weight: 700;
    }

    .member-project-tab b {
        min-width: 24px;
        height: 24px;
        display: grid;
        place-items: center;
        padding: 0 6px;
        border-radius: 999px;
        background: #eef1f5;
        color: #475467;
        font-size: 12px;
    }

    .member-project-tab.is-active {
        border-color: rgba(var(--primary-rgb), 0.16);
        background: rgba(var(--primary-rgb), 0.10);
        color: var(--primary-dark);
    }

    .member-project-tab.is-active b {
        background: #fff;
        color: var(--primary-dark);
    }

    .member-project-pane[hidden] {
        display: none !important;
    }

    .member-project-pane-card {
        display: grid;
        gap: 16px;
    }

    .member-project-pane-head h2 {
        margin: 3px 0 5px;
    }

    .member-project-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .member-project-card {
        display: grid;
        gap: 14px;
        min-width: 0;
        padding: 16px;
        border: 1px solid #e8eaf0;
        border-radius: 15px;
        background: #fff;
    }

    .member-project-card.is-assigned {
        border-color: rgba(var(--primary-rgb), 0.20);
        box-shadow: 0 10px 26px rgba(var(--primary-rgb), 0.08);
    }

    .member-project-card-head {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 12px;
    }

    .member-project-card-icon {
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        border-radius: 12px;
        background: rgba(var(--primary-rgb), 0.09);
        color: var(--primary-dark);
        font-size: 21px;
    }

    .member-project-card-main {
        min-width: 0;
    }

    .member-project-card-main h3 {
        margin: 0 0 3px;
        font-size: 17px;
    }

    .member-project-card-main p {
        margin: 0;
        color: #667085;
        font-size: 13px;
    }

    .member-project-card-meta {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .member-project-card-meta span {
        display: grid;
        gap: 3px;
        padding: 10px;
        border-radius: 10px;
        background: #f8f9fb;
    }

    .member-project-card-meta small {
        color: #667085;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
    }

    .member-project-description {
        display: -webkit-box;
        overflow: hidden;
        margin: 0;
        color: #475467;
        font-size: 13px;
        line-height: 1.55;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }

    .member-project-card-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .member-project-card-actions .button-primary,
    .member-project-card-actions .button-secondary,
    .member-project-card-actions .settings-action-link {
        min-height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding: 0 13px;
    }

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

    @media (max-width: 560px) {
        .member-project-tab-list {
            grid-template-columns: 1fr;
        }

        .member-project-tab {
            justify-content: flex-start;
        }

        .member-project-card-head {
            grid-template-columns: auto minmax(0, 1fr);
        }

        .member-project-card-head .request-status {
            grid-column: 2;
            justify-self: start;
        }

        .member-project-card-actions {
            display: grid;
            grid-template-columns: 1fr;
        }
    }


/* ===== DS4 Pack 3 standardization layer ===== */
.ds4-people-module,.ds4-projects-module{display:grid;gap:var(--ds4-space-4,16px);width:100%;min-width:0}
.ds4-people-module :is(.auv3-hero,.audv3-hero),.ds4-projects-module :is(.apv3-hero,.pdv3-hero,.membership-head){border-radius:var(--ds4-radius-lg,16px)}
.ds4-people-module :is(.auv3-summary,.audv3-stats),.ds4-projects-module :is(.apv3-summary,.pdv3-kpis){gap:10px}
.ds4-people-module :is(.auv3-summary article,.audv3-stats article),.ds4-projects-module :is(.apv3-summary article,.pdv3-kpis article){min-width:0}
.ds4-people-module :is(.button-primary,.button-secondary),.ds4-projects-module :is(.button-primary,.button-secondary){min-height:40px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;gap:7px}
.ds4-people-module :is(input,select,textarea),.ds4-projects-module :is(input,select,textarea){border-radius:10px}
.ds4-people-module table,.ds4-projects-module table{font-variant-numeric:tabular-nums}
.ds4-people-module :is(.auv3-records,.audv3-card),.ds4-projects-module :is(.apv3-records,.pdv3-card,.request-card){border-radius:var(--ds4-radius-lg,16px)}
.ds4-people-module .auv3-action-menu summary,.ds4-projects-module details summary{min-width:38px;min-height:38px}
.ds4-module-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.ds4-module-card{border:1px solid rgba(var(--primary-rgb),.12);box-shadow:var(--shadow-card);border-radius:16px}
.ds4-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ds4-form-stack{display:grid;gap:12px}
.ds4-form-stack label{display:grid;gap:6px}
.ds4-form-stack label>span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.025em;color:#667085}
.ds4-form-stack :is(input,select,textarea){width:100%;min-height:42px}
.project-page .project-ledger-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #edf0f4}
.project-page .project-ledger-row:last-child{border-bottom:0}
.project-page .project-ledger-row>span{display:grid;gap:2px;min-width:0}
.project-page .project-ledger-row small{color:#667085;font-size:10px}
.project-page .project-balance-value{font-size:clamp(20px,3vw,30px);white-space:nowrap}

@media(max-width:1024px){
 .ds4-people-module :is(.auv3-summary,.audv3-stats),.ds4-projects-module :is(.apv3-summary,.pdv3-kpis){grid-template-columns:repeat(3,minmax(150px,1fr));overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:4px}
 .ds4-people-module :is(.auv3-summary article,.audv3-stats article),.ds4-projects-module :is(.apv3-summary article,.pdv3-kpis article){scroll-snap-align:start}
}
@media(max-width:760px){
 .ds4-people-module,.ds4-projects-module{gap:12px}
 .ds4-people-module :is(.auv3-hero,.audv3-hero),.ds4-projects-module :is(.apv3-hero,.pdv3-hero,.membership-head){padding:14px}
 .ds4-people-module :is(.auv3-hero__actions,.audv3-hero__actions),.ds4-projects-module :is(.apv3-hero__actions,.pdv3-hero-actions){gap:7px}
 .ds4-people-module :is(.auv3-summary,.audv3-stats),.ds4-projects-module :is(.apv3-summary,.pdv3-kpis){display:flex;overflow-x:auto;grid-template-columns:none;scrollbar-width:none;margin-inline:-2px;padding:0 2px 6px}
 .ds4-people-module :is(.auv3-summary,.audv3-stats)::-webkit-scrollbar,.ds4-projects-module :is(.apv3-summary,.pdv3-kpis)::-webkit-scrollbar{display:none}
 .ds4-people-module :is(.auv3-summary article,.audv3-stats article),.ds4-projects-module :is(.apv3-summary article,.pdv3-kpis article){flex:0 0 min(70vw,220px);min-height:82px;padding:12px}
 .ds4-module-hero{flex-direction:column}
 .ds4-module-grid{grid-template-columns:1fr}
 .project-page .request-card{padding:13px}
 .project-page .project-ledger-row{align-items:flex-start}
 .project-page .settings-action-link{flex:0 0 auto}
 .ds4-people-module .auv3-mobile-card__actions,.ds4-projects-module .apv3-mobile-card__actions{gap:6px}
 .ds4-people-module .auv3-mobile-card__actions .button-secondary,.ds4-projects-module .apv3-mobile-card__actions .button-secondary{min-height:38px;font-size:10px;padding-inline:10px}
}
@media(max-width:480px){
 .ds4-people-module :is(.auv3-hero h1,.audv3-hero h1),.ds4-projects-module :is(.apv3-hero h1,.pdv3-hero h1,.membership-head h1){font-size:22px}
 .ds4-people-module .muted,.ds4-projects-module .muted{font-size:11px}
 .project-page .project-ledger-row small{white-space:normal}
}
@media(prefers-reduced-motion:reduce){.ds4-people-module *,.ds4-projects-module *{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}



/* Admin user directory — responsive summary cards.
 * DS4 Pack 3's generic mobile carousel is useful in some modules, but on the
 * user directory it caused the second card to be clipped. Use a true grid.
 */
@media (max-width: 760px) {
  .admin-users-v3.ds4-people-module .auv3-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    margin-inline: 0;
    padding: 0;
    overflow: visible;
    scroll-snap-type: none;
  }

  .admin-users-v3.ds4-people-module .auv3-summary article {
    flex: initial;
    width: auto;
    min-width: 0;
    min-height: 92px;
    padding: 12px;
    overflow: hidden;
  }

  .admin-users-v3.ds4-people-module .auv3-summary span,
  .admin-users-v3.ds4-people-module .auv3-summary strong,
  .admin-users-v3.ds4-people-module .auv3-summary small {
    min-width: 0;
    max-width: 100%;
  }

  .admin-users-v3.ds4-people-module .auv3-summary span {
    line-height: 1.25;
    white-space: normal;
  }

  .admin-users-v3.ds4-people-module .auv3-summary strong {
    font-size: 1.35rem;
    line-height: 1.1;
  }

  .admin-users-v3.ds4-people-module .auv3-summary small {
    line-height: 1.3;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 480px) {
  .admin-users-v3.ds4-people-module .auv3-summary article {
    min-height: 84px;
    padding: 11px;
  }

  .admin-users-v3.ds4-people-module .auv3-summary span {
    font-size: 9px;
  }

  .admin-users-v3.ds4-people-module .auv3-summary strong {
    font-size: 1.25rem;
  }

  /* The label + number are the important mobile information.
     Hide the explanatory sentence to keep all six cards compact. */
  .admin-users-v3.ds4-people-module .auv3-summary small {
    display: none;
  }
}

@media (max-width: 340px) {
  .admin-users-v3.ds4-people-module .auv3-summary {
    grid-template-columns: 1fr;
  }
}


/* ===== DS4 Admin Projects responsive correction =====
   Keeps the projects workspace inside the mobile viewport and removes
   the horizontal KPI/filter overflow introduced by the generic Pack 3 layer. */
@media (max-width: 760px) {
    .ds4-projects-module {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: clip;
    }

    .ds4-projects-module > *,
    .ds4-projects-module form,
    .ds4-projects-module label,
    .ds4-projects-module input,
    .ds4-projects-module select,
    .ds4-projects-module textarea {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    .ds4-projects-module .apv3-hero {
        padding: 16px;
        gap: 16px;
    }

    .ds4-projects-module .apv3-hero__main {
        width: 100%;
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 14px;
    }

    .ds4-projects-module .apv3-hero__icon {
        width: 58px;
        height: 58px;
    }

    .ds4-projects-module .apv3-hero h1 {
        font-size: clamp(1.75rem, 8vw, 2.15rem);
        line-height: 1.08;
    }

    .ds4-projects-module .apv3-hero .muted {
        font-size: .92rem;
        line-height: 1.4;
    }

    .ds4-projects-module .apv3-hero__actions {
        width: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ds4-projects-module .apv3-hero__actions :is(.button-primary,.button-secondary) {
        min-width: 0;
        padding-inline: 10px;
        white-space: normal;
        text-align: center;
    }

    /* Six KPIs become a stable 2-column grid; no sideways scrolling. */
    .ds4-projects-module .apv3-summary {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        width: 100%;
        margin-inline: 0;
        padding: 0;
        overflow: visible;
        scroll-snap-type: none;
    }

    .ds4-projects-module .apv3-summary article {
        flex: initial;
        width: auto;
        min-width: 0;
        min-height: 106px;
        padding: 14px;
        overflow: hidden;
        scroll-snap-align: none;
    }

    .ds4-projects-module .apv3-summary strong {
        max-width: 100%;
        font-size: clamp(1.2rem, 5.2vw, 1.55rem);
        line-height: 1.15;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

    .ds4-projects-module .apv3-summary small {
        line-height: 1.3;
        overflow-wrap: anywhere;
    }

    /* Filters must never inherit a desktop/min-content width. */
    .ds4-projects-module .apv3-filter-card {
        width: 100%;
        padding: 14px;
        overflow: hidden;
    }

    .ds4-projects-module .apv3-filter-form {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        gap: 12px;
    }

    .ds4-projects-module .apv3-filter-form > *,
    .ds4-projects-module .apv3-filter-search,
    .ds4-projects-module .apv3-filter-actions {
        grid-column: auto;
        width: 100%;
        min-width: 0;
    }

    .ds4-projects-module .apv3-search-control {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .ds4-projects-module .apv3-search-control input,
    .ds4-projects-module .apv3-filter-form select {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .ds4-projects-module .apv3-filter-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .ds4-projects-module .apv3-filter-count {
        grid-column: 1 / -1;
    }

    .ds4-projects-module .apv3-filter-actions :is(.button-primary,.button-secondary) {
        width: 100%;
        min-width: 0;
    }

    .ds4-projects-module .apv3-records {
        width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .ds4-projects-module .apv3-toolbar {
        padding: 14px;
    }

    .ds4-projects-module .apv3-toolbar__actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .ds4-projects-module .apv3-toolbar__actions .js-apv3-export-selected {
        grid-column: 1 / -1;
    }

    .ds4-projects-module .apv3-mobile-list {
        min-width: 0;
        padding-inline: 12px;
    }

    .ds4-projects-module .apv3-mobile-card {
        width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .ds4-projects-module .apv3-mobile-card__metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ds4-projects-module .apv3-mobile-card__metrics > div {
        min-width: 0;
    }

    .ds4-projects-module .apv3-mobile-card__metrics strong {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 420px) {
    .ds4-projects-module .apv3-hero__actions {
        grid-template-columns: 1fr;
    }

    .ds4-projects-module .apv3-filter-actions,
    .ds4-projects-module .apv3-toolbar__actions {
        grid-template-columns: 1fr;
    }

    .ds4-projects-module .apv3-toolbar__actions .js-apv3-export-selected {
        grid-column: auto;
    }
}

@media (max-width: 360px) {
    .ds4-projects-module .apv3-summary {
        grid-template-columns: 1fr;
    }

    .ds4-projects-module .apv3-summary article {
        min-height: 92px;
    }

    .ds4-projects-module .apv3-mobile-card__metrics {
        grid-template-columns: 1fr;
    }
}

/* DS4 Admin Project Detail - mobile no-horizontal-scroll fix */
@media (max-width: 760px) {
  .ds4-projects-module.pdv3 {
    width: 100%;
    min-width: 0;
    overflow-x: clip;
  }

  /* KPI cards must fit the viewport rather than becoming a swipe rail. */
  .ds4-projects-module.pdv3 .pdv3-kpis {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    min-width: 0;
    margin-inline: 0;
    padding: 0;
    overflow: visible;
    scroll-snap-type: none;
  }
  .ds4-projects-module.pdv3 .pdv3-kpis article {
    flex: initial;
    width: auto;
    min-width: 0;
    min-height: 88px;
    padding: 12px;
    overflow-wrap: anywhere;
  }
  .ds4-projects-module.pdv3 .pdv3-kpis strong {
    font-size: clamp(16px, 5vw, 20px);
    line-height: 1.15;
    overflow-wrap: anywhere;
  }

  /* Keep all project tabs visible without a horizontal scroller. */
  .ds4-projects-module.pdv3 .pdv3-tabs {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    min-width: 0;
    overflow: visible;
  }
  .ds4-projects-module.pdv3 .pdv3-tabs a {
    width: 100%;
    min-width: 0;
  }

  .ds4-projects-module.pdv3 .pdv3-actions {
    grid-template-columns: 1fr;
    width: 100%;
    min-width: 0;
  }

  .ds4-projects-module.pdv3 :is(.pdv3-card,.pdv3-overview,.pdv3-list,.pdv3-list-row,.pdv3-details) {
    min-width: 0;
    max-width: 100%;
  }
}

@media (max-width: 380px) {
  .ds4-projects-module.pdv3 .pdv3-kpis {
    grid-template-columns: 1fr;
  }
}


/* DS4 Admin Project Detail - complete mobile table/card correction */
@media (max-width: 760px) {
  .ds4-projects-module.pdv3 .pdv3-table-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
  }
  .ds4-projects-module.pdv3 .pdv3-table-wrap .pdv3-table,
  .ds4-projects-module.pdv3 .pdv3-table-wrap .pdv3-table tbody {
    display: block;
    width: 100%;
    min-width: 0;
  }
  .ds4-projects-module.pdv3 .pdv3-table-wrap .pdv3-table thead { display:none; }
  .ds4-projects-module.pdv3 .pdv3-table-wrap .pdv3-table tbody { display:grid; gap:10px; }
  .ds4-projects-module.pdv3 .pdv3-table-wrap .pdv3-table tr {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px 12px;
    width:100%;
    min-width:0;
    padding:13px;
    border:1px solid #e7e9ef;
    border-radius:14px;
    background:#fff;
  }
  .ds4-projects-module.pdv3 .pdv3-table-wrap .pdv3-table td {
    display:block;
    min-width:0;
    padding:0;
    border:0;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    overflow-wrap:anywhere;
    text-align:left;
  }
  .ds4-projects-module.pdv3 .pdv3-table-wrap .pdv3-table td::before {
    display:block;
    margin-bottom:3px;
    color:#667085;
    font-size:8px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
  }
  .ds4-projects-module.pdv3 .pdv3-person { min-width:0; }
  .ds4-projects-module.pdv3 .pdv3-person strong { overflow-wrap:anywhere; }

  /* Members */
  .pdv3-table-wrap--members tr { grid-template-areas:"member status" "phone phone" "joined action"; }
  .pdv3-table-wrap--members td:nth-child(1){grid-area:member}.pdv3-table-wrap--members td:nth-child(2){grid-area:phone}.pdv3-table-wrap--members td:nth-child(3){grid-area:status;justify-self:end}.pdv3-table-wrap--members td:nth-child(4){grid-area:joined}.pdv3-table-wrap--members td:nth-child(5){grid-area:action;justify-self:end}
  .pdv3-table-wrap--members td:nth-child(2)::before{content:"Phone"}.pdv3-table-wrap--members td:nth-child(4)::before{content:"Joined"}

  /* Assets */
  .pdv3-table-wrap--assets tr { grid-template-areas:"asset status" "reference reference" "cost assigned" "action action"; }
  .pdv3-table-wrap--assets td:nth-child(1){grid-area:asset}.pdv3-table-wrap--assets td:nth-child(2){grid-area:reference}.pdv3-table-wrap--assets td:nth-child(3){grid-area:cost}.pdv3-table-wrap--assets td:nth-child(4){grid-area:status;justify-self:end}.pdv3-table-wrap--assets td:nth-child(5){grid-area:assigned}.pdv3-table-wrap--assets td:nth-child(6){grid-area:action;justify-self:end}
  .pdv3-table-wrap--assets td:nth-child(2)::before{content:"Reference"}.pdv3-table-wrap--assets td:nth-child(3)::before{content:"Purchase cost"}.pdv3-table-wrap--assets td:nth-child(5)::before{content:"Assigned"}

  /* Finance */
  .pdv3-table-wrap--finance tr { grid-template-areas:"person status" "phone phone" "amount ref" "submitted submitted"; }
  .pdv3-table-wrap--finance td:nth-child(1){grid-area:person}.pdv3-table-wrap--finance td:nth-child(2){grid-area:phone}.pdv3-table-wrap--finance td:nth-child(3){grid-area:amount}.pdv3-table-wrap--finance td:nth-child(4){grid-area:status;justify-self:end}.pdv3-table-wrap--finance td:nth-child(5){grid-area:ref}.pdv3-table-wrap--finance td:nth-child(6){grid-area:submitted}
  .pdv3-table-wrap--finance td:nth-child(2)::before{content:"Phone"}.pdv3-table-wrap--finance td:nth-child(3)::before{content:"Amount"}.pdv3-table-wrap--finance td:nth-child(5)::before{content:"Reference"}.pdv3-table-wrap--finance td:nth-child(6)::before{content:"Submitted"}

  /* Activity */
  .pdv3-table-wrap--activity tr { grid-template-areas:"activity direction" "date date" "reason reason" "amount actor"; }
  .pdv3-table-wrap--activity td:nth-child(1){grid-area:date}.pdv3-table-wrap--activity td:nth-child(2){grid-area:activity}.pdv3-table-wrap--activity td:nth-child(3){grid-area:reason}.pdv3-table-wrap--activity td:nth-child(4){grid-area:direction;justify-self:end}.pdv3-table-wrap--activity td:nth-child(5){grid-area:amount}.pdv3-table-wrap--activity td:nth-child(6){grid-area:actor}
  .pdv3-table-wrap--activity td:nth-child(1)::before{content:"Date"}.pdv3-table-wrap--activity td:nth-child(3)::before{content:"Reason"}.pdv3-table-wrap--activity td:nth-child(5)::before{content:"Amount"}.pdv3-table-wrap--activity td:nth-child(6)::before{content:"Actor"}

  .ds4-projects-module.pdv3 .pdv3-modal .modal-dialog textarea,
  .ds4-projects-module.pdv3 .pdv3-modal .modal-dialog input,
  .ds4-projects-module.pdv3 .pdv3-modal .modal-dialog select { width:100%; min-width:0; box-sizing:border-box; }
}


/* Admin user detail — page-specific mobile responsiveness.
 * Override the generic DS4 summary carousel for this detail page. */
@media (max-width: 760px) {
    .admin-user-detail-v3.ds4-people-module .audv3-stats {
        display: grid;
        grid-template-columns: 1fr;
        overflow: visible;
        margin-inline: 0;
        padding: 0;
        gap: 10px;
    }

    .admin-user-detail-v3.ds4-people-module .audv3-stats article {
        flex: none;
        width: 100%;
        min-width: 0;
        min-height: 78px;
    }

    .admin-user-detail-v3 .audv3-hero,
    .admin-user-detail-v3 .audv3-hero__identity,
    .admin-user-detail-v3 .audv3-hero__copy {
        min-width: 0;
        max-width: 100%;
    }

    .admin-user-detail-v3 .audv3-hero__meta span {
        max-width: 100%;
        overflow-wrap: anywhere;
    }
}


/* 2026-09-13: consolidated user identity metadata */
.auv3-mobile-card__identity {
    min-width: 0;
    flex: 1 1 auto;
}

.auv3-mobile-card__identity-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem .45rem;
    margin-top: .2rem;
}

.auv3-mobile-card__identity-meta > span:first-child {
    min-width: 0;
    overflow-wrap: anywhere;
}

.auv3-mobile-card__identity-meta .auv3-role-pill,
.auv3-mobile-card__identity-meta .user-status-badge {
    flex: 0 0 auto;
    margin: 0;
}

@media (max-width: 640px) {
    .audv3-stats {
        grid-template-columns: 1fr;
    }
}

/* Phase 1 — Project finance semantic redesign */
.pdv3-finance-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.pdv3-finance-summary>div{padding:16px;border:1px solid var(--ds4-border,#e6e2e8);border-radius:14px;background:var(--ds4-surface-subtle,#faf9fb);display:grid;gap:4px}.pdv3-finance-summary span,.pdv3-finance-summary small{color:var(--ds4-text-muted,#667085)}.pdv3-finance-summary strong{font-size:1.15rem}.pdv3-finance-tabs{display:flex;gap:6px;overflow-x:auto;padding:4px;background:#fff;border:1px solid var(--ds4-border,#e6e2e8);border-radius:14px;margin:14px 0}.pdv3-finance-tabs a{white-space:nowrap;padding:10px 14px;border-radius:10px;text-decoration:none;color:var(--ds4-text-muted,#667085);font-weight:700}.pdv3-finance-tabs a.is-active{background:var(--ds4-primary-soft,#f4edf5);color:var(--ds4-primary,#6f2b72)}.pdv3-finance-overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.pdv3-cell-meta{display:block;margin-top:3px;color:var(--ds4-text-muted,#667085)}
@media(max-width:760px){.pdv3-finance-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.pdv3-finance-overview{grid-template-columns:1fr}.pdv3-finance-tabs{margin-inline:0}}
@media(max-width:420px){.pdv3-finance-summary{grid-template-columns:1fr 1fr;gap:8px}.pdv3-finance-summary>div{padding:12px}.pdv3-finance-summary strong{font-size:1rem}}
\n\n/* 2026-09-27: Admin directory identity/status cleanup */
.auv3-table td:nth-child(5) { overflow: visible; }
.auv3-table td:nth-child(5) .user-status-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    position: relative !important;
    inset: auto !important;
}
.auv3-table td:nth-child(5) .user-status-icon::before,
.auv3-table td:nth-child(5) .user-status-icon::after { content: none !important; display: none !important; }
.auv3-table td:nth-child(5) .user-status-icon > iconify-icon {
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    font-size: 16px !important;
    line-height: 1 !important;
    margin: 0 !important;
    position: static !important;
    transform: none !important;
}
.auv3-phone-cell { display: grid; gap: 2px; min-width: 0; }
.auv3-phone-cell strong { color: #344054; font-size: 12px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.auv3-phone-cell small { color: #667085; font-size: 10px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.auv3-mobile-uid { color: #667085; font-size: 10px; font-weight: 600; line-height: 1.25; }

/* 2026-09-28 project mobile action refinements */
@media (max-width:760px){
 .ds4-projects-module .apv3-mobile-card>header{position:relative;padding-right:66px;grid-template-columns:auto 36px minmax(0,1fr)!important}
 .ds4-projects-module .apv3-mobile-card>header .request-status{position:absolute;top:0;right:0;grid-column:auto!important;justify-self:auto!important}
 .ds4-projects-module .apv3-mobile-card__actions{display:flex!important;justify-content:flex-end;margin-top:6px}
 .ds4-projects-module .apv3-mobile-card__actions .apv3-action-menu{width:auto;min-width:108px}
 .ds4-projects-module .apv3-mobile-card__actions .apv3-action-menu>summary{min-height:38px;display:flex;align-items:center;justify-content:center;gap:5px;padding:0 11px;border:1px solid rgba(var(--primary-rgb),.16);border-radius:9px;color:var(--primary-dark);font-weight:800;list-style:none}
 .ds4-projects-module.pdv3 .pdv3-tabs{grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;padding:5px}
 .ds4-projects-module.pdv3 .pdv3-tabs a{min-height:38px;flex-direction:column;gap:2px;font-size:8px;padding:4px 2px}
 .ds4-projects-module.pdv3 .pdv3-tabs a iconify-icon{font-size:14px}
 .ds4-projects-module.pdv3 .pdv3-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:7px}
 .ds4-projects-module.pdv3 .pdv3-actions a,.ds4-projects-module.pdv3 .pdv3-actions button{min-height:38px;padding:6px 8px;font-size:9px;line-height:1.15}
 .ds4-projects-module.pdv3 .pdv3-actions>*:last-child:nth-child(odd){grid-column:1/-1}
}

/* ---- migrated from ds4-meetings-assets.css ---- */
/* Source: app/Views/admin/meetings.php */
.amv3 {
        display: grid;
        gap: 14px;
        width: 100%;
        max-width: none
    }

    .amv3-hero,
    .amv3-stats article,
    .amv3-tabs,
    .amv3-card {
        background: #fff;
        border: 1px solid rgba(var(--primary-rgb), .12);
        box-shadow: var(--shadow-card)
    }

    .amv3-hero {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 16px;
        padding: 18px;
        border-radius: 17px
    }

    .amv3-hero-main {
        display: flex;
        align-items: center;
        gap: 13px;
        min-width: 0
    }

    .amv3-hero-icon {
        width: 48px;
        height: 48px;
        display: grid;
        place-items: center;
        flex: 0 0 48px;
        border-radius: 13px;
        background: rgba(var(--primary-rgb), .09);
        color: var(--primary-dark);
        font-size: 22px
    }

    .amv3-hero h1 {
        margin: 2px 0 4px;
        font-size: clamp(24px, 3vw, 34px)
    }

    .amv3-hero p {
        margin: 0
    }

    .amv3-hero-actions,
    .amv3-toolbar,
    .filter-actions {
        display: flex;
        align-items: center;
        gap: 8px;
        flex-wrap: wrap
    }

    .amv3-stats {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 9px
    }

    .amv3-stats article {
        min-height: 92px;
        padding: 13px;
        border-radius: 13px;
        display: grid;
        align-content: center;
        gap: 4px
    }

    .amv3-stats article.is-blue {
        background: rgba(47, 128, 237, .07)
    }

    .amv3-stats article.is-green {
        background: rgba(24, 169, 87, .07)
    }

    .amv3-stats article.is-red {
        background: rgba(180, 35, 24, .06)
    }

    .amv3-stats article.is-purple {
        background: rgba(var(--primary-rgb), .05)
    }

    .amv3-stats span,
    .amv3-filters label>span,
    .amv3-create-form label>span {
        font-size: 9px;
        font-weight: 800;
        text-transform: uppercase;
        color: #667085
    }

    .amv3-stats strong {
        font-size: 18px
    }

    .amv3-stats small {
        font-size: 9px;
        color: #667085
    }

    .amv3-tabs {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 6px;
        padding: 6px;
        border-radius: 13px
    }

    .amv3-tabs a {
        min-height: 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        border-radius: 9px;
        text-decoration: none;
        color: #667085;
        font-size: 11px;
        font-weight: 800
    }

    .amv3-tabs a.is-active {
        background: rgba(var(--primary-rgb), .09);
        color: var(--primary-dark)
    }

    .amv3-tabs a span {
        min-width: 22px;
        height: 22px;
        display: grid;
        place-items: center;
        border-radius: 999px;
        background: #f2f4f7;
        font-size: 9px
    }

    .amv3-card {
        padding: 15px;
        border-radius: 16px
    }

    .amv3-head {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 14px;
        margin-bottom: 12px
    }

    .amv3-head h2 {
        margin: 2px 0 3px;
        font-size: 18px
    }

    .amv3-head p {
        margin: 0
    }

    .amv3-filters {
        display: grid;
        grid-template-columns: minmax(240px, 1.35fr) repeat(7, minmax(100px, .6fr)) auto;
        gap: 9px;
        align-items: end
    }

    .amv3-filters label {
        display: grid;
        gap: 5px;
        min-width: 0
    }

    .amv3-filters input,
    .amv3-filters select,
    .amv3-create-form input,
    .amv3-create-form select,
    .amv3-create-form textarea {
        min-height: 40px;
        font-size: 11px
    }

    .amv3-filters .search>div {
        position: relative
    }

    .amv3-filters .search iconify-icon {
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        color: #98a2b3
    }

    .amv3-filters .search input {
        width: 100%;
        padding-left: 36px !important
    }

    .filter-actions>span {
        font-size: 10px;
        font-weight: 700;
        color: #667085
    }

    .amv3-toolbar {
        justify-content: flex-end
    }

    .amv3-toolbar .button-primary:disabled {
        opacity: .52
    }

    .amv3-selection {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 8px;
        font-size: 10px;
        font-weight: 700;
        color: #667085
    }

    .amv3-table-wrap {
        overflow-x: auto
    }

    .amv3-table {
        width: 100%;
        min-width: 1100px;
        table-layout: fixed;
        border-collapse: collapse
    }

    .amv3-table col.select {
        width: 46px
    }

    .amv3-table col.meeting {
        width: 31%
    }

    .amv3-table col.date {
        width: 140px
    }

    .amv3-table col.time {
        width: 120px
    }

    .amv3-table col.type,
    .amv3-table col.attendance,
    .amv3-table col.status {
        width: 125px
    }

    .amv3-table col.actions {
        width: 54px
    }

    .amv3-table th,
    .amv3-table td {
        padding: 10px 9px;
        border-bottom: 1px solid #edf0f4;
        text-align: left;
        vertical-align: middle
    }

    .amv3-table th {
        background: #f8fafc;
        font-size: 9px;
        text-transform: uppercase;
        color: #667085
    }

    .amv3-table th:first-child,
    .amv3-table td:first-child,
    .amv3-table th:last-child,
    .amv3-table td:last-child {
        text-align: center
    }

    .meeting-cell {
        display: flex;
        align-items: center;
        gap: 10px;
        min-width: 0
    }

    .meeting-cell>span {
        width: 38px;
        height: 38px;
        display: grid;
        place-items: center;
        flex: 0 0 38px;
        border-radius: 10px;
        background: rgba(var(--primary-rgb), .08);
        color: var(--primary-dark)
    }

    .meeting-cell>div,
    .date-cell {
        display: grid;
        gap: 2px;
        min-width: 0
    }

    .meeting-cell strong,
    .meeting-cell small,
    .date-cell strong,
    .date-cell small {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .meeting-cell small,
    .date-cell small {
        font-size: 9px;
        color: #667085
    }

    .time-cell {
        white-space: nowrap;
        font-size: 11px
    }

    .type-pill,
    .attendance-pill {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 5px 8px;
        border-radius: 999px;
        font-size: 9px;
        font-weight: 800;
        white-space: nowrap
    }

    .type-pill,
    .attendance-pill.locked {
        background: #f2f4f7;
        color: #475467
    }

    .attendance-pill.open {
        background: rgba(24, 169, 87, .08);
        color: #087443
    }

    .row-actions {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .action-menu {
        position: relative;
        z-index: 60;
    }

    .action-menu > summary {
        width: 34px;
        height: 34px;
        display: inline-grid;
        place-items: center;
        padding: 0;
        border: 1px solid rgba(var(--primary-rgb), .14);
        border-radius: 8px;
        background: #fff;
        color: var(--primary-dark);
        list-style: none;
        cursor: pointer;
        transition:
            border-color .18s ease,
            background-color .18s ease,
            box-shadow .18s ease;
    }

    .action-menu > summary:hover,
    .action-menu[open] > summary {
        border-color: rgba(var(--primary-rgb), .30);
        background: rgba(var(--primary-rgb), .06);
        box-shadow: 0 5px 14px rgba(15, 23, 42, .08);
    }

    .action-menu > summary::-webkit-details-marker {
        display: none;
    }

    .action-menu > summary::marker {
        content: "";
    }

    .action-menu-panel {
        display: none;
        position: fixed;
        left: var(--menu-left, auto);
        top: var(--menu-top, auto);
        z-index: 99999;
        width: 184px;
        padding: 6px;
        border: 1px solid rgba(var(--primary-rgb), .14);
        border-radius: 11px;
        background: #fff;
        box-shadow: 0 18px 42px rgba(15, 23, 42, .20);
    }

    .action-menu[open] > .action-menu-panel {
        display: grid;
        gap: 2px;
    }

    .action-menu-panel a {
        min-height: 38px;
        display: grid;
        grid-template-columns: 20px minmax(0, 1fr);
        align-items: center;
        gap: 8px;
        padding: 0 10px;
        border-radius: 8px;
        text-decoration: none;
        color: #344054;
        font-size: 11px;
        font-weight: 700;
        white-space: nowrap;
    }

    .action-menu-panel a iconify-icon {
        color: var(--primary-dark);
        font-size: 16px;
    }

    .action-menu-panel a:hover,
    .action-menu-panel a:focus-visible {
        background: rgba(var(--primary-rgb), .06);
        color: var(--primary-dark);
        outline: none;
    }

    .amv3-table tr.filtered {
        display: none
    }

    .amv3-pagination {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        margin-top: 13px
    }

    .amv3-pagination>span {
        font-size: 10px;
        font-weight: 700;
        color: #667085
    }

    .amv3-pagination>div {
        display: flex;
        gap: 7px
    }

    .amv3-create-form {
        display: grid;
        gap: 12px
    }

    .amv3-form-section {
        display: grid;
        gap: 12px;
        padding: 14px;
        border: 1px solid #edf0f4;
        border-radius: 13px
    }

    .amv3-form-section>header {
        display: flex;
        align-items: center;
        gap: 10px
    }

    .amv3-form-section>header>span {
        width: 38px;
        height: 38px;
        display: grid;
        place-items: center;
        border-radius: 10px;
        background: rgba(var(--primary-rgb), .08);
        color: var(--primary-dark)
    }

    .amv3-form-section h3 {
        margin: 0;
        font-size: 15px
    }

    .amv3-form-section p {
        margin: 2px 0 0;
        font-size: 10px;
        color: #667085
    }

    .amv3-form-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px
    }

    .amv3-form-grid label,
    .amv3-form-section>label {
        display: grid;
        gap: 5px
    }

    .amv3-form-grid .wide {
        grid-column: 1/-1
    }

    .amv3-form-actions {
        display: flex;
        justify-content: flex-end;
        gap: 8px
    }

    @media(max-width:1380px) {
        .amv3-stats {
            grid-template-columns: repeat(3, 1fr)
        }

        .amv3-filters {
            grid-template-columns: repeat(4, 1fr)
        }

        .amv3-filters .search {
            grid-column: span 2
        }

        .filter-actions {
            grid-column: span 4
        }
    }

    @media(max-width:900px) {
        .amv3-stats {
            grid-template-columns: repeat(2, 1fr)
        }

        .amv3-head {
            flex-direction: column
        }

        .amv3-toolbar {
            justify-content: flex-start
        }
    }

    @media(max-width:760px) {
        .amv3-hero {
            align-items: flex-start;
            flex-direction: column
        }

        .amv3-hero-actions,
        .amv3-toolbar,
        .filter-actions,
        .amv3-form-actions {
            width: 100%;
            display: grid;
            grid-template-columns: 1fr
        }

        .amv3-hero-actions a,
        .amv3-toolbar a,
        .amv3-toolbar button,
        .filter-actions a,
        .filter-actions button,
        .amv3-form-actions a,
        .amv3-form-actions button {
            width: 100%
        }

        .amv3-stats,
        .amv3-tabs,
        .amv3-filters,
        .amv3-form-grid {
            grid-template-columns: 1fr
        }

        .amv3-filters .search,
        .filter-actions,
        .amv3-form-grid .wide {
            grid-column: auto
        }

        .amv3-table {
            min-width: 900px
        }

        .amv3-pagination {
            align-items: stretch;
            flex-direction: column
        }
    }


/* Source: app/Views/admin/meeting_detail.php */
.meeting-detail-v3 {
    display: grid;
    gap: 14px;
    width: 100%;
}

.meeting-detail-v3__hero,
.meeting-detail-v3__stats article,
.meeting-detail-v3__tab-list,
.meeting-detail-v3__card {
    border: 1px solid rgba(var(--primary-rgb), .12);
    background: #fff;
    box-shadow: var(--shadow-card);
}

.meeting-detail-v3__hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px;
    border-radius: 17px;
}

.meeting-detail-v3__hero-main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 13px;
}

.meeting-detail-v3__hero-icon {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    flex: 0 0 50px;
    border-radius: 14px;
    background: rgba(var(--primary-rgb), .09);
    color: var(--primary-dark);
    font-size: 23px;
}

.meeting-detail-v3__hero-copy {
    min-width: 0;
}

.meeting-detail-v3__hero-copy h1 {
    margin: 2px 0 4px;
    color: #101828;
    font-size: clamp(24px, 3vw, 35px);
    line-height: 1.12;
}

.meeting-detail-v3__hero-copy > p:last-child {
    margin: 0;
    color: #667085;
    font-size: 11px;
}

.meeting-detail-v3__hero-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    flex-wrap: wrap;
}

.meeting-detail-v3__stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 9px;
}

.meeting-detail-v3__stats article {
    min-height: 88px;
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 13px;
    border-radius: 13px;
}

.meeting-detail-v3__stats article.is-blue {
    background: rgba(47, 128, 237, .07);
}

.meeting-detail-v3__stats article.is-green {
    background: rgba(24, 169, 87, .07);
}

.meeting-detail-v3__stats article.is-red {
    background: rgba(180, 35, 24, .06);
}

.meeting-detail-v3__stats article.is-purple {
    background: rgba(var(--primary-rgb), .06);
}

.meeting-detail-v3__stats span {
    color: #667085;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.meeting-detail-v3__stats strong {
    color: #101828;
    font-size: 18px;
}

.meeting-detail-v3__stats small {
    color: #667085;
    font-size: 9px;
    line-height: 1.35;
}

.meeting-detail-v3__tabs {
    display: grid;
    gap: 14px;
}

.meeting-detail-v3__tab-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    padding: 6px;
    border-radius: 13px;
}

.meeting-detail-v3__tab-list a {
    min-height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 9px;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
}

.meeting-detail-v3__tab-list a:hover {
    background: #f8fafc;
    color: var(--primary-dark);
}

.meeting-detail-v3__tab-list a.is-active {
    background: rgba(var(--primary-rgb), .09);
    color: var(--primary-dark);
}

.meeting-detail-v3__panel[hidden] {
    display: none !important;
}

.meeting-detail-v3__overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
}

.meeting-detail-v3__card {
    padding: 16px;
    border-radius: 16px;
}

.meeting-detail-v3__card-head {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin-bottom: 14px;
}

.meeting-detail-v3__card-head > span:first-child {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    flex: 0 0 40px;
    border-radius: 11px;
    background: rgba(var(--primary-rgb), .08);
    color: var(--primary-dark);
    font-size: 19px;
}

.meeting-detail-v3__card-head > div {
    min-width: 0;
}

.meeting-detail-v3__card-head h2 {
    margin: 2px 0 3px;
    color: #101828;
    font-size: 19px;
}

.meeting-detail-v3__card-head p {
    margin: 0;
    color: #667085;
    font-size: 10px;
}

.meeting-detail-v3__info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.meeting-detail-v3__info {
    display: grid;
    gap: 5px;
    min-height: 74px;
    padding: 11px;
    border: 1px solid #edf0f4;
    border-radius: 11px;
    background: #fafbfc;
}

.meeting-detail-v3__info > span,
.meeting-detail-v3__form label > span,
.meeting-detail-v3__correction-reason > span {
    color: #667085;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.meeting-detail-v3__info strong {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #344054;
    font-size: 11px;
    line-height: 1.35;
}

.meeting-detail-v3__meeting-link {
    margin-top: 11px;
}

.meeting-detail-v3__copy {
    min-height: 130px;
    padding: 13px;
    border: 1px solid #edf0f4;
    border-radius: 11px;
    background: #fafbfc;
    color: #475467;
    font-size: 11px;
    line-height: 1.65;
}

.meeting-detail-v3__danger {
    margin-top: 12px;
    border: 1px solid rgba(180, 35, 24, .12);
    border-radius: 11px;
    overflow: hidden;
}

.meeting-detail-v3__danger summary {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 12px;
    color: #b42318;
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
    list-style: none;
}

.meeting-detail-v3__danger summary::-webkit-details-marker {
    display: none;
}

.meeting-detail-v3__danger-form {
    display: grid;
    gap: 9px;
    padding: 11px;
    border-top: 1px solid rgba(180, 35, 24, .10);
}

.meeting-detail-v3__danger-form label,
.meeting-detail-v3__form label {
    display: grid;
    gap: 5px;
}

.meeting-detail-v3__form {
    display: grid;
    gap: 13px;
}

.meeting-detail-v3__form textarea {
    min-height: 190px;
}

.meeting-detail-v3__form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.meeting-detail-v3__attendance-head {
    position: relative;
}

.meeting-detail-v3__locked {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 9px;
    border-radius: 999px;
    background: #f2f4f7;
    color: #475467;
    font-size: 9px;
    font-weight: 800;
}

.meeting-detail-v3__attendance-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.meeting-detail-v3__attendance-option {
    position: relative;
    min-width: 0;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 26px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid #e4e7ec;
    border-radius: 11px;
    background: #fff;
    cursor: pointer;
}

.meeting-detail-v3__attendance-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.meeting-detail-v3__attendance-option:has(input:checked) {
    border-color: rgba(var(--primary-rgb), .38);
    background: rgba(var(--primary-rgb), .05);
}

.meeting-detail-v3__avatar {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    border-radius: 10px;
    background: rgba(var(--primary-rgb), .09);
    color: var(--primary-dark);
    font-size: 12px;
    font-weight: 800;
}

.meeting-detail-v3__member-copy,
.meeting-detail-v3__member > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.meeting-detail-v3__member-copy strong,
.meeting-detail-v3__member strong {
    overflow: hidden;
    color: #344054;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.meeting-detail-v3__member-copy small,
.meeting-detail-v3__member small {
    color: #667085;
    font-size: 8px;
}

.meeting-detail-v3__check {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid #d0d5dd;
    border-radius: 7px;
    color: transparent;
}

.meeting-detail-v3__attendance-option:has(input:checked)
.meeting-detail-v3__check {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
}

.meeting-detail-v3__warning {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 11px;
    border-radius: 10px;
    background: #fffaeb;
    color: #93370d;
    font-size: 9px;
    font-weight: 700;
}

.meeting-detail-v3__attendance-list,
.meeting-detail-v3__correction-list {
    display: grid;
    gap: 8px;
}

.meeting-detail-v3__attendance-row {
    display: grid;
    grid-template-columns: minmax(170px, 1fr) auto auto minmax(240px, 1.4fr);
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 1px solid #edf0f4;
    border-radius: 11px;
    background: #fff;
}

.meeting-detail-v3__member {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 9px;
}

.meeting-detail-v3__attendance-status,
.meeting-detail-v3__correction-state,
.meeting-detail-v3__effective-state {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 800;
    white-space: nowrap;
}

.meeting-detail-v3__attendance-status.is-present {
    background: rgba(24, 169, 87, .09);
    color: #087443;
}

.meeting-detail-v3__attendance-status.is-absent {
    background: rgba(180, 35, 24, .08);
    color: #b42318;
}

.meeting-detail-v3__correction-state {
    background: #fffaeb;
    color: #93370d;
}

.meeting-detail-v3__effective-state {
    background: #eff8ff;
    color: #175cd3;
}

.meeting-detail-v3__correction-form {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px;
    align-items: center;
    gap: 7px;
}

.meeting-detail-v3__comment {
    position: relative;
}

.meeting-detail-v3__comment iconify-icon {
    position: absolute;
    left: 11px;
    top: 50%;
    transform: translateY(-50%);
    color: #98a2b3;
}

.meeting-detail-v3__comment input {
    width: 100%;
    min-height: 36px;
    padding-left: 34px !important;
    font-size: 9px;
}

.meeting-detail-v3__notify {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(var(--primary-rgb), .16);
    border-radius: 9px;
    background: #fff;
    color: var(--primary-dark);
    cursor: pointer;
}

.meeting-detail-v3__correction-card {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid #edf0f4;
    border-radius: 11px;
}

.meeting-detail-v3__correction-card > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.meeting-detail-v3__correction-card header strong {
    color: #344054;
    font-size: 11px;
}

.meeting-detail-v3__correction-card header p {
    margin: 3px 0 0;
    color: #667085;
    font-size: 9px;
}

.meeting-detail-v3__correction-reason {
    display: grid;
    gap: 4px;
    padding: 10px;
    border-radius: 9px;
    background: #fafbfc;
}

.meeting-detail-v3__correction-reason p {
    margin: 0;
    color: #475467;
    font-size: 10px;
    line-height: 1.5;
}

.meeting-detail-v3__decision-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 9px;
}

.meeting-detail-v3__decision-grid form {
    display: grid;
    gap: 7px;
}

@media (max-width: 1180px) {
    .meeting-detail-v3__stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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

    .meeting-detail-v3__attendance-row {
        grid-template-columns: minmax(180px, 1fr) auto auto;
    }

    .meeting-detail-v3__correction-form {
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    .meeting-detail-v3__hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .meeting-detail-v3__hero-actions {
        width: 100%;
        justify-content: space-between;
    }

    .meeting-detail-v3__overview-grid {
        grid-template-columns: 1fr;
    }

    .meeting-detail-v3__tab-list {
        overflow-x: auto;
        grid-template-columns: repeat(4, minmax(130px, 1fr));
    }
}

@media (max-width: 640px) {
    .meeting-detail-v3__hero-main {
        align-items: flex-start;
    }

    .meeting-detail-v3__hero-copy h1 {
        font-size: 24px;
    }

    .meeting-detail-v3__hero-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .meeting-detail-v3__hero-actions .button-secondary {
        width: 100%;
    }

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

    .meeting-detail-v3__info-grid,
    .meeting-detail-v3__attendance-grid,
    .meeting-detail-v3__decision-grid {
        grid-template-columns: 1fr;
    }

    .meeting-detail-v3__form-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .meeting-detail-v3__form-actions button {
        width: 100%;
    }

    .meeting-detail-v3__attendance-row {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .meeting-detail-v3__correction-form {
        grid-template-columns: minmax(0, 1fr) 36px;
    }
}

/* =========================================================
   Meeting attendance V3 table, filters and inline correction
   ========================================================= */

.meeting-detail-v3__attendance-controls {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.meeting-detail-v3__attendance-controls form {
    margin: 0;
}

.meeting-detail-v3__open {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 9px;
    border-radius: 999px;
    background: rgba(24, 169, 87, .09);
    color: #087443;
    font-size: 9px;
    font-weight: 800;
}

.meeting-attendance-v3__filters {
    display: grid;
    grid-template-columns:
        minmax(230px, 1.3fr)
        repeat(4, minmax(120px, .7fr))
        auto;
    align-items: end;
    gap: 9px;
    margin-bottom: 12px;
    padding: 12px;
    border: 1px solid #edf0f4;
    border-radius: 12px;
    background: #fafbfc;
}

.meeting-attendance-v3__filters label {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.meeting-attendance-v3__filters label > span {
    color: #667085;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.meeting-attendance-v3__filters input,
.meeting-attendance-v3__filters select {
    min-height: 38px;
    font-size: 10px;
}

.meeting-attendance-v3__filters .search > div {
    position: relative;
}

.meeting-attendance-v3__filters .search iconify-icon {
    position: absolute;
    left: 11px;
    top: 50%;
    transform: translateY(-50%);
    color: #98a2b3;
}

.meeting-attendance-v3__filters .search input {
    width: 100%;
    padding-left: 34px !important;
}

.meeting-attendance-v3__filter-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.meeting-attendance-v3__filter-actions > span {
    color: #667085;
    font-size: 9px;
    font-weight: 700;
    white-space: nowrap;
}

.meeting-attendance-v3__table-wrap {
    overflow-x: auto;
    border: 1px solid #edf0f4;
    border-radius: 12px;
}

.meeting-attendance-v3__table {
    width: 100%;
    min-width: 980px;
    table-layout: fixed;
    border-collapse: collapse;
}

.meeting-attendance-v3__table col.member {
    width: 25%;
}

.meeting-attendance-v3__table col.phone {
    width: 15%;
}

.meeting-attendance-v3__table col.status,
.meeting-attendance-v3__table col.reported {
    width: 13%;
}

.meeting-attendance-v3__table col.correction {
    width: 24%;
}

.meeting-attendance-v3__table col.actions {
    width: 90px;
}

.meeting-attendance-v3__table th,
.meeting-attendance-v3__table td {
    padding: 10px;
    border-bottom: 1px solid #edf0f4;
    text-align: left;
    vertical-align: middle;
}

.meeting-attendance-v3__table th {
    background: #f8fafc;
    color: #667085;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.meeting-attendance-v3__table th:last-child,
.meeting-attendance-v3__table td:last-child {
    text-align: center;
}

.meeting-attendance-v3__table tbody > tr:last-child > td {
    border-bottom: 0;
}

.meeting-attendance-v3__member {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 9px;
}

.meeting-attendance-v3__member > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.meeting-attendance-v3__member strong {
    overflow: hidden;
    color: #344054;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.meeting-attendance-v3__member small,
.meeting-attendance-v3__phone,
.meeting-attendance-v3__muted {
    color: #667085;
    font-size: 9px;
}

.meeting-attendance-v3__muted {
    color: #98a2b3;
}

.meeting-attendance-v3__actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.meeting-attendance-v3__actions form {
    margin: 0;
}

.meeting-attendance-v3__edit,
.meeting-attendance-v3__delete {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(var(--primary-rgb), .14);
    border-radius: 8px;
    background: #fff;
    color: var(--primary-dark);
    cursor: pointer;
}

.meeting-attendance-v3__edit:hover,
.meeting-attendance-v3__edit[aria-expanded="true"] {
    border-color: rgba(var(--primary-rgb), .35);
    background: rgba(var(--primary-rgb), .07);
}

.meeting-attendance-v3__delete {
    border-color: rgba(180, 35, 24, .16);
    color: #b42318;
}

.meeting-attendance-v3__delete:hover {
    background: rgba(180, 35, 24, .06);
}

.meeting-attendance-v3__correction-row td {
    padding: 0 10px 10px;
    background: #fafbfc;
}

.meeting-attendance-v3__correction-form {
    display: grid;
    grid-template-columns:
        minmax(200px, .8fr)
        minmax(260px, 1.4fr)
        auto
        auto;
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(var(--primary-rgb), .14);
    border-radius: 10px;
    background: #fff;
}

.meeting-attendance-v3__correction-form > div {
    display: grid;
    gap: 2px;
}

.meeting-attendance-v3__correction-form strong {
    color: #344054;
    font-size: 10px;
}

.meeting-attendance-v3__correction-form small {
    color: #667085;
    font-size: 8px;
}

.meeting-attendance-v3__correction-form label {
    position: relative;
}

.meeting-attendance-v3__correction-form label iconify-icon {
    position: absolute;
    left: 11px;
    top: 50%;
    transform: translateY(-50%);
    color: #98a2b3;
}

.meeting-attendance-v3__correction-form label input {
    width: 100%;
    min-height: 38px;
    padding-left: 34px !important;
    font-size: 9px;
}

.meeting-attendance-v3__table tr.is-filtered {
    display: none;
}

@media (max-width: 1100px) {
    .meeting-attendance-v3__filters {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .meeting-attendance-v3__filters .search {
        grid-column: span 2;
    }

    .meeting-attendance-v3__filter-actions {
        grid-column: span 3;
    }

    .meeting-attendance-v3__correction-form {
        grid-template-columns: 1fr 1.4fr;
    }

    .meeting-attendance-v3__correction-form button {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .meeting-detail-v3__attendance-controls {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }

    .meeting-detail-v3__attendance-controls form,
    .meeting-detail-v3__attendance-controls button {
        width: 100%;
    }

    .meeting-attendance-v3__filters {
        grid-template-columns: 1fr;
    }

    .meeting-attendance-v3__filters .search,
    .meeting-attendance-v3__filter-actions {
        grid-column: auto;
    }

    .meeting-attendance-v3__filter-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .meeting-attendance-v3__correction-form {
        grid-template-columns: 1fr;
    }
}


/* Source: app/Views/admin/attendance_reports.php */
.attendance-report-v3 {
    display: grid;
    gap: 14px;
    width: 100%;
}

.attendance-report-v3__hero,
.attendance-report-v3__stats article,
.attendance-report-v3__card,
.attendance-report-v3__performance {
    border: 1px solid rgba(var(--primary-rgb), .12);
    background: #fff;
    box-shadow: var(--shadow-card);
}

.attendance-report-v3__hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px;
    border-radius: 17px;
}

.attendance-report-v3__hero-main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 13px;
}

.attendance-report-v3__hero-icon {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    flex: 0 0 50px;
    border-radius: 14px;
    background: rgba(var(--primary-rgb), .09);
    color: var(--primary-dark);
    font-size: 23px;
}

.attendance-report-v3__hero h1 {
    margin: 2px 0 4px;
    color: #101828;
    font-size: clamp(25px, 3vw, 35px);
}

.attendance-report-v3__hero p {
    margin: 0;
    color: #667085;
    font-size: 11px;
}

.attendance-report-v3__hero-actions,
.attendance-report-v3__toolbar,
.attendance-report-v3__filter-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.attendance-report-v3__stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 9px;
}

.attendance-report-v3__stats article {
    min-height: 90px;
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 13px;
    border-radius: 13px;
}

.attendance-report-v3__stats article.is-blue {
    background: rgba(47, 128, 237, .07);
}

.attendance-report-v3__stats article.is-green {
    background: rgba(24, 169, 87, .07);
}

.attendance-report-v3__stats article.is-red {
    background: rgba(180, 35, 24, .06);
}

.attendance-report-v3__stats article.is-purple {
    background: rgba(var(--primary-rgb), .06);
}

.attendance-report-v3__stats span,
.attendance-report-v3__filters label > span,
.attendance-report-v3__status-block > span {
    color: #667085;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.attendance-report-v3__stats strong {
    color: #101828;
    font-size: 18px;
}

.attendance-report-v3__stats small {
    color: #667085;
    font-size: 9px;
}

.attendance-report-v3__card,
.attendance-report-v3__performance {
    padding: 15px;
    border-radius: 16px;
}

.attendance-report-v3__filters {
    display: grid;
    grid-template-columns:
        minmax(240px, 1.4fr)
        repeat(6, minmax(100px, .65fr))
        auto;
    gap: 9px;
    align-items: end;
}

.attendance-report-v3__filters label {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.attendance-report-v3__filters input,
.attendance-report-v3__filters select {
    min-height: 40px;
    font-size: 11px;
}

.attendance-report-v3__filters .search > div {
    position: relative;
}

.attendance-report-v3__filters .search iconify-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #98a2b3;
}

.attendance-report-v3__filters .search input {
    width: 100%;
    padding-left: 36px !important;
}

.attendance-report-v3__filter-actions > span {
    color: #667085;
    font-size: 9px;
    font-weight: 700;
}

.attendance-report-v3__section-head,
.attendance-report-v3__table-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 13px;
}

.attendance-report-v3__section-head h2,
.attendance-report-v3__table-head h2 {
    margin: 2px 0 3px;
    color: #101828;
    font-size: 19px;
}

.attendance-report-v3__section-head p,
.attendance-report-v3__table-head p {
    margin: 0;
    color: #667085;
    font-size: 10px;
}

.attendance-report-v3__section-head > span {
    padding: 6px 9px;
    border-radius: 999px;
    background: rgba(var(--primary-rgb), .08);
    color: var(--primary-dark);
    font-size: 9px;
    font-weight: 800;
    white-space: nowrap;
}

.attendance-report-v3__performance-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.attendance-report-v3__member-card {
    display: grid;
    gap: 9px;
    padding: 11px;
    border: 1px solid #edf0f4;
    border-radius: 12px;
    background: #fff;
}

.attendance-report-v3__member-main {
    min-width: 0;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
}

.attendance-report-v3__avatar {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    border-radius: 10px;
    background: rgba(var(--primary-rgb), .09);
    color: var(--primary-dark);
    font-size: 12px;
    font-weight: 800;
}

.attendance-report-v3__member-main > div,
.attendance-report-v3__member > div,
.attendance-report-v3__meeting > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.attendance-report-v3__member-main strong,
.attendance-report-v3__member strong,
.attendance-report-v3__meeting strong {
    overflow: hidden;
    color: #344054;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.attendance-report-v3__member-main small,
.attendance-report-v3__member small,
.attendance-report-v3__meeting small {
    color: #667085;
    font-size: 8px;
}

.attendance-report-v3__member-main b {
    color: #101828;
    font-size: 15px;
}

.attendance-report-v3__progress {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #f2f4f7;
}

.attendance-report-v3__progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #12b76a;
}

.attendance-report-v3__member-card.is-medium
.attendance-report-v3__progress span {
    background: #f79009;
}

.attendance-report-v3__member-card.is-low
.attendance-report-v3__progress span {
    background: #f04438;
}

.attendance-report-v3__record-list {
    display: grid;
    gap: 8px;
}

.attendance-report-v3__record {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.3fr)
        minmax(180px, 1fr)
        minmax(100px, .65fr)
        minmax(150px, .85fr)
        minmax(100px, .65fr)
        36px;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 1px solid #edf0f4;
    border-radius: 11px;
    background: #fff;
}

.attendance-report-v3__meeting,
.attendance-report-v3__member {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 9px;
}

.attendance-report-v3__meeting > span {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    border-radius: 10px;
    background: rgba(var(--primary-rgb), .08);
    color: var(--primary-dark);
}

.attendance-report-v3__status-block {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.attendance-report-v3__status,
.attendance-report-v3__muted {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #475467;
    font-size: 9px;
    font-weight: 800;
    white-space: nowrap;
}

.attendance-report-v3__status.is-present {
    color: #087443;
}

.attendance-report-v3__status.is-absent {
    color: #b42318;
}

.attendance-report-v3__status.is-correction {
    color: #93370d;
    white-space: normal;
}

.attendance-report-v3__muted {
    color: #98a2b3;
    font-weight: 650;
}

.attendance-report-v3__view {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(var(--primary-rgb), .14);
    border-radius: 8px;
    background: #fff;
    color: var(--primary-dark);
    text-decoration: none;
}

@media (max-width: 1380px) {
    .attendance-report-v3__filters {
        grid-template-columns: repeat(4, 1fr);
    }

    .attendance-report-v3__filters .search {
        grid-column: span 2;
    }

    .attendance-report-v3__filter-actions {
        grid-column: span 4;
    }

    .attendance-report-v3__performance-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .attendance-report-v3__record {
        grid-template-columns:
            minmax(220px, 1.3fr)
            minmax(180px, 1fr)
            repeat(3, minmax(100px, .7fr))
            36px;
    }
}

@media (max-width: 980px) {
    .attendance-report-v3__stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .attendance-report-v3__record {
        grid-template-columns:
            minmax(220px, 1fr)
            minmax(180px, 1fr)
            repeat(2, minmax(100px, .7fr));
    }

    .attendance-report-v3__status-block:nth-of-type(4),
    .attendance-report-v3__view {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    .attendance-report-v3__hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .attendance-report-v3__hero-actions,
    .attendance-report-v3__toolbar,
    .attendance-report-v3__filter-actions {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
    }

    .attendance-report-v3__hero-actions a,
    .attendance-report-v3__toolbar a,
    .attendance-report-v3__filter-actions a,
    .attendance-report-v3__filter-actions button {
        width: 100%;
    }

    .attendance-report-v3__stats,
    .attendance-report-v3__filters,
    .attendance-report-v3__performance-grid {
        grid-template-columns: 1fr;
    }

    .attendance-report-v3__filters .search,
    .attendance-report-v3__filter-actions {
        grid-column: auto;
    }

    .attendance-report-v3__section-head,
    .attendance-report-v3__table-head {
        flex-direction: column;
    }

    .attendance-report-v3__record {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .attendance-report-v3__view {
        justify-self: end;
    }
}


/* Source: app/Views/meetings/index.php */
.meeting-member-v3 {
        display: grid;
        gap: 16px;
    }

    .meeting-v3-hero {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        padding: 20px;
        border: 1px solid rgba(var(--primary-rgb), 0.12);
        border-radius: 17px;
        background: #fff;
        box-shadow: var(--shadow-card);
    }

    .meeting-v3-hero h1 {
        margin: 2px 0 5px;
    }

    .meeting-v3-hero p {
        margin-bottom: 0;
    }

    .meeting-v3-filter-toggle {
        min-height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 0 14px;
        border: 1px solid rgba(var(--primary-rgb), 0.16);
        border-radius: 11px;
        background: #fff;
        color: var(--primary-dark);
        cursor: pointer;
        font: inherit;
        font-weight: 700;
    }

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

    .meeting-v3-summary article {
        display: grid;
        gap: 5px;
        padding: 14px;
        border: 1px solid rgba(var(--primary-rgb), 0.10);
        border-radius: 14px;
        background: #fff;
    }

    .meeting-v3-summary span {
        color: #667085;
        font-size: 12px;
        font-weight: 700;
    }

    .meeting-v3-summary strong {
        color: var(--primary-dark);
        font-size: 24px;
        line-height: 1;
    }

    .meeting-v3-filter-panel {
        padding: 14px;
        border: 1px solid rgba(var(--primary-rgb), 0.12);
        border-radius: 14px;
        background: #fff;
    }

    .meeting-v3-filter-form {
        display: grid;
        grid-template-columns: minmax(130px, .5fr) minmax(180px, 1fr) auto auto;
        gap: 10px;
        align-items: end;
    }

    .meeting-v3-filter-form .button-primary,
    .meeting-v3-filter-form .button-secondary {
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding: 0 14px;
    }

    .meeting-v3-list {
        display: grid;
        gap: 9px;
    }

    .meeting-v3-card {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 13px;
        padding: 14px;
        border: 1px solid #e7eaf0;
        border-radius: 15px;
        background: #fff;
    }

    .meeting-v3-date {
        width: 54px;
        min-height: 62px;
        display: grid;
        place-items: center;
        align-content: center;
        border-radius: 13px;
        background: rgba(var(--primary-rgb), 0.09);
        color: var(--primary-dark);
    }

    .meeting-v3-date span {
        font-size: 11px;
        font-weight: 800;
        text-transform: uppercase;
    }

    .meeting-v3-date strong {
        font-size: 25px;
        line-height: 1;
    }

    .meeting-v3-main {
        min-width: 0;
        display: grid;
        gap: 8px;
    }

    .meeting-v3-title-row {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
    }

    .meeting-v3-title-row h2 {
        margin: 2px 0 0;
        font-size: 17px;
    }

    .meeting-v3-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 7px 14px;
        color: #667085;
        font-size: 12px;
    }

    .meeting-v3-meta span {
        display: inline-flex;
        align-items: center;
        gap: 5px;
    }

    .meeting-v3-actions {
        display: flex;
        align-items: center;
        gap: 7px;
    }

    .meeting-v3-icon-action {
        width: 39px;
        height: 39px;
        display: grid;
        place-items: center;
        padding: 0;
        border: 1px solid rgba(var(--primary-rgb), 0.14);
        border-radius: 10px;
        background: #fff;
        color: var(--primary-dark);
        cursor: pointer;
        font-size: 18px;
    }

    .meeting-v3-icon-action.is-primary {
        border-color: var(--primary);
        background: var(--primary);
        color: #fff;
    }

    .meeting-v3-details {
        grid-column: 1 / -1;
        display: grid;
        gap: 12px;
        padding: 14px;
        border-top: 1px solid #edf0f4;
        background: #fbfbfd;
        border-radius: 0 0 12px 12px;
    }

    .meeting-v3-details[hidden] {
        display: none !important;
    }

    .meeting-v3-detail-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
    }

    .meeting-v3-detail-grid div {
        display: grid;
        gap: 3px;
        padding: 10px;
        border-radius: 10px;
        background: #fff;
    }

    .meeting-v3-detail-grid span,
    .meeting-v3-detail-block > span {
        color: #667085;
        font-size: 11px;
        font-weight: 800;
        text-transform: uppercase;
    }

    .meeting-v3-detail-grid strong {
        font-size: 13px;
    }

    .meeting-v3-detail-block {
        display: grid;
        gap: 5px;
    }

    .meeting-v3-detail-block p {
        margin: 0;
        color: #344054;
        line-height: 1.55;
    }

    .meeting-v3-pagination {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-top: 14px;
    }

    .meeting-v3-pagination div {
        display: flex;
        gap: 8px;
    }

    .meeting-v3-empty {
        min-height: 170px;
        display: grid;
        place-content: center;
        text-align: center;
    }

    @media (max-width: 760px) {
        .meeting-v3-filter-form {
            grid-template-columns: 1fr 1fr;
        }

        .meeting-v3-card {
            grid-template-columns: auto minmax(0, 1fr) auto;
            padding: 12px;
        }

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

    @media (max-width: 560px) {
        .meeting-v3-hero {
            align-items: stretch;
            flex-direction: column;
            padding: 16px;
        }

        .meeting-v3-filter-toggle {
            width: 100%;
        }

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

        .meeting-v3-summary article {
            padding: 11px;
        }

        .meeting-v3-summary strong {
            font-size: 20px;
        }

        .meeting-v3-filter-form {
            grid-template-columns: 1fr;
        }

        .meeting-v3-card {
            grid-template-columns: auto minmax(0, 1fr);
            gap: 10px;
        }

        .meeting-v3-actions {
            grid-column: 1 / -1;
            justify-content: flex-end;
        }

        .meeting-v3-title-row {
            flex-direction: column;
        }

        .meeting-v3-title-row .request-status {
            align-self: flex-start;
        }

        .meeting-v3-meta {
            display: grid;
            gap: 6px;
        }

        .meeting-v3-detail-grid {
            grid-template-columns: 1fr;
        }

        .meeting-v3-pagination {
            align-items: stretch;
            flex-direction: column;
        }

        .meeting-v3-pagination div {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }


/* Source: app/Views/admin/assets.php */
.admin-assets-v3{width:100%;max-width:none;display:grid;gap:14px}
.aav3-hero,.aav3-summary article,.aav3-tabs,.aav3-form-panel,.aav3-filter-card,.aav3-records{border:1px solid rgba(var(--primary-rgb),.12);background:#fff;box-shadow:var(--shadow-card)}
.aav3-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;border-radius:17px}
.aav3-hero__main{min-width:0;display:flex;align-items:center;gap:13px}
.aav3-hero__icon{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:13px;background:rgba(var(--primary-rgb),.09);color:var(--primary-dark);font-size:22px}
.aav3-hero h1{margin:2px 0 4px;font-size:clamp(24px,3vw,34px)}
.aav3-hero p{margin-bottom:0}
.aav3-hero__actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.aav3-pending-pill{min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0 13px;border-radius:999px;background:rgba(224,149,15,.10);color:#9a5b00;font-size:11px;font-weight:800;white-space:nowrap}
.aav3-summary{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.aav3-summary article{min-height:92px;display:grid;align-content:center;gap:4px;padding:13px;border-radius:13px}
.aav3-summary .is-success{background:rgba(24,169,87,.07);border-color:rgba(24,169,87,.18)}
.aav3-summary .is-warning{background:rgba(224,149,15,.07);border-color:rgba(224,149,15,.20)}
.aav3-summary .is-money,.aav3-summary .is-income{background:rgba(var(--primary-rgb),.05)}
.aav3-summary span,.aav3-asset-form label>span,.aav3-filter-form label>span,.aav3-modal label>span,.aav3-modal__income-summary span,.aav3-modal__summary span{color:#667085;font-size:9px;font-weight:800;letter-spacing:.03em;text-transform:uppercase}
.aav3-summary strong{color:#101828;font-size:18px}
.aav3-summary small{color:#667085;font-size:9px}
.aav3-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:6px;border-radius:13px}
.aav3-tabs a{min-height:42px;display:flex;align-items:center;justify-content:center;gap:7px;border-radius:9px;color:#667085;font-size:11px;font-weight:800;text-decoration:none}
.aav3-tabs a span{min-width:22px;height:22px;display:inline-grid;place-items:center;border-radius:999px;background:#f2f4f7;font-size:9px}
.aav3-tabs a.is-active{background:rgba(var(--primary-rgb),.09);color:var(--primary-dark)}
.aav3-form-panel,.aav3-filter-card,.aav3-records{padding:15px;border-radius:16px}
.aav3-form-panel[hidden]{display:none!important}
.aav3-section-head,.aav3-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.aav3-section-head{margin-bottom:12px}.aav3-toolbar{margin-bottom:10px}
.aav3-section-head h2,.aav3-toolbar h2{margin:2px 0 3px;font-size:18px}
.aav3-section-head p,.aav3-toolbar p{margin-bottom:0}
.aav3-close-button,.aav3-modal__close{width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(var(--primary-rgb),.14);border-radius:9px;background:#fff;color:var(--primary-dark);cursor:pointer}
.aav3-asset-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.aav3-asset-form label{display:grid;gap:5px}.aav3-form-wide{grid-column:1/-1}
.aav3-asset-form input,.aav3-asset-form textarea,.aav3-filter-form input,.aav3-filter-form select,.aav3-modal select{min-height:40px;font-size:11px}
.aav3-upload-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.aav3-upload-card{position:relative;min-height:145px;display:grid!important;place-items:center;align-content:center;gap:5px;padding:14px;border:1px dashed rgba(var(--primary-rgb),.22);border-radius:12px;background:#fafbfc;text-align:center;cursor:pointer}
.aav3-upload-card input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.aav3-upload-icon{font-size:24px;color:var(--primary-dark)}
.aav3-upload-card small,.aav3-upload-card em{color:#667085;font-size:9px}.aav3-upload-card em{font-style:normal}
.aav3-bank-check{display:flex!important;align-items:center;gap:9px;padding:10px;border-radius:10px;background:#f8f9fb}
.aav3-bank-check input{min-height:auto}.aav3-form-actions{display:flex;justify-content:flex-end;gap:8px}
.aav3-filter-form{display:grid;grid-template-columns:minmax(260px,1.45fr) minmax(150px,.7fr) minmax(170px,.8fr) minmax(150px,.7fr) minmax(140px,.65fr) auto;align-items:end;gap:9px}
.aav3-filter-form label{min-width:0;display:grid;gap:5px}
.aav3-search-control{position:relative}.aav3-search-control iconify-icon{position:absolute;top:50%;left:12px;transform:translateY(-50%);color:#98a2b3}.aav3-search-control input{width:100%;padding-left:36px!important}
.aav3-filter-actions,.aav3-toolbar__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.aav3-filter-actions>span{color:#667085;font-size:10px;font-weight:700;white-space:nowrap}
.aav3-toolbar__actions{justify-content:flex-end}.aav3-toolbar__actions .button-primary:disabled{opacity:.52;cursor:not-allowed}
.aav3-selection-note{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;color:#667085;font-size:10px;font-weight:700}
.aav3-table-wrap{width:100%;overflow-x:auto}.aav3-table{width:100%;min-width:1080px;table-layout:fixed;border-collapse:collapse}
.aav3-table th,.aav3-table td{padding:10px 9px;border-bottom:1px solid #edf0f4;text-align:left;vertical-align:middle}
.aav3-table th{background:#f8fafc;color:#667085;font-size:9px;font-weight:800;text-transform:uppercase;white-space:nowrap}
.aav3-table td{color:#344054;font-size:11px}
.aav3-table th:first-child,.aav3-table td:first-child,.aav3-table th:last-child,.aav3-table td:last-child{text-align:center}
.aav3-identity-cell{display:flex;align-items:center;gap:9px;min-width:0}.aav3-identity-cell>span{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border-radius:10px;background:rgba(var(--primary-rgb),.08);color:var(--primary-dark)}.aav3-identity-cell>div,.aav3-person-cell{min-width:0;display:grid;gap:2px}.aav3-identity-cell strong,.aav3-identity-cell small,.aav3-person-cell strong,.aav3-person-cell small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.aav3-identity-cell small,.aav3-person-cell small{color:#667085;font-size:9px}
.aav3-bank-impact{font-size:10px;font-weight:700}.aav3-income-value{color:#087443}
.aav3-file-actions{display:flex;align-items:center;justify-content:center;gap:5px}
.aav3-icon-action,.aav3-action-menu>summary,.aav3-note-icon{width:34px;height:34px;display:inline-grid;place-items:center;border:1px solid rgba(var(--primary-rgb),.14);border-radius:8px;background:#fff;color:var(--primary-dark);text-decoration:none;cursor:pointer;list-style:none}
.aav3-action-menu{position:relative;display:inline-block}.aav3-action-menu>summary::-webkit-details-marker{display:none}
.aav3-action-menu>div{display:none;position:fixed;left:var(--aav3-menu-left,auto);top:var(--aav3-menu-top,auto);z-index:99999;min-width:165px;padding:6px;border:1px solid rgba(var(--primary-rgb),.12);border-radius:11px;background:#fff;box-shadow:0 18px 42px rgba(15,23,42,.20)}
.aav3-action-menu[open]>div{display:block}
.aav3-action-menu a,.aav3-action-menu button{width:100%;min-height:36px;display:flex;align-items:center;gap:8px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:#344054;font:inherit;font-size:11px;font-weight:700;text-align:left;text-decoration:none;cursor:pointer}.aav3-action-menu a:hover,.aav3-action-menu button:hover{background:#f6f7f9}.aav3-action-menu .is-approve{color:#087443}.aav3-action-menu .is-danger{color:#b42318}
.aav3-table tbody tr.is-filtered-out{display:none}
.aav3-modal{position:fixed;inset:0;z-index:10000}.aav3-modal[hidden]{display:none!important}
.aav3-modal__backdrop{position:absolute;inset:0;background:rgba(16,24,40,.42);backdrop-filter:blur(2px)}
.aav3-modal__dialog{position:relative;z-index:1;width:min(560px,calc(100% - 28px));margin:7vh auto 0;padding:16px;border:1px solid rgba(var(--primary-rgb),.12);border-radius:16px;background:#fff;box-shadow:0 24px 60px rgba(15,23,42,.25)}
.aav3-modal__dialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.aav3-modal__dialog h2{margin:2px 0 0;font-size:19px}
.aav3-modal form,.aav3-modal label,.aav3-review-form{display:grid;gap:8px}.aav3-review-form[hidden]{display:none!important}
.aav3-modal__summary{display:grid;gap:4px;padding:10px;margin-bottom:10px;border-radius:9px;background:#f8f9fb}
.aav3-modal__income-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:12px}.aav3-modal__income-summary>div{display:grid;gap:4px;padding:10px;border-radius:9px;background:#f8f9fb}
.aav3-modal__actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
.aav3-review-form textarea{min-height:100px;resize:vertical}
.aav3-danger-button{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 13px;border:0;border-radius:9px;background:#b42318;color:#fff;font:inherit;font-size:11px;font-weight:800;cursor:pointer}
body.aav3-modal-open{overflow:hidden}
@media(max-width:1280px){.aav3-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.aav3-filter-form{grid-template-columns:repeat(3,minmax(0,1fr))}.aav3-filter-search{grid-column:span 2}.aav3-filter-actions{grid-column:span 3}}
@media(max-width:900px){.aav3-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.aav3-toolbar{align-items:stretch;flex-direction:column}.aav3-toolbar__actions{justify-content:flex-start}}
@media(max-width:760px){.aav3-hero{align-items:flex-start;flex-direction:column}.aav3-hero__actions{width:100%;display:grid;grid-template-columns:1fr}.aav3-hero__actions .button-secondary,.aav3-pending-pill{width:100%}.aav3-summary,.aav3-tabs,.aav3-asset-form,.aav3-upload-grid,.aav3-filter-form{grid-template-columns:1fr}.aav3-form-wide,.aav3-filter-search,.aav3-filter-actions{grid-column:auto}.aav3-filter-actions,.aav3-toolbar__actions{display:grid;grid-template-columns:1fr}.aav3-filter-actions .button-primary,.aav3-filter-actions .button-secondary,.aav3-toolbar__actions .button-primary,.aav3-toolbar__actions .button-secondary{width:100%}.aav3-modal__income-summary{grid-template-columns:1fr}.aav3-modal__actions{display:grid;grid-template-columns:1fr}.aav3-modal__actions .button-primary,.aav3-modal__actions .button-secondary,.aav3-danger-button{width:100%}}


/* Source: app/Views/projects/assets.php */
.project-assets-page{display:grid;gap:18px}.project-assets-tabs{display:grid;gap:14px}.project-assets-tab-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:6px;border:1px solid rgba(var(--primary-rgb),.12);border-radius:15px;background:#fff;box-shadow:var(--shadow-card)}.project-assets-tab{min-width:0;min-height:48px;display:flex;align-items:center;justify-content:center;gap:9px;padding:0 14px;border:1px solid transparent;border-radius:11px;background:transparent;color:#667085;cursor:pointer;font:inherit;font-weight:700}.project-assets-tab b{min-width:24px;height:24px;display:grid;place-items:center;padding:0 6px;border-radius:999px;background:#eef1f5;color:#475467;font-size:12px}.project-assets-tab.is-active{border-color:rgba(var(--primary-rgb),.16);background:rgba(var(--primary-rgb),.10);color:var(--primary-dark)}.project-assets-tab.is-active b{background:#fff;color:var(--primary-dark)}.project-assets-pane{display:grid;gap:14px}.project-assets-pane[hidden]{display:none!important}.project-assets-pane-card{display:grid;gap:16px}.project-assets-pane-head h2{margin:3px 0 5px}.project-assets-pane-head p{margin-bottom:0}.member-asset-register{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.member-asset-register-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:12px;min-width:0;padding:14px;border:1px solid #e8eaf0;border-radius:14px;background:#fff}.member-asset-register-icon,.assigned-asset-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:rgba(var(--primary-rgb),.09);color:var(--primary-dark);font-size:21px}.member-asset-register-main{min-width:0;display:grid;gap:3px}.member-asset-register-main strong,.member-asset-register-main span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-asset-register-main span{color:#667085;font-size:13px}.member-asset-picture{width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(var(--primary-rgb),.14);border-radius:10px;background:#fff;color:var(--primary-dark)}.assigned-asset-list{display:grid;gap:10px}.assigned-asset-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;min-width:0;padding:15px;border:1px solid #e8eaf0;border-radius:15px;background:#fff}.assigned-asset-main{min-width:0;display:grid;gap:12px}.assigned-asset-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.assigned-asset-title-row h3{margin:0 0 3px;font-size:17px}.assigned-asset-title-row p{margin:0;color:#667085;font-size:13px}.assigned-asset-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.assigned-asset-meta span{display:grid;gap:3px;padding:9px 10px;border-radius:10px;background:#f8f9fb}.assigned-asset-meta small{color:#667085;font-size:11px;font-weight:700;text-transform:uppercase}.assigned-asset-meta strong{overflow:hidden;color:#101828;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.assigned-asset-actions{display:grid;gap:7px;min-width:132px}.asset-control-button{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 12px;border:1px solid rgba(var(--primary-rgb),.15);border-radius:10px;background:#fff;color:var(--primary-dark);cursor:pointer;font:inherit;font-size:12px;font-weight:700;text-decoration:none}.asset-control-button.is-primary{border-color:var(--primary);background:var(--primary);color:#fff}.asset-control-button:hover{transform:translateY(-1px)}.assigned-asset-returned{color:#667085;font-size:12px;text-align:right}.income-history-card{display:grid;gap:14px}.income-history-list{display:grid;gap:4px}.asset-action-modal{position:fixed;inset:0;z-index:1500;display:grid;place-items:center;padding:18px;background:rgba(17,24,39,.52);backdrop-filter:blur(5px)}.asset-action-modal[hidden]{display:none!important}.asset-action-modal-panel{width:min(100%,520px);max-height:calc(100vh - 36px);overflow-y:auto;padding:20px;border:1px solid rgba(var(--primary-rgb),.15);border-radius:18px;background:#fff;box-shadow:0 28px 80px rgba(17,24,39,.25)}.asset-action-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:18px}.asset-action-modal-head h2{margin:3px 0 4px}.asset-modal-close{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;padding:0;border:1px solid #e4e7ec;border-radius:10px;background:#fff;color:#475467;cursor:pointer}.asset-modal-actions{display:flex;justify-content:flex-end;gap:9px;padding-top:6px}.asset-modal-actions .button-primary,.asset-modal-actions .button-secondary{min-height:44px;padding:0 15px}@media(max-width:820px){.member-asset-register{grid-template-columns:1fr}.assigned-asset-card{grid-template-columns:auto minmax(0,1fr)}.assigned-asset-actions{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));min-width:0}}@media(max-width:640px){.project-assets-tab-list{grid-template-columns:1fr}.project-assets-tab{justify-content:flex-start}.member-asset-register-card{grid-template-columns:auto minmax(0,1fr) auto}.member-asset-register-card .request-status{grid-column:2;justify-self:start}.member-asset-picture{grid-column:3;grid-row:1/span 2}.assigned-asset-card{grid-template-columns:auto minmax(0,1fr);padding:12px}.assigned-asset-title-row{align-items:flex-start;flex-direction:column}.assigned-asset-meta{grid-template-columns:1fr}.assigned-asset-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.asset-control-button{min-height:44px}.asset-modal-actions{align-items:stretch;flex-direction:column-reverse}.asset-modal-actions .button-primary,.asset-modal-actions .button-secondary{width:100%}}


/* ============================================================
   DS4 Pack 4: Meetings + Assets responsive normalization
   ============================================================ */
.ds4-pack4 { --ds4-pack4-gap: var(--ds4-space-4, 16px); min-width:0; }
.ds4-pack4 :where(.amv3-hero,.meeting-v3-hero,.meeting-detail-v3__hero,.aav3-hero,.membership-head){gap:16px;align-items:flex-start}
.ds4-pack4 :where(.amv3-stats,.meeting-v3-summary,.aav3-stats){display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.ds4-pack4 :where(.amv3-card,.request-card,.meeting-detail-v3__card,.aav3-card){border-radius:var(--ds4-radius-lg,16px)}
.ds4-pack4 :where(table){width:100%}
.ds4-pack4 :where(.button-primary,.button-secondary,button,a){min-height:40px}
.ds4-pack4 iconify-icon{flex:0 0 auto}

/* Compact icon actions: keep accessible text for assistive tech, shorten visually on phones. */
@media (max-width: 767px){
 .ds4-pack4{padding-inline:0!important}
 .ds4-pack4 :where(.amv3-hero,.meeting-v3-hero,.meeting-detail-v3__hero,.aav3-hero,.membership-head){display:flex;flex-direction:column}
 .ds4-pack4 :where(.amv3-hero-actions,.meeting-detail-v3__hero-actions,.aav3-hero-actions){width:100%;display:flex;gap:8px;flex-wrap:wrap}
 .ds4-pack4 :where(.amv3-stats,.meeting-v3-summary,.aav3-stats){display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:4px;scrollbar-width:none}
 .ds4-pack4 :where(.amv3-stats,.meeting-v3-summary,.aav3-stats)::-webkit-scrollbar{display:none}
 .ds4-pack4 :where(.amv3-stats,.meeting-v3-summary,.aav3-stats)>*{min-width:132px;scroll-snap-align:start}
 .ds4-pack4 :where(.amv3-tabs,.project-assets-tab-list){overflow-x:auto;white-space:nowrap;scrollbar-width:none}
 .ds4-pack4 :where(.amv3-tabs,.project-assets-tab-list)::-webkit-scrollbar{display:none}
 .ds4-pack4 :where(.muted){line-height:1.45}
 .ds4-pack4 :where(.amv3-card,.request-card,.meeting-detail-v3__card,.aav3-card){padding:14px!important}
 .ds4-pack4 :where(input,select,textarea){font-size:16px}
 .ds4-pack4 :where(.table-wrap,.amv3-table-wrap,.aav3-table-wrap){overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media (min-width:768px) and (max-width:1100px){
 .ds4-pack4 :where(.amv3-stats,.meeting-v3-summary,.aav3-stats){grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:1101px){
 .ds4-pack4 :where(.amv3-stats,.meeting-v3-summary,.aav3-stats){grid-auto-flow:row}
}
@media (prefers-reduced-motion:reduce){.ds4-pack4 *{scroll-behavior:auto!important}}


/* ===== DS4 Member Meetings responsive correction ===== */
@media (max-width: 767px) {
  .meeting-member-v3.ds4-pack4 {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: clip;
    gap: 12px;
  }

  .meeting-member-v3.ds4-pack4 > *,
  .meeting-member-v3.ds4-pack4 form,
  .meeting-member-v3.ds4-pack4 input,
  .meeting-member-v3.ds4-pack4 select,
  .meeting-member-v3.ds4-pack4 button,
  .meeting-member-v3.ds4-pack4 a {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-hero {
    width: 100%;
    padding: 16px;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-hero h1 {
    font-size: clamp(1.8rem,8vw,2.25rem);
    line-height: 1.08;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-filter-toggle {
    width: 100%;
  }

  /* Override Pack 4 horizontal KPI carousel. */
  .meeting-member-v3.ds4-pack4 .meeting-v3-summary {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 9px !important;
    width: 100%;
    padding: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-summary > article {
    width: auto !important;
    min-width: 0 !important;
    padding: 12px !important;
    scroll-snap-align: none !important;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-summary span {
    font-size: .72rem;
    line-height: 1.2;
    white-space: normal;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-summary strong {
    font-size: 1.35rem;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-filter-panel {
    width: 100%;
    padding: 14px;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-filter-form {
    grid-template-columns: minmax(0,1fr) !important;
    width: 100%;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-filter-form :is(input,select,button,a) {
    width: 100%;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-list,
  .meeting-member-v3.ds4-pack4 .meeting-v3-card {
    width: 100%;
    min-width: 0;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-card {
    grid-template-columns: 58px minmax(0,1fr) !important;
    align-items: start;
    gap: 12px;
    padding: 14px;
    overflow: hidden;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-date {
    width: 54px;
    min-width: 54px;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-main,
  .meeting-member-v3.ds4-pack4 .meeting-v3-title-row > div {
    min-width: 0;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-title-row {
    flex-direction: column;
    gap: 8px;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-title-row h2 {
    max-width: 100%;
    font-size: clamp(1.05rem,5.4vw,1.35rem);
    line-height: 1.18;
    overflow-wrap: anywhere;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-title-row .request-status {
    align-self: flex-start;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-meta {
    display: grid;
    gap: 7px;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-meta span {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-actions {
    grid-column: 1 / -1 !important;
    width: 100%;
    justify-content: flex-end;
    padding-top: 4px;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-details {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
    padding: 12px;
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-detail-grid {
    grid-template-columns: minmax(0,1fr);
  }

  .meeting-member-v3.ds4-pack4 .meeting-v3-pagination {
    width: 100%;
  }
}

@media (max-width: 360px) {
  .meeting-member-v3.ds4-pack4 .meeting-v3-summary {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   UMOJA Admin Assets - mobile containment / responsive fix
   2026-08-03
   ============================================================ */
@media (max-width: 760px) {
    .admin-assets-v3,
    .admin-assets-v3 > *,
    .admin-assets-v3 .aav3-summary,
    .admin-assets-v3 .aav3-summary article,
    .admin-assets-v3 .aav3-tabs,
    .admin-assets-v3 .aav3-filter-card,
    .admin-assets-v3 .aav3-filter-form,
    .admin-assets-v3 .aav3-filter-form > *,
    .admin-assets-v3 .aav3-search-control,
    .admin-assets-v3 .aav3-records,
    .admin-assets-v3 .aav3-toolbar,
    .admin-assets-v3 .aav3-toolbar__actions {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    /* Keep the dashboard useful without creating a very tall single column. */
    .admin-assets-v3 .aav3-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .admin-assets-v3 .aav3-summary article {
        min-height: 96px;
        padding: 12px;
        overflow: hidden;
    }

    .admin-assets-v3 .aav3-summary strong,
    .admin-assets-v3 .aav3-summary small,
    .admin-assets-v3 .aav3-summary span {
        overflow-wrap: anywhere;
    }

    .admin-assets-v3 .aav3-summary strong {
        font-size: 16px;
    }

    /* Both tabs must remain visible inside the viewport. */
    .admin-assets-v3 .aav3-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px;
        padding: 5px;
        overflow: hidden;
    }

    .admin-assets-v3 .aav3-tabs a {
        min-width: 0;
        padding: 0 7px;
        gap: 5px;
        font-size: 10px;
        line-height: 1.2;
        text-align: center;
        white-space: normal;
    }

    .admin-assets-v3 .aav3-tabs a iconify-icon {
        flex: 0 0 auto;
    }

    .admin-assets-v3 .aav3-tabs a span {
        min-width: 20px;
        width: 20px;
        height: 20px;
        flex: 0 0 20px;
    }

    /* Filters stack and controls are never allowed to retain desktop widths. */
    .admin-assets-v3 .aav3-filter-card {
        padding: 12px;
        overflow: hidden;
    }

    .admin-assets-v3 .aav3-filter-form {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .admin-assets-v3 .aav3-filter-form label,
    .admin-assets-v3 .aav3-filter-search,
    .admin-assets-v3 .aav3-filter-actions {
        grid-column: 1 / -1;
        width: 100%;
        min-width: 0;
    }

    .admin-assets-v3 .aav3-filter-form input,
    .admin-assets-v3 .aav3-filter-form select,
    .admin-assets-v3 .aav3-search-control input {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    .admin-assets-v3 .aav3-filter-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .admin-assets-v3 .aav3-filter-actions > * {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        white-space: normal;
    }

    .admin-assets-v3 .aav3-toolbar {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 420px) {
    .admin-assets-v3 .aav3-summary article {
        min-height: 90px;
        padding: 10px;
    }

    .admin-assets-v3 .aav3-tabs a {
        font-size: 9px;
        padding-inline: 5px;
    }
}


/* ============================================================
   UMOJA Admin Assets - asset register mobile card fix
   Removes the horizontal table scroller on phones.
   ============================================================ */
@media (max-width: 760px) {
    .admin-assets-v3 .aav3-records {
        overflow: visible;
    }

    .admin-assets-v3 .aav3-asset-register-table,
    .admin-assets-v3 .aav3-asset-register-table tbody,
    .admin-assets-v3 .aav3-asset-register-table tr,
    .admin-assets-v3 .aav3-asset-register-table td {
        box-sizing: border-box;
    }

    .admin-assets-v3 .aav3-asset-register-table {
        display: block;
        width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
        border-collapse: separate;
    }

    .admin-assets-v3 .aav3-asset-register-table thead {
        display: none;
    }

    .admin-assets-v3 .aav3-asset-register-table tbody {
        display: grid;
        width: 100%;
        gap: 10px;
    }

    .admin-assets-v3 .aav3-table-wrap:has(.aav3-asset-register-table) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
        -webkit-overflow-scrolling: auto;
    }

    .admin-assets-v3 .aav3-asset-register-table tr {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "check asset actions"
            "status status status"
            "cost bank bank"
            "project project project"
            "files files files";
        width: 100%;
        min-width: 0;
        gap: 10px 12px;
        padding: 13px;
        border: 1px solid #e7e9ee;
        border-radius: 15px;
        background: #fff;
        box-shadow: 0 8px 24px rgba(16, 24, 40, .04);
        overflow: visible;
    }

    .admin-assets-v3 .aav3-asset-register-table td {
        display: block;
        width: auto;
        min-width: 0;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        text-align: left !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(1) {
        grid-area: check;
        align-self: center;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(2) {
        grid-area: asset;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(3) {
        grid-area: cost;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(4) {
        grid-area: bank;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(5) {
        grid-area: project;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(6) {
        grid-area: status;
        justify-self: start;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(7) {
        grid-area: files;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(8) {
        grid-area: actions;
        justify-self: end;
        align-self: center;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(3)::before,
    .admin-assets-v3 .aav3-asset-register-table td:nth-child(4)::before,
    .admin-assets-v3 .aav3-asset-register-table td:nth-child(5)::before,
    .admin-assets-v3 .aav3-asset-register-table td:nth-child(7)::before {
        display: block;
        margin-bottom: 3px;
        color: #667085;
        font-size: 9px;
        font-weight: 800;
        letter-spacing: .03em;
        text-transform: uppercase;
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(3)::before {
        content: "Cost";
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(4)::before {
        content: "Bank impact";
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(5)::before {
        content: "Project";
    }

    .admin-assets-v3 .aav3-asset-register-table td:nth-child(7)::before {
        content: "Files";
    }

    .admin-assets-v3 .aav3-asset-register-table .aav3-identity-cell {
        width: 100%;
        min-width: 0;
    }

    .admin-assets-v3 .aav3-asset-register-table .aav3-identity-cell > div {
        min-width: 0;
    }

    .admin-assets-v3 .aav3-asset-register-table .aav3-identity-cell strong,
    .admin-assets-v3 .aav3-asset-register-table .aav3-identity-cell small {
        max-width: 100%;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        overflow-wrap: anywhere;
    }

    .admin-assets-v3 .aav3-asset-register-table .aav3-bank-impact,
    .admin-assets-v3 .aav3-asset-register-table td:nth-child(5) > span {
        display: block;
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .admin-assets-v3 .aav3-asset-register-table .request-status {
        max-width: 100%;
        white-space: normal;
        text-align: center;
    }

    .admin-assets-v3 .aav3-asset-register-table .aav3-file-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .admin-assets-v3 .aav3-asset-register-table .aav3-action-menu {
        position: relative;
    }
}

@media (max-width: 380px) {
    .admin-assets-v3 .aav3-asset-register-table tr {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "check asset actions"
            "status status status"
            "cost cost cost"
            "bank bank bank"
            "project project project"
            "files files files";
    }
}


/* ============================================================
   UMOJA Admin Assets - income verification complete mobile fix
   Applies to /admin/assets?tab=income on phones.
   ============================================================ */
@media (max-width: 760px) {
    .admin-assets-v3,
    .admin-assets-v3 > *,
    .admin-assets-v3 .aav3-filter-card,
    .admin-assets-v3 .aav3-filter-form,
    .admin-assets-v3 .aav3-records,
    .admin-assets-v3 .aav3-toolbar,
    .admin-assets-v3 .aav3-table-wrap,
    .admin-assets-v3 .aav3-income-table,
    .admin-assets-v3 .aav3-income-table tbody,
    .admin-assets-v3 .aav3-income-table tr,
    .admin-assets-v3 .aav3-income-table td {
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .admin-assets-v3 {
        width: 100% !important;
        overflow-x: clip !important;
    }

    /* Page summary + tabs */
    .admin-assets-v3 .aav3-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
        overflow: visible !important;
    }

    .admin-assets-v3 .aav3-summary article {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 94px !important;
        padding: 11px !important;
    }

    .admin-assets-v3 .aav3-summary strong {
        font-size: 16px !important;
        line-height: 1.15 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .admin-assets-v3 .aav3-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
        padding: 5px !important;
        overflow: hidden !important;
    }

    .admin-assets-v3 .aav3-tabs a {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: normal !important;
    }

    /* Filters */
    .admin-assets-v3 .aav3-filter-card {
        width: 100% !important;
        padding: 14px !important;
        overflow: hidden !important;
    }

    .admin-assets-v3 .aav3-filter-form {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 11px !important;
        width: 100% !important;
    }

    .admin-assets-v3 .aav3-filter-form label,
    .admin-assets-v3 .aav3-filter-search,
    .admin-assets-v3 .aav3-filter-actions {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .admin-assets-v3 .aav3-search-control,
    .admin-assets-v3 .aav3-filter-form input,
    .admin-assets-v3 .aav3-filter-form select {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .admin-assets-v3 .aav3-filter-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    .admin-assets-v3 .aav3-filter-actions > * {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    /* Income verification header */
    .admin-assets-v3 .aav3-records {
        width: 100% !important;
        padding: 14px !important;
        overflow: visible !important;
    }

    .admin-assets-v3 .aav3-toolbar {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
        align-items: start !important;
    }

    .admin-assets-v3 .aav3-toolbar > div {
        min-width: 0 !important;
    }

    .admin-assets-v3 .aav3-toolbar h2,
    .admin-assets-v3 .aav3-toolbar p {
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
    }

    /* Income submissions: remove desktop horizontal table entirely on mobile. */
    .admin-assets-v3 .aav3-table-wrap:has(.aav3-income-table) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
        -webkit-overflow-scrolling: auto !important;
    }

    .admin-assets-v3 .aav3-income-table,
    .admin-assets-v3 .aav3-income-table tbody {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
    }

    .admin-assets-v3 .aav3-income-table thead {
        display: none !important;
    }

    .admin-assets-v3 .aav3-income-table tbody {
        display: grid !important;
        gap: 11px !important;
    }

    .admin-assets-v3 .aav3-income-table tr {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-areas:
            "asset status"
            "project project"
            "member member"
            "amount amount"
            "date date"
            "proof actions" !important;
        gap: 9px 12px !important;
        width: 100% !important;
        min-width: 0 !important;
        padding: 14px !important;
        border: 1px solid #e6e8ee !important;
        border-radius: 16px !important;
        background: #fff !important;
        box-shadow: 0 8px 24px rgba(16, 24, 40, .05) !important;
        overflow: visible !important;
    }

    .admin-assets-v3 .aav3-income-table td {
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        text-align: left !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere !important;
    }

    .admin-assets-v3 .aav3-income-table td:nth-child(1) { grid-area: asset; }
    .admin-assets-v3 .aav3-income-table td:nth-child(2) { grid-area: project; }
    .admin-assets-v3 .aav3-income-table td:nth-child(3) { grid-area: member; }
    .admin-assets-v3 .aav3-income-table td:nth-child(4) { grid-area: amount; }
    .admin-assets-v3 .aav3-income-table td:nth-child(5) { grid-area: date; }
    .admin-assets-v3 .aav3-income-table td:nth-child(6) {
        grid-area: status;
        justify-self: end;
        max-width: 145px !important;
    }
    .admin-assets-v3 .aav3-income-table td:nth-child(7) { grid-area: proof; }
    .admin-assets-v3 .aav3-income-table td:nth-child(8) {
        grid-area: actions;
        justify-self: end;
    }

    .admin-assets-v3 .aav3-income-table td:nth-child(2)::before,
    .admin-assets-v3 .aav3-income-table td:nth-child(3)::before,
    .admin-assets-v3 .aav3-income-table td:nth-child(4)::before,
    .admin-assets-v3 .aav3-income-table td:nth-child(5)::before,
    .admin-assets-v3 .aav3-income-table td:nth-child(7)::before {
        display: block !important;
        margin-bottom: 3px !important;
        color: #6b7280 !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        letter-spacing: .04em !important;
        text-transform: uppercase !important;
    }

    .admin-assets-v3 .aav3-income-table td:nth-child(2)::before { content: "Project"; }
    .admin-assets-v3 .aav3-income-table td:nth-child(3)::before { content: "Submitted by"; }
    .admin-assets-v3 .aav3-income-table td:nth-child(4)::before { content: "Amount"; }
    .admin-assets-v3 .aav3-income-table td:nth-child(5)::before { content: "Income date"; }
    .admin-assets-v3 .aav3-income-table td:nth-child(7)::before { content: "Proof"; }

    .admin-assets-v3 .aav3-identity-cell,
    .admin-assets-v3 .aav3-person-cell {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .admin-assets-v3 .aav3-identity-cell > div,
    .admin-assets-v3 .aav3-person-cell > div {
        min-width: 0 !important;
    }

    .admin-assets-v3 .aav3-identity-cell strong,
    .admin-assets-v3 .aav3-identity-cell small,
    .admin-assets-v3 .aav3-person-cell strong,
    .admin-assets-v3 .aav3-person-cell small {
        display: block !important;
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .admin-assets-v3 .aav3-income-value {
        font-size: 1.05rem !important;
        line-height: 1.2 !important;
        white-space: normal !important;
    }

    .admin-assets-v3 .aav3-income-table .request-status {
        max-width: 100% !important;
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.2 !important;
    }

    .admin-assets-v3 .aav3-icon-action {
        width: 42px !important;
        height: 42px !important;
    }

    /* Action menu should stay inside viewport when opened from a mobile card. */
    .admin-assets-v3 .aav3-income-table .aav3-action-menu > div {
        width: min(260px, calc(100vw - 32px)) !important;
        max-width: calc(100vw - 32px) !important;
    }

    /* Empty state */
    .admin-assets-v3 .aav3-records .request-empty {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Review modal: make the whole approval/rejection flow phone-safe. */
    .aav3-modal {
        padding: 14px !important;
    }

    .aav3-modal__panel {
        width: min(100%, 520px) !important;
        max-width: 100% !important;
        max-height: calc(100vh - 28px) !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
    }

    .aav3-modal__panel,
    .aav3-modal__panel > *,
    .aav3-review-form,
    .aav3-review-form > *,
    .aav3-review-form textarea,
    .aav3-review-form button {
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .aav3-modal__actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    .aav3-modal__actions > * {
        width: 100% !important;
    }
}

@media (max-width: 390px) {
    .admin-assets-v3 .aav3-summary {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .admin-assets-v3 .aav3-income-table tr {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas:
            "asset"
            "status"
            "project"
            "member"
            "amount"
            "date"
            "proof"
            "actions" !important;
    }

    .admin-assets-v3 .aav3-income-table td:nth-child(6),
    .admin-assets-v3 .aav3-income-table td:nth-child(8) {
        justify-self: start !important;
        max-width: 100% !important;
    }
}

/* ============================================================
   Admin Meetings: phone / iOS responsive correction
   Source: app/Views/admin/meetings.php
   Keeps every meeting action available without a desktop-width table.
   ============================================================ */
@media (max-width: 767px) {
    .amv3.ds4-pack4 {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: clip;
        gap: 12px;
    }

    .amv3.ds4-pack4 > *,
    .amv3.ds4-pack4 .amv3-card,
    .amv3.ds4-pack4 .amv3-table-wrap,
    .amv3.ds4-pack4 .amv3-table,
    .amv3.ds4-pack4 .amv3-table tbody,
    .amv3.ds4-pack4 .amv3-table tr,
    .amv3.ds4-pack4 .amv3-table td {
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    /* KPI cards should fit the viewport instead of creating a second
       horizontal-scrolling surface above the meetings list. */
    .amv3.ds4-pack4 .amv3-stats {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
        overflow: visible !important;
        padding-bottom: 0 !important;
        scroll-snap-type: none !important;
    }

    .amv3.ds4-pack4 .amv3-stats > * {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .amv3.ds4-pack4 .amv3-stats article {
        min-height: 100px;
    }

    .amv3.ds4-pack4 .amv3-stats article span,
    .amv3.ds4-pack4 .amv3-stats article small {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    /* The two page tabs remain side-by-side and fit inside the phone. */
    .amv3.ds4-pack4 .amv3-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        overflow: visible !important;
        white-space: normal !important;
    }

    .amv3.ds4-pack4 .amv3-tabs a {
        min-width: 0;
        padding-inline: 8px;
        text-align: center;
    }

    /* Records toolbar: full-width touch targets without overflow. */
    .amv3.ds4-pack4 #meeting-records .amv3-head {
        gap: 12px;
    }

    .amv3.ds4-pack4 #meeting-records .amv3-toolbar {
        width: 100%;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px;
    }

    .amv3.ds4-pack4 #meeting-records .amv3-toolbar > * {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center;
    }

    .amv3.ds4-pack4 .amv3-selection {
        align-items: center;
        flex-wrap: wrap;
        margin: 2px 0 10px;
    }

    /* Replace the 900px desktop table with one card per meeting. */
    .amv3.ds4-pack4 .amv3-table-wrap {
        width: 100%;
        overflow: visible !important;
        -webkit-overflow-scrolling: auto;
    }

    .amv3.ds4-pack4 .amv3-table {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
        border-collapse: separate;
        border-spacing: 0;
    }

    .amv3.ds4-pack4 .amv3-table colgroup,
    .amv3.ds4-pack4 .amv3-table thead {
        display: none;
    }

    .amv3.ds4-pack4 .amv3-table tbody {
        width: 100%;
        display: grid;
        gap: 10px;
    }

    .amv3.ds4-pack4 .amv3-table tbody tr {
        width: 100%;
        display: grid;
        grid-template-columns: 30px minmax(0, 1fr) auto;
        grid-template-areas:
            "select meeting actions"
            "select date time"
            "select type status"
            "select attendance attendance";
        align-items: center;
        column-gap: 9px;
        row-gap: 7px;
        padding: 11px;
        border: 1px solid #edf0f4;
        border-radius: 13px;
        background: #fff;
    }

    .amv3.ds4-pack4 .amv3-table tbody tr.filtered {
        display: none !important;
    }

    .amv3.ds4-pack4 .amv3-table td {
        width: auto !important;
        padding: 0 !important;
        border: 0 !important;
        text-align: left !important;
        vertical-align: middle;
    }

    .amv3.ds4-pack4 .amv3-table td:nth-child(1) {
        grid-area: select;
        align-self: start;
        padding-top: 9px !important;
        text-align: center !important;
    }

    .amv3.ds4-pack4 .amv3-table td:nth-child(2) { grid-area: meeting; }
    .amv3.ds4-pack4 .amv3-table td:nth-child(3) { grid-area: date; }
    .amv3.ds4-pack4 .amv3-table td:nth-child(4) {
        grid-area: time;
        justify-self: end;
        text-align: right !important;
    }
    .amv3.ds4-pack4 .amv3-table td:nth-child(5) { grid-area: type; }
    .amv3.ds4-pack4 .amv3-table td:nth-child(6) { grid-area: attendance; }
    .amv3.ds4-pack4 .amv3-table td:nth-child(7) {
        grid-area: status;
        justify-self: end;
        text-align: right !important;
    }
    .amv3.ds4-pack4 .amv3-table td:nth-child(8) {
        grid-area: actions;
        justify-self: end;
        text-align: right !important;
    }

    .amv3.ds4-pack4 .meeting-cell {
        width: 100%;
        min-width: 0;
        gap: 9px;
    }

    .amv3.ds4-pack4 .meeting-cell > span {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
    }

    .amv3.ds4-pack4 .meeting-cell strong,
    .amv3.ds4-pack4 .meeting-cell small,
    .amv3.ds4-pack4 .date-cell strong,
    .amv3.ds4-pack4 .date-cell small {
        max-width: 100%;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere;
    }

    .amv3.ds4-pack4 .meeting-cell strong {
        color: #101828;
        font-size: 12px;
        line-height: 1.3;
    }

    .amv3.ds4-pack4 .meeting-cell small,
    .amv3.ds4-pack4 .date-cell small {
        line-height: 1.35;
    }

    .amv3.ds4-pack4 .date-cell strong,
    .amv3.ds4-pack4 .time-cell {
        font-size: 11px;
        line-height: 1.3;
    }

    .amv3.ds4-pack4 .time-cell {
        display: block;
        white-space: normal;
        text-align: right;
    }

    .amv3.ds4-pack4 .type-pill,
    .amv3.ds4-pack4 .attendance-pill,
    .amv3.ds4-pack4 .request-status {
        max-width: 100%;
        white-space: normal;
        line-height: 1.2;
    }

    .amv3.ds4-pack4 .action-menu > summary {
        width: 40px;
        height: 40px;
    }

    .amv3.ds4-pack4 .action-menu-panel {
        width: min(210px, calc(100vw - 32px));
        max-width: calc(100vw - 32px);
    }

    .amv3.ds4-pack4 .amv3-pagination,
    .amv3.ds4-pack4 .amv3-pagination > div {
        width: 100%;
    }

    .amv3.ds4-pack4 .amv3-pagination > div {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .amv3.ds4-pack4 .amv3-pagination a,
    .amv3.ds4-pack4 .amv3-pagination button {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 390px) {
    .amv3.ds4-pack4 .amv3-stats {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .amv3.ds4-pack4 .amv3-table tbody tr {
        grid-template-columns: 28px minmax(0, 1fr) auto;
        column-gap: 7px;
        padding: 10px;
    }
}

/* ---- migrated from ds4-pack5.css ---- */
/* UMOJA DS4 Pack 5 — Contributions, Administration & Agent */
:root{--ds4-pack5-gap:clamp(.75rem,1.5vw,1.25rem)}
.finance-page,.agent-payout-v31,.agent-payout-history-v31,.agent-clients-page,.access-management-page,.access-management-v3,.ds-management-page,.admin-expenses-page{min-width:0}
.finance-page :is(.kpi-card,.summary-card,[class*="summary"]>article,[class*="summary"]>div),.agent-payout-v31 .agent-payout-kpi{border-radius:var(--ds4-radius-lg,16px);box-shadow:var(--ds4-shadow-sm);}
/* Compact page headings */
.finance-page :is(.membership-head,.page-head,.admin-page-head),.agent-payout-hero,.agent-clients-page :is(.page-head,.clients-head){gap:1rem;margin-bottom:1rem}
.finance-page h1,.agent-payout-v31 h1,.agent-payout-history-v31 h1,.agent-clients-page h1{font-size:clamp(1.45rem,2.2vw,2rem);line-height:1.15;margin-bottom:.25rem}
.finance-page .eyebrow,.agent-payout-v31 .eyebrow,.agent-payout-history-v31 .eyebrow{margin-bottom:.2rem}
/* KPI rows stay compact on small screens */
.contribution-kpis,.admin-contributions-v3__summary,.acv3-summary,.agent-payout-kpis,[class*="summary-grid"]{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--ds4-pack5-gap)}
/* Tables */
.finance-page table,.agent-payout-v31 table,.agent-payout-history-v31 table,.agent-clients-page table{width:100%;border-collapse:separate;border-spacing:0}
.finance-page th,.agent-payout-v31 th,.agent-payout-history-v31 th,.agent-clients-page th{font-size:.72rem;text-transform:uppercase;letter-spacing:.035em;white-space:nowrap}
.finance-page :is(th,td),.agent-payout-v31 :is(th,td),.agent-payout-history-v31 :is(th,td),.agent-clients-page :is(th,td){padding:.75rem .8rem;vertical-align:middle}
.finance-page tbody tr,.agent-payout-v31 tbody tr,.agent-payout-history-v31 tbody tr{transition:background-color .12s ease}
.finance-page tbody tr:hover,.agent-payout-v31 tbody tr:hover,.agent-payout-history-v31 tbody tr:hover{background:rgba(15,23,42,.025)}
/* Forms / filters */
.finance-page :is(input,select,textarea),.agent-payout-v31 :is(input,select,textarea),.agent-payout-history-v31 :is(input,select,textarea),.agent-clients-page :is(input,select,textarea){min-height:42px}
.finance-page form,.agent-payout-history-filter form{min-width:0}
/* Actions: prevent verbose buttons from dominating */
.finance-page :is(.button-primary,.button-secondary,.btn),.agent-payout-v31 :is(.button-primary,.button-secondary,.btn),.agent-payout-history-v31 :is(.button-primary,.button-secondary,.btn){min-height:40px;gap:.4rem}
.finance-page iconify-icon,.agent-payout-v31 iconify-icon,.agent-payout-history-v31 iconify-icon{font-size:1.1rem;flex:0 0 auto}
/* Agent payout cards */
.agent-payout-v31 :is(.agent-payout-queue,.agent-payout-history-card,.agent-payout-review-panel,.agent-payout-code-panel),.agent-payout-history-card,.agent-payout-history-filter{border-radius:var(--ds4-radius-lg,16px);overflow:hidden}
.agent-payout-section-head{gap:.75rem;flex-wrap:wrap}
/* Tablet */
@media (max-width:1100px){.contribution-kpis,.admin-contributions-v3__summary,.acv3-summary,.agent-payout-kpis,[class*="summary-grid"]{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-page :is(.table-wrap,[class*="table-wrap"]),.agent-payout-v31 [class*="table-wrap"],.agent-payout-history-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}}
/* Mobile */
@media (max-width:767px){
 .finance-page,.agent-payout-v31,.agent-payout-history-v31,.agent-clients-page{--ds4-pack5-gap:.7rem}
 .finance-page .muted,.agent-payout-v31 .muted,.agent-payout-history-v31 .muted{font-size:.86rem;line-height:1.4}
 .contribution-kpis,.admin-contributions-v3__summary,.acv3-summary,.agent-payout-kpis,[class*="summary-grid"]{display:flex;overflow-x:auto;scroll-snap-type:x proximity;gap:.65rem;padding-bottom:.3rem;scrollbar-width:none}
 .contribution-kpis::-webkit-scrollbar,.admin-contributions-v3__summary::-webkit-scrollbar,.acv3-summary::-webkit-scrollbar,.agent-payout-kpis::-webkit-scrollbar{display:none}
 .contribution-kpis>* ,.admin-contributions-v3__summary>* ,.acv3-summary>* ,.agent-payout-kpis>* ,[class*="summary-grid"]>*{flex:0 0 min(78vw,245px);scroll-snap-align:start}
 .finance-page :is(.kpi-card,[class*="summary"]>article,[class*="summary"]>div),.agent-payout-kpi{padding:.8rem!important;min-height:auto!important}
 .finance-page :is(.button-primary,.button-secondary,.btn),.agent-payout-v31 :is(.button-primary,.button-secondary,.btn),.agent-payout-history-v31 :is(.button-primary,.button-secondary,.btn){font-size:.86rem;padding:.6rem .75rem}
 .agent-payout-hero,.agent-payout-history-v31 .agent-payout-hero{align-items:flex-start!important}
 .agent-payout-history-filter form{display:grid!important;grid-template-columns:1fr 1fr;gap:.65rem}
 .agent-payout-history-filter form label:first-child{grid-column:1/-1}
 /* Dense data tables become horizontal rather than breaking layouts. */
 .finance-page :is(.table-wrap,[class*="table-wrap"]),.agent-payout-v31 [class*="table-wrap"],.agent-payout-history-table-wrap,.agent-clients-page [class*="table-wrap"]{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
 .finance-page table,.agent-payout-v31 table,.agent-payout-history-v31 table,.agent-clients-page table{min-width:680px}
 .finance-page :is(th,td),.agent-payout-v31 :is(th,td),.agent-payout-history-v31 :is(th,td),.agent-clients-page :is(th,td){padding:.65rem .7rem}
 .finance-page .desktop-only,.agent-payout-v31 .desktop-only{display:none!important}
}
@media (max-width:480px){.agent-payout-history-filter form{grid-template-columns:1fr}.agent-payout-history-filter form label:first-child{grid-column:auto}.finance-page h1,.agent-payout-v31 h1,.agent-payout-history-v31 h1{font-size:1.4rem}}
@media (prefers-reduced-motion:reduce){.finance-page *, .agent-payout-v31 *{scroll-behavior:auto!important;transition:none!important}}

.ds-management-page :is(.acv3-summary,[class*="summary"]){gap:var(--ds4-pack5-gap)}
@media(max-width:767px){.ds-management-page :is(.acv3-summary,[class*="summary"]){overflow-x:auto}.ds-management-page :is(input,select,textarea){min-height:42px}}


/* ===== Member Contributions responsive correction ===== */
@media (max-width: 767px) {
  .contribution-page {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: clip;
    gap: 14px;
  }

  .contribution-page > *,
  .contribution-page form,
  .contribution-page label,
  .contribution-page input,
  .contribution-page select {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }

  .contribution-page .contribution-head {
    padding: 18px;
    margin-bottom: 0;
  }

  .contribution-page .contribution-head h1 {
    font-size: clamp(1.8rem, 8vw, 2.25rem);
  }

  /* Replace Pack 5's horizontal KPI carousel with a proper grid. */
  .contribution-page .contribution-kpis {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 10px !important;
    width: 100%;
    margin: 0;
    padding: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }

  .contribution-page .contribution-kpis > .kpi-card {
    flex: initial !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 104px !important;
    padding: 13px !important;
    gap: 10px;
    overflow: hidden;
    scroll-snap-align: none !important;
  }

  .contribution-page .kpi-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 12px;
    font-size: 20px;
  }

  .contribution-page .kpi-card > div:last-child {
    min-width: 0;
  }

  .contribution-page .kpi-card span {
    font-size: .75rem;
    line-height: 1.25;
    white-space: normal;
  }

  .contribution-page .kpi-card strong {
    max-width: 100%;
    font-size: clamp(1rem, 5vw, 1.35rem);
    line-height: 1.12;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }

  .contribution-page .contribution-progress-card,
  .contribution-page .contribution-summary-card,
  .contribution-page .contribution-payment-card {
    width: 100%;
    padding: 16px;
    border-radius: 18px;
  }

  .contribution-page .progress-header {
    align-items: flex-start;
    gap: 10px;
  }

  .contribution-page .progress-header span {
    text-align: right;
    white-space: nowrap;
  }

  .contribution-page .contribution-summary-card {
    gap: 16px;
  }

  .contribution-page .contribution-summary-card > div:first-child {
    width: 100%;
    min-width: 0;
  }

  .contribution-page .summary-mini-stats {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    width: 100%;
    margin-top: 14px;
  }

  .contribution-page .summary-mini-stats > div {
    min-width: 0;
    padding: 12px;
    border-radius: 12px;
    background: #fafbfc;
  }

  .contribution-page .summary-mini-stats strong {
    font-size: clamp(.95rem,4.5vw,1.15rem);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }

  .contribution-page .contribution-summary-actions,
  .contribution-page .summary-year-filter {
    width: 100%;
    align-items: stretch;
  }

  .contribution-page .summary-year-filter select {
    width: 100%;
  }

  .contribution-page .contribution-pay-form,
  .contribution-page .contribution-proof-form {
    grid-template-columns: minmax(0,1fr);
    width: 100%;
  }

  .contribution-page .contribution-pay-form :is(select,button),
  .contribution-page .contribution-proof-form :is(input,button) {
    width: 100%;
  }

  .contribution-page .contribution-timeline {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .contribution-page .contribution-history-card {
    width: 100%;
    min-width: 0;
    padding: 14px;
  }
}

@media (max-width: 360px) {
  .contribution-page .contribution-kpis,
  .contribution-page .summary-mini-stats {
    grid-template-columns: 1fr !important;
  }
}

/* --------------------------------------------------------------------------
   Agent reporting + cross-portal mobile/iOS hardening (2026-09)
   -------------------------------------------------------------------------- */
.agent-reports-v1 { padding-bottom: 1rem; }
.agent-report-period { display:flex; align-items:center; flex-wrap:wrap; gap:.55rem; padding:.45rem; border:1px solid var(--ds4-neutral-200); border-radius:16px; background:#fff; width:max-content; max-width:100%; }
.agent-report-period a { min-height:42px; display:inline-flex; align-items:center; justify-content:center; padding:.65rem 1rem; border-radius:12px; color:var(--ds4-neutral-700); font-weight:800; text-decoration:none; }
.agent-report-period a.is-active { background:var(--ds4-brand-700, #731f71); color:#fff; }
.agent-report-period > span { padding:0 .75rem; color:var(--ds4-neutral-500); font-size:.84rem; white-space:nowrap; }
.agent-report-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.agent-report-summary-card { position:relative; min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); gap:.85rem; align-items:center; padding:1.1rem; border:1px solid var(--ds4-neutral-200); border-radius:18px; background:#fff; box-shadow:var(--ds4-shadow-sm); }
.agent-report-summary-card__icon { width:44px; height:44px; display:grid; place-items:center; flex:0 0 44px; border-radius:13px; background:color-mix(in srgb,var(--ds4-brand-700,#731f71) 10%,white); color:var(--ds4-brand-700,#731f71); font-size:1.35rem; }
.agent-report-summary-card div { min-width:0; display:grid; gap:.08rem; }
.agent-report-summary-card small,.agent-report-module-card small { color:var(--ds4-neutral-500); }
.agent-report-summary-card strong { font-size:1.7rem; line-height:1.1; }
.agent-report-summary-card div span { color:var(--ds4-neutral-500); font-size:.78rem; }
.agent-report-trend { display:inline-flex; align-items:center; gap:.25rem; width:max-content; max-width:100%; border-radius:999px; padding:.3rem .55rem; font-size:.76rem; font-weight:800; white-space:nowrap; }
.agent-report-summary-card > .agent-report-trend { position:absolute; top:1rem; right:1rem; }
.agent-report-trend.is-up { background:#eaf8ef; color:#217a3f; }
.agent-report-trend.is-down { background:#fff0f1; color:#b53848; }
.agent-report-trend.is-flat { background:#f2f4f7; color:#667085; }
.agent-report-module-card { min-width:0; padding:1.15rem; border:1px solid var(--ds4-neutral-200); border-radius:20px; background:#fff; box-shadow:var(--ds4-shadow-sm); }
.agent-report-module-card__head,.agent-report-module-card__head > div { display:flex; align-items:center; gap:.8rem; min-width:0; }
.agent-report-module-card__head { justify-content:space-between; margin-bottom:1rem; }
.agent-report-module-card__head h2 { margin:.08rem 0 0; font-size:1.15rem; }
.agent-report-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin-bottom:1rem; }
.agent-report-metrics > div { min-width:0; display:grid; gap:.25rem; padding:.85rem; border-radius:14px; background:var(--ds4-neutral-50,#f8f9fb); }
.agent-report-metrics strong { overflow-wrap:anywhere; font-size:1.02rem; }
.agent-report-detail-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(240px,.8fr); gap:1rem; }
.agent-report-trend-chart,.agent-report-statuses { min-width:0; border:1px solid var(--ds4-neutral-200); border-radius:16px; padding:1rem; }
.agent-report-trend-chart header,.agent-report-statuses header { display:flex; flex-direction:column; gap:.1rem; margin-bottom:.85rem; }
.agent-report-bars { min-height:170px; display:grid; grid-template-columns:repeat(auto-fit,minmax(42px,1fr)); align-items:end; gap:.6rem; overflow:hidden; }
.agent-report-bar { min-width:0; height:150px; display:grid; grid-template-rows:1.25rem minmax(0,1fr) 1.2rem; gap:.3rem; align-items:end; justify-items:center; }
.agent-report-bar__value { font-size:.72rem; font-weight:800; color:var(--ds4-neutral-600); }
.agent-report-bar i { width:min(24px,70%); height:var(--bar-height); min-height:6px; max-height:100%; border-radius:8px 8px 3px 3px; background:var(--ds4-brand-700,#731f71); }
.agent-report-bar small { width:100%; overflow:hidden; text-overflow:ellipsis; text-align:center; white-space:nowrap; font-size:.67rem; }
.agent-report-status-list { display:grid; gap:.45rem; }
.agent-report-status-list > div { display:flex; justify-content:space-between; gap:1rem; padding:.55rem 0; border-bottom:1px solid var(--ds4-neutral-100); }
.agent-report-status-list > div:last-child { border-bottom:0; }
.agent-report-status-list span { min-width:0; overflow-wrap:anywhere; }

/* Shared safety rules for narrow screens and Safari/iOS. */
:where(.portal-page,.admin-portal-page) :where(img,svg,video,canvas) { max-width:100%; }
:where(.portal-page,.admin-portal-page) :where(input,select,textarea,button) { max-width:100%; }
:where(.portal-page,.admin-portal-page) :where(input,select,textarea) { font-size:16px; } /* prevents iOS form zoom */
:where(.portal-page,.admin-portal-page) :where(.ds4-card,.ds-card,article,section,form,fieldset,.table-responsive) { min-width:0; }
:where(.portal-page,.admin-portal-page) :where(.table-responsive,[class*="table-wrap"],[class*="table-scroll"]) { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
:where(.portal-page,.admin-portal-page) dialog,
:where(.portal-page,.admin-portal-page) [role="dialog"] { max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); }
@supports (-webkit-touch-callout: none) {
  :where(.portal-page,.admin-portal-page) { -webkit-text-size-adjust:100%; }
  :where(.portal-page,.admin-portal-page) :where(button,a,input,select,textarea) { touch-action:manipulation; }
  :where(.portal-page,.admin-portal-page) :where(select,input[type="date"],input[type="time"],input[type="datetime-local"]) { min-height:44px; }
}
@media (max-width: 767px) {
  .agent-report-period { width:100%; }
  .agent-report-period a { flex:1 1 0; }
  .agent-report-period > span { flex:1 0 100%; padding:.15rem .5rem .35rem; text-align:center; white-space:normal; }
  .agent-report-summary-grid { grid-template-columns:1fr; }
  .agent-report-summary-card { padding:1rem; }
  .agent-report-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .agent-report-detail-grid { grid-template-columns:1fr; }
  .agent-report-module-card__head { align-items:flex-start; flex-direction:column; }
  .agent-report-bars { grid-template-columns:repeat(auto-fit,minmax(34px,1fr)); gap:.35rem; }
  :where(.portal-page,.admin-portal-page) main { width:100%; max-width:100%; overflow-x:clip; }
  :where(.portal-page,.admin-portal-page) :where(.portal-header,.admin-portal-header) { padding-left:max(12px,env(safe-area-inset-left)); padding-right:max(12px,env(safe-area-inset-right)); }
  .ds4-mobile-nav { padding-bottom:max(6px,env(safe-area-inset-bottom)); }
}
@media (max-width: 430px) {
  .agent-report-metrics { grid-template-columns:1fr 1fr; gap:.55rem; }
  .agent-report-metrics > div { padding:.7rem; }
  .agent-report-summary-card > .agent-report-trend { position:static; grid-column:1/-1; }
}

/* ---- migrated from ds4-dashboard.css ---- */
/*
 * UMOJA Design System v4.0
 * Pack 1 — Dashboard responsive behaviour
 *
 * Goals:
 * - compact information density on desktop
 * - balanced two-column layouts on tablet
 * - horizontal summary strips and reduced scrolling on mobile
 * - consistent touch targets, focus states and motion behaviour
 */

.ds4-dashboard {
  --ds4-dashboard-panel-gap: var(--ds4-space-4);
  display: grid;
  gap: var(--ds4-space-5);
  min-width: 0;
}

.ds4-dashboard > * { min-width: 0; }
.ds4-dashboard .ds4-page-header { margin-bottom: 0; align-items: center; }

.ds4-dashboard-welcome { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.ds4-dashboard-welcome__avatar {
  width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 48px;
  border-radius: 14px; background: var(--ds4-brand-100); color: var(--ds4-brand-700);
  font-size: 1.45rem;
}
.ds4-dashboard-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; flex-wrap: wrap; }
.ds4-dashboard-notification-button { position: relative; }
.ds4-icon-btn__badge {
  position: absolute; top: -5px; right: -5px; min-width: 18px; height: 18px; padding: 0 4px;
  display: grid; place-items: center; border: 2px solid #fff; border-radius: 999px;
  background: var(--ds4-danger); color: #fff; font-size: .65rem; font-weight: 800;
}

/* KPI summary */
.ds4-dashboard-kpis {
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
  gap: var(--ds4-space-3);
  min-width: 0;
}
.ds4-dashboard-kpi {
  position: relative; min-width: 0; min-height: 78px;
  display: flex; align-items: center; gap: .8rem; padding: 1rem;
  border: 1px solid var(--ds4-neutral-200); border-radius: var(--ds4-radius-lg);
  background: #fff; color: inherit; text-decoration: none;
  box-shadow: var(--ds4-shadow-sm);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background-color .16s ease;
}
.ds4-dashboard-kpi__icon {
  width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 42px;
  border-radius: 12px; background: var(--ds4-brand-50); color: var(--ds4-brand-700); font-size: 1.25rem;
}
.ds4-dashboard-kpi__content { min-width: 0; display: grid; gap: .2rem; }
.ds4-dashboard-kpi__label {
  overflow: hidden; color: var(--ds4-neutral-500); font-size: var(--ds4-text-xs); font-weight: 750;
  text-overflow: ellipsis; white-space: nowrap;
}
.ds4-dashboard-kpi__content strong {
  overflow: visible; color: var(--ds4-neutral-900); font-size: clamp(1.15rem, 1.8vw, 1.45rem);
  line-height: 1.15; text-overflow: clip; white-space: nowrap;
}
.ds4-dashboard-kpi__arrow { margin-left: auto; flex: 0 0 auto; color: var(--ds4-neutral-300); }
.ds4-dashboard-kpis.is-at-start { --ds4-kpi-left-fade: 0; }
.ds4-dashboard-kpis.is-at-end { --ds4-kpi-right-fade: 0; }

/* Main dashboard canvas */
.ds4-dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  gap: var(--ds4-dashboard-panel-gap);
  align-items: start;
}
.ds4-dashboard-stack { display: grid; gap: var(--ds4-dashboard-panel-gap); min-width: 0; align-content: start; }
.ds4-dashboard-panel { overflow: clip; min-width: 0; }
.ds4-dashboard-panel__head { align-items: center; min-height: 62px; padding: 1rem 1.1rem; }
.ds4-dashboard-panel__head > div { min-width: 0; }
.ds4-dashboard-panel__head .ds4-eyebrow { display: block; margin-bottom: .15rem; }
.ds4-dashboard-panel__head .ds4-section-title { font-size: 1.05rem; }
.ds4-dashboard-panel .ds4-card__body { padding: 1rem 1.1rem; }

/* Quick actions */
.ds4-quick-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.ds4-quick-action {
  min-width: 0; min-height: 52px; display: flex; align-items: center; gap: .65rem;
  padding: .7rem .8rem; border: 1px solid var(--ds4-neutral-100); border-radius: 12px;
  background: var(--ds4-neutral-25); color: var(--ds4-neutral-700); text-decoration: none;
  transition: background-color .14s ease, border-color .14s ease, color .14s ease, transform .14s ease;
}
.ds4-quick-action__icon {
  width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 34px;
  border-radius: 10px; background: #fff; color: var(--ds4-brand-700); font-size: 1.1rem;
  box-shadow: var(--ds4-shadow-sm);
}
.ds4-quick-action__label {
  min-width: 0;
  overflow: visible;
  font-size: var(--ds4-text-sm);
  font-weight: 750;
  line-height: 1.2;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}
.ds4-quick-action__arrow { margin-left: auto; color: var(--ds4-neutral-300); }
.ds4-quick-action__badge {
  margin-left: auto; min-width: 24px; height: 24px; padding: 0 .35rem; display: grid; place-items: center;
  border-radius: 999px; background: var(--ds4-warning-bg); color: var(--ds4-warning);
  font-size: .72rem; font-weight: 850;
}

/* Activity and notifications */
.ds4-activity-list, .ds4-notification-list { display: grid; gap: 0; padding-top: .2rem !important; padding-bottom: .2rem !important; }
.ds4-activity-item {
  display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: .75rem;
  min-height: 58px; padding: .8rem 0; border-bottom: 1px solid var(--ds4-neutral-100);
  color: inherit; text-decoration: none;
}
.ds4-activity-item:last-child { border-bottom: 0; }
.ds4-activity-item__icon {
  width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px;
  background: var(--ds4-neutral-50); color: var(--ds4-brand-700);
}
.ds4-activity-item__content { min-width: 0; display: grid; gap: .15rem; }
.ds4-activity-item__content strong {
  overflow: hidden; font-size: var(--ds4-text-sm); text-overflow: ellipsis; white-space: nowrap;
}
.ds4-activity-item__content small {
  overflow: hidden; color: var(--ds4-neutral-500); font-size: var(--ds4-text-xs); text-overflow: ellipsis; white-space: nowrap;
}
.ds4-activity-item__meta { display: grid; justify-items: end; gap: .3rem; }
.ds4-activity-item__meta time { color: var(--ds4-neutral-500); font-size: .7rem; white-space: nowrap; }

.ds4-notification-item {
  position: relative; display: grid; grid-template-columns: 8px minmax(0, 1fr); gap: .65rem;
  min-height: 54px; padding: .78rem 0; border-bottom: 1px solid var(--ds4-neutral-100);
  color: inherit; text-decoration: none;
}
.ds4-notification-item:last-child { border-bottom: 0; }
.ds4-notification-item__dot { width: 7px; height: 7px; margin-top: .42rem; border-radius: 50%; background: var(--ds4-neutral-200); }
.ds4-notification-item.is-unread .ds4-notification-item__dot { background: var(--ds4-brand-600); box-shadow: 0 0 0 3px var(--ds4-brand-50); }
.ds4-notification-item strong { display: block; font-size: var(--ds4-text-sm); }
.ds4-notification-item small {
  display: -webkit-box; margin-top: .18rem; overflow: hidden; color: var(--ds4-neutral-500);
  font-size: var(--ds4-text-xs); line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}

/* Financial / account snapshots */
.ds4-snapshot-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.ds4-snapshot-item { min-width: 0; padding: .85rem; border-radius: 12px; background: var(--ds4-neutral-50); }
.ds4-snapshot-item > span { display: block; color: var(--ds4-neutral-500); font-size: var(--ds4-text-xs); font-weight: 700; }
.ds4-snapshot-item > strong {
  display: block; margin-top: .25rem; overflow: visible; color: var(--ds4-neutral-900); font-size: 1rem;
  text-overflow: clip; white-space: nowrap;
}
.ds4-snapshot-item > small { display: block; margin-top: .2rem; color: var(--ds4-neutral-500); font-size: .7rem; }

.ds4-dashboard-empty {
  min-height: 112px; display: grid; place-items: center; align-content: center; gap: .45rem;
  padding: 1rem; color: var(--ds4-neutral-500); text-align: center; font-size: var(--ds4-text-sm);
}
.ds4-dashboard-empty iconify-icon { font-size: 1.45rem; color: var(--ds4-neutral-300); }

/* Keyboard and accessibility */
.ds4-dashboard a:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--ds4-brand-600) 34%, transparent);
  outline-offset: 2px;
}

/* Desktop hover is intentionally limited to devices that genuinely hover. */
@media (hover: hover) and (pointer: fine) {
  .ds4-dashboard-kpi:hover { color: inherit; border-color: #c9b4ca; box-shadow: var(--ds4-shadow-md); transform: translateY(-1px); }
  .ds4-quick-action:hover { color: var(--ds4-brand-700); background: var(--ds4-brand-50); border-color: var(--ds4-brand-100); transform: translateY(-1px); }
  .ds4-activity-item:hover, .ds4-notification-item:hover { color: inherit; background: linear-gradient(90deg, transparent, var(--ds4-neutral-25)); }
}


/* ADMIN / ROOT desktop KPI readability
 * Keep large financial values fully visible instead of truncating with an ellipsis.
 * The chevron is decorative, so removing it on the admin KPI strip releases useful width.
 */
@media (min-width: 1101px) {
  .ds4-dashboard--admin .ds4-dashboard-kpi {
    gap: .65rem;
    padding-inline: .85rem;
  }

  .ds4-dashboard--admin .ds4-dashboard-kpi__icon {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
  }

  .ds4-dashboard--admin .ds4-dashboard-kpi__arrow {
    display: none;
  }

  .ds4-dashboard--admin .ds4-dashboard-kpi__content {
    min-width: 0;
    width: 100%;
  }

  .ds4-dashboard--admin .ds4-dashboard-kpi__content strong {
    overflow: visible;
    max-width: 100%;
    font-size: clamp(1rem, 1.25vw, 1.3rem);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
    text-overflow: clip;
    white-space: nowrap;
  }
}

/* Tablet */
@media (max-width: 1100px) {
  .ds4-dashboard { --ds4-dashboard-panel-gap: var(--ds4-space-3); }
  .ds4-dashboard-main-grid { grid-template-columns: 1fr; }
  .ds4-dashboard-stack--side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) and (max-width: 1100px) {
  .ds4-dashboard-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Mobile */
@media (max-width: 767px) {
  .ds4-dashboard { gap: var(--ds4-space-4); }
  .ds4-dashboard .ds4-page-header { display: flex; align-items: center; gap: .75rem; }
  .ds4-dashboard .ds4-page-header__copy { flex: 1; min-width: 0; }
  .ds4-dashboard .ds4-page-header__description, .ds4-dashboard .ds4-eyebrow--mobile-hide { display: none; }
  .ds4-dashboard .ds4-page-title { font-size: 1.45rem; }
  .ds4-dashboard-header-actions { flex-wrap: nowrap; }
  .ds4-dashboard-header-actions .ds4-btn span { display: none; }
  .ds4-dashboard-header-actions .ds4-btn { width: 44px; min-width: 44px; padding-inline: 0; justify-content: center; }

  /* Admin/ROOT already have Notifications in the top bar and Alerts in the bottom nav.
     Keep dashboard actions from duplicating those controls or overlapping the title. */
  .ds4-dashboard--admin .ds4-page-header {
    display: block;
    min-height: 0;
  }
  .ds4-dashboard--admin .ds4-page-header__actions { display: none !important; }
  .ds4-dashboard--admin .ds4-page-header__copy { width: 100%; }
  .ds4-dashboard--admin .ds4-eyebrow {
    margin-bottom: .3rem;
    line-height: 1.25;
  }
  .ds4-dashboard--admin .ds4-page-title {
    margin: 0;
    line-height: 1.05;
  }

  .ds4-dashboard-kpis {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
    overflow: visible;
    padding: 0;
    box-shadow: none !important;
  }
  .ds4-dashboard-kpi {
    min-width: 0;
    min-height: 78px;
    padding: .85rem .8rem;
    gap: .65rem;
  }
  .ds4-dashboard-kpi__icon {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
    font-size: 1.1rem;
  }
  .ds4-dashboard-kpi__label {
    font-size: .74rem;
    line-height: 1.15;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
  .ds4-dashboard-kpi__content strong {
    font-size: clamp(1rem, 5vw, 1.25rem);
    line-height: 1.15;
    white-space: nowrap;
  }
  .ds4-dashboard-kpi__arrow { display: none; }

  .ds4-dashboard-stack--side { grid-template-columns: 1fr; }
  .ds4-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds4-quick-action { min-height: 48px; padding: .65rem; }

  .ds4-activity-item { grid-template-columns: 34px minmax(0, 1fr); gap: .65rem; }
  .ds4-activity-item__meta { grid-column: 2; display: flex; align-items: center; justify-content: flex-start; gap: .45rem; }
  .ds4-activity-item__content small { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
  .ds4-snapshot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .ds4-dashboard .ds4-activity-list .ds4-activity-item:nth-of-type(n+4) { display: none; }

  .ds4-dashboard-panel__head { min-height: 56px; padding: .85rem .95rem; }
  .ds4-dashboard-panel .ds4-card__body { padding: .85rem .95rem; }
}

@media (max-width: 420px) {
  .ds4-dashboard-kpi { padding: .78rem .7rem; gap: .55rem; }
  .ds4-dashboard-kpi__icon { width: 36px; height: 36px; flex-basis: 36px; }
  .ds4-dashboard-kpi__content strong { font-size: 1rem; }
  .ds4-quick-action__label { font-size: .8rem; }
  .ds4-snapshot-grid { grid-template-columns: 1fr 1fr; }
}

/* Respect OS motion preferences. */
@media (prefers-reduced-motion: reduce) {
  .ds4-dashboard *, .ds4-dashboard *::before, .ds4-dashboard *::after {
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* Member Expected Dividend: a positive financial highlight without using
   error/attention colours. */
.ds4-dashboard-kpi--highlight {
  border-color: rgba(180, 130, 25, .24);
  background: linear-gradient(135deg, #fffaf0 0%, #fffdf7 100%);
  box-shadow: 0 8px 22px rgba(133, 91, 10, .08);
}
.ds4-dashboard-kpi--highlight .ds4-dashboard-kpi__icon {
  background: #fff2cc;
  color: #8a5a00;
}
.ds4-dashboard-kpi--highlight .ds4-dashboard-kpi__label {
  color: #805d18;
}
.ds4-dashboard-kpi--highlight .ds4-dashboard-kpi__content strong {
  color: #5f4200;
}


/* =========================================================
   DS4 AGENT DASHBOARD MOBILE CORRECTION
   ========================================================= */
@media (max-width: 767px) {
  /* The compact icon-only payout action was overlapping the Agent title.
     The same action already exists in the bottom navigation, so hide it here. */
  .ds4-dashboard:not(.ds4-dashboard--admin) .ds4-page-header__actions {
    display: none !important;
  }

  .ds4-dashboard:not(.ds4-dashboard--admin) .ds4-page-header {
    display: block !important;
    min-height: 0 !important;
  }

  .ds4-dashboard:not(.ds4-dashboard--admin) .ds4-page-header__copy {
    width: 100% !important;
  }

  .ds4-dashboard:not(.ds4-dashboard--admin) .ds4-eyebrow {
    margin-bottom: .3rem !important;
    line-height: 1.25 !important;
  }

  .ds4-dashboard:not(.ds4-dashboard--admin) .ds4-page-title {
    margin: 0 !important;
    line-height: 1.08 !important;
  }

  /* Preserve the useful 2-column KPI rhythm shown elsewhere in DS4. */
  .ds4-dashboard:not(.ds4-dashboard--admin) .ds4-dashboard-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .ds4-dashboard:not(.ds4-dashboard--admin) .ds4-dashboard-kpi__content strong,
  .ds4-dashboard:not(.ds4-dashboard--admin) .ds4-snapshot-item > strong {
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}

/* 2026-09-27: unified dashboard/profile UX */
.ds4-dashboard > .ds4-dashboard-quick-actions,
.ds4-dashboard > .ds4-card:has(.ds4-quick-actions) {
    margin-top: var(--ds4-space-4, 16px);
}

/* Keep the notification + avatar cluster identical across workspaces. */
.admin-topbar .admin-userbar,
.portal-header .client-userbar {
    align-items: center;
}
.admin-avatar-button.client-avatar {
    width: 42px;
    height: 42px;
    padding: 0;
    border: 2px solid #fff;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 0 0 1px var(--ds4-border, #e5e7eb);
}
.admin-avatar-button.client-avatar .user-head-icon {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

/* Profile menus should scan as controls, not explanatory content. */
.workspace-switcher-v3__head small,
.workspace-switcher-v3__current small,
.workspace-switcher-v3__change-copy small {
    display: none !important;
}
.workspace-switcher-v3__head,
.workspace-switcher-v3__current,
.workspace-switcher-v3__change {
    gap: 10px;
}

/* ---- DS5 native layer ---- */
/* UMOJA Experience System / DS5 — structural layer over DS4. */
:root{--ds5-brand:#731f71;--ds5-brand-soft:#f7eff7;--ds5-text:#1f2937;--ds5-muted:#667085;--ds5-border:#e5e7eb;--ds5-surface:#fff;--ds5-soft:#f8f9fb;--ds5-success:#18794e;--ds5-warning:#9a6700;--ds5-danger:#b42318;--ds5-radius:16px;--ds5-touch:48px;--ds5-space-1:4px;--ds5-space-2:8px;--ds5-space-3:12px;--ds5-space-4:16px;--ds5-space-6:24px;--ds5-space-8:32px}
.ds5-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:24px}.ds5-page-head h1{margin:4px 0;font-size:clamp(1.75rem,4vw,2.35rem);letter-spacing:-.03em}.ds5-page-head p{margin:0;color:var(--ds5-muted);max-width:64ch}.ds5-eyebrow{margin:0;color:var(--ds5-brand);font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.ds5-section{margin-top:28px}.ds5-section__head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:12px}.ds5-section__head h2{margin:0;font-size:1.05rem}.ds5-section__head p{margin:3px 0 0;color:var(--ds5-muted);font-size:.9rem}
.ds5-intent-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ds5-intent-card{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:88px;padding:16px;border:1px solid var(--ds5-border);border-radius:var(--ds5-radius);background:#fff;color:var(--ds5-text);text-decoration:none}.ds5-intent-card:hover{border-color:#d7bfd6;box-shadow:0 8px 24px rgba(31,41,55,.06)}.ds5-intent-card__icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:var(--ds5-brand-soft);color:var(--ds5-brand);font-size:1.45rem}.ds5-intent-card strong{display:block;margin-bottom:3px}.ds5-intent-card small{display:block;color:var(--ds5-muted);line-height:1.35}.ds5-intent-card>iconify-icon{color:var(--ds5-muted);font-size:1.25rem}
.ds5-chip-row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:1px 1px 4px}.ds5-chip-row::-webkit-scrollbar{display:none}.ds5-chip{min-height:40px;display:inline-flex;align-items:center;white-space:nowrap;padding:0 14px;border:1px solid var(--ds5-border);border-radius:999px;background:#fff;color:#4b5563;text-decoration:none;font-weight:700}.ds5-chip.is-active{background:var(--ds5-brand);border-color:var(--ds5-brand);color:#fff}
.ds5-field{display:grid;gap:7px}.ds5-field__label{font-size:.88rem;font-weight:750;color:#344054}.ds5-field__control{min-height:48px;width:100%;padding:11px 13px;border:1px solid #cfd4dc;border-radius:12px;background:#fff;color:var(--ds5-text);font:inherit}.ds5-field__control:focus{outline:3px solid rgba(115,31,113,.14);border-color:var(--ds5-brand)}.ds5-field__hint,.ds5-field__error{font-size:.8rem}.ds5-field__hint{color:var(--ds5-muted)}.ds5-field__error{color:var(--ds5-danger)}.ds5-field.has-error .ds5-field__control{border-color:var(--ds5-danger)}
.ds5-amount{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:stretch;border:1px solid #cfd4dc;border-radius:12px;background:#fff;overflow:hidden}.ds5-amount:focus-within{outline:3px solid rgba(115,31,113,.14);border-color:var(--ds5-brand)}.ds5-amount__currency{min-width:52px;display:grid;place-items:center;padding:0 12px;background:var(--ds5-soft);border-right:1px solid var(--ds5-border);font-weight:800}.ds5-amount input{min-height:48px;width:100%;border:0;padding:11px 13px;font:inherit;font-variant-numeric:tabular-nums}.ds5-amount input:focus{outline:0}
@media(max-width:700px){.ds5-page-head{align-items:flex-start;margin-bottom:18px}.ds5-intent-grid{grid-template-columns:1fr}.ds5-intent-card{min-height:76px;padding:12px}.ds5-section{margin-top:22px}.portal-main,.dashboard-shell{padding-bottom:calc(86px + env(safe-area-inset-bottom))!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* DS5 Member Home — task-oriented mobile dashboard */
.ds5-home{max-width:1180px;margin:0 auto}.ds5-home-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:4px 0 8px}.ds5-home-hero h1{margin:4px 0 3px;font-size:clamp(1.8rem,4vw,2.5rem);letter-spacing:-.035em}.ds5-home-hero p:last-child{margin:0;color:var(--ds5-muted)}.ds5-home-hero__profile,.ds5-icon-action{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border:1px solid var(--ds5-border);border-radius:14px;background:var(--ds5-surface);color:var(--ds5-text);text-decoration:none;font-size:1.45rem}.ds5-section--first{margin-top:18px}.ds5-text-link{min-height:44px;display:inline-flex;align-items:center;gap:5px;color:var(--ds5-brand);font-size:.88rem;font-weight:800;text-decoration:none}
.ds5-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.ds5-summary-card{position:relative;min-height:108px;padding:16px;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:11px;border:1px solid var(--ds5-border);border-radius:var(--ds5-radius);background:var(--ds5-surface);color:var(--ds5-text);text-decoration:none}.ds5-summary-card.is-highlight{border-color:rgba(115,31,113,.25);background:linear-gradient(135deg,#fff 0%,var(--ds5-brand-soft) 100%)}.ds5-summary-card__icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:var(--ds5-brand-soft);color:var(--ds5-brand);font-size:1.3rem}.ds5-summary-card__body{min-width:0}.ds5-summary-card__body>span{display:block;color:var(--ds5-muted);font-size:.78rem;font-weight:700}.ds5-summary-card__body strong{display:block;margin-top:3px;font-size:1.08rem;line-height:1.2;overflow-wrap:anywhere}.ds5-money-value{font-variant-numeric:tabular-nums}.ds5-summary-card__arrow{color:#98a2b3}
.ds5-action-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.ds5-action{position:relative;min-height:92px;padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:1px solid var(--ds5-border);border-radius:14px;background:#fff;color:var(--ds5-text);text-align:center;text-decoration:none;font-size:.82rem;font-weight:750}.ds5-action__icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:var(--ds5-brand-soft);color:var(--ds5-brand);font-size:1.3rem}.ds5-action b{position:absolute;top:7px;right:7px;min-width:20px;height:20px;padding:0 5px;display:grid;place-items:center;border-radius:10px;background:var(--ds5-danger);color:#fff;font-size:.7rem}
.ds5-home-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.75fr);gap:16px}.ds5-panel{overflow:hidden;border:1px solid var(--ds5-border);border-radius:var(--ds5-radius);background:#fff}.ds5-panel__head{min-height:72px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--ds5-border)}.ds5-panel__head h2{margin:2px 0 0;font-size:1.05rem}.ds5-panel__head .ds5-icon-action{width:44px;height:44px;flex-basis:44px;border:0;background:var(--ds5-soft)}.ds5-count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;margin-left:4px;border-radius:11px;background:var(--ds5-brand);color:#fff;font-size:.72rem;vertical-align:2px}.ds5-list{display:grid}.ds5-list-row{min-height:72px;padding:11px 14px;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:11px;border-bottom:1px solid #f0f1f3;color:var(--ds5-text);text-decoration:none}.ds5-list-row:last-child{border-bottom:0}.ds5-list-row__icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:var(--ds5-soft);color:var(--ds5-brand);font-size:1.2rem}.ds5-list-row__main{min-width:0}.ds5-list-row__main strong,.ds5-notice-row strong{display:block;font-size:.9rem}.ds5-list-row__main small,.ds5-notice-row small{display:block;margin-top:2px;color:var(--ds5-muted);font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds5-list-row__aside{display:grid;justify-items:end;gap:4px}.ds5-list-row__aside time{color:#98a2b3;font-size:.72rem}.ds5-status{padding:3px 7px;border-radius:999px;background:#f2f4f7;color:#475467;font-size:.67rem;font-style:normal;font-weight:800;white-space:nowrap}.ds5-status.is-success{background:#ecfdf3;color:var(--ds5-success)}.ds5-status.is-warning{background:#fffaeb;color:var(--ds5-warning)}.ds5-status.is-danger{background:#fef3f2;color:var(--ds5-danger)}.ds5-notice-row{min-height:72px;padding:12px 14px;display:grid;grid-template-columns:8px minmax(0,1fr) 20px;align-items:center;gap:10px;border-bottom:1px solid #f0f1f3;color:var(--ds5-text);text-decoration:none}.ds5-notice-row:last-child{border-bottom:0}.ds5-notice-row__dot{width:7px;height:7px;border-radius:50%;background:#d0d5dd}.ds5-notice-row.is-unread .ds5-notice-row__dot{background:var(--ds5-brand)}.ds5-notice-row>iconify-icon{color:#98a2b3}.ds5-empty{min-height:150px;padding:24px;display:grid;place-items:center;align-content:center;gap:8px;color:var(--ds5-muted);text-align:center}.ds5-empty iconify-icon{font-size:1.8rem;color:#98a2b3}
@media(max-width:900px){.ds5-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.ds5-home-grid{grid-template-columns:1fr}.ds5-action-strip{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:700px){.ds5-home-hero{align-items:flex-start}.ds5-home-hero__profile{width:44px;height:44px;flex-basis:44px}.ds5-summary{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:-16px;padding:0 16px 5px}.ds5-summary::-webkit-scrollbar{display:none}.ds5-summary-card{flex:0 0:min(78vw,270px);min-height:94px;padding:13px;scroll-snap-align:start}.ds5-action-strip{display:flex;overflow-x:auto;gap:8px;margin-inline:-16px;padding:0 16px 5px;scrollbar-width:none}.ds5-action-strip::-webkit-scrollbar{display:none}.ds5-action{flex:0 0 86px;min-height:86px}.ds5-section__head{align-items:center}.ds5-list-row{grid-template-columns:40px minmax(0,1fr);padding:11px 12px}.ds5-list-row__aside{grid-column:2;display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:-5px}.ds5-list-row__icon{width:40px;height:40px}.ds5-panel__head{min-height:66px;padding:11px 12px}}

/* DS5 Member Home — mobile responsiveness hardening (2026-09-30)
 * Keep dashboard information readable at narrow and emulated mobile widths.
 * Avoid compressed KPI cards and horizontally clipped quick actions.
 */
@media (max-width: 768px) {
  .member-page .ds5-home { width:100%; max-width:100%; min-width:0; overflow-x:hidden; }
  .member-page .ds5-home .ds5-section { min-width:0; }
  .member-page .ds5-home .ds5-section__head { min-width:0; }

  .member-page .ds5-home .ds5-summary {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    width:100%;
    margin-inline:0;
    padding:0;
    overflow:visible;
    scroll-snap-type:none;
  }
  .member-page .ds5-home .ds5-summary-card {
    min-width:0;
    width:100%;
    min-height:112px;
    padding:12px;
    grid-template-columns:38px minmax(0,1fr);
    grid-template-rows:auto auto;
    align-content:center;
    gap:8px 10px;
    overflow:hidden;
  }
  .member-page .ds5-home .ds5-summary-card__icon {
    width:38px;
    height:38px;
    grid-row:1 / span 2;
  }
  .member-page .ds5-home .ds5-summary-card__body { min-width:0; }
  .member-page .ds5-home .ds5-summary-card__body > span {
    line-height:1.25;
    overflow-wrap:normal;
    word-break:normal;
  }
  .member-page .ds5-home .ds5-summary-card__body strong {
    margin-top:5px;
    font-size:1rem;
    line-height:1.2;
    overflow-wrap:normal;
    word-break:normal;
  }
  .member-page .ds5-home .ds5-summary-card__arrow { display:none; }

  .member-page .ds5-home .ds5-action-strip {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    width:100%;
    margin-inline:0;
    padding:0;
    overflow:visible;
  }
  .member-page .ds5-home .ds5-action {
    width:100%;
    min-width:0;
    min-height:88px;
    padding:10px 6px;
  }
  .member-page .ds5-home .ds5-action > span:last-of-type {
    max-width:100%;
    line-height:1.2;
    overflow-wrap:normal;
    word-break:normal;
  }
}

@media (max-width: 420px) {
  .member-page .ds5-home .ds5-summary { grid-template-columns:1fr; }
  .member-page .ds5-home .ds5-summary-card {
    min-height:82px;
    grid-template-columns:40px minmax(0,1fr);
  }
  .member-page .ds5-home .ds5-action-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .member-page .ds5-home .ds5-action { min-height:82px; }
  .member-page .ds5-home-hero h1 { font-size:1.55rem; }
  .member-page .ds5-home-hero p:last-child { font-size:.88rem; line-height:1.4; }
}

/* ================================================================
   DS5 Enhancement 3 — Core Money Journeys
   Canonical finance surfaces shared by Transfers, Loans,
   Contributions, Annual Capital and Investments.
   ================================================================ */
.ds5-core-money{--ds5-money-border:#e8e2ea;--ds5-money-soft:#faf7fb;--ds5-money-ink:#171321;--ds5-money-muted:#6e6878;min-width:0}
.ds5-core-money :where(.request-card,.loan-panel-modern,.investment-current-card,.loan-v4__active-card,.capital-summary-card,.transfer-v3-work-queue,.loan-empty-state-card){border:1px solid var(--ds5-money-border);border-radius:18px;box-shadow:0 8px 24px rgba(27,18,31,.045);background:#fff}
.ds5-core-money :where(.button-primary,.button-secondary,button,a)[class*="button-"]{min-height:44px;border-radius:12px}
.ds5-core-money .ds5-money-input,.ds5-core-money input[type="number"]{min-height:48px;border-radius:12px;font-variant-numeric:tabular-nums}
.ds5-core-money :where(input,select,textarea){max-width:100%}
.ds5-core-money :where(.request-status){white-space:nowrap}
.ds5-status{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:4px 9px;border-radius:999px;font-size:.75rem;font-weight:700;line-height:1.1;white-space:nowrap;background:#eef3fb;color:#35527b}
.ds5-status__dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.ds5-status--success{background:#edf8f1;color:#267146}.ds5-status--warning{background:#fff7e7;color:#8a5a00}.ds5-status--danger{background:#fff0f0;color:#a33b3b}.ds5-status--info{background:#eef3fb;color:#35527b}
.ds5-money-value{display:flex;flex-direction:column;min-width:0}.ds5-money-value small{font-size:.68rem;font-weight:800;color:var(--ds5-money-muted);letter-spacing:.06em}.ds5-money-value strong{font-size:1.15rem;color:var(--ds5-money-ink);font-variant-numeric:tabular-nums}.ds5-money-value span{font-size:.76rem;color:var(--ds5-money-muted)}
.ds5-record-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto 18px;gap:10px;align-items:center;min-height:68px;padding:10px 12px;border:1px solid var(--ds5-money-border);border-radius:14px;background:#fff;color:inherit;text-decoration:none}
.ds5-record-row__icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#f5edf6;color:var(--ds5-primary,#731f71);font-size:1.25rem}.ds5-record-row__main,.ds5-record-row__side{display:flex;flex-direction:column;min-width:0}.ds5-record-row__main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds5-record-row__main small{color:var(--ds5-money-muted)}.ds5-record-row__side{align-items:flex-end;gap:4px}.ds5-record-row__chevron{color:#8d8794}
@media(max-width:768px){
 .ds5-core-money{width:100%;max-width:100%;overflow-x:hidden}
 .ds5-core-money :where(.transfer-detail-hero,.loan-v4__hero,.transfer-section-head,.loan-v4__section-head){min-width:0}
 .ds5-core-money :where(.transfer-detail-hero__actions,.loan-v4__hero-actions){width:100%;flex-wrap:wrap}
 .ds5-core-money :where(.loan-details-input-grid,.investment-v3-form,.contribution-pay-form){min-width:0}
 .ds5-core-money :where(.loan-details-input-grid){grid-template-columns:1fr!important}
 .ds5-core-money :where(input,select,textarea,button){font-size:16px}
 .ds5-core-money :where(.button-primary,.button-secondary){max-width:100%}
 .ds5-core-money :where(table){min-width:640px}
 .ds5-core-money :where(.table-responsive,.responsive-table,.ds-table-wrap){overflow-x:auto;-webkit-overflow-scrolling:touch}
 .ds5-record-row{grid-template-columns:40px minmax(0,1fr) 18px}.ds5-record-row__side{grid-column:2/3;align-items:flex-start}.ds5-record-row__chevron{grid-column:3;grid-row:1/3}
}
@media(max-width:420px){.ds5-core-money :where(.button-primary,.button-secondary){width:100%;justify-content:center}.ds5-core-money :where(.request-status){font-size:.7rem}}

/* ================================================================
   DS5 Enhancement 4 — Core Money Journey Deep Migration
   ================================================================ */
.ds5-deep-money{--ds5-surface:#fff;--ds5-soft:#f8f5f9;--ds5-border:#e7e0e9}
.ds5-deep-money .ds5-financial-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ds5-deep-money .ds5-financial-summary>article{min-width:0;padding:14px;border:1px solid var(--ds5-border);border-radius:16px;background:var(--ds5-surface)}
.ds5-deep-money .ds5-financial-summary>article>span{display:block;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.045em;color:#6e6878}
.ds5-deep-money .ds5-financial-summary>article>strong{display:block;margin-top:5px;font-size:1.12rem;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:normal;word-break:normal}
.ds5-deep-money .ds5-financial-summary>article>small{display:block;margin-top:4px;color:#6e6878;line-height:1.3}
.ds5-confirmation{padding:16px;border:1px solid var(--ds5-border,#e7e0e9);border-radius:18px;background:#fff}.ds5-confirmation header{display:flex;gap:12px;align-items:flex-start}.ds5-confirmation h3,.ds5-confirmation p{margin:0}.ds5-confirmation p{margin-top:3px;color:#6e6878}.ds5-confirmation__icon{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:12px;background:#f4ebf5;color:var(--ds5-primary,#731f71);font-size:1.3rem}.ds5-confirmation dl{margin:14px 0 0}.ds5-confirmation dl>div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-top:1px solid #eee8ef}.ds5-confirmation dt{color:#6e6878}.ds5-confirmation dd{margin:0;font-weight:800;text-align:right}.ds5-confirmation__action{width:100%;margin-top:14px}
.ds5-action-menu{position:relative}.ds5-action-menu__trigger{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--ds5-border,#e7e0e9);border-radius:12px;background:#fff}.ds5-action-menu__sheet{display:none;position:absolute;right:0;z-index:20;min-width:190px;padding:6px;border:1px solid var(--ds5-border,#e7e0e9);border-radius:14px;background:#fff;box-shadow:0 14px 38px rgba(20,14,25,.14)}.ds5-action-menu:focus-within .ds5-action-menu__sheet{display:grid}.ds5-action-menu__sheet a{display:flex;align-items:center;gap:9px;min-height:44px;padding:8px 10px;border-radius:10px;color:inherit;text-decoration:none}.ds5-action-menu__sheet a:hover{background:#f8f5f9}
@media(max-width:768px){
 .ds5-deep-money .ds5-financial-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .ds5-deep-money .ds5-financial-summary>article{padding:12px;min-height:96px}
 .ds5-deep-money .ds5-financial-summary>article>strong{font-size:1rem}
 .ds5-deep-money :where(.transfer-card-list,.loan-v4__history>div,.contribution-history-list,.investment-history-list){display:grid;grid-template-columns:1fr;gap:10px}
 .ds5-deep-money :where(.transfer-record-card,.loan-v4__history-item,.contribution-history-card,.investment-history-card){width:100%;max-width:100%;margin:0;overflow:hidden}
 .ds5-deep-money :where(.transfer-record-head,.contribution-history-card){gap:10px}
 .ds5-deep-money :where(.transfer-record-actions){flex-wrap:wrap;justify-content:flex-start}
 .ds5-action-menu__sheet{position:fixed;left:12px;right:12px;bottom:calc(76px + env(safe-area-inset-bottom));top:auto;min-width:0;border-radius:18px;padding:10px;box-shadow:0 -12px 40px rgba(20,14,25,.18)}
}
@media(max-width:420px){.ds5-deep-money .ds5-financial-summary{grid-template-columns:1fr!important}.ds5-deep-money .ds5-financial-summary>article{min-height:0}}

/* ================================================================
   DS5 Enhancements 9–15 — Experience convergence
   Activity, identity, work, search, feedback, accessibility, mobile QA.
   ================================================================ */
.ds5-page-intro{margin-bottom:16px}.ds5-page-intro h1{margin:.15rem 0 .3rem}.ds5-page-intro p:last-child{margin:0;color:#6e6878}
.ds5-filter-chips,.ds5-work-filters{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 0 12px}.ds5-filter-chips::-webkit-scrollbar{display:none}.ds5-filter-chips a,.ds5-work-filters a{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:7px 12px;border:1px solid #e6dfe8;border-radius:999px;background:#fff;color:#514b57;text-decoration:none;font-weight:750;white-space:nowrap}.ds5-filter-chips a.is-active,.ds5-work-filters a.is-active{background:#731f71;color:#fff;border-color:#731f71}.ds5-work-filters a span{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:rgba(115,31,113,.1);font-size:.7rem}.ds5-work-filters a.is-active span{background:rgba(255,255,255,.2)}
.ds5-timeline{display:grid;gap:8px}.ds5-timeline__day{margin:16px 0 2px;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:#716a77}.ds5-activity-item{display:grid;grid-template-columns:42px minmax(0,1fr) 40px;gap:11px;align-items:start;padding:13px;border:1px solid #e8e2ea;border-radius:16px;background:#fff}.ds5-activity-item.needs-action{border-color:#dcc2df;background:#fdfafd}.ds5-activity-item__icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#f5edf6;color:#731f71;font-size:1.25rem}.ds5-activity-item strong{display:block}.ds5-activity-item p{margin:3px 0;color:#625c68;line-height:1.4}.ds5-activity-item small{color:#817987}.ds5-activity-item__action{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:#731f71;text-decoration:none}.ds5-activity-item__action:hover{background:#f5edf6}
.ds5-empty-state{display:grid;justify-items:center;text-align:center;gap:8px;padding:30px 20px;border:1px solid #e8e2ea;border-radius:18px;background:#fff}.ds5-empty-state>span{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:#f5edf6;color:#731f71;font-size:1.6rem}.ds5-empty-state h2,.ds5-empty-state p{margin:0}.ds5-empty-state p{max-width:430px;color:#6e6878}.ds5-empty-state a{margin-top:6px}
.ds5-feedback{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:#eef3fb;color:#35527b}.ds5-feedback>iconify-icon{font-size:1.25rem;margin-top:1px}.ds5-feedback strong{display:block}.ds5-feedback p{margin:2px 0 0}.ds5-feedback--success{background:#edf8f1;color:#267146}.ds5-feedback--danger{background:#fff0f0;color:#a33b3b}
.ds5-identity-hub{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:16px 0}.ds5-identity-hub a{display:grid;justify-items:center;gap:5px;min-height:70px;padding:10px 5px;border:1px solid #e8e2ea;border-radius:14px;background:#fff;color:#625c68;text-decoration:none;font-size:.76rem;font-weight:750}.ds5-identity-hub iconify-icon{font-size:1.25rem}.ds5-identity-hub a.is-active{border-color:#d7bfd9;background:#f8f1f8;color:#731f71}
.ds5-universal-search form{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 8px 7px 13px;border:1px solid #e2dce5;border-radius:15px;background:#fff;margin:16px 0}.ds5-universal-search form>iconify-icon{font-size:1.3rem;color:#6e6878}.ds5-universal-search input{min-width:0;height:44px;border:0;outline:0;font:inherit}.ds5-universal-search button{min-height:44px;padding:0 18px;border:0;border-radius:11px;background:#731f71;color:#fff;font-weight:800}.ds5-search-results{display:grid;gap:8px}.ds5-search-results>a{display:grid;grid-template-columns:42px minmax(0,1fr) 22px;gap:11px;align-items:center;padding:12px;border:1px solid #e8e2ea;border-radius:15px;background:#fff;color:inherit;text-decoration:none}.ds5-search-results>a>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#f5edf6;color:#731f71}.ds5-search-results>a>div{display:grid;min-width:0}.ds5-search-results small{color:#731f71;font-weight:800}.ds5-search-results strong,.ds5-search-results em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds5-search-results em{font-style:normal;color:#6e6878;text-transform:capitalize}
/* DS5 accessibility contract */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid rgba(115,31,113,.35);outline-offset:2px}:where(button,a,input,select){touch-action:manipulation}.ds5-enabled :where(button,a,input,select,textarea){scroll-margin-bottom:100px}
@media(max-width:768px){.ds5-identity-hub{grid-template-columns:repeat(3,minmax(0,1fr))}.ds5-universal-search form{grid-template-columns:28px minmax(0,1fr)}.ds5-universal-search form button{grid-column:1/-1;width:100%}.ds5-activity-item{grid-template-columns:40px minmax(0,1fr) 36px;padding:11px}.ds5-activity-item__icon{width:40px;height:40px}.ds5-work-queue .ds4-work-item{min-width:0}.ds5-work-queue .ds4-work-item__body{min-width:0}.ds5-work-queue .ds4-work-item__body span{overflow-wrap:anywhere}}
@media(max-width:390px){.ds5-identity-hub{grid-template-columns:repeat(2,minmax(0,1fr))}.ds5-activity-item{grid-template-columns:36px minmax(0,1fr) 32px;gap:9px}.ds5-activity-item__icon{width:36px;height:36px}.ds5-filter-chips{margin-right:-12px;padding-right:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Hide hints while entering text; preserve the field value and label. */
input:focus::placeholder, textarea:focus::placeholder { color:transparent!important; opacity:0!important; }