/* Asset build: 20260807-no-cut-layout-final */
:root {
    --brand: #176b4a;
    --brand-strong: #0f533a;
    --brand-dark: #0a2e23;
    --brand-deep: #07261d;
    --brand-soft: #eef6f2;
    --brand-soft-2: #f6faf8;
    --accent: #d3b447;
    --accent-soft: #fbf5df;
    --canvas: #f5f7f6;
    --surface: #ffffff;
    --surface-muted: #fafcfb;
    --text: #18231e;
    --text-soft: #48564f;
    --muted: #748078;
    --line: #dce4df;
    --line-soft: #e9eeeb;
    --danger: #bd3b3b;
    --danger-soft: #fff0ef;
    --warning: #9a680d;
    --warning-soft: #fff6df;
    --info: #315f9e;
    --info-soft: #edf3fb;
    --success: #176b4a;
    --success-soft: #eaf6ef;
    --sidebar-width: 278px;
    --radius-sm: 8px;
    --radius: 12px;
    --radius-lg: 16px;
    --shadow-sm: 0 1px 2px rgba(10, 40, 29, .035), 0 4px 14px rgba(10, 40, 29, .025);
    --shadow: 0 12px 32px rgba(10, 40, 29, .07);
    --shadow-strong: 0 24px 60px rgba(5, 31, 22, .18);
}

