/* EYUP EXPRESS V11.46 FINAL UI OVERRIDES */
:root{--pro-green:#087d43;--pro-green2:#0aa454;--pro-ink:#143326;--pro-muted:#6f8077;--pro-line:#dce8e1;--pro-soft:#f5faf7}

/* Storefront: AI + live support always visible on mobile home */
@media (max-width:800px){
  body:not(.admin-body) .floating{
    display:flex!important;flex-direction:column!important;align-items:flex-end!important;
    right:12px!important;bottom:82px!important;gap:8px!important;z-index:9000!important;
    pointer-events:none!important;
  }
  body:not(.admin-body) .floating .assistant,
  body:not(.admin-body) .floating .whatsapp{
    display:flex!important;align-items:center!important;justify-content:center!important;
    width:auto!important;height:44px!important;min-width:132px!important;max-width:190px!important;
    padding:0 14px!important;border-radius:999px!important;border:2px solid #fff!important;
    color:#fff!important;font-size:12px!important;font-weight:900!important;line-height:1!important;
    box-shadow:0 10px 28px rgba(13,75,46,.22)!important;text-decoration:none!important;
    pointer-events:auto!important;overflow:hidden!important;white-space:nowrap!important;
  }
  body:not(.admin-body) .floating .assistant{background:linear-gradient(135deg,#0d8a49,#0fb862)!important}
  body:not(.admin-body) .floating .whatsapp{background:linear-gradient(135deg,#1e9f50,#25c765)!important}
  body:not(.admin-body) .floating .assistant>img{width:28px!important;height:28px!important;object-fit:cover!important;border-radius:50%!important;margin-right:7px!important;display:block!important}
  body:not(.admin-body) .floating .assistant>span{display:inline!important}
  body:not(.admin-body) .assistant-panel{z-index:9200!important}
}

/* Customer orders: stable mobile alignment, keep Tracking + Invoice */
@media (max-width:700px){
  .account-dashboard-head{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .account-dashboard-head>button{justify-self:start!important;width:auto!important;min-width:118px!important}
  .customer-orders{gap:12px!important}
  .customer-orders article{
    display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;
    align-items:stretch!important;padding:14px!important;border-radius:15px!important;background:#fff!important;
    box-shadow:0 5px 16px rgba(8,72,42,.05)!important;overflow:hidden!important;
  }
  .customer-orders article>div{grid-column:1/-1!important;min-width:0!important}
  .customer-orders article>div b{display:block!important;font-size:15px!important;overflow-wrap:anywhere!important}
  .customer-orders article>div small{display:block!important;font-size:12px!important;line-height:1.4!important;white-space:normal!important;overflow-wrap:anywhere!important}
  .customer-orders article>strong{grid-column:1/-1!important;font-size:20px!important;color:#0a7f45!important}
  .customer-orders article>button{width:100%!important;min-width:0!important;min-height:44px!important;padding:10px 8px!important;font-size:13px!important;white-space:normal!important;line-height:1.15!important}
}

/* Admin mobile sidebar: one real scroll container */
@media (max-width:800px){
  html{overflow-x:hidden!important}
  body.admin-body{height:auto!important;min-height:100dvh!important;overflow-x:hidden!important;overflow-y:auto!important}
  .admin-sidebar{
    position:fixed!important;top:0!important;bottom:0!important;left:-292px!important;width:278px!important;
    height:100dvh!important;max-height:100dvh!important;display:block!important;
    overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;
    overscroll-behavior-y:contain!important;touch-action:pan-y!important;
    padding:14px 12px calc(56px + env(safe-area-inset-bottom))!important;z-index:10050!important;
  }
  .admin-sidebar.open{left:0!important}
  .admin-sidebar .admin-brand-pro{position:sticky!important;top:-14px!important;z-index:3!important;background:#092c21!important;padding-top:14px!important;margin-top:-14px!important}
  .admin-sidebar .admin-nav{display:grid!important;height:auto!important;min-height:max-content!important;overflow:visible!important;padding-bottom:48px!important;touch-action:pan-y!important}
  .admin-sidebar .nav-group,.admin-sidebar .admin-link,.admin-sidebar button,.admin-sidebar span,.admin-sidebar i{touch-action:pan-y!important}
  .admin-overlay,.overlay#adminOverlay{z-index:10040!important}
}

/* Professional admin visual polish */
.admin-body{background:linear-gradient(180deg,#f3f7f5 0%,#edf4f0 100%)!important}
.admin-content{max-width:1640px;margin:0 auto}
.pro-welcome{background:linear-gradient(135deg,#0a3124 0%,#087d43 62%,#0aa454 100%)!important;color:#fff!important;border:0!important;border-radius:22px!important;padding:24px!important;box-shadow:0 18px 48px rgba(8,68,40,.18)!important}
.pro-welcome small,.pro-welcome p{color:rgba(255,255,255,.78)!important}.pro-welcome h1{font-size:30px!important;letter-spacing:-.03em!important}
.admin-head-actions .export-btn{background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.28)!important;backdrop-filter:blur(8px);border-radius:12px!important}
.health-grid article,.metric,.analytics-section,.admin-card,.admin-manager{border:1px solid rgba(205,223,214,.9)!important;box-shadow:0 10px 30px rgba(17,69,43,.055)!important}
.metric{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff,#fbfdfc)!important;border-radius:18px!important;transition:.2s ease!important}
.metric:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#087d43,#28b76b);opacity:.7}
.metric:hover{transform:translateY(-3px)!important;box-shadow:0 16px 35px rgba(17,69,43,.10)!important}
.metric .metric-icon{width:48px!important;height:48px!important;border-radius:14px!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}
.analytics-section{border-radius:22px!important;padding:22px!important;background:linear-gradient(180deg,#fff,#fbfdfc)!important}
.analytics-kpis article{border-radius:16px!important;background:#fff!important;box-shadow:0 7px 20px rgba(17,69,43,.045)!important}
.analytics-card{border-radius:18px!important;background:linear-gradient(180deg,#fff,#fcfefd)!important;box-shadow:0 8px 24px rgba(17,69,43,.045)!important}
.chart-stage{background:linear-gradient(180deg,#f8fcfa 0%,#fff 100%);border-radius:14px;padding:8px}
.rank-chart>div{border-radius:12px!important}
.admin-card-head h3,.analytics-card h3{letter-spacing:-.01em;color:#183b2b}
.manager-panel,.admin-manager{border-radius:20px!important}
.quick-grid button,.quick-links a{border-radius:12px!important;transition:.18s ease!important}.quick-grid button:hover,.quick-links a:hover{transform:translateY(-2px)}

@media(max-width:800px){
  .pro-welcome{border-radius:16px!important;padding:17px!important}.pro-welcome h1{font-size:24px!important}
  .metrics{grid-template-columns:1fr 1fr!important;gap:9px!important}.metric{min-height:92px!important;padding:12px!important}.metric b{font-size:18px!important}
  .analytics-section{padding:12px!important;border-radius:16px!important}.analytics-kpis{grid-template-columns:1fr 1fr!important;gap:8px!important}.analytics-kpis article{padding:10px!important}
}
@media(max-width:430px){.metrics{grid-template-columns:1fr!important}.analytics-kpis{grid-template-columns:1fr!important}}

/* V11.47 premium header/navigation + compact mobile AI */
.brand-wordmark{display:flex!important;align-items:center!important;justify-content:flex-start!important;overflow:visible!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
.brand-wordmark-img{width:250px!important;height:92px!important;object-fit:contain!important;object-position:left center!important;display:block!important;background:transparent!important;filter:none!important}

.pro-desktop-nav{display:grid!important;grid-template-columns:repeat(7,minmax(105px,1fr))!important;gap:0!important;margin-top:12px!important;border:1px solid #e7eee9!important;border-radius:24px!important;background:#fff!important;box-shadow:0 10px 32px rgba(17,74,45,.08)!important;overflow:hidden!important}
.pro-desktop-nav>button{min-height:94px!important;border:0!important;border-right:1px solid #eef2ef!important;background:#fff!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:8px!important;padding:12px 8px!important;font-size:14px!important;color:#13241b!important;transition:.2s ease!important;position:relative!important}
.pro-desktop-nav>button:last-child{border-right:0!important}
.pro-desktop-nav>button:hover{background:#f7fbf8!important;transform:translateY(-1px)!important}
.pro-desktop-nav>button:first-child{background:linear-gradient(180deg,#f2fbf5,#e9f8ee)!important;color:#08783e!important}
.pro-nav-icon{width:42px!important;height:42px!important;display:grid!important;place-items:center!important;border-radius:14px!important;background:#f2f5f3!important;position:relative!important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.025)!important}
.pro-nav-icon svg{width:25px!important;height:25px!important;fill:none!important;stroke:currentColor!important;stroke-width:2.1!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.pro-desktop-nav>button:nth-child(1) .pro-nav-icon{color:#0a9b4b!important;background:#e8f8ef!important}
.pro-desktop-nav>button:nth-child(2) .pro-nav-icon{color:#f39a16!important;background:#fff5df!important}
.pro-desktop-nav>button:nth-child(3) .pro-nav-icon{color:#ee3f45!important;background:#fff0f1!important}
.pro-desktop-nav>button:nth-child(4) .pro-nav-icon{color:#2377d8!important;background:#edf5ff!important}
.pro-desktop-nav>button:nth-child(5) .pro-nav-icon{color:#ff4266!important;background:#fff0f4!important}
.pro-desktop-nav>button:nth-child(6) .pro-nav-icon{color:#099a43!important;background:#ecf9f0!important}
.pro-desktop-nav>button:nth-child(7) .pro-nav-icon{color:#7445df!important;background:#f3efff!important}
.pro-nav-icon em{position:absolute!important;top:-8px!important;right:-8px!important;min-width:22px!important;height:22px!important;padding:0 6px!important;border-radius:999px!important;background:#ff1f29!important;color:#fff!important;font-size:11px!important;font-style:normal!important;display:grid!important;place-items:center!important;border:2px solid #fff!important;box-shadow:0 3px 10px rgba(255,31,41,.25)!important}

@media(max-width:760px){
  .brand-wordmark-img{width:196px!important;height:72px!important;object-position:left center!important}
  body:not(.admin-body) .floating{right:12px!important;bottom:78px!important;gap:0!important}
  body:not(.admin-body) .floating .whatsapp{display:none!important}
  body:not(.admin-body) .floating .assistant{min-height:38px!important;height:38px!important;padding:0 13px!important;border-radius:18px!important;font-size:12px!important;font-weight:800!important;box-shadow:0 8px 20px rgba(13,138,73,.22)!important}
  body:not(.admin-body) .floating .assistant .online-dot{width:7px!important;height:7px!important;margin-right:5px!important}
}
