/* Reference-led blue workspace: shared by every authenticated page. */
body.modern-ui:has(.shell){--ui-ink:#182231;--ui-muted:#7c8594;--ui-green:#1267a5;--ui-line:#e9edf3;--ui-bg:#f7f8fc;--ui-shadow:0 2px 3px #172f4906;background:var(--ui-bg)}
body.modern-ui .shell{color:#182231;background:#f7f8fc;font-size:13px}
body.modern-ui .shell .sidebar{background:linear-gradient(155deg,#064b9c 0%,#03418d 55%,#053b81 100%);border:0;color:#fff;width:214px;padding:22px 14px;scrollbar-color:#6ca8e8 transparent}
body.modern-ui .shell .main{margin-left:214px;width:calc(100% - 214px)}
body.modern-ui .shell .brand{padding:0 6px 22px;gap:9px}
body.modern-ui .shell .brand b{color:#fff;font-size:19px;letter-spacing:-.5px}
body.modern-ui .shell .brand small{color:#c3e0f6;font-size:10px}
body.modern-ui .shell .brandmark{background:#ffffff1f;color:#fff;box-shadow:none;border:1px solid #ffffff25}
body.modern-ui .shell .brandmark.brand-logo{background:transparent;border:0;overflow:hidden;padding:0;flex-shrink:0}
body.modern-ui .shell .brandmark.brand-logo img{display:block;width:100%;height:100%;object-fit:contain;border-radius:50%}
body.modern-ui .shell .scope{background:#ffffff0c;border-color:#ffffff20;color:white;border-radius:9px}
body.modern-ui .shell .scope strong{color:#fff}
body.modern-ui .shell .scope small,body.modern-ui .shell .scope em{color:#bdd9ef}
body.modern-ui .shell .scope .dot{background:#7ce1ba;box-shadow:0 0 0 3px #ffffff12}
/* Compact version of the supplied Ochero identity artwork, shared by all roles. */
body.modern-ui .shell .ochero-brand{padding:0 0 19px;gap:10px;min-height:67px}
body.modern-ui .shell .ochero-brand .brand-logo{width:54px;height:54px;border-radius:50%}
body.modern-ui .shell .ochero-brand-name{min-width:0;border-left:2px solid #f2f7ff;padding-left:10px}
body.modern-ui .shell .ochero-brand-name b{font-size:16px;line-height:1.22;letter-spacing:-.5px;font-weight:800;white-space:nowrap}
body.modern-ui .shell .ochero-brand-name .ochero-brand-farm{color:#adf000;font-size:16px;line-height:1.22;margin-top:2px}
body.modern-ui .shell .ochero-identity{display:flex;align-items:center;gap:7px;padding:7px;margin:0 0 12px;border:1px solid #78baff;border-radius:9px;background:linear-gradient(120deg,#0751a224,#003a811f);box-shadow:inset 0 0 0 1px #b5dcff0a}
body.modern-ui .shell .ochero-identity-icon{display:grid;place-items:center;flex:0 0 28px;width:28px;height:30px;border:1px solid #73baff;border-radius:7px;background:linear-gradient(145deg,#2f8bff,#0561c7);color:#fff;font-size:15px;box-shadow:0 3px 8px #00295b26}
body.modern-ui .shell .ochero-identity-copy{min-width:0;flex:1;border-left:1px solid #e6f2ff;padding-left:7px}
body.modern-ui .shell .ochero-identity .ochero-signed-in{display:flex;align-items:center;gap:4px;font-size:8px;line-height:1.2;color:#f0f6ff;white-space:nowrap}
body.modern-ui .shell .ochero-signed-in .dot{display:inline-block;flex:0 0 6px;width:6px;height:6px;margin:0;background:#b1ef00;box-shadow:none}
body.modern-ui .shell .ochero-identity strong{font-size:10px;font-weight:700;line-height:1.25;margin:3px 0 4px;color:#fff;overflow-wrap:break-word}
body.modern-ui .shell .ochero-identity .ochero-access{display:inline-flex;align-items:center;gap:3px;max-width:100%;font-style:normal;font-size:8px;font-weight:700;line-height:1.2;color:#fff;background:linear-gradient(115deg,#45ad00,#329800);padding:3px 5px;border-radius:6px;white-space:nowrap}
body.modern-ui .shell .ochero-access i{font-size:9px}
body.modern-ui .shell .ochero-brand:focus-visible{outline:2px solid #b1ef00;outline-offset:3px;border-radius:6px}
body.modern-ui .shell nav a{color:#dceafa;font-size:11px;min-height:35px;padding:9px 10px;margin:4px 0;border-radius:7px;font-weight:400}
body.modern-ui .shell nav a i{color:#c0dff5;font-size:13px}
body.modern-ui .shell nav a:hover{background:#ffffff16;color:#fff}
body.modern-ui .shell nav a.active{background:#ffffff16;box-shadow:inset 3px 0 #adf000,0 3px 10px #063d6a20;color:#fff;font-weight:600}
body.modern-ui .shell nav a.active i{color:#fff}
body.modern-ui .shell .nav-label{color:#99c9eb;font-size:9px;letter-spacing:1.1px}
body.modern-ui .shell .topbar{height:62px;padding:0 24px;border-bottom:1px solid #ebedf3;background:#fff}
body.modern-ui .shell .top-title b{font-size:15px;color:#172133}
body.modern-ui .shell .icon-btn{border-color:#e9edf3;color:#64748b;border-radius:8px;width:31px;height:31px}
body.modern-ui .shell .user-chip>span{background:#2162eb;color:white;border-radius:50%}
body.modern-ui .shell .user-chip b{color:#273448;font-size:11px}
body.modern-ui .shell .user-chip small{color:#8490a2}
body.modern-ui .shell .content{padding:22px 24px 32px;max-width:1600px}
body.modern-ui .shell .page-head{margin-bottom:18px}
body.modern-ui .shell .page-head h1{font-size:23px;font-weight:700;letter-spacing:-.65px;color:#172133}
body.modern-ui .shell .page-head p{font-size:11px;color:#8590a1}
body.modern-ui .shell .eyebrow{color:#1267a5}
body.modern-ui .shell :is(.primary,.btn){font-size:11px;padding:7px 12px;min-height:33px;border-radius:7px;font-weight:500}
body.modern-ui .shell .primary{background:#1268a9;border-color:#1268a9;box-shadow:0 2px 3px #1268a918}
body.modern-ui .shell .primary:hover{background:#0d5288;border-color:#0d5288}
body.modern-ui .shell .btn{color:#526176;border-color:#e2e7ef;background:#fff}
body.modern-ui .shell .btn:hover{background:#eef6ff;border-color:#c1d8f2}
body.modern-ui .shell :is(a,button,input,select,textarea):focus-visible{outline-color:#3186ff}
body.modern-ui .shell .panel{background:#fff;border-color:#e9edf3;border-radius:12px;padding:18px;box-shadow:0 2px 3px #172f4907;margin-bottom:18px}
body.modern-ui .shell .panel.table-panel{padding:0;overflow:hidden}
body.modern-ui .shell h3{font-size:14px;font-weight:650;color:#192638;letter-spacing:-.3px}
body.modern-ui .shell .panel-head p{font-size:11px;color:#8891a0}
/* Blue hero contains the real, live summary cards; no sample statistics. */
body.modern-ui .shell .dashboard-welcome{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(115deg,#126bad,#115380);border:1px solid #2275ac;border-radius:19px;padding:23px 24px 20px;margin-bottom:20px;color:#fff;box-shadow:0 8px 18px #14598b20}
.dashboard-welcome::before,.dashboard-welcome::after{content:'';position:absolute;z-index:-1;pointer-events:none;width:230px;height:230px;border-radius:48px;background:#ffffff04;transform:rotate(-15deg);right:-100px;top:-65px}
.dashboard-welcome::after{left:-150px;top:65px;width:400px;background:#ffffff03}
.welcome-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}
.welcome-title{display:flex;align-items:center;flex-wrap:wrap;gap:15px}
.welcome-title h2{font-size:26px;line-height:1.2;letter-spacing:-.6px;margin:0;font-weight:700;color:#fff}
.welcome-title time{font-size:10px;padding:5px 9px;border-radius:20px;background:#ffffff1f;color:#e0effc}
.welcome-heading p{font-size:12px;margin:8px 0 0;color:#c3dff3}
.welcome-mark{display:grid;place-items:center;width:42px;height:42px;background:#ffffff15;border:1px solid #ffffff20;border-radius:12px;color:#cfecff;font-size:21px}
body.modern-ui .shell .dashboard-welcome .overview-cluster{margin:0;gap:12px}
body.modern-ui .shell .dashboard-welcome .retail-summary{margin-bottom:0}
body.modern-ui .shell .dashboard-welcome :is(.summary-card,.retail-stat){background:#ffffff12;border:1px solid #ffffff20;border-radius:11px;box-shadow:none;min-height:94px;padding:13px;gap:10px;align-items:flex-start;color:white}
body.modern-ui .shell .dashboard-welcome :is(.summary-card,.retail-stat)::before{display:none}
body.modern-ui .shell .dashboard-welcome :is(.summary-card,.retail-stat):hover{background:#ffffff20;border-color:#ffffff45}
body.modern-ui .shell .dashboard-welcome :is(.summary-icon,.retail-stat-icon){width:29px;height:29px;background:#ffffff18;color:#e2f1ff;border-radius:7px;font-size:14px}
body.modern-ui .shell .dashboard-welcome .summary-label,body.modern-ui .shell .dashboard-welcome .retail-stat span:not(.retail-stat-icon){font-size:10px;color:#d2e7f8}
body.modern-ui .shell .dashboard-welcome :is(.summary-card,.retail-stat) strong{font-size:25px;color:#fff;margin:5px 0;font-weight:650}
body.modern-ui .shell .dashboard-welcome :is(.summary-card,.retail-stat) small{color:#b5d7ef;font-size:9px}
.welcome-shortcuts{display:flex;gap:12px;flex-wrap:wrap}
.welcome-shortcuts a{display:flex;align-items:center;gap:10px;border:1px solid #ffffff25;border-radius:9px;background:#ffffff12;padding:12px 14px;color:#fff;font-size:12px}
.welcome-shortcuts a:hover{background:#ffffff25}
.welcome-shortcuts a i:last-child{margin-left:18px}
body.modern-ui .shell .dashboard-analytics{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(270px,1fr);gap:18px;margin-bottom:18px}
body.modern-ui .shell .dashboard-analytics>.panel{margin:0;min-width:0}
body.modern-ui .shell .production-plot{height:200px}
body.modern-ui .shell .chart-panel canvas{max-height:220px}
.quick-actions>p{color:#8891a0;font-size:11px;margin:-3px 0 15px}
.quick-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.quick-action-grid a{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;padding:14px;border-radius:10px;color:white;background:linear-gradient(120deg,#1473b9,#10588e);min-height:90px;transition:filter .15s}
.quick-action-grid a::after{content:'';position:absolute;right:-20px;top:-25px;width:65px;height:65px;border-radius:50%;background:#ffffff18}
.quick-action-grid a:nth-child(2){background:linear-gradient(120deg,#0ab98e,#00a482)}
.quick-action-grid a:nth-child(3){background:linear-gradient(120deg,#ff9b00,#ff6800)}
.quick-action-grid a:nth-child(4){background:linear-gradient(120deg,#a647f5,#8314ee)}
.quick-action-grid a:hover{filter:brightness(1.08)}
.quick-action-grid i{font-size:18px;margin-bottom:10px}.quick-action-grid b{font-size:11px;font-weight:500}.quick-action-grid small{font-size:9px;margin-top:4px;color:#ffffffc4}
/* Separate white metric surfaces and coloured icon tiles echo the reference. */
body.modern-ui .shell :is(.financial-card,.sales-money-card,.kpi){--card-accent:#156aaa;background:#fff;border:1px solid #e8edf4;border-radius:11px;box-shadow:0 2px 2px #172f4905}
body.modern-ui .shell .financial-card{padding:16px;position:relative;border-bottom:3px solid var(--card-accent)}
body.modern-ui .shell .financial-card:nth-child(2),body.modern-ui .shell .sales-money-card:nth-child(2){--card-accent:#00a98e}
body.modern-ui .shell .financial-card:nth-child(3),body.modern-ui .shell .sales-money-card:nth-child(3){--card-accent:#ff8200}
body.modern-ui .shell .financial-card:nth-child(4),body.modern-ui .shell .sales-money-card:nth-child(4){--card-accent:#9234e9}
body.modern-ui .shell .financial-card h4{font-size:11px;color:#354157;margin-bottom:13px}
body.modern-ui .shell .finance-icon{background:color-mix(in srgb,var(--card-accent) 8%,white);color:var(--card-accent);width:30px;height:30px;border-radius:8px;font-size:14px}
body.modern-ui .shell .financial-card>div{font-size:11px;color:#7d8898;margin:7px 0}
body.modern-ui .shell .financial-card strong{font-size:16px;color:#1a283a}
body.modern-ui .shell .financial-card>div:last-child{border-top-color:#edf0f5}
body.modern-ui .shell .financial-card .loss strong{color:#e23b53}
body.modern-ui .shell .financial-card .profit strong{color:#069c75}
body.modern-ui .shell .sales-money-card{min-height:120px;padding:17px;border-bottom:3px solid var(--card-accent);color:#182231;gap:5px}
body.modern-ui .shell .sales-money-card>.money-icon{background:color-mix(in srgb,var(--card-accent) 8%,white);color:var(--card-accent);position:static;width:29px;height:29px;border-radius:7px;font-size:14px;margin-bottom:5px}
body.modern-ui .shell .sales-money-card>span:not(.money-icon){padding:0;font-size:11px;color:#7a8595;order:2}
body.modern-ui .shell .sales-money-card strong{font-size:23px;line-height:1.2;font-weight:650;color:#182231;order:1}
body.modern-ui .shell .sales-money-card small{color:#9aa4b2;font-size:10px;order:3}
body.modern-ui .shell .sales-charts article{background:#fafbfe;border-color:#e9edf3;border-radius:10px;padding:15px}
body.modern-ui .shell .sales-charts h4{color:#334259;font-size:12px}
body.modern-ui .shell .sales-detail-heading strong{color:#1268a9}
body.modern-ui .shell .sales-calendar button.has-sales{background:#edf6ff;color:#1268a9;border-color:#cce2f7}
body.modern-ui .shell .sales-filters :is(select,input){border-color:#e2e7ef;color:#526176;background:#fff;border-radius:6px}
body.modern-ui .shell .sales-filters label{color:#8590a1}
body.modern-ui .shell .table-tools{background:#fff;border-color:#e9edf3;padding:14px}
body.modern-ui .shell :is(table,.ledger-table,.saved-ledger) thead th{background:#f1f6fc;border-color:#e2eaf5;color:#4d6686;font-size:10px;font-weight:600;padding:11px 9px}
body.modern-ui .shell td{color:#526176;border-color:#edf0f6;font-size:11px}
body.modern-ui .shell :is(.ledger-table,.saved-ledger) tbody td{border-color:#e6edf7}
body.modern-ui .shell :is(.ledger-table,.saved-ledger) tbody tr:nth-child(even) td{background:#f8faff}
body.modern-ui .shell :is(.ledger-table,.saved-ledger) tbody tr:hover td{background:#edf5ff}
body.modern-ui .shell tfoot :is(th,td){color:#145d95;background:#edf5ff;border-color:#dbe8f7}
body.modern-ui .shell .ledger-frame{border-color:#e2eaf5;border-radius:9px}
body.modern-ui .shell .document-link{color:#1169ae;font-size:11px}
body.modern-ui .shell .document-form input:focus{border-color:#5a9cda;outline-color:#dfedff;background:#fff}
body.modern-ui .shell :is(.form-grid,.retail-payment-fields) label{color:#67758b;font-size:11px}
body.modern-ui .shell .form-grid :is(input,select,textarea){background:#fafbfe;border-color:#e0e7f1;border-radius:7px;font-size:12px}
body.modern-ui .shell .modal{background:#102b4c70}
body.modern-ui .shell .modal-card,body.modern-ui .invoice-dialog,body.modern-ui .egg-confirm{border-color:#e2e9f3;box-shadow:0 24px 80px #103c6425}
body.modern-ui #recordModal .record-dialog-icon{background:#eaf4ff;color:#1267a5}
body.modern-ui .shell .incoming-alert{background:#f13f55;border-color:#f13f55;color:#fff}
body.modern-ui .shell .finance-big{background:linear-gradient(120deg,#126bad,#115380)}
body.modern-ui .shell :is(.activity-icon,.task-check){background:#edf6ff;color:#1267a5}
body.modern-ui .shell .role-cards i,body.modern-ui .shell .text-link{color:#1267a5}
@media(max-width:1150px){body.modern-ui .shell .dashboard-welcome .overview-cluster{grid-template-columns:repeat(3,minmax(0,1fr))}.welcome-title h2{font-size:23px}body.modern-ui .shell .dashboard-analytics{grid-template-columns:minmax(0,1.5fr) minmax(250px,1fr)}}
@media(max-width:950px){body.modern-ui .shell .dashboard-analytics{grid-template-columns:1fr}.quick-action-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:781px){body.modern-ui.nav-collapsed .shell .sidebar{width:68px;padding:18px 9px}body.modern-ui.nav-collapsed .shell .main{margin-left:68px;width:calc(100% - 68px)}body.modern-ui.nav-collapsed .shell .ochero-brand{padding:0 3px 18px;gap:0}body.modern-ui.nav-collapsed .shell .ochero-brand .brand-logo{width:48px;height:48px}body.modern-ui.nav-collapsed .shell .ochero-identity{display:none}}
@media(max-width:780px){body.modern-ui .shell .main{margin-left:0;width:100%}body.modern-ui .shell .content{padding:16px 13px}body.modern-ui .shell .topbar{padding:0 13px;height:55px}body.modern-ui .shell .dashboard-welcome{padding:19px 16px;border-radius:14px}.welcome-title h2{font-size:22px}.welcome-mark{display:none}body.modern-ui .shell .dashboard-welcome .overview-cluster{grid-template-columns:repeat(2,minmax(0,1fr))}body.modern-ui .shell .panel{padding:15px}.quick-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.welcome-title{gap:9px}.welcome-title h2{font-size:21px}.welcome-heading p{font-size:11px}body.modern-ui .shell .dashboard-welcome :is(.summary-card,.retail-stat){padding:10px;gap:7px;min-height:96px}body.modern-ui .shell .dashboard-welcome :is(.summary-icon,.retail-stat-icon){display:none}body.modern-ui .shell .dashboard-welcome .retail-summary{grid-template-columns:repeat(2,minmax(0,1fr))}body.modern-ui .shell .sales-money-card{padding:12px;min-height:120px}body.modern-ui .shell .sales-money-card strong{font-size:19px}body.modern-ui .shell .sales-money-card>span:not(.money-icon){font-size:10px}.welcome-shortcuts{gap:8px}.welcome-shortcuts a{font-size:11px;padding:10px}.welcome-shortcuts a i:last-child{margin-left:auto}}