/* Payroll review payment sheet */
.payroll-sheet-card{padding:16px!important}.payroll-sheet-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:14px 0}.payroll-sheet-summary article{min-height:74px;padding:13px;background:#fbfdfc;border:1px solid #e6ece8;border-radius:7px}.payroll-sheet-summary span{display:block;color:#65736c;font-size:10px;font-weight:800}.payroll-sheet-summary b{display:block;margin-top:12px;color:#17231d;font-size:15px}.payroll-payment-sheet tfoot th{background:#f4fbf6!important;color:#0b6f37!important;font-weight:900!important}@media(max-width:760px){.payroll-sheet-summary{grid-template-columns:1fr 1fr}.payroll-payment-sheet{min-width:1150px}}
.payroll-send-batch{display:grid;grid-template-columns:1fr 1fr 1fr 1.2fr auto;gap:10px;align-items:end;margin:14px 0;padding:14px;background:#f6fbf8;border:1px solid #dbece2;border-radius:8px}.payroll-send-batch label{display:grid;gap:6px}.payroll-send-batch span{color:#52635a;font-size:10px;font-weight:850}.payroll-send-batch input,.payroll-send-batch select{min-height:40px;border:1px solid #d7e2dc;border-radius:7px;background:#fff;padding:0 11px;font-size:11px}.payroll-send-batch .wide{min-width:180px}.payroll-send-batch button{white-space:nowrap}@media(max-width:1050px){.payroll-send-batch{grid-template-columns:1fr 1fr}.payroll-send-batch button{grid-column:1/-1}}@media(max-width:640px){.payroll-send-batch{grid-template-columns:1fr}}

* { box-sizing: border-box; }
html { font-size: 14px; scroll-behavior: smooth; }
body {
    margin: 0;
    min-width: 320px;
    color: var(--text);
    background: var(--canvas);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    font-feature-settings: "cv02", "cv03", "cv04", "cv11";
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
button, input, select, textarea { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
[hidden] { display: none !important; }
.ui-icon { display: block; flex: 0 0 auto; }

.app { display: flex; min-height: 100vh; }

/* Sidebar */
.sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 60;
    width: var(--sidebar-width);
    padding: 20px 14px 90px;
    overflow-y: auto;
    overscroll-behavior: contain;
    color: rgba(238, 245, 241, .88);
    background:
        radial-gradient(circle at 15% -10%, rgba(211, 180, 71, .10), transparent 30%),
        linear-gradient(180deg, #0c3428 0%, var(--brand-deep) 100%);
    border-right: 1px solid rgba(255,255,255,.05);
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.14) transparent;
}
.sidebar::-webkit-scrollbar { width: 5px; }
.sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14); border-radius: 999px; }

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    padding: 0 7px 18px;
    margin-bottom: 14px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.brand-mark {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 12px;
    background: linear-gradient(145deg, #e3c55d, #c5a438);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.24), 0 8px 18px rgba(0,0,0,.18);
}
.brand-mark img { width: 34px; height: 30px; object-fit: contain; }
.brand-copy { min-width: 0; }
.brand-name {
    display: block;
    color: #fff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -.25px;
}
.brand-subtitle {
    display: block;
    margin-top: 5px;
    color: rgba(255,255,255,.50);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .3px;
}

.Workspace-card {
    margin: 0 4px 20px;
    padding: 13px 14px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 12px;
    background: rgba(255,255,255,.025);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.Workspace-card-label {
    display: block;
    margin-bottom: 6px;
    color: rgba(255,255,255,.40);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.25px;
    text-transform: uppercase;
}
.Workspace-card strong {
    display: block;
    overflow: hidden;
    color: #f1d46d;
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.Workspace-card small {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 8px;
    color: rgba(255,255,255,.43);
    font-size: 9px;
}
.Workspace-card small i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #5fcb87;
    box-shadow: 0 0 0 3px rgba(95,203,135,.10);
}

.nav-caption {
    padding: 0 10px 8px;
    color: rgba(255,255,255,.30);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.35px;
    text-transform: uppercase;
}
.nav { display: flex; flex-direction: column; gap: 4px; }
.nav-section { border-radius: 11px; }
.nav-parent,
.nav-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 10px 11px;
    color: rgba(231,239,235,.76);
    background: transparent;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
    text-align: left;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.2;
    transition: color .17s ease, background .17s ease, transform .17s ease;
}
.nav-parent:hover,
.nav-link:hover {
    color: #fff;
    background: rgba(255,255,255,.055);
}
.nav-parent.active-parent { color: #fff; }
.nav-parent.active-parent::after {
    content: "";
    position: absolute;
    inset: 5px;
    z-index: -1;
    border-radius: 8px;
    background: rgba(255,255,255,.035);
}
.nav-link.active {
    color: #f1d46d;
    background: rgba(211,180,71,.09);
}
.nav-link.active::before {
    content: "";
    position: absolute;
    left: -1px;
    top: 11px;
    bottom: 11px;
    width: 3px;
    border-radius: 999px;
    background: var(--accent);
    box-shadow: 0 0 12px rgba(211,180,71,.38);
}
.nav-icon {
    display: grid;
    place-items: center;
    width: 22px;
    min-width: 22px;
    color: rgba(232,240,236,.65);
}
.nav-parent:hover .nav-icon,
.nav-link:hover .nav-icon,
.nav-parent.active-parent .nav-icon { color: #fff; }
.nav-link.active .nav-icon { color: var(--accent); }
.nav-label {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.nav-caret {
    display: grid;
    place-items: center;
    color: rgba(255,255,255,.32);
    transition: transform .22s ease, color .18s ease;
}
.nav-parent:hover .nav-caret { color: rgba(255,255,255,.62); }
.nav-section.is-open .nav-caret { transform: rotate(180deg); }
.nav-children {
    max-height: 0;
    overflow: hidden;
    margin-left: 22px;
    border-left: 1px solid rgba(255,255,255,.075);
    opacity: 0;
    transform: translateY(-3px);
    transition: max-height .28s ease, opacity .20s ease, transform .20s ease, padding .20s ease;
}
.nav-section.is-open .nav-children {
    max-height: 460px;
    padding: 3px 0 7px;
    opacity: 1;
    transform: translateY(0);
}
.nav-children-inner { padding-left: 10px; }
.nav-children .nav-link {
    min-height: 38px;
    padding: 8px 10px;
    font-size: 11.5px;
    font-weight: 450;
}
.nav-children .nav-icon { width: 19px; min-width: 19px; }

.sidebar-user {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 62;
    display: flex;
    align-items: center;
    gap: 10px;
    width: var(--sidebar-width);
    min-height: 72px;
    padding: 11px 16px;
    background: rgba(6, 31, 23, .97);
    border-top: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(14px);
}
.avatar,
.mini-avatar {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    border-radius: 50%;
    color: #164c37;
    background: #eef5f1;
    border: 1px solid rgba(255,255,255,.48);
    font-size: 12px;
    font-weight: 650;
}
.sidebar-user-copy { flex: 1; min-width: 0; }
.sidebar-user-name,
.sidebar-user-role { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user-name { color: #f5f8f6; font-size: 11.5px; font-weight: 600; }
.sidebar-user-role { margin-top: 4px; color: rgba(255,255,255,.40); font-size: 9.5px; font-weight: 450; }
.sidebar-user > a {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    color: rgba(255,255,255,.54);
    transition: color .16s ease, background .16s ease;
}
.sidebar-user > a:hover { color: #fff; background: rgba(255,255,255,.07); }

/* Main shell */
.main {
    display: flex;
    flex-direction: column;
    width: calc(100% - var(--sidebar-width));
    min-height: 100vh;
    margin-left: var(--sidebar-width);
}
.topbar {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 82px;
    padding: 0 28px;
    background: rgba(255,255,255,.93);
    border-bottom: 1px solid var(--line-soft);
    backdrop-filter: blur(18px);
}
.top-left { display: flex; align-items: center; gap: 12px; min-width: 0; }
.page-heading-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    color: var(--brand);
    background: var(--brand-soft);
    border: 1px solid #dcebe3;
    border-radius: 11px;
}
.page-heading-copy { min-width: 0; }
.topbar h1 {
    margin: 0;
    color: #142019;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -.45px;
}
.topbar p {
    margin: 6px 0 0;
    color: var(--muted);
    font-size: 10.5px;
    font-weight: 450;
    line-height: 1.25;
}
.menu-btn {
    display: none;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    color: #5c6962;
    background: transparent;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
}
.menu-btn:hover { color: var(--brand); background: var(--brand-soft); }
.top-actions { display: flex; align-items: center; gap: 10px; color: var(--text-soft); }
.top-role,
.period {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    font-size: 10px;
    font-weight: 550;
    white-space: nowrap;
}
.top-role { color: var(--brand-strong); background: var(--brand-soft-2); }
.period { color: var(--muted); }
.mini-avatar { width: 35px; height: 35px; }
.content { flex: 1; width: 100%; padding: 28px 30px 34px; }
.footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 30px 20px;
    color: #8b9690;
    font-size: 9.5px;
}
.overlay { display: none; }

/* Shared surfaces */
.card,
.panel {
    background: var(--surface);
    border: 1px solid var(--line-soft);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
}
.cards {
    display: grid;
    grid-template-columns: repeat(6, minmax(140px, 1fr));
    gap: 14px;
}
.stat {
    position: relative;
    min-height: 118px;
    padding: 18px;
    overflow: hidden;
}
.stat::before {
    content: "";
    position: absolute;
    top: 17px;
    right: 17px;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--brand-soft);
}
.stat .label { color: var(--muted); font-size: 10px; font-weight: 550; }
.stat .value { margin: 24px 0 5px; font-size: 21px; font-weight: 650; letter-spacing: -.4px; }
.stat .trend { color: var(--brand); font-size: 9.5px; }
.grid-2 {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(290px, .95fr);
    gap: 16px;
    margin-top: 16px;
}
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
.panel { padding: 20px; }
.panel-head,
.toolbar,
.section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 17px;
}
.panel h2,
.section-title h3 {
    margin: 0;
    color: #1a261f;
    font-size: 14px;
    font-weight: 620;
    letter-spacing: -.12px;
}
.panel h3 { font-weight: 620; }
.panel small { color: var(--muted); font-size: 10px; line-height: 1.5; }

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 9px 15px;
    color: #fff;
    background: var(--brand);
    border: 1px solid var(--brand);
    border-radius: 9px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    transition: background .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.btn:hover {
    background: var(--brand-strong);
    border-color: var(--brand-strong);
    box-shadow: 0 7px 18px rgba(23,107,74,.15);
}
.btn:active { transform: translateY(1px); }
.btn.secondary {
    color: var(--brand-strong);
    background: #fff;
    border-color: #bfd5ca;
}
.btn.secondary:hover { background: var(--brand-soft-2); border-color: #9ebdac; box-shadow: none; }
.btn.ghost { color: #536158; background: transparent; border-color: var(--line); }
.btn.ghost:hover { color: var(--brand); background: var(--brand-soft-2); box-shadow: none; }
.btn.danger { background: var(--danger); border-color: var(--danger); }
.btn:disabled,
.btn.disabled { opacity: .46; pointer-events: none; }
.btn .ui-icon { width: 16px; height: 16px; }

.search,
input,
select,
textarea {
    width: 100%;
    min-height: 43px;
    padding: 10px 12px;
    color: var(--text);
    background: #fff;
    border: 1px solid #d5dfd9;
    border-radius: 9px;
    outline: none;
    font-size: 11.5px;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
textarea { min-height: 96px; resize: vertical; line-height: 1.55; }
input::placeholder,
textarea::placeholder { color: #a2aca6; }
.search:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: #6ca98a;
    box-shadow: 0 0 0 4px rgba(23,107,74,.08);
    background: #fff;
}
input[readonly] { color: #6b7770; background: #f6f8f7; cursor: default; }
.search { max-width: 330px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.form-group label,
.field label {
    display: block;
    margin-bottom: 7px;
    color: #3c4a42;
    font-size: 10.5px;
    font-weight: 600;
}
.form-group label em,
.field label em { color: #c64242; font-style: normal; }

.table-wrap {
    overflow: auto;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    background: #fff;
}
.table { width: 100%; border-collapse: collapse; font-size: 10.5px; }
.table th {
    padding: 12px 13px;
    color: #64716a;
    background: #f7faf8;
    border-bottom: 1px solid var(--line);
    text-align: left;
    white-space: nowrap;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
}
.table td {
    padding: 13px;
    color: #334139;
    border-bottom: 1px solid var(--line-soft);
    white-space: nowrap;
}
.table tr:last-child td { border-bottom: 0; }
.table tbody tr { transition: background .14s ease; }
.table tbody tr:hover td { background: #fbfdfc; }
.table td strong { color: #1f2d25; font-weight: 620; }
.badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 9px;
    color: var(--success);
    background: var(--success-soft);
    border: 1px solid #d7eadf;
    border-radius: 999px;
    font-size: 8.5px;
    font-weight: 650;
    white-space: nowrap;
}
.badge.pending,
.badge.pending_supervisor,
.badge.pending_manager,
.badge.pending_finance,
.badge.medium,
.badge.submitted,
.badge.processing { color: var(--warning); background: var(--warning-soft); border-color: #f0dfac; }
.badge.rejected,
.badge.failed,
.badge.high,
.badge.ineligible,
.badge.blocked { color: #a83332; background: var(--danger-soft); border-color: #f0d0ce; }
.badge.finance_approved,
.badge.manager_approved,
.badge.ready_disbursement { color: var(--info); background: var(--info-soft); border-color: #d7e2f1; }
.inline-form { display: inline; }
.empty { padding: 48px 22px; color: var(--muted); text-align: center; font-size: 11px; }
.flash {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 18px;
    padding: 13px 15px;
    color: #0d633b;
    background: var(--success-soft);
    border: 1px solid #cfe7da;
    border-radius: 10px;
    font-size: 11px;
    line-height: 1.5;
}
.flash > span { margin-top: 1px; }
.flash.error { color: #a42d2d; background: var(--danger-soft); border-color: #f0cecc; }
.setup-notice {
    margin: 13px 0 0;
    padding: 12px 14px;
    color: #72530d;
    background: var(--warning-soft);
    border: 1px solid #ead79d;
    border-radius: 9px;
    font-size: 10px;
    line-height: 1.55;
}
.setup-notice a { color: var(--brand); font-weight: 650; }

.kpi { display: flex; align-items: flex-end; gap: 16px; height: 190px; padding: 22px; border-bottom: 1px solid var(--line-soft); }
.bar { position: relative; flex: 1; min-height: 12px; background: linear-gradient(#41a974, #176b4a); border-radius: 5px 5px 0 0; }
.metric-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }

/* Payments */
.payments-page { width: 100%; max-width: 1320px; margin: 0 auto; }
.payments-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}
.payments-header-copy { min-width: 0; }
.payments-header h2 {
    margin: 0 0 6px;
    color: #1a261f;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -.3px;
}
.payments-header p,
.pay-intro p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.payment-head-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.role-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 9px 13px;
    color: #3e4e45;
    background: #f5f8f6;
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 550;
}
.role-pill .ui-icon { color: var(--brand); }
.payment-tabs {
    display: flex;
    width: 100%;
    max-width: 780px;
    margin-bottom: 24px;
    padding: 4px;
    overflow-x: auto;
    background: #e9efec;
    border: 1px solid #e0e7e3;
    border-radius: 11px;
    scrollbar-width: none;
}
.payment-tabs::-webkit-scrollbar { display: none; }
.payment-tabs a {
    flex: 1;
    min-width: 145px;
    padding: 10px 15px;
    color: #65726b;
    border-radius: 8px;
    text-align: center;
    white-space: nowrap;
    font-size: 10.5px;
    font-weight: 550;
    transition: color .16s ease, background .16s ease, box-shadow .16s ease;
}
.payment-tabs a:hover { color: var(--brand-strong); }
.payment-tabs a.active {
    color: #17221c;
    background: #fff;
    box-shadow: 0 2px 9px rgba(17,47,35,.08);
}
.payment-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, .72fr);
    gap: 20px;
    align-items: start;
}
.payment-main { min-width: 0; }
.payment-side { display: grid; gap: 16px; position: sticky; top: 104px; }
.pay-intro { margin-bottom: 14px; }
.pay-intro h2 {
    margin: 0 0 6px;
    color: #18241d;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 19px;
    font-weight: 600;
    letter-spacing: -.25px;
}
.approval-chain {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 16px;
    padding: 13px 16px;
    background: #f2f7f4;
    border: 1px solid #d8e5de;
    border-radius: 11px;
}
.approval-chain > b {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #244638;
    font-size: 10.5px;
    font-weight: 650;
    white-space: nowrap;
}
.approval-chain > b .ui-icon { color: var(--brand); }
.approval-chain div { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.approval-chain span {
    padding: 5px 10px;
    color: #758079;
    background: #fff;
    border: 1px solid #d6dfda;
    border-radius: 999px;
    font-size: 8.5px;
    font-weight: 600;
}
.approval-chain span.done { color: #fff; background: var(--brand); border-color: var(--brand); }
.approval-chain i { color: #a2ada7; font-size: 10px; font-style: normal; }

.payment-form { display: grid; gap: 14px; }
.payment-card {
    position: relative;
    padding: 21px 22px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 13px;
    box-shadow: var(--shadow-sm);
}
.payment-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 20px;
    width: 3px;
    height: 28px;
    border-radius: 0 999px 999px 0;
    background: #d8e8df;
}
.payment-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}
.payment-card h3 { margin: 0; color: #1f2b24; font-size: 12.5px; font-weight: 650; }
.payment-card-subtitle { display: block; margin-top: 5px; color: var(--muted); font-size: 9.5px; line-height: 1.45; }
.payment-card > label { display: block; margin-bottom: 8px; color: #36463d; font-size: 10.5px; font-weight: 600; }
.payment-card label em { color: #c53f3f; font-style: normal; }
.payment-card input,
.payment-card select,
.payment-card textarea { min-height: 45px; padding: 11px 13px; background: #fbfcfb; font-size: 11.5px; }
.payment-card textarea { min-height: 92px; }
.method-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.method-option {
    display: flex !important;
    align-items: center;
    gap: 12px;
    min-height: 78px;
    margin: 0 !important;
    padding: 15px 16px;
    background: #fff;
    border: 1px solid #d7e0db;
    border-radius: 11px;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}
.method-option:hover { border-color: #a7c5b6; transform: translateY(-1px); }
.method-option.selected,
.method-option:has(input:checked) {
    background: #f8fbf9;
    border-color: var(--brand);
    box-shadow: inset 0 0 0 1px var(--brand), 0 7px 18px rgba(23,107,74,.06);
}
.method-option input { display: none; }
.method-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    color: var(--brand);
    background: var(--brand-soft);
    border: 1px solid #dcebe3;
    border-radius: 10px;
}
.method-option b { color: #203028; font-size: 12px; font-weight: 620; }
.method-option small { display: block; margin-top: 5px; color: var(--muted); font-size: 9.5px; font-weight: 450; }
.farmer-search-wrap { position: relative; }
.farmer-search-wrap .search-icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #79867f;
    pointer-events: none;
}
.farmer-search-wrap input { padding-left: 42px; }
.farmer-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
    padding: 12px 13px;
    background: #f6faf8;
    border: 1px solid #dce7e1;
    border-radius: 9px;
}
.farmer-summary strong { color: #203128; font-size: 10.5px; font-weight: 650; }
.farmer-summary span { color: var(--muted); font-size: 9.5px; line-height: 1.45; }
.payment-note {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 13px;
    padding: 11px 12px;
    color: #617069;
    background: #f5f8f6;
    border: 1px solid #e0e7e3;
    border-radius: 9px;
    font-size: 9.5px;
    line-height: 1.55;
}
.payment-note .ui-icon { margin-top: 1px; color: var(--brand); }
.form-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 5px 0 28px; }
.form-actions .btn { min-height: 43px; padding: 11px 18px; }

/* Wallet */
.wallet-overview {
    position: relative;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 92% 0%, rgba(211,180,71,.20), transparent 34%),
        linear-gradient(145deg, #174b38 0%, #0a2c21 70%);
    border: 0;
    border-radius: 15px;
    box-shadow: 0 18px 42px rgba(8,45,32,.18);
}
.wallet-overview::after {
    content: "";
    position: absolute;
    width: 150px;
    height: 150px;
    right: -72px;
    bottom: -90px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 50%;
}
.wallet-overview-inner { position: relative; z-index: 1; padding: 21px; }
.wallet-overview-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.wallet-provider { display: flex; align-items: center; gap: 10px; }
.wallet-provider-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    color: #173b2e;
    background: linear-gradient(145deg, #e2c55f, #c8a73a);
    border-radius: 10px;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.25);
}
.wallet-provider-name { display: block; font-size: 12px; font-weight: 650; }
.wallet-provider-ref { display: block; margin-top: 4px; color: rgba(255,255,255,.52); font-size: 9px; }
.wallet-status {
    padding: 5px 8px;
    color: #c5efd4;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 999px;
    font-size: 8.5px;
    font-weight: 600;
}
.wallet-balance-label { margin-top: 26px; color: rgba(255,255,255,.55); font-size: 9.5px; }
.wallet-balance { margin-top: 6px; font-size: 30px; font-weight: 650; letter-spacing: -.75px; }
.wallet-sync { margin-top: 7px; color: rgba(255,255,255,.43); font-size: 8.5px; }
.wallet-actions { display: grid; grid-template-columns: 1fr auto; gap: 9px; margin-top: 20px; }
.wallet-actions .btn { border-color: transparent; }
.wallet-actions .btn.wallet-recharge { color: #173a2c; background: linear-gradient(145deg, #e2c65e, #cda93d); }
.wallet-actions .btn.wallet-recharge:hover { background: #e2c35a; box-shadow: 0 8px 18px rgba(0,0,0,.12); }
.wallet-actions .btn.wallet-refresh {
    width: 42px;
    padding: 0;
    color: rgba(255,255,255,.80);
    background: rgba(255,255,255,.09);
    border: 1px solid rgba(255,255,255,.08);
}
.wallet-actions .btn.wallet-refresh:hover { color: #fff; background: rgba(255,255,255,.14); box-shadow: none; }

.workflow-card { padding: 18px; }
.workflow-card h3 { margin: 0 0 15px; color: #1f2d25; font-size: 12px; font-weight: 650; }
.workflow-step {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 10px;
    position: relative;
    padding-bottom: 15px;
}
.workflow-step:last-child { padding-bottom: 0; }
.workflow-step:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 13px;
    top: 27px;
    bottom: 2px;
    width: 1px;
    background: #dce4e0;
}
.workflow-number {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    color: var(--brand);
    background: var(--brand-soft);
    border: 1px solid #dcebe3;
    border-radius: 50%;
    font-size: 9px;
    font-weight: 700;
}
.workflow-copy b { display: block; margin-top: 2px; color: #2a382f; font-size: 10px; font-weight: 650; }
.workflow-copy span { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.45; }

.bulk-empty { padding: 44px 24px; text-align: center; }
.bulk-empty .empty-icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    margin: 0 auto 15px;
    color: var(--brand);
    background: var(--brand-soft);
    border-radius: 15px;
}
.bulk-empty h3 { margin: 0 0 8px; font-size: 15px; font-weight: 650; }
.bulk-empty p { max-width: 500px; margin: 0 auto 18px; color: var(--muted); font-size: 10.5px; line-height: 1.65; }
.transactions-filter { display: flex; align-items: center; gap: 10px; }
.transactions-filter .search { max-width: 290px; }

.wallet-page { width: 100%; max-width: 1280px; margin: 0 auto; }
.wallet-page-grid { display: grid; grid-template-columns: minmax(310px,.74fr) minmax(0,1.65fr); gap: 18px; align-items: start; }
.wallet-page .wallet-overview { position: sticky; top: 104px; }
.wallet-admin-stack { display: grid; gap: 16px; }
.settings-disclosure {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    box-shadow: var(--shadow-sm);
}
.settings-disclosure summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 17px 19px;
    cursor: pointer;
    list-style: none;
    font-size: 11px;
    font-weight: 620;
}
.settings-disclosure summary::-webkit-details-marker { display: none; }
.settings-disclosure[open] summary { border-bottom: 1px solid var(--line-soft); }
.settings-content { padding: 19px; }
.wallet-transaction-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 11px; margin-bottom: 15px; }
.mini-stat {
    padding: 14px;
    background: #f8faf9;
    border: 1px solid var(--line-soft);
    border-radius: 10px;
}
.mini-stat span { display: block; color: var(--muted); font-size: 9px; }
.mini-stat b { display: block; margin-top: 7px; color: #233128; font-size: 14px; font-weight: 650; }

/* Modals */
.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(5,28,20,.60);
    backdrop-filter: blur(5px);
}
.modal-backdrop.open { display: flex; }
.modal-card {
    width: min(480px,100%);
    max-height: calc(100vh - 44px);
    overflow: auto;
    background: #fff;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 16px;
    box-shadow: var(--shadow-strong);
}
.modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 21px 17px;
    border-bottom: 1px solid var(--line-soft);
}
.modal-header h3 { margin: 0; color: #1d2a22; font-size: 15px; font-weight: 650; }
.modal-header p { margin: 6px 0 0; color: var(--muted); font-size: 9.5px; line-height: 1.5; }
.modal-close {
    display: grid;
    place-items: center;
    width: 33px;
    height: 33px;
    color: #66736c;
    background: #f2f5f3;
    border: 0;
    border-radius: 9px;
    cursor: pointer;
    font-size: 18px;
}
.modal-close:hover { color: var(--brand); background: var(--brand-soft); }
.modal-body { padding: 20px 21px; }
.modal-body .form-group + .form-group { margin-top: 14px; }
.modal-footer { display: flex; justify-content: flex-end; gap: 10px; padding: 0 21px 21px; }
body.modal-open { overflow: hidden; }

/* Loader */
.system-loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(248,250,249,.94);
    backdrop-filter: blur(4px);
}
.system-loader.show { display: flex; }
.loader-core {
    position: relative;
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border: 3px solid #dce8e1;
    border-top-color: var(--brand);
    border-radius: 50%;
    animation: spin .72s linear infinite;
    box-shadow: 0 12px 30px rgba(17,75,51,.10);
}
.loader-core img {
    width: 38px;
    height: 38px;
    object-fit: contain;
    border-radius: 10px;
    animation: counterSpin .72s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes counterSpin { to { transform: rotate(-360deg); } }

.login { min-height: 100vh; }
.login-alert { margin-bottom: 15px; }
.login-box { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 28px; }
.login-card { width: 100%; max-width: 430px; }
.login-card.card { padding: 28px; }
.logo-lg { display: block; width: 150px; max-height: 70px; object-fit: contain; margin: 0 0 22px; }

.batch-lines {
    min-height: 200px;
    resize: vertical;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    line-height: 1.75;
}
.batch-limit {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    background: #f7f9f8;
    font-size: 9.5px;
    font-weight: 650;
    white-space: nowrap;
}
.bulk-format {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 11px;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.55;
}
.bulk-format .ui-icon { flex: 0 0 auto; margin-top: 2px; color: var(--brand); }
.analytics-actions { display: flex; gap: 10px; }
.analytics-summary { margin-top: 4px; }

@media (max-width: 1280px) {
    .cards { grid-template-columns: repeat(3,1fr); }
    .payment-layout { grid-template-columns: minmax(0,1.5fr) minmax(280px,.72fr); }
}

@media (max-width: 1040px) {
    .sidebar { transform: translateX(-102%); transition: transform .23s ease; }
    .sidebar.open { transform: translateX(0); }
    .main { width: 100%; margin-left: 0; }
    .menu-btn { display: grid; }
    .overlay.show {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 50;
        background: rgba(3,25,17,.50);
        backdrop-filter: blur(2px);
    }
    body.menu-open { overflow: hidden; }
    .payment-layout { grid-template-columns: 1fr; }
    .payment-side { position: static; grid-template-columns: minmax(280px,1fr) minmax(280px,1fr); }
    .wallet-page-grid { grid-template-columns: 1fr; }
    .wallet-page .wallet-overview { position: static; }
}

@media (max-width: 780px) {
    .topbar { min-height: 72px; padding: 0 15px; }
    .page-heading-icon { width: 35px; height: 35px; }
    .topbar h1 { font-size: 20px; }
    .topbar p { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .top-actions .period,
    .top-actions .top-role { display: none; }
    .content { padding: 20px 13px 26px; }
    .footer { padding: 12px 14px 18px; }
    .grid-2,
    .grid-3 { grid-template-columns: 1fr; }
    .form-grid { grid-template-columns: 1fr; }
    .toolbar { align-items: stretch; flex-direction: column; }
    .search { max-width: none; }
    .payments-header { align-items: flex-start; flex-direction: column; }
    .payment-head-actions { width: 100%; }
    .payment-tabs { width: 100%; max-width: none; }
    .payment-tabs a { min-width: 132px; }
    .approval-chain { align-items: flex-start; flex-direction: column; }
    .method-grid { grid-template-columns: 1fr; }
    .payment-card { padding: 18px; }
    .payment-side { grid-template-columns: 1fr; }
    .farmer-summary { align-items: flex-start; flex-direction: column; }
    .form-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .form-actions .btn { width: 100%; }
    .wallet-transaction-summary { grid-template-columns: 1fr; }
    .footer { text-align: center; justify-content: center; }
    .footer span:last-child { display: none; }
}

@media (max-width: 560px) {
    .sidebar { width: min(88vw, 306px); }
    .sidebar-user { width: min(88vw, 306px); }
    .cards { grid-template-columns: repeat(2,1fr); }
    .stat { min-height: 104px; padding: 14px; }
    .stat .value { font-size: 18px; }
    .panel { padding: 15px; }
    .page-heading-copy p { display: none; }
    .payment-head-actions .role-pill { width: 100%; }
    .payment-head-actions .btn { flex: 1; }
    .payments-header h2 { font-size: 18px; }
    .pay-intro h2 { font-size: 18px; }
    .form-actions { grid-template-columns: 1fr; }
    .wallet-balance { font-size: 27px; }
    .modal-backdrop { align-items: flex-end; padding: 0; }
    .modal-card { width: 100%; max-height: 90vh; border-radius: 17px 17px 0 0; }
    .payment-tabs a { min-width: 124px; }
}

/* Advanced payment details */
.payment-card-title {
    display: flex;
    align-items: flex-start;
    gap: 11px;
}
.section-index {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    flex: 0 0 auto;
    color: var(--brand);
    background: var(--brand-soft);
    border: 1px solid #d9e9e0;
    border-radius: 8px;
    font-size: 8.5px;
    font-weight: 750;
    letter-spacing: .3px;
}
.payment-summary-card { padding: 18px; }
.summary-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--line-soft);
}
.summary-heading h3 {
    margin: 0;
    color: #1e2b23;
    font-size: 12px;
    font-weight: 650;
}
.summary-heading > div > span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 9px;
}
.summary-secure {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 7px;
    color: var(--brand);
    background: var(--brand-soft);
    border: 1px solid #dbe9e1;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 650;
}
.summary-list { padding: 4px 0; }
.summary-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line-soft);
}
.summary-row > span { color: var(--muted); font-size: 9.5px; }
.summary-row > b {
    max-width: 64%;
    overflow: hidden;
    color: #2b3931;
    font-size: 10px;
    font-weight: 620;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.summary-row.summary-total { padding: 14px 0; border-bottom: 0; }
.summary-row.summary-total > span { color: #36463d; font-weight: 600; }
.summary-row.summary-total > b { color: var(--brand-strong); font-size: 15px; font-weight: 700; }
.summary-foot {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 11px 12px;
    color: #66736c;
    background: #f6f9f7;
    border: 1px solid #e3e9e6;
    border-radius: 9px;
    font-size: 8.8px;
    line-height: 1.5;
}
.summary-foot .ui-icon { margin-top: 1px; color: var(--brand); }

/* Wallet security, Send Money and Vozua SMS */
.flash.warning {
    color: #7a5208;
    background: var(--warning-soft);
    border-color: #ead79d;
}
.flash a { color: var(--brand-strong); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.sms-low-alert b { font-weight: 700; }
.sms-balance-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 11px;
    color: var(--brand-strong);
    background: var(--brand-soft);
    border: 1px solid #d9e9e0;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 700;
    white-space: nowrap;
}
.sms-balance-pill.is-low { color: #8b5906; background: var(--warning-soft); border-color: #ead79d; }

.wallet-actions { grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; }
.wallet-actions .wallet-send {
    color: #fff;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.12);
}
.wallet-actions .wallet-send:hover { color: #fff; background: rgba(255,255,255,.16); box-shadow: none; }

.phone-input {
    display: flex;
    align-items: stretch;
    width: 100%;
    min-height: 44px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 10px;
    transition: border-color .16s ease, box-shadow .16s ease;
}
.phone-input:focus-within { border-color: #86b79f; box-shadow: 0 0 0 3px rgba(23,107,74,.09); }
.phone-input > span {
    display: flex;
    align-items: center;
    padding: 0 12px;
    color: var(--brand-strong);
    background: var(--brand-soft-2);
    border-right: 1px solid var(--line);
    font-size: 11px;
    font-weight: 700;
}
.phone-input input {
    min-width: 0;
    height: auto;
    padding-left: 12px;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none !important;
}
.field-help { display: block; margin-top: 6px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.label-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.label-row > span { color: var(--muted); font-size: 8.8px; white-space: nowrap; }

.inline-form {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.inline-pin {
    width: 72px;
    min-height: 35px;
    padding: 7px 9px;
    border-radius: 8px;
    font-size: 10px;
    text-align: center;
}

/* Transaction confirmation screen */
.transaction-status-shell {
    display: grid;
    place-items: center;
    min-height: calc(100vh - 190px);
    padding: 24px 0 42px;
}
.transaction-status-card {
    width: min(100%, 620px);
    padding: 34px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    box-shadow: 0 24px 70px rgba(8,45,32,.12);
    text-align: center;
}
.transaction-brand-mark {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin: 0 auto 20px;
    background: linear-gradient(145deg, #e2c55f, #c8a73a);
    border-radius: 15px;
    box-shadow: 0 12px 28px rgba(211,180,71,.24);
}
.transaction-brand-mark img { width: 42px; height: 38px; object-fit: contain; }
.transaction-brand-mark.sms-mark { color: #fff; background: linear-gradient(145deg, var(--brand), var(--brand-strong)); }
.transaction-state .eyebrow,
.eyebrow {
    display: inline-block;
    color: var(--brand);
    font-size: 8.5px;
    font-weight: 750;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}
.transaction-state h2 { margin: 9px 0 10px; color: #17251f; font-size: 24px; font-weight: 680; letter-spacing: -.45px; }
.transaction-state p { max-width: 470px; margin: 0 auto; color: var(--muted); font-size: 11px; line-height: 1.7; }
.transaction-spinner {
    position: relative;
    display: grid;
    place-items: center;
    width: 70px;
    height: 70px;
    margin: 0 auto 18px;
    border: 2px solid #e0eae4;
    border-top-color: var(--brand);
    border-radius: 50%;
    animation: spin .9s linear infinite;
}
.transaction-spinner::after { content: ""; width: 28px; height: 28px; background: var(--brand-soft); border-radius: 50%; }
.transaction-spinner span { position: absolute; inset: 10px; border: 1px dashed #c8ddd2; border-radius: 50%; }
.success-orb,
.failed-orb {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    margin: 0 auto 18px;
    color: #fff;
    background: linear-gradient(145deg, #239360, #176b4a);
    border-radius: 50%;
    box-shadow: 0 14px 32px rgba(23,107,74,.24);
}
.failed-orb { background: linear-gradient(145deg, #d65353, #a92d2d); box-shadow: 0 14px 32px rgba(189,59,59,.20); }
.redirect-countdown { margin-top: 14px; color: var(--muted); font-size: 9.5px; }
.transaction-facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 1px;
    margin-top: 28px;
    overflow: hidden;
    background: var(--line-soft);
    border: 1px solid var(--line-soft);
    border-radius: 13px;
    text-align: left;
}
.transaction-facts > div { padding: 14px 16px; background: var(--surface-muted); }
.transaction-facts span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 8.5px; }
.transaction-facts b { display: block; overflow: hidden; color: #26342d; font-size: 10.5px; font-weight: 680; text-overflow: ellipsis; white-space: nowrap; }
.transaction-security {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
    color: #65746c;
    font-size: 9px;
    line-height: 1.5;
}
.transaction-security .ui-icon { margin-top: 1px; color: var(--brand); }

/* Manual Send Money */
.send-money-page,
.sms-centre-page,
.security-settings-page { width: 100%; max-width: 1320px; margin: 0 auto; }
.send-money-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
    padding: 24px 26px;
    color: #fff;
    background:
        radial-gradient(circle at 82% 10%, rgba(211,180,71,.23), transparent 32%),
        linear-gradient(135deg, #174b38 0%, #092d21 76%);
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(8,45,32,.13);
}
.send-money-hero h2 { margin: 7px 0 7px; font-size: 22px; font-weight: 670; letter-spacing: -.35px; }
.send-money-hero p { max-width: 710px; margin: 0; color: rgba(255,255,255,.63); font-size: 10.5px; line-height: 1.65; }
.send-money-hero .eyebrow { color: #efd77e; }
.hero-wallet-balance { min-width: 255px; padding: 16px 18px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.10); border-radius: 13px; }
.hero-wallet-balance span,
.hero-wallet-balance small { display: block; color: rgba(255,255,255,.54); font-size: 8.8px; }
.hero-wallet-balance b { display: block; margin: 6px 0; color: #fff; font-size: 23px; font-weight: 680; letter-spacing: -.5px; }
.send-money-grid { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(280px,.62fr); gap: 18px; align-items: start; }
.send-money-form-card { padding: 22px; }
.compact-grid { gap: 14px; }
.secure-badge,
.api-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 5px 9px;
    color: var(--brand);
    background: var(--brand-soft);
    border: 1px solid #dbe9e1;
    border-radius: 999px;
    font-size: 8.5px;
    font-weight: 700;
    white-space: nowrap;
}
.pin-field { position: relative; }
.pin-field > a { position: absolute; right: 0; top: 0; color: var(--brand); font-size: 9px; font-weight: 700; }
.pin-input-wrap { position: relative; }
.pin-input-wrap .ui-icon { position: absolute; left: 12px; top: 50%; z-index: 1; color: var(--muted); transform: translateY(-50%); }
.pin-input-wrap input { padding-left: 38px; letter-spacing: 3px; }
.reserve-notice {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 14px;
    padding: 12px 13px;
    color: #6f5a20;
    background: var(--warning-soft);
    border: 1px solid #ead79d;
    border-radius: 10px;
    font-size: 9.5px;
    line-height: 1.55;
}
.reserve-notice.is-error { color: #9f2e2e; background: var(--danger-soft); border-color: #efc9c7; }
.reserve-notice.is-ok { color: var(--brand-strong); background: var(--success-soft); border-color: #cfe7da; }
.reserve-notice .ui-icon { margin-top: 1px; flex: 0 0 auto; }
.send-money-aside { display: grid; gap: 14px; }
.balance-protection-card { padding: 20px; }
.card-icon { display: grid; place-items: center; width: 42px; height: 42px; color: var(--brand); background: var(--brand-soft); border-radius: 11px; }
.balance-protection-card h3,
.sms-automation-card h3 { margin: 13px 0 7px; font-size: 13px; font-weight: 680; }
.balance-protection-card p,
.sms-automation-card p { margin: 0 0 15px; color: var(--muted); font-size: 9.5px; line-height: 1.6; }
.balance-protection-card > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line-soft); font-size: 9.5px; }
.balance-protection-card > div span { color: var(--muted); }
.balance-protection-card > div b { color: #29372f; font-weight: 680; }
.balance-protection-card .btn { width: 100%; margin-top: 12px; }
.mini-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.mini-metrics > div { padding: 15px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-sm); }
.mini-metrics span { display: block; color: var(--muted); font-size: 8.5px; }
.mini-metrics b { display: block; margin-top: 6px; color: #203028; font-size: 14px; font-weight: 680; }
.recent-send-table { margin-top: 18px; }
.table-subtext { display: block; max-width: 320px; margin-top: 4px; color: var(--muted); font-size: 8.5px; font-weight: 400; }
.table-action { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; color: var(--brand); background: var(--brand-soft); border: 1px solid #d9e9e0; border-radius: 8px; cursor: pointer; font-size: 8.5px; font-weight: 700; }

/* PIN security */
.security-hero { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; padding: 22px 24px; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-sm); }
.security-hero-icon { display: grid; place-items: center; width: 56px; height: 56px; color: var(--brand); background: var(--brand-soft); border-radius: 15px; }
.security-hero h2 { margin: 6px 0 6px; font-size: 20px; font-weight: 680; }
.security-hero p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.security-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,.75fr); gap: 18px; }
.security-form-card { padding: 24px; }
.security-guidance { padding: 22px; }
.security-guidance h3 { margin: 0 0 15px; font-size: 13px; font-weight: 680; }
.security-guidance > div:not(.security-note) { display: grid; grid-template-columns: 28px 1fr; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--line-soft); }
.security-guidance > div > span:first-child { display: grid; place-items: center; width: 26px; height: 26px; color: var(--brand); background: var(--brand-soft); border-radius: 8px; font-size: 9px; font-weight: 700; }
.security-guidance p { margin: 2px 0 0; color: var(--muted); font-size: 9.5px; line-height: 1.55; }
.security-note { display: flex; align-items: flex-start; gap: 8px; margin-top: 16px; padding: 12px; color: #617069; background: var(--surface-muted); border: 1px solid var(--line-soft); border-radius: 10px; font-size: 9px; line-height: 1.5; }

/* Vozua SMS Centre */
.sms-overview-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 16px;
    padding: 22px 24px;
    color: #fff;
    background: linear-gradient(135deg, #174b38, #0a2e23);
    border-radius: 17px;
    box-shadow: 0 18px 42px rgba(8,45,32,.14);
}
.sms-overview-card.is-low { background: linear-gradient(135deg, #6c4810, #3d2b0d); }
.sms-overview-main { display: flex; align-items: center; gap: 14px; }
.sms-overview-icon { display: grid; place-items: center; width: 48px; height: 48px; color: #173a2c; background: linear-gradient(145deg, #e2c65e, #cda93d); border-radius: 13px; }
.sms-overview-main span,
.sms-overview-main small { display: block; color: rgba(255,255,255,.58); font-size: 8.8px; }
.sms-overview-main b { display: block; margin: 5px 0; color: #fff; font-size: 23px; font-weight: 680; }
.sms-overview-actions { display: flex; gap: 9px; }
.sms-overview-actions .secondary { color: #fff; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); }
.sms-critical-alert { display: flex; align-items: center; gap: 11px; margin-bottom: 16px; padding: 13px 14px; color: #8a5908; background: var(--warning-soft); border: 1px solid #ead79d; border-radius: 11px; }
.sms-critical-alert > div { flex: 1; }
.sms-critical-alert b,
.sms-critical-alert span { display: block; }
.sms-critical-alert b { font-size: 10.5px; }
.sms-critical-alert span { margin-top: 3px; font-size: 9px; line-height: 1.45; }
.sms-workspace { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(280px,.58fr); gap: 18px; align-items: start; }
.sms-compose-card { padding: 22px; }
.api-live-badge i,
.automation-status i { width: 7px; height: 7px; background: #4bc67b; border-radius: 50%; box-shadow: 0 0 0 3px rgba(75,198,123,.12); }
.sms-recipients { min-height: 94px; resize: vertical; }
.sms-compose-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 16px; }
.sms-compose-footer .payment-note { flex: 1; margin: 0; }
.sms-side-stack { display: grid; gap: 14px; }
.sms-metrics { grid-template-columns: 1fr; }
.sms-automation-card { padding: 20px; }
.automation-status { display: flex; align-items: center; gap: 8px; padding-top: 12px; border-top: 1px solid var(--line-soft); color: var(--brand); font-size: 9px; font-weight: 700; }
.sms-history-card { margin-top: 18px; }
.sms-topup-history { margin-top: 18px; }

@media (max-width: 1040px) {
    .send-money-grid,
    .sms-workspace,
    .security-grid { grid-template-columns: 1fr; }
    .send-money-aside { grid-template-columns: minmax(280px,1fr) minmax(280px,1fr); }
    .sms-side-stack { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .sms-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 780px) {
    .sms-balance-pill { display: none; }
    .send-money-hero,
    .sms-overview-card { align-items: stretch; flex-direction: column; }
    .hero-wallet-balance { min-width: 0; }
    .send-money-aside,
    .sms-side-stack { grid-template-columns: 1fr; }
    .sms-overview-actions .btn { flex: 1; }
    .sms-compose-footer { align-items: stretch; flex-direction: column; }
    .sms-compose-footer .btn { width: 100%; }
    .transaction-status-card { padding: 26px 20px; border-radius: 18px; }
    .transaction-facts { grid-template-columns: 1fr; }
    .inline-form { flex-wrap: wrap; }
}

@media (max-width: 560px) {
    .wallet-actions { grid-template-columns: 1fr auto; }
    .wallet-actions .wallet-send { grid-column: 1 / -1; grid-row: 2; }
    .send-money-hero,
    .sms-overview-card { padding: 20px; }
    .send-money-hero h2 { font-size: 19px; }
    .sms-overview-main b { font-size: 20px; }
    .sms-overview-actions { flex-direction: column; }
    .security-hero { align-items: flex-start; }
    .mini-metrics,
    .sms-metrics { grid-template-columns: 1fr; }
    .label-row { align-items: flex-start; flex-direction: column; gap: 4px; }
}


/* Local phone fields and protected transaction feedback */
.phone-input .phone-field-icon {
    display: grid;
    place-items: center;
    width: 42px;
    min-width: 42px;
    color: var(--brand);
    background: var(--brand-soft);
    border-right: 1px solid var(--line);
}
.phone-input .phone-field-icon .ui-icon { width: 16px; height: 16px; }
.transaction-failed { color: #8f2828; }
.transaction-failed p { color: #7d4545; }

/* ========================================================================== 
   Live transaction UX — responsive, non-blocking and callback-first
   ========================================================================== */
html, body { max-width: 100%; overflow-x: hidden; }
.main,
.content,
.send-money-page,
.wallet-page,
.transaction-status-shell,
.send-money-grid,
.send-money-form-card,
.send-money-aside,
.recent-send-table { min-width: 0; }

.payment-primary { position: relative; overflow: hidden; }
.payment-primary.is-submitting::after {
    content: "";
    width: 15px;
    height: 15px;
    margin-left: 2px;
    border: 2px solid rgba(255,255,255,.42);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin .7s linear infinite;
}
.payment-primary:disabled { cursor: wait; opacity: .86; transform: none !important; }

/* Recharge modal keeps every field and action visible on short/mobile screens. */
.recharge-modal-card {
    width: min(560px, 100%);
    max-height: min(760px, calc(100dvh - 32px));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 20px;
}
.recharge-modal-card form {
    display: flex;
    flex: 1;
    min-height: 0;
    flex-direction: column;
}
.recharge-modal-card .modal-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
.recharge-modal-card .modal-footer {
    flex: 0 0 auto;
    padding-top: 15px;
    background: rgba(255,255,255,.96);
    border-top: 1px solid var(--line-soft);
    box-shadow: 0 -10px 24px rgba(22,50,38,.035);
}
.recharge-modal-card .modal-footer .btn { min-height: 45px; }
.recharge-wallet-summary {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    padding: 14px;
    background: linear-gradient(145deg, #f6faf8, #eef5f1);
    border: 1px solid #dce8e1;
    border-radius: 13px;
}
.recharge-wallet-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: #fff;
    background: linear-gradient(145deg, var(--brand), var(--brand-strong));
    border-radius: 11px;
    box-shadow: 0 8px 18px rgba(23,107,74,.16);
}
.recharge-wallet-summary > div { min-width: 0; }
.recharge-wallet-summary span,
.recharge-wallet-summary small { display: block; color: var(--muted); font-size: 9px; }
.recharge-wallet-summary b {
    display: block;
    margin: 3px 0;
    overflow: hidden;
    color: #213128;
    font-size: 12px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.recharge-wallet-summary strong { color: var(--brand-strong); font-size: 13px; font-weight: 700; white-space: nowrap; }
.callback-assurance {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 15px;
    padding: 12px 13px;
    color: #426052;
    background: #f3f8f5;
    border: 1px solid #d8e7df;
    border-radius: 11px;
}
.callback-live-dot {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    margin-top: 3px;
    background: #2ba56a;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(43,165,106,.12);
}
.callback-assurance b,
.callback-assurance small { display: block; }
.callback-assurance b { color: #254337; font-size: 10px; font-weight: 680; }
.callback-assurance small { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.5; }

/* Send Money layout is allowed to grow naturally instead of being cropped. */
.send-money-page { padding-bottom: 22px; }
.send-money-hero { overflow: hidden; isolation: isolate; }
.send-money-hero > div:first-child { min-width: 0; }
.send-money-form-card,
.balance-protection-card,
.recent-send-table { overflow: visible; }
.send-money-form-card form { min-width: 0; }
.send-money-form-card input,
.send-money-form-card textarea,
.send-money-form-card select { width: 100%; max-width: 100%; }
.send-money-form-card .form-actions {
    margin-top: 18px;
    padding: 16px 0 0;
    border-top: 1px solid var(--line-soft);
}
.send-money-form-card .form-actions .btn { min-height: 46px; }
.recent-send-table .panel-head { flex-wrap: wrap; }
.recent-send-table .search { width: min(100%, 310px); }
.recent-send-table .table-wrap { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }

/* Callback status card */
.transaction-status-shell {
    width: 100%;
    min-height: calc(100dvh - 170px);
    padding: clamp(18px, 3vw, 38px) 0 46px;
}
.transaction-status-card {
    position: relative;
    width: min(100%, 680px);
    max-width: 100%;
    padding: clamp(24px, 4vw, 38px);
    overflow: hidden;
    background:
        linear-gradient(#fff,#fff) padding-box,
        linear-gradient(135deg, rgba(23,107,74,.24), rgba(211,180,71,.28)) border-box;
    border: 1px solid transparent;
    border-radius: 24px;
    box-shadow: 0 26px 74px rgba(8,45,32,.12);
}
.transaction-status-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, var(--brand), #d3b447, var(--brand));
}
.transaction-card-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: -7px 0 23px;
    color: var(--muted);
    font-size: 9px;
}
.live-callback,
.transaction-kind {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 28px;
    padding: 6px 10px;
    background: #f5f8f6;
    border: 1px solid var(--line-soft);
    border-radius: 999px;
}
.live-callback { color: var(--brand-strong); font-weight: 680; }
.live-callback i {
    width: 7px;
    height: 7px;
    background: #2bab6d;
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(43,171,109,.12);
}
.transaction-kind { white-space: nowrap; }
.transaction-brand-mark { margin-bottom: 18px; }
.transaction-state { min-height: 226px; }
.transaction-state[hidden] { display: none !important; }
.transaction-state h2 {
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
    font-size: clamp(21px, 4vw, 27px);
    line-height: 1.18;
}
.transaction-state p { font-size: 10.5px; }
.transaction-pulse {
    position: relative;
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    margin: 0 auto 18px;
    background: #f2f8f5;
    border: 1px solid #dbe9e2;
    border-radius: 50%;
}
.transaction-pulse::before,
.transaction-pulse::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(23,107,74,.24);
    border-radius: 50%;
    animation: callbackPulse 1.8s ease-out infinite;
}
.transaction-pulse::before { inset: 8px; }
.transaction-pulse::after { inset: 0; animation-delay: .55s; }
.transaction-pulse span {
    width: 25px;
    height: 25px;
    background: linear-gradient(145deg, var(--brand), var(--brand-strong));
    border-radius: 50%;
    box-shadow: 0 8px 18px rgba(23,107,74,.20);
}
.transaction-pulse i {
    position: absolute;
    width: 7px;
    height: 7px;
    background: #d3b447;
    border-radius: 50%;
}
@keyframes callbackPulse {
    0% { transform: scale(.72); opacity: .72; }
    75%,100% { transform: scale(1.18); opacity: 0; }
}
.callback-steps {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 7px;
    max-width: 500px;
    margin: 22px auto 0;
}
.callback-steps span {
    position: relative;
    padding: 9px 7px;
    color: #77837d;
    background: #f7f9f8;
    border: 1px solid #e5ebe8;
    border-radius: 9px;
    font-size: 8.5px;
    font-weight: 620;
}
.callback-steps .done { color: #277650; background: #edf8f2; border-color: #d3eadc; }
.callback-steps .active { color: #725a15; background: #fff8e5; border-color: #eddfb2; }
.success-orb,
.failed-orb,
.delayed-orb { width: 74px; height: 74px; }
.delayed-orb {
    display: grid;
    place-items: center;
    margin: 0 auto 18px;
    color: #7a5d13;
    background: #fff6dc;
    border: 1px solid #ead89e;
    border-radius: 50%;
    box-shadow: 0 14px 32px rgba(181,141,37,.12);
}
.transaction-delayed .delayed-orb .ui-icon { animation: none; }
.transaction-state-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 18px;
}
.transaction-state-actions .btn { min-width: 130px; }
.transaction-facts { margin-top: 24px; }
.transaction-facts > div { min-width: 0; }
.transaction-facts .fact-wide { grid-column: 1 / -1; }
.transaction-facts b {
    overflow: visible;
    overflow-wrap: anywhere;
    text-overflow: clip;
    white-space: normal;
    line-height: 1.45;
}
.transaction-security { max-width: 520px; margin-left: auto; margin-right: auto; }

/* Stop all motion for users who prefer reduced motion. */
@media (prefers-reduced-motion: reduce) {
    .transaction-pulse::before,
    .transaction-pulse::after,
    .payment-primary.is-submitting::after { animation: none !important; }
}

@media (max-width: 780px) {
    .transaction-status-shell {
        min-height: auto;
        display: block;
        padding: 10px 0 28px;
    }
    .transaction-status-card {
        width: 100%;
        padding: 24px 18px;
        border-radius: 19px;
    }
    .transaction-card-topline { margin-bottom: 18px; }
    .transaction-state { min-height: 210px; }
    .transaction-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .transaction-facts .fact-wide { grid-column: 1 / -1; }
    .send-money-form-card { padding: 18px; }
    .send-money-form-card .form-actions { display: grid; grid-template-columns: 1fr; }
    .send-money-form-card .form-actions .btn { width: 100%; }
}

@media (max-width: 560px) {
    .modal-backdrop { padding: 0; }
    .recharge-modal-card {
        width: 100%;
        max-height: 100dvh;
        min-height: 100dvh;
        border-radius: 0;
    }
    .recharge-modal-card .modal-header { padding-top: max(18px, env(safe-area-inset-top)); }
    .recharge-modal-card .modal-footer { padding-bottom: max(18px, env(safe-area-inset-bottom)); }
    .recharge-modal-card .modal-footer { display: grid; grid-template-columns: 1fr; }
    .recharge-modal-card .modal-footer .btn { width: 100%; }
    .recharge-wallet-summary { grid-template-columns: auto minmax(0,1fr); }
    .recharge-wallet-summary strong { grid-column: 1 / -1; padding-top: 10px; border-top: 1px solid #dce8e1; }
    .send-money-hero { padding: 19px 17px; border-radius: 15px; }
    .hero-wallet-balance { width: 100%; }
    .send-money-form-card { padding: 16px; border-radius: 14px; }
    .compact-grid { grid-template-columns: 1fr; }
    .transaction-card-topline { align-items: flex-start; }
    .transaction-kind { max-width: 44%; overflow: hidden; text-overflow: ellipsis; }
    .transaction-state { min-height: 220px; }
    .callback-steps { grid-template-columns: 1fr; }
    .transaction-facts { grid-template-columns: 1fr; }
    .transaction-facts .fact-wide { grid-column: auto; }
    .transaction-state-actions { display: grid; grid-template-columns: 1fr; }
    .transaction-state-actions .btn { width: 100%; }
}

/* Final wallet action alignment and immediate gateway feedback */
.wallet-overview { container-type: inline-size; }
.wallet-actions {
    grid-template-columns: minmax(0,1fr) minmax(0,1fr) 40px;
    align-items: stretch;
    gap: 7px;
    width: 100%;
}
.wallet-actions form {
    width: 40px;
    min-width: 0;
}
.wallet-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 42px;
    padding: 0 8px;
    overflow: hidden;
    border-radius: 10px;
    font-size: 9px;
    line-height: 1;
    white-space: nowrap;
}
.wallet-actions .wallet-action-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
}
.wallet-actions .wallet-action-label {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
}
.wallet-actions .btn.wallet-refresh { width: 40px; min-width: 40px; padding: 0; }

/* Keep the desktop side-card as polished and readable as the wider mobile card. */
@container (max-width: 330px) {
    .wallet-overview-inner { padding: 19px; }
    .wallet-actions {
        grid-template-columns: minmax(0,1fr) minmax(0,1fr) 38px;
        gap: 6px;
    }
    .wallet-actions form { width: 38px; }
    .wallet-actions .btn {
        min-height: 40px;
        padding: 0 6px;
        gap: 4px;
        font-size: 8.3px;
        letter-spacing: -.08px;
    }
    .wallet-actions .btn .ui-icon { width: 13px; height: 13px; }
    .wallet-actions .btn.wallet-refresh { width: 38px; min-width: 38px; }
}

/* Extremely narrow desktop columns get a clean two-row action layout instead of overflow. */
@container (max-width: 285px) {
    .wallet-actions { grid-template-columns: minmax(0,1fr) 38px; }
    .wallet-actions .wallet-recharge { grid-column: 1 / -1; }
    .wallet-actions .wallet-send { grid-column: 1; grid-row: 2; }
    .wallet-actions form { grid-column: 2; grid-row: 2; }
    .wallet-actions .wallet-action-label { font-size: 8.8px; }
}

.transaction-failed p[data-failure-message] {
    max-width: 560px;
    margin: 14px auto 0;
    padding: 13px 15px;
    color: #992d2d;
    background: #fff1f1;
    border: 1px solid #efc8c8;
    border-radius: 11px;
    font-weight: 580;
    line-height: 1.55;
}
.transaction-failed .failed-orb {
    color: #a72f2f;
    background: #fff0f0;
    border: 1px solid #efc5c5;
    box-shadow: 0 14px 32px rgba(167,47,47,.12);
}
.transaction-status-card[data-terminal="failed"]::before {
    background: linear-gradient(90deg,#b53b3b,#e28b8b,#b53b3b);
}

@media (max-width: 560px) {
    .wallet-actions {
        grid-template-columns: minmax(0,1fr) minmax(0,1fr) 40px;
        gap: 6px;
    }
    .wallet-actions .wallet-send {
        grid-column: auto;
        grid-row: auto;
    }
    .wallet-actions .btn {
        min-height: 40px;
        padding: 0 7px;
        gap: 5px;
        font-size: 8.7px;
    }
    .wallet-actions .btn.wallet-refresh { width: 40px; min-width: 40px; }
}

@media (max-width: 380px) {
    .wallet-actions .wallet-action-label { font-size: 8.2px; }
    .wallet-actions .btn { padding-inline: 5px; }
}


/* Account access and installable PWA */
.account-button {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    color: var(--brand-strong);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(17, 49, 38, .06);
    transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.account-button:hover,
.account-button.active { color: #fff; background: var(--brand); border-color: var(--brand); transform: translateY(-1px); }
.account-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 16px;
    padding: 22px 24px;
    color: #fff;
    background: linear-gradient(135deg, #0b2f24, #15523d);
    border-radius: 20px;
    box-shadow: 0 16px 34px rgba(11, 47, 36, .14);
}
.account-identity { display: flex; align-items: center; gap: 15px; min-width: 0; }
.account-avatar { display: grid; place-items: center; width: 54px; height: 54px; flex: 0 0 54px; color: #0b2f24; background: #fff; border-radius: 17px; font-size: 22px; font-weight: 800; box-shadow: 0 8px 20px rgba(0,0,0,.13); }
.account-identity .eyebrow { color: rgba(255,255,255,.62); }
.account-identity h2 { margin: 4px 0 3px; color: #fff; font-size: 22px; }
.account-identity p { margin: 0; color: rgba(255,255,255,.7); font-size: 11px; }
.account-security-badge { display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; color: #fff; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); border-radius: 999px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.account-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.account-panel { padding: 22px; }
.account-panel .panel-head { margin-bottom: 18px; padding-bottom: 15px; border-bottom: 1px solid var(--line-soft); }
.account-panel .panel-head > .ui-icon { color: var(--brand); }
.account-panel .form-group + .form-group { margin-top: 13px; }
.account-panel .form-group small { display: block; margin-top: 6px; color: var(--muted); font-size: 10px; }
.account-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 15px 0; }
.account-meta span { min-width: 0; padding: 11px 12px; color: var(--text-soft); background: var(--brand-soft-2); border: 1px solid var(--line-soft); border-radius: 12px; font-size: 10px; overflow-wrap: anywhere; }
.account-meta b { display: block; margin-bottom: 4px; color: var(--muted); font-size: 8px; letter-spacing: .7px; text-transform: uppercase; }
.account-submit { width: 100%; justify-content: center; margin-top: 4px; }
.pwa-panel { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 20px; margin-top: 16px; padding: 22px 24px; overflow: hidden; }
.pwa-icon { width: 74px; height: 74px; overflow: hidden; border-radius: 19px; box-shadow: 0 10px 24px rgba(11,47,36,.16); }
.pwa-icon img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pwa-copy h2 { margin: 4px 0 6px; font-size: 18px; }
.pwa-copy p { margin: 0; max-width: 660px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.pwa-capabilities { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.pwa-capabilities span { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; color: var(--brand-strong); background: var(--brand-soft-2); border-radius: 999px; font-size: 9px; font-weight: 650; }
.pwa-action { min-width: 150px; text-align: right; }
.pwa-install-button { justify-content: center; white-space: nowrap; }
.pwa-install-button[hidden], .pwa-installed[hidden] { display: none !important; }
.pwa-installed { display: inline-flex; align-items: center; gap: 6px; padding: 10px 12px; color: #0c6944; background: #eaf7f0; border: 1px solid #cdebdc; border-radius: 12px; font-size: 10px; font-weight: 750; }

@media (max-width: 820px) {
    .account-grid { grid-template-columns: 1fr; }
    .pwa-panel { grid-template-columns: auto minmax(0,1fr); }
    .pwa-action { grid-column: 1 / -1; width: 100%; text-align: left; }
    .pwa-install-button { width: 100%; }
}
@media (max-width: 560px) {
    .account-button { width: 36px; height: 36px; flex-basis: 36px; border-radius: 11px; }
    .account-hero { align-items: flex-start; padding: 18px; }
    .account-security-badge { display: none; }
    .account-avatar { width: 48px; height: 48px; flex-basis: 48px; border-radius: 15px; }
    .account-identity h2 { font-size: 19px; }
    .account-panel { padding: 18px; }
    .account-meta { grid-template-columns: 1fr; }
    .pwa-panel { grid-template-columns: 58px minmax(0,1fr); gap: 14px; padding: 18px; }
    .pwa-icon { width: 58px; height: 58px; border-radius: 15px; }
    .pwa-copy h2 { font-size: 16px; }
    .pwa-capabilities { gap: 6px; }
}

/* Farmer management reference experience */
body.farmer-experience {
    --sidebar-width: 230px;
    --farmer-green: #13863b;
    --farmer-green-dark: #034c36;
    --farmer-green-deep: #003f31;
    --farmer-line: #e4e9e6;
    --farmer-muted: #667085;
    background: #f7f8fa;
}
.farmer-experience .main { background: #f7f8fa; }
.farmer-experience .content { padding: 18px 22px 28px; }
.farmer-experience .footer { display: none; }
.farmer-reference-sidebar {
    width: var(--sidebar-width);
    padding: 0 10px 78px;
    background: linear-gradient(180deg, #034c36 0%, #00412f 100%);
    border-right: 0;
    color: #fff;
}
.farmer-brand {
    display: flex;
    align-items: center;
    min-height: 92px;
    gap: 10px;
    padding: 14px 8px 10px;
    color: #fff;
}
.farmer-brand-mark {
    display: grid;
    place-items: center;
    width: 42px;
    height: 50px;
    flex: 0 0 auto;
}
.farmer-brand-mark img { width: 42px; height: 42px; object-fit: contain; filter: saturate(1.25) brightness(1.15); }
.farmer-brand-copy { display: block; min-width: 0; line-height: 1; }
.farmer-brand-copy strong { display: block; font-family: Inter, sans-serif; font-size: 21px; font-weight: 750; letter-spacing: -.5px; }
.farmer-brand-copy b { display: block; margin-top: 5px; color: #fff; font-size: 10px; letter-spacing: 3.1px; }
.farmer-brand-copy small { display: block; margin-top: 9px; color: rgba(255,255,255,.83); font-size: 8.2px; white-space: nowrap; }
.farmer-brand-caret { margin-left: auto; color: rgba(255,255,255,.8); }
.farmer-flat-nav { display: flex; flex-direction: column; padding: 0; }
.farmer-nav-caption {
    display: block;
    padding: 13px 10px 5px;
    color: rgba(255,255,255,.72);
    font-size: 9px;
    font-weight: 500;
    letter-spacing: .35px;
    text-transform: uppercase;
}
.farmer-nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 38px;
    padding: 8px 10px;
    color: rgba(255,255,255,.92);
    border-radius: 6px;
    font-size: 11.5px;
    font-weight: 520;
    transition: background .15s ease, color .15s ease;
}
.farmer-nav-item > span { display: grid; place-items: center; width: 20px; color: rgba(255,255,255,.88); }
.farmer-nav-item:hover { color: #fff; background: rgba(255,255,255,.08); }
.farmer-nav-item.active { color: #fff; background: linear-gradient(90deg, #159447, #16a149); box-shadow: 0 7px 15px rgba(0,0,0,.13); }
.farmer-nav-item i { margin-left: auto; padding: 3px 6px; color: #fff; background: #7747ef; border-radius: 7px; font-size: 8px; font-style: normal; font-weight: 700; }
.farmer-nav-item i.green { background: #16a34a; }
.farmer-sidebar-user {
    width: var(--sidebar-width);
    min-height: 70px;
    padding: 10px 18px;
    background: rgba(0,55,41,.98);
}
.farmer-sidebar-user .avatar { color: #fff; background: #e18736; border: 2px solid rgba(255,255,255,.8); }
.farmer-sidebar-user > a { color: #fff; }
.farmer-reference-topbar {
    min-height: 82px;
    padding: 0 28px;
    background: rgba(255,255,255,.98);
    border-color: #e5e9e7;
}
.farmer-menu-btn { display: grid; color: #1f2937; }
.farmer-reference-topbar .top-left { gap: 20px; }
.farmer-reference-topbar h1 { font-family: Inter, sans-serif; font-size: 20px; font-weight: 720; letter-spacing: -.4px; }
.farmer-reference-topbar p { margin-top: 6px; color: #697386; font-size: 10px; }
.farmer-reference-actions { gap: 14px; }
.farmer-top-select {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    min-height: 42px;
    padding: 8px 14px;
    color: #17202c;
    background: #fff;
    border: 1px solid #e0e6e3;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(16,24,40,.02);
    font-size: 10px;
    white-space: nowrap;
}
.farmer-top-select b { font-weight: 600; }
.farmer-top-select .ui-icon:last-child { margin-left: 6px; }
.farmer-notification,
.farmer-account {
    position: relative;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    color: #1f2937;
    border-radius: 8px;
}
.farmer-notification:hover,
.farmer-account:hover { background: #f3f6f4; }
.farmer-notification i {
    position: absolute;
    top: -2px;
    right: -1px;
    display: grid;
    place-items: center;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    color: #fff;
    background: #e2382c;
    border: 2px solid #fff;
    border-radius: 999px;
    font-size: 8px;
    font-style: normal;
    font-weight: 700;
}

/* Farmers directory */
.farmers-reference-page { display: grid; gap: 15px; }
.farmer-stat-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 12px; }
.farmer-stat-card {
    display: flex;
    align-items: flex-start;
    min-height: 100px;
    gap: 13px;
    padding: 15px 16px;
    background: #fff;
    border: 1px solid #edf0ee;
    border-radius: 9px;
    box-shadow: 0 2px 10px rgba(16,24,40,.025);
}
.farmer-stat-icon {
    display: grid;
    place-items: center;
    width: 43px;
    height: 43px;
    flex: 0 0 auto;
    color: #139243;
    background: #edf8f0;
    border-radius: 8px;
}
.farmer-stat-icon.mint { color: #07873d; background: #e8f7ee; }
.farmer-stat-icon.amber { color: #f6a90b; background: #fff8df; }
.farmer-stat-icon.violet { color: #7656e9; background: #f1edff; }
.farmer-stat-icon.blue { color: #4c9cec; background: #eaf4ff; }
.farmer-stat-card div { min-width: 0; }
.farmer-stat-card small { display: block; color: #111827; font-size: 9px; font-weight: 560; }
.farmer-stat-card strong { display: block; margin-top: 7px; color: #111827; font-size: 20px; font-weight: 760; letter-spacing: -.45px; }
.farmer-stat-card p { margin: 8px 0 0; color: #667085; font-size: 8.5px; white-space: nowrap; }
.farmer-stat-card p b { color: #139243; font-weight: 650; }
.farmer-directory-card {
    overflow: visible;
    background: #fff;
    border: 1px solid #e8ecea;
    border-radius: 9px;
    box-shadow: 0 2px 10px rgba(16,24,40,.025);
}
.farmer-filter-bar {
    display: grid;
    grid-template-columns: minmax(225px,1.55fr) repeat(4,minmax(120px,.8fr)) auto auto;
    align-items: end;
    gap: 12px;
    padding: 15px;
    border-bottom: 1px solid #eef1ef;
}
.farmer-search-box { position: relative; display: flex; align-items: center; }
.farmer-search-box > .ui-icon { position: absolute; right: 12px; color: #667085; pointer-events: none; }
.farmer-search-box input { min-height: 38px; padding-right: 38px; border-color: #e0e5e2; border-radius: 7px; font-size: 9.5px; }
.farmer-filter-field { display: grid; gap: 6px; }
.farmer-filter-field > span { color: #111827; font-size: 8px; font-weight: 540; }
.farmer-filter-field select { min-height: 38px; padding: 8px 29px 8px 10px; border-color: #e0e5e2; border-radius: 7px; font-size: 9px; }
.farmer-filter-more,
.farmer-add-button,
.farmer-outline-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 13px;
    border-radius: 7px;
    font-size: 9.5px;
    font-weight: 600;
    white-space: nowrap;
}
.farmer-filter-more,
.farmer-outline-button { color: #344054; background: #fff; border: 1px solid #dfe5e2; cursor: pointer; }
.farmer-add-button { color: #fff; background: #148c3e; border: 1px solid #148c3e; }
.farmer-add-button:hover { background: #0f7834; }
.farmer-table-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 15px;
    border-bottom: 1px solid #eef1ef;
}
.farmer-table-meta > div { display: flex; align-items: center; gap: 26px; }
.farmer-table-meta strong { color: #111827; font-size: 9px; font-weight: 560; }
.farmer-table-meta strong b { color: #12883c; }
.farmer-table-meta span { color: #667085; font-size: 8.5px; }
.farmer-table-meta .farmer-outline-button { min-height: 33px; padding: 7px 11px; }
.farmer-table-scroll { overflow-x: auto; padding: 0 10px; }
.farmer-reference-table { width: 100%; min-width: 1050px; border-collapse: collapse; font-size: 9px; }
.farmer-reference-table th {
    padding: 10px 9px;
    color: #344054;
    background: #f8faf9;
    border-bottom: 1px solid #e6ebe8;
    text-align: left;
    font-size: 7.8px;
    font-weight: 650;
    white-space: nowrap;
}
.farmer-reference-table td {
    padding: 10px 9px;
    color: #1f2937;
    border-bottom: 1px solid #edf0ee;
    white-space: nowrap;
}
.farmer-reference-table tbody tr:hover { background: #fbfdfc; }
.farmer-reference-table input[type="checkbox"] { width: 13px; height: 13px; min-height: 0; margin: 0; accent-color: #168a3e; }
.farmer-reference-table td strong { font-size: 8.7px; font-weight: 590; }
.farmer-state { display: inline-flex; padding: 4px 8px; border: 1px solid #ccebd7; border-radius: 4px; color: #0d8939; background: #eff9f2; font-size: 7.5px; font-weight: 650; }
.farmer-state.inactive { color: #d34d3f; background: #fff1ef; border-color: #f2d1cd; }
.farmer-row-actions { display: flex; align-items: center; gap: 7px; }
.farmer-row-actions > a,
.farmer-row-actions summary {
    display: grid;
    place-items: center;
    width: 25px;
    height: 25px;
    color: #55625b;
    background: #fff;
    border: 1px solid #e3e8e5;
    border-radius: 5px;
    cursor: pointer;
    list-style: none;
}
.farmer-row-actions summary::-webkit-details-marker { display: none; }
.farmer-row-actions details { position: relative; }
.farmer-row-actions details > div { position: absolute; right: 0; top: 30px; z-index: 15; min-width: 140px; padding: 6px; background: #fff; border: 1px solid #dde4e0; border-radius: 7px; box-shadow: 0 12px 30px rgba(16,24,40,.13); }
.farmer-row-actions details a,
.farmer-row-actions details button { display: block; width: 100%; padding: 8px 9px; color: #344054; background: transparent; border: 0; border-radius: 5px; text-align: left; font-size: 9px; cursor: pointer; }
.farmer-row-actions details a:hover,
.farmer-row-actions details button:hover { background: #f2f7f4; }
.farmer-empty-state { display: grid; justify-items: center; gap: 7px; padding: 34px; color: #667085; }
.farmer-empty-state strong { color: #1f2937; font-size: 12px; }
.farmer-empty-state a { padding: 7px 11px; color: #fff; background: #148c3e; border-radius: 6px; }
.farmer-pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 15px 16px; color: #475467; font-size: 8.5px; }
.farmer-pagination form { display: flex; align-items: center; gap: 9px; }
.farmer-pagination select { width: 62px; min-height: 32px; padding: 5px 8px; font-size: 9px; }
.farmer-pagination nav { display: flex; align-items: center; gap: 3px; }
.farmer-pagination nav a { display: grid; place-items: center; min-width: 28px; height: 28px; padding: 0 7px; border-radius: 5px; }
.farmer-pagination nav a.active { color: #fff; background: #0e7d35; }
.farmer-pagination nav a.disabled { opacity: .35; pointer-events: none; }

/* Farmer registration wizard */
.farmer-registration-page { max-width: 1290px; margin: 0 auto; }
.farmer-registration-page form { display: grid; gap: 15px; }
.farmer-wizard-progress {
    display: flex;
    align-items: center;
    min-height: 80px;
    padding: 13px 28px;
    background: #fff;
    border: 1px solid #e5e9e7;
    border-radius: 9px;
    box-shadow: 0 2px 10px rgba(16,24,40,.02);
}
.farmer-progress-step { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; padding: 0; background: transparent; border: 0; text-align: left; cursor: pointer; }
.farmer-progress-step > span { display: grid; place-items: center; width: 36px; height: 36px; color: #17202c; background: #f2f5f3; border-radius: 50%; font-size: 13px; font-weight: 650; }
.farmer-progress-step > div { display: grid; gap: 7px; }
.farmer-progress-step strong { color: #101828; font-size: 10px; font-weight: 650; }
.farmer-progress-step small { color: #667085; font-size: 8.5px; white-space: nowrap; }
.farmer-progress-step.active > span,
.farmer-progress-step.complete > span { color: #fff; background: linear-gradient(180deg,#159447,#087833); box-shadow: 0 5px 12px rgba(15,135,59,.2); }
.farmer-progress-step.active strong { color: #101828; }
.farmer-wizard-progress > i { flex: 1; min-width: 20px; height: 1px; margin: 0 16px; background: #e5e9e7; }
.farmer-wizard-progress > i.complete { background: #27a553; }
.farmer-registration-layout { display: grid; grid-template-columns: minmax(0,1fr) 290px; align-items: start; gap: 15px; }
.farmer-registration-main { display: grid; gap: 14px; min-width: 0; }
.farmer-wizard-panel { display: grid; gap: 14px; }
.farmer-form-card,
.farmer-tip-card,
.farmer-draft-notice {
    background: #fff;
    border: 1px solid #e5e9e7;
    border-radius: 9px;
    box-shadow: 0 2px 10px rgba(16,24,40,.02);
}
.farmer-form-card { padding: 18px; }
.farmer-form-card h2 { margin: 0 0 19px; color: #101828; font-size: 12.5px; font-weight: 680; letter-spacing: -.1px; }
.farmer-card-copy { margin: -9px 0 18px; color: #667085; font-size: 9px; line-height: 1.5; }
.farmer-personal-grid { display: grid; grid-template-columns: 168px minmax(0,1fr); gap: 26px; }
.farmer-personal-fields { display: grid; gap: 17px; }
.farmer-photo-upload { display: block; min-height: 164px; cursor: pointer; }
.farmer-photo-upload > input { display: none; }
.farmer-photo-preview { display: grid; place-items: center; align-content: center; gap: 8px; width: 100%; height: 164px; overflow: hidden; color: #344054; background: #fff; border: 1px dashed #cfd8d3; border-radius: 7px; text-align: center; }
.farmer-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.farmer-photo-preview b { font-size: 10px; font-weight: 600; }
.farmer-photo-preview small { color: #667085; font-size: 7.5px; }
.farmer-field-grid { display: grid; gap: 15px; }
.farmer-field-grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.farmer-field-grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.farmer-field-grid.four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.farmer-field-grid.five { grid-template-columns: repeat(5,minmax(0,1fr)); }
.farmer-field-grid label { display: grid; align-content: start; gap: 8px; min-width: 0; }
.farmer-field-grid label > span { color: #101828; font-size: 8.7px; font-weight: 590; }
.farmer-field-grid label > span em { color: #e3342f; font-style: normal; }
.farmer-field-grid input,
.farmer-field-grid select { min-height: 39px; padding: 9px 11px; border-color: #dbe2de; border-radius: 6px; font-size: 9px; }
.farmer-field-grid input::placeholder { color: #8a94a4; }
.farmer-personal-fields .farmer-field-grid.four { grid-template-columns: 1fr 1.05fr 1.45fr; }
.farmer-personal-fields .wide-two { grid-column: auto; }
.farmer-form-card > .farmer-field-grid.four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.farmer-form-card > .farmer-field-grid.five { grid-template-columns: repeat(5,minmax(0,1fr)); }
.farmer-location-button { align-self: end; min-height: 39px; color: #0d7f37; background: #eff8f2; border: 1px solid #cce7d5; border-radius: 6px; font-size: 9px; font-weight: 600; cursor: pointer; }
.farmer-quick-tips { display: grid; gap: 12px; }
.farmer-tip-card { padding: 20px; }
.farmer-tip-card h3 { display: flex; align-items: center; gap: 9px; margin: 0; color: #101828; font-size: 11px; font-weight: 680; }
.farmer-tip-card h3 .ui-icon { color: #0d8a3a; }
.farmer-tip-card ul { display: grid; gap: 23px; margin: 26px 0 24px; padding: 0; list-style: none; }
.farmer-tip-card li { position: relative; padding-left: 22px; color: #475467; font-size: 9px; line-height: 1.6; }
.farmer-tip-card li::before { content: "✓"; position: absolute; left: 0; top: 0; color: #16a34a; font-size: 12px; font-weight: 700; }
.farmer-tip-card li em { color: #e3342f; font-style: normal; }
.farmer-tip-card button { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 42px; color: #0b7e35; background: linear-gradient(90deg,#f0f8f2,#edf7ef); border: 1px solid #dcebe1; border-radius: 6px; font-size: 9.5px; font-weight: 650; cursor: pointer; }
.farmer-draft-notice { display: grid; gap: 6px; padding: 15px; color: #315c43; background: #f3faf5; }
.farmer-draft-notice strong { font-size: 10px; }
.farmer-draft-notice span { font-size: 8.5px; line-height: 1.5; }
.farmer-payment-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.farmer-payment-options label { cursor: pointer; }
.farmer-payment-options input { position: absolute; opacity: 0; pointer-events: none; }
.farmer-payment-options span { display: grid; justify-items: start; gap: 8px; min-height: 118px; padding: 18px; color: #475467; background: #fff; border: 1px solid #dce3df; border-radius: 8px; }
.farmer-payment-options b { color: #101828; font-size: 11px; }
.farmer-payment-options small { font-size: 9px; line-height: 1.5; }
.farmer-payment-options input:checked + span { color: #11843a; background: #f2faf4; border-color: #1a9748; box-shadow: 0 0 0 3px rgba(20,140,62,.07); }
.farmer-document-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.farmer-document-upload input { display: none; }
.farmer-document-upload span { display: grid; grid-template-columns: 34px 1fr; align-items: center; gap: 3px 12px; min-height: 92px; padding: 15px; color: #667085; background: #fbfcfb; border: 1px dashed #ced8d2; border-radius: 8px; cursor: pointer; }
.farmer-document-upload .ui-icon { grid-row: 1 / 4; color: #148c3e; }
.farmer-document-upload b { color: #101828; font-size: 10px; }
.farmer-document-upload small { font-size: 8.5px; line-height: 1.45; }
.farmer-document-upload em { color: #148c3e; font-size: 8.5px; font-style: normal; font-weight: 600; }
.farmer-review-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.farmer-review-section { overflow: hidden; border: 1px solid #e2e7e4; border-radius: 8px; }
.farmer-review-section h3 { margin: 0; padding: 12px 14px; color: #101828; background: #f7faf8; border-bottom: 1px solid #e2e7e4; font-size: 10px; }
.farmer-review-section dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 0; padding: 14px; }
.farmer-review-section div { min-width: 0; }
.farmer-review-section dt { color: #667085; font-size: 7.8px; }
.farmer-review-section dd { overflow: hidden; margin: 4px 0 0; color: #101828; font-size: 9px; font-weight: 560; text-overflow: ellipsis; white-space: nowrap; }
.farmer-declaration { display: flex; align-items: flex-start; gap: 10px; margin-top: 18px; padding: 14px; color: #475467; background: #f8faf9; border: 1px solid #e3e8e5; border-radius: 7px; font-size: 9px; line-height: 1.5; }
.farmer-declaration input { width: 15px; height: 15px; min-height: 0; margin: 1px 0 0; accent-color: #148c3e; }
.farmer-registration-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 18px 0; }
.farmer-registration-actions > div { display: flex; align-items: center; gap: 12px; }
.farmer-cancel-button,
.farmer-back-button,
.farmer-next-button,
.farmer-save-later,
.farmer-final-save { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 9px 15px; border-radius: 6px; font-size: 9.5px; font-weight: 620; cursor: pointer; }
.farmer-cancel-button,
.farmer-back-button { color: #344054; background: #fff; border: 1px solid #d9e0dc; }
.farmer-next-button { color: #0d8438; background: #fff; border: 1px solid #bcdcc8; }
.farmer-save-later,
.farmer-final-save { color: #fff; background: linear-gradient(90deg,#12863b,#0a7934); border: 1px solid #0d7f37; }
.farmer-registration-page [aria-invalid="true"] { border-color: #d64545 !important; box-shadow: 0 0 0 3px rgba(214,69,69,.08) !important; }
.farmer-view-mode input,
.farmer-view-mode select { pointer-events: none; background: #f7f9f8; }

@media (max-width: 1380px) {
    .farmer-stat-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .farmer-filter-bar { grid-template-columns: minmax(210px,1.4fr) repeat(3,minmax(120px,.8fr)); }
    .farmer-filter-bar .farmer-filter-field:nth-of-type(5) { display: none; }
    .farmer-filter-more, .farmer-add-button { min-width: 112px; }
    .farmer-personal-grid { grid-template-columns: 150px minmax(0,1fr); gap: 18px; }
    .farmer-registration-layout { grid-template-columns: minmax(0,1fr) 255px; }
    .farmer-wizard-progress { overflow-x: auto; }
    .farmer-progress-step small { max-width: 145px; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 1120px) {
    .farmer-registration-layout { grid-template-columns: 1fr; }
    .farmer-quick-tips { grid-template-columns: 1fr 1fr; }
    .farmer-tip-card ul { grid-template-columns: repeat(2,1fr); gap: 14px; }
    .farmer-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .farmer-filter-bar { grid-template-columns: minmax(200px,1.4fr) repeat(2,minmax(125px,.8fr)) auto; }
    .farmer-filter-field:nth-of-type(4), .farmer-filter-field:nth-of-type(5) { display: none; }
}
@media (max-width: 760px) {
    .farmer-experience .content { padding: 12px; }
    .farmer-reference-topbar { min-height: 70px; padding: 0 13px; }
    .farmer-reference-topbar .top-left { gap: 10px; }
    .farmer-reference-topbar h1 { font-size: 16px; }
    .farmer-reference-actions .farmer-top-select { display: none; }
    .farmer-stat-grid { grid-template-columns: 1fr; }
    .farmer-filter-bar { grid-template-columns: 1fr 1fr; }
    .farmer-search-box { grid-column: 1 / -1; }
    .farmer-filter-field:nth-of-type(2), .farmer-filter-field:nth-of-type(3) { display: grid; }
    .farmer-filter-more, .farmer-add-button { width: 100%; }
    .farmer-table-meta { align-items: flex-start; flex-direction: column; }
    .farmer-table-meta > div { width: 100%; justify-content: space-between; gap: 10px; }
    .farmer-pagination { align-items: flex-start; flex-wrap: wrap; }
    .farmer-wizard-progress { padding: 12px; }
    .farmer-progress-step { min-width: 185px; }
    .farmer-wizard-progress > i { min-width: 24px; margin: 0 8px; }
    .farmer-personal-grid { grid-template-columns: 1fr; }
    .farmer-photo-upload { min-height: 145px; }
    .farmer-photo-preview { max-width: 180px; height: 145px; }
    .farmer-field-grid.two,
    .farmer-field-grid.three,
    .farmer-field-grid.four,
    .farmer-field-grid.five,
    .farmer-personal-fields .farmer-field-grid.four,
    .farmer-form-card > .farmer-field-grid.four,
    .farmer-form-card > .farmer-field-grid.five,
    .farmer-payment-options,
    .farmer-document-grid,
    .farmer-review-grid { grid-template-columns: 1fr; }
    .farmer-quick-tips { grid-template-columns: 1fr; }
    .farmer-tip-card ul { grid-template-columns: 1fr; }
    .farmer-registration-actions { align-items: stretch; flex-direction: column; padding: 4px 0 0; }
    .farmer-registration-actions > div { display: grid; grid-template-columns: 1fr 1fr; }
    .farmer-cancel-button { width: 100%; }
    .farmer-save-later, .farmer-final-save { grid-column: 1 / -1; }
}
.farmer-reference-table.compact-columns th:nth-child(6),
.farmer-reference-table.compact-columns td:nth-child(6),
.farmer-reference-table.compact-columns th:nth-child(7),
.farmer-reference-table.compact-columns td:nth-child(7) { display: none; }
.farmer-photo-label { display: block; margin-bottom: 8px; color: #101828; font-size: 8.7px; font-weight: 590; }
.farmer-photo-upload { min-height: 184px; }

/* Client reference design extensions */
.nav-flat { gap: 2px; }
.nav-flat .section-caption { padding-top: 16px; }
.general-reference-topbar .page-heading-icon,
.general-reference-topbar .top-role,
.general-reference-topbar .period,
.general-reference-topbar .account-button,
.general-reference-topbar .sms-balance-pill { display: none; }
.farmer-top-select.compact { min-height: 34px; padding: 6px 10px; font-size: 10px; }
.farmer-stat-icon.danger { color: #e0554f; background: #fff0ef; }
.four-up { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.reference-page-shell { display: flex; flex-direction: column; gap: 18px; }
.dashboard-reference-page { display: flex; flex-direction: column; gap: 18px; }
.dashboard-stat-grid { margin-top: 0; }
.dashboard-grid-3 { display: grid; grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr); gap: 18px; }
.dashboard-grid-3.lower { align-items: start; }
.two-wide { grid-column: span 1; }
.simple-bar-chart { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 16px; align-items: end; min-height: 250px; padding: 6px 4px 0; }
.simple-bar-item { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.simple-bar-item strong { color: var(--muted); font-size: 11px; font-weight: 600; }
.simple-bar-item small { color: var(--text-soft); font-size: 11px; }
.simple-bar-track { position: relative; width: 100%; height: 190px; display: flex; align-items: end; justify-content: center; background: linear-gradient(180deg, #f8fbf9 0%, #f2f7f4 100%); border-radius: 14px; border: 1px solid #eef2ef; overflow: hidden; }
.simple-bar-track span { width: 52%; border-radius: 14px 14px 0 0; background: linear-gradient(180deg, #179d4d 0%, #11803f 100%); box-shadow: 0 12px 22px rgba(23,107,74,.18); }
.summary-list { display: flex; flex-direction: column; gap: 12px; }
.summary-list > div { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 14px; background: #f8fbf9; border: 1px solid #eef2ef; border-radius: 12px; }
.summary-list > div span { color: var(--text-soft); }
.summary-list > div b { font-size: 14px; }
.full-width { width: 100%; justify-content: center; }
.mini-stat-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.quick-link-footer { margin-top: 14px; }
.quick-link-footer a { display: inline-flex; align-items: center; gap: 8px; color: var(--brand); font-weight: 600; }
.quick-actions-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.quick-actions-grid a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 102px; padding: 14px 12px; text-align: center; background: #fff; border: 1px solid #e8eeeb; border-radius: 14px; box-shadow: var(--shadow-sm); }
.quick-actions-grid a span { display: grid; place-items: center; width: 40px; height: 40px; color: var(--brand); background: #edf7f1; border-radius: 12px; }
.quick-actions-grid a b { font-size: 12px; font-weight: 600; color: var(--text); }
.reference-list-card { padding: 18px 18px 12px; }
.reference-list-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.reference-list-header h2 { margin: 10px 0 4px; }
.reference-list-header small { color: var(--muted); }
.reference-list-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.reference-tab-strip { display: inline-flex; padding: 4px; background: #f2f6f4; border: 1px solid #e6ece8; border-radius: 12px; }
.reference-tab-strip a { padding: 9px 14px; border-radius: 8px; font-size: 12px; font-weight: 600; color: var(--text-soft); }
.reference-tab-strip a.active { color: var(--brand); background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.05); }
.reference-data-table { width: 100%; border-collapse: collapse; }
.reference-data-table th, .reference-data-table td { padding: 14px 12px; border-bottom: 1px solid #edf1ef; font-size: 12.5px; text-align: left; vertical-align: top; }
.reference-data-table th { color: #52606d; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; background: #fbfcfc; }
.reference-data-table tbody tr:hover { background: #fafcfb; }
.empty-row { text-align: center; color: var(--muted); padding: 26px 16px !important; }
.compact-filters { margin-bottom: 16px; }
.farmer-inline-form { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; padding: 16px 0; }
.farmer-inline-form.stacked { grid-template-columns: 1fr; }
.farmer-inline-form label { display: flex; flex-direction: column; gap: 8px; font-size: 12px; font-weight: 600; color: var(--text); }
.farmer-inline-form label span { color: var(--text); }
.farmer-inline-form input,
.farmer-inline-form select,
.farmer-inline-form textarea { width: 100%; min-height: 42px; padding: 11px 13px; color: var(--text); background: #fff; border: 1px solid #dfe6e2; border-radius: 10px; outline: none; }
.farmer-inline-form textarea { min-height: 120px; resize: vertical; }
.inline-submit { display: flex; align-items: end; }
.users-layout { grid-template-columns: minmax(300px, 1fr) minmax(0, 2fr); }
.report-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.compact-table th, .compact-table td { padding-top: 12px; padding-bottom: 12px; }

@media (max-width: 1200px) {
    .dashboard-grid-3,
    .users-layout { grid-template-columns: 1fr; }
    .quick-actions-grid,
    .report-grid,
    .four-up { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 820px) {
    .simple-bar-chart { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .quick-actions-grid,
    .report-grid,
    .four-up { grid-template-columns: 1fr; }
    .reference-list-header { flex-direction: column; }
    .farmer-inline-form { grid-template-columns: 1fr; }
}

/* Bongapay complete reference screens */
.reference-tabs {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px;
    overflow-x: auto;
    background: #fff;
    border: 1px solid #e4ebe7;
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    scrollbar-width: none;
}
.reference-tabs::-webkit-scrollbar { display: none; }
.reference-tabs a {
    flex: 0 0 auto;
    padding: 10px 15px;
    color: #5f6d65;
    border-radius: 9px;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
}
.reference-tabs a:hover { color: var(--brand); background: #f4f8f6; }
.reference-tabs a.active { color: #fff; background: var(--brand); box-shadow: 0 7px 16px rgba(23,107,74,.17); }
.farmer-profile-hero { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px; }
.farmer-profile-identity { display: flex; align-items: center; gap: 16px; min-width: 0; }
.farmer-profile-identity > img,
.farmer-profile-identity > span { width: 62px; height: 62px; flex: 0 0 auto; border-radius: 50%; object-fit: cover; }
.farmer-profile-identity > span { display: grid; place-items: center; color: #fff; background: linear-gradient(145deg,#159447,#0e633b); font-size: 23px; font-weight: 750; }
.farmer-profile-identity small { color: var(--brand); font-size: 11px; font-weight: 700; }
.farmer-profile-identity h2 { margin: 5px 0 4px; font-size: 21px; }
.farmer-profile-identity p { margin: 0; color: var(--muted); font-size: 12px; }
.details-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.details-grid > div { min-width: 0; padding: 13px 14px; background: #f8fbf9; border: 1px solid #edf2ef; border-radius: 11px; }
.details-grid > div.full-row { grid-column: 1 / -1; }
.details-grid span { display: block; margin-bottom: 6px; color: var(--muted); font-size: 10px; font-weight: 650; text-transform: uppercase; letter-spacing: .03em; }
.details-grid b { display: block; overflow-wrap: anywhere; font-size: 12.5px; font-weight: 650; }
.document-link-list { display: flex; flex-direction: column; gap: 9px; }
.document-link-list a,
.document-link-list > div { display: flex; align-items: center; gap: 10px; min-height: 43px; padding: 10px 12px; color: var(--text); background: #f8fbf9; border: 1px solid #edf2ef; border-radius: 10px; font-size: 12px; }
.document-link-list a span,
.document-link-list > div span { flex: 1; }
.document-link-list small { color: var(--muted); }
.activity-timeline { display: flex; flex-direction: column; padding: 4px 0; }
.activity-timeline > div { position: relative; display: grid; grid-template-columns: 24px 1fr; gap: 12px; padding: 0 0 20px; }
.activity-timeline > div:not(:last-child)::before { content:""; position:absolute; left:7px; top:15px; bottom:0; width:1px; background:#dce7e1; }
.activity-timeline i { position: relative; z-index: 1; width: 15px; height: 15px; margin-top: 2px; border: 4px solid #dff3e8; border-radius: 50%; background: var(--brand); }
.activity-timeline span { display: flex; flex-direction: column; gap: 4px; }
.activity-timeline b { font-size: 12.5px; }
.activity-timeline small { color: var(--text-soft); }
.activity-timeline em { color: var(--muted); font-size: 10px; font-style: normal; }
.form-page-card { max-width: 1080px; width: 100%; margin: 0 auto; padding: 20px; }
.farmer-inline-form.two-columns { grid-template-columns: repeat(2,minmax(0,1fr)); }
.farmer-inline-form .full-row { grid-column: 1 / -1; }
.farmer-inline-form .inline-submit.full-row { justify-content: flex-end; gap: 10px; }
.standalone-search { display: flex; width: min(440px,100%); margin: 0 0 14px; }
.reference-copy { color: var(--text-soft); line-height: 1.65; }
.approval-progress {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 18px;
    overflow-x: auto;
    background: #fff;
    border: 1px solid #e4ebe7;
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
}
.approval-progress.large { min-height: 92px; }
.approval-progress span { flex: 0 0 auto; padding: 8px 11px; color: #748078; background: #f4f7f5; border: 1px solid #e5ebe8; border-radius: 999px; font-size: 10.5px; font-weight: 650; }
.approval-progress span.done { color: #116d3e; background: #eaf7ef; border-color: #c9ead7; }
.approval-progress i { flex: 1 0 24px; height: 2px; background: #e1e8e4; }
.approval-action-form { display: flex; flex-direction: column; gap: 12px; padding: 14px 0; border-bottom: 1px solid #edf1ef; }
.approval-action-form:last-child { border-bottom: 0; }
.approval-action-form label { display: flex; flex-direction: column; gap: 7px; font-size: 11px; font-weight: 650; }
.approval-action-form input,
.approval-action-form textarea { width: 100%; padding: 10px 11px; border: 1px solid #dfe6e2; border-radius: 9px; }
.approval-action-form textarea { min-height: 86px; resize: vertical; }
.danger-button { background: #b83c38 !important; }
.danger-text { color: #b83c38 !important; }
.reference-notice { padding: 14px 16px; color: #526159; background: #f7faf8; border: 1px solid #e5ece8; border-left: 3px solid var(--brand); border-radius: 10px; line-height: 1.55; }
.reference-list-actions input[type="month"] { min-height: 40px; padding: 8px 11px; border: 1px solid #dfe6e2; border-radius: 9px; }
.inline-actions { display: flex; align-items: center; gap: 7px; }
.top-gap { margin-top: 14px; }
.quick-actions-grid.one-column { grid-template-columns: 1fr; }
.role-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.role-card-grid article { padding: 18px; background: #fff; border: 1px solid #e6ece8; border-radius: 14px; box-shadow: var(--shadow-sm); }
.role-card-grid article > span { display: grid; place-items: center; width: 42px; height: 42px; color: var(--brand); background: #edf7f1; border-radius: 12px; }
.role-card-grid h3 { margin: 12px 0 5px; font-size: 14px; }
.role-card-grid p { margin: 0 0 12px; color: var(--muted); font-size: 11px; }
.role-card-grid ul { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.role-card-grid li { display: flex; align-items: center; gap: 7px; color: var(--text-soft); font-size: 11px; }
.role-card-grid li .ui-icon { color: var(--brand); }
.dual-bar-chart { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 16px; align-items: end; min-height: 255px; padding: 8px 8px 0; }
.dual-bar-chart > div { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.dual-bars { display: flex; align-items: flex-end; justify-content: center; gap: 5px; width: 100%; height: 210px; padding: 0 8px; background: repeating-linear-gradient(to top,#f1f5f3 0,#f1f5f3 1px,transparent 1px,transparent 42px); border-bottom: 1px solid #dfe7e3; }
.dual-bars i,
.dual-bars b { width: 30%; min-height: 8px; border-radius: 7px 7px 0 0; }
.dual-bars i { background: #159447; }
.dual-bars b { background: #4388e6; }
.dual-bar-chart small { color: var(--muted); font-size: 10px; }
.chart-legend { display: flex; justify-content: center; gap: 20px; margin-top: 14px; color: var(--text-soft); font-size: 11px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 7px; }
.chart-legend i { width: 9px; height: 9px; border-radius: 3px; }
.chart-legend i.gross { background: #159447; }
.chart-legend i.paid { background: #4388e6; }
.report-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.report-card-grid a { display: grid; grid-template-columns: 44px 1fr auto; grid-template-rows: auto auto; gap: 4px 12px; align-items: center; padding: 18px; background: #fff; border: 1px solid #e5ebe7; border-radius: 14px; box-shadow: var(--shadow-sm); }
.report-card-grid a > span { grid-row: 1 / 3; display: grid; place-items: center; width: 44px; height: 44px; color: var(--brand); background: #edf7f1; border-radius: 12px; }
.report-card-grid small { color: var(--muted); font-size: 10.5px; }
.report-card-grid strong { font-size: 16px; }
.report-card-grid em { grid-column: 3; grid-row: 1 / 3; display: inline-flex; align-items: center; gap: 6px; color: var(--brand); font-size: 10px; font-style: normal; }
.reference-data-table select { min-height: 34px; padding: 6px 9px; border: 1px solid #dfe6e2; border-radius: 8px; background: #fff; }
.selectable-table input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--brand); }

@media (max-width: 1100px) {
    .details-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .role-card-grid,
    .report-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
    .farmer-profile-hero { align-items: flex-start; flex-direction: column; }
    .details-grid,
    .farmer-inline-form.two-columns,
    .role-card-grid,
    .report-card-grid { grid-template-columns: 1fr; }
    .dual-bar-chart { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .report-card-grid a { grid-template-columns: 44px 1fr; }
    .report-card-grid em { grid-column: 2; grid-row: auto; }
    .approval-progress i { flex-basis: 12px; }
}
.sidebar-user-actions { display: flex; align-items: center; gap: 5px; }
.sidebar-user-actions a { display: grid; place-items: center; width: 30px; height: 30px; color: #fff; border-radius: 8px; }
.sidebar-user-actions a:hover { background: rgba(255,255,255,.1); }

/* Desktop collapsible navigation */
.sidebar,
.sidebar-user,
.main,
.brand,
.farmer-brand,
.nav-link,
.farmer-nav-item,
.nav-icon,
.farmer-nav-item > span {
    transition: width .24s ease, margin .24s ease, padding .24s ease, gap .2s ease, background .18s ease, transform .2s ease;
}

@media (min-width: 1041px) {
    body.sidebar-collapsed {
        --sidebar-width: 78px;
    }

    body.sidebar-collapsed .sidebar {
        width: var(--sidebar-width);
        padding-left: 9px;
        padding-right: 9px;
        overflow-x: hidden;
    }

    body.sidebar-collapsed .main {
        width: calc(100% - var(--sidebar-width));
        margin-left: var(--sidebar-width);
    }

    body.sidebar-collapsed .brand,
    body.sidebar-collapsed .farmer-brand {
        justify-content: center;
        min-height: 76px;
        gap: 0;
        padding-left: 0;
        padding-right: 0;
    }

    body.sidebar-collapsed .brand-copy,
    body.sidebar-collapsed .farmer-brand-copy,
    body.sidebar-collapsed .Workspace-card,
    body.sidebar-collapsed .nav-caption,
    body.sidebar-collapsed .farmer-nav-caption,
    body.sidebar-collapsed .sidebar-user-copy {
        display: none;
    }

    body.sidebar-collapsed .brand-mark {
        width: 44px;
        height: 44px;
        border-radius: 13px;
    }

    body.sidebar-collapsed .farmer-brand-mark {
        width: 48px;
        height: 52px;
    }

    body.sidebar-collapsed .brand-mark img,
    body.sidebar-collapsed .farmer-brand-mark img {
        width: 38px;
        height: 38px;
    }

    body.sidebar-collapsed .nav,
    body.sidebar-collapsed .farmer-flat-nav {
        gap: 7px;
        padding-top: 8px;
    }

    body.sidebar-collapsed .nav-link,
    body.sidebar-collapsed .nav-parent {
        justify-content: center;
        min-height: 48px;
        gap: 0;
        padding: 4px;
        border-radius: 12px;
    }

    body.sidebar-collapsed .nav-label,
    body.sidebar-collapsed .nav-caret,
    body.sidebar-collapsed .nav-children {
        display: none;
    }

    body.sidebar-collapsed .nav-icon {
        display: grid;
        place-items: center;
        width: 40px;
        min-width: 40px;
        height: 40px;
        color: rgba(238,245,241,.82);
        border-radius: 11px;
    }

    body.sidebar-collapsed .nav-link:hover .nav-icon,
    body.sidebar-collapsed .nav-link.active .nav-icon {
        color: #fff;
        background: rgba(255,255,255,.10);
    }

    body.sidebar-collapsed .nav-link.active {
        background: linear-gradient(145deg, rgba(32,169,78,.95), rgba(17,126,63,.95));
        box-shadow: 0 8px 18px rgba(0,0,0,.18);
    }

    body.sidebar-collapsed .nav-link.active::before {
        display: none;
    }

    body.sidebar-collapsed .farmer-nav-item {
        justify-content: center;
        min-height: 48px;
        gap: 0;
        padding: 4px;
        font-size: 0;
        border-radius: 12px;
    }

    body.sidebar-collapsed .farmer-nav-item > span {
        width: 40px;
        height: 40px;
        color: rgba(255,255,255,.88);
        border-radius: 11px;
    }

    body.sidebar-collapsed .farmer-nav-item:hover > span,
    body.sidebar-collapsed .farmer-nav-item.active > span {
        color: #fff;
        background: rgba(255,255,255,.12);
    }

    body.sidebar-collapsed .farmer-nav-item.active {
        background: linear-gradient(145deg, #1aa34c, #11803f);
        box-shadow: 0 8px 18px rgba(0,0,0,.19);
    }

    body.sidebar-collapsed .farmer-nav-item i {
        display: none;
    }

    body.sidebar-collapsed .sidebar-user,
    body.sidebar-collapsed .farmer-sidebar-user {
        width: var(--sidebar-width);
        min-height: 116px;
        padding: 10px 8px;
        flex-direction: column;
        justify-content: center;
        gap: 8px;
    }

    body.sidebar-collapsed .sidebar-user .avatar {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
    }

    body.sidebar-collapsed .sidebar-user > a,
    body.sidebar-collapsed .sidebar-user-actions a {
        width: 38px;
        height: 38px;
        color: rgba(255,255,255,.82);
        background: rgba(255,255,255,.055);
        border-radius: 11px;
    }

    body.sidebar-collapsed .sidebar-user > a:hover,
    body.sidebar-collapsed .sidebar-user-actions a:hover {
        color: #fff;
        background: rgba(255,255,255,.13);
    }

    body.sidebar-collapsed .sidebar-user-actions {
        flex-direction: column;
        gap: 6px;
    }

    body.sidebar-collapsed [data-menu-open] {
        color: var(--brand);
        background: var(--brand-soft);
        border: 1px solid #dcebe3;
        transform: rotate(180deg);
    }
}
@media (min-width: 1041px) {
    body.sidebar-collapsed .sidebar {
        padding-bottom: 164px;
    }
    body.sidebar-collapsed .sidebar-user,
    body.sidebar-collapsed .farmer-sidebar-user {
        min-height: 148px;
    }
}

/* Farmer profile — complete client reference screens */
.farmer-profile-page { gap: 16px; }
.profile-page-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.profile-identity-card { display: grid; grid-template-columns: minmax(340px,1.35fr) minmax(260px,1fr) minmax(210px,.75fr); gap: 0; padding: 20px 24px; }
.profile-person-block { display: flex; align-items: center; gap: 20px; min-width: 0; padding-right: 24px; }
.profile-photo-wrap { position: relative; width: 112px; min-width: 112px; text-align: center; }
.profile-photo-wrap > img,
.profile-photo-wrap > span { display: grid; place-items: center; width: 92px; height: 92px; margin: 0 auto; overflow: hidden; color: #fff; background: linear-gradient(145deg,#139148,#075f34); border: 4px solid #f0f6f2; border-radius: 50%; object-fit: cover; font-size: 32px; font-weight: 750; box-shadow: 0 8px 22px rgba(4,63,39,.14); }
.profile-active-pill { display: inline-flex; align-items: center; gap: 6px; margin-top: 7px; padding: 4px 9px; color: #0f7b3e; background: #e8f7ee; border-radius: 999px; font-size: 10px; font-style: normal; font-weight: 700; }
.profile-active-pill i { width: 6px; height: 6px; background: #19a253; border-radius: 50%; }
.profile-person-copy { min-width: 0; }
.profile-person-copy h2 { margin: 0 0 5px; font-size: 22px; letter-spacing: -.35px; }
.profile-person-copy > p { margin: 0 0 12px; color: var(--muted); font-size: 12px; }
.profile-person-copy ul { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.profile-person-copy li { display: flex; align-items: center; gap: 9px; min-width: 0; color: var(--text-soft); font-size: 12px; }
.profile-person-copy li span { overflow: hidden; text-overflow: ellipsis; }
.profile-facts-column { display: flex; flex-direction: column; justify-content: center; gap: 15px; padding: 2px 26px; border-left: 1px solid #edf1ef; }
.profile-facts-column.compact { padding-right: 0; }
.profile-facts-column > div { display: grid; grid-template-columns: minmax(90px,.8fr) minmax(110px,1.2fr); gap: 12px; align-items: center; }
.profile-facts-column span { color: #66736c; font-size: 11px; }
.profile-facts-column b { min-width: 0; color: var(--text); font-size: 12px; font-weight: 600; overflow-wrap: anywhere; }
.profile-facts-column .farmer-state { display: inline-flex; }
.profile-summary-cards .farmer-stat-card { min-height: 112px; }
.farmer-profile-page .reference-tabs { padding: 0 10px; border-radius: 10px; box-shadow: none; }
.farmer-profile-page .reference-tabs a { position: relative; padding: 14px 18px; background: transparent; border-radius: 0; font-weight: 560; }
.farmer-profile-page .reference-tabs a.active { color: #0a7c3b; background: transparent; box-shadow: none; }
.farmer-profile-page .reference-tabs a.active::after { content:""; position:absolute; left:12px; right:12px; bottom:0; height:2px; border-radius:999px; background:#0b8a42; }
.profile-overview-grid { display: grid; grid-template-columns: minmax(0,2.1fr) minmax(280px,.9fr); gap: 16px; align-items: start; }
.profile-details-panel { min-height: 100%; }
.profile-details-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.profile-details-columns > div { display: flex; flex-direction: column; gap: 14px; }
.profile-details-columns p,
.profile-side-list p { display: grid; grid-template-columns: minmax(120px,.9fr) minmax(120px,1.1fr); gap: 14px; align-items: start; margin: 0; }
.profile-details-columns span,
.profile-side-list span { color: #69766f; font-size: 11px; }
.profile-details-columns b,
.profile-side-list b { min-width: 0; color: var(--text); font-size: 12px; font-weight: 600; overflow-wrap: anywhere; }
.profile-overview-side { display: flex; flex-direction: column; gap: 16px; }
.profile-side-list { display: flex; flex-direction: column; gap: 13px; }
.profile-side-list .danger-row { margin-top: 4px; padding-top: 12px; border-top: 1px solid #edf1ef; }
.profile-side-list .danger-row span,
.profile-side-list .danger-row b { color: #c9433d; }
.profile-payment-methods-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.profile-method-card,
.profile-payment-summary { min-height: 260px; }
.profile-method-row { display: grid; grid-template-columns: 42px 1fr auto; gap: 11px; align-items: center; padding: 12px 0; border-bottom: 1px solid #edf1ef; }
.profile-method-row:last-of-type { border-bottom: 0; }
.method-round-icon,
.document-round-icon { display: grid; place-items: center; width: 40px; height: 40px; color: #0c8340; background: #edf8f2; border-radius: 50%; }
.profile-method-row > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.profile-method-row b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.profile-method-row small { color: var(--muted); font-size: 10px; }
.profile-method-row em,
.primary-inline { display: inline-flex; margin-left: 7px; padding: 3px 7px; color: #08743a; background: #e7f6ed; border-radius: 6px; font-size: 9px; font-style: normal; font-weight: 700; }
.profile-add-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; color: #08773b; font-size: 11px; font-weight: 650; }
.compact-empty { min-height: 90px; display: grid; place-items: center; }
.profile-donut-wrap { display: grid; grid-template-columns: 96px 1fr; gap: 15px; align-items: center; margin: 6px 0 17px; }
.profile-donut { width: 90px; height: 90px; border-radius: 50%; background: conic-gradient(#159447 0 calc(var(--earnings)*1%), #3f83e6 calc(var(--earnings)*1%) 72%, #8c6fe8 72% 100%); box-shadow: inset 0 0 0 21px #fff; }
.profile-summary-legend { display: flex; flex-direction: column; gap: 10px; }
.profile-summary-legend p { display: grid; grid-template-columns: 8px 1fr auto; gap: 7px; align-items: center; margin: 0; font-size: 10px; }
.profile-summary-legend i { width: 7px; height: 7px; border-radius: 50%; }
.profile-summary-legend i.earnings { background:#159447; }
.profile-summary-legend i.deductions { background:#8c6fe8; }
.profile-summary-legend i.payments { background:#3f83e6; }
.profile-summary-legend span { color: var(--muted); }
.profile-summary-legend b { font-size: 10px; }
.profile-transactions-card { padding-bottom: 10px; }
.profile-ytd-cards { margin-bottom: 2px; }
.five-up { grid-template-columns: repeat(5,minmax(0,1fr)); }
.compact-profile-stats { margin: 2px 0 18px; }
.compact-profile-stats .farmer-stat-card { min-height: 102px; }
.profile-table-summary { display: grid; gap: 0; margin-top: 14px; background: #fafcfb; border: 1px solid #e9efeb; border-radius: 10px; }
.profile-table-summary.four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.profile-table-summary.six { grid-template-columns: repeat(6,minmax(0,1fr)); }
.profile-table-summary > div { padding: 15px 17px; border-right: 1px solid #e7ece9; }
.profile-table-summary > div:last-child { border-right: 0; }
.profile-table-summary span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; }
.profile-table-summary b { font-size: 13px; }
.success-text { color: #09803e !important; font-weight: 700; }
.profile-advance-bottom { display: grid; grid-template-columns: minmax(260px,.75fr) minmax(0,1.8fr); gap: 16px; }
.reference-notice { display: flex; align-items: center; gap: 9px; }
.profile-add-details { position: relative; }
.profile-add-details > summary { list-style: none; cursor: pointer; }
.profile-add-details > summary::-webkit-details-marker { display: none; }
.profile-add-details[open] > summary { color: #fff; background: #0d6f3d; }
.profile-add-form { position: absolute; top: calc(100% + 10px); right: 0; z-index: 30; display: grid; grid-template-columns: repeat(2,minmax(180px,1fr)); gap: 12px; width: min(620px,calc(100vw - 40px)); padding: 18px; background: #fff; border: 1px solid #dfe8e3; border-radius: 14px; box-shadow: 0 22px 50px rgba(7,54,34,.18); }
.profile-add-form label { display: flex; flex-direction: column; gap: 7px; color: var(--text); font-size: 11px; font-weight: 650; }
.profile-add-form input,
.profile-add-form select { width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid #dfe6e2; border-radius: 9px; outline: none; }
.profile-add-form .checkbox-line { grid-column: 1 / -1; flex-direction: row; align-items: center; font-weight: 500; }
.profile-add-form .checkbox-line input { width: 16px; min-height: 16px; }
.profile-add-form > button { justify-self: end; grid-column: 1 / -1; }
.profile-documents-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.profile-documents-grid article { display: grid; grid-template-columns: 48px 1fr auto; gap: 13px; align-items: center; min-height: 110px; padding: 17px; background: #fafcfb; border: 1px solid #e7eeea; border-radius: 13px; }
.profile-documents-grid h3 { margin: 0 0 5px; font-size: 13px; }
.profile-documents-grid p { margin: 0 0 8px; color: var(--muted); font-size: 10.5px; }
.profile-activity-timeline { max-width: 980px; }

@media (max-width: 1280px) {
    .profile-identity-card { grid-template-columns: minmax(320px,1.2fr) minmax(230px,.9fr); }
    .profile-facts-column.compact { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); padding: 16px 0 0; margin-top: 16px; border-left: 0; border-top: 1px solid #edf1ef; }
    .profile-payment-methods-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .profile-payment-summary { grid-column: 1 / -1; }
    .five-up { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .profile-table-summary.six { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .profile-table-summary.six > div:nth-child(3n) { border-right: 0; }
}
@media (max-width: 980px) {
    .profile-identity-card { grid-template-columns: 1fr; }
    .profile-person-block { padding-right: 0; }
    .profile-facts-column,
    .profile-facts-column.compact { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); padding: 16px 0 0; margin-top: 16px; border-left: 0; border-top: 1px solid #edf1ef; }
    .profile-overview-grid,
    .profile-payment-methods-grid,
    .profile-advance-bottom { grid-template-columns: 1fr; }
    .profile-payment-summary { grid-column: auto; }
    .five-up { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .profile-documents-grid { grid-template-columns: 1fr; }
    .profile-table-summary.four { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .profile-table-summary.four > div:nth-child(2n) { border-right: 0; }
}
@media (max-width: 620px) {
    .profile-page-actions { align-items: stretch; }
    .profile-page-actions .farmer-outline-button { flex: 1; justify-content: center; }
    .profile-person-block { align-items: flex-start; }
    .profile-photo-wrap { width: 80px; min-width: 80px; }
    .profile-photo-wrap > img,
    .profile-photo-wrap > span { width: 72px; height: 72px; font-size: 25px; }
    .profile-person-copy h2 { font-size: 18px; }
    .profile-facts-column,
    .profile-facts-column.compact { grid-template-columns: 1fr; }
    .profile-details-columns { grid-template-columns: 1fr; }
    .profile-payment-methods-grid,
    .five-up { grid-template-columns: 1fr; }
    .profile-table-summary.four,
    .profile-table-summary.six { grid-template-columns: 1fr; }
    .profile-table-summary > div { border-right: 0; border-bottom: 1px solid #e7ece9; }
    .profile-table-summary > div:last-child { border-bottom: 0; }
    .profile-add-form { position: fixed; inset: 82px 12px auto; grid-template-columns: 1fr; width: auto; max-height: calc(100vh - 100px); overflow-y: auto; }
    .profile-documents-grid article { grid-template-columns: 42px 1fr; }
    .profile-documents-grid article > a { grid-column: 1 / -1; justify-content: center; }
}

/* Farmer bank account and M-PESA registration wizards */
.account-wizard-page { display:flex; flex-direction:column; gap:18px; }
.account-wizard-stepper { display:grid; grid-template-columns:auto minmax(90px,1fr) auto minmax(90px,1fr) auto; align-items:center; gap:18px; min-height:110px; padding:24px 48px; background:#fff; border:1px solid #e7ece9; border-radius:14px; box-shadow:0 2px 9px rgba(16,40,29,.035); }
.account-wizard-step { display:flex; align-items:center; gap:14px; min-width:190px; }
.account-wizard-number { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; color:#1d2939; background:#f2f4f5; border-radius:50%; font-size:16px; font-weight:700; }
.account-wizard-step.active .account-wizard-number { color:#fff; background:#078432; box-shadow:0 8px 20px rgba(7,132,50,.2); }
.account-wizard-step.done .account-wizard-number { color:#078432; background:#e7f6ec; }
.account-wizard-step strong { display:block; color:#101828; font-size:13px; font-weight:700; }
.account-wizard-step small { display:block; margin-top:6px; color:#667085; font-size:11px; }
.account-wizard-line { display:block; height:1px; background:#d7ded9; }
.account-wizard-line.done { background:#188d45; }
.account-wizard-layout { display:grid; grid-template-columns:minmax(0,3fr) minmax(280px,1fr); gap:18px; align-items:start; }
.account-wizard-main,.account-wizard-side { min-width:0; }
.account-wizard-side { display:flex; flex-direction:column; gap:16px; }
.account-wizard-card,.account-side-card { background:#fff; border:1px solid #e7ece9; border-radius:14px; box-shadow:0 2px 9px rgba(16,40,29,.035); }
.account-wizard-card { padding:24px; }
.account-side-card { padding:22px; }
.account-section-title h2,.account-side-card h3 { margin:0; color:#101828; font-size:17px; font-weight:750; }
.account-section-title p { margin:7px 0 22px; color:#667085; font-size:12px; }
.account-side-card h3 { display:flex; align-items:center; gap:10px; font-size:14px; }
.account-side-card h3 .ui-icon { color:#0a8b3b; }
.account-side-card ul { list-style:none; display:flex; flex-direction:column; gap:18px; margin:22px 0 0; padding:0; }
.account-side-card li { position:relative; padding-left:25px; color:#485568; font-size:12px; line-height:1.6; }
.account-side-card li::before { content:"✓"; position:absolute; left:0; top:-1px; color:#07933a; font-weight:800; }
.account-side-card.security { background:linear-gradient(180deg,#fbfefc,#f8fcfa); }
.account-side-card.security p { margin:16px 0 0 38px; color:#536071; font-size:12px; line-height:1.65; }
.account-field-grid { display:grid; gap:20px 24px; }
.account-field-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.account-field-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.account-field-grid > label,.account-wide-label { display:flex; flex-direction:column; gap:8px; min-width:0; }
.account-field-grid label > span,.account-wide-label > span { display:flex; align-items:center; gap:5px; color:#17202c; font-size:12px; font-weight:650; }
.account-field-grid em { color:#df342d; font-style:normal; }
.account-field-grid input,.account-field-grid select,.account-wide-label textarea { width:100%; min-height:43px; padding:10px 13px; color:#17202c; background:#fff; border:1px solid #dce4e0; border-radius:8px; outline:none; transition:border .15s ease,box-shadow .15s ease; }
.account-field-grid input:focus,.account-field-grid select:focus,.account-wide-label textarea:focus { border-color:#138f43; box-shadow:0 0 0 3px rgba(19,143,67,.09); }
.account-field-grid input[readonly] { color:#657168; background:#f4f6f5; }
.account-field-grid label > small,.account-wide-label small { color:#24783e; font-size:10.5px; line-height:1.45; }
.account-subsection { margin-top:24px; padding-top:22px; border-top:1px solid #e7ece9; }
.account-subsection h3 { margin:0 0 18px; font-size:14px; }
.account-wide-label textarea { min-height:82px; resize:vertical; }
.account-toggle-field { justify-content:flex-start; }
.account-switch { display:flex!important; flex-direction:row!important; align-items:center; gap:10px!important; min-height:43px; }
.account-switch input { position:absolute; opacity:0; pointer-events:none; }
.account-switch i { position:relative; width:34px; height:19px; flex:0 0 34px; background:#cbd5d0; border-radius:999px; transition:.18s; }
.account-switch i::after { content:""; position:absolute; top:3px; left:3px; width:13px; height:13px; background:#fff; border-radius:50%; box-shadow:0 1px 4px rgba(0,0,0,.2); transition:.18s; }
.account-switch input:checked + i { background:#078a39; }
.account-switch input:checked + i::after { transform:translateX(15px); }
.account-switch b { color:#26342d; font-size:11.5px; font-weight:500; }
.account-info-banner { display:flex; align-items:flex-start; gap:10px; margin-top:24px; padding:13px 15px; color:#1f5c9b; background:#eef5ff; border:1px solid #cfe0f6; border-radius:7px; font-size:11px; line-height:1.55; }
.account-chip-row { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; }
.account-chip-row span,.account-status-chip { display:inline-flex; align-items:center; width:max-content; padding:5px 11px; color:#18743a; background:#eaf7ef; border:1px solid #d4eedc; border-radius:6px; font-size:10.5px; font-weight:650; }
.account-chip-row span:nth-child(2){ color:#245e9b; background:#edf5ff; border-color:#d3e5fb; }
.account-chip-row span:nth-child(3){ color:#7040a7; background:#f4ecff; border-color:#e5d7f7; }
.account-wizard-footer { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 24px; }
.account-cancel,.account-draft,.account-next { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:44px; padding:10px 20px; border-radius:8px; font-size:12px; font-weight:650; cursor:pointer; }
.account-cancel,.account-draft { color:#1b2731; background:#fff; border:1px solid #dce4e0; }
.account-next { min-width:130px; color:#fff; background:linear-gradient(180deg,#078c3a,#057b32); border:1px solid #057730; box-shadow:0 8px 20px rgba(7,132,50,.16); }
.account-final-actions { display:flex; align-items:center; gap:14px; }
.account-final-actions form { margin:0; }
.account-input-icon { position:relative; }
.account-input-icon > .ui-icon { position:absolute; left:13px; top:13px; color:#344054; z-index:1; }
.account-input-icon input { padding-left:42px; }
.network-cards { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:20px; }
.network-cards span { display:grid; place-items:center; min-height:52px; padding:10px; background:#fff; border:1px solid #dce6df; border-radius:8px; font-size:14px; font-weight:750; }
.network-cards span:nth-child(1){ color:#178544; border-color:#65aa7f; }
.network-cards span:nth-child(2){ color:#dd2b26; border-color:#e98c88; }
.network-cards span:nth-child(3){ color:#1b9dcc; border-color:#74c0de; }
.carrier-choice-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:4px}.carrier-logo{position:relative;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px;min-height:46px!important;padding:9px 8px!important;border-radius:8px!important;background:#fff!important;font-size:11px!important;font-weight:850!important;letter-spacing:0!important;overflow:hidden}.carrier-logo i{position:relative;display:inline-grid;width:22px;height:22px;flex:0 0 22px;border-radius:7px}.carrier-logo b{position:relative;z-index:1;white-space:nowrap}.carrier-logo small{display:block;margin-top:2px;font-size:9px;font-weight:750;opacity:.72}.carrier-logo.safaricom{color:#128037!important;border-color:#58b36f!important;background:linear-gradient(180deg,#f7fff9,#eefaf0)!important}.carrier-logo.safaricom i{background:#18a148}.carrier-logo.safaricom i:before{content:"";position:absolute;left:4px;top:4px;width:14px;height:14px;border:3px solid #fff;border-right-color:transparent;border-radius:50%;transform:rotate(-22deg)}.carrier-logo.safaricom i:after{content:"";position:absolute;right:-4px;bottom:1px;width:9px;height:9px;background:#d51f2a;border-radius:50%}.carrier-logo.airtel{color:#d51f2a!important;border-color:#ee9a9a!important;background:linear-gradient(180deg,#fff8f8,#fff0f0)!important}.carrier-logo.airtel i{background:#e11f2f;border-radius:50% 50% 50% 16%}.carrier-logo.airtel i:before{content:"";position:absolute;left:6px;top:4px;width:9px;height:14px;border-radius:50%;background:#fff;transform:rotate(28deg)}.carrier-logo.telkom{color:#0f8fc5!important;border-color:#7cc9e3!important;background:linear-gradient(180deg,#f6fcff,#edf8fd)!important}.carrier-logo.telkom i{background:#16a7d8;border-radius:50%}.carrier-logo.telkom i:before{content:"";position:absolute;left:5px;top:5px;width:12px;height:12px;border:3px solid #fff;border-left-color:transparent;border-radius:50%;transform:rotate(18deg)}.carrier-network-cards{grid-template-columns:1fr!important}.carrier-network-cards .carrier-logo{justify-content:flex-start!important;min-height:58px!important;padding:12px!important}.carrier-network-cards .carrier-logo i{width:28px;height:28px;flex-basis:28px}.carrier-network-cards .carrier-logo.safaricom i:before{left:5px;top:5px;width:18px;height:18px}.carrier-network-cards .carrier-logo.safaricom i:after{right:-5px;bottom:2px;width:11px;height:11px}
.account-verification-panel,.mpesa-verification-details { display:grid; grid-template-columns:minmax(0,1fr) 200px; gap:25px; align-items:center; margin-top:18px; padding:22px; background:#fbfcfc; border:1px solid #e7ece9; border-radius:10px; }
.account-verification-icon { display:grid; place-items:center; width:150px; height:150px; margin:auto; color:#0a8c3c; background:radial-gradient(circle,#e4f6ea 0 56%,#f3fbf6 57%); border-radius:50%; }
.account-review-list { display:flex; flex-direction:column; gap:0; }
.account-review-list > div { display:grid; grid-template-columns:minmax(110px,1fr) minmax(130px,1.3fr); gap:18px; align-items:start; padding:8px 0; color:#536071; font-size:11.5px; }
.account-review-list b { color:#17202c; font-weight:600; overflow-wrap:anywhere; }
.success-text { color:#078a39!important; }
.account-document-upload { display:flex; align-items:center; margin-top:20px; padding:18px; cursor:pointer; background:#fff; border:1px dashed #b8c9bf; border-radius:10px; }
.account-document-upload > span { display:flex; align-items:center; gap:13px; flex-wrap:wrap; }
.account-document-upload b { display:block; color:#17202c; }
.account-document-upload small { flex-basis:100%; margin-left:39px; color:#667085; }
.account-document-upload input { margin-left:auto; max-width:230px; }
.account-process-list { display:flex; flex-direction:column; gap:20px; margin-top:22px; }
.account-process-list > div { display:flex; align-items:flex-start; gap:13px; position:relative; }
.account-process-list > div > span { display:grid; place-items:center; width:25px; height:25px; flex:0 0 25px; color:#fff; background:#078a39; border-radius:50%; font-size:11px; font-weight:700; }
.account-process-list p { margin:0; }
.account-process-list b,.account-process-list small { display:block; }
.account-process-list b { color:#17202c; font-size:12px; }
.account-process-list small { margin-top:6px; color:#667085; font-size:10.5px; line-height:1.55; }
.account-review-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.account-review-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.account-review-grid article { min-width:0; padding:18px; border:1px solid #e4eae6; border-radius:10px; }
.account-review-grid h3 { display:flex; align-items:center; gap:10px; margin:0 0 12px; color:#18231e; font-size:13px; }
.account-review-grid h3 > span { display:grid; place-items:center; width:30px; height:30px; color:#078a39; background:#e9f6ed; border-radius:50%; }
.account-review-grid h3 > span.violet { color:#7a42d0; background:#f1eaff; }
.account-review-grid h3 > span.blue { color:#2c76cf; background:#e9f2ff; }
.account-review-grid h3 > span.amber { color:#d98b13; background:#fff2d9; }
.account-review-grid h3 a { margin-left:auto; padding:5px 9px; color:#078a39; background:#fff; border:1px solid #cfe3d5; border-radius:6px; font-size:10px; }
.account-file-card { display:flex; align-items:center; gap:12px; padding:14px; color:#107536; background:#f4fbf6; border:1px solid #c9e4d2; border-radius:8px; }
.account-file-card b,.account-file-card small { display:block; }
.account-file-card small,.account-empty-copy { margin-top:4px; color:#667085; font-size:10.5px; }
.account-summary-person { display:flex; align-items:center; gap:14px; margin:20px 0 12px; }
.account-summary-person > span { display:grid; place-items:center; width:50px; height:50px; color:#078a39; background:#e9f6ed; border-radius:50%; }
.account-summary-person b,.account-summary-person small { display:block; }
.account-summary-person b { margin-bottom:7px; color:#17202c; font-size:14px; }
.account-next-card { background:#f7fcf8; border-color:#cfe4d5; }
.mpesa-phone-verified { position:relative; display:grid; place-items:center; width:150px; height:150px; margin:auto; color:#078a39; background:#edf9f1; border-radius:50%; }
.mpesa-phone-verified i { position:absolute; right:20px; bottom:28px; display:grid; place-items:center; width:38px; height:38px; color:#fff; background:#078a39; border:4px solid #edf9f1; border-radius:50%; }
.otp-section { margin-top:24px; }
.otp-section h3 { margin:0; font-size:14px; }
.otp-section p { color:#667085; font-size:11px; }
.account-otp-inputs { display:flex; gap:14px; margin:18px 0 14px; }
.account-otp-inputs input { width:58px; height:52px; padding:0; text-align:center; font-size:23px; font-weight:700; border:1px solid #dbe4df; border-radius:8px; outline:none; }
.account-otp-inputs input:focus { border-color:#078a39; box-shadow:0 0 0 3px rgba(7,138,57,.09); }
.otp-section > small { display:flex; align-items:center; gap:7px; color:#536071; }
.account-wizard-inline-actions { display:flex; align-items:center; justify-content:space-between; margin-top:26px; }
.otp-resend-form { display:flex; align-items:center; gap:9px; margin-top:14px; color:#667085; font-size:11px; }
.otp-resend-form button { padding:0; color:#078a39; background:none; border:0; text-decoration:underline; cursor:pointer; }
.account-success-page { display:grid; place-items:center; min-height:calc(100vh - 160px); padding:35px 20px; background:#fff; border:1px solid #e7ece9; border-radius:14px; }
.account-success-card { width:min(690px,100%); text-align:center; }
.account-success-icon { display:grid; place-items:center; width:150px; height:150px; margin:0 auto 22px; color:#078a39; background:radial-gradient(circle,#fff 0 39%,#dff3e5 40% 62%,#f3fbf5 63%); border-radius:50%; }
.account-success-icon.solid { width:138px; height:138px; color:#fff; background:radial-gradient(circle,#078a39 0 48%,#e2f4e7 49% 64%,#f6fcf8 65%); }
.account-success-card h1 { margin:0; color:#101828; font-size:26px; }
.account-success-card > p { margin:10px 0 24px; color:#667085; }
.account-success-details { width:min(500px,100%); margin:0 auto; padding:8px 22px; text-align:left; border:1px solid #e5eae7; border-radius:10px; }
.account-success-details > div { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:12px 0; border-bottom:1px solid #eef2ef; font-size:12px; }
.account-success-details > div:last-child { border-bottom:0; }
.account-success-details span { display:flex; align-items:center; gap:10px; color:#35424c; }
.account-success-details span .ui-icon { color:#078a39; }
.account-success-details b { color:#17202c; font-weight:600; }
.account-success-notice { display:flex; align-items:center; gap:16px; width:min(560px,100%); margin:22px auto; padding:16px 20px; text-align:left; color:#176f36; background:#f3fbf5; border:1px solid #cce4d3; border-radius:9px; font-size:11px; line-height:1.6; }
.account-success-actions { display:flex; justify-content:center; gap:14px; margin-top:26px; }

@media (max-width:1200px){
  .account-wizard-stepper{padding:22px 28px;gap:12px}.account-wizard-step{min-width:150px}.account-field-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  .account-wizard-layout{grid-template-columns:1fr}.account-wizard-side{grid-row:auto}.account-wizard-footer{padding:0}.account-wizard-stepper{grid-template-columns:1fr;gap:10px}.account-wizard-line{display:none}.account-wizard-step{min-width:0}.account-field-grid.three,.account-field-grid.two,.account-review-grid,.account-review-grid.two{grid-template-columns:1fr}
}
@media (max-width:640px){
  .account-wizard-card,.account-side-card{padding:17px}.account-wizard-stepper{padding:16px}.account-wizard-number{width:36px;height:36px;flex-basis:36px}.account-wizard-footer,.account-wizard-inline-actions,.account-final-actions,.account-success-actions{flex-direction:column;align-items:stretch}.account-cancel,.account-draft,.account-next{width:100%}.account-verification-panel,.mpesa-verification-details{grid-template-columns:1fr}.account-otp-inputs{gap:7px}.account-otp-inputs input{width:calc((100vw - 92px)/6);max-width:48px;height:48px}.account-success-details>div{grid-template-columns:1fr;gap:5px}.account-success-card h1{font-size:21px}
}

/* Mobile sidebar footer: keep administrator and logout at the true bottom edge */
@media (max-width: 1040px) {
    .farmer-reference-sidebar {
        display: flex;
        flex-direction: column;
        height: 100vh;
        height: 100dvh;
        max-height: 100dvh;
        padding-bottom: 0;
        overflow: hidden;
    }
    .farmer-reference-sidebar .farmer-brand {
        flex: 0 0 auto;
    }
    .farmer-reference-sidebar .farmer-flat-nav {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding-bottom: 18px;
        scrollbar-width: thin;
    }
    .farmer-reference-sidebar .farmer-sidebar-user {
        position: relative;
        inset: auto;
        left: auto;
        bottom: auto;
        flex: 0 0 auto;
        width: 100%;
        margin-top: auto;
        padding-bottom: max(12px, env(safe-area-inset-bottom));
        box-shadow: 0 -8px 22px rgba(0, 42, 31, .18);
    }
}

/* Final mobile sidebar anchoring: footer remains on the physical bottom edge. */
@media (max-width: 1040px) {
    .farmer-reference-sidebar {
        position: fixed !important;
        top: 0 !important;
        right: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0 !important;
        overflow: hidden !important;
    }
    .farmer-reference-sidebar .farmer-brand {
        flex: 0 0 92px !important;
        padding-inline: 18px !important;
    }
    .farmer-reference-sidebar .farmer-flat-nav {
        position: absolute !important;
        top: 92px !important;
        right: 0 !important;
        bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
        left: 0 !important;
        display: block !important;
        padding: 0 18px 18px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .farmer-reference-sidebar .farmer-sidebar-user {
        position: absolute !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        min-height: 78px !important;
        margin: 0 !important;
        padding: 10px 18px max(10px, env(safe-area-inset-bottom, 0px)) !important;
        transform: none !important;
        z-index: 5 !important;
    }
}

/* Tea Deliveries Analytics — independent reference-matched page */
.tea-analytics-page{display:flex;flex-direction:column;gap:16px;color:#1f2933}.analytics-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.analytics-kpi-card,.analytics-card{background:#fff;border:1px solid #e9eeeb;border-radius:8px;box-shadow:0 2px 10px rgba(18,54,36,.035)}.analytics-kpi-card{min-height:98px;padding:18px;display:flex;align-items:center;gap:13px}.analytics-kpi-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#ecf8f0;color:#169447;flex:0 0 auto}.analytics-kpi-card div{min-width:0;display:flex;flex-direction:column}.analytics-kpi-card small{font-size:11px;font-weight:700;color:#59636d;text-transform:none}.analytics-kpi-card strong{font-size:20px;line-height:1.35;color:#18212b;white-space:nowrap}.analytics-kpi-card em{font-size:10px;color:#169447;font-style:normal;font-weight:600}.analytics-card{padding:16px}.analytics-card h2{font-size:15px;margin:0 0 14px}.analytics-card>a{display:block;margin-top:12px;padding-top:10px;border-top:1px solid #edf1ee;text-align:center;color:#168946;font-size:11px;font-weight:700}.analytics-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.analytics-card-head h2{margin:0}.analytics-periods{display:flex;gap:0}.analytics-periods button{height:34px;padding:0 16px;border:1px solid #e3e8e5;background:#fff;color:#4b5560;font-size:11px}.analytics-periods button:first-child{border-radius:6px 0 0 6px}.analytics-periods button:last-child{border-radius:0 6px 6px 0;margin-left:8px}.analytics-periods button.active{color:#168946;border-color:#168946;background:#f4fbf6}.analytics-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:12px}.analytics-mini-grid article{border:1px solid #edf1ee;border-radius:7px;padding:14px}.analytics-mini-grid small{display:block;font-size:10px;font-weight:700;color:#66717b}.analytics-mini-grid strong{display:block;font-size:16px;margin-top:5px}.analytics-mini-grid svg{width:100%;height:36px;margin-top:6px}.analytics-mini-grid polyline{fill:none;stroke:#42af6c;stroke-width:2}.analytics-combo-chart{position:relative;border-top:1px solid #eef2ef;padding-top:24px}.combo-label{position:absolute;top:4px;font-size:10px;color:#68737d}.combo-label.left{left:0}.combo-label.right{right:0}.combo-plot{height:230px;position:relative;margin:0 18px;border-left:1px solid #edf1ee;border-bottom:1px solid #edf1ee;background:repeating-linear-gradient(to bottom,#fff 0,#fff 44px,#eef2ef 45px)}.combo-month{position:absolute;left:var(--x);bottom:0;width:16.66%;height:100%;transform:translateX(-50%);text-align:center}.combo-month i{position:absolute;bottom:27px;left:50%;transform:translateX(-50%);width:34px;height:var(--bar);max-height:78%;background:linear-gradient(#62c780,#43ae68);border-radius:7px 7px 0 0}.combo-month small{position:absolute;bottom:2px;left:0;width:100%;font-size:9px;color:#68737d;line-height:1.15}.combo-plot svg{position:absolute;inset:4px 0 25px;width:100%;height:calc(100% - 29px);overflow:visible}.combo-plot polyline{fill:none;stroke:#202b38;stroke-width:1.4;vector-effect:non-scaling-stroke}.combo-legend{display:flex;justify-content:center;gap:24px;margin-top:10px;font-size:10px}.combo-legend i{display:inline-block;width:10px;height:5px;margin-right:5px}.combo-legend .weight{background:#45b76c}.combo-legend .amount{background:#202b38;border-radius:5px}.analytics-two-column{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grade-content{display:grid;grid-template-columns:170px 1fr;gap:18px;align-items:center}.grade-donut{width:138px;height:138px;border-radius:50%;margin:auto;background:conic-gradient(#078c3e 0 38.8%,#61cd7e 38.8% 69%,#f8bc4c 69% 84.1%,#5a68d9 84.1% 93.9%,#b9c2c8 93.9%);position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}.grade-donut:before{content:"";position:absolute;inset:28px;background:#fff;border-radius:50%}.grade-donut b,.grade-donut small{position:relative;z-index:1}.grade-donut b{font-size:14px}.grade-donut small{font-size:10px}.grade-legend{display:flex;flex-direction:column;gap:10px}.grade-legend div{display:flex;justify-content:space-between;gap:10px;font-size:10px}.grade-legend span{font-weight:700}.grade-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#078c3e;margin-right:7px}.grade-legend div:nth-child(2) i{background:#61cd7e}.grade-legend div:nth-child(3) i{background:#f8bc4c}.grade-legend div:nth-child(4) i{background:#5a68d9}.grade-legend div:nth-child(5) i{background:#b9c2c8}.analytics-table-wrap{overflow:auto}.analytics-card table{width:100%;border-collapse:collapse;font-size:10px}.analytics-card th,.analytics-card td{padding:9px 10px;text-align:left;border-bottom:1px solid #edf1ee;white-space:nowrap}.analytics-card th{background:#fafcfb;color:#59636d;font-weight:700}.heatmap{display:grid;grid-template-columns:42px repeat(7,1fr);gap:3px;align-items:center}.heatmap b{font-size:9px;color:#68737d;font-weight:600;text-align:center}.heatmap i{height:27px;background:#078c3e;border-radius:1px}.heat-key{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:9px;font-size:9px}.heat-key i{width:180px;height:7px;background:linear-gradient(90deg,#e9f6ed,#078c3e);border-radius:2px}.upload-performance{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.upload-performance article{border:1px solid #edf1ee;border-radius:6px;padding:16px;display:grid;grid-template-columns:25px 1fr;gap:2px 8px}.upload-performance span{grid-row:1/3;color:#169447}.upload-performance span.fail{color:#e45454}.upload-performance small{font-size:9px;color:#68737d}.upload-performance strong{font-size:15px}.analytics-actions-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.analytics-actions-grid a{min-height:112px;border:1px solid #e9eeeb;border-radius:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#26323c;text-align:center;padding:12px}.analytics-actions-grid span{color:#1f2933}.analytics-actions-grid b{font-size:10px}.analytics-tip{background:#effaf3;border:1px solid #e3f4e8;border-radius:5px;padding:13px 16px;color:#30734a;font-size:10px;display:flex;gap:9px}
@media(max-width:1100px){.analytics-kpis{grid-template-columns:repeat(2,1fr)}.analytics-two-column{grid-template-columns:1fr}.analytics-kpi-card:last-child{grid-column:span 2}}
@media(max-width:700px){.tea-analytics-page{gap:12px}.analytics-kpis{grid-template-columns:1fr 1fr;gap:8px}.analytics-kpi-card{padding:12px;min-height:84px}.analytics-kpi-card strong{font-size:16px}.analytics-kpi-card:last-child{grid-column:1/-1}.analytics-card-head{align-items:flex-start;flex-direction:column}.analytics-periods{width:100%;overflow:auto}.analytics-periods button{padding:0 12px;flex:1}.analytics-mini-grid{grid-template-columns:1fr}.combo-plot{height:190px;margin:0}.combo-month i{width:20px}.analytics-two-column{gap:12px}.grade-content{grid-template-columns:1fr}.analytics-actions-grid{grid-template-columns:1fr}.upload-performance{grid-template-columns:1fr}.heatmap{min-width:520px}.analytics-card:has(.heatmap){overflow:auto}.analytics-card{padding:13px}}

/* Bongapay exact advance workspace */
.advance-design-page{display:grid;gap:18px}.advance-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.advance-kpis article{background:#fff;border:1px solid #edf1ee;border-radius:5px;padding:18px 14px;display:flex;gap:11px;min-height:96px;box-shadow:0 2px 12px rgba(24,55,38,.035)}.advance-kpis article>span{width:38px;height:38px;border-radius:50%;background:#eaf8ef;color:#14924e;display:grid;place-items:center;flex:0 0 auto}.advance-kpis article>span.violet{background:#f0eaff;color:#7356d8}.advance-kpis small{display:block;color:#525f57;font-size:11px}.advance-kpis strong{display:block;font-size:18px;margin:4px 0 6px;color:#17241c}.advance-kpis a,.advance-kpis em{font-size:10px;color:#198c4e;font-style:normal}.advance-main-card{background:#fff;border:1px solid #e8eeea;border-radius:5px}.advance-tabs{display:flex;border-bottom:1px solid #edf1ee;padding:0 18px}.advance-tabs a{padding:17px 14px;color:#526158;font-weight:700;font-size:13px}.advance-tabs a.active{color:#16874b;border-bottom:2px solid #16874b}.advance-farmer-select{padding:20px 18px 0;width:34%}.advance-farmer-select label{display:grid;gap:12px}.advance-farmer-select b,.advance-form h3{font-size:14px;color:#26342b}.advance-farmer-select i,.advance-form h3 i{font-style:normal;background:#dff4e6;color:#16874b;width:20px;height:20px;border-radius:50%;display:inline-grid;place-items:center;margin-right:8px}.advance-farmer-select select,.advance-fields input,.advance-fields textarea{width:100%;border:1px solid #dfe6e1;border-radius:4px;padding:12px;background:#fff}.advance-top-grid{display:grid;grid-template-columns:34% 66%;padding:14px 18px 20px}.advance-farmer-card{border:1px solid #e7ece8;border-right:0;padding:20px;display:flex;gap:14px;min-height:290px}.advance-avatar{width:54px;height:54px;border-radius:50%;background:#daf3e2;color:#158c4b;display:grid;place-items:center}.advance-farmer-card h3{margin:4px 0 14px}.advance-farmer-card small,.advance-farmer-card b{display:block}.advance-farmer-card small{color:#7b8780;margin-top:10px;font-size:11px}.advance-limit-card{border:1px solid #e7ece8;padding:18px}.advance-limit-card header{display:flex;justify-content:space-between;align-items:center}.advance-limit-card header small{color:#6c7971}.limit-highlight{border:1px solid #edf1ee;padding:14px;margin:12px 0}.limit-highlight small{display:block;color:#667269}.limit-highlight strong{display:block;font-size:20px;margin-top:7px}.limit-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.limit-metrics small{display:block;color:#7a857f;font-size:10px}.limit-metrics b{font-size:12px}.advance-line-chart{margin-top:16px;border:1px solid #edf1ee;padding:12px}.advance-line-chart h4{font-size:11px;margin:0 0 8px}.line-points{height:120px;display:flex;align-items:flex-end;gap:2px;border-bottom:1px solid #e6ebe7;background:linear-gradient(#fff,#f4fbf6)}.line-points>div{height:100%;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative}.line-points i{width:10px;height:10px;border:2px solid #209357;background:#fff;border-radius:50%;margin-bottom:calc(var(--h) - 10px)}.line-points b{font-size:9px;color:#536158;position:absolute;bottom:var(--h)}.line-points small{font-size:9px;color:#758179;position:absolute;bottom:-16px}.advance-limit-card>p{font-size:10px;color:#6d7871;margin:22px 0 0}.advance-form{border-top:1px solid #edf1ee;padding:20px 18px}.advance-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;margin:14px 0 22px}.advance-fields label{display:grid;gap:7px}.advance-fields span{font-size:11px;font-weight:700}.advance-fields small{font-size:9px;color:#6c7870}.advance-fields textarea{height:70px;resize:vertical}.advance-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.advance-info-grid>section,.active-advances{border:1px solid #e7ece8;padding:14px}.advance-info-grid table,.active-advances table{font-size:10px}.total-row td{color:#148b4d;font-weight:800;background:#f4fbf6}.auto-deduct-card h3{display:flex;align-items:center}.auto-deduct-card h3 em{margin-left:auto;font-size:9px;background:#e6f7ec;color:#16874b;padding:4px 8px;border-radius:10px;font-style:normal}.auto-deduct-card>p{font-size:10px;color:#607067}.auto-deduct-card>div{display:flex;justify-content:space-between;border-bottom:1px solid #eef2ef;padding:10px 0;font-size:10px}.auto-deduct-card aside,.advance-note{background:#effaf3;color:#557061;padding:13px;font-size:10px;margin-top:14px}.active-advances{margin-top:18px}.advance-form footer{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}.advance-form footer .btn{min-width:130px}@media(max-width:1000px){.advance-kpis{grid-template-columns:repeat(2,1fr)}.advance-top-grid,.advance-info-grid{grid-template-columns:1fr}.advance-farmer-select{width:100%}.advance-farmer-card{border-right:1px solid #e7ece8}.advance-top-grid{gap:12px}.limit-metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.advance-kpis{grid-template-columns:1fr}.advance-fields{grid-template-columns:1fr}.advance-main-card{border-left:0;border-right:0}.advance-top-grid,.advance-form{padding-left:12px;padding-right:12px}.advance-kpis strong{font-size:16px}.advance-info-grid>section,.active-advances{overflow:hidden}.analytics-table-wrap{overflow:auto}.advance-tabs{overflow:auto}.advance-form footer{position:sticky;bottom:0;background:#fff;padding:10px 0;z-index:3}}
/* Advance create section 3/4 polish */
.advance-info-grid{grid-template-columns:minmax(0,1.45fr) minmax(320px,.9fr);align-items:stretch}
.advance-info-grid>section,.active-advances{border-radius:6px;background:#fff;box-shadow:0 2px 12px rgba(20,52,35,.025)}
.advance-delivery-summary-card{display:flex;flex-direction:column;gap:12px;min-height:252px}
.advance-summary-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.advance-summary-strip>div{border:1px solid #e8f0eb;background:#fbfdfb;border-radius:5px;padding:10px 11px;min-height:58px}
.advance-summary-strip small{display:block;color:#66736b;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.advance-summary-strip b{display:block;color:#17241c;font-size:12px;margin-top:5px;white-space:nowrap}
.advance-delivery-table th,.advance-delivery-table td{white-space:nowrap}
.auto-deduct-card{display:flex;flex-direction:column;min-height:252px}
.auto-deduct-card>p{line-height:1.55;margin:8px 0 10px}
.auto-deduct-card>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(148px,auto);gap:14px;align-items:center}
.auto-deduct-card>div span{color:#59675f;font-weight:700}
.auto-deduct-card>div b{text-align:right;color:#17241c;line-height:1.35}
.auto-deduct-card .deduction-highlight{background:#f4fbf6;border:1px solid #dff1e6;border-radius:5px;padding:12px;margin-top:2px}
.auto-deduct-card .deduction-highlight b{color:#138447;font-size:13px}
.auto-deduct-card aside{margin-top:auto;border-left:3px solid #22a35b;line-height:1.5}
@media(max-width:1000px){.advance-info-grid{grid-template-columns:1fr}.advance-summary-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.auto-deduct-card{min-height:auto}}
@media(max-width:560px){.advance-summary-strip{grid-template-columns:1fr}.auto-deduct-card>div{grid-template-columns:1fr}.auto-deduct-card>div b{text-align:left}.advance-summary-strip b{white-space:normal}}

/* Live analytics controls */
.analytics-periods a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border:1px solid #e5e7eb;background:#fff;color:#667085;text-decoration:none;font-weight:600}
.analytics-periods a:first-child{border-radius:8px 0 0 8px}.analytics-periods a+a{border-left:0}.analytics-periods a.active{border-color:#159447;color:#138447;background:#f5fbf7;box-shadow:inset 0 0 0 1px #159447}.analytics-periods a.active+a{border-left-color:#159447}
.analytics-kpi-card em.negative{color:#dc2626}.analytics-data-note{margin:12px 0;color:#667085;font-size:13px;line-height:1.5}.analytics-card-head>div:first-child small{display:block;margin-top:4px;color:#8a94a3;font-size:12px}
@media(max-width:760px){.analytics-periods{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr)) 52px;width:100%}.analytics-periods a{padding:0 6px;min-width:0;font-size:14px}.analytics-periods button{min-width:0!important}.analytics-card-head{align-items:flex-start!important;gap:14px}.analytics-card-head>div:first-child{width:100%}}

/* Advance History — reference matched, live-data page */
.advance-history-page{display:grid;gap:16px}.advance-history-tabs{display:flex;width:max-content;background:#fff;border:1px solid #e7ece8;border-radius:6px;overflow:hidden}.advance-history-tabs a{min-width:190px;padding:15px 24px;display:flex;gap:9px;justify-content:center;align-items:center;color:#425148;font-weight:700;border-right:1px solid #e7ece8}.advance-history-tabs a.active{color:#168b4c;background:#fbfefc}.advance-history-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.advance-history-kpis article{background:#fff;border:1px solid #e8ede9;border-radius:6px;padding:26px 20px;display:flex;gap:16px;align-items:center;box-shadow:0 2px 10px rgba(20,52,35,.03)}.advance-history-kpis article>span{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#e9f8ef;color:#168d4d}.advance-history-kpis article>span.blue{background:#eaf3ff;color:#3578d4}.advance-history-kpis article>span.amber{background:#fff5df;color:#d39316}.advance-history-kpis article>span.violet{background:#f3edff;color:#7c52ca}.advance-history-kpis small,.advance-history-kpis em{display:block;color:#68756d;font-size:11px}.advance-history-kpis strong{display:block;margin:5px 0;font-size:17px}.advance-history-kpis em{font-style:normal;color:#3d66a1}.advance-history-card,.advance-history-bottom>section{background:#fff;border:1px solid #e6ece8;border-radius:6px}.advance-history-filters{padding:22px 18px 16px;display:grid;grid-template-columns:1.7fr .85fr 1.25fr .95fr;gap:14px;align-items:end}.advance-history-filters label{display:grid;gap:8px}.advance-history-filters label>span{font-size:11px;font-weight:700}.advance-history-filters input,.advance-history-filters select{height:40px;border:1px solid #dfe6e1;border-radius:4px;background:#fff;padding:0 11px;min-width:0}.history-search{position:relative}.history-search svg{position:absolute;right:12px;top:12px}.history-search input{width:100%;padding-right:36px}.date-range>div{display:flex;align-items:center;gap:5px}.date-range input{width:50%}.history-filter-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px}.advance-history-table{width:100%;border-collapse:collapse;font-size:11px}.advance-history-table th{padding:14px 12px;text-align:left;background:#f8faf8;color:#536159;border-top:1px solid #edf1ee;border-bottom:1px solid #e8ede9;white-space:nowrap}.advance-history-table td{padding:15px 12px;border-bottom:1px solid #edf1ee;vertical-align:middle}.advance-history-table td small,.advance-history-table td a small{display:block;color:#7a867f;margin-top:4px}.history-status{display:inline-flex;padding:5px 9px;border-radius:4px;font-size:10px;background:#fff3d8;color:#9b6a06}.history-status.supervisor_approved,.history-status.manager_approved,.history-status.finance_approved{background:#eaf8ef;color:#15864a}.history-status.disbursed{background:#e9f4ff;color:#2876bd}.history-status.repaid{background:#f1eafa;color:#7146a9}.history-status.rejected{background:#fdecec;color:#bc3535}.history-actions{position:relative}.history-actions summary{list-style:none;border:1px solid #e1e7e3;border-radius:4px;width:34px;height:32px;display:grid;place-items:center;cursor:pointer}.history-actions div{position:absolute;right:0;top:36px;z-index:10;width:150px;background:#fff;border:1px solid #dfe6e1;box-shadow:0 8px 25px rgba(0,0,0,.12);padding:5px}.history-actions a{display:block;padding:9px;font-size:11px}.history-pagination{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;font-size:11px}.history-pagination nav{display:flex;gap:5px}.history-pagination nav a{width:31px;height:31px;border:1px solid #e0e6e2;display:grid;place-items:center;border-radius:4px}.history-pagination nav a.active{background:#148a4a;color:#fff;border-color:#148a4a}.history-pagination>b{border:1px solid #e1e6e3;padding:8px 11px;border-radius:4px}.advance-history-bottom{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}.advance-history-bottom>section{padding:20px}.advance-history-bottom h3{font-size:14px;margin:0 0 15px}.advance-history-bottom p{display:grid;grid-template-columns:12px 130px 1fr;gap:8px;align-items:center;font-size:11px;color:#66736b}.advance-history-bottom p i{width:6px;height:6px;background:#f0b532;border-radius:50%}.advance-history-bottom p i.approved{background:#20a05a}.advance-history-bottom p i.disbursed{background:#3c8fd3}.advance-history-bottom p i.payment{background:#df9731}.advance-history-bottom p i.recovered{background:#8256bd}.advance-history-bottom>section:last-child p{display:block}.advance-history-footer{display:flex;justify-content:flex-end;gap:12px}@media(max-width:1050px){.advance-history-kpis{grid-template-columns:repeat(2,1fr)}.advance-history-filters{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.advance-history-tabs{width:100%}.advance-history-tabs a{min-width:50%;padding:13px 8px}.advance-history-kpis{grid-template-columns:1fr 1fr;gap:9px}.advance-history-kpis article{padding:16px 11px;gap:9px}.advance-history-kpis article>span{width:40px;height:40px}.advance-history-kpis strong{font-size:14px}.advance-history-filters{grid-template-columns:1fr;padding:14px}.history-filter-actions{grid-column:auto;display:grid;grid-template-columns:1fr 1fr}.history-filter-actions button:last-child{grid-column:1/-1}.advance-history-bottom{grid-template-columns:1fr}.advance-history-bottom p{grid-template-columns:10px 105px 1fr}.advance-history-footer{display:grid;grid-template-columns:1fr 1fr}.history-pagination{gap:10px;flex-wrap:wrap}.history-pagination>b{display:none}}

/* Tea Deliveries — screenshot-matched production screens */
.tea-delivery-page{display:grid;gap:14px}.tea-tabs{display:flex;gap:26px;align-items:center;padding:0 10px;border-bottom:1px solid #e8edea;background:#fff;overflow:auto}.tea-tabs a{position:relative;padding:15px 2px;color:#536159;font-size:12px;font-weight:700;white-space:nowrap}.tea-tabs a.active{color:#087d3c}.tea-tabs a.active:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#0a8c45}.tea-alert{padding:13px 16px;border:1px solid #e7ece8;border-radius:7px;font-size:11px}.tea-alert.warning{background:#fff9e9;border-color:#f3e4b7;color:#6f5b22}.tea-alert.info{background:#edf7ff;border-color:#cfe6f7;color:#315f7d}.tea-alert a{font-weight:800;text-decoration:underline}.tea-record-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(310px,.88fr) minmax(250px,.72fr);gap:12px;align-items:start}.tea-card{background:#fff;border:1px solid #e6ece8;border-radius:7px;box-shadow:0 2px 9px rgba(24,57,38,.03);overflow:hidden}.tea-card>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 17px;border-bottom:1px solid #edf1ee}.tea-card h3{margin:0;font-size:13px}.tea-card header b{font-size:12px}.tea-card header b i{display:inline-grid;place-items:center;width:20px;height:20px;margin-right:7px;color:#fff;background:#15934e;border-radius:50%;font-size:10px;font-style:normal}.tea-single form,.tea-upload form{padding:16px}.tea-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 18px}.tea-form-grid label,.tea-notes{display:grid;gap:7px}.tea-form-grid span,.tea-notes span{font-size:10px;font-weight:800}.tea-form-grid input,.tea-form-grid select,.tea-notes textarea{width:100%;border:1px solid #dde5e0;border-radius:5px;background:#fff;padding:10px;font-size:11px}.tea-form-grid small{color:#7d8981;font-size:9px}.tea-auto-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:18px 0}.tea-auto-grid article{min-height:80px;padding:12px;border:1px solid #e7ece9;border-radius:6px;background:#fbfdfb}.tea-auto-grid span,.tea-auto-grid small{display:block;color:#738078;font-size:8.5px}.tea-auto-grid b{display:block;margin:10px 0 4px;font-size:11px}.tea-notes textarea{min-height:68px;resize:vertical}.tea-single footer{display:flex;justify-content:flex-end;gap:9px;margin-top:14px}.tea-drop{min-height:205px;border:1px dashed #cad8d0;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;background:#fcfefd;cursor:pointer}.tea-drop input{position:absolute;opacity:0;pointer-events:none}.tea-drop strong{font-size:11px}.tea-drop span{color:#87928b;font-size:10px}.tea-drop em{padding:9px 14px;border:1px solid #cfe0d6;border-radius:5px;color:#0b7f3d;background:#fff;font-size:10px;font-style:normal;font-weight:800}.tea-template{display:inline-block;margin:14px 0;color:#3173b7;font-size:10px;font-weight:700}.tea-requirements{padding:8px 0 16px;color:#65726a;font-size:9px;line-height:1.7}.tea-requirements p{margin:2px 0}.tea-side{display:grid;gap:12px}.tea-side>.tea-card{padding:16px}.tea-side h3 small{color:#7c8880;font-size:9px;font-weight:500}.tea-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}.tea-mini-grid article{min-height:78px;padding:11px;border:1px solid #e9eeeb;border-radius:6px;background:#fbfdfc}.tea-mini-grid span{display:block;color:#6f7a73;font-size:8px}.tea-mini-grid b{display:block;margin-top:14px;font-size:15px}.tea-summary p,.tea-upload-summary p{display:flex;justify-content:space-between;gap:12px;margin:13px 0;color:#66736b;font-size:10px}.tea-recent header a{color:#0c8241;font-size:10px;font-weight:800}.tea-table-wrap{overflow:auto}.tea-table-wrap table{width:100%;border-collapse:collapse;font-size:9.5px}.tea-table-wrap th{padding:11px 10px;text-align:left;color:#5b6860;background:#fafcfb;border-bottom:1px solid #e7ece9;white-space:nowrap}.tea-table-wrap td{padding:11px 10px;border-bottom:1px solid #edf1ee;white-space:nowrap}.tea-table-wrap td small{display:block;margin-top:4px;color:#88938c}.green{color:#0b8b43!important}.red{color:#d23b3b!important}.tea-preview-kpis,.tea-analytics-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.tea-preview-kpis article,.tea-analytics-kpis article{min-height:94px;padding:16px;background:#fff;border:1px solid #e6ece8;border-radius:6px}.tea-preview-kpis span,.tea-analytics-kpis span{display:block;color:#65726a;font-size:9px;font-weight:700}.tea-preview-kpis b,.tea-analytics-kpis b{display:block;margin:13px 0 6px;font-size:17px}.tea-preview-kpis small,.tea-analytics-kpis small,.tea-analytics-kpis em{color:#748078;font-size:9px;font-style:normal}.tea-preview-kpis .warn{background:#fffaf1;border-color:#f0dfbb}.tea-preview-layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:12px;align-items:start}.tea-preview-table header h3 em{margin-left:10px;padding:5px 9px;border-radius:12px;color:#16884a;background:#e8f7ee;font-size:9px;font-style:normal}.invalid-row{background:#fff0f0}.preview-state{display:inline-flex;padding:4px 8px;border-radius:4px;font-size:9px}.preview-state.valid{color:#0f8240;background:#e8f7ed}.preview-state.error{color:#c83737;background:#fde9e9}.tea-preview-table footer{display:flex;gap:10px;padding:14px 16px;border-top:1px solid #e8edea}.tea-upload-summary{padding:16px}.tea-upload-summary hr{border:0;border-top:1px solid #e8edea;margin:17px 0}.tea-analytics-kpis em{color:#0b8b43;font-weight:700}.tea-analytics-kpis.compact{grid-template-columns:repeat(4,1fr)}.tea-analytics-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.tea-analytics-grid .wide{grid-column:span 2}.tea-analytics-grid>.tea-card{padding:16px}.tea-line-chart{height:210px;display:flex;align-items:flex-end;gap:5px;padding:20px 4px 5px;border-bottom:1px solid #dfe6e2;background:linear-gradient(#fff,#f5fbf7)}.tea-line-chart i{flex:1;min-width:5px;height:var(--h);border-radius:4px 4px 0 0;background:#15934e}.tea-donut{width:160px;height:160px;margin:20px auto;border-radius:50%;background:conic-gradient(#15934e 0 36%,#2d6cdf 36% 61%,#f29c18 61% 83%,#7047a7 83% 100%);display:grid;place-items:center}.tea-donut:before{content:"";grid-area:1/1;width:92px;height:92px;border-radius:50%;background:#fff}.tea-donut b{grid-area:1/1;z-index:1;text-align:center;font-size:16px}.tea-donut small{display:block;font-size:10px}.tea-legend{display:grid;grid-template-columns:1fr auto;gap:8px;font-size:10px}.tea-bar-row p{display:flex;justify-content:space-between;font-size:10px}.tea-bar-row>i{display:block;height:5px;background:#edf2ef;border-radius:8px;overflow:hidden}.tea-bar-row>i em{display:block;height:100%;background:#15934e}.tea-insights{background:#f0faf4}.tea-insights p{font-size:10px;color:#486255}.tea-overview-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.tea-overview-head h2{margin:0;font-size:18px}.tea-overview-head p{margin:4px 0 0;color:#748078;font-size:11px}
@media(max-width:1050px){.tea-record-layout{grid-template-columns:1fr 1fr}.tea-side{grid-column:1/-1;grid-template-columns:1fr 1fr}.tea-auto-grid{grid-template-columns:1fr 1fr}.tea-preview-kpis,.tea-analytics-kpis{grid-template-columns:repeat(3,1fr)}.tea-analytics-grid{grid-template-columns:1fr 1fr}.tea-preview-layout{grid-template-columns:1fr}.tea-upload-summary{order:-1}}
@media(max-width:700px){.main,.farmer-main{padding:10px!important}.page-head,.farmer-page-head{padding:12px 13px!important}.page-head h1,.farmer-page-head h1{font-size:18px!important}.page-head small,.farmer-page-head small{font-size:10px!important}.tea-delivery-page{gap:10px}.tea-tabs{gap:18px;margin:0 -10px;padding:0 12px}.tea-tabs a{padding:13px 0;font-size:10px}.tea-record-layout{grid-template-columns:1fr}.tea-side{grid-column:auto;grid-template-columns:1fr}.tea-form-grid{grid-template-columns:1fr}.tea-auto-grid{grid-template-columns:1fr 1fr}.tea-single form,.tea-upload form{padding:13px}.tea-single footer{display:grid;grid-template-columns:1fr 1fr}.tea-single footer .btn:last-child{grid-column:1/-1}.tea-preview-kpis,.tea-analytics-kpis,.tea-analytics-kpis.compact{grid-template-columns:1fr 1fr;gap:8px}.tea-preview-kpis article,.tea-analytics-kpis article{min-height:78px;padding:12px}.tea-preview-kpis b,.tea-analytics-kpis b{font-size:14px;margin:10px 0 4px}.tea-analytics-grid{grid-template-columns:1fr}.tea-analytics-grid .wide{grid-column:auto}.tea-overview-head{align-items:flex-start;flex-direction:column}.tea-overview-head .btn{width:100%}.tea-card{border-radius:6px}.tea-table-wrap{margin:0 -1px}.tea-table-wrap table{min-width:760px}.tea-preview-table header{align-items:flex-start;flex-direction:column}.tea-preview-table header form,.tea-preview-table header button{width:100%}.tea-preview-table footer{display:grid;grid-template-columns:1fr 1fr}.tea-preview-table footer form,.tea-preview-table footer button{width:100%}.tea-drop{min-height:170px}.tea-line-chart{height:170px}.tea-donut{width:135px;height:135px}.tea-donut:before{width:78px;height:78px}}
@media(max-width:430px){.tea-auto-grid{grid-template-columns:1fr}.tea-preview-kpis,.tea-analytics-kpis,.tea-analytics-kpis.compact{grid-template-columns:1fr 1fr}.tea-mini-grid{grid-template-columns:1fr 1fr}.tea-alert{font-size:9px;padding:11px}.tea-card>header{padding:13px}.btn{min-height:40px}.farmer-stat-grid,.cards,.dashboard-stat-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}.farmer-stat-card,.card{padding:12px!important;min-width:0!important}.farmer-stat-card strong,.card .value{font-size:15px!important}.reference-tabs,.advance-tabs{overflow-x:auto;white-space:nowrap}.panel{border-radius:7px!important}.farmer-inline-form.two-columns,.grid-2,.grid-3,.dashboard-grid-3,.profile-details-columns,.profile-payment-methods-grid{grid-template-columns:1fr!important}.table-wrap,.farmer-table-scroll{overflow-x:auto!important}}

/* 2026-08 automatic mobile-first hardening — every application screen */
@media (max-width: 760px){
  html,body{max-width:100%;overflow-x:hidden;background:#f5f8f6}
  body{font-size:14px;-webkit-text-size-adjust:100%}
  .app-shell,.layout,.main-shell{min-width:0!important;width:100%!important}
  .main,.farmer-main,.content,.page-content{width:100%!important;min-width:0!important;padding:10px!important;margin:0!important}
  .page-head,.farmer-page-head{min-height:auto!important;padding:12px 12px!important;gap:10px!important;align-items:center!important}
  .page-head h1,.farmer-page-head h1{font-size:18px!important;line-height:1.2!important;margin:0!important}
  .page-head small,.farmer-page-head small{display:block;font-size:10px!important;line-height:1.4!important;margin-top:3px!important}
  .page-actions,.panel-head,.section-head{gap:8px!important;flex-wrap:wrap!important}
  .page-actions .btn,.panel-head .btn{min-width:0!important}
  .panel,.card,.farmer-stat-card,.tea-card,.reference-card{min-width:0!important;max-width:100%!important;border-radius:10px!important;box-shadow:0 2px 12px rgba(20,55,37,.045)!important}
  .panel{padding:13px!important}
  .cards,.farmer-stat-grid,.dashboard-stat-grid,.analytics-kpis,.advance-kpis,.advance-history-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .grid-2,.grid-3,.dashboard-grid-3,.analytics-two-column,.profile-details-columns,.profile-payment-methods-grid,.farmer-inline-form.two-columns{grid-template-columns:1fr!important}
  input,select,textarea,button,.btn{font-size:16px!important;max-width:100%;min-height:44px}
  input,select,textarea{width:100%!important;padding:11px 12px!important;border-radius:8px!important}
  textarea{min-height:96px}
  .form-actions,.panel-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;width:100%}
  .form-actions>*:only-child,.form-actions>.primary:last-child:nth-child(odd){grid-column:1/-1}
  .form-actions .btn,.panel-actions .btn{width:100%;justify-content:center}
  .table-wrap,.farmer-table-scroll,.tea-table-wrap,.analytics-table-wrap{display:block!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;border-radius:8px}
  table{font-size:11px!important}
  th,td{padding:11px 10px!important;white-space:nowrap}
  .modal,.modal-card,.dialog,.drawer-panel{max-width:calc(100vw - 20px)!important;width:calc(100vw - 20px)!important;max-height:88vh!important;overflow:auto!important;border-radius:14px!important}
  .reference-tabs,.tea-tabs,.advance-tabs,.advance-history-tabs,.analytics-tabs{width:calc(100% + 20px)!important;margin-left:-10px!important;padding-left:12px!important;padding-right:12px!important;overflow-x:auto!important;overscroll-behavior-x:contain;scrollbar-width:none}
  .reference-tabs::-webkit-scrollbar,.tea-tabs::-webkit-scrollbar,.advance-tabs::-webkit-scrollbar{display:none}
  .sidebar.mobile-open{width:min(88vw,320px)!important}
  .tea-record-layout{display:flex!important;flex-direction:column!important;gap:10px!important}
  .tea-single,.tea-upload,.tea-side,.tea-recent{width:100%!important}
  .tea-side{display:grid!important;grid-template-columns:1fr!important}
  .tea-form-grid{grid-template-columns:1fr!important;gap:12px!important}
  .tea-auto-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:12px 0!important}
  .tea-auto-grid article{min-height:74px!important;padding:10px!important}
  .tea-single form,.tea-upload form{padding:12px!important}
  .tea-single footer{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
  .tea-single footer .btn:last-child{grid-column:1/-1!important}
  .tea-drop{min-height:155px!important;padding:20px 12px!important}
  .tea-preview-kpis,.tea-analytics-kpis,.tea-analytics-kpis.compact{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .tea-preview-layout,.tea-analytics-grid{grid-template-columns:1fr!important}
  .tea-preview-table header,.tea-card>header{align-items:flex-start!important;flex-wrap:wrap!important}
  .tea-preview-table header form,.tea-preview-table header button{width:100%!important}
  .tea-upload-summary{order:-1}
  .tea-alert{line-height:1.5!important}
}
@media (max-width: 430px){
  .cards,.farmer-stat-grid,.dashboard-stat-grid,.analytics-kpis,.advance-kpis,.advance-history-kpis{grid-template-columns:1fr!important}
  .tea-preview-kpis,.tea-analytics-kpis,.tea-analytics-kpis.compact,.tea-mini-grid,.tea-auto-grid{grid-template-columns:1fr 1fr!important}
  .form-actions,.panel-actions{grid-template-columns:1fr!important}
  .form-actions>*{grid-column:auto!important}
  .tea-card>header{padding:12px!important}
  .tea-preview-table footer{grid-template-columns:1fr!important}
}

/* Advanced Advance History + full-app mobile polish */
.advance-history-toolbar{display:flex;justify-content:space-between;align-items:center}.advance-history-tabs{display:flex;gap:8px}.advance-history-tabs a{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border:1px solid #e3e9e5;border-radius:9px;background:#fff;color:#52635a;font-weight:700;text-decoration:none}.advance-history-tabs a.active{color:#08783f;border-color:#bfe3ce;background:#f4fbf7}.advance-history-card{padding:0!important;overflow:hidden}.advance-filter-grid{display:grid;grid-template-columns:1.5fr .8fr 1fr 1fr auto;gap:14px;padding:18px;border-bottom:1px solid #e8edea;align-items:end}.advance-filter-grid label>span{display:block;font-size:11px;font-weight:800;color:#536159;margin-bottom:7px}.advance-search{display:flex;align-items:center;gap:8px;border:1px solid #dfe6e2;border-radius:8px;padding:0 11px;background:#fff}.advance-search input{border:0!important;box-shadow:none!important;padding-left:0!important}.advance-export-wrap{display:flex;align-items:end}.advance-history-table td{vertical-align:middle}.advance-history-footer{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-top:1px solid #e8edea;color:#66746c;font-size:12px}.advance-help-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:14px}.advance-guide-list p{display:grid;grid-template-columns:10px 150px 1fr;gap:10px;align-items:center;font-size:12px}.advance-guide-list i{width:7px;height:7px;border-radius:50%;background:#aaa}.advance-guide-list i.green{background:#18a05a}.advance-guide-list i.amber{background:#f4ad23}.advance-guide-list i.blue{background:#3681df}.advance-guide-list i.violet{background:#8b55c5}.advance-help-card p{color:#6b7871;line-height:1.6}
@media(max-width:900px){.advance-filter-grid{grid-template-columns:1fr 1fr}.advance-export-wrap{grid-column:1/-1}.advance-help-grid{grid-template-columns:1fr}}
@media(max-width:760px){
 .reference-page-shell{gap:10px!important}.advance-history-toolbar{overflow-x:auto}.advance-history-tabs{min-width:max-content;width:100%}.advance-history-tabs a{flex:1;justify-content:center;min-height:44px;padding:10px 14px}.advance-filter-grid{grid-template-columns:1fr!important;padding:12px!important;gap:10px!important}.advance-export-wrap,.advance-export-wrap button{width:100%!important}.advance-history-card{border-radius:10px!important}.advance-history-table{min-width:920px!important}.advance-history-footer{flex-direction:column;align-items:stretch;gap:10px;padding:12px}.advance-history-footer .farmer-add-button{justify-content:center;width:100%}.advance-help-grid{grid-template-columns:1fr!important}.advance-guide-list p{grid-template-columns:10px 1fr;gap:8px}.advance-guide-list p span{grid-column:2}.advance-history-kpis .farmer-stat-card{min-height:118px!important}.advance-history-kpis .farmer-stat-icon{width:38px!important;height:38px!important}.reference-list-header{align-items:flex-start!important;flex-direction:column!important}.reference-list-actions{width:100%!important;display:grid!important;grid-template-columns:1fr!important}.reference-list-actions a,.reference-list-actions button{width:100%!important;justify-content:center!important}.details-grid{grid-template-columns:1fr!important}.approval-progress{overflow-x:auto!important;padding-bottom:6px!important}.approval-progress span{min-width:110px!important}.standalone-search{width:100%!important}.farmer-search-box{max-width:none!important}.page-head .right,.farmer-page-head .right{width:auto!important}.sidebar{box-shadow:10px 0 35px rgba(0,0,0,.18)}
}
@media(max-width:430px){.advance-history-kpis{grid-template-columns:1fr 1fr!important}.advance-history-kpis .farmer-stat-card{padding:11px!important;min-height:112px!important}.advance-history-kpis strong{font-size:14px!important;word-break:break-word}.advance-history-tabs a{font-size:12px!important}.advance-help-grid .panel{padding:13px!important}}

/* Bongapay notifications, payroll and production print reports */
.farmer-top-print{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:0 12px;color:#0b6f37;background:#fff;border:1px solid #dfe9e3;border-radius:8px;font-size:11px;font-weight:800;cursor:pointer}.farmer-top-print:hover{background:#f4fbf6;border-color:#bfe3ce}.farmer-notification.active{color:#087b3b;background:#eaf7ef}.btn.danger,.secondary.danger{color:#a62929!important;border-color:#f0c9c9!important;background:#fff6f6!important}.notifications-page{display:grid;gap:14px}.notification-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px;background:linear-gradient(135deg,#073c29,#0e7b40);color:#fff;border-radius:8px}.notification-hero h2{margin:4px 0;font-size:24px}.notification-hero p{margin:0;color:rgba(255,255,255,.72)}.notification-hero-actions,.notification-actions{display:flex;align-items:center;gap:9px}.notification-hero-actions form,.notification-actions form{margin:0}.notification-list-card{overflow:hidden}.notification-table tr.is-unread{background:#f2fbf5}.notification-table td strong,.notification-table td small{display:block}.notification-table td small{margin-top:4px;color:#7a8780;font-size:10px}.unread-dot,.read-label{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:800}.unread-dot{color:#087b3b;background:#dff5e6}.read-label{color:#66736b;background:#edf1ef}

.payroll-page{display:grid;gap:14px;color:#182433}.payroll-stepper{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;padding:17px 18px;background:#fff;border:1px solid #e8edea;border-radius:8px}.payroll-stepper div{position:relative;display:grid;grid-template-columns:34px 1fr;gap:9px;align-items:center;min-height:46px}.payroll-stepper div:after{content:"";position:absolute;left:44px;right:18px;top:17px;height:1px;background:#dfe7e2}.payroll-stepper div:last-child:after{display:none}.payroll-stepper span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#eef2f0;color:#59665f;font-size:11px;font-weight:800;z-index:1}.payroll-stepper .done span,.payroll-stepper .active span{background:#078744;color:#fff}.payroll-stepper b,.payroll-stepper small{display:block}.payroll-stepper b{font-size:11px}.payroll-stepper small{color:#69766f;font-size:9px}.payroll-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:11px}.payroll-kpis article{display:grid;grid-template-columns:42px 1fr;gap:9px;align-items:center;min-height:96px;padding:14px;background:#fff;border:1px solid #e8edea;border-radius:7px}.payroll-kpis span{grid-row:1/4;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#ecf8f0;color:#078744}.payroll-kpis span.red{color:#d84b4b;background:#fff0f0}.payroll-kpis span.violet{color:#7447d4;background:#f2edff}.payroll-kpis span.blue{color:#3279d7;background:#edf5ff}.payroll-kpis span.amber{color:#dd8c19;background:#fff5e8}.payroll-kpis small{font-size:10px;color:#607069;font-weight:800}.payroll-kpis strong{font-size:15px;white-space:nowrap}.payroll-kpis p{margin:0;color:#6d7b74;font-size:9.5px}.payroll-main-grid{display:grid;grid-template-columns:minmax(0,1fr) 305px;gap:14px;align-items:start}.payroll-work-card,.payroll-side .panel,.payroll-bottom-grid .panel{background:#fff;border:1px solid #e8edea;border-radius:8px}.payroll-tabs{display:flex;gap:24px;padding:0 16px;border-bottom:1px solid #e8edea;overflow:auto}.payroll-tabs a{padding:14px 0;color:#516159;font-size:11px;font-weight:800;white-space:nowrap}.payroll-tabs a.active{color:#078744;border-bottom:2px solid #078744}.payroll-filters{display:grid;grid-template-columns:minmax(220px,1.4fr) .9fr .95fr .8fr auto;gap:10px;padding:14px}.payroll-filters input,.payroll-filters select{min-height:40px;border:1px solid #dfe7e2;border-radius:6px;background:#fff;padding:0 11px;font-size:11px}.payroll-search{display:flex;align-items:center;gap:8px;border:1px solid #dfe7e2;border-radius:6px;padding:0 10px}.payroll-search input{border:0;padding:0;box-shadow:none}.payroll-table td small{display:block;margin-top:4px;color:#7b8981;font-size:9.5px}.amount-negative{color:#c93b3b;font-weight:800}.amount-positive{color:#078744;font-weight:800}.payroll-status{display:inline-flex;padding:4px 8px;border-radius:999px;background:#e8f7ee;color:#087b3b;font-size:9px;font-weight:800}.payroll-table-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;border-top:1px solid #e8edea;color:#69766f;font-size:11px}.payroll-table-footer nav{display:flex;gap:7px}.payroll-table-footer a{display:grid;place-items:center;min-width:27px;height:27px;border:1px solid #e3e9e5;border-radius:6px;color:#536159}.payroll-table-footer a.active{color:#fff;background:#078744;border-color:#078744}.payroll-side{display:grid;gap:12px}.payroll-summary,.payroll-settings{padding:17px}.payroll-summary h3,.payroll-settings h3,.payroll-bottom-grid h3,.payroll-actions h3{margin:0 0 14px;font-size:13px}.payroll-summary p,.payroll-settings p,.payroll-net-card p{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0;color:#64736c;font-size:11px}.payroll-summary b,.payroll-net-card b,.payroll-settings b{color:#182433}.payroll-summary em,.payroll-settings b{display:inline-flex;padding:4px 8px;border-radius:999px;background:#eaf7ef;color:#078744;font-style:normal;font-size:9px}.payroll-settings p{margin:10px 0}.payroll-settings p .ui-icon{color:#078744}.payroll-settings p span{margin-right:auto;margin-left:8px}.payroll-bottom-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}.payroll-bottom-grid .panel{padding:16px}.payroll-donut-card{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center}.payroll-donut-card h3{grid-column:1/-1}.payroll-donut{width:112px;height:112px;border-radius:50%;background:conic-gradient(#078744 0 42%,#7848df 42% 70%,#2678d9 70% 87%,#ee9c24 87% 100%);position:relative}.payroll-donut:after{content:"";position:absolute;inset:28px;background:#fff;border-radius:50%}.payroll-legend p,.payroll-legend strong{display:flex;justify-content:space-between;gap:10px;margin:8px 0;font-size:10px}.payroll-legend i{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:#078744}.payroll-legend p:nth-child(2) i{background:#7848df}.payroll-legend p:nth-child(3) i{background:#2678d9}.payroll-legend p:nth-child(4) i{background:#ee9c24}.payroll-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.payroll-actions h3{grid-column:1/-1}.payroll-actions a{display:grid;grid-template-columns:28px 1fr;gap:4px 9px;align-items:center;min-height:62px;padding:12px;border:1px solid #e6ece8;border-radius:7px;background:#fbfdfc;color:#1e2b24}.payroll-actions a:nth-child(2),.payroll-actions a:nth-child(3){background:#f1fbf5}.payroll-actions svg{grid-row:1/3;color:#078744}.payroll-actions b,.payroll-actions small{display:block}.payroll-actions b{font-size:11px}.payroll-actions small{color:#738078;font-size:9px}.payroll-info{display:flex;gap:10px;align-items:center;padding:12px 15px;color:#315f9b;background:#edf5ff;border:1px solid #d5e6fb;border-radius:7px;font-size:11px}

@media(max-width:1180px){.payroll-kpis{grid-template-columns:repeat(3,1fr)}.payroll-main-grid{grid-template-columns:1fr}.payroll-side{grid-template-columns:1fr 1fr}.payroll-bottom-grid{grid-template-columns:1fr}.payroll-actions{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.notification-hero{align-items:flex-start;flex-direction:column}.notification-hero-actions{display:grid;width:100%;grid-template-columns:1fr 1fr}.notification-hero-actions button{width:100%}.payroll-stepper{grid-template-columns:1fr;gap:10px}.payroll-stepper div:after{display:none}.payroll-kpis{grid-template-columns:1fr 1fr}.payroll-filters{grid-template-columns:1fr}.payroll-side{grid-template-columns:1fr}.payroll-bottom-grid{grid-template-columns:1fr}.payroll-donut-card{grid-template-columns:1fr}.payroll-donut{margin:auto}.payroll-actions{grid-template-columns:1fr}.payroll-table{min-width:1150px}.farmer-top-print b{display:none}}
@media print{
  @page{size:A4;margin:12mm}
  *{box-shadow:none!important;text-shadow:none!important}
  body{background:#fff!important;color:#111827!important;font:10.5pt Arial,Helvetica,sans-serif!important}
  .sidebar,.topbar,.footer,.overlay,.no-print,.modal-backdrop,button,.btn,.farmer-outline-button,.farmer-add-button,.table-action,form,.reference-tabs,.payroll-tabs,.payroll-filters{display:none!important}
  .app,.main,.content{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;overflow:visible!important}
  .content:before{content:attr(data-report-title) "\A Bongapay Operational Report\A Generated " attr(data-report-date);display:block;white-space:pre-line;margin:0 0 14px;padding:0 0 12px;border-bottom:2px solid #0b6f37;color:#0f172a;font-weight:800;font-size:18pt;line-height:1.4}
  .panel,.card,.farmer-stat-card,.payroll-work-card,.payroll-side .panel,.payroll-bottom-grid .panel,.notification-hero,.sms-overview-card{break-inside:avoid;background:#fff!important;border:1px solid #cfd8d3!important;border-radius:0!important;color:#111827!important}
  .farmer-stat-grid,.payroll-kpis{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important}
  .payroll-main-grid,.payroll-bottom-grid{display:block!important}
  .payroll-side,.payroll-bottom-grid .panel{margin-top:8px!important}
  .table-wrap,.farmer-table-scroll{overflow:visible!important}
  table{width:100%!important;border-collapse:collapse!important;font-size:8.5pt!important}
  th,td{border:1px solid #d7dfda!important;padding:5px 6px!important;white-space:normal!important;vertical-align:top!important}
  th{background:#f0f5f2!important;color:#0f172a!important;font-weight:800!important}
  a{color:#111827!important;text-decoration:none!important}
}

/* Payroll spacing refinement */
.payroll-page{gap:18px;max-width:100%;padding-bottom:8px}
.payroll-stepper{padding:18px 20px;gap:10px;box-shadow:0 2px 14px rgba(21,52,36,.03)}
.payroll-stepper div{grid-template-columns:36px minmax(0,1fr);gap:11px;padding-right:10px}
.payroll-stepper div:after{left:48px;right:12px;background:#dce7e1}
.payroll-stepper span{width:30px;height:30px}
.payroll-stepper b{font-size:12px;line-height:1.25;color:#17241c}
.payroll-stepper small{font-size:10px;line-height:1.35;margin-top:2px}
.payroll-kpis{gap:14px}
.payroll-kpis article{min-height:106px;padding:16px 15px;grid-template-columns:46px minmax(0,1fr);gap:11px;border-radius:8px;box-shadow:0 2px 14px rgba(21,52,36,.03)}
.payroll-kpis span{width:42px;height:42px}
.payroll-kpis small{font-size:10px;letter-spacing:.01em;line-height:1.3}
.payroll-kpis strong{font-size:16px;line-height:1.25;white-space:normal;overflow-wrap:anywhere}
.payroll-kpis p{font-size:10px;line-height:1.35;margin-top:2px}
.payroll-main-grid{grid-template-columns:minmax(0,1fr) 330px;gap:18px}
.payroll-work-card,.payroll-side .panel,.payroll-bottom-grid .panel{border-radius:8px;box-shadow:0 2px 16px rgba(21,52,36,.035)}
.payroll-tabs{gap:28px;padding:0 18px}
.payroll-tabs a{padding:16px 0 15px;font-size:12px;line-height:1.2}
.payroll-filters{grid-template-columns:minmax(260px,1.45fr) minmax(130px,.8fr) minmax(135px,.85fr) minmax(135px,.82fr) auto;gap:12px;padding:16px 16px 15px;align-items:center}
.payroll-filters input,.payroll-filters select,.payroll-search{min-height:42px;border-radius:7px;font-size:12px}
.payroll-search{padding:0 12px;background:#fff}
.payroll-search input{min-width:0}
.payroll-table{border-top:1px solid #eef2ef}
.payroll-table th{padding:13px 12px!important;background:#f8fbf9!important;color:#526159!important;font-size:10px!important;letter-spacing:.01em}
.payroll-table td{padding:14px 12px!important;vertical-align:middle!important;font-size:11px!important}
.payroll-table td small{font-size:10px;line-height:1.35}
.payroll-status{padding:5px 9px;font-size:10px}
.payroll-table-footer{padding:15px 18px;font-size:12px}
.payroll-side{gap:14px}
.payroll-summary,.payroll-settings{padding:18px}
.payroll-summary h3,.payroll-settings h3,.payroll-bottom-grid h3,.payroll-actions h3{font-size:14px;margin-bottom:16px}
.payroll-summary p,.payroll-settings p,.payroll-net-card p{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;margin:13px 0;font-size:11.5px;line-height:1.35}
.payroll-summary b,.payroll-net-card b,.payroll-settings b{text-align:right}
.payroll-settings p span{min-width:0}
.payroll-bottom-grid{gap:18px}
.payroll-bottom-grid .panel{padding:18px}
.payroll-donut-card{grid-template-columns:126px minmax(0,1fr);gap:18px}
.payroll-donut{width:118px;height:118px}
.payroll-legend p,.payroll-legend strong{font-size:10.5px;gap:12px;line-height:1.35}
.payroll-actions{gap:12px}
.payroll-actions a{min-height:72px;padding:14px;grid-template-columns:32px minmax(0,1fr);gap:5px 10px;border-radius:8px}
.payroll-actions b{font-size:12px;line-height:1.25}
.payroll-actions small{font-size:10px;line-height:1.35}
.payroll-info{padding:13px 16px;font-size:11.5px;line-height:1.45}
@media(max-width:1180px){.payroll-main-grid{grid-template-columns:1fr}.payroll-side{grid-template-columns:1fr 1fr}.payroll-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.payroll-stepper{grid-template-columns:1fr 1fr}.payroll-stepper div:after{display:none}.payroll-filters{grid-template-columns:1fr 1fr}.payroll-filters .btn{grid-column:1/-1}.payroll-bottom-grid{grid-template-columns:1fr}.payroll-side{grid-template-columns:1fr}.payroll-actions{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.payroll-page{gap:14px}.payroll-stepper{grid-template-columns:1fr;padding:14px}.payroll-kpis{grid-template-columns:1fr 1fr;gap:10px}.payroll-kpis article{grid-template-columns:38px minmax(0,1fr);padding:13px 11px;min-height:98px}.payroll-kpis span{width:36px;height:36px}.payroll-kpis strong{font-size:14px}.payroll-tabs{padding:0 12px;gap:20px}.payroll-filters{grid-template-columns:1fr;padding:12px}.payroll-actions{grid-template-columns:1fr}.payroll-table-footer{align-items:flex-start;flex-direction:column}.payroll-info{align-items:flex-start}.payroll-donut-card{grid-template-columns:1fr}}

/* Payroll compact typography pass */
.payroll-page{gap:16px;font-size:11px}
.payroll-stepper{padding:15px 17px;gap:6px}
.payroll-stepper div{grid-template-columns:31px minmax(0,1fr);gap:8px;min-height:42px;padding-right:6px;overflow:visible}
.payroll-stepper div:after{left:40px;right:10px;top:15px}
.payroll-stepper span{width:25px;height:25px;font-size:10px}
.payroll-stepper b{font-size:10px;line-height:1.22;white-space:normal;overflow:visible}
.payroll-stepper small{font-size:8.5px;line-height:1.25;white-space:normal;overflow:visible}
.payroll-kpis{gap:10px}
.payroll-kpis article{min-height:88px;padding:12px 11px;grid-template-columns:36px minmax(0,1fr);gap:8px;overflow:visible}
.payroll-kpis span{width:32px;height:32px}
.payroll-kpis svg{width:17px;height:17px}
.payroll-kpis small{font-size:8.8px;line-height:1.2;white-space:normal}
.payroll-kpis strong{font-size:12.5px;line-height:1.18;letter-spacing:0;white-space:normal;word-break:normal;overflow-wrap:anywhere}
.payroll-kpis p{font-size:8.8px;line-height:1.25;white-space:normal}
.payroll-main-grid{grid-template-columns:minmax(0,1fr) 318px;gap:14px}
.payroll-tabs{gap:21px;padding:0 15px}
.payroll-tabs a{padding:13px 0 12px;font-size:10px}
.payroll-filters{grid-template-columns:minmax(230px,1.35fr) minmax(116px,.78fr) minmax(118px,.82fr) minmax(120px,.78fr) auto;gap:9px;padding:12px}
.payroll-filters input,.payroll-filters select,.payroll-search{min-height:36px;border-radius:6px;font-size:10px}
.payroll-table th{padding:10px 9px!important;font-size:8.8px!important;white-space:nowrap!important}
.payroll-table td{padding:10px 9px!important;font-size:9.8px!important;line-height:1.32!important}
.payroll-table td small{font-size:8.8px;line-height:1.25;white-space:normal}
.payroll-status{font-size:8.5px;padding:4px 7px}
.payroll-table-footer{padding:11px 14px;font-size:10px}
.payroll-summary,.payroll-settings{padding:14px}
.payroll-summary h3,.payroll-settings h3,.payroll-bottom-grid h3,.payroll-actions h3{font-size:11.5px;margin-bottom:11px;line-height:1.25}
.payroll-summary p,.payroll-settings p,.payroll-net-card p{margin:9px 0;font-size:9.8px;gap:9px;line-height:1.28}
.payroll-summary em,.payroll-settings b{font-size:8.2px;padding:3px 7px}
.payroll-bottom-grid{gap:12px}
.payroll-bottom-grid .panel{padding:14px}
.payroll-donut-card{grid-template-columns:104px minmax(0,1fr);gap:12px}
.payroll-donut{width:96px;height:96px}
.payroll-donut:after{inset:24px}
.payroll-legend p,.payroll-legend strong{font-size:9px;line-height:1.25;margin:6px 0}
.payroll-actions{gap:8px}
.payroll-actions a{min-height:58px;padding:10px;grid-template-columns:26px minmax(0,1fr);gap:3px 8px;overflow:visible}
.payroll-actions svg{width:15px;height:15px}
.payroll-actions b{font-size:9.8px;line-height:1.18;white-space:normal;overflow:visible}
.payroll-actions small{font-size:8.3px;line-height:1.22;white-space:normal;overflow:visible}
.payroll-info{padding:10px 13px;font-size:9.8px;line-height:1.35}
@media(max-width:1180px){.payroll-main-grid{grid-template-columns:1fr}.payroll-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.payroll-side{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.payroll-stepper{grid-template-columns:1fr 1fr}.payroll-filters{grid-template-columns:1fr 1fr}.payroll-main-grid{gap:12px}.payroll-bottom-grid{grid-template-columns:1fr}.payroll-side{grid-template-columns:1fr}}
@media(max-width:640px){.payroll-page{gap:12px}.payroll-stepper{grid-template-columns:1fr;padding:12px}.payroll-kpis{grid-template-columns:1fr 1fr;gap:8px}.payroll-kpis article{padding:10px 9px;min-height:86px;grid-template-columns:31px minmax(0,1fr)}.payroll-kpis span{width:29px;height:29px}.payroll-kpis strong{font-size:11px}.payroll-filters{grid-template-columns:1fr}.payroll-tabs a{font-size:9.5px}.payroll-actions{grid-template-columns:1fr}.payroll-donut-card{grid-template-columns:1fr}.payroll-donut{margin:auto}}

/* Clean professional account, payroll and route refinements */
.account-hero{color:#172033;background:#fff;border:1px solid #e5eaf0;border-radius:12px;box-shadow:0 4px 18px rgba(16,24,40,.045);padding:18px 20px}
.account-avatar{color:#24415f;background:#eef4fa;border:1px solid #dbe6f0;box-shadow:none;border-radius:12px}
.account-identity .eyebrow{color:#7a8797;font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.account-identity h2{color:#182230;font-size:17px;line-height:1.25;margin:3px 0}
.account-identity p{color:#667085;font-size:10px}
.account-security-badge{color:#344054;background:#f8fafc;border-color:#e4e7ec;padding:7px 10px}
.account-button:hover,.account-button.active{color:#24415f;background:#eef4fa;border-color:#d5e1ec}
.payroll-page{gap:14px!important}
.payroll-kpis{gap:10px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
.payroll-kpis article{min-height:86px!important;padding:12px!important;grid-template-columns:36px minmax(0,1fr)!important;gap:9px!important}
.payroll-kpis span{width:34px!important;height:34px!important}
.payroll-kpis small{font-size:9px!important}.payroll-kpis strong{font-size:14px!important;white-space:normal!important}.payroll-kpis p{font-size:9px!important}
.payroll-main-grid{grid-template-columns:minmax(0,1fr) 290px!important;gap:14px!important}
.payroll-tabs a{font-size:10px!important;padding:12px 0!important}.payroll-filters{padding:12px!important;gap:8px!important}
.payroll-filters input,.payroll-filters select,.payroll-search{min-height:38px!important;font-size:10px!important}
.payroll-table th{font-size:9px!important;padding:10px!important}.payroll-table td{font-size:10px!important;padding:11px 10px!important}
.payroll-summary,.payroll-settings,.payroll-bottom-grid .panel{padding:14px!important}.payroll-summary h3,.payroll-settings h3,.payroll-bottom-grid h3,.payroll-actions h3{font-size:12px!important}
.reference-page-shell,.panel,.reference-list-card{min-width:0}.farmer-table-scroll{max-width:100%;overflow:auto}.reference-data-table{width:100%;min-width:860px}
@media(max-width:1100px){.payroll-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}.payroll-main-grid{grid-template-columns:1fr!important}}
@media(max-width:640px){.account-hero{padding:14px}.account-identity h2{font-size:15px}.payroll-kpis{grid-template-columns:1fr!important}.reference-list-actions{width:100%}.reference-list-actions>*{max-width:100%}}
/* GreenLeaf bulk disbursement redesign */
.gl-bulk-shell{display:flex;flex-direction:column;gap:16px}.gl-bulk-titlebar{display:flex;align-items:center;justify-content:space-between;gap:16px}.gl-bulk-titlebar h2{margin:0;font-size:24px;color:#0f172a}.gl-bulk-titlebar p,.gl-muted{margin:4px 0 0;color:#64748b;font-size:13px}.gl-bulk-tools{display:flex;gap:10px}.gl-bulk-tools button,.gl-secondary,.gl-primary{border:1px solid #dbe3df;background:#fff;border-radius:8px;padding:10px 14px;font-weight:700;color:#1f2937;text-decoration:none;display:inline-flex;align-items:center;gap:7px}.gl-primary{background:#08783f;color:#fff;border-color:#08783f}.gl-stepper{display:grid;grid-template-columns:repeat(4,1fr);background:#f8faf9;border:1px solid #edf1ef;border-radius:9px;overflow:hidden}.gl-stepper a{padding:14px 18px;display:flex;gap:12px;align-items:center;color:#1f2937;text-decoration:none;position:relative}.gl-stepper a+ a{border-left:1px solid #edf1ef}.gl-stepper a span{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;border:1px solid #cbd5e1;font-size:12px;font-weight:800}.gl-stepper a b{font-size:12px}.gl-stepper a small{display:block;font-weight:500;color:#64748b;margin-top:3px}.gl-stepper a.active,.gl-stepper a.done{background:#f0faf5;color:#08783f}.gl-stepper a.active span,.gl-stepper a.done span{background:#08783f;color:#fff;border-color:#08783f}.gl-bulk-grid,.gl-complete-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px}.gl-top-grid{display:grid;grid-template-columns:330px minmax(0,1fr);gap:14px}.gl-card{background:#fff;border:1px solid #e6ebe8;border-radius:10px;padding:16px}.gl-card h3{margin:0;font-size:15px;color:#172033}.gl-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.gl-card-head p{font-size:12px;color:#64748b;margin:4px 0 0}.gl-select-batch select{width:100%;height:42px;border:1px solid #dbe3df;border-radius:7px;padding:0 10px;margin-bottom:10px}.gl-select-batch>small{display:block;color:#64748b;margin:7px 0}.gl-ready{margin-top:14px;background:#eef9f2;color:#08783f;border:1px solid #d8eee1;border-radius:7px;padding:10px;font-size:12px;font-weight:700}.gl-summary-cards{display:grid;gap:10px}.gl-summary-cards.five{grid-template-columns:repeat(5,minmax(0,1fr))}.gl-summary-cards.three{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:14px}.gl-summary-cards article{border:1px solid #e7ece9;border-radius:8px;padding:14px;background:#fff;min-width:0}.gl-summary-cards article small{display:block;color:#475569;font-size:11px}.gl-summary-cards article strong{display:block;font-size:17px;margin:12px 0 8px;color:#111827;overflow-wrap:anywhere}.gl-summary-cards article p{margin:0;color:#64748b;font-size:11px}.gl-metrics{margin-bottom:14px}.gl-preview{margin-top:14px;padding:0;overflow:hidden}.gl-preview .gl-card-head{padding:14px 16px 0}.gl-count,.gl-valid,.gl-pending{display:inline-flex;align-items:center;border-radius:999px;padding:4px 8px;font-size:10px;background:#e9f7ef;color:#08783f}.gl-pending{background:#eef2f6;color:#64748b}.gl-table-actions{display:flex;gap:8px}.gl-table-actions input{width:220px;border:1px solid #dbe3df;border-radius:7px;padding:9px 11px}.gl-table-actions button{border:1px solid #dbe3df;background:#fff;border-radius:7px;padding:8px 12px}.gl-tabs{display:flex;gap:26px;border-bottom:1px solid #edf1ef;padding:0 16px}.gl-tabs>*{padding:11px 0;font-size:12px}.gl-tabs b{color:#08783f;border-bottom:2px solid #08783f}.gl-table-wrap{overflow:auto}.gl-table-wrap table{width:100%;border-collapse:collapse;min-width:980px}.gl-table-wrap th{background:#f8faf9;color:#475569;font-size:10px;text-align:left;padding:11px 12px;white-space:nowrap}.gl-table-wrap td{border-top:1px solid #eef2f0;padding:11px 12px;font-size:11px;white-space:nowrap;color:#263244}.gl-pagination{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-top:1px solid #edf1ef;font-size:11px;color:#64748b}.gl-pagination div{display:flex;gap:6px}.gl-pagination button,.gl-pagination select{width:32px;height:32px;border:1px solid #dbe3df;background:#fff;border-radius:6px}.gl-pagination button.on{background:#08783f;color:#fff}.gl-pagination select{width:auto;padding:0 8px}.gl-validation{display:grid;grid-template-columns:1fr 1.2fr .8fr 1fr;background:#fff;border:1px solid #e6ebe8;border-radius:10px;margin-top:14px}.gl-validation>div,.gl-validation>aside{padding:16px;border-right:1px solid #edf1ef}.gl-validation>aside{border-right:0;background:#fff9eb}.gl-validation h4{margin:0 0 12px;font-size:12px}.gl-validation p,.gl-validation a{font-size:11px;margin:8px 0}.gl-validation b{float:right}.gl-bottom-actions{display:flex;justify-content:space-between;align-items:center;margin-top:16px}.gl-bottom-actions>div{display:flex;gap:10px}.gl-side{display:flex;flex-direction:column;gap:14px}.gl-timeline{margin-top:14px}.gl-timeline p{position:relative;margin:0;padding:0 0 20px 38px;min-height:38px}.gl-timeline p:not(:last-child):before{content:"";position:absolute;left:13px;top:23px;width:1px;height:calc(100% - 8px);background:#9fd5b8}.gl-timeline p>span{position:absolute;left:0;top:0;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#edf8f2;color:#08783f;font-size:11px;font-weight:800}.gl-timeline p b,.gl-timeline p small,.gl-timeline p em{display:block;font-size:11px}.gl-timeline p small{color:#64748b;margin-top:4px}.gl-timeline p em{font-style:normal;position:absolute;right:0;top:0;background:#f3f5f6;border-radius:999px;padding:3px 7px;color:#64748b}.gl-warning{border:1px solid #f3dfab;background:#fff9e9;border-radius:9px;padding:15px;color:#845d13;font-size:12px}.gl-warning p{margin:7px 0 0}.gl-approval-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.gl-approval-row article{display:flex;gap:10px;align-items:flex-start;border:1px solid #edf1ef;border-radius:8px;padding:13px}.gl-approval-row article>span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#eef8f3;color:#08783f;font-weight:800}.gl-approval-row p{margin:5px 0;color:#64748b;font-size:11px}.gl-success-hero{display:grid;grid-template-columns:auto 1fr 280px;gap:22px;align-items:center;background:#f2fbf5;border:1px solid #dfeee4;border-radius:10px;padding:24px;margin-bottom:14px}.gl-success-icon{width:72px;height:72px;border-radius:50%;background:#08783f;color:#fff;display:grid;place-items:center}.gl-success-hero h2{margin:0;color:#08783f}.gl-success-hero p{font-size:12px;color:#475569}.gl-success-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:16px}.gl-success-meta small,.gl-success-meta b{display:block;font-size:10px}.gl-success-total{background:#fff;border:1px solid #dfe8e2;border-radius:8px;padding:16px}.gl-success-total strong{display:block;color:#08783f;font-size:21px;margin:8px 0 15px}.gl-success-total p{display:flex;justify-content:space-between;margin:8px 0}.gl-doc-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.gl-doc-grid button{border:1px solid #e6ebe8;background:#fff;border-radius:8px;padding:14px 8px;display:flex;flex-direction:column;align-items:center;gap:8px}.gl-doc-grid b{font-size:10px}.gl-doc-grid small{border-top:1px solid #edf1ef;width:100%;padding-top:8px;color:#475569}.gl-kv span{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:11px}.gl-kv b{text-align:right}.gl-complete-grid main>.gl-card{margin-bottom:14px}
@media(max-width:1100px){.gl-bulk-grid,.gl-complete-grid{grid-template-columns:1fr}.gl-side{display:grid;grid-template-columns:1fr 1fr}.gl-top-grid{grid-template-columns:1fr}.gl-summary-cards.five{grid-template-columns:repeat(2,1fr)}.gl-validation{grid-template-columns:1fr 1fr}.gl-doc-grid{grid-template-columns:repeat(3,1fr)}.gl-success-hero{grid-template-columns:auto 1fr}.gl-success-total{grid-column:1/-1}.gl-success-meta{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.gl-bulk-titlebar{align-items:flex-start}.gl-bulk-tools{display:none}.gl-stepper{grid-template-columns:1fr}.gl-stepper a+ a{border-left:0;border-top:1px solid #edf1ef}.gl-summary-cards.five,.gl-summary-cards.three,.gl-side,.gl-validation,.gl-approval-row,.gl-doc-grid{grid-template-columns:1fr}.gl-table-actions{display:none}.gl-pagination{gap:8px;align-items:flex-start;flex-direction:column}.gl-bottom-actions{flex-direction:column;align-items:stretch;gap:10px}.gl-bottom-actions>div{display:grid}.gl-secondary,.gl-primary{justify-content:center}.gl-success-hero{grid-template-columns:1fr;text-align:center}.gl-success-icon{margin:auto}.gl-success-meta{grid-template-columns:1fr 1fr}.gl-doc-grid{grid-template-columns:repeat(2,1fr)}}
/* Payment centre redesign */
.pd-shell{display:flex;flex-direction:column;gap:16px;color:#172033}.pd-title{display:flex;justify-content:space-between;align-items:center}.pd-title h2{margin:0;font-size:23px}.pd-title p{margin:4px 0 0;color:#64748b;font-size:12px}.pd-head-tools{display:flex;gap:10px}.pd-head-tools button,.pd-secondary,.pd-primary{border:1px solid #dfe6e2;background:#fff;border-radius:8px;padding:10px 14px;display:inline-flex;align-items:center;gap:8px;font-weight:700;color:#172033;text-decoration:none}.pd-primary{background:#078341;border-color:#078341;color:#fff}.pd-steps{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #edf1ef;background:#fafcfb;border-radius:9px;overflow:hidden}.pd-steps>div{display:flex;align-items:center;gap:12px;padding:14px 18px}.pd-steps>div+div{border-left:1px solid #edf1ef}.pd-steps span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid #cbd5e1;font-size:12px}.pd-steps b{font-size:12px}.pd-steps small{display:block;color:#64748b;margin-top:3px;font-weight:500}.pd-steps .active,.pd-steps .done{background:#f1faf5;color:#087c42}.pd-steps .active span,.pd-steps .done span{background:#087c42;color:#fff;border-color:#087c42}.pd-layout,.pd-bulk-layout,.pd-complete-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px}.pd-layout main,.pd-bulk-layout main,.pd-complete-layout main{min-width:0}.pd-card{background:#fff;border:1px solid #e5ebe8;border-radius:10px;padding:16px;margin-bottom:14px}.pd-card h3{margin:0 0 8px;font-size:15px}.pd-card>p{color:#64748b;font-size:12px}.pd-card-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.pd-card-head>div{display:flex;gap:8px}.pd-card-head input{border:1px solid #dfe6e2;border-radius:7px;padding:9px 12px}.pd-card-head button{border:1px solid #dfe6e2;background:#fff;border-radius:7px;padding:9px 12px}.pd-methods{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:14px}.pd-methods a{position:relative;display:flex;gap:10px;align-items:center;border:1px solid #e2e8e5;border-radius:9px;padding:14px;text-decoration:none;color:#172033;min-height:74px}.pd-methods a.selected{border-color:#078341;box-shadow:0 0 0 1px #078341}.pd-methods i{width:36px;height:36px;border-radius:8px;background:#eef8f3;display:grid;place-items:center;color:#078341}.pd-methods b,.pd-methods small{display:block;font-size:11px}.pd-methods small{color:#64748b;margin-top:5px}.pd-methods em{position:absolute;right:8px;top:8px;color:#078341}.pd-tabs{display:flex;gap:60px;border-bottom:1px solid #e9eeeb;margin:14px 0}.pd-tabs>*{padding:10px 30px;color:#64748b}.pd-tabs b{color:#078341;border-bottom:2px solid #078341}.pd-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.pd-form-grid.two{grid-template-columns:1fr 1fr}.pd-form-grid.three{grid-template-columns:repeat(3,1fr)}.pd-form-grid label{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:700}.pd-form-grid input,.pd-form-grid select,.pd-form-grid textarea,.pd-batch-top select{border:1px solid #dfe6e2;border-radius:7px;padding:10px 12px;background:#fff;min-height:42px}.pd-form-grid textarea{min-height:78px}.pd-recipient{display:flex;align-items:center;gap:10px;background:#f8faf9;border:1px solid #edf1ef;border-radius:8px;padding:10px;margin-top:10px}.pd-recipient>b{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#dff4e8;color:#087c42}.pd-recipient span{flex:1;font-weight:700}.pd-recipient small{display:block;color:#64748b;font-weight:500}.pd-recipient em{font-style:normal;color:#087c42;background:#eaf8f0;border-radius:999px;padding:4px 8px}.pd-link{display:inline-block;margin-top:10px;color:#087c42}.pd-upload{border:1px dashed #cfdad4;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:190px;color:#64748b}.pd-upload b{color:#087c42;font-size:14px}.pd-upload button{margin-top:8px;border:1px solid #dfe6e2;background:#fff;border-radius:7px;padding:8px 12px}.pd-charge,.pd-info{background:#fffaf0;border:1px solid #f3e3bc;border-radius:8px;padding:14px}.pd-info{background:#f3f8ff;border-color:#dbe8f6}.pd-charge span,.pd-charge strong{display:flex;justify-content:space-between;margin-top:10px;font-size:11px}.pd-charge em{font-style:normal}.pd-actions{display:flex;justify-content:space-between;align-items:center;margin-top:14px}.pd-actions>div{display:flex;gap:10px}.pd-side{display:flex;flex-direction:column;gap:0}.pd-summary dl,.pd-side dl,.pd-details dl{display:grid;grid-template-columns:1fr auto;gap:12px;font-size:11px}.pd-summary dt,.pd-side dt,.pd-details dt{color:#64748b}.pd-summary dd,.pd-side dd,.pd-details dd{margin:0;text-align:right;font-weight:700}.green{color:#078341!important}.pd-total{display:flex;justify-content:space-between;border-top:1px solid #e8eeeb;padding-top:14px;margin-top:14px}.pd-total b{color:#078341;font-size:17px}.pd-success-note{background:#eff9f3;border:1px solid #dcefe4;border-radius:8px;padding:12px;color:#166b42;font-size:11px;margin-top:14px}.pd-success-note small{display:block;margin-top:6px}.pd-recent{display:flex;align-items:center;gap:10px;border-top:1px solid #edf1ef;padding:12px 0}.pd-recent i{width:34px;height:34px;border-radius:8px;background:#eef8f3;display:grid;place-items:center;color:#078341}.pd-recent span{flex:1}.pd-recent span b,.pd-recent span small,.pd-recent em,.pd-recent em b{display:block;font-size:10px}.pd-recent em{text-align:right;font-style:normal;color:#078341}.pd-total-row{display:flex;justify-content:space-between;padding-top:10px}.pd-batch-top{display:grid;grid-template-columns:330px 1fr;gap:14px}.pd-batch-top small{display:block;color:#64748b;margin-top:8px}.pd-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:14px}.pd-metrics article,.pd-kpis article{background:#fff;border:1px solid #e5ebe8;border-radius:9px;padding:14px}.pd-metrics small,.pd-metrics b,.pd-metrics span,.pd-kpis small,.pd-kpis b,.pd-kpis span{display:block}.pd-metrics small,.pd-kpis small{font-size:10px;color:#475569}.pd-metrics b,.pd-kpis b{font-size:17px;margin:10px 0}.pd-metrics span,.pd-kpis span{font-size:10px;color:#64748b}.pd-table{overflow:auto}.pd-table table{width:100%;border-collapse:collapse;min-width:980px}.pd-table th{background:#f8faf9;padding:11px;text-align:left;font-size:10px;white-space:nowrap}.pd-table td{padding:11px;border-top:1px solid #edf1ef;font-size:10px;white-space:nowrap}.pd-table footer{display:flex;justify-content:space-between;align-items:center;padding:12px 4px;font-size:10px}.pd-table footer div{display:flex;gap:5px}.pd-table footer button,.pd-table footer select{border:1px solid #dfe6e2;background:#fff;border-radius:6px;height:31px;min-width:31px}.pd-table footer .on{background:#078341;color:#fff}.pd-valid,.pd-pending{display:inline-flex;background:#eaf8f0;color:#087c42;border-radius:999px;padding:4px 8px;font-size:10px}.pd-pending{background:#fff4dc;color:#96630f}.pd-validation{display:grid;grid-template-columns:1fr 1.3fr 1fr;border:1px solid #e5ebe8;border-radius:9px;background:#fff;margin:14px 0}.pd-validation>*{padding:16px;border-right:1px solid #edf1ef}.pd-validation aside{background:#fff9eb;border-right:0}.pd-validation p{font-size:11px}.pd-approval-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}.pd-approval-row article{display:flex;gap:10px;border:1px solid #e8eeeb;border-radius:8px;padding:13px}.pd-approval-row article>span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#edf8f2;color:#078341}.pd-approval-row b,.pd-approval-row p,.pd-approval-row em{display:block;font-size:10px}.pd-approval-row p{color:#64748b}.pd-approval-row em{font-style:normal;background:#f1f4f3;border-radius:999px;padding:4px 7px}.pd-approval-row em.ok{background:#eaf8f0;color:#087c42}.pd-flow{display:flex;align-items:flex-start;gap:10px;padding:12px 0;border-bottom:1px solid #edf1ef}.pd-flow>span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#edf8f2;color:#078341}.pd-flow div{flex:1}.pd-flow b,.pd-flow small{display:block;font-size:10px}.pd-flow small{color:#64748b;margin-top:4px}.pd-flow em{font-style:normal;font-size:9px;background:#f2f5f4;border-radius:999px;padding:4px 7px}.pd-warning{background:#fff8e8;border:1px solid #f1dfae;border-radius:9px;padding:15px;color:#875f12;font-size:11px}.pd-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.pd-kpis.three{grid-template-columns:repeat(3,1fr)}.pd-filters{display:grid;grid-template-columns:2fr repeat(3,1fr) auto;gap:10px;margin-bottom:14px}.pd-filters>*{border:1px solid #dfe6e2;border-radius:7px;padding:10px;background:#fff}.pd-details{display:grid;grid-template-columns:1fr 1fr;gap:30px}.pd-otp-wrap{display:grid;place-items:center;min-height:560px}.pd-otp{max-width:650px;width:100%;text-align:center;padding:34px}.pd-otp-icon{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;margin:auto;background:#eaf8f0;color:#078341}.pd-otp h2{margin:16px 0 8px}.pd-otp p{max-width:520px;margin:0 auto 20px}.pd-otp-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.pd-otp-meta span{border:1px solid #e5ebe8;border-radius:8px;padding:12px;font-size:10px}.pd-otp-meta b{display:block;margin-top:6px}.pd-otp label{display:flex;flex-direction:column;gap:8px;text-align:left;max-width:320px;margin:auto;font-size:11px;font-weight:700}.pd-otp input{font-size:24px;letter-spacing:12px;text-align:center;border:1px solid #cfdad4;border-radius:8px;padding:12px}.pd-otp>small{display:block;color:#64748b;margin:10px}.pd-success-hero{display:grid;grid-template-columns:80px 1fr 280px;gap:20px;align-items:center;background:#f2fbf5;border:1px solid #dfeee4;border-radius:10px;padding:24px;margin-bottom:14px}.pd-success-hero>span{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:#078341;color:#fff}.pd-success-hero h2{color:#078341;margin:0}.pd-success-hero>div>div{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:16px}.pd-success-hero b,.pd-success-hero small{display:block;font-size:10px}.pd-success-hero aside{background:#fff;border:1px solid #dfe8e2;border-radius:8px;padding:16px}.pd-success-hero aside strong{display:block;color:#078341;font-size:20px;margin:8px 0 14px}.pd-success-hero aside p{display:flex;justify-content:space-between;font-size:10px}.pd-docs{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.pd-docs button{border:1px solid #e5ebe8;background:#fff;border-radius:8px;padding:14px 8px;display:flex;flex-direction:column;align-items:center;gap:8px}.pd-check{border-bottom:1px solid #edf1ef;padding:10px 0;color:#078341}.pd-check small{display:block;color:#64748b;margin-left:18px}
@media(max-width:900px){.pd-head-tools{display:none}.pd-layout,.pd-bulk-layout,.pd-complete-layout,.pd-batch-top{grid-template-columns:1fr}.pd-methods{grid-template-columns:1fr 1fr}.pd-metrics,.pd-kpis{grid-template-columns:1fr 1fr}.pd-form-grid,.pd-form-grid.two,.pd-form-grid.three,.pd-details{grid-template-columns:1fr}.pd-approval-row{grid-template-columns:1fr 1fr}.pd-success-hero{grid-template-columns:1fr;text-align:center}.pd-success-hero>span{margin:auto}.pd-docs{grid-template-columns:1fr 1fr}.pd-steps{overflow:auto}.pd-steps>div{min-width:210px}.pd-actions{align-items:stretch;flex-direction:column;gap:10px}.pd-actions>div{display:grid}.pd-secondary,.pd-primary{justify-content:center}}
.pd-css-probe{position:fixed!important;width:0!important;height:0!important;overflow:hidden!important;pointer-events:none!important}

/* Advanced bulk disbursement OTP authorization */
.pd-otp-modern{max-width:620px;padding:30px 34px;border-radius:16px;box-shadow:0 18px 50px rgba(15,72,45,.10);border-color:#dfe9e3;text-align:left}
.pd-otp-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.pd-otp-modern .pd-otp-icon{margin:0;width:52px;height:52px}.pd-secure-badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#edf8f2;color:#087c42;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.pd-otp-modern h2{font-size:24px;margin:0 0 6px;color:#13251c}.pd-otp-lead{margin:0!important;max-width:none!important;color:#607168!important;font-size:13px!important}.pd-otp-lead b{color:#172b21}
.pd-otp-modern .pd-otp-meta{margin:22px 0 18px}.pd-otp-modern .pd-otp-meta span{background:#f8fbf9;border-color:#e3ece7;padding:13px 14px;color:#718078}.pd-otp-modern .pd-otp-meta b{color:#172b21;font-size:12px}
.pd-otp-alert{border-radius:9px;padding:10px 12px;margin:0 0 14px;font-size:11px;font-weight:700}.pd-otp-alert.success{background:#edf9f2;color:#087c42;border:1px solid #d6ecdf}.pd-otp-alert.error{background:#fff1f1;color:#b42318;border:1px solid #ffd6d3}
.pd-otp-form{margin-top:4px}.pd-code-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.pd-code-label label{font-size:11px;font-weight:800;color:#22352b}.pd-code-label span{font-size:11px;font-weight:800;color:#087c42}.pd-code-label span.expired{color:#b42318}
.pd-code-inputs{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.pd-code-inputs .pd-code-box{width:100%;height:58px;border:1px solid #cddbd3;border-radius:10px;background:#fff;text-align:center;font-size:24px;font-weight:800;color:#123524;outline:none;transition:.18s ease;letter-spacing:0;padding:0}.pd-code-inputs .pd-code-box:focus{border-color:#078341;box-shadow:0 0 0 3px rgba(7,131,65,.12);transform:translateY(-1px)}
.pd-verify-btn{width:100%;justify-content:center;margin-top:16px;min-height:46px;border-radius:9px;cursor:pointer}.pd-resend-form{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:14px;font-size:11px;color:#6b7a72}.pd-resend-form button{border:0;background:transparent;color:#087c42;font-weight:800;padding:3px;cursor:pointer}.pd-otp-back{display:block;text-align:center;margin-top:13px;color:#607168;text-decoration:none;font-size:11px;font-weight:700}.pd-otp-back:hover,.pd-resend-form button:hover{color:#045f30}.pd-otp-form.shake{animation:pdOtpShake .32s ease}@keyframes pdOtpShake{25%{transform:translateX(-5px)}50%{transform:translateX(5px)}75%{transform:translateX(-3px)}}
@media(max-width:650px){.pd-otp-wrap{min-height:auto;place-items:start}.pd-otp-modern{padding:22px 18px;border-radius:12px}.pd-otp-modern h2{font-size:21px}.pd-otp-modern .pd-otp-meta{grid-template-columns:1fr}.pd-code-inputs{gap:6px}.pd-code-inputs .pd-code-box{height:52px;font-size:21px}}


/* Final payroll workflow and professional print refinement */
.payroll-stepper{position:relative;isolation:isolate;overflow:hidden;padding:20px 22px;border-radius:14px;border-color:#dfe9e3;background:linear-gradient(180deg,#fff,#fbfdfc)}
.payroll-stepper div{grid-template-columns:36px minmax(0,1fr);gap:11px;min-height:58px;padding:4px 18px 4px 0;align-items:center;overflow:visible}
.payroll-stepper div:after{left:43px;right:-2px;top:29px;height:2px;background:#dfe8e2;z-index:0}
.payroll-stepper div.done:after{background:#8fd0aa}
.payroll-stepper span{position:relative;z-index:2;width:32px;height:32px;border:3px solid #fff;box-shadow:0 0 0 1px #dce7e1;background:#f3f6f4;font-size:11px}
.payroll-stepper .done span,.payroll-stepper .active span{box-shadow:0 0 0 1px #078744}
.payroll-stepper b{position:relative;z-index:2;font-size:11.5px;line-height:1.25;color:#17241c;white-space:normal}
.payroll-stepper small{position:relative;z-index:2;margin-top:3px;font-size:9.5px;line-height:1.25;color:#6b7871;white-space:normal}
.payroll-sheet-card{overflow:hidden;border-radius:12px!important}
.payroll-sheet-card>.reference-list-header{padding:20px 22px;border-bottom:1px solid #e5ece8;background:#fbfdfc}
.payroll-sheet-summary{padding:18px 22px!important;background:#fff}
.payroll-payment-sheet thead th{background:#f2f6f3;color:#213128}
.payroll-payment-sheet tbody tr:nth-child(even){background:#fbfdfc}
.payroll-payment-sheet tfoot th{background:#eaf4ed;color:#123b24;font-weight:800}

@media(max-width:1100px){.payroll-stepper{grid-template-columns:repeat(5,minmax(150px,1fr));overflow-x:auto}.payroll-stepper div{min-width:150px}}
@media(max-width:700px){.payroll-stepper{grid-template-columns:1fr;overflow:visible;padding:14px}.payroll-stepper div{min-width:0;padding:3px 0}.payroll-stepper div:after{display:none}}

@media print{
  @page{size:A4 landscape;margin:10mm}
  body *{visibility:hidden!important}
  .print-report,.print-report *{visibility:visible!important}
  .print-report{position:absolute!important;left:0!important;top:0!important;width:100%!important;margin:0!important;padding:0!important;border:0!important;background:#fff!important}
  .print-report:before{content:"GREENLEAF TEA FACTORY\A FARMERS PAYOUT REGISTER";display:block;white-space:pre-line;text-align:center;padding:0 0 10px;margin:0 0 10px;border-bottom:2px solid #164d2f;color:#123d27;font:700 16pt Georgia,serif;letter-spacing:.5px}
  .print-report:after{content:"Authorized payout report • Generated from verified unpaid deliveries";display:block;margin-top:10px;padding-top:8px;border-top:1px solid #9fb4a7;text-align:center;color:#52655b;font-size:8pt}
  .print-report .reference-list-header{display:block!important;padding:0 0 10px!important;background:#fff!important;border:0!important}
  .print-report .reference-list-header h2{font:700 12pt Georgia,serif!important;margin:0 0 3px!important;color:#17261d!important}
  .print-report .reference-list-header small{font-size:8.5pt!important;color:#56675d!important}
  .print-report .no-print,.print-report form,.print-report button,.print-report .payroll-info{display:none!important}
  .print-report .payroll-sheet-summary{display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:5px!important;padding:0 0 10px!important}
  .print-report .payroll-sheet-summary article{border:1px solid #b9c8bf!important;border-radius:0!important;padding:7px!important;background:#f8faf9!important}
  .print-report .payroll-sheet-summary span{font-size:7.5pt!important;color:#526158!important}
  .print-report .payroll-sheet-summary b{display:block!important;margin-top:3px!important;font-size:9pt!important;color:#15251b!important}
  .print-report .farmer-table-scroll{overflow:visible!important}
  .print-report table{width:100%!important;border-collapse:collapse!important;table-layout:auto!important;font-size:7.2pt!important}
  .print-report th,.print-report td{border:1px solid #aebdb4!important;padding:4px 4px!important;white-space:normal!important;vertical-align:middle!important}
  .print-report thead{display:table-header-group!important}
  .print-report tfoot{display:table-footer-group!important}
  .print-report thead th{background:#e7efe9!important;color:#173421!important;font-weight:800!important}
  .print-report tbody tr:nth-child(even){background:#f8faf9!important}
  .print-report tfoot th{background:#dceade!important;color:#123920!important;font-weight:800!important}
  .print-report tr{break-inside:avoid!important}
}

/* FINAL PAYROLL RESPONSIVE POLISH — 2026-08-04 */
.payroll-stepper{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;
  padding:18px 20px!important;
  overflow:visible!important;
}
.payroll-stepper>div{
  position:relative!important;
  display:grid!important;
  grid-template-columns:34px minmax(0,1fr)!important;
  grid-template-rows:34px auto auto!important;
  column-gap:10px!important;
  row-gap:3px!important;
  align-items:center!important;
  min-width:0!important;
  min-height:82px!important;
  padding:0 18px 0 0!important;
  overflow:visible!important;
}
.payroll-stepper>div::after{
  content:""!important;
  position:absolute!important;
  left:42px!important;
  right:-4px!important;
  top:16px!important;
  width:auto!important;
  height:2px!important;
  background:#dfe8e2!important;
  z-index:0!important;
  pointer-events:none!important;
}
.payroll-stepper>div.done::after{background:#8fd0aa!important}
.payroll-stepper>div:last-child::after{display:none!important}
.payroll-stepper>div>span{
  grid-column:1!important;
  grid-row:1!important;
  position:relative!important;
  z-index:2!important;
  width:32px!important;
  height:32px!important;
  align-self:start!important;
}
.payroll-stepper>div>b{
  grid-column:1/-1!important;
  grid-row:2!important;
  position:relative!important;
  z-index:2!important;
  margin:2px 0 0!important;
  padding:0!important;
  font-size:11.5px!important;
  line-height:1.28!important;
  white-space:normal!important;
  text-decoration:none!important;
}
.payroll-stepper>div>small{
  grid-column:1/-1!important;
  grid-row:3!important;
  position:relative!important;
  z-index:2!important;
  margin:0!important;
  padding:0!important;
  font-size:9.5px!important;
  line-height:1.3!important;
  white-space:normal!important;
}
.payroll-main-grid{grid-template-columns:minmax(0,1fr) 290px!important;min-width:0!important}
.payroll-work-card{min-width:0!important;overflow:hidden!important}
.payroll-filters{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:9px!important;
  padding:13px 14px!important;
}
.payroll-filters>.payroll-search{flex:1 1 280px!important;min-width:220px!important}
.payroll-filters>select{flex:1 1 145px!important;min-width:130px!important;max-width:210px!important}
.payroll-filters>input[type="month"]{flex:0 1 155px!important;min-width:145px!important}
.payroll-filters>.btn{
  flex:0 0 auto!important;
  min-width:148px!important;
  min-height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  white-space:nowrap!important;
  overflow:visible!important;
  visibility:visible!important;
  opacity:1!important;
}
.payroll-tabs{scrollbar-width:thin!important}
.payroll-table{width:100%!important}
.payroll-table th,.payroll-table td{vertical-align:middle!important}
.payroll-side{min-width:0!important}
.payroll-summary,.payroll-settings{overflow:hidden!important}

@media(max-width:1260px){
  .payroll-main-grid{grid-template-columns:1fr!important}
  .payroll-side{grid-template-columns:1fr 1fr!important}
}
@media(max-width:1020px){
  .payroll-stepper{grid-template-columns:repeat(5,minmax(145px,1fr))!important;overflow-x:auto!important}
  .payroll-stepper>div{min-width:145px!important}
}
@media(max-width:760px){
  .payroll-stepper{grid-template-columns:1fr!important;overflow:visible!important;padding:14px!important;gap:8px!important}
  .payroll-stepper>div{grid-template-columns:34px minmax(0,1fr)!important;grid-template-rows:auto auto!important;min-height:54px!important;padding:0!important}
  .payroll-stepper>div::after{display:none!important}
  .payroll-stepper>div>span{grid-column:1!important;grid-row:1/3!important;align-self:start!important}
  .payroll-stepper>div>b{grid-column:2!important;grid-row:1!important;margin:2px 0 0!important}
  .payroll-stepper>div>small{grid-column:2!important;grid-row:2!important}
  .payroll-filters{display:grid!important;grid-template-columns:1fr!important}
  .payroll-filters>*{width:100%!important;max-width:none!important;min-width:0!important}
  .payroll-side{grid-template-columns:1fr!important}
}

@media print{
  .payroll-stepper,.payroll-kpis,.payroll-tabs,.payroll-filters,.payroll-side,.payroll-bottom-grid,.payroll-info{display:none!important}
  .payroll-main-grid{display:block!important}
  .payroll-work-card,.payroll-sheet-card{border:0!important;box-shadow:none!important;overflow:visible!important}
  .payroll-payment-sheet{width:100%!important;min-width:0!important;border-collapse:collapse!important;font-size:8pt!important}
  .payroll-payment-sheet th,.payroll-payment-sheet td{border:1px solid #9ca9a1!important;padding:5px 6px!important;color:#111!important;background:#fff!important}
  .payroll-payment-sheet thead th{background:#e9efeb!important;font-weight:800!important}
  .payroll-payment-sheet tfoot th{background:#dde9e1!important;font-weight:900!important}
}

/* Wallet navigation visibility — 20260807 final */
.farmer-nav-item.wallet-nav-primary{margin-top:3px}.farmer-nav-item.wallet-nav-child{min-height:34px;padding-left:20px;font-size:10.8px;color:rgba(255,255,255,.84)}.farmer-nav-item.wallet-nav-child>span{width:18px}.nav-link.wallet-nav-child{padding-left:25px;font-size:11px}.nav-link.wallet-nav-primary{margin-top:2px}@media(max-width:1040px){.farmer-nav-item.wallet-nav-child{padding-left:22px}}

/* Wallet navigation visibility — 2026-08-07 final */
.farmer-nav-caption.wallet-nav-caption{margin-top:8px;padding-top:10px;color:rgba(255,255,255,.88);font-weight:700;letter-spacing:.55px;border-top:1px solid rgba(255,255,255,.10)}
.nav-caption.wallet-nav-caption{display:block;margin:11px 12px 5px;padding-top:10px;color:var(--muted,#667085);font-size:9px;font-weight:750;letter-spacing:.55px;text-transform:uppercase;border-top:1px solid var(--line,#e4e7ec)}
.farmer-nav-item.wallet-nav-primary{min-height:40px;background:rgba(255,255,255,.055)}
.farmer-nav-item.wallet-nav-primary:hover{background:rgba(255,255,255,.10)}
.farmer-nav-item.wallet-nav-primary.active{background:linear-gradient(90deg,#159447,#16a149)}
@media(max-width:1040px){.farmer-nav-caption.wallet-nav-caption{position:relative;z-index:1}}

/* Fees & Charges uses the same standard navigation treatment as every other Finance menu item. */


/* Farmer bulk upload — 2026-08-07 */
.bulk-farmer-page{display:flex;flex-direction:column;gap:14px;min-width:0}
.bulk-farmer-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 20px;border:1px solid #e4ebe7;border-radius:11px;background:linear-gradient(135deg,#fff 0%,#fbfefc 70%,#f2fbf6 100%);box-shadow:0 3px 14px rgba(25,58,40,.045)}
.bulk-farmer-hero>div{max-width:820px}.bulk-farmer-hero h2{margin:6px 0 5px;font-size:18px;line-height:1.25;color:#1e2d24}.bulk-farmer-hero p{margin:0;color:#68766e;font-size:11.5px;line-height:1.6}.bulk-farmer-eyebrow{display:inline-flex;align-items:center;gap:7px;color:#128748;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.7px}.bulk-template-button{flex:0 0 auto;min-height:40px;white-space:nowrap}
.bulk-farmer-steps{display:grid;grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr) 54px minmax(0,1fr);align-items:center;gap:0;padding:14px 18px;border:1px solid #e5ebe7;border-radius:10px;background:#fff}
.bulk-farmer-steps article{display:flex;align-items:center;gap:10px;min-width:0}.bulk-farmer-steps article>span{display:grid;place-items:center;width:31px;height:31px;flex:0 0 31px;border-radius:50%;background:#14934f;color:#fff;font-size:11px;font-weight:900}.bulk-farmer-steps article div{display:grid;gap:2px}.bulk-farmer-steps strong{font-size:11px;color:#2a382f}.bulk-farmer-steps small{font-size:9.5px;line-height:1.35;color:#7a867f}.bulk-farmer-steps>i{height:1px;margin:0 12px;background:linear-gradient(90deg,#d4ddd7,#b9dcca);position:relative}.bulk-farmer-steps>i:after{content:"";position:absolute;right:-1px;top:-2px;width:5px;height:5px;border-top:1px solid #9fcdb1;border-right:1px solid #9fcdb1;transform:rotate(45deg)}
.bulk-farmer-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start;min-width:0}.bulk-farmer-main,.bulk-farmer-side{display:grid;gap:14px;min-width:0}.bulk-farmer-side{position:sticky;top:82px}.bulk-farmer-side>.panel{padding:16px}.bulk-farmer-side h3{margin:0 0 6px;font-size:12px;color:#26352c}.bulk-farmer-side>section>p{margin:0;color:#748078;font-size:10px;line-height:1.55}
.bulk-upload-card,.bulk-result-card{padding:0!important;overflow:hidden}.bulk-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:15px 17px;border-bottom:1px solid #e9eeeb}.bulk-card-heading h2,.bulk-card-heading h3{margin:0;font-size:13px;color:#243229}.bulk-card-heading p{margin:4px 0 0;font-size:9.8px;color:#7a867f}.bulk-security-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;background:#eef9f2;color:#117c43;font-size:9.5px;font-weight:800;white-space:nowrap}
.bulk-farmer-form{padding:17px}.bulk-drop-zone{position:relative;min-height:225px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:22px;text-align:center;border:1.5px dashed #bbd1c4;border-radius:10px;background:#fbfefc;cursor:pointer;transition:.18s ease}.bulk-drop-zone:hover,.bulk-drop-zone.is-dragging{border-color:#15944f;background:#f3fbf6;box-shadow:inset 0 0 0 1px rgba(21,148,79,.04)}.bulk-drop-zone.has-file{border-style:solid;border-color:#8ec4a3;background:#f5fbf7}.bulk-drop-zone input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.bulk-upload-icon{display:grid;place-items:center;width:47px;height:47px;border-radius:13px;background:#eaf7ef;color:#118348}.bulk-drop-zone strong{font-size:12px;color:#2a3930;max-width:560px;overflow-wrap:anywhere}.bulk-drop-zone small{font-size:10px;color:#7e8983;line-height:1.5}.bulk-drop-zone em{margin-top:4px;padding:8px 13px;border:1px solid #cfe0d6;border-radius:7px;background:#fff;color:#107d43;font-size:10px;font-style:normal;font-weight:800}
.bulk-import-assurance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:12px}.bulk-import-assurance>div{display:flex;gap:8px;align-items:flex-start;padding:11px;border:1px solid #e8eeea;border-radius:8px;background:#fcfdfc;color:#168348}.bulk-import-assurance span{display:grid;gap:3px}.bulk-import-assurance b{font-size:10px;color:#2e3b33}.bulk-import-assurance small{font-size:9px;line-height:1.45;color:#7a867f}.bulk-confirm{display:flex;align-items:flex-start;gap:9px;margin:13px 0 0;padding:10px 11px;border-radius:8px;background:#f7f9f8;color:#526058;font-size:10px;line-height:1.45}.bulk-confirm input{margin-top:2px;accent-color:#15944f}.bulk-form-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px}.bulk-form-actions .farmer-add-button,.bulk-form-actions .farmer-outline-button{min-height:39px}
.bulk-required-list{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:12px}.bulk-required-list span{display:flex;align-items:center;gap:6px;min-width:0;color:#4c5a51;font-size:9.5px}.bulk-required-list svg{color:#17924e;flex:0 0 auto}.bulk-side-rules{display:grid;gap:8px;margin-top:10px}.bulk-side-rules p{display:grid;gap:2px;margin:0;padding:9px;border-radius:7px;background:#f8faf9}.bulk-side-rules b{font-size:10px;color:#2d3b33}.bulk-side-rules span{font-size:9.3px;line-height:1.45;color:#748079}.bulk-group-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.bulk-group-list span{padding:5px 7px;border:1px solid #e2e9e5;border-radius:6px;background:#fafcfa;color:#55635b;font-size:9px}
.bulk-result-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:14px 16px}.bulk-result-kpis article{padding:12px;border:1px solid #e6ece8;border-radius:8px;background:#fafcfa}.bulk-result-kpis span{display:block;color:#748078;font-size:9.5px}.bulk-result-kpis b{display:block;margin-top:5px;color:#28362e;font-size:17px}.bulk-result-kpis article.success{background:#f2faf5;border-color:#d7ecdf}.bulk-result-kpis article.success b{color:#118046}.bulk-result-kpis article.warning{background:#fffaf2;border-color:#f1e4c8}.bulk-result-kpis article.warning b{color:#9b6410}.bulk-error-heading{padding:0 16px 10px}.bulk-error-heading h3{margin:0;font-size:11.5px;color:#29372f}.bulk-error-heading p{margin:4px 0 0;font-size:9.5px;line-height:1.5;color:#7a867f}.bulk-error-text{color:#a44b4b;font-size:10px;font-weight:650}.bulk-all-clear{display:flex;align-items:center;gap:10px;margin:0 16px 16px;padding:14px;border:1px solid #d7ecdf;border-radius:8px;background:#f4fbf6;color:#138049}.bulk-all-clear div{display:grid;gap:3px}.bulk-all-clear strong{font-size:11px;color:#2d3a32}.bulk-all-clear span{font-size:9.5px;color:#6e7b73}.farmer-bulk-button{white-space:nowrap}
@media(max-width:1180px){.bulk-farmer-layout{grid-template-columns:1fr}.bulk-farmer-side{position:static;grid-template-columns:repeat(3,minmax(0,1fr))}.bulk-farmer-steps{grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr) 32px minmax(0,1fr)}.bulk-farmer-steps>i{margin:0 5px}}
@media(max-width:820px){.bulk-farmer-hero{align-items:flex-start;flex-direction:column}.bulk-template-button{width:100%;justify-content:center}.bulk-farmer-steps{grid-template-columns:1fr;gap:8px}.bulk-farmer-steps>i{display:none}.bulk-farmer-steps article{padding:4px 0}.bulk-farmer-side{grid-template-columns:1fr}.bulk-import-assurance{grid-template-columns:1fr}.bulk-form-actions{align-items:stretch;flex-direction:column-reverse}.bulk-form-actions>*{width:100%;justify-content:center}.bulk-result-kpis{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:560px){.bulk-farmer-hero{padding:15px}.bulk-farmer-hero h2{font-size:16px}.bulk-farmer-form{padding:12px}.bulk-drop-zone{min-height:200px;padding:18px 13px}.bulk-card-heading{padding:13px;flex-direction:column}.bulk-security-pill{align-self:flex-start}.bulk-required-list{grid-template-columns:1fr}.bulk-result-kpis{grid-template-columns:1fr;padding:12px}.bulk-farmer-side>.panel{padding:14px}}
.farmer-tip-card .farmer-bulk-tip{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;min-height:39px;margin-top:8px;border:1px solid #d5e2da;border-radius:7px;background:#fff;color:#167d47;font-size:10.5px;font-weight:800;text-decoration:none}.farmer-tip-card .farmer-bulk-tip:hover{border-color:#9bc8ad;background:#f5fbf7}


/* GreenLeaf Administration — Users / Roles reference-match update */
.gl-admin-shell{display:grid;gap:16px;color:#10183d}.gl-page-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.gl-page-head h1{font-size:28px;margin:0 0 4px;color:#121b4b}.gl-page-head p{margin:0;color:#667085}.gl-breadcrumb{margin-top:12px;font-size:12px;color:#17204d}.gl-breadcrumb b{margin:0 8px;color:#98a2b3}.gl-head-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.gl-btn,.gl-wide-btn{border:1px solid #dfe5e2;background:#fff;color:#17392d;border-radius:5px;padding:10px 16px;font-weight:700;text-decoration:none;cursor:pointer}.gl-btn.primary{background:#006c45;color:#fff;border-color:#006c45}.gl-metrics{display:grid;gap:14px}.gl-metrics.five{grid-template-columns:repeat(5,minmax(0,1fr))}.gl-metrics article{background:#fff;border:1px solid #e6ebe9;border-radius:6px;padding:18px;display:flex;align-items:center;gap:14px;min-height:92px}.gl-metrics i{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:20px;background:#eaf7f1;color:#087a4d}.gl-metrics i.o{background:#fff3e7;color:#dd7b14}.gl-metrics i.r{background:#fff0f1;color:#d62f43}.gl-metrics i.b{background:#edf5ff;color:#2876cc}.gl-metrics i.p{background:#f5edff;color:#8b42d5}.gl-metrics span{font-size:12px;font-weight:700}.gl-metrics strong{display:block;font-size:22px;margin:4px 0;color:#121b4b}.gl-metrics small{font-weight:500;color:#667085}.gl-card{background:#fff;border:1px solid #e5e9e7;border-radius:6px;padding:16px}.gl-card h2,.gl-card h3{margin:0 0 14px;color:#10183d}.gl-users-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:14px}.gl-user-table-card{padding:0;overflow:hidden}.gl-filter-row{padding:16px;display:grid;grid-template-columns:minmax(250px,1.5fr) repeat(2,minmax(130px,.6fr)) auto;gap:10px;border-bottom:1px solid #edf0ef}.gl-filter-row select,.gl-search{height:40px;border:1px solid #dfe5e2;border-radius:5px;background:#fff}.gl-search{display:flex;align-items:center;padding:0 12px;gap:8px}.gl-search input{border:0;outline:0;width:100%;font:inherit}.gl-filter-row select{padding:0 10px}.gl-table-wrap{overflow:auto}.gl-table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap}.gl-table th{background:#fafbfb;text-align:left;color:#30395f;font-size:11px;padding:11px 10px;border-bottom:1px solid #e8ecea}.gl-table td{padding:11px 10px;border-bottom:1px solid #edf0ef;color:#344054}.gl-person{display:flex;align-items:center;gap:8px}.gl-person span,.gl-profile>span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#e9f5ef;color:#087a4d;font-weight:800}.gl-role-tag{font-style:normal;background:#eaf7f1;color:#126546;padding:4px 7px;border-radius:3px;font-size:10px}.gl-status{font-style:normal;font-size:11px;color:#087a4d}.gl-status.inactive{color:#667085}.gl-status.blocked{color:#d62f43}.gl-actions{display:flex;gap:5px}.gl-actions button,.gl-actions a,.gl-actions span{border:1px solid #e3e8e5;background:#fff;border-radius:4px;padding:5px 7px;color:#475467;text-decoration:none}.gl-table-foot{padding:12px 16px;display:flex;justify-content:space-between;align-items:center;font-size:11px}.gl-table-foot button{border:1px solid #e1e6e3;background:#fff;padding:6px 10px;border-radius:4px}.gl-table-foot button.active{background:#087a4d;color:#fff}.gl-user-side{display:grid;gap:12px;align-content:start}.gl-profile{display:flex;gap:12px;align-items:center;margin:6px 0 16px}.gl-profile>span{width:46px;height:46px}.gl-profile div>*{display:block;margin:2px 0}.gl-profile small{color:#667085}.gl-user-side dl{display:grid;grid-template-columns:95px 1fr;gap:10px;font-size:11px;margin:0}.gl-user-side dt{color:#667085}.gl-user-side dd{margin:0;text-align:right;overflow-wrap:anywhere}.gl-wide-btn{display:block;width:100%;text-align:left;margin-top:8px;padding:9px 10px}.gl-checks{list-style:none;padding:0;margin:0;display:grid;gap:10px;font-size:11px;color:#344054}.gl-bottom-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:14px}.gl-bottom-grid.three{grid-template-columns:repeat(3,1fr)}.gl-role-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.gl-role-summary article{border:1px solid #edf0ef;border-radius:5px;padding:12px}.gl-role-summary small{display:block;color:#667085;margin-top:5px}.gl-donut-row{display:flex;align-items:center;justify-content:center;gap:30px}.gl-donut{width:110px;height:110px;border-radius:50%;background:conic-gradient(#087a4d calc(var(--p)*1%),#e9eeec 0);position:relative;display:grid;place-items:center}.gl-donut:after{content:"";position:absolute;inset:17px;border-radius:50%;background:#fff}.gl-donut b,.gl-donut small{z-index:1;position:absolute}.gl-donut b{margin-top:-12px;font-size:20px}.gl-donut small{margin-top:22px;font-size:9px}.gl-tabs{background:#fff;border:1px solid #e5e9e7;border-radius:6px 6px 0 0;display:flex;gap:30px;padding:0 18px;overflow:auto}.gl-tabs>*{padding:13px 0;white-space:nowrap;font-size:12px}.gl-tabs b{color:#087a4d;border-bottom:2px solid #087a4d}.gl-role-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:14px}.gl-card-head{display:flex;justify-content:space-between;align-items:center;gap:20px}.gl-card-head p{margin:4px 0;color:#667085;font-size:11px}.gl-card-head select{min-width:200px;padding:9px;border:1px solid #dfe5e2;border-radius:5px}.gl-permissions th:not(:first-child),.gl-permissions td:not(:first-child){text-align:center}.perm.yes{color:#087a4d;font-weight:900}.perm.no{color:#e03d4f}.gl-big-number{font-size:32px;font-weight:800;margin:5px 0;color:#087a4d}.gl-savebar{display:flex;justify-content:space-between;align-items:center;background:#eef8f4;border:1px solid #dceee7;border-radius:5px;padding:12px 16px;font-size:11px}.gl-form-grid{display:grid;grid-template-columns:1.25fr .9fr .9fr;gap:14px}.gl-fields{display:grid;gap:14px}.gl-fields.two{grid-template-columns:1fr 1fr}.gl-fields label{display:grid;gap:7px;font-size:11px;font-weight:700}.gl-fields input,.gl-fields select,.gl-fields textarea{width:100%;border:1px solid #dfe5e2;border-radius:5px;padding:10px 11px;min-height:40px;background:#fff;color:#344054}.gl-fields textarea{min-height:62px;resize:vertical}.gl-note{background:#eef8f4;border:1px solid #d8eee5;border-radius:5px;padding:13px;color:#285a49;line-height:1.7}.gl-upload{height:140px;border:1px solid #dfe5e2;border-radius:5px;display:grid;place-items:center;align-content:center;gap:7px;margin-bottom:16px;font-size:25px}.gl-upload b{font-size:11px}.gl-upload small{font-size:10px;color:#667085}.gl-strength{display:flex;align-items:center;gap:12px;margin:15px 0}.gl-strength span{height:5px;background:#087a4d;border-radius:10px;flex:1}.gl-strength b{font-size:10px;background:#eaf7f1;color:#087a4d;padding:4px 8px;border-radius:3px}.gl-rules{display:grid;grid-template-columns:1fr 1fr;gap:12px;color:#285a49;font-size:11px}.gl-radio{display:flex!important;align-items:center;gap:8px;font-weight:500!important}.gl-radio input{width:auto;min-height:0}.gl-create-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:14px}.gl-create-footer>div:last-child{display:flex;gap:12px}.gl-create-footer .gl-note{max-width:460px}.gl-create-form .gl-card{min-height:100%}
@media(max-width:1200px){.gl-metrics.five{grid-template-columns:repeat(3,1fr)}.gl-users-grid,.gl-role-layout{grid-template-columns:1fr}.gl-user-side{grid-template-columns:repeat(3,1fr)}.gl-form-grid{grid-template-columns:1fr 1fr}.gl-form-grid>section:nth-child(3),.gl-form-grid>section:nth-child(6){grid-column:auto}.gl-bottom-grid.three{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.gl-page-head,.gl-create-footer{flex-direction:column}.gl-head-actions{justify-content:flex-start}.gl-metrics.five{grid-template-columns:1fr 1fr}.gl-filter-row{grid-template-columns:1fr 1fr}.gl-search{grid-column:1/-1}.gl-user-side,.gl-bottom-grid,.gl-bottom-grid.three,.gl-form-grid{grid-template-columns:1fr}.gl-role-summary{grid-template-columns:1fr 1fr}.gl-fields.two{grid-template-columns:1fr}.gl-tabs{gap:20px}.gl-savebar{align-items:flex-start;gap:12px;flex-direction:column}.gl-create-footer>div:last-child{width:100%}.gl-create-footer .gl-btn{flex:1;text-align:center}}
@media(max-width:480px){.gl-metrics.five{grid-template-columns:1fr}.gl-filter-row{grid-template-columns:1fr}.gl-role-summary{grid-template-columns:1fr}.gl-page-head h1{font-size:23px}}


/* Functional Roles & Permissions controls */
.gl-tabs a{color:#475467;text-decoration:none;font-weight:650}.gl-tabs a.active{color:#087a4d;border-bottom:2px solid #087a4d}.perm-check{display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.perm-check input{position:absolute;opacity:0;pointer-events:none}.perm-check span{width:18px;height:18px;border:1px solid #cfd8d4;border-radius:4px;background:#fff;display:grid;place-items:center;transition:.15s ease}.perm-check input:checked+span{background:#087a4d;border-color:#087a4d}.perm-check input:checked+span:after{content:'✓';color:#fff;font-size:12px;font-weight:900}.gl-actions details{position:relative}.gl-actions summary{list-style:none;border:1px solid #e3e8e5;background:#fff;border-radius:4px;padding:5px 7px;color:#475467;cursor:pointer}.gl-actions summary::-webkit-details-marker{display:none}.gl-action-menu{position:absolute;right:0;top:32px;z-index:20;background:#fff;border:1px solid #dfe5e2;box-shadow:0 10px 28px rgba(16,24,40,.12);border-radius:6px;min-width:140px;padding:6px}.gl-action-menu form{margin:0}.gl-action-menu button{width:100%;border:0!important;text-align:left;background:#fff!important;padding:8px 10px!important}.gl-action-menu button:hover{background:#f5f8f6!important}.inline-form{display:flex;gap:8px;align-items:center}.inline-form select{min-width:170px;border:1px solid #dfe5e2;border-radius:5px;padding:8px;background:#fff}.gl-btn.danger{border-color:#f1c8ce;color:#c93043;background:#fff7f8}.role-hierarchy-list{display:grid;gap:10px}.role-hierarchy-list article{display:grid;grid-template-columns:minmax(180px,1fr) minmax(160px,1fr) auto;gap:14px;align-items:center;border:1px solid #e9eeec;border-radius:6px;padding:12px 14px}.role-hierarchy-list a{color:#087a4d;text-decoration:none;font-weight:700}.empty-state{padding:30px;border:1px dashed #d7dfdb;border-radius:8px;text-align:center;color:#667085;background:#fbfcfc}.empty-state b{display:block;color:#344054;margin-bottom:6px}
@media(max-width:760px){.role-hierarchy-list article{grid-template-columns:1fr}.inline-form{align-items:stretch;flex-direction:column}.inline-form select{width:100%}}
.permission-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px;border:1px solid #e6ebe8;border-radius:6px;padding:12px;background:#fbfcfc}.permission-module-grid label{display:flex;align-items:center;gap:8px;font-weight:600!important}.permission-module-grid input{width:auto;min-height:0}@media(max-width:640px){.permission-module-grid{grid-template-columns:1fr}}

/* MENU ORGANIZATION 20260810-v2 */
.farmer-flat-nav>.farmer-nav-caption{display:block!important;margin:18px 14px 7px!important;padding:0!important;font-size:10px!important;font-weight:800!important;letter-spacing:.075em!important;color:rgba(255,255,255,.58)!important;text-transform:uppercase!important;}
.farmer-flat-nav>.farmer-nav-caption:first-child{margin-top:8px!important;}
.farmer-flat-nav>.farmer-nav-item{display:flex!important;align-items:center!important;gap:10px!important;min-height:39px!important;margin:2px 8px!important;padding:9px 11px!important;border-radius:7px!important;}
.farmer-flat-nav>.farmer-nav-item.active{background:rgba(27,180,92,.9)!important;color:#fff!important;}
.nav-flat>.section-caption{margin-top:18px!important;margin-bottom:6px!important;}


/* 2026-08-10 Payment Advances farmer-first + institution registration polish */
.advance-select-empty{margin:18px 0 6px;padding:46px 24px;border:1px dashed #cbd5e1;border-radius:16px;background:#f8fafc;text-align:center;color:#64748b}.advance-select-empty span{display:inline-flex;width:54px;height:54px;align-items:center;justify-content:center;border-radius:14px;background:#eef2ff;color:#4f46e5;margin-bottom:12px}.advance-select-empty h3{margin:0 0 7px;color:#0f172a;font-size:18px}.advance-select-empty p{max-width:720px;margin:0 auto;line-height:1.6}.institution-registration-card{margin-bottom:18px}.institution-registration-form{display:grid;gap:14px}.institution-registration-form .farmer-form-card{margin:0}.institution-registration-form .farmer-form-card h2{display:flex;align-items:center;gap:9px}.institution-registration-form .farmer-form-card h2 i{display:inline-flex;align-items:center;justify-content:center;width:25px;height:25px;border-radius:8px;background:#eef2ff;color:#4f46e5;font-style:normal;font-size:12px}.institution-form-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:2px}.institution-form-actions>span{font-size:12px;color:#64748b}.institution-form-actions>div{display:flex;gap:10px}@media(max-width:780px){.institution-form-actions{align-items:stretch;flex-direction:column}.institution-form-actions>div{display:grid;grid-template-columns:1fr 1fr}.advance-select-empty{padding:34px 18px}}
/* Income Analytics reference layout */
.ia-page{display:flex;flex-direction:column;gap:14px}.ia-toolbar{display:flex;justify-content:space-between;align-items:center}.ia-toolbar-actions{display:flex;gap:10px}.ia-btn{height:38px;padding:0 16px;border:1px solid #dce3e8;border-radius:7px;background:#fff;color:#0d163c;font-weight:700;display:inline-flex;align-items:center;gap:8px}.ia-btn.primary{background:#087f42;color:#fff;border-color:#087f42}.ia-filter-panel{display:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:14px;border:1px solid #e4e8ec;border-radius:10px;background:#fff}.ia-filter-panel.show{display:grid}.ia-filter-panel label{font-size:12px;font-weight:700;color:#162044}.ia-filter-panel input,.ia-filter-panel select{width:100%;height:40px;margin-top:6px;border:1px solid #dfe4e8;border-radius:7px;padding:0 10px;background:#fff}.ia-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.ia-kpis article{position:relative;min-height:103px;border:1px solid #e5e9ed;border-radius:10px;background:#fff;padding:18px 62px 15px 16px;box-shadow:0 1px 2px rgba(11,31,47,.02)}.ia-kpis small{display:block;font-size:10px;font-weight:800;color:#27324d;letter-spacing:.02em}.ia-kpis strong{display:block;margin-top:7px;font-size:21px;line-height:1.1;color:#111a3f}.ia-kpis .source-name{font-size:17px}.ia-kpis span{display:block;margin-top:7px;font-size:10px;color:#556078}.ia-kpis span.up{color:#118747;font-weight:700}.ia-kpis span em{font-style:normal;color:#667085;font-weight:500}.ia-kpis i{position:absolute;right:15px;top:25px;width:43px;height:43px;border-radius:10px;display:grid;place-items:center;font-style:normal}.ia-kpis i.green{background:#eaf8ef;color:#128547}.ia-kpis i.blue{background:#edf5ff;color:#176fca}.ia-kpis i.orange{background:#fff4e6;color:#f08a16}.ia-kpis i.violet{background:#f4efff;color:#7347d4}.ia-main-panel{border:1px solid #e4e9ed;border-radius:10px;background:#fff;overflow:hidden}.ia-tabs{display:flex;gap:10px;align-items:center;overflow-x:auto;border-bottom:1px solid #e9edf0;padding:0 14px}.ia-tabs a{white-space:nowrap;padding:13px 14px 11px;color:#3e4866;font-size:12px;text-decoration:none;border-bottom:2px solid transparent}.ia-tabs a.active{color:#087f42;border-color:#087f42;font-weight:700}.ia-top-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr}.ia-top-grid>.ia-box{border-radius:0;border-width:0 1px 1px 0}.ia-top-grid>.ia-box:last-child{border-right:0}.ia-box{background:#fff;border:1px solid #e8ecef;padding:16px}.ia-box h3{margin:0;color:#142045;font-size:15px}.ia-box-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.ia-box-head select{height:32px;border:1px solid #dfe5e9;border-radius:6px;background:#fff;padding:0 10px;font-size:11px}.axis-label{display:block;margin-top:12px;color:#56627b;font-size:10px}.ia-linechart{display:block;width:100%;height:180px;margin-top:3px}.ia-chart-labels{display:flex;justify-content:space-between;font-size:9px;color:#697386;padding:0 7px}.ia-legend-line{display:flex;justify-content:center;align-items:center;gap:6px;font-size:10px;color:#56627b;margin:9px 0}.ia-legend-line span{width:13px;height:3px;background:#087f42;border-radius:3px}.ia-trend-foot{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #eef1f3;padding-top:10px;gap:10px}.ia-trend-foot small{display:block;font-size:9px;color:#647086}.ia-trend-foot b{display:block;margin-top:3px;color:#10204a;font-size:12px}.ia-trend-foot em{font-style:normal;font-size:9px;font-weight:500}.ia-donut-layout{display:grid;grid-template-columns:175px 1fr;gap:18px;align-items:center;min-height:270px}.ia-donut{width:168px;height:168px;border-radius:50%;display:grid;place-items:center}.ia-donut>div{width:108px;height:108px;border-radius:50%;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.ia-donut b{font-size:11px}.ia-donut strong{font-size:20px;color:#111a3f}.ia-donut span{font-size:9px;color:#647086}.ia-donut-legend{display:flex;flex-direction:column;gap:8px}.ia-donut-legend>div{display:flex;gap:7px;align-items:flex-start}.ia-donut-legend>div>span{width:8px;height:8px;border-radius:50%;margin-top:4px;flex:0 0 auto}.ia-donut-legend p{margin:0}.ia-donut-legend b{display:block;font-size:10px;color:#152043}.ia-donut-legend em{display:block;font-style:normal;font-size:9px;color:#536079;margin-top:2px}.ia-bottom-grid{display:grid;grid-template-columns:2.2fr 1fr}.ia-bottom-grid>.ia-box{border-radius:0;border-width:0 1px 0 0}.ia-bottom-grid>.ia-box:last-child{border-right:0}.ia-table-wrap{overflow-x:auto;margin-top:12px}.ia-table{width:100%;border-collapse:collapse;min-width:760px}.ia-table th,.ia-table td{padding:9px 8px;border-bottom:1px solid #edf0f2;font-size:10px;text-align:left;color:#293350}.ia-table th{font-size:9px;color:#5b6680;font-weight:800}.ia-table td:nth-child(n+3),.ia-table th:nth-child(n+3){text-align:right}.ia-table tfoot th{font-weight:800;color:#10204a}.ia-table .pos{color:#118747;font-weight:700}.ia-table .neg{color:#e53945;font-weight:700}.spark{color:#128547;letter-spacing:-2px;font-size:15px}.spark.red{color:#e53945}.ia-highlights{padding:16px 18px}.ia-highlights>div{display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid #edf1f3}.ia-highlights>div:last-child{border-bottom:0}.ia-highlights i{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-style:normal}.ia-highlights i.blue{background:#eef5ff;color:#176fca}.ia-highlights i.green{background:#ecf8f0;color:#108548}.ia-highlights i.orange{background:#fff4e7;color:#f0921b}.ia-highlights p{margin:0}.ia-highlights p small{display:block;font-size:9px;color:#5c6880}.ia-highlights p b{display:block;font-size:10px;color:#172348;margin-top:2px}.ia-highlights>div>strong{text-align:right;font-size:15px;color:#087f42}.ia-highlights>div>strong em{display:block;font-style:normal;font-size:9px;color:#536079;font-weight:500;margin-top:3px}.ia-note{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 13px;border:1px solid #e5eee8;border-radius:8px;background:#f7fbf8;color:#47705a;font-size:10px}.ia-note span{display:flex;align-items:center;gap:7px}
@media(max-width:1280px){.ia-kpis{grid-template-columns:repeat(3,1fr)}.ia-top-grid{grid-template-columns:1fr 1fr}.ia-top-grid>.ia-box:first-child{grid-column:1/-1}.ia-bottom-grid{grid-template-columns:1fr}}
@media(max-width:800px){.ia-filter-panel{grid-template-columns:1fr}.ia-kpis{grid-template-columns:1fr 1fr}.ia-top-grid{grid-template-columns:1fr}.ia-top-grid>.ia-box:first-child{grid-column:auto}.ia-donut-layout{grid-template-columns:1fr;justify-items:center}.ia-donut-legend{width:100%}.ia-trend-foot{grid-template-columns:1fr}.ia-note{flex-direction:column;align-items:flex-start}.ia-toolbar{justify-content:flex-end}}
@media(max-width:520px){.ia-kpis{grid-template-columns:1fr}.ia-toolbar-actions{width:100%}.ia-btn{flex:1;justify-content:center}}

/* System Overview v2 — exact reference composition */
.system-overview-v2{display:flex;flex-direction:column;gap:16px;min-width:0;padding-bottom:8px}.so-top-actions{display:flex;justify-content:flex-end;margin-top:-4px}.so-export{display:inline-flex;align-items:center;gap:8px;padding:10px 15px;background:#08783f;color:#fff!important;border-radius:5px;font-size:12px;font-weight:700;text-decoration:none;box-shadow:0 1px 2px rgba(0,0,0,.05)}.so-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.so-kpi,.so-card{background:#fff;border:1px solid #e8eceb;border-radius:8px;box-shadow:0 1px 2px rgba(15,23,42,.025)}.so-kpi{min-height:108px;padding:19px 16px;display:flex;align-items:center;position:relative;overflow:hidden}.so-kpi>div{min-width:0;flex:1}.so-kpi small{display:block;font-size:10px;color:#22314f;font-weight:700;letter-spacing:.01em;margin-bottom:7px}.so-kpi strong{display:block;color:#0b1838;font-size:22px;line-height:1.12;white-space:nowrap}.so-kpi p{font-size:9.5px;color:#64748b;margin:8px 0 0}.so-kpi p b{color:#109258}.so-kpi>button{position:absolute;right:12px;top:11px;border:0;background:transparent;font-size:18px;color:#16213c}.so-icon{width:49px;height:49px;border-radius:12px;display:grid;place-items:center;margin-left:10px}.so-icon.green,.so-icon.mint{background:#eaf8ef;color:#0b9250}.so-icon.blue{background:#edf4ff;color:#2563c7}.so-icon.amber{background:#fff4e5;color:#f59e0b}.so-main-grid{display:grid;grid-template-columns:1.15fr 1.05fr 1fr;gap:15px}.so-mid-grid,.so-bottom-grid{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:15px}.so-card{min-width:0;overflow:hidden}.so-card-head{display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:13px 16px;border-bottom:1px solid #edf0ef;gap:10px}.so-card-head h2{display:flex;align-items:center;gap:8px;margin:0;color:#0b1838;font-size:14px;font-weight:750}.so-card-head>small{font-size:10px;color:#364152}.so-card-head select{height:30px;border:1px solid #dfe5e3;background:#fff;border-radius:5px;padding:0 28px 0 10px;color:#22314f;font-size:10px}.so-total{text-align:right}.so-total small{display:block;color:#667085;font-size:9px}.so-total b{display:block;font-size:14px;color:#0b1838}.so-legend{display:flex;justify-content:center;gap:20px;padding:11px 10px 0;font-size:9.5px;color:#3c4a60}.so-legend span:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.so-legend .g:before{background:#0b9654}.so-legend .b:before{background:#2166d5}.so-legend .o:before{background:#f59e0b}.so-legend .v:before{background:#8b5cf6}.so-line-chart{position:relative;height:200px;margin:7px 13px 12px 42px}.so-line-chart svg{width:100%;height:164px;overflow:visible}.so-line-chart .grid line{stroke:#edf1ef;stroke-width:.6}.so-line-chart .line{fill:none;stroke-width:1.35;vector-effect:non-scaling-stroke}.so-line-chart .transfer{stroke:#0b9654}.so-line-chart .payout{stroke:#2469d8}.so-line-chart .advance{stroke:#f59e0b}.so-line-chart .deposit{stroke:#8b5cf6}.axis-y{position:absolute;right:calc(100% + 7px);top:5px;height:155px;display:flex;flex-direction:column;justify-content:space-between;color:#566174;font-size:8.5px;text-align:right}.axis-x{display:flex;justify-content:space-between;font-size:8.5px;color:#566174;margin-top:-3px}.so-donut-row{display:grid;grid-template-columns:52% 48%;align-items:center;padding:20px 10px 18px}.so-donut{width:170px;height:170px;margin:auto;border-radius:50%;background:conic-gradient(#0b8e49 0 66.8%,#2469d8 66.8% 86.3%,#f59e0b 86.3% 94.8%,#8b5cf6 94.8% 98.4%,#64748b 98.4% 100%);position:relative}.so-donut:after{content:"";position:absolute;inset:34px;border-radius:50%;background:#fff}.so-donut>div{position:absolute;z-index:2;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#0b1838}.so-donut>div small{font-size:9px}.so-donut>div b{font-size:20px}.so-donut>div span{font-size:9px;color:#566174}.so-donut-legend p{display:flex;align-items:flex-start;gap:7px;margin:0 0 10px}.so-donut-legend i{width:7px;height:7px;border-radius:50%;margin-top:4px}.so-donut-legend i.g{background:#0b8e49}.so-donut-legend i.b{background:#2469d8}.so-donut-legend i.o{background:#f59e0b}.so-donut-legend i.v{background:#8b5cf6}.so-donut-legend i.s{background:#64748b}.so-donut-legend span{font-size:10px;font-weight:650;color:#22314f}.so-donut-legend small{display:block;font-size:9px;font-weight:500;color:#667085;margin-top:2px}.so-list{padding:0}.so-list p{min-height:47px;margin:0;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #edf0ef;font-size:10.5px}.so-list p span{display:flex;align-items:center;gap:9px;color:#334155}.so-list p b{font-size:11px;color:#0b1838}.so-list p b.green{color:#0a8c49}.so-list p b.amber{color:#ef9708}.so-list p b.blue{color:#1766cf}.so-list p b.red{color:#e53945}.so-foot-link{height:38px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;color:#08783f!important;text-decoration:none;font-weight:650;font-size:10px;background:#fbfdfc}.wallet-list p{min-height:38px}.wallet-dot{width:18px;height:18px;border-radius:6px;display:inline-block}.wallet-dot.c0{background:#eaf7ef}.wallet-dot.c1{background:#eef4ff}.wallet-dot.c2{background:#fff5e8}.wallet-dot.c3{background:#f4efff}.wallet-dot.c4{background:#fff0f1}.so-tx-head,.so-tx-list>div{display:grid;grid-template-columns:70px minmax(120px,1fr) 90px 72px 60px;align-items:center;column-gap:8px}.so-tx-head{padding:10px 13px 5px;font-size:8px;color:#475569;font-weight:700}.so-tx-list>div{padding:9px 13px;border-bottom:1px solid #edf0ef;font-size:8.8px;color:#26344d}.so-tx-list b{font-size:9px;color:#17213b}.so-tx-list em{font-style:normal;background:#eaf8ef;color:#18804b;padding:3px 6px;border-radius:4px;text-align:center;font-size:8px}.so-tx-list small{font-size:8px}.tx-type{font-weight:650}.so-empty{padding:30px;text-align:center;color:#7a8495;font-size:10px}.health p b{background:#eaf8ef;color:#11834a;border-radius:4px;padding:4px 8px;font-size:8.5px}.so-delivery-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:18px 14px 17px;gap:8px}.so-delivery-grid>div{text-align:center;min-width:0}.so-delivery-grid .di{width:46px;height:43px;border-radius:10px;display:grid;place-items:center;margin:0 auto 9px}.di.blue{background:#edf4ff;color:#2469d8}.di.violet{background:#f1edff;color:#6d47db}.di.green{background:#eaf8ef;color:#0a8d4d}.di.cyan{background:#eefbfb;color:#0994a6}.so-delivery-grid small{display:block;color:#334155;font-size:8.5px}.so-delivery-grid b{display:block;color:#0b1838;font-size:13px;margin-top:4px;white-space:nowrap}.so-delivery-grid em{display:block;color:#0a8d4d;font-size:9px;font-style:normal;margin-top:7px;font-weight:650}.so-ded-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:22px 14px 18px;gap:12px}.so-ded-grid small,.so-ded-grid b,.so-ded-grid strong{display:block}.so-ded-grid small{font-size:8.5px;color:#3c475b}.so-ded-grid b{font-size:11px;color:#0b1838;margin:7px 0}.so-ded-grid strong{font-size:8.5px;color:#3f4b60}.so-ded-grid i{display:block;height:5px;background:#edf0f2;border-radius:5px;margin-top:10px;overflow:hidden}.so-ded-grid i span{display:block;height:100%;background:#0c8e4e}.so-ded-grid i.blue span{background:#2469d8}.so-ded-grid i.amber span{background:#f59e0b}.so-ded-grid i.violet span{background:#8b5cf6}.so-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px}.so-actions a{min-height:66px;border:1px solid #edf0ef;border-radius:7px;background:#fafcfb;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-decoration:none;color:#344054;font-size:8.5px;font-weight:650}.so-actions a span{width:26px;height:26px;border-radius:7px;display:grid;place-items:center}.so-actions .green{color:#0b8e49;background:#eaf8ef}.so-actions .amber{color:#f59e0b;background:#fff4e5}.so-actions .blue{color:#2469d8;background:#edf4ff}.so-actions .violet{color:#7c3aed;background:#f3efff}.so-actions .mint{color:#0f8e73;background:#eafaf5}.so-actions .slate{color:#334155;background:#f1f5f9}.so-status{min-height:39px;border:1px solid #e7eeee;background:#f6fbf8;border-radius:6px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;color:#54806a;font-size:9px;gap:14px}.so-status span{display:flex;align-items:center;gap:7px}.system-overview-v2 .so-card,.system-overview-v2 .so-kpi{box-sizing:border-box}
@media(max-width:1280px){.so-kpi-grid{grid-template-columns:repeat(2,1fr)}.so-main-grid,.so-mid-grid,.so-bottom-grid{grid-template-columns:1fr 1fr}.so-main-grid .so-transaction-card,.so-bottom-grid>article:first-child{grid-column:1/-1}.so-payout-card .so-donut-row{grid-template-columns:170px 1fr}.so-tx-head,.so-tx-list>div{grid-template-columns:60px minmax(100px,1fr) 80px 65px 52px}}
@media(max-width:820px){.so-kpi-grid,.so-main-grid,.so-mid-grid,.so-bottom-grid{grid-template-columns:1fr}.so-main-grid .so-transaction-card,.so-bottom-grid>article:first-child{grid-column:auto}.so-kpi{min-height:100px}.so-payout-card .so-donut-row{grid-template-columns:1fr}.so-donut-legend{display:grid;grid-template-columns:1fr 1fr;margin-top:18px}.so-tx-head{display:none}.so-tx-list>div{grid-template-columns:70px 1fr 80px}.so-tx-list>div em,.so-tx-list>div small{grid-row:2;margin-top:4px}.so-delivery-grid,.so-ded-grid{grid-template-columns:repeat(2,1fr)}.so-actions{grid-template-columns:repeat(2,1fr)}.so-status{align-items:flex-start;flex-direction:column;padding:10px 12px}.so-top-actions{margin-top:0}.so-line-chart{margin-left:38px}}
@media(max-width:520px){.so-kpi-grid{grid-template-columns:1fr}.so-kpi strong{font-size:19px}.so-donut{width:150px;height:150px}.so-donut-legend{grid-template-columns:1fr}.so-delivery-grid,.so-ded-grid{grid-template-columns:1fr 1fr}.so-actions{grid-template-columns:1fr 1fr}.so-tx-list>div{grid-template-columns:60px 1fr}.so-tx-list>div b{grid-column:2}.so-tx-list>div em,.so-tx-list>div small{grid-column:auto}.so-card-head h2{font-size:13px}}

/* Income Analytics exact reference layout - 2026-08-10 */
.income-analytics-v2{display:flex;flex-direction:column;gap:15px;min-width:0;padding-bottom:6px}.income-analytics-v2 *{box-sizing:border-box}.ia-page-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:-4px}.ia-outline,.ia-filter-btn{height:36px;border-radius:6px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:11px;font-weight:700;cursor:pointer}.ia-outline{border:1px solid #dfe6e3;background:#fff;color:#22304d}.ia-filter-btn{border:1px solid #087a41;background:#087a41;color:#fff}.ia-filter-panel{display:none;grid-template-columns:repeat(2,minmax(160px,220px)) auto;gap:10px;justify-content:flex-end;align-items:end;background:#fff;border:1px solid #e7ecea;border-radius:7px;padding:12px}.ia-filter-panel.show{display:grid}.ia-filter-panel label{display:grid;gap:5px;color:#4b5567;font-size:9px;font-weight:700}.ia-filter-panel input{height:34px;border:1px solid #dce4e1;border-radius:5px;padding:0 9px;font-size:10px;background:#fff}.ia-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.ia-kpis article,.ia-card{background:#fff;border:1px solid #e8eceb;border-radius:8px;box-shadow:0 1px 2px rgba(15,23,42,.025)}.ia-kpis article{min-height:104px;padding:18px 14px 16px 17px;display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}.ia-kpis article>div{min-width:0}.ia-kpis small{display:block;color:#1d2944;font-size:9px;font-weight:750;letter-spacing:.01em}.ia-kpis strong{display:block;color:#0b1838;font-size:19px;line-height:1.15;margin:8px 0 6px;white-space:nowrap}.ia-kpis strong.source-name{font-size:16px;white-space:normal;line-height:1.08}.ia-kpis p{margin:0;color:#64748b;font-size:8.8px}.ia-kpis p.up{color:#0b8c4a}.ia-kpis p.down{color:#e12f42}.ia-kpi-icon{flex:0 0 47px;width:47px;height:47px;border-radius:12px;display:grid;place-items:center}.ia-kpi-icon.green{background:#eaf7ef;color:#0a8e4b}.ia-kpi-icon.blue{background:#edf4ff;color:#2166d5}.ia-kpi-icon.amber{background:#fff3e3;color:#f59e0b}.ia-kpi-icon.violet{background:#f3efff;color:#7c4ce0}.ia-tabs{display:flex;align-items:center;gap:32px;min-height:44px;padding:0 13px;border:1px solid #e8eceb;border-radius:8px 8px 0 0;background:#fff;overflow-x:auto;white-space:nowrap;margin-bottom:-15px}.ia-tabs a{position:relative;height:44px;display:flex;align-items:center;color:#334155;text-decoration:none;font-size:10px;font-weight:600}.ia-tabs a.active{color:#0b8b4a}.ia-tabs a.active:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#0b8b4a}.ia-chart-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:0;border:1px solid #e8eceb;border-radius:0 0 8px 8px;background:#fff;overflow:hidden}.ia-chart-grid>.ia-card{border:0;border-radius:0;box-shadow:none;border-right:1px solid #edf0ef;min-height:315px}.ia-chart-grid>.ia-card:last-child{border-right:0}.ia-card>header{min-height:47px;padding:14px 16px 8px;display:flex;align-items:center;justify-content:space-between;gap:10px}.ia-card>header h2{margin:0;color:#0b1838;font-size:13px;font-weight:750}.ia-card>header select{height:30px;border:1px solid #dfe5e3;background:#fff;border-radius:5px;padding:0 28px 0 10px;color:#22314f;font-size:9px}.ia-axis-title{display:block;padding:0 16px;color:#536176;font-size:8px}.ia-line-wrap{position:relative;height:184px;margin:4px 17px 0 45px}.ia-line-wrap svg{display:block;width:100%;height:150px;overflow:visible}.ia-gridlines line{stroke:#edf1ef;stroke-width:.65}.ia-y-axis{position:absolute;right:calc(100% + 7px);top:7px;height:137px;display:flex;flex-direction:column;justify-content:space-between;color:#586477;font-size:7.8px;text-align:right}.ia-x-axis{display:flex;justify-content:space-between;margin-top:-1px;color:#586477;font-size:7.8px}.ia-trend-legend{display:flex;justify-content:center;padding:1px 0 5px;color:#435064;font-size:8.5px}.ia-trend-legend i{display:inline-block;width:9px;height:3px;background:#0b8f4c;border-radius:2px;margin-right:5px;vertical-align:middle}.ia-trend-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px 16px 14px}.ia-trend-summary div{min-width:0}.ia-trend-summary small{display:block;color:#24324b;font-size:8px;font-weight:650}.ia-trend-summary b{display:block;color:#0b1838;font-size:10px;margin-top:5px}.ia-trend-summary em{font-style:normal;font-weight:500;color:#667085;font-size:8px}.ia-donut-layout{display:grid;grid-template-columns:54% 46%;align-items:center;padding:12px 10px 17px}.ia-donut{width:158px;height:158px;margin:auto;border-radius:50%;background:var(--donut);position:relative}.ia-donut:after{content:"";position:absolute;inset:34px;border-radius:50%;background:#fff}.ia-donut>div{position:absolute;z-index:2;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#0b1838}.ia-donut>div small{font-size:8px}.ia-donut>div b{font-size:18px;line-height:1.1}.ia-donut>div span{font-size:8px;color:#556176;margin-top:4px}.ia-donut-legend{padding-right:4px}.ia-donut-legend p{display:flex;align-items:flex-start;gap:7px;margin:0 0 8px}.ia-donut-legend i{flex:0 0 7px;width:7px;height:7px;border-radius:50%;margin-top:4px}.ia-donut-legend span{min-width:0}.ia-donut-legend b{display:block;color:#22314f;font-size:8.5px;line-height:1.15}.ia-donut-legend small{display:block;color:#586477;font-size:8px;line-height:1.4;margin-top:2px}.ia-lower-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:14px}.ia-summary-card,.ia-highlights-card{overflow:hidden}.ia-summary-card>header,.ia-highlights-card>header{min-height:48px;border-bottom:1px solid #edf0ef;padding:13px 16px}.ia-table-wrap{overflow-x:auto}.ia-table-wrap table{width:100%;border-collapse:collapse;font-size:8.6px;min-width:730px}.ia-table-wrap th{background:#fbfcfc;color:#485469;font-size:7.8px;font-weight:700;text-align:left;padding:9px 10px;border-bottom:1px solid #edf0ef;white-space:nowrap}.ia-table-wrap td{padding:8px 10px;border-bottom:1px solid #edf0ef;color:#24324b;white-space:nowrap}.ia-table-wrap td:nth-child(3),.ia-table-wrap td:nth-child(4),.ia-table-wrap td:nth-child(5),.ia-table-wrap td:nth-child(6){text-align:right}.ia-table-wrap tr.total td{font-weight:800;color:#0b1838;border-bottom:0;padding-top:12px;padding-bottom:12px}.ia-table-wrap .positive{color:#0a8f4e;font-weight:700}.ia-table-wrap .negative{color:#e3273b;font-weight:700}.ia-spark{width:66px;height:17px}.ia-highlights{padding:2px 0}.ia-highlights>div{display:grid;grid-template-columns:33px 1fr auto;align-items:center;gap:9px;min-height:58px;padding:9px 14px;border-bottom:1px solid #edf0ef}.ia-highlights>div:last-child{border-bottom:0}.ia-highlights>div>span{width:31px;height:31px;border-radius:9px;display:grid;place-items:center}.ia-highlights .blue{color:#2166d5;background:#edf4ff}.ia-highlights .green{color:#0a8e4b;background:#eaf7ef}.ia-highlights .amber{color:#f59e0b;background:#fff3e3}.ia-highlights p{margin:0}.ia-highlights p small{display:block;color:#526077;font-size:8px}.ia-highlights p b{display:block;color:#15213a;font-size:9px;margin-top:3px}.ia-highlights strong{text-align:right;color:#078647;font-size:12px}.ia-highlights strong small{display:block;color:#536176;font-size:7.8px;font-weight:500;margin-top:2px}.ia-status{min-height:38px;border:1px solid #e7eeee;background:#f6fbf8;border-radius:6px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;color:#54806a;font-size:8.5px;gap:14px}.ia-status span{display:flex;align-items:center;gap:6px}.page-analytics .farmer-top-print{display:none}
@media(max-width:1300px){.ia-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.ia-chart-grid{grid-template-columns:1.2fr 1fr}.ia-chart-grid>.ia-card:nth-child(3){grid-column:1/-1;border-top:1px solid #edf0ef}.ia-chart-grid>.ia-card:nth-child(2){border-right:0}.ia-lower-grid{grid-template-columns:1.45fr 1fr}.ia-donut-layout{grid-template-columns:180px 1fr}}
@media(max-width:980px){.ia-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.ia-chart-grid,.ia-lower-grid{grid-template-columns:1fr}.ia-chart-grid>.ia-card{border-right:0;border-bottom:1px solid #edf0ef}.ia-chart-grid>.ia-card:last-child{border-bottom:0}.ia-chart-grid>.ia-card:nth-child(3){grid-column:auto}.ia-tabs{gap:24px}.ia-filter-panel{justify-content:stretch;grid-template-columns:1fr 1fr auto}}
@media(max-width:640px){.ia-page-actions{display:grid;grid-template-columns:1fr 1fr;margin-top:0}.ia-outline,.ia-filter-btn{width:100%}.ia-filter-panel.show{grid-template-columns:1fr}.ia-kpis{grid-template-columns:1fr}.ia-kpis article{min-height:92px}.ia-kpis strong{font-size:18px}.ia-tabs{margin-left:-10px;margin-right:-10px;border-radius:0;padding-left:12px;gap:22px}.ia-chart-grid{margin-left:-10px;margin-right:-10px;border-left:0;border-right:0;border-radius:0}.ia-line-wrap{margin-left:42px;margin-right:11px}.ia-trend-summary{grid-template-columns:1fr 1fr}.ia-trend-summary div:last-child{grid-column:1/-1}.ia-donut-layout{grid-template-columns:1fr;padding-top:6px}.ia-donut-legend{display:grid;grid-template-columns:1fr 1fr;margin-top:14px;padding:0 12px}.ia-lower-grid{gap:10px}.ia-summary-card,.ia-highlights-card{border-radius:7px}.ia-status{align-items:flex-start;flex-direction:column;padding:10px 11px}}
@media(max-width:420px){.ia-donut-legend{grid-template-columns:1fr}.ia-highlights>div{grid-template-columns:31px 1fr}.ia-highlights strong{grid-column:2;text-align:left}.ia-trend-summary{grid-template-columns:1fr}.ia-trend-summary div:last-child{grid-column:auto}}

/* Unified Income Analytics tabs — all analytics share one page shell */
.ia-unified-tabs .ia-tab-panel{display:none;padding:0;background:#fff}
.ia-unified-tabs .ia-tab-panel.active{display:block}
.ia-unified-tabs .ia-detail-grid{display:grid;grid-template-columns:1fr;gap:14px;padding:16px;background:#fff}
.ia-unified-tabs .ia-detail-grid.two{grid-template-columns:1fr 1fr}
.ia-unified-tabs .ia-detail-grid .wide{grid-column:1/-1}
.ia-unified-tabs .ia-donut-layout.expanded{min-height:340px;grid-template-columns:minmax(210px,45%) 1fr}
.ia-unified-tabs .ia-donut.large{width:210px;height:210px}
.ia-unified-tabs .ia-donut.large>div{width:136px;height:136px}
.ia-unified-tabs .ia-linechart-large{height:285px}
.ia-unified-tabs .ia-trend-foot.four{grid-template-columns:repeat(4,1fr);padding:16px 0 0}
.ia-unified-tabs .ia-rank-list{display:flex;flex-direction:column;margin-top:12px}
.ia-unified-tabs .ia-rank-list>div{display:grid;grid-template-columns:34px minmax(0,1fr) auto;grid-template-rows:auto 6px;gap:8px 12px;align-items:center;padding:11px 0;border-bottom:1px solid #edf0f2}
.ia-unified-tabs .rank-no{width:28px;height:28px;border-radius:8px;background:#f1f7f3;color:#087f42;display:grid;place-items:center;font-size:10px;font-weight:800}
.ia-unified-tabs .ia-rank-list p{margin:0}.ia-unified-tabs .ia-rank-list p b{display:block;font-size:11px;color:#142045}.ia-unified-tabs .ia-rank-list p small{display:block;margin-top:3px;color:#667085;font-size:9px}
.ia-unified-tabs .ia-rank-list strong{text-align:right;color:#132044;font-size:11px}.ia-unified-tabs .ia-rank-list strong small{display:block;margin-top:3px;color:#667085;font-size:9px;font-weight:500}
.ia-unified-tabs .ia-rank-list i{grid-column:2/4;height:5px;background:#eef2f4;border-radius:20px;overflow:hidden}.ia-unified-tabs .ia-rank-list i span{display:block;height:100%;background:#0b8b4a;border-radius:inherit}
.ia-unified-tabs .ia-progress{height:7px;min-width:110px;background:#edf2ef;border-radius:20px;overflow:hidden}.ia-unified-tabs .ia-progress span{display:block;height:100%;background:#0b8b4a;border-radius:inherit}
.ia-unified-tabs .ia-muted{color:#667085;font-size:9px}
.ia-unified-tabs .ia-search{display:flex;align-items:center;gap:7px;min-width:280px;height:34px;border:1px solid #dfe5e9;border-radius:7px;padding:0 10px;color:#667085}.ia-unified-tabs .ia-search input{border:0;outline:0;width:100%;font-size:10px;background:transparent;color:#1f2937}
.ia-unified-tabs .ia-transactions-table{min-width:980px}
@media(max-width:980px){.ia-unified-tabs .ia-detail-grid.two{grid-template-columns:1fr}.ia-unified-tabs .ia-trend-foot.four{grid-template-columns:1fr 1fr}.ia-unified-tabs .ia-donut-layout.expanded{grid-template-columns:1fr}.ia-unified-tabs .ia-search{min-width:200px}}
@media(max-width:640px){.ia-unified-tabs .ia-detail-grid{padding:10px}.ia-unified-tabs .ia-trend-foot.four{grid-template-columns:1fr}.ia-unified-tabs .ia-search{min-width:0;width:100%}.ia-unified-tabs .ia-box-head{align-items:flex-start;flex-direction:column}.ia-unified-tabs .ia-donut.large{width:180px;height:180px}.ia-unified-tabs .ia-donut.large>div{width:116px;height:116px}}

.ia-section-anchor{display:block;position:relative;top:-90px;visibility:hidden}