
/* AGROHUB • MANGA BELA • PRODUCT UI v1.1.0 */
:root{
  --ag-brown:#2a1512;
  --ag-brown-2:#3a1e19;
  --ag-orange:#ff7a19;
  --ag-orange-2:#f39b27;
  --ag-blue:#12afe0;
  --ag-green:#31b65a;
  --ag-green-soft:#eef8ef;
  --ag-sky:#effaff;
  --ag-cream:#fff7ee;
  --ag-bg:#f6f7f8;
  --ag-card:#fff;
  --ag-border:#e6eaee;
  --ag-text:#1d232a;
  --ag-muted:#7e8793;
  --ag-shadow:0 8px 28px rgba(24,36,48,.06);
}
html[data-hub-platform="agrohub"] body{font-family:Poppins,Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--ag-bg)!important;color:var(--ag-text)}
body.agro-mode{background:var(--ag-bg)!important}
body.agro-mode .sidebar{
  width:236px!important;
  background:linear-gradient(180deg,#2a1613 0%,#241210 100%)!important;
  border-right:0!important;
  padding:18px 10px 88px!important;
  box-shadow:none!important;
  position:fixed!important;
  overflow:hidden!important;
}
body.agro-mode .sidebar:after{
  content:"";position:absolute;left:-28px;right:-28px;bottom:-50px;height:115px;
  background:
   radial-gradient(120% 75% at 20% 0,#ff7a19 0 32%,transparent 33%),
   radial-gradient(120% 75% at 80% 18%,#14aee0 0 38%,transparent 39%);
  transform:rotate(6deg);opacity:.98;pointer-events:none;
}
.agrohub-brand{display:flex!important;align-items:center!important;gap:12px!important;margin:0 10px 14px!important;padding:0!important}
.manga-bela-logo{width:88px;height:88px;object-fit:contain;border-radius:50%;background:#fff;box-shadow:0 10px 26px rgba(0,0,0,.18)}
.manga-bela-logo.compact{width:70px;height:70px}
.ag-brand-copy{min-width:0}
.ag-brand-copy strong{display:block;color:#fff!important;font-size:25px!important;line-height:1!important;letter-spacing:.08em!important;font-weight:800!important}
.ag-brand-copy strong span{color:var(--ag-orange)!important}
.ag-brand-copy small{display:block;color:#f4e9e5!important;font-size:10px!important;margin-top:7px!important;letter-spacing:.02em!important}
body.agro-mode #sideNav{display:flex!important;flex-direction:column!important;gap:4px!important;overflow:auto!important;padding:4px 0 20px!important}
body.agro-mode #sideNav::-webkit-scrollbar{width:3px}body.agro-mode #sideNav::-webkit-scrollbar-thumb{background:#ffffff2a;border-radius:10px}
body.agro-mode .nav-item{
  min-height:44px!important;
  border:0!important;border-radius:8px!important;
  padding:10px 13px!important;
  margin:0!important;
  background:transparent!important;color:#f1e8e5!important;
  font-size:12px!important;font-weight:500!important;
  display:flex!important;align-items:center!important;gap:12px!important;
  box-shadow:none!important;
}
body.agro-mode .nav-item:hover{background:#ffffff10!important}
body.agro-mode .nav-item.active{background:var(--ag-orange)!important;color:#fff!important;font-weight:700!important}
body.agro-mode .nav-icon{width:22px!important;display:inline-flex!important;justify-content:center!important;color:#fff!important;font-size:17px!important}
.ag-side-bottom{margin:14px 10px 0;border-top:1px solid #ffffff22;padding:16px 5px;color:#a58f88;font-size:10px;display:flex;align-items:center;gap:8px}
.ag-side-bottom span{font-size:15px}
body.agro-mode .sidebar-footer{left:10px!important;right:10px!important;bottom:58px!important;border-top:1px solid #ffffff22!important;padding:12px 0!important;color:#fff!important;z-index:3}
body.agro-mode .sidebar-footer strong{color:#fff!important}body.agro-mode .sidebar-footer small{color:#aa9892!important}
body.agro-mode .avatar{background:var(--ag-orange)!important;color:#fff!important}
body.agro-mode .logout-btn{color:#cfbbb4!important}
body.agro-mode .main-content{margin-left:236px!important;background:#f8f9fa!important;padding:0 16px 36px!important;min-height:100vh!important}
body.agro-mode .topbar{
  min-height:58px!important;padding:8px 0 7px!important;margin:0!important;border:0!important;background:#fff!important;
  display:flex!important;align-items:center!important;box-shadow:none!important;position:sticky!important;top:0!important;z-index:40!important;
}
body.agro-mode .topbar>div:first-child,
body.agro-mode .topbar>.topbar-actions{display:none!important}
.ag-topbar-inner{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px}
.ag-search-wrap{position:relative;width:min(540px,58vw);height:42px;border-radius:11px;background:#f4f5f7;display:flex;align-items:center;padding:0 14px;gap:9px}
.ag-search-wrap>span{font-size:22px;color:#626b76}.ag-search-wrap input{border:0!important;outline:0!important;background:transparent!important;width:100%!important;height:100%!important;font-size:12px!important;color:#333!important;box-shadow:none!important}
.ag-search-results{display:none;position:absolute;left:0;right:0;top:48px;background:#fff;border:1px solid var(--ag-border);border-radius:12px;box-shadow:0 18px 40px rgba(19,31,43,.16);padding:7px;z-index:100}
.ag-search-results.open{display:block}.ag-search-results button{display:block;width:100%;text-align:left;border:0;background:#fff;padding:9px 10px;border-radius:8px;cursor:pointer}.ag-search-results button:hover{background:#f6f8f9}.ag-search-results small{display:block;color:var(--ag-orange);font-size:9px;font-weight:800}.ag-search-results b{font-size:12px}.ag-search-empty{padding:12px;color:var(--ag-muted);font-size:11px}
.ag-top-actions{display:flex;align-items:center;gap:14px}
.ag-bell{position:relative;border:0;background:transparent;font-size:17px;color:#2d3137;cursor:pointer}.ag-bell i{position:absolute;right:-4px;top:-5px;background:var(--ag-orange);color:#fff;border-radius:50%;font-size:8px;font-style:normal;width:16px;height:16px;display:grid;place-items:center}
.ag-user-chip{display:flex;align-items:center;gap:9px;padding:3px 5px}.ag-avatar{width:35px;height:35px;border-radius:50%;background:#241411;color:#fff;display:grid;place-items:center;font-size:11px;font-weight:800}.ag-user-chip b{display:block;font-size:11px}.ag-user-chip small{display:block;color:#8d9299;font-size:9px}.ag-user-chip>span{margin-left:4px;color:#646b73}
body.agro-mode .page{display:none!important}
body.agro-mode #agrohubPage.active{display:block!important;padding:0!important;margin:0!important;max-width:none!important;overflow:visible!important}
.ag-product-page{background:#f8f9fa!important}
.ag-dashboard{display:block;padding-bottom:10px}
.ag-hero{
  height:232px;border-radius:12px;position:relative;overflow:hidden;margin:0 0 14px;background:#7f522b;
  box-shadow:var(--ag-shadow);isolation:isolate;
}
.ag-hero-bg,.ag-hero-bg svg{position:absolute;inset:0;width:100%;height:100%}.ag-hero-scene{display:block}
.ag-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(34,18,12,.87) 0%,rgba(34,18,12,.52) 36%,rgba(34,18,12,.08) 69%,rgba(34,18,12,.18) 100%);z-index:1}
.ag-hero-copy{position:relative;z-index:2;color:#fff;padding:25px 30px}
.ag-hero-copy>span{font-size:18px}.ag-hero-copy h1{font-size:45px;line-height:.95;margin:3px 0 1px;font-weight:800;letter-spacing:.01em}.ag-hero-copy h1 span{color:var(--ag-orange)}.ag-hero-copy h2{font-size:20px;margin:0;font-weight:500}.ag-hero-copy i{display:block;width:42px;height:3px;background:var(--ag-orange);margin:14px 0 12px}.ag-hero-copy p{font-size:14px;line-height:1.45;margin:0}
.ag-hero-quote{position:absolute;z-index:2;right:24%;top:112px;color:#fff;font-family:"Segoe Script","Brush Script MT",cursive;font-size:22px;line-height:1.25;transform:rotate(-7deg);text-shadow:0 2px 12px #0008}
.ag-kpi-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;margin-bottom:12px}
.ag-kpi{border:1px solid var(--ag-border);border-radius:12px;padding:13px 12px;display:flex;gap:10px;align-items:flex-start;min-height:115px;box-shadow:var(--ag-shadow);background:#fff}
.ag-kpi.green{background:linear-gradient(135deg,#f2fcf4,#fff)}.ag-kpi.orange{background:linear-gradient(135deg,#fff7ee,#fff)}.ag-kpi.blue{background:linear-gradient(135deg,#eefaff,#fff)}
.ag-kpi-icon{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:#fff;font-size:18px;box-shadow:0 4px 12px #0000000d;flex:0 0 35px}
.ag-kpi small{display:block;font-size:10px;color:#4a5159;margin-bottom:5px}.ag-kpi strong{display:block;font-size:20px;line-height:1.05;color:#17191c;margin-bottom:6px}.ag-kpi em{display:block;color:#25a34a;font-size:10px;font-style:normal;font-weight:800}.ag-kpi>div>span{display:block;color:#848b94;font-size:8px;margin-top:2px}
.ag-progress{height:8px;background:#dde3e9;border-radius:10px;overflow:hidden;margin:4px 0 3px}.ag-progress i{display:block;height:100%;background:var(--ag-orange);border-radius:10px}
.ag-grid-top{display:grid;grid-template-columns:1.35fr .9fr .78fr;gap:11px;margin-bottom:11px}
.ag-grid-bottom{display:grid;grid-template-columns:1.35fr .78fr .72fr;gap:11px}
.ag-card{background:#fff;border:1px solid var(--ag-border);border-radius:12px;box-shadow:var(--ag-shadow);padding:13px;min-width:0}
.ag-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.ag-card-head>div{display:flex;align-items:center;gap:9px}.ag-card-head b{display:block;font-size:12px;color:#25292e}.ag-card-head small{display:block;font-size:8px;color:#8c939a;margin-top:2px}.ag-card-head select,.ag-select-pill{border:1px solid #e3e7eb;border-radius:8px;background:#fff;padding:7px 9px;font-size:9px;color:#555}
.ag-card-head button{border:0;background:transparent;color:#1977d3;font-size:9px;font-weight:700;cursor:pointer}
.ag-card-icon{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:#fff3e8;font-size:15px}.ag-card-icon.orange{color:var(--ag-orange)}
.ag-bars{height:170px;display:flex;align-items:flex-end;gap:8px;padding:9px 12px 0;position:relative;border-left:1px solid #e6eaed;border-bottom:1px solid #e6eaed;background:linear-gradient(to top,transparent 24%,#edf0f2 25%,transparent 26%,transparent 49%,#edf0f2 50%,transparent 51%,transparent 74%,#edf0f2 75%,transparent 76%)}
.ag-bar-col{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;min-width:0}.ag-bar-box{width:70%;height:128px;display:flex;align-items:flex-end}.ag-bar-box i{width:100%;min-height:4px;background:linear-gradient(#15b3e3,#109dcc);border-radius:3px 3px 0 0}.ag-bar-col>b{font-size:8px}.ag-bar-col small{font-size:7px;color:#88919a;white-space:nowrap}.ag-average-line{position:absolute;left:0;right:0;border-top:1.5px dashed var(--ag-orange);pointer-events:none}.ag-chart-legend{display:flex;justify-content:center;gap:18px;margin-top:9px;font-size:8px;color:#666}.ag-chart-legend i{display:inline-block;margin-right:5px}.blue-dot{width:8px;height:8px;border-radius:50%;background:#12aee0}.orange-line{width:18px;border-top:2px dashed var(--ag-orange);vertical-align:middle}
.ag-donut-wrap{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:10px;padding:10px 3px}.ag-donut{--done:0;width:132px;height:132px;border-radius:50%;background:conic-gradient(#33b65a 0 calc(var(--done)*1%),#15aee0 calc(var(--done)*1%) calc(min(100,var(--done) + 14)*1%),#ff7a19 calc(min(100,var(--done) + 14)*1%) calc(min(100,var(--done) + 22)*1%),#c9cfd5 calc(min(100,var(--done) + 22)*1%) 100%);display:grid;place-items:center;margin:auto;position:relative}.ag-donut:after{content:"";position:absolute;width:82px;height:82px;border-radius:50%;background:#fff}.ag-donut>div{position:relative;z-index:1;text-align:center}.ag-donut strong{display:block;font-size:22px}.ag-donut span{font-size:9px;color:#737a82}.ag-donut-legend p{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:6px;font-size:9px;margin:7px 0}.ag-donut-legend i{width:8px;height:8px;border-radius:50%}.ag-donut-legend i.g{background:#33b65a}.ag-donut-legend i.b{background:#15aee0}.ag-donut-legend i.o{background:#ff7a19}.ag-donut-legend hr{border:0;border-top:1px solid #eceff1;margin:8px 0}
.ag-status{font-size:8px;background:#e8f8ec;color:#34864b;border-radius:999px;padding:6px 8px;white-space:nowrap}.ag-status i{display:inline-block;width:7px;height:7px;background:#39b557;border-radius:50%;margin-right:5px}
.ag-season-body{display:grid;grid-template-columns:82px 1fr;gap:11px;align-items:start}.ag-mango-thumb{height:118px;border-radius:9px;background:linear-gradient(145deg,#294c22,#79a344);display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff55}.ag-mango-thumb span{font-size:50px;filter:drop-shadow(0 5px 8px #0004)}
.ag-season-body dl{margin:0}.ag-season-body dl div{display:flex;justify-content:space-between;border-bottom:1px solid #edf0f2;padding:6px 0;gap:8px}.ag-season-body dt{font-size:8px;color:#7f8790}.ag-season-body dd{font-size:9px;margin:0;text-align:right}
.ag-table-wrap{overflow:auto}.ag-ops-card table,.ag-list-card table{width:100%;border-collapse:collapse}.ag-ops-card th,.ag-ops-card td,.ag-list-card th,.ag-list-card td{font-size:8px;padding:6px 7px;text-align:left;border-bottom:1px solid #edf0f2;white-space:nowrap}.ag-ops-card th,.ag-list-card th{background:#f3f5f7;color:#4f555c;font-weight:600}.ag-op-status{display:inline-flex;align-items:center;border-radius:999px;padding:4px 7px;font-size:7px}.ag-op-status.done{background:#e4f7e9;color:#2e8f49}.ag-op-status.doing{background:#e6f4ff;color:#2480c5}
.ag-hbars{display:flex;flex-direction:column;gap:11px;padding:7px 0}.ag-hbars>div{display:grid;grid-template-columns:82px 1fr 42px;align-items:center;gap:8px;font-size:8px}.ag-hbars i{height:13px;background:#e9edf1;border-radius:3px;overflow:hidden}.ag-hbars i b{display:block;height:100%;background:linear-gradient(90deg,#17afe0,#1599ca);border-radius:3px}.ag-hbars strong{text-align:right}
.ag-area-body{display:grid;grid-template-columns:130px 1fr;gap:12px;align-items:center}.ag-area-donut{width:124px;height:124px;border-radius:50%;display:grid;place-items:center;position:relative}.ag-area-donut:after{content:"";position:absolute;width:70px;height:70px;border-radius:50%;background:#fff}.ag-area-donut>div{position:relative;z-index:1;text-align:center}.ag-area-donut strong{display:block;font-size:16px}.ag-area-donut span{font-size:8px;color:#737a82}.ag-area-legend p{display:grid;grid-template-columns:9px 1fr auto;align-items:center;gap:5px;margin:6px 0;font-size:7px}.ag-area-legend p i{width:8px;height:8px;border-radius:50%}.ag-area-legend p span{color:#69727a}
.ag-module-page{padding:8px 0 20px}.ag-module-head{display:flex;justify-content:space-between;align-items:flex-end;margin:10px 2px 14px}.ag-module-head small{font-size:9px;font-weight:800;color:var(--ag-orange);letter-spacing:.14em}.ag-module-head h1{font-size:28px;margin:2px 0}.ag-module-head p{margin:0;color:var(--ag-muted);font-size:11px}.ag-module-head>button{border:0;background:var(--ag-orange);color:#fff;border-radius:9px;padding:10px 14px;font-weight:700;cursor:pointer}
.ag-list-card{padding:0;overflow:auto}.ag-list-card table{min-width:700px}.ag-list-card th,.ag-list-card td{font-size:10px;padding:12px 14px}
.ag-form-card form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ag-form-card label{font-size:10px;font-weight:600;color:#4f565d}.ag-form-card input,.ag-form-card select,.ag-form-card textarea{display:block;width:100%;margin-top:5px;border:1px solid #dfe4e8;border-radius:8px;padding:10px;background:#fff;font:inherit}.ag-form-card .wide{grid-column:1/-1}.ag-form-actions{display:flex;gap:8px}.ag-form-actions button{border:0;border-radius:8px;padding:10px 14px;font-weight:700;cursor:pointer}.ag-form-actions .primary{background:var(--ag-orange);color:#fff}
body.agro-mode .buildhub-safe-about{background:#2a1512!important;border-color:#5e3229!important;color:#fff!important}
body.agro-mode .buildhub-safe-about::first-letter{color:var(--ag-orange)}
@media(max-width:1450px){
 .ag-kpi-row{grid-template-columns:repeat(4,minmax(0,1fr))}.ag-grid-top{grid-template-columns:1.2fr 1fr}.ag-season-card{grid-column:1/-1}.ag-grid-bottom{grid-template-columns:1.2fr 1fr}.ag-area-card{grid-column:1/-1}
}
@media(max-width:1050px){
 body.agro-mode .sidebar{width:210px!important}.manga-bela-logo.compact{width:58px;height:58px}.ag-brand-copy strong{font-size:19px!important}.ag-brand-copy small{font-size:8px!important}
 body.agro-mode .main-content{margin-left:210px!important}.ag-grid-top,.ag-grid-bottom{grid-template-columns:1fr}.ag-season-card,.ag-area-card{grid-column:auto}.ag-kpi-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
 body.agro-mode .main-content{margin-left:0!important;padding:0 10px 88px!important}.ag-topbar-inner{padding-left:46px}.ag-user-chip>div:not(.ag-avatar),.ag-user-chip>span{display:none}.ag-search-wrap{width:calc(100vw - 120px)}
 .ag-hero{height:200px}.ag-hero-copy{padding:22px}.ag-hero-copy h1{font-size:36px}.ag-hero-quote{display:none}.ag-kpi-row{grid-template-columns:1fr 1fr}.ag-grid-top,.ag-grid-bottom{grid-template-columns:1fr}.ag-area-body{grid-template-columns:1fr}.ag-area-donut{margin:auto}.ag-form-card form{grid-template-columns:1fr}.ag-form-card .wide{grid-column:auto}
}

/* AGROHUB SHARED + LAB v1.1.1 */
.ag-side-sep{height:1px;background:rgba(255,255,255,.12);margin:9px 12px}
.ag-lab-badge{font-size:9px;font-weight:900;letter-spacing:.12em;padding:6px 9px;border-radius:999px;background:#fff3e5;color:#d96a12;border:1px solid #ffd5aa}
.ag-proc-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
.ag-proc-kpis>div{background:#fff;border:1px solid var(--ag-border);border-radius:11px;padding:13px 14px;box-shadow:var(--ag-shadow)}
.ag-proc-kpis small{display:block;color:#7c858d;font-size:9px;text-transform:uppercase;letter-spacing:.07em;margin-bottom:5px}
.ag-proc-kpis b{display:block;font-size:19px;color:#20252a}
.ag-proc-kpis span{display:block;font-size:8px;color:#9aa1a8;margin-top:3px}
.ag-flow-actions{min-width:280px;white-space:normal!important}
.ag-flow-actions button,.ag-mini{border:1px solid #dfe4e8;background:#fff;border-radius:7px;padding:5px 7px;margin:2px;font-size:8px;font-weight:700;cursor:pointer;color:#394149}
.ag-flow-actions button:hover,.ag-mini:hover{border-color:var(--ag-orange);color:#d8610f;background:#fff8f1}
.ag-status-pill{display:inline-flex;align-items:center;border-radius:999px;padding:5px 8px;background:#f0f4f6;color:#49545d;font-size:8px;font-weight:700;white-space:nowrap}
.ag-request-item{display:grid;grid-template-columns:2fr .7fr .7fr 1fr;gap:10px;padding:12px;border:1px solid #edf0f2;border-radius:10px;background:#fafbfc}
.ag-grid-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ag-grid-two .ag-module-page{padding:0}
.ag-grid-two .ag-module-head{margin-top:0}
.ag-lab-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ag-lab-module{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:17px;background:#fff;border:1px solid var(--ag-border);border-radius:12px;box-shadow:var(--ag-shadow)}
.ag-lab-module.on{border-color:#bde4c6;background:linear-gradient(135deg,#f3fbf5,#fff)}
.ag-lab-module.off{opacity:.72;background:#f7f8f9}
.ag-lab-module small{font-size:8px;color:#8a929a;text-transform:uppercase;letter-spacing:.1em}
.ag-lab-module h3{font-size:14px;margin:3px 0 2px}
.ag-lab-module p{font-size:9px;color:#7f8891;margin:0}
.ag-switch{position:relative;width:46px;height:25px;flex:0 0 46px}
.ag-switch input{display:none}
.ag-switch span{position:absolute;inset:0;border-radius:999px;background:#c9cfd4;cursor:pointer;transition:.18s}
.ag-switch span:after{content:"";position:absolute;width:19px;height:19px;left:3px;top:3px;border-radius:50%;background:#fff;box-shadow:0 2px 5px #0003;transition:.18s}
.ag-switch input:checked+span{background:#34af5b}
.ag-switch input:checked+span:after{transform:translateX(21px)}
.ag-switch input:disabled+span{cursor:not-allowed;opacity:.45}
.ag-area-list{display:flex;flex-direction:column;gap:8px;padding-top:5px}
.ag-area-list p{display:flex;justify-content:space-between;margin:0;padding:7px 0;border-bottom:1px solid #eef1f3;font-size:9px}
.ag-area-list p b{color:#31373d}.ag-area-list p span{color:#7a838c}
@media(max-width:1100px){.ag-proc-kpis{grid-template-columns:repeat(2,1fr)}.ag-lab-grid{grid-template-columns:repeat(2,1fr)}.ag-grid-two{grid-template-columns:1fr}}
@media(max-width:700px){.ag-proc-kpis,.ag-lab-grid{grid-template-columns:1fr}.ag-request-item{grid-template-columns:1fr}.ag-flow-actions{min-width:220px}}
