:root{--navy:#0B1F36;--navy-light:#17406D;--charcoal:#2D3436;--grey-medium:#808080;--grey-icon:#6D6E71;--grey-soft:#F5F6FA;--grey-border:#E8EBF0;--teal:#00AAB0;--teal-light:#E6F9FA;--gold:#EBAD4A;--gold-light:#FFF9ED;--green:#6DA761;--green-light:#EDF7EB;--orange:#E67E22;--orange-light:#FFF3E6;--red:#E74C3C;--red-light:#FDECEC;--white:#fff;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--shadow-sm:0 1px 3px rgba(11,31,54,.06);--shadow-md:0 4px 12px rgba(11,31,54,.08);--shadow-lg:0 8px 24px rgba(11,31,54,.12);--font-display:'Plus Jakarta Sans',sans-serif;--font-body:'DM Sans',sans-serif;}
*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--grey-soft);font-family:var(--font-body);color:var(--charcoal);-webkit-font-smoothing:antialiased;}
main{margin:0px!important;padding:0px!important}
/* ===== URGENCY BAR (Amazon: order cutoff) ===== */
.urgency-bar{background:linear-gradient(90deg,var(--navy) 0%,var(--navy-light) 100%);padding:10px 32px;display:flex;align-items:center;justify-content:center;gap:12px;}
.urgency-bar p{font-size:13px;color:rgba(255,255,255,.85);font-weight:500;margin:0px;}
.urgency-bar strong{color:var(--gold);font-weight:700;}
.urgency-bar .countdown{background:rgba(235,173,74,.15);color:var(--gold);padding:3px 10px;border-radius:20px;font-size:12px;font-weight:700;font-family:var(--font-display);letter-spacing:.5px;}

/* ===== ALERT BAR (Stripe: proactive alerts) ===== */
.alert-bar{background:var(--red-light);border-bottom:1px solid rgba(231,76,60,.15);padding:10px 32px;display:flex;align-items:center;gap:12px;}
.alert-bar-icon{font-size:16px;}
.alert-bar p{font-size:13px;color:var(--red);font-weight:500;flex:1;}
.alert-bar a{color:var(--red);font-weight:700;text-decoration:underline;font-size:13px;white-space:nowrap;}
.alert-bar .dismiss{background:none;border:none;color:var(--red);opacity:.5;cursor:pointer;font-size:18px;padding:4px;}

/* ===== TOP NAV ===== */
.topnav{background:var(--navy);height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,.15);}
.topnav-left{display:flex;align-items:center;gap:24px;}
.topnav-logo{height:26px;opacity:.95;}
.topnav-badge{background:rgba(0,170,176,.15);color:var(--teal);font-size:10px;font-weight:700;padding:3px 8px;border-radius:20px;letter-spacing:.8px;text-transform:uppercase;}
.topnav-links{display:flex;gap:2px;}
.topnav-links a{color:rgba(255,255,255,.55);text-decoration:none;font-size:13px;font-weight:500;padding:8px 12px;border-radius:6px;transition:all .15s;position:relative;}
.topnav-links a:hover{color:#fff;background:rgba(255,255,255,.07);}
.topnav-links a.active{color:#fff;background:rgba(255,255,255,.1);}
.topnav-links a.active::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:20px;height:2px;background:var(--teal);border-radius:1px;}
.topnav-right{display:flex;align-items:center;gap:8px;}

/* Search (Amazon: instant search with results) */
.search-wrap{position:relative;}
.topnav-search{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);padding:8px 14px 8px 36px;color:#fff;font-size:13px;width:260px;outline:none;font-family:var(--font-body);transition:all .2s;}
.topnav-search:focus{background:rgba(255,255,255,.14);border-color:var(--teal);width:320px;}
.topnav-search::placeholder{color:rgba(255,255,255,.35);}
.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:14px;color:rgba(255,255,255,.35);pointer-events:none;}
.search-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:6px;background:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);border:1px solid var(--grey-border);display:none;z-index:200;overflow:hidden;}
.search-wrap:focus-within .search-dropdown{display:block;}
.search-result{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;transition:background .1s;}
.search-result:hover{background:var(--grey-soft);}
.search-result img{width:36px;height:36px;border-radius:6px;border:1px solid var(--grey-border);object-fit:contain;padding:2px;}
.search-result-info{flex:1;min-width:0;}
.search-result-name{font-size:13px;font-weight:600;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.search-result-sku{font-size:11px;color:var(--grey-medium);}
.search-result-price{font-family:var(--font-display);font-size:14px;font-weight:700;color:var(--navy);white-space:nowrap;}
.search-result-add{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--grey-border);background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--grey-icon);transition:all .15s;flex-shrink:0;}
.search-result-add:hover{border-color:var(--teal);color:var(--teal);background:var(--teal-light);}
.search-footer{padding:10px 16px;background:var(--grey-soft);font-size:12px;color:var(--grey-medium);text-align:center;border-top:1px solid var(--grey-border);}
.search-footer a{color:var(--teal);font-weight:600;text-decoration:none;}

