@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
/* Sidebar unificado Shop Mobile - painel lojista e admin */
:root{
  --sm-side-bg:#0b1220;
  --sm-side-bg-2:#0f172a;
  --sm-side-card:#111a2e;
  --sm-side-border:rgba(148,163,184,.18);
  --sm-side-text:#eef2ff;
  --sm-side-muted:#9fb4d1;
  --sm-side-active:#20b857;
}
body:has(.sm-unified-sidebar), body:has(.ml2-sidebar){background:#020617!important;}
.dashboard.merchant-dashboard{grid-template-columns:250px minmax(0,1fr)!important;background:#020617!important;color:#e5e7eb!important;}
.admin-shell.sm-admin-shell{grid-template-columns:250px minmax(0,1fr)!important;gap:0!important;max-width:none!important;margin:0!important;padding:0!important;min-height:calc(100vh - 66px)!important;background:#020617!important;}
.sm-unified-sidebar,
.admin-sidebar.sm-unified-sidebar,
.dashboard.merchant-dashboard > .sm-unified-sidebar{
  width:250px!important;
  min-width:250px!important;
  height:calc(100vh - 66px)!important;
  top:66px!important;
  position:sticky!important;
  align-self:start!important;
  padding:20px 14px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  background:linear-gradient(180deg,var(--sm-side-bg-2),var(--sm-side-bg))!important;
  color:var(--sm-side-text)!important;
  border-radius:0!important;
  border:0!important;
  border-right:1px solid var(--sm-side-border)!important;
  box-shadow:none!important;
  z-index:70!important;
}
.sm-sidebar-brand,
.merchant-sidebar-brand.sm-sidebar-brand{
  display:flex!important;align-items:center!important;gap:12px!important;
  padding:0 0 22px!important;margin:0 0 12px!important;
  border-bottom:0!important;color:#fff!important;
}
.sm-sidebar-logo,
.merchant-sidebar-logo.sm-sidebar-logo{
  width:36px!important;height:36px!important;border-radius:12px!important;
  background:linear-gradient(135deg,#19d39b,#22c6c8)!important;
  box-shadow:0 12px 28px rgba(34,197,94,.25)!important;
  color:#83e4ec!important;font-weight:900!important;font-size:15px!important;display:grid!important;place-items:center!important;
}
.sm-sidebar-brand strong{display:block!important;font-size:16px!important;line-height:1!important;font-weight:900!important;color:#fff!important;letter-spacing:-.02em!important;}
.sm-sidebar-brand span{display:block!important;margin-top:4px!important;font-size:11px!important;color:var(--sm-side-muted)!important;font-weight:800!important;}
.sm-sidebar-nav,
.merchant-sidebar-nav.sm-sidebar-nav{
  display:flex!important;flex-direction:column!important;gap:8px!important;
  padding:0!important;margin:0!important;overflow:visible!important;flex:initial!important;
}
.sm-sidebar-nav a,
.admin-sidebar.sm-unified-sidebar a,
.merchant-sidebar-nav.sm-sidebar-nav a{
  display:flex!important;align-items:center!important;gap:10px!important;
  min-height:42px!important;padding:11px 14px!important;margin:0!important;
  border-radius:12px!important;border:1px solid transparent!important;
  background:transparent!important;color:#dbe4f0!important;text-decoration:none!important;
  font-weight:850!important;box-shadow:none!important;transform:none!important;transition:.18s ease!important;
}
.sm-sidebar-nav a .menu-icon{width:20px!important;height:20px!important;display:grid!important;place-items:center!important;flex:0 0 20px!important;background:transparent!important;border-radius:0!important;font-size:16px!important;}
.sm-sidebar-nav a .menu-text{display:block!important;min-width:0!important;}
.sm-sidebar-nav a .menu-text b{display:block!important;font-size:14px!important;line-height:1.15!important;color:inherit!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.sm-sidebar-nav a:hover{background:rgba(148,163,184,.12)!important;color:#fff!important;transform:translateX(2px)!important;}
.sm-sidebar-nav a.active{
  background:linear-gradient(135deg,#22c55e,#16a34a)!important;color:#fff!important;
  border-color:rgba(34,197,94,.45)!important;box-shadow:0 14px 34px rgba(34,197,94,.22)!important;
}
.sm-sidebar-section-title{
  margin:22px 12px 12px!important;padding-top:20px!important;border-top:1px solid rgba(148,163,184,.14)!important;
  color:#93c5fd!important;font-size:12px!important;line-height:1!important;font-weight:950!important;letter-spacing:.08em!important;text-transform:uppercase!important;
}
.sm-editor-nav{gap:7px!important;}
.sm-editor-nav a{color:#cbd5e1!important;}
.sm-sidebar-footer{display:grid!important;gap:8px!important;margin-top:16px!important;padding-top:14px!important;border-top:1px solid rgba(148,163,184,.14)!important;}
.sm-sidebar-footer a{justify-content:center!important;background:rgba(148,163,184,.10)!important;color:#fff!important;border-radius:12px!important;font-size:13px!important;}
.sm-sidebar-logout{color:#e5e7eb!important;}
.admin-content{padding:32px 38px 60px!important;min-width:0!important;background:radial-gradient(circle at 80% 0%,rgba(37,99,235,.12),transparent 28%),#020617!important;color:#e5e7eb!important;}
.dashboard.merchant-dashboard main{background:radial-gradient(circle at 80% 0%,rgba(37,99,235,.10),transparent 28%),#020617!important;min-height:calc(100vh - 66px)!important;}
/* Minha Loja 2.0 usando o mesmo visual */
.ml2-page{background:#020617!important;color:#e5e7eb!important;}
.ml2-shell{display:grid!important;grid-template-columns:250px minmax(0,1fr)!important;gap:0!important;max-width:none!important;margin:0!important;min-height:100vh!important;}
.ml2-sidebar{
  width:250px!important;min-width:250px!important;height:100vh!important;position:sticky!important;top:0!important;
  padding:20px 14px!important;background:linear-gradient(180deg,var(--sm-side-bg-2),var(--sm-side-bg))!important;
  border-right:1px solid var(--sm-side-border)!important;border-radius:0!important;box-shadow:none!important;overflow-y:auto!important;color:#fff!important;
}
.ml2-sidebar-logo{display:flex!important;align-items:center!important;gap:12px!important;padding:0 0 22px!important;margin:0 0 12px!important;color:#fff!important;font-size:16px!important;font-weight:900!important;}
.ml2-sidebar-logo span{width:36px!important;height:36px!important;border-radius:12px!important;background:linear-gradient(135deg,#19d39b,#22c6c8)!important;color:#83e4ec!important;display:grid!important;place-items:center!important;font-size:15px!important;}
.ml2-sidebar-menu{display:flex!important;flex-direction:column!important;gap:8px!important;}
.ml2-sidebar-menu a{display:flex!important;align-items:center!important;gap:10px!important;min-height:42px!important;padding:11px 14px!important;border-radius:12px!important;color:#dbe4f0!important;text-decoration:none!important;font-weight:850!important;background:transparent!important;border:1px solid transparent!important;}
.ml2-sidebar-menu a:hover{background:rgba(148,163,184,.12)!important;color:#fff!important;transform:translateX(2px)!important;}
.ml2-sidebar-menu a.active{background:rgba(148,163,184,.18)!important;color:#fff!important;box-shadow:none!important;}
.ml2-main{min-width:0!important;padding:24px 28px 56px!important;background:radial-gradient(circle at 80% 0%,rgba(37,99,235,.10),transparent 30%),#020617!important;}
.ml2-wrap{display:grid!important;grid-template-columns:230px minmax(0,1fr)!important;gap:22px!important;align-items:start!important;}
.ml2-side{background:rgba(15,23,42,.94)!important;border:1px solid rgba(148,163,184,.22)!important;border-radius:22px!important;padding:18px!important;box-shadow:0 24px 60px rgba(0,0,0,.28)!important;position:sticky!important;top:22px!important;}
.ml2-side-title{color:#93c5fd!important;font-size:12px!important;font-weight:950!important;letter-spacing:.08em!important;text-transform:uppercase!important;margin-bottom:14px!important;}
.ml2-tab{width:100%!important;display:flex!important;align-items:center!important;gap:10px!important;margin:0 0 8px!important;padding:12px 14px!important;border:0!important;border-radius:12px!important;background:transparent!important;color:#cbd5e1!important;font-weight:900!important;text-align:left!important;cursor:pointer!important;}
.ml2-tab:hover{background:rgba(148,163,184,.12)!important;color:#fff!important;}
.ml2-tab.active{background:linear-gradient(135deg,#22c55e,#16a34a)!important;color:#fff!important;box-shadow:0 14px 34px rgba(34,197,94,.22)!important;}
.ml2-top{background:rgba(15,23,42,.85)!important;border-color:rgba(148,163,184,.18)!important;color:#e5e7eb!important;}
/* cartões e tabelas em dark dentro de admin */
body:has(.admin-shell) .admin-title,
body:has(.admin-shell) .metric-card,
body:has(.admin-shell) .crud-card{background:rgba(15,23,42,.88)!important;border:1px solid rgba(148,163,184,.18)!important;color:#e5e7eb!important;box-shadow:0 22px 70px rgba(0,0,0,.25)!important;}
body:has(.admin-shell) .admin-title h1,
body:has(.admin-shell) .crud-card h2,
body:has(.admin-shell) .metric-card strong{color:#f8fafc!important;}
body:has(.admin-shell) .admin-title p,
body:has(.admin-shell) .metric-card span,
body:has(.admin-shell) .metric-card small{color:#a7b3c7!important;}
body:has(.admin-shell) td{background:#0f172a!important;border-color:rgba(148,163,184,.12)!important;color:#dbe4f0!important;}
body:has(.admin-shell) th{color:#93a4bd!important;}
@media(max-width:980px){
  .dashboard.merchant-dashboard,.admin-shell.sm-admin-shell,.ml2-shell{display:block!important;grid-template-columns:1fr!important;}
  .sm-unified-sidebar,.admin-sidebar.sm-unified-sidebar,.dashboard.merchant-dashboard > .sm-unified-sidebar,.ml2-sidebar{
    position:fixed!important;top:64px!important;left:0!important;height:calc(100vh - 64px)!important;width:min(86vw,300px)!important;min-width:0!important;z-index:1000!important;transform:translateX(-105%)!important;transition:transform .22s ease!important;
  }
  body.mobile-menu-open .sm-unified-sidebar,html.mobile-menu-open .sm-unified-sidebar,body.mobile-menu-open .ml2-sidebar,html.mobile-menu-open .ml2-sidebar{transform:translateX(0)!important;}
  .admin-content,.dashboard.merchant-dashboard main,.ml2-main{padding:22px 16px 48px!important;min-height:calc(100vh - 64px)!important;}
  .ml2-wrap{grid-template-columns:1fr!important;}
  .ml2-side{position:relative!important;top:auto!important;}
}
@media(max-width:560px){.admin-content,.dashboard.merchant-dashboard main,.ml2-main{padding:18px 12px 42px!important}.ml2-side{border-radius:18px!important;padding:14px!important}}

/* Topbar base para páginas que usam apenas app.css + sidebar-unified.css */
.app-topbar{
  position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:10050!important;
  height:66px!important;min-height:66px!important;padding:0 22px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;
  background:rgba(2,6,23,.92)!important;border-bottom:1px solid rgba(148,163,184,.16)!important;
  box-shadow:0 16px 45px rgba(0,0,0,.32)!important;backdrop-filter:blur(16px)!important;
}
.app-topbar-left{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important;}
.app-topbar-brand{display:flex!important;align-items:center!important;gap:10px!important;font-weight:950!important;color:#f8fafc!important;text-decoration:none!important;letter-spacing:-.03em!important;white-space:nowrap!important;}
.app-topbar-brand span{width:38px!important;height:38px!important;border-radius:14px!important;display:grid!important;place-items:center!important;background:linear-gradient(135deg,#19d39b,#22c6c8)!important;color:#83e4ec!important;font-weight:950!important;}
.app-topbar-links{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important;}
.app-topbar-links a{color:#cbd5e1!important;font-weight:900!important;text-decoration:none!important;padding:9px 11px!important;border-radius:12px!important;white-space:nowrap!important;}
.app-topbar-links a:hover{background:rgba(148,163,184,.12)!important;color:#fff!important;}
.app-topbar-exit{background:rgba(239,68,68,.14)!important;color:#fecaca!important;}
.dashboard.merchant-dashboard,.admin-shell.sm-admin-shell{padding-top:66px!important;}
.ml2-dashboard.dashboard.merchant-dashboard{padding-top:66px!important;}
@media(max-width:760px){
  .app-topbar{height:64px!important;min-height:64px!important;padding:0 12px!important;align-items:center!important;}
  .app-topbar-brand{font-size:0!important;max-width:170px!important;overflow:hidden!important;}
  .app-topbar-brand:after{content:'Shop Mobile';font-size:15px!important;color:#f8fafc!important;}
  .app-topbar-brand span{width:34px!important;height:34px!important;border-radius:12px!important;font-size:13px!important;}
  .app-topbar-links{margin-left:auto!important;gap:8px!important;flex-wrap:nowrap!important;}
  .app-topbar-links a:not(.app-topbar-exit){display:none!important;}
  .app-topbar-exit{display:none!important;}
  .dashboard.merchant-dashboard,.admin-shell.sm-admin-shell,.ml2-dashboard.dashboard.merchant-dashboard{padding-top:64px!important;}
}


/* ===== Correção definitiva: sidebar única sem topo duplicado ===== */
html,body{min-height:100%;}
body:has(.dashboard.merchant-dashboard),body:has(.admin-shell.sm-admin-shell){margin:0!important;background:#020617!important;overflow-x:hidden!important;}
.dashboard.merchant-dashboard,.admin-shell.sm-admin-shell{
  display:grid!important;grid-template-columns:250px minmax(0,1fr)!important;gap:0!important;
  min-height:100vh!important;padding-top:0!important;background:#020617!important;color:#e5e7eb!important;
}
.sm-unified-sidebar,.admin-sidebar.sm-unified-sidebar,.dashboard.merchant-dashboard > .sm-unified-sidebar{
  position:sticky!important;top:0!important;left:0!important;height:100vh!important;min-height:100vh!important;
  width:250px!important;min-width:250px!important;padding:20px 14px!important;z-index:50!important;
  overflow-y:auto!important;overflow-x:hidden!important;scrollbar-width:thin!important;
}
.dashboard.merchant-dashboard main,.admin-content,.ml2-main{
  min-width:0!important;min-height:100vh!important;padding:32px 38px 60px!important;
  background:radial-gradient(circle at 82% 0%,rgba(37,99,235,.12),transparent 30%),#020617!important;
}
.app-topbar{display:none!important;}
/* Minha Loja: as abas ficam no menu lateral principal, não em um segundo menu interno */
.ml2-dashboard.dashboard.merchant-dashboard{padding-top:0!important;}
.ml2-wrap{display:block!important;grid-template-columns:1fr!important;max-width:1180px!important;margin:0 auto!important;}
.ml2-side{display:none!important;}
.ml2-content{min-width:0!important;width:100%!important;}
.ml2-top{max-width:1180px!important;margin:0 auto 24px!important;border-radius:22px!important;}
.ml2-head{border-radius:22px!important;}
/* menu editor compacto e legível */
.sm-sidebar-section-title{margin-top:18px!important;}
.sm-editor-nav a{min-height:38px!important;padding:9px 12px!important;}
/* remove qualquer topo horizontal antigo do painel */
body:has(.dashboard.merchant-dashboard) > header.topbar,
body:has(.admin-shell.sm-admin-shell) > header.topbar{display:none!important;}
@media(max-width:980px){
  .dashboard.merchant-dashboard,.admin-shell.sm-admin-shell{display:block!important;}
  .sm-unified-sidebar,.admin-sidebar.sm-unified-sidebar,.dashboard.merchant-dashboard > .sm-unified-sidebar{
    position:fixed!important;top:0!important;height:100vh!important;width:min(86vw,300px)!important;transform:translateX(-105%)!important;z-index:1000!important;
  }
  body.mobile-menu-open .sm-unified-sidebar,html.mobile-menu-open .sm-unified-sidebar{transform:translateX(0)!important;}
  .dashboard.merchant-dashboard main,.admin-content,.ml2-main{padding:22px 16px 48px!important;}
}

/* Extras do menu do lojista */
.sm-sidebar-section-title{
  margin:14px 12px 6px;
  font-size:11px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:rgba(255,255,255,.48);
  font-weight:800;
}
.sm-extra-menu-link .menu-text{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:100%;
}
.sm-extra-menu-link .menu-text small{
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  padding:3px 7px;
  border-radius:999px;
  color:#facc15;
  background:rgba(250,204,21,.12);
  border:1px solid rgba(250,204,21,.22);
}

*{font-family:'Inter',sans-serif !important;}