/* Nav icons */
.nav-icon-btn{position:relative;width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s;color:rgba(255,255,255,.65);font-size:18px;}
.nav-icon-btn:hover{background:rgba(255,255,255,.08);color:#fff;}
.nav-badge{position:absolute;top:2px;right:2px;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;padding:0 4px;}
.nav-badge-teal{background:var(--teal);color:#fff;}
.nav-badge-red{background:var(--red);color:#fff;}
.topnav-avatar{width:32px;height:32px;border-radius:50%;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;cursor:pointer;margin-left:4px;}

/* Mobile hamburger */
.hamburger{display:none;width:36px;height:36px;align-items:center;justify-content:center;cursor:pointer;color:rgba(255,255,255,.7);font-size:22px;}

/* ===== PAGE ===== */
.page{max-width:1480px;margin:0 auto;padding:28px 24px;}
.main-grid-in{display:flex;flex-direction:column;gap:16px;}

/* ===== FOOTER ===== */
.b2b-footer{margin-top:40px;padding:20px 0;border-top:1px solid var(--grey-border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
.b2b-footer p{font-size:11px;color:var(--grey-medium);}
.b2b-footer a{color:var(--teal);text-decoration:none;font-size:11px;font-weight:500;}
.footer-links{display:flex;gap:16px;}

@media(max-width:1024px){
  .main-grid{grid-template-columns:1fr;}
  .main-grid-in {max-width: 100%;overflow: hidden;}      
                        
                        
}
                         
@media(max-width:900px){
body .page-header,body .fin-summary,body .date-range {display: block;}
body .date-range {margin-top: 10px;}
body .date-range .btn-sm{width: 100%;text-align: center;margin-top: 10px;display: block;}
body .kpi-row{max-width:100%;}
body .fin-summary .fin-card{margin-bottom: 15px;}
body .footer-links {display: block;width: 100%;}
body .b2b-footer a {display: block;text-align: center;width: 100%;}
  
/*Responsive Tables*/
body .otbl thead,body .inv-table thead{display: none;}
body .otbl tr,body .inv-table tr { margin-bottom: 20px;overflow: hidden;} 
body .otbl .rbtn,body .inv-table .dl-btn{margin-bottom:20px;}
body .otbl td,body .inv-table td {text-align: right;padding: 12px 15px;padding-left: 45%;position: relative;border-bottom: 1px solid var(--black-transparent-2);min-height: 40px;display: flex;align-items: center;justify-content: flex-end;}
body .otbl td.td-mobile::before,body .inv-table td.td-mobile::before {content: attr(data-label);position: absolute;left: 15px;top: 50%;transform: translateY(-50%);width: 40%;text-align: left;font-weight: 700;color: #555;font-size: 13px;}
/*Responsive Tables*/

  
body .nav-icon-btn{float: left;margin-left: 3%;}
body .search-wrap {float:left;}
body .topnav-badge{margin-left:10px;}
body .topnav-logo {height: 40px;margin-top: 10px;margin-left: 10px;}
body .topnav-avatar{display: block;position: absolute;margin: 0px;top: 10px;right: 10px;text-align: center;line-height: 33px;}
body .alert-bar{display:block;}
body .topnav{display: block;height: auto;padding:0 16px;}
body .topnav::after{content:"";display:block;clear:both;}
body .topnav-left, body .topnav-right{ display: block;width: 100%;}
body .topnav-right{margin-top:10px;margin-bottom: 10px;}
body .topnav-left::after, body .topnav-right::after{content:"";display:block;clear:both;}
body .main-grid {display: block;max-width: 100%!important;}
body .card{max-width:100%;margin-top: 20px;}
body .page{padding:20px 16px;}
body .topnav-links{display:none;}
body .hamburger{display: block;float: left;text-align: center;margin-top: 15px;}
body .topnav-search{width:100%;}
body .topnav-search:focus{width:180px;}
body .welcome{flex-direction:column;gap:12px;}
body .welcome-actions{width:100%;}
body .welcome-actions .btn{flex:1;justify-content:center;}
body .urgency-bar{padding:8px 16px;flex-wrap:wrap;justify-content:center;}

  }