*{box-sizing:border-box}

/* ===== Variáveis de Cores do Admin ===== */
:root{
  --admin-primary:#6c5ce7;
  --admin-primary-hover:#5a4fcf;
  --admin-success:#28a745;
  --admin-error:#dc3545;
  --admin-warning:#ffc107;
  --admin-info:#17a2b8;
  --admin-text:#333;
  --admin-text-light:#666;
  --admin-border:#e5e5e5;
  --admin-bg:#fff;
  --admin-bg-light:#f8f9fa;
}

/* ===== Ícones SVG Padronizados ===== */
.admin-icon{
  width:16px;
  height:16px;
  display:inline-block;
  vertical-align:middle;
  fill:currentColor;
  flex-shrink:0;
}

.admin-icon-sm{
  width:14px;
  height:14px;
}

.admin-icon-lg{
  width:20px;
  height:20px;
}

/* ===== Modal de Mensagem Centralizado ===== */
.message-modal{
  position:fixed;
  inset:0;
  z-index:10000;
  display:none;
  align-items:center;
  justify-content:center;
  opacity:0;
  transition:opacity 0.3s ease;
}

.message-modal.show{
  display:flex;
  opacity:1;
}

.message-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.5);
  backdrop-filter:blur(2px);
}

.message-modal-content{
  position:relative;
  background:#fff;
  border-radius:12px;
  padding:40px;
  max-width:480px;
  width:90%;
  box-shadow:0 8px 32px rgba(0,0,0,0.2);
  text-align:center;
  transform:scale(0.9);
  transition:transform 0.3s ease;
}

.message-modal.show .message-modal-content{
  transform:scale(1);
}

.message-modal-icon{
  margin-bottom:24px;
}

.message-icon-circle{
  width:80px;
  height:80px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:40px;
  font-weight:bold;
}

.message-icon-circle svg{
  width:40px;
  height:40px;
  stroke-width:2.5;
}

.message-modal-title{
  font-size:24px;
  font-weight:700;
  color:#333;
  margin:0 0 12px;
}

.message-modal-text{
  font-size:16px;
  color:#666;
  line-height:1.5;
  margin:0 0 32px;
}

.message-modal-btn{
  background:var(--admin-primary);
  color:#fff;
  border:none;
  padding:12px 48px;
  border-radius:6px;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  transition:background 0.2s ease;
}

.message-modal-btn:hover{
  background:var(--admin-primary-hover);
}

@media (max-width:768px){
  .message-modal-content{
    padding:32px 24px;
  }
  
  .message-icon-circle{
    width:64px;
    height:64px;
    font-size:32px;
  }
  
  .message-modal-title{
    font-size:20px;
  }
  
  .message-modal-text{
    font-size:14px;
  }
}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:#fff;
  color:#000;
  line-height:1.5;
}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:24px 20px}
@media (max-width:768px){
  .wrap{padding:16px 12px}
}

/* Breadcrumb */
.breadcrumb{
  max-width:1200px;
  margin:0 auto;
  padding:16px 20px 0;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:#666;
  flex-wrap:wrap;
}
.breadcrumb a{
  color:#666;
  text-decoration:none;
  transition:color 0.2s ease;
}
.breadcrumb a:hover{
  color:var(--primary-color, #ff6a3d);
}
.breadcrumb span:not(.breadcrumb-separator){
  color:#000;
  font-weight:500;
}
.breadcrumb-separator{
  color:#999;
  margin:0 2px;
}

/* Banner Promocional */
.promotional-banner{
  background:var(--primary-color, #ff6a3d);
  color:#fff;
  text-align:center;
  padding:12px 20px;
  font-size:14px;
  font-weight:500;
  letter-spacing:0.3px;
}
.promotional-banner p{
  margin:0;
}

.top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:20px 24px;
  border-bottom:1px solid #e5e5e5;
  gap:32px;
  background:#fff;
  position:relative;
}
.brand{
  font-weight:600;
  letter-spacing:1px;
  font-size:18px;
  white-space:nowrap;
  color:#000;
}
.nav-main{
  display:flex;
  gap:8px;
  flex:1;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
}
.nav-link{
  padding:6px 12px;
  border-radius:4px;
  font-weight:500;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:0.5px;
  transition:all 0.2s ease;
  border:none;
  white-space:nowrap;
  color:#666;
}
.nav-link:hover{
  color:#000;
  background:transparent;
}
.nav-link.active{
  color:#000;
  font-weight:600;
  background:transparent;
  border-bottom:2px solid #000;
  border-radius:0;
  padding-bottom:4px;
}
.nav-item-dropdown{
  position:relative;
}
.nav-dropdown-menu{
  position:absolute;
  top:100%;
  left:0;
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:6px;
  box-shadow:0 4px 12px rgba(0,0,0,0.1);
  min-width:180px;
  opacity:0;
  visibility:hidden;
  transform:translateY(-10px);
  transition:all 0.2s ease;
  z-index:1000;
  margin-top:8px;
  padding:8px 0;
}
.nav-item-dropdown:hover .nav-dropdown-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.nav-dropdown-item{
  display:block;
  padding:10px 16px;
  color:#666;
  text-decoration:none;
  font-size:13px;
  text-transform:none;
  letter-spacing:0;
  transition:all 0.2s ease;
  border-left:3px solid transparent;
}
.nav-dropdown-item:hover{
  background:#f8f8f8;
  color:#000;
  border-left-color:#000;
}
.nav-dropdown-item.active{
  background:#f8f8f8;
  color:#000;
  font-weight:500;
  border-left-color:#000;
}
.nav-utils{
  display:flex;
  gap:16px;
  align-items:center;
}
.nav-utils a{
  color:#666;
  font-size:13px;
  font-weight:500;
  transition:color 0.2s ease;
}
.nav-utils a:hover{
  color:#000;
}

/* Header Search */
.header-search{
  display:flex;
  align-items:center;
  position:relative;
}
.header-search-input{
  padding:8px 40px 8px 12px;
  border:1px solid #ddd;
  border-radius:20px;
  font-size:14px;
  width:200px;
  transition:all 0.2s ease;
  outline:none;
}
.header-search-input:focus{
  border-color:var(--primary-color, #ff6a3d);
  width:250px;
}
.header-search-btn{
  position:absolute;
  right:8px;
  background:transparent;
  border:none;
  cursor:pointer;
  padding:4px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#666;
  transition:color 0.2s ease;
}
.header-search-btn:hover{
  color:var(--primary-color, #ff6a3d);
}
.cart-link{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#666;
  transition:color 0.2s ease;
}
.cart-link:hover{
  color:var(--primary-color, #ff6a3d);
}
.cart-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  background:var(--primary-color, #ff6a3d);
  color:#fff;
  border-radius:50%;
  width:18px;
  height:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:600;
}

.hero{
  padding:32px 0 24px;
  text-align:center;
}

/* Filtro de ordenação */
.sort-filter{
  max-width:1200px;
  margin:0 auto 24px;
  padding:0 20px;
  display:flex;
  align-items:center;
  gap:12px;
  justify-content:flex-end;
}

.sort-filter label{
  font-size:14px;
  font-weight:500;
  color:#333;
}

.sort-filter select{
  padding:8px 12px;
  border:1px solid #ddd;
  border-radius:6px;
  font-size:14px;
  background:#fff;
  color:#333;
  cursor:pointer;
  transition:border-color 0.2s ease;
}

.sort-filter select:hover{
  border-color:#999;
}

.sort-filter select:focus{
  outline:none;
  border-color:#000;
}

@media (max-width:768px){
  .sort-filter{
    justify-content:center;
    padding:0 16px;
  }
}
.hero h1{
  margin:0 0 8px;
  font-size:24px;
  font-weight:500;
  letter-spacing:-0.5px;
}
.hero p{
  margin:0 0 16px;
  color:#666;
  font-size:14px;
}
.category-filter-active{
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:8px 16px;
  background:#f9f9f9;
  border:1px solid #e5e5e5;
  border-radius:20px;
  margin-top:16px;
  font-size:13px;
  color:#666;
}
.clear-filter{
  margin-left:8px;
  color:#000;
  text-decoration:underline;
  font-weight:500;
  font-size:12px;
}
.clear-filter:hover{
  text-decoration:none;
}

.grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:32px;
}
@media screen and (max-width:900px){
  .grid,
  section.grid{
    display:grid !important;
    grid-template-columns:repeat(2,1fr) !important;
    gap:12px !important;
    width:100% !important;
  }
  .grid > .card,
  .grid > .product-card,
  section.grid > .card,
  section.grid > .product-card{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
}
.card{
  border:none;
  border-radius:0;
  overflow:visible;
  background:#fff;
  transition:transform 0.2s ease;
  display:flex;
  flex-direction:column;
}
.card:hover{
  transform:translateY(-2px);
}
/* ===== Cards Alto Giro ===== */
.card-ag{
  position:relative;
}

.card-ag img{
  transition: transform .25s ease, filter .25s ease;
}

.card-ag:hover img{
  transform: scale(1.01);
  filter: contrast(1.02);
}

.card-image-wrapper{
  position:relative;
  width:100%;
  aspect-ratio:3/4;
  overflow:hidden;
  background:#f9f9f9;
  display:block;
  text-decoration:none;
  color:inherit;
}

a.card-image-wrapper{
  text-decoration:none;
  color:inherit;
}
.card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:0;
}
.card-body{
  padding:16px 0 0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:10px;
  justify-content:space-between;
}
.title{
  font-weight:500;
  margin-bottom:0;
  font-size:13px;
  color:#000;
  line-height:1.4;
  letter-spacing:-0.2px;
  text-transform:uppercase;
}
@media (max-width:900px){
  .title{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:1.2;
  }
}
.subline{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
}

.meta-chip{
  display:inline-block;
  padding:6px 12px;
  background:#f5f5f5;
  border:1px solid #e5e5e5;
  border-radius:4px;
  font-size:12px;
  color:#666;
  font-weight:400;
}

.meta-chip strong{
  font-weight:600;
  color:#000;
}

.meta-chip.dark{
  background:#000;
  color:#fff;
  border-color:#000;
}

.meta-chip.dark strong{
  color:#fff;
}
.prices{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
  margin-top:4px;
}
.price-left{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.old{
  text-decoration:line-through;
  color:#999;
  font-size:12px;
  line-height:1;
}
.new{
  font-weight:700;
  font-size:18px;
  color:#000;
  letter-spacing:-0.3px;
  line-height:1.2;
}
/* Badge de desconto no canto superior direito */
.discount-badge{
  position:absolute;
  top:12px;
  right:12px;
  background:#ff6a3d;
  color:#fff;
  font-weight:800;
  font-size:14px;
  padding:6px 12px;
  border-radius:999px;
  z-index:3;
  pointer-events:auto;
  box-shadow:0 2px 8px rgba(0,0,0,0.2);
  letter-spacing:0.5px;
}
@media (max-width:900px){
  .discount-badge{
    top:8px;
    right:8px;
    font-size:10px;
    padding:4px 8px;
    letter-spacing:0.3px;
  }
  .outlet-badge{
    top:8px !important;
    left:8px !important;
    font-size:9px !important;
    padding:4px 8px !important;
    letter-spacing:0.3px !important;
  }
}
.product-meta{
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
  margin-bottom:8px;
}
.size-tag{
  display:inline-block;
  font-weight:500;
  font-size:11px;
  color:#000;
  padding:3px 8px;
  border:1px solid #000;
  border-radius:0;
  letter-spacing:0.3px;
  min-width:28px;
  text-align:center;
}
.badge{
  display:inline-block;
  background:#000;
  color:#fff;
  padding:3px 6px;
  border-radius:0;
  font-size:9px;
  font-weight:500;
  letter-spacing:0.3px;
  text-transform:uppercase;
}
.badge.outline{
  background:transparent;
  color:#666;
  border:1px solid #e5e5e5;
}
.color-options{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:8px;
}
.color-label{
  font-size:10px;
  color:#666;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:0.3px;
}
.color-buttons{
  display:flex;
  gap:4px;
  align-items:center;
}
.color-btn{
  width:20px;
  height:20px;
  border-radius:50%;
  border:1.5px solid #e5e5e5;
  cursor:pointer;
  padding:0;
  background:#ccc;
  transition:all 0.2s ease;
  position:relative;
  flex-shrink:0;
}
.color-btn:hover{
  transform:scale(1.1);
  border-color:#000;
}
.color-btn.active{
  border-color:#000;
  border-width:1.5px;
}
.color-btn.active::after{
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  width:6px;
  height:6px;
  border-radius:50%;
  background:#fff;
  border:1px solid #000;
}

.product{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:48px;
  align-items:start;
}
.gallery img{
  width:100%;
  border:none;
  border-radius:0;
  margin-bottom:0;
}
.info{
  padding-top:0;
}
.info h2{
  margin:0 0 24px;
  font-size:32px;
  font-weight:400;
  letter-spacing:-1px;
  line-height:1.2;
  color:#000;
}
.meta-minimal{
  font-size:13px;
  color:#666;
  margin-bottom:8px;
  font-weight:400;
}
.price-minimal{
  margin:32px 0;
}
.old-minimal{
  display:block;
  text-decoration:line-through;
  color:#999;
  font-size:13px;
  margin-bottom:4px;
}
.price-row{
  display:flex;
  align-items:baseline;
  gap:12px;
}
.new-minimal{
  font-size:20px;
  font-weight:400;
  color:#000;
  letter-spacing:-0.3px;
}
.discount-minimal{
  font-size:11px;
  font-weight:400;
  color:#666;
}
.btn{
  margin-top:32px;
  background:#000;
  color:#fff;
  border:none;
  border-radius:0;
  padding:14px 24px;
  font-weight:400;
  font-size:12px;
  letter-spacing:0.5px;
  text-transform:uppercase;
}

.btn-whatsapp{
  margin-top:0;
}

.btn-whatsapp:hover{
  background:#20BA5A !important;
  transform:scale(1.05);
}

.btn{
  cursor:pointer;
  width:100%;
  transition:background 0.2s ease;
  display:block;
  text-align:center;
  text-decoration:none;
  pointer-events:auto;
}

.btn.btn-cta{
  background:#ff6a3d !important;
  color:#fff !important;
  font-weight:700 !important;
  font-size:14px !important;
  letter-spacing:1px !important;
  padding:16px 32px !important;
  box-shadow:0 4px 12px rgba(255,106,61,0.4) !important;
}

.btn.btn-cta:hover{
  background:#e55a2d !important;
  color:#fff !important;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(255,106,61,0.5) !important;
  text-decoration:none;
}

.btn:hover{
  background:#333;
  color:#fff;
  text-decoration:none;
}
.note{margin-top:14px;opacity:.75;font-size:13px;line-height:1.4}
.back{
  display:inline-block;
  margin:0 0 24px;
  color:#666;
  font-size:12px;
  transition:color 0.2s ease;
  font-weight:400;
}
.back:hover{
  color:#000;
}

/* ===== ADMIN - ESTILOS PADRONIZADOS ===== */
.admin-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:32px;
  flex-wrap:wrap;
  gap:24px;
  padding:24px 28px;
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
  border-radius:16px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  border: 1px solid rgba(0, 0, 0, 0.05);
  position:relative;
  overflow:hidden;
}
.admin-top-header{
  flex:1;
  min-width:0;
}
.admin-top::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background: linear-gradient(90deg, #ff6a3d 0%, #4f46e5 50%, #10b981 100%);
}
.admin-top h1,
.admin-top h2{
  margin:0;
  font-size:32px;
  font-weight:800;
  flex-shrink:0;
  text-align:left !important;
  background: linear-gradient(135deg, #1a1a1a 0%, #4f46e5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  letter-spacing:-1px;
  line-height:1.2;
  position:relative;
  z-index:1;
}
.admin-top h1{
  font-size:36px;
}
.admin-top p{
  margin:0;
  color:#64748b;
  font-size:15px;
  font-weight:500;
  position:relative;
  z-index:1;
}
.admin-nav-buttons{
  display:flex !important;
  flex-direction:row !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex:1;
  min-width:0;
  position:relative;
  z-index:1;
}

.admin-nav-buttons .btn,
.admin-nav-buttons .btn-outline{
  flex-shrink:0;
  white-space:nowrap;
}

@media (max-width:1400px){
  .admin-nav-buttons{
    flex-wrap:wrap !important;
    flex-direction:row !important;
  }
}

/* Botões Admin Padronizados */
.admin-top .btn-outline,
.admin-nav-buttons .btn-outline{
  padding:10px 18px;
  font-size:13px;
  font-weight:600;
  letter-spacing:0.3px;
  text-transform:none;
  border-radius:10px;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
  transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  background:#ffffff;
  color:#334155;
  border:1.5px solid #e2e8f0;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  position:relative;
  overflow:hidden;
}
.admin-top .btn-outline::before,
.admin-nav-buttons .btn-outline::before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  transition:left 0.5s;
}
.admin-top .btn-outline:hover::before,
.admin-nav-buttons .btn-outline:hover::before{
  left:100%;
}

.admin-top .btn-outline:hover,
.admin-nav-buttons .btn-outline:hover{
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
  color:#fff;
  border-color:#4f46e5;
  transform:translateY(-2px);
  box-shadow: 0 8px 16px rgba(79, 70, 229, 0.3);
}

.admin-top .btn,
.admin-nav-buttons .btn{
  padding:10px 18px !important;
  font-size:13px !important;
  font-weight:600 !important;
  letter-spacing:0.3px !important;
  text-transform:none !important;
  border-radius:10px !important;
  text-decoration:none !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  white-space:nowrap !important;
  transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
  color:#fff !important;
  border:none !important;
  box-shadow: 0 4px 12px rgba(79, 70, 229, 0.3) !important;
  position:relative !important;
  overflow:hidden !important;
  margin-top:0 !important;
  width:auto !important;
}
.admin-top .btn::before,
.admin-nav-buttons .btn::before{
  content:'' !important;
  position:absolute !important;
  top:0 !important;
  left:-100% !important;
  width:100% !important;
  height:100% !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent) !important;
  transition:left 0.5s !important;
}
.admin-top .btn:hover::before,
.admin-nav-buttons .btn:hover::before{
  left:100% !important;
}

.admin-top .btn:hover,
.admin-nav-buttons .btn:hover{
  background: linear-gradient(135deg, #4338ca 0%, #6d28d9 100%) !important;
  transform:translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(79, 70, 229, 0.4) !important;
  color:#fff !important;
}


/* Ícones Admin Padronizados */
.admin-top .admin-icon{
  width:16px;
  height:16px;
  display:inline-block;
  vertical-align:middle;
  fill:currentColor;
  flex-shrink:0;
}

/* Background sutil para páginas admin */
body[class*="admin"] .content,
body:has(.admin-top) .content{
  background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%);
  min-height:100vh;
}

/* Botão Voltar Padronizado */
.admin-btn-voltar{
  padding:10px 20px !important;
  font-size:14px !important;
  font-weight:600 !important;
  letter-spacing:0.2px !important;
  text-transform:none !important;
  border-radius:10px !important;
  text-decoration:none !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  white-space:nowrap !important;
  transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  background:#ffffff !important;
  color:#64748b !important;
  border:1.5px solid #cbd5e1 !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04) !important;
  position:relative !important;
  overflow:hidden !important;
  flex-shrink:0 !important;
}
.admin-btn-voltar:hover{
  background:#f8fafc !important;
  color:#475569 !important;
  border-color:#94a3b8 !important;
  transform:translateY(-2px) !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
}
.admin-btn-voltar svg{
  width:16px;
  height:16px;
}

/* Busca Admin Padronizada */
.admin-search-form{
  margin-bottom:24px;
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:20px;
  background:#ffffff;
  border-radius:12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  border:1px solid #e2e8f0;
}

.admin-search-form form{
  display:flex;
  gap:12px;
  max-width:900px;
  align-items:center;
}

.admin-btn-new{
  align-self:flex-start;
  margin-top:0 !important;
  padding:8px 16px !important;
  font-size:11px !important;
  font-weight:500 !important;
  letter-spacing:0.5px !important;
  text-transform:uppercase !important;
  border-radius:0 !important;
  text-decoration:none !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  white-space:nowrap !important;
  transition:all 0.2s ease !important;
  background:#000 !important;
  color:#fff !important;
  border:1px solid #000 !important;
  width:auto !important;
}

.admin-btn-new:hover{
  background:#333 !important;
  color:#fff !important;
}

.admin-search-form input{
  flex:1;
  padding:8px 16px;
  border:1px solid #ddd;
  border-radius:6px;
  font-size:14px;
  height:40px;
  min-width:500px;
}

.admin-search-btn{
  padding:0;
  width:40px;
  height:40px;
  border:1px solid #000;
  background:#000;
  color:#fff;
  border-radius:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:all 0.2s ease;
  flex-shrink:0;
}

.admin-search-btn:hover{
  background:#333;
  border-color:#333;
}

.admin-search-btn svg{
  width:18px;
  height:18px;
  stroke:currentColor;
}

.admin-btn-clear{
  padding:8px 16px !important;
  font-size:12px !important;
  text-transform:none !important;
  letter-spacing:0 !important;
  height:40px !important;
  white-space:nowrap !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}

@media (max-width:768px){
  .admin-search-form form{
    max-width:100%;
  }
  
  .admin-search-form input{
    min-width:200px;
  }
}

/* Botões dos Cards Admin Padronizados */
.admin-card-btn-small{
  background:#000;
  color:#fff;
  padding:8px 16px;
  border-radius:6px;
  font-size:13px;
  font-weight:500;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:6px;
  transition:background 0.2s ease;
  border:none;
  cursor:pointer;
  width:100%;
  min-width:120px;
  justify-content:center;
}

.admin-card-btn-small:hover{
  background:#333;
  color:#fff;
}

.admin-card-btn-small .admin-icon-sm{
  width:14px;
  height:14px;
  fill:currentColor;
}

.admin-btn-danger{
  background:#dc3545 !important;
}

/* Botão Imprimir - SEMPRE AZUL */
.btn-print,
button[onclick*="print"],
a[href*="print"],
button[title*="Imprimir"],
a[title*="Imprimir"]{
  background:#2196F3 !important;
  color:#fff !important;
  border-color:#2196F3 !important;
}

.btn-print:hover,
button[onclick*="print"]:hover,
a[href*="print"]:hover,
button[title*="Imprimir"]:hover,
a[title*="Imprimir"]:hover{
  background:#1976D2 !important;
  border-color:#1976D2 !important;
  color:#fff !important;
}

.admin-btn-danger:hover{
  background:#c82333 !important;
}

/* Cards Admin Padronizados */
.admin-cards-list{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.admin-card{
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:8px;
  box-shadow:0 2px 4px rgba(0,0,0,0.05);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px;
  transition:box-shadow 0.2s ease;
  position:relative;
  overflow:hidden;
}

.admin-card:hover{
  box-shadow:0 4px 12px rgba(0,0,0,0.1);
}

.admin-card-accent::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--admin-primary, #6c5ce7);
}

.admin-card-image{
  margin-right:20px;
  flex-shrink:0;
}

.admin-card-content{
  flex:1;
}

.admin-card-header{
  margin-bottom:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.admin-card-title{
  font-size:16px;
  font-weight:700;
  color:#000;
  margin:0;
  text-transform:uppercase;
  letter-spacing:0.5px;
}

.admin-card-body{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.admin-card-info{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  color:#666;
  flex-wrap:wrap;
}

.admin-card-info .admin-icon{
  width:16px;
  height:16px;
  fill:currentColor;
}

.admin-card-icon{
  font-size:16px;
}

.admin-card-separator{
  color:#ddd;
  margin:0 4px;
}

.admin-card-stats{
  display:flex;
  gap:16px;
  margin-top:8px;
  flex-wrap:wrap;
}

.admin-card-stat{
  font-size:13px;
  color:#666;
}

.admin-card-stat strong{
  color:#000;
  font-weight:600;
}

.admin-card-actions{
  margin-left:20px;
  flex-shrink:0;
}

.admin-card-status{
  display:inline-block;
  padding:4px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:500;
}

.admin-card-status-active{
  background:#d4edda;
  color:#155724;
}

.admin-card-status-inactive{
  background:#f8d7da;
  color:#721c24;
}

@media (max-width:768px){
  .admin-card{
    flex-direction:column;
    align-items:stretch;
    gap:16px;
  }
  
  .admin-card-image{
    margin-right:0 !important;
  }
  
  .admin-card-actions{
    margin-left:0 !important;
  }
  
  .admin-card-info{
    font-size:13px;
  }
}
.table{width:100%;border-collapse:collapse;border:1px solid #000}
.table th,.table td{border-top:1px solid #000;padding:10px;text-align:left;font-size:14px;vertical-align:middle}
.table th{background:#000;color:#fff}
.thumb{width:56px;height:56px;border-radius:10px;object-fit:cover;border:1px solid #000}
.actions .link{margin-right:10px;text-decoration:underline}
.linkbtn{background:transparent;border:0;padding:0;text-decoration:underline;cursor:pointer}

.form{max-width:640px;border:1px solid #000;border-radius:16px;padding:16px}
.form label{display:block;margin-top:12px;font-weight:800;font-size:12px;letter-spacing:.5px}
.form input,.form select{width:100%;padding:12px;border:1px solid #000;border-radius:12px;margin-top:6px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.help{margin-top:10px;opacity:.75;font-size:13px}
.mini-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-top:10px}
.thumb2{width:100%;height:140px;object-fit:cover;border:1px solid #000;border-radius:14px}

.flash{margin:12px 0}
.flash-item{
  border:1px solid #000;
  border-radius:12px;
  padding:12px 16px;
  margin-bottom:8px;
  font-weight:500;
  animation:slideIn 0.3s ease;
}
.flash-item.flash-success{
  background:#d4edda;
  border-color:#28a745;
  color:#155724;
}
.flash-item.flash-error{
  background:#f8d7da;
  border-color:#dc3545;
  color:#721c24;
}
@keyframes slideIn{
  from{
    opacity:0;
    transform:translateY(-10px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.foot{
  padding:32px 24px;
  border-top:1px solid #e5e5e5;
  text-align:center;
  color:#999;
  font-size:12px;
  margin-top:64px;
}

@media (max-width:900px){
  .product{
    grid-template-columns:1fr;
    gap:32px;
  }
  .info h2{
    font-size:24px;
  }
  .new-minimal{
    font-size:18px;
  }
}

/* ===== Galeria Premium (principal + thumbs + swipe + zoom) ===== */
.gallery2 .main-photo{
  position:relative;
  width:100%;
  overflow:hidden;
  touch-action:manipulation;
}
.gallery2 .main-photo img,
.gallery2 .main-photo video{
  width:100%;
  border:1px solid #000;
  border-radius:16px;
  display:block;
  height:520px;
  object-fit:contain;
  background:#f3f3f3;
  cursor:default;
  touch-action:manipulation;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
}

.navbtn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border-radius:0;
  border:1px solid #e5e5e5;
  background:#fff;
  color:#000;
  font-size:24px;
  line-height:1;
  cursor:pointer;
  opacity:.7;
  transition:opacity 0.2s ease, border-color 0.2s ease;
}
.navbtn:hover{
  opacity:1;
  border-color:#000;
}
.navbtn.prev{left:12px}
.navbtn.next{right:12px}

.thumbs{
  display:flex;
  gap:10px;
  margin-top:12px;
  overflow-x:auto;
  padding-bottom:6px;
  scroll-snap-type:x mandatory;
}

.thumb-btn{
  border:1px solid #e5e5e5;
  background:#fff;
  border-radius:0;
  padding:0;
  cursor:pointer;
  width:84px;
  height:84px;
  flex:0 0 auto;
  overflow:hidden;
  opacity:.6;
  scroll-snap-align:center;
  transition:opacity 0.2s ease, border-color 0.2s ease;
}

.thumb-btn.active{
  opacity:1;
  border-color:#000;
  outline:none;
}

.thumb-btn img,
.thumb-btn video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  position:relative;
}

/* Modal Zoom */
.modal{
  position:fixed;
  top:0;
  left:0;
  width:100vw;
  height:100vh;
  display:none;
  z-index:9999;
  overflow:auto;
}
.modal.open{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:60px;
  padding-bottom:120px;
}

.modal-backdrop{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,.95);
  z-index:1;
}

.modal-content{
  position:fixed;
  top:0;
  left:0;
  width:100vw;
  height:100vh;
  margin:0;
  padding:0;
  background:transparent;
  border:none;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:10000;
  overflow:visible;
}

.modal-content.modal-product-index{
  overflow:auto !important;
  align-items:flex-start !important;
  padding-top:60px !important;
  padding-bottom:120px !important;
}

/* Estilos para modal simples (zoom de imagem) - não aplica ao modal-product */
.modal-content:not(.modal-product) img{
  max-width:calc(100vw - 40px);
  max-height:calc(100vh - 40px);
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  border:none;
  margin:20px;
  padding:0;
}

.modal-close{
  position:absolute;
  top:20px;
  right:20px;
  width:40px;
  height:40px;
  border-radius:0;
  border:1px solid #000;
  background:#fff;
  color:#000;
  font-size:28px;
  line-height:1;
  cursor:pointer;
  z-index:10001;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all 0.2s ease;
  font-weight:300;
}

.modal-product .modal-close,
.modal-product-index .modal-close{
  position:absolute;
  top:20px;
  right:20px;
  border:1px solid #fff;
  background:rgba(0,0,0,0.5);
  color:#fff;
  z-index:10002;
}

.modal-product-index .modal-close:hover{
  background:rgba(0,0,0,0.8);
  color:#fff;
}

.modal-close:hover{
  background:#000;
  color:#fff;
  border-color:#000;
}

/* ===== MODAL PRODUTO INDEX (foto completa + botão laranja centralizado) ===== */
.modal-product-index{
  position:relative;
  width:100vw;
  height:100vh;
  background:transparent;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:60px 20px 120px;
  box-sizing:border-box;
  z-index:10000;
  overflow:auto !important;
}

.modal-product-image-wrapper{
  width:100%;
  max-width:90vw;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:0;
  flex-shrink:0;
  overflow:visible !important;
  position:relative;
  height:auto;
  min-height:auto;
}

.modal-product-image-wrapper img{
  max-width:85vw !important;
  max-height:75vh !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
  object-position:center center !important;
  display:block !important;
  margin:0 auto !important;
  padding:0 !important;
  border:none !important;
  box-sizing:content-box !important;
  image-rendering:auto !important;
  position:relative;
}

/* Garantir que a imagem nunca seja cortada */
.modal-product-index .modal-product-image-wrapper{
  overflow:visible !important;
}

.modal-product-index .modal-product-image-wrapper img{
  position:relative;
  z-index:1;
}

.modal-product-button-wrapper{
  position:absolute;
  bottom:20px;
  left:0;
  right:0;
  width:100%;
  display:flex;
  justify-content:center;
  pointer-events:none;
  margin-top:0;
  z-index:10001;
}

.modal-product-button-wrapper .btn-modal-orange{
  pointer-events:auto;
  position:relative;
}

.btn-modal-orange{
  background:#ff6a3d;
  color:#fff;
  padding:16px 48px;
  font-weight:700;
  font-size:16px;
  letter-spacing:1px;
  text-transform:uppercase;
  text-decoration:none;
  border:none;
  border-radius:0 !important;
  display:inline-block;
  transition:all 0.3s ease;
  box-shadow:0 4px 12px rgba(255,106,61,0.4);
  cursor:pointer;
  font-family:inherit;
}

.btn-modal-orange:hover{
  background:#e55a2d;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(255,106,61,0.5);
  color:#fff;
  text-decoration:none;
  border-radius:0 !important;
}

/* ===== MODAL PRODUTO (com galeria + info) ===== */
.modal-product{
  position:relative;
  max-width:1200px;
  max-height:90vh;
  width:95%;
  background:#fff;
  display:flex;
  flex-direction:row;
  overflow:hidden;
  border-radius:0;
  margin:auto;
}

.modal-gallery{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  background:#f5f5f5;
  padding:20px;
}

.modal-main-photo{
  position:relative;
  width:100%;
  flex:1;
  min-height:400px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:8px;
  overflow:hidden;
}

.modal-main-photo img,
.modal-main-photo video{
  width:100%;
  height:100%;
  object-fit:contain;
  max-width:100%;
  max-height:100%;
  margin:0;
  padding:20px;
  border:none;
  display:block;
}

.modal-main-photo .navbtn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:100;
  background:rgba(255,255,255,0.95);
  border:2px solid #000;
  width:50px;
  height:50px;
  font-size:28px;
  font-weight:bold;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0.9;
  transition:all 0.2s ease;
}

.modal-main-photo .navbtn:hover{
  background:#fff;
  opacity:1;
  transform:translateY(-50%) scale(1.1);
}

.modal-main-photo .navbtn.prev{
  left:20px;
}

.modal-main-photo .navbtn.next{
  right:20px;
}

.modal-thumbs{
  display:flex;
  gap:10px;
  margin-top:12px;
  overflow-x:auto;
  padding-bottom:6px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}

.modal-thumbs .thumb-btn{
  border:2px solid #e5e5e5;
  background:#fff;
  border-radius:0;
  padding:0;
  cursor:pointer;
  width:84px;
  height:84px;
  flex:0 0 auto;
  overflow:hidden;
  opacity:.6;
  scroll-snap-align:center;
  transition:all 0.2s ease;
}

.modal-thumbs .thumb-btn:hover{
  opacity:0.9;
  border-color:#666;
}

.modal-thumbs .thumb-btn.active{
  opacity:1;
  border-color:#000;
  border-width:3px;
}

.modal-thumbs .thumb-btn img,
.modal-thumbs .thumb-btn video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  position:relative;
}

.modal-info{
  flex:0 0 400px;
  padding:40px;
  overflow-y:auto;
  background:#fff;
  display:flex;
  flex-direction:column;
}

.modal-info h2{
  font-size:24px;
  font-weight:600;
  margin:0 0 20px;
  line-height:1.3;
}

.modal-info .meta-row{
  margin:12px 0;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.modal-info .pricebox{
  margin:20px 0;
}

.modal-info .btn{
  margin-top:0;
}

.modal-info .note{
  margin-top:16px;
  font-size:12px;
  color:#666;
  line-height:1.5;
}

/* ===== PÁGINA DO PRODUTO - Estilos Melhorados ===== */
.info{
  padding:0;
}

.info h2{
  margin:0 0 20px;
  font-size:28px;
  font-weight:400;
  line-height:1.3;
  color:#000;
  letter-spacing:-0.5px;
}

.pricebox{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:32px 0;
}

.pricebox-premium{
  margin:32px 0;
}

.pricebox-premium .old{
  font-size:16px;
  color:#999;
  text-decoration:line-through;
  margin-bottom:8px;
}

.pricebox-premium .new{
  font-size:28px;
  font-weight:400;
  color:#000;
  letter-spacing:-0.5px;
  line-height:1.2;
}

.pricebox-premium .off{
  display:inline-block;
  padding:4px 10px;
  background:#ff6a3d;
  color:#fff;
  border-radius:4px;
  font-size:14px;
  font-weight:700;
  letter-spacing:0.5px;
  align-self:flex-start;
}

.size-btn{
  transition:all 0.2s ease;
  font-family:inherit;
}

.size-btn:hover{
  border-color:#000 !important;
  background:#f9f9f9 !important;
  transform:translateY(-1px);
}

.size-btn.selected{
  border-color:#000 !important;
  border-width:2px !important;
  background:#f5f5f5 !important;
  font-weight:700;
}

/* Ajuste responsivo */
@media (max-width:900px){
  .gallery2 .main-photo img,
  .gallery2 .main-photo video{ height:420px; }
  
  .info h2{
    font-size:24px;
  }
  
  .pricebox-premium .new{
    font-size:24px;
  }
  
  .modal-product{
    flex-direction:column;
    max-height:95vh;
    width:100%;
    max-width:100%;
  }
  
  .modal-gallery{
    flex:0 0 auto;
    max-height:50vh;
  }
  
  .modal-main-photo{
    min-height:300px;
  }
  
  .modal-info{
    flex:1;
    padding:24px 20px;
    max-height:50vh;
    overflow-y:auto;
  }
  
  .modal-info h2{
    font-size:20px;
  }
}

/* ===== SACOLA ===== */
.cart-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  transition:all 0.2s ease;
  color:#000;
}
.cart-link:hover{
  opacity:0.7;
}
.bag-icon{
  width:22px;
  height:22px;
  stroke-width:1.5;
}
.cart-badge{
  display:inline-flex;
  position:absolute;
  top:-4px;
  right:-4px;
  background:var(--primary-color, #ff6a3d);
  color:#fff;
  border-radius:10px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  font-size:10px;
  font-weight:600;
  line-height:18px;
  text-align:center;
  border:2px solid #fff;
  align-items:center;
  justify-content:center;
}
.cart-badge:empty{
  display:none;
}
.cart-badge.pulse{
  animation:pulse 0.4s ease;
}
@keyframes pulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.15)}
}

/* ===== CARDS MELHORADOS COM HOVER ===== */
.card{
  position:relative;
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
  transform:translateY(0);
}
.card:hover{
  transform:translateY(-4px);
  box-shadow:0 8px 24px rgba(0,0,0,0.15);
}
.card-ag .card-link{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:1;
  text-decoration:none;
  color:inherit;
  pointer-events:none;
}

.card-ag .card-link:hover{
  pointer-events:auto;
}
.card-image-wrapper{
  position:relative;
  overflow:hidden;
  border-radius:0;
}
.card-image-wrapper img{
  transition:opacity 0.3s ease;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.card:hover .card-image-wrapper img{
  opacity:0.9;
}

.card-cta{
  position:absolute;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  background:#ff6a3d;
  color:#fff;
  padding:12px 32px;
  font-weight:700;
  font-size:13px;
  letter-spacing:1px;
  text-transform:uppercase;
  text-decoration:none;
  border:none;
  border-radius:8px;
  display:inline-block;
  transition:all 0.3s ease;
  box-shadow:0 4px 12px rgba(255,106,61,0.4);
  cursor:pointer;
  z-index:10;
  opacity:0;
  pointer-events:auto;
  font-family:inherit;
}

.card-image-wrapper:hover .card-cta,
a.card-image-wrapper:hover .card-cta,
.card:hover .card-image-wrapper .card-cta,
.card-ag:hover .card-cta,
.card:hover .card-cta{
  opacity:1 !important;
}

.card-cta:hover{
  background:#e55a2d !important;
  transform:translateX(-50%) translateY(-2px);
  box-shadow:0 6px 16px rgba(255,106,61,0.5) !important;
  color:#fff !important;
  text-decoration:none;
}

.card-overlay{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.5);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  transition:opacity 0.2s ease;
  border-radius:0;
}
.card:hover .card-overlay{
  opacity:1;
}
.btn-card-quick{
  background:#fff;
  color:#000;
  border:none;
  border-radius:0;
  padding:8px 20px;
  font-weight:500;
  font-size:11px;
  letter-spacing:0.5px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all 0.2s ease;
  transform:translateY(6px);
  text-decoration:none;
  display:inline-block;
}
.card:hover .btn-card-quick{
  transform:translateY(0);
}
.btn-card-quick:hover{
  background:#000;
  color:#fff;
}

/* ===== BOTÃO COMPRAR NA GALERIA (OVERLAY) ===== */
.quick-buy-overlay{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  opacity:0;
  transition:opacity 0.3s ease;
  z-index:100;
  pointer-events:auto;
  padding:0;
  background:rgba(0,0,0,0.3);
}
.gallery2 .main-photo:hover .quick-buy-overlay{
  opacity:1;
}
.btn-quick-buy{
  background:#000;
  color:#fff;
  border:none;
  border-radius:0;
  padding:14px 20px;
  font-weight:500;
  font-size:11px;
  letter-spacing:0.5px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all 0.2s ease;
  white-space:nowrap;
  text-decoration:none;
  display:block;
  width:100%;
  text-align:center;
}
.btn-quick-buy:hover{
  background:#333;
  color:#fff;
}

/* ===== NOTIFICAÇÕES ===== */
.notification{
  position:fixed;
  top:80px;
  right:20px;
  background:#000;
  color:#fff;
  padding:12px 20px;
  border-radius:0;
  box-shadow:0 2px 8px rgba(0,0,0,0.15);
  z-index:10000;
  transform:translateX(400px);
  opacity:0;
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
  font-weight:500;
  font-size:13px;
  letter-spacing:0.3px;
}
.notification.show{
  transform:translateX(0);
  opacity:1;
}

/* ===== PÁGINA DO CARRINHO ===== */
.cart-title{
  font-size:28px;
  font-weight:600;
  letter-spacing:-0.5px;
  margin:0 0 40px;
  color:#000;
}
.cart-items{
  margin-top:0;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.cart-item{
  display:flex;
  gap:20px;
  align-items:flex-start;
  padding:20px;
  background:#fff;
  border:1px solid #e8e8e8;
  border-radius:12px;
  transition:all 0.3s ease;
  position:relative;
}
.cart-item:hover{
  box-shadow:0 4px 12px rgba(0,0,0,0.08);
  border-color:#ddd;
}
.cart-item-right{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:20px;
  flex-shrink:0;
  min-width:180px;
  justify-content:flex-end;
}
.cart-item-image{
  width:120px;
  aspect-ratio:3/4;
  border-radius:8px;
  overflow:hidden;
  border:1px solid #f0f0f0;
  background:#f9f9f9;
  flex-shrink:0;
}
.cart-item-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.cart-item-info{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.cart-item-info h3{
  margin:0;
  font-size:16px;
  font-weight:600;
  color:#000;
  line-height:1.4;
}
.cart-item-details{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  margin:4px 0;
}
.size-tag,
.color-tag{
  display:inline-block;
  font-size:11px;
  color:#666;
  padding:4px 10px;
  border:1px solid #e0e0e0;
  border-radius:6px;
  background:#f8f8f8;
  font-weight:500;
}
.badge{
  display:inline-block;
  font-size:10px;
  color:#ff6a3d;
  padding:4px 10px;
  border:1px solid #ff6a3d;
  border-radius:6px;
  background:#fff5f2;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.5px;
}
.cart-price{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:8px;
}
.cart-price .price-original{
  font-size:12px;
  font-weight:400;
  color:#999;
  text-decoration:line-through;
}
.cart-price .price-sale{
  font-size:18px;
  font-weight:700;
  color:#000;
}
.cart-item-qty{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:80px;
  flex-shrink:0;
}
.qty-form{
  display:flex;
  align-items:center;
}
.qty-input{
  width:60px;
  padding:8px;
  border:2px solid #e0e0e0;
  border-radius:8px;
  text-align:center;
  font-size:14px;
  font-weight:600;
  transition:border-color 0.2s ease;
  background:#fff;
  color:#000;
}
.qty-input:focus{
  outline:none;
  border-color:#000;
}
.qty-display{
  font-size:16px;
  font-weight:600;
  color:#666;
  padding:8px 16px;
  background:#f8f8f8;
  border-radius:8px;
}
.cart-item-subtotal{
  font-size:18px;
  font-weight:700;
  min-width:100px;
  text-align:right;
  color:#000;
  flex-shrink:0;
}
.remove-btn{
  background:#f8f8f8;
  border:none;
  border-radius:8px;
  width:36px;
  height:36px;
  font-size:20px;
  line-height:1;
  cursor:pointer;
  color:#999;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all 0.2s ease;
  flex-shrink:0;
}
.remove-btn:hover{
  background:#fee;
  color:#ff4444;
}
.cart-summary{
  margin-top:40px;
  padding:32px;
  background:#f9f9f9;
  border-radius:12px;
  border:1px solid #e8e8e8;
}
.cart-total{
  margin-bottom:32px;
  padding:24px;
  background:#fff;
  border-radius:8px;
  border:1px solid #e0e0e0;
}
.customer-form{
  margin-bottom:32px;
  padding:32px;
  background:#fff;
  border-radius:12px;
  border:1px solid #e8e8e8;
}
.customer-form h3{
  margin:0 0 24px;
  font-size:20px;
  font-weight:600;
  color:#000;
}
.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-bottom:16px;
}
.form-group{
  margin-bottom:0;
}
.form-group label{
  display:block;
  margin-bottom:6px;
  font-size:12px;
  font-weight:500;
  color:#666;
  text-transform:uppercase;
  letter-spacing:0.5px;
}
.form-group input{
  width:100%;
  padding:12px 16px;
  border:2px solid #e0e0e0;
  border-radius:8px;
  font-size:14px;
  font-weight:400;
  color:#000;
  background:#fff;
  transition:all 0.2s ease;
  font-family:inherit;
}
.form-group input:focus{
  outline:none;
  border-color:#ff6a3d;
  box-shadow:0 0 0 3px rgba(255,106,61,0.1);
}
.form-group input:disabled{
  background:#f9f9f9;
  color:#999;
}
.form-group input::placeholder{
  color:#999;
}
.form-help{
  display:block;
  margin-top:4px;
  font-size:11px;
  color:#999;
  font-weight:400;
}
.form-actions{
  display:flex;
  gap:12px;
  justify-content:flex-end;
  align-items:center;
  margin-top:32px;
  padding-top:24px;
  border-top:1px solid #e5e5e5;
}
.form-actions .btn-outline,
.form-actions .btn-checkout,
.form-actions .btn{
  height:40px;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  box-sizing:border-box;
  line-height:1;
  margin:0;
  padding:12px 24px;
  font-family:inherit;
}
.form-actions .btn-checkout,
.form-actions .btn{
  padding:12px 32px;
}
.total-line{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:16px;
  font-weight:500;
  color:#000;
  padding:8px 0;
}
.total-price{
  font-size:24px;
  font-weight:700;
  color:#000;
}
.cart-actions{
  display:flex;
  gap:12px;
  justify-content:flex-end;
  align-items:center;
  margin-top:0;
}
.cart-actions form{
  display:flex;
  margin:0;
  padding:0;
  border:none;
  background:none;
}
.cart-actions .btn-outline,
.cart-actions .btn-checkout{
  height:40px;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  box-sizing:border-box;
  line-height:1;
  margin:0;
  padding:12px 24px;
  font-family:inherit;
}
.cart-actions .btn-checkout{
  padding:12px 32px;
}
.cart-actions form button{
  width:auto;
  height:40px;
  min-height:40px;
}
.btn-outline{
  background:transparent;
  color:#000;
  border:2px solid #000;
  border-radius:8px;
  padding:14px 28px;
  font-weight:600;
  font-size:13px;
  letter-spacing:0.5px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all 0.2s ease;
}
.btn-outline:hover{
  background:#000;
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 4px 8px rgba(0,0,0,0.15);
}
.btn-checkout{
  background:#ff6a3d;
  color:#fff;
  border:none;
  border-radius:8px;
  padding:14px 32px;
  font-weight:700;
  font-size:13px;
  letter-spacing:0.5px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all 0.2s ease;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  line-height:1;
  font-family:inherit;
  box-shadow:0 4px 12px rgba(255,106,61,0.3);
}
.btn-checkout:hover{
  background:#e55a2d;
  color:#fff;
  text-decoration:none;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(255,106,61,0.4);
}
.cart-empty{
  text-align:center;
  padding:100px 20px;
  background:#f9f9f9;
  border-radius:12px;
  border:1px solid #e8e8e8;
}
.cart-empty p{
  font-size:18px;
  margin-bottom:32px;
  color:#666;
  font-weight:500;
}
.cart-empty .btn{
  background:#ff6a3d;
  color:#fff;
  border:none;
  border-radius:8px;
  padding:14px 32px;
  font-weight:600;
  font-size:13px;
  letter-spacing:0.5px;
  text-transform:uppercase;
  text-decoration:none;
  display:inline-block;
  transition:all 0.2s ease;
  box-shadow:0 4px 12px rgba(255,106,61,0.3);
}
.cart-empty .btn:hover{
  background:#e55a2d;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(255,106,61,0.4);
  text-decoration:none;
  color:#fff;
}

/* ===== EFEITOS E ANIMAÇÕES GLOBAIS ===== */
*{
  transition:background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.btn{
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
  position:relative;
  overflow:hidden;
}
.btn::before{
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  width:0;
  height:0;
  border-radius:50%;
  background:rgba(255,255,255,0.2);
  transform:translate(-50%,-50%);
  transition:width 0.6s, height 0.6s;
}
.btn:hover::before{
  width:300px;
  height:300px;
}
.btn:active{
  transform:scale(0.98);
}

/* ===== MELHORIAS NO HEADER ===== */
.top{
  position:sticky;
  top:0;
  background:#fff;
  z-index:1000;
  box-shadow:0 2px 8px rgba(0,0,0,0.05);
}
.brand{
  transition:transform 0.2s ease;
}
.brand:hover{
  transform:scale(1.05);
}

/* ===== RESPONSIVO CARRINHO ===== */
@media (max-width:900px){
  .cart-title{
    font-size:24px;
    margin-bottom:24px;
  }
  .cart-item{
    flex-direction:column;
    gap:16px;
    padding:16px;
  }
  .cart-item-image{
    width:100%;
    max-width:300px;
    aspect-ratio:3/4;
    align-self:center;
  }
  .cart-item-info{
    width:100%;
  }
  .cart-item-info h3{
    font-size:15px;
  }
  .cart-item-details{
    gap:6px;
  }
  .cart-item-details .size-tag,
  .cart-item-details .color-tag,
  .cart-item-details .badge{
    font-size:10px;
    padding:4px 8px;
  }
  .cart-price .price-original{
    font-size:12px;
  }
  .cart-price .price-sale{
    font-size:16px;
  }
  .cart-item-right{
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    width:100%;
    margin-top:12px;
    padding-top:12px;
    border-top:1px solid #f0f0f0;
    gap:16px;
  }
  .cart-item-qty{
    margin:0;
    flex-shrink:0;
  }
  .cart-item-qty .qty-input{
    width:60px;
    padding:8px;
    font-size:14px;
  }
  .cart-item-subtotal{
    margin:0;
    text-align:right;
    font-size:18px;
    flex:1;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    word-break:break-word;
  }
  .cart-item-subtotal span{
    flex-shrink:0;
    white-space:nowrap;
  }
  .cart-item-remove{
    position:absolute;
    top:16px;
    right:16px;
    z-index:10;
  }
  .remove-btn{
    width:32px;
    height:32px;
    font-size:18px;
  }
  .cart-summary{
    margin-top:32px;
    padding:20px;
  }
  .cart-total{
    margin-bottom:24px;
    padding:20px;
  }
  .customer-form{
    padding:20px 0;
  }
  .customer-form h3{
    font-size:18px;
    margin-bottom:16px;
  }
  .form-row{
    flex-direction:column;
    gap:12px;
  }
  .form-group{
    width:100%;
  }
  .cart-actions{
    flex-direction:column;
    gap:12px;
  }
  .cart-actions a,
  .cart-actions form,
  .cart-actions .btn,
  .cart-actions .btn-outline,
  .cart-actions .btn-checkout{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    min-height:48px;
    height:48px;
    padding:14px 28px;
    box-sizing:border-box;
  }
  .cart-actions form{
    width:100%;
    display:flex;
  }
  .cart-actions form button{
    width:100%;
    height:48px;
    min-height:48px;
    padding:14px 28px;
    box-sizing:border-box;
  }
  .form-actions{
    flex-direction:column;
    gap:12px;
  }
  .form-actions .btn{
    width:100%;
  }
  .notification{
    right:10px;
    left:10px;
    transform:translateY(-100px);
  }
  .notification.show{
    transform:translateY(0);
  }
  .outlet-discount-info{
    padding:12px !important;
  }
  .outlet-discount-info p{
    font-size:12px !important;
  }
}

/* ===== HEADER MOBILE ===== */
.header-desktop{
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:100%;
  gap:32px;
}
.header-mobile{
  display:none;
}

/* Mobile Menu Button */
.mobile-menu-btn{
  background:none;
  border:none;
  padding:8px;
  cursor:pointer;
  color:#000;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Mobile Brand */
.brand-mobile{
  font-weight:600;
  letter-spacing:1px;
  font-size:18px;
  color:#000;
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:1;
}
.brand-mobile img{
  height:28px;
  width:auto;
}

/* Mobile Nav Utils */
.mobile-nav-utils{
  display:flex;
  align-items:center;
  gap:16px;
}
.mobile-search-btn,
.mobile-cart-link{
  background:none;
  border:none;
  padding:8px;
  cursor:pointer;
  color:#000;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  text-decoration:none;
}
.mobile-cart-badge{
  position:absolute;
  top:2px;
  right:2px;
  background:var(--primary-color, #ff6a3d);
  color:#fff;
  border-radius:50%;
  min-width:16px;
  height:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  font-weight:600;
  padding:0 3px;
  line-height:1;
}
.mobile-cart-badge:empty{
  display:none;
}

/* Mobile Search Overlay */
.mobile-search-overlay{
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background:rgba(0,0,0,0.5);
  z-index:10000;
  display:none;
  align-items:flex-start;
  justify-content:center;
  padding-top:80px;
}
.mobile-search-overlay.active{
  display:flex;
}
.mobile-search-content{
  background:#fff;
  width:90%;
  max-width:500px;
  padding:20px;
  border-radius:8px;
  display:flex;
  align-items:center;
  gap:12px;
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
}
.mobile-search-input{
  flex:1;
  padding:12px 16px;
  border:1px solid #ddd;
  border-radius:6px;
  font-size:16px;
  outline:none;
}

/* ===== Busca inteligente (autocomplete) ===== */
.search-suggest{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  right:0;
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:12px;
  box-shadow:0 12px 30px rgba(0,0,0,0.12);
  overflow:hidden;
  z-index:9999;
}
.search-suggest .ss-item{
  display:flex;
  gap:10px;
  padding:10px;
  text-decoration:none;
  color:inherit;
  border-bottom:1px solid #f2f2f2;
}
.search-suggest .ss-item:last-child{ border-bottom:none; }
.search-suggest .ss-item:hover,
.search-suggest .ss-item.active{
  background:#f8f8f8;
}
.search-suggest .ss-img{
  width:44px;
  height:44px;
  border-radius:10px;
  background:#f3f3f3;
  overflow:hidden;
  flex:0 0 auto;
}
.search-suggest .ss-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.search-suggest .ss-title{
  font-size:13px;
  font-weight:600;
  color:#000;
  line-height:1.2;
  margin-bottom:4px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.search-suggest .ss-meta{
  font-size:12px;
  color:#666;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.search-suggest .ss-ref{ color:#666; }
.search-suggest .ss-price{ font-weight:700; color:#000; }
.mobile-search-close{
  background:none;
  border:none;
  padding:8px;
  cursor:pointer;
  color:#666;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Mobile Menu Drawer */
.mobile-menu-drawer{
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  z-index:10001;
  display:none;
  pointer-events:none;
}
.mobile-menu-drawer.active{
  display:block;
  pointer-events:auto;
}
.mobile-menu-overlay{
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background:rgba(0,0,0,0.5);
  opacity:0;
  transition:opacity 0.3s ease;
}
.mobile-menu-drawer.active .mobile-menu-overlay{
  opacity:1;
}
.mobile-menu-content{
  position:absolute;
  top:0;
  left:0;
  width:280px;
  max-width:85%;
  height:100%;
  background:#fff;
  box-shadow:2px 0 12px rgba(0,0,0,0.15);
  transform:translateX(-100%);
  transition:transform 0.3s ease;
  display:flex;
  flex-direction:column;
}
.mobile-menu-drawer.active .mobile-menu-content{
  transform:translateX(0);
}
.mobile-menu-header{
  padding:20px;
  border-bottom:1px solid #e5e5e5;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.mobile-menu-header h3{
  margin:0;
  font-size:20px;
  font-weight:600;
  color:#000;
}
.mobile-menu-close{
  background:none;
  border:none;
  padding:8px;
  cursor:pointer;
  color:#666;
  display:flex;
  align-items:center;
  justify-content:center;
}
.mobile-menu-nav{
  flex:1;
  padding:20px 0;
  overflow-y:auto;
}
.mobile-menu-link{
  display:block;
  padding:16px 20px;
  color:#333;
  text-decoration:none;
  font-size:16px;
  font-weight:500;
  border-bottom:1px solid #f5f5f5;
  transition:background 0.2s ease;
}
.mobile-menu-link:hover,
.mobile-menu-link.active{
  background:#f9f9f9;
  color:#ff6a3d !important;
}
.mobile-menu-category-header span.mobile-menu-link.active{
  color:#ff6a3d !important;
}
.mobile-menu-category{
  border-bottom:1px solid #f5f5f5;
}
.mobile-menu-category-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:relative;
  cursor:pointer;
  transition:background 0.2s ease;
}
.mobile-menu-category-header:hover{
  background:#f9f9f9;
}
.mobile-menu-category-header .mobile-menu-link,
.mobile-menu-category-header span.mobile-menu-link{
  flex:1;
  padding-right:8px;
  display:block;
  padding:16px 20px;
  color:#000;
  text-decoration:none;
  font-weight:600;
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:0.5px;
  transition:background 0.2s ease, color 0.2s ease;
  border:none;
  background:none;
  margin:0;
}
.mobile-menu-toggle{
  background:none;
  border:none;
  padding:8px 12px;
  cursor:pointer;
  color:#666;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform 0.3s ease, color 0.2s ease;
  flex-shrink:0;
}
.mobile-menu-toggle:hover{
  color:#000;
}
.mobile-menu-toggle svg{
  transition:transform 0.3s ease;
}
.mobile-menu-category.expanded .mobile-menu-toggle svg{
  transform:rotate(180deg);
}
.mobile-subcategories{
  background:#f9f9f9;
  padding-left:20px;
  display:none !important;
  overflow:hidden;
  transition:max-height 0.3s ease, display 0.3s ease;
  max-height:0;
}
.mobile-menu-category.expanded .mobile-subcategories{
  display:block !important;
  max-height:1000px;
}
.mobile-subcategory-link{
  display:block;
  padding:12px 20px;
  color:#666;
  text-decoration:none;
  font-size:14px;
  border-bottom:1px solid #f0f0f0;
  transition:background 0.2s ease;
}
.mobile-subcategory-link:hover,
.mobile-subcategory-link.active{
  background:#fff;
  color:var(--primary-color, #ff6a3d);
  font-weight:500;
}

/* ===== RESPONSIVO HEADER/MENU ===== */
@media (max-width:900px){
  .header-desktop{
    display:none;
  }
  .header-mobile{
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%;
    padding:12px 16px;
  }
  .top{
    padding:0;
  }
}

/* ===== BOTÃO FLUTUANTE DO WHATSAPP ===== */
.whatsapp-fab{
  position:fixed;
  bottom:24px;
  right:24px;
  width:60px;
  height:60px;
  background:#25D366;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  box-shadow:0 4px 12px rgba(37,211,102,0.4);
  z-index:9999;
  transition:all 0.3s ease;
  text-decoration:none;
}

.whatsapp-fab:hover{
  background:#20BA5A;
  transform:scale(1.1);
  box-shadow:0 6px 16px rgba(37,211,102,0.5);
}

.whatsapp-fab svg{
  width:32px;
  height:32px;
}

@media (max-width:768px){
  .whatsapp-fab{
    bottom:20px;
    right:20px;
    width:56px;
    height:56px;
  }
  .whatsapp-fab svg{
    width:28px;
    height:28px;
  }
}

/* ===== PRODUCT CARD - Classes específicas (não afeta layout global) ===== */
.product-card{
  display:flex !important;
  flex-direction:column !important;
  margin:0 !important;
  padding:0 !important;
}

/* Garantir que todos os cards da vitrine tenham a mesma altura */
.grid .product-card{
  height:100%;
}

.product-card__media{
  position:relative !important;
  width:100% !important;
  aspect-ratio:3/4 !important;
  overflow:hidden !important;
  background:#f9f9f9 !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  flex-shrink:0 !important;
  isolation:isolate !important;
}

.product-card__media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
}

.product-card__cta{
  width:70% !important;
  height:44px !important;
  background:#ff6a3d !important;
  color:#fff !important;
  padding:0 !important;
  font-weight:700 !important;
  font-size:13px !important;
  letter-spacing:1px !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
  border:none !important;
  border-radius:22px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:12 !important;
  text-align:center !important;
  transition:all 0.18s ease !important;
  cursor:pointer !important;
  box-sizing:border-box !important;
  opacity:0 !important;
  transform:translate(-50%, 14px) !important;
  position:absolute !important;
  bottom:180px !important;
  left:50% !important;
  z-index:10 !important;
  pointer-events:auto !important;
  margin:0 !important;
}

/* Desktop: botão aparece apenas no hover do card */
@media (hover: hover) and (pointer: fine) {
  .product-card__cta{
    opacity:0 !important;
    transform:translate(-50%, 14px) !important;
  }
  
  .product-card:hover .product-card__cta,
  .product-card__media:hover .product-card__cta{
    opacity:1 !important;
    transform:translate(-50%, 0) !important;
  }
}

/* Mobile: botão sempre visível */
@media (hover: none) and (pointer: coarse) {
  .product-card__cta{
    opacity:1 !important;
    transform:translate(-50%, 0) !important;
  }
}

/* Botão de sacola - escondido no desktop por padrão */
.product-card__cart-btn-mobile{
  display:none !important;
}

/* Ajustes do botão COMPRA RÁPIDA no mobile */
@media (max-width:900px){
  /* Esconder botão COMPRA RÁPIDA no mobile */
  .product-card__cta{
    display:none !important;
  }
  
  /* Botão de sacola para mobile - FORÇAR APARECER */
  .product-card__cart-btn-mobile{
    display:flex !important;
    position:absolute !important;
    bottom:12px !important;
    right:12px !important;
    width:44px !important;
    height:44px !important;
    background:#ff6a3d !important;
    color:#fff !important;
    border-radius:50% !important;
    align-items:center !important;
    justify-content:center !important;
    z-index:10 !important;
    box-shadow:0 2px 8px rgba(0,0,0,0.2) !important;
    transition:all 0.2s ease !important;
    text-decoration:none !important;
    opacity:1 !important;
    transform:none !important;
    visibility:visible !important;
  }
  
  .product-card__cart-btn-mobile:hover,
  .product-card__cart-btn-mobile:active{
    background:#e55a2d !important;
    transform:scale(1.1) !important;
    box-shadow:0 4px 12px rgba(0,0,0,0.3) !important;
  }
  
  .product-card__cart-btn-mobile svg{
    width:20px !important;
    height:20px !important;
    stroke-width:2.5 !important;
  }
}

.product-card__cta:hover{
  background:#e55a2d !important;
  color:#fff !important;
  text-decoration:none !important;
}

.product-card__body{
  padding:12px 0 12px 16px !important;
  margin:0 !important;
  flex:1 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
}

/* ===== BANNERS ===== */
.banners-section{
  width:100%;
  margin-bottom:40px;
}

.banner-single{
  width:100%;
  position:relative;
  overflow:hidden;
}

.banner-link{
  display:block;
  position:relative;
  width:100%;
  text-decoration:none;
  color:inherit;
}

.banner-image{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
}

.banner-content{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
    text-align:center;
  color:#fff;
  z-index:2;
  padding:20px;
  max-width:90%;
}

.banner-title{
  font-size:48px;
  font-weight:700;
  margin:0 0 12px 0;
  text-shadow:2px 2px 4px rgba(0,0,0,0.3);
  line-height:1.2;
}

.banner-subtitle{
  font-size:24px;
  margin:0 0 20px 0;
  text-shadow:2px 2px 4px rgba(0,0,0,0.3);
}

.banner-button{
  display:inline-block;
  background:#ff6a3d;
  color:#fff;
  padding:14px 32px;
  font-weight:700;
  font-size:16px;
  text-transform:uppercase;
  letter-spacing:1px;
  border-radius:8px;
  transition:all 0.3s ease;
}

.banner-link:hover .banner-button{
  background:#e55a2d;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(255,106,61,0.5);
}

/* Banner Slider */
.banner-slider{
  position:relative;
  width:100%;
  overflow:hidden;
}

.banner-slider-track{
  position:relative;
  width:100%;
}

.banner-slide{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  opacity:0;
  transition:opacity 0.5s ease;
  visibility:hidden;
  z-index:1;
}

.banner-slide.active{
  position:relative;
  opacity:1;
  visibility:visible;
  z-index:2;
}

.banner-slide .banner-link{
  display:block;
  width:100%;
  position:relative;
}

.banner-slide .banner-image{
  width:100%;
  height:auto;
  display:block;
}

.banner-slider-controls{
  position:absolute;
  top:50%;
  left:0;
  right:0;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 20px;
  z-index:10;
  pointer-events:none;
}

.banner-slider-prev,
.banner-slider-next{
  background:rgba(255,255,255,0.6);
  border:1px solid rgba(255,255,255,0.3);
  width:48px;
  height:48px;
  border-radius:50%;
  font-size:24px;
  font-weight:bold;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all 0.3s ease;
  color:#000;
  pointer-events:auto;
  box-shadow:0 2px 8px rgba(0,0,0,0.1);
}

.banner-slider-prev:hover,
.banner-slider-next:hover{
  background:rgba(255,255,255,0.9);
  transform:scale(1.1);
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
}

.banner-slider-dots-container{
  position:absolute;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  z-index:10;
}

.banner-slider-dots{
  display:flex;
  gap:8px;
  align-items:center;
  background:rgba(0,0,0,0.4);
  padding:8px 16px;
  border-radius:20px;
}

.banner-slider-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  border:none;
  background:rgba(255,255,255,0.5);
  cursor:pointer;
  transition:all 0.3s ease;
  padding:0;
}

.banner-slider-dot.active{
  background:#fff;
  width:12px;
  height:12px;
}

/* Responsive */
@media (max-width:768px){
  .banner-title{
    font-size:32px;
  }
  
  .banner-subtitle{
    font-size:18px;
  }
  
  .banner-button{
    padding:12px 24px;
    font-size:14px;
  }
  
  .banner-content{
    padding:16px;
  }
  
  .banner-slider-controls{
    padding:0 12px;
  }
  
  .banner-slider-prev,
  .banner-slider-next{
    width:40px;
    height:40px;
    font-size:20px;
  }
  
  .banner-slider-dots-container{
    bottom:12px;
  }
  
  .banner-slider-dots{
    padding:6px 12px;
  }
}

/* FORÇAR 2 COLUNAS NO MOBILE - REGRA FINAL */
@media screen and (max-width:900px){
  section.grid,
  .grid{
    grid-template-columns:repeat(2,1fr) !important;
    display:grid !important;
  }
}

/* ===== ADMIN GLOBAL HEADER - FIXO ===== */
.admin-global-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:9999;
  background:#ffffff;
  border-bottom:1px solid #e2e8f0;
  box-shadow:0 2px 8px rgba(0,0,0,0.08);
  height:64px;
}

.admin-header-container{
  max-width:100%;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:100%;
  gap:24px;
}

.admin-header-logo{
  display:flex;
  align-items:center;
  text-decoration:none;
  flex-shrink:0;
  transition:opacity 0.2s;
}

.admin-header-logo:hover{
  opacity:0.8;
}

.admin-logo-img{
  height:28px;
  width:auto;
  max-width:200px;
}

.admin-logo-text{
  font-size:20px;
  font-weight:800;
  color:#1a1a1a;
  letter-spacing:-0.5px;
  background:linear-gradient(135deg,#1a1a1a 0%,#4f46e5 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

.admin-header-nav{
  display:flex;
  align-items:center;
  gap:4px;
  flex:1;
  justify-content:flex-end;
  position:relative;
  z-index:999;
}

.admin-header-nav-item{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 16px;
  border-radius:8px;
  text-decoration:none;
  color:#64748b;
  font-size:14px;
  font-weight:500;
  transition:all 0.2s;
  white-space:nowrap;
  position:relative;
  z-index:10002;
}

.admin-header-nav-item:hover{
  background:#f1f5f9;
  color:#334155;
}

.admin-header-nav-item.active{
  background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%) !important;
  color:#fff !important;
}

.admin-header-nav-item.active .admin-nav-text{
  color:#fff !important;
}

.admin-header-nav-item.active svg{
  color:#fff !important;
  stroke:#fff !important;
}

/* Garantir que botões com submenu também tenham fundo roxo e texto branco quando ativos */
.admin-header-nav-dropdown .admin-header-nav-item.active,
.admin-header-nav-dropdown button.admin-header-nav-item.active{
  background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%) !important;
  color:#fff !important;
  border:none !important;
}

.admin-header-nav-dropdown .admin-header-nav-item.active .admin-nav-text,
.admin-header-nav-dropdown button.admin-header-nav-item.active .admin-nav-text{
  color:#fff !important;
}

.admin-header-nav-dropdown .admin-header-nav-item.active svg,
.admin-header-nav-dropdown button.admin-header-nav-item.active svg{
  color:#fff !important;
  stroke:#fff !important;
  fill:none;
}

.admin-header-nav-item svg{
  flex-shrink:0;
}

.admin-nav-text{
  display:inline-block;
}

.admin-header-menu-toggle{
  display:none !important;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:none;
  background:transparent;
  border-radius:8px;
  cursor:pointer;
  color:#64748b;
  transition:all 0.2s;
  flex-shrink:0;
}

.admin-header-menu-toggle:hover,
.admin-header-menu-toggle.active{
  background:#f1f5f9;
  color:#334155;
}

.admin-header-menu-toggle svg{
  width:24px;
  height:24px;
}

.admin-header-more-btn{
  display:none;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:none;
  background:transparent;
  border-radius:8px;
  cursor:pointer;
  color:#64748b;
  transition:all 0.2s;
  flex-shrink:0;
}

.admin-header-more-btn:hover{
  background:#f1f5f9;
  color:#334155;
}

.admin-header-more-btn.active{
  background:#f1f5f9;
  color:#334155;
}

.admin-header-nav-dropdown{
  position:relative;
  z-index:10003;
}

.admin-header-dropdown{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  background:#ffffff;
  border:1px solid #e2e8f0;
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,0.12);
  min-width:200px;
  padding:8px;
  z-index:10001;
}

.admin-dropdown-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  border-radius:8px;
  text-decoration:none;
  color:#334155;
  font-size:14px;
  font-weight:500;
  transition:all 0.2s;
  width:100%;
}

.admin-dropdown-item:hover{
  background:#f1f5f9;
  color:#334155;
}

.admin-dropdown-item.active{
  background:#eef2ff;
  color:#4f46e5;
}

.admin-dropdown-item svg{
  flex-shrink:0;
}

.admin-dropdown-divider{
  height:1px;
  background:#e2e8f0;
  margin:8px 0;
}

.admin-dropdown-logout{
  color:#dc3545;
}

.admin-dropdown-logout:hover{
  background:#fee;
  color:#dc3545;
}

.admin-header-spacer{
  height:64px;
  width:100%;
}

/* Menu Mobile - Esconder no desktop */
.admin-header-mobile-menu,
.admin-header-mobile-overlay{
  display:none !important;
}

/* Responsividade Mobile - Header Admin */
@media (max-width:768px){
  .admin-header-container{
    padding:0 16px;
    gap:12px;
    position:relative;
  }
  
  /* Esconder menu desktop no mobile */
  .admin-header-nav{
    display:none;
  }
  
  /* Mostrar botão hamburger */
  .admin-header-menu-toggle{
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    border:none;
    background:transparent;
    border-radius:8px;
    cursor:pointer;
    color:#64748b;
    transition:all 0.2s;
    flex-shrink:0;
    padding:0;
  }
  
  .admin-header-menu-toggle:hover,
  .admin-header-menu-toggle.active{
    background:#f1f5f9;
    color:#334155;
  }
  
  .admin-header-menu-toggle svg{
    width:24px;
    height:24px;
  }
  
  /* Menu lateral/drawer mobile */
  .admin-header-mobile-menu{
    position:fixed;
    top:0;
    left:0;
    width:280px;
    max-width:85vw;
    height:100vh;
    background:#ffffff;
    box-shadow:4px 0 24px rgba(0,0,0,0.15);
    z-index:10010;
    transform:translateX(-100%);
    transition:transform 0.3s ease;
    overflow-y:auto;
    display:flex;
    flex-direction:column;
  }
  
  .admin-header-mobile-menu.open{
    transform:translateX(0);
  }
  
  /* Overlay escuro quando menu está aberto */
  .admin-header-mobile-overlay{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:rgba(0,0,0,0.5);
    z-index:10009;
    opacity:0;
    visibility:hidden;
    transition:opacity 0.3s ease, visibility 0.3s ease;
  }
  
  .admin-header-mobile-overlay.active{
    opacity:1;
    visibility:visible;
  }
  
  /* Header do menu mobile */
  .admin-header-mobile-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:16px;
    border-bottom:1px solid #e2e8f0;
    background:#ffffff;
    position:sticky;
    top:0;
    z-index:1;
  }
  
  .admin-header-mobile-logo{
    font-size:18px;
    font-weight:800;
    color:#1a1a1a;
    letter-spacing:-0.5px;
  }
  
  .admin-header-mobile-close{
    width:36px;
    height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:none;
    background:transparent;
    border-radius:8px;
    cursor:pointer;
    color:#64748b;
    transition:all 0.2s;
  }
  
  .admin-header-mobile-close:hover{
    background:#f1f5f9;
    color:#334155;
  }
  
  /* Conteúdo do menu mobile */
  .admin-header-mobile-content{
    flex:1;
    padding:8px 0;
    overflow-y:auto;
  }
  
  /* Itens do menu mobile */
  .admin-header-mobile-item{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 16px;
    text-decoration:none;
    color:#334155;
    font-size:15px;
    font-weight:500;
    transition:all 0.2s;
    border-left:3px solid transparent;
  }
  
  .admin-header-mobile-item:hover{
    background:#f1f5f9;
    border-left-color:#4f46e5;
  }
  
  .admin-header-mobile-item.active{
    background:#eef2ff;
    color:#4f46e5;
    border-left-color:#4f46e5;
    font-weight:600;
  }
  
  .admin-header-mobile-item svg{
    width:20px;
    height:20px;
    flex-shrink:0;
  }
  
  /* Grupos de menu (dropdowns) */
  .admin-header-mobile-group{
    border-bottom:1px solid #e2e8f0;
  }
  
  .admin-header-mobile-group-title{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 16px;
    color:#64748b;
    font-size:13px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:0.5px;
    cursor:pointer;
    user-select:none;
    transition:all 0.2s;
  }
  
  .admin-header-mobile-group-title:hover{
    background:#f8f9fa;
    color:#334155;
  }
  
  .admin-header-mobile-group-title svg{
    width:16px;
    height:16px;
    transition:transform 0.2s;
  }
  
  .admin-header-mobile-group-title.open svg:last-child{
    transform:rotate(180deg);
  }
  
  .admin-header-mobile-group-items{
    max-height:0;
    overflow:hidden;
    transition:max-height 0.3s ease;
  }
  
  .admin-header-mobile-group.open .admin-header-mobile-group-items{
    max-height:1000px;
  }
  
  .admin-header-mobile-group-item{
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 16px 10px 44px;
    text-decoration:none;
    color:#475569;
    font-size:14px;
    font-weight:400;
    transition:all 0.2s;
    border-left:3px solid transparent;
  }
  
  .admin-header-mobile-group-item:hover{
    background:#f8f9fa;
    border-left-color:#4f46e5;
    color:#334155;
  }
  
  .admin-header-mobile-group-item.active{
    background:#eef2ff;
    color:#4f46e5;
    border-left-color:#4f46e5;
    font-weight:500;
  }
  
  .admin-header-mobile-group-item svg{
    width:18px;
    height:18px;
    flex-shrink:0;
  }
  
  /* Divider */
  .admin-header-mobile-divider{
    height:1px;
    background:#e2e8f0;
    margin:8px 0;
  }
  
  .admin-logo-text{
    font-size:16px;
  }
  
  .admin-logo-img{
    height:28px;
  }
  
  .admin-global-header{
    height:56px;
  }
  
  .admin-header-spacer{
    height:56px;
  }
  
  /* Esconder botão "mais" no mobile (já temos o hamburger) */
  .admin-header-more-btn{
    display:none !important;
  }
}

/* Filtros de Status - Vendas */
.admin-status-filters{
  display:flex;
  gap:6px;
  margin-bottom:24px;
  flex-wrap:nowrap;
  padding:0 16px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.admin-status-filters::-webkit-scrollbar{
  display:none;
}

.status-filter-chip{
  display:inline-flex;
  align-items:center;
  padding:8px 14px;
  border-radius:20px;
  font-size:12px;
  font-weight:600;
  text-decoration:none;
  border:1.5px solid #e2e8f0;
  background:#ffffff;
  color:#334155;
  transition:all 0.2s;
  white-space:nowrap;
  flex-shrink:0;
}

.status-filter-chip:hover{
  transform:translateY(-2px);
  box-shadow:0 4px 8px rgba(0,0,0,0.1);
}

.status-filter-chip.active{
  border-width:2px;
  font-weight:700;
  box-shadow:0 2px 8px rgba(0,0,0,0.15);
}

@media (max-width:768px){
  .admin-status-filters{
    padding:0;
    gap:4px;
    padding-bottom:4px;
  }
  
  .status-filter-chip{
    padding:8px 12px;
    font-size:11px;
    flex-shrink:0;
  }
  
  /* Esconder tabela no mobile */
  .admin-sales-table-container{
    display:none !important;
  }
  
  /* Mostrar cards no mobile */
  .admin-sales-cards{
    display:grid !important;
  }
  
  /* Mostrar cards no mobile */
  .admin-sales-cards{
    display:grid !important;
  }
}

@media (min-width:769px){
  /* Esconder cards no desktop */
  .admin-sales-cards{
    display:none !important;
  }
  
  /* Mostrar tabela no desktop */
  .admin-sales-table-container{
    display:block !important;
  }
  
  /* Esconder cards de itens no desktop, mostrar tabela */
  .admin-sale-items-cards{
    display:none !important;
  }
  
  .admin-sale-items-table-container{
    display:block !important;
  }
  
  /* Desktop - botões pequenos e quadrados */
  .admin-sale-detail-btn-icon,
  a.admin-sale-detail-btn-icon,
  button.admin-sale-detail-btn-icon{
    width:36px;
    height:36px;
    min-width:36px;
    min-height:36px;
    max-width:36px;
    max-height:36px;
  }
  
  .admin-sale-detail-btn-icon svg,
  a.admin-sale-detail-btn-icon svg,
  button.admin-sale-detail-btn-icon svg{
    width:18px;
    height:18px;
  }
  
  .admin-sale-detail-btn-separar{
    height:36px;
    padding:0 18px;
  }
}

/* Responsividade Mobile Geral - Admin */
@media (max-width:768px){
  /* Cards em coluna única */
  .dashboard-card,
  .admin-card{
    width:100% !important;
    max-width:100% !important;
  }
  
  /* Grids viram coluna única */
  .admin-grid,
  .admin-stats-grid{
    grid-template-columns:1fr !important;
  }
  
  /* Dashboard - Cards em coluna única */
  .dashboard-card{
    padding:20px 16px !important;
  }
  
  .dashboard-icon{
    width:56px !important;
    height:56px !important;
  }
  
  .dashboard-card h3{
    font-size:16px !important;
  }
  
  .dashboard-count{
    font-size:28px !important;
  }
  
  /* Stat cards menores no mobile */
  .stat-card{
    padding:16px !important;
  }
  
  .stat-value{
    font-size:24px !important;
  }
  
  /* Botões maiores (touch-friendly) */
  .admin-top .btn-outline,
  .admin-nav-buttons .btn-outline,
  .admin-top .btn,
  .admin-nav-buttons .btn{
    padding:12px 18px !important;
    font-size:14px !important;
    min-height:44px;
  }
  
  /* Filtros colapsáveis */
  .admin-filters{
    flex-direction:column;
    gap:12px;
  }
  
  /* Espaçamentos reduzidos no mobile */
  .admin-top{
    padding:20px 16px !important;
    margin-bottom:24px !important;
  }
  
  /* Títulos menores no mobile */
  .admin-top h1{
    font-size:24px !important;
  }
  
  .admin-top h2{
    font-size:20px !important;
  }
  
  /* Alert de pedidos pendentes - mobile */
  .pending-orders-alert{
    flex-direction:column !important;
    gap:16px !important;
    padding:16px !important;
  }
  
  .pending-orders-alert > a{
    width:100% !important;
    text-align:center !important;
  }
  
  /* Tabelas responsivas */
  table{
    font-size:12px !important;
  }
  
  table th,
  table td{
    padding:8px 6px !important;
  }
  
  /* Cards de vendas no mobile - Design Limpo e Organizado */
  .admin-sales-cards{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
    padding:0 8px 24px 8px;
  }
  
  .admin-sale-card{
    background:#ffffff;
    border:1px solid #e0e0e0;
    border-radius:12px;
    padding:16px;
    text-decoration:none;
    color:inherit;
    display:block;
    transition:all 0.2s ease;
    box-shadow:0 1px 3px rgba(0,0,0,0.08);
  }
  
  .admin-sale-card:hover{
    box-shadow:0 4px 12px rgba(0,0,0,0.12);
    transform:translateY(-2px);
    border-color:#ccc;
  }
  
  .admin-sale-card-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
    padding-bottom:12px;
    border-bottom:1px solid #f0f0f0;
  }
  
  .admin-sale-card-id{
    display:flex;
    align-items:center;
    gap:8px;
  }
  
  .admin-sale-card-number{
    font-size:18px;
    font-weight:700;
    color:#1a1a1a;
  }
  
  .admin-sale-card-pending-dot{
    width:8px;
    height:8px;
    background:#ffc107;
    border-radius:50%;
    animation:pulse-dot 2s infinite;
    box-shadow:0 0 6px rgba(255,193,7,0.5);
  }
  
  .admin-sale-card-status{
    padding:4px 10px;
    border-radius:12px;
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.3px;
    white-space:nowrap;
  }
  
  .admin-sale-card-status[data-status="pendente"]{
    background:#fff3cd;
    color:#856404;
  }
  
  .admin-sale-card-status[data-status="confirmado"]{
    background:#cfe2ff;
    color:#084298;
  }
  
  .admin-sale-card-status[data-status="separado"]{
    background:#d1ecf1;
    color:#055160;
  }
  
  .admin-sale-card-status[data-status="enviado"]{
    background:#d1e7dd;
    color:#0f5132;
  }
  
  .admin-sale-card-status[data-status="entregue"]{
    background:#d4edda;
    color:#155724;
  }
  
  .admin-sale-card-status[data-status="cancelado"]{
    background:#f8d7da;
    color:#842029;
  }
  
  .admin-sale-card-info{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-bottom:16px;
  }
  
  .admin-sale-card-info-item{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
  }
  
  .admin-sale-card-label{
    font-size:12px;
    color:#666;
    font-weight:500;
    text-transform:uppercase;
    letter-spacing:0.3px;
    flex-shrink:0;
    min-width:80px;
  }
  
  .admin-sale-card-text{
    font-size:14px;
    color:#1a1a1a;
    font-weight:500;
    text-align:right;
    flex:1;
  }
  
  .admin-sale-card-whatsapp{
    font-size:14px;
    color:#25D366;
    font-weight:600;
    text-decoration:none;
    text-align:right;
    flex:1;
  }
  
  .admin-sale-card-whatsapp:hover{
    color:#128C7E;
    text-decoration:underline;
  }
  
  .admin-sale-card-total{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-top:12px;
    border-top:2px solid #f0f0f0;
  }
  
  .admin-sale-card-total-label{
    font-size:13px;
    color:#666;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:0.5px;
  }
  
  .admin-sale-card-total-value{
    font-size:20px;
    font-weight:800;
    color:#ff6a3d;
  }
  
  /* Botão Nova Venda Assistida - fixo no mobile */
  .admin-venda-assistida-fab{
    position:fixed;
    bottom:24px;
    right:24px;
    width:64px;
    height:64px;
    border-radius:50%;
    background:#ff6a3d;
    color:#fff;
    border:none;
    box-shadow:0 4px 12px rgba(255,106,61,0.4);
    z-index:9998;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:all 0.3s;
  }
  
  .admin-venda-assistida-fab:hover{
    transform:scale(1.1);
    box-shadow:0 6px 16px rgba(255,106,61,0.5);
  }
  
  .admin-venda-assistida-fab svg{
    width:28px;
    height:28px;
  }
  
  /* Botão Fechar Caixa - fixo no mobile */
  .admin-caixa-fechar-fab{
    position:fixed;
    bottom:24px;
    right:24px;
    width:64px;
    height:64px;
    border-radius:50%;
    background:#28a745;
    color:#fff;
    border:none;
    box-shadow:0 4px 12px rgba(40,167,69,0.4);
    z-index:9998;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:all 0.3s;
  }
  
  .admin-caixa-fechar-fab:hover{
    transform:scale(1.1);
    box-shadow:0 6px 16px rgba(40,167,69,0.5);
  }
  
  .admin-caixa-fechar-fab svg{
    width:28px;
    height:28px;
  }
  
  /* Filtros colapsáveis no mobile - Produtos */
  .admin-filters-collapsible{
    background:#fff;
    border:1px solid #e5e5e5;
    border-radius:8px;
    padding:16px;
    margin-bottom:20px;
  }
  
  .admin-filters-toggle{
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
    padding:12px;
    background:#f8f9fa;
    border-radius:6px;
    margin-bottom:12px;
  }
  
  .admin-filters-content{
    display:none;
  }
  
  .admin-filters-content.active{
    display:block;
  }
}

@media (min-width:769px){
  .admin-filters-toggle{
    display:none !important;
  }
  
  .admin-filters-content{
    display:block !important;
  }
  
  .admin-caixa-fechar-fab,
  .admin-venda-assistida-fab{
    display:none !important;
  }
  
  .btn-fechar-caixa-desktop{
    display:inline-flex !important;
  }
}

@media (max-width:768px){
  .btn-fechar-caixa-desktop{
    display:none !important;
  }
  
  .admin-caixa-fechar-fab{
    display:flex !important;
  }
  
  /* Detalhes do Pedido - Responsividade */
  .admin-sale-detail-cards{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  
  .admin-sale-detail-cards > div{
    padding:16px !important;
  }
  
  .admin-sale-detail-cards h2{
    font-size:16px !important;
  }
  
  .admin-sale-items-header{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
  
  .admin-sale-items-header > div{
    width:100% !important;
  }
  
  .admin-status-select{
    width:100% !important;
    min-width:100% !important;
  }
  
  .admin-btn-thankyou-mobile{
    width:100% !important;
    justify-content:center !important;
  }
  
  .admin-sale-items-table-container{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  
  .admin-sale-items-table{
    font-size:12px !important;
  }
  
  .admin-sale-items-table th,
  .admin-sale-items-table td{
    padding:8px 6px !important;
  }
  
  .admin-sale-items-table th:nth-child(4),
  .admin-sale-items-table th:nth-child(5),
  .admin-sale-items-table th:nth-child(6),
  .admin-sale-items-table th:nth-child(7),
  .admin-sale-items-table td:nth-child(4),
  .admin-sale-items-table td:nth-child(5),
  .admin-sale-items-table td:nth-child(6),
  .admin-sale-items-table td:nth-child(7){
    font-size:11px !important;
  }
  
/* Cards de itens - detalhes do pedido (mobile) */
.admin-sale-items-cards{
  display:none;
}

.admin-sale-item-card{
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
  border:1.5px solid #e2e8f0;
  border-radius:16px;
  padding:16px;
  margin-bottom:16px;
  position:relative;
  overflow:hidden;
  box-shadow:0 2px 8px rgba(0,0,0,0.04);
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}

.admin-sale-item-card::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background: linear-gradient(90deg, #ff6a3d 0%, #4f46e5 100%);
}

.admin-sale-item-card:hover{
  box-shadow:0 8px 24px rgba(0,0,0,0.12);
  transform:translateY(-2px);
  border-color:#cbd5e1;
}

.admin-sale-item-card-header{
  display:flex;
  gap:12px;
  margin-bottom:16px;
  padding-bottom:16px;
  border-bottom:2px solid #f1f5f9;
}

.admin-sale-item-card-image-container{
  flex-shrink:0;
}

.admin-sale-item-card-image{
  width:60px;
  height:60px;
  border-radius:10px;
  overflow:hidden;
  background:#f1f5f9;
  position:relative;
  border:2px solid #e2e8f0;
}

.admin-sale-item-card-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.admin-sale-item-card-image-placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#94a3b8;
}

.admin-sale-item-card-image-badge{
  position:absolute;
  bottom:4px;
  right:4px;
  background:rgba(0,0,0,0.8);
  color:#fff;
  font-size:9px;
  font-weight:700;
  padding:2px 5px;
  border-radius:8px;
}

.admin-sale-item-card-info{
  flex:1;
  min-width:0;
}

.admin-sale-item-card-name{
  margin:0 0 6px 0;
  font-size:15px;
  font-weight:700;
  color:#1a1a1a;
  line-height:1.3;
}

.admin-sale-item-card-supplier{
  margin:0 0 4px 0;
  font-size:12px;
  color:#64748b;
  font-weight:500;
}

.admin-sale-item-card-ref{
  margin:0;
  font-size:11px;
  color:#94a3b8;
}

.admin-sale-item-card-details{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.admin-sale-item-card-tags{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.admin-sale-item-card-tag{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:5px 10px;
  background:#f1f5f9;
  border:1px solid #e2e8f0;
  border-radius:8px;
  font-size:11px;
  font-weight:600;
  color:#475569;
}

.admin-sale-item-card-tag svg{
  width:12px;
  height:12px;
  flex-shrink:0;
}

.admin-sale-item-card-prices{
  background:#f8f9fa;
  border-radius:12px;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.admin-sale-item-card-price-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:4px 0;
}

.admin-sale-item-card-price-label{
  font-size:12px;
  color:#64748b;
  font-weight:600;
}

.admin-sale-item-card-price-value{
  font-size:13px;
  font-weight:600;
  color:#1e293b;
}

.admin-sale-item-card-price-original{
  font-size:12px;
  font-weight:500;
  color:#94a3b8;
  text-decoration:line-through;
}

.admin-sale-item-card-price-discount{
  font-size:12px;
  font-weight:700;
  color:#28a745;
}

.admin-sale-item-card-price-unit{
  font-size:13px;
  font-weight:600;
  color:#475569;
}

.admin-sale-item-card-subtotal{
  padding-top:8px;
  border-top:2px solid #e2e8f0;
  margin-top:4px;
}

.admin-sale-item-card-price-total{
  font-size:16px;
  font-weight:800;
  color:#ff6a3d;
  background: linear-gradient(135deg, #ff6a3d 0%, #f97316 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.admin-sale-items-total-card{
  background: linear-gradient(135deg, #fff5f0 0%, #ffe8e0 100%);
  border:2px solid #ff6a3d;
  border-radius:16px;
  padding:20px;
  margin-top:8px;
  text-align:center;
}

.admin-sale-items-total-label{
  font-size:12px;
  font-weight:700;
  color:#c2410c;
  text-transform:uppercase;
  letter-spacing:1px;
  margin-bottom:8px;
}

.admin-sale-items-total-value{
  font-size:28px;
  font-weight:800;
  color:#ff6a3d;
  background: linear-gradient(135deg, #ff6a3d 0%, #f97316 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  letter-spacing:-1px;
}

/* ===== BOTÕES DE AÇÃO - DETALHES DO PEDIDO - PEQUENOS E QUADRADOS ===== */
.admin-sale-detail-buttons-container{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
}

.admin-sale-detail-buttons-row{
  display:flex;
  gap:8px;
  width:100%;
  align-items:center;
  flex-wrap:nowrap;
}

/* REGRA BASE - BOTÕES PEQUENOS E QUADRADOS */
.admin-sale-detail-btn-icon,
a.admin-sale-detail-btn-icon,
button.admin-sale-detail-btn-icon{
  width:36px;
  height:36px;
  min-width:36px;
  min-height:36px;
  max-width:36px;
  max-height:36px;
  padding:0;
  margin:0;
  border-radius:6px;
  border:1.5px solid;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:all 0.2s ease;
  text-decoration:none;
  box-sizing:border-box;
  line-height:1;
  font-size:0;
  outline:none;
  flex-shrink:0;
}

.admin-sale-detail-btn-icon:hover:not(:disabled),
a.admin-sale-detail-btn-icon:hover:not(:disabled){
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
  text-decoration:none;
}

.admin-sale-detail-btn-icon:disabled{
  cursor:not-allowed;
  opacity:0.5;
}

/* SVGs PEQUENOS */
.admin-sale-detail-btn-icon svg,
a.admin-sale-detail-btn-icon svg,
button.admin-sale-detail-btn-icon svg{
  width:18px;
  height:18px;
  flex-shrink:0;
  display:block;
  margin:0;
  padding:0;
}

/* CORES - COMPARTILHAR (AMARELO) - ESPECIFICIDADE MÁXIMA */
.admin-sale-detail-btn-icon.admin-sale-detail-btn-share,
button.admin-sale-detail-btn-icon.admin-sale-detail-btn-share,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-share:link,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-share:visited,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-share:active{
  background:#FFC107 !important;
  color:#000 !important;
  border-color:#FFC107 !important;
}

.admin-sale-detail-btn-icon.admin-sale-detail-btn-share:disabled{
  background:#ccc !important;
  color:#666 !important;
  border-color:#ccc !important;
}

/* CORES - MOTOBOY (LARANJA) - ESPECIFICIDADE MÁXIMA */
.admin-sale-detail-btn-icon.admin-sale-detail-btn-motoboy,
button.admin-sale-detail-btn-icon.admin-sale-detail-btn-motoboy,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-motoboy:link,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-motoboy:visited,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-motoboy:active{
  background:#ff6a3d !important;
  color:#fff !important;
  border-color:#ff6a3d !important;
}

/* CORES - AGRADECER CLIENTE (VERDE) - ESPECIFICIDADE MÁXIMA */
.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou,
.admin-sale-detail-buttons-row a.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou:link,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou:link,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou:visited,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou:visited,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou:active,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou:active,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou:hover,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-thankyou:hover{
  background:#25D366 !important;
  color:#fff !important;
  border-color:#25D366 !important;
}

/* CORES - IMPRIMIR (AZUL) - ESPECIFICIDADE MÁXIMA */
.admin-sale-detail-btn-icon.admin-sale-detail-btn-print,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-print,
.admin-sale-detail-buttons-row a.admin-sale-detail-btn-icon.admin-sale-detail-btn-print,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-print:link,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-print:link,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-print:visited,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-print:visited,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-print:active,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-print:active,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-print:hover,
a.admin-sale-detail-btn-icon.admin-sale-detail-btn-print:hover{
  background:#2196F3 !important;
  color:#fff !important;
  border-color:#2196F3 !important;
}

/* CORES - EXCLUIR (VERMELHO) - ESPECIFICIDADE MÁXIMA */
.admin-sale-detail-btn-icon.admin-sale-detail-btn-delete,
button.admin-sale-detail-btn-icon.admin-sale-detail-btn-delete,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-delete:link,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-delete:visited,
.admin-sale-detail-btn-icon.admin-sale-detail-btn-delete:active{
  background:#dc3545 !important;
  color:#fff !important;
  border-color:#dc3545 !important;
}

.admin-sale-detail-buttons-row-separar{
  width:100%;
}

.admin-sale-detail-btn-separar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:36px;
  padding:0 16px;
  background:#28a745;
  color:#fff;
  border:1.5px solid #28a745;
  border-radius:8px;
  gap:8px;
  font-weight:600;
  font-size:14px;
  text-decoration:none;
  transition:all 0.2s ease;
  box-sizing:border-box;
}

.admin-sale-detail-btn-separar:hover{
  background:#218838;
  border-color:#218838;
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(40,167,69,0.3);
}

.admin-sale-detail-btn-separar svg{
  width:16px;
  height:16px;
  flex-shrink:0;
}

@media (max-width:768px){
  /* Mobile - botões pequenos e quadrados (igual ao desktop) */
  .admin-sale-detail-btn-icon,
  a.admin-sale-detail-btn-icon,
  button.admin-sale-detail-btn-icon{
    width:36px;
    height:36px;
    min-width:36px;
    min-height:36px;
    max-width:36px;
    max-height:36px;
  }
  
  .admin-sale-detail-btn-icon svg,
  a.admin-sale-detail-btn-icon svg,
  button.admin-sale-detail-btn-icon svg{
    width:18px;
    height:18px;
  }
  
  .admin-sale-detail-btn-separar{
    width:100%;
    height:44px;
  }
  
  /* Mostrar cards de itens no mobile */
  .admin-sale-items-cards{
    display:block !important;
  }
  
  /* Esconder tabela no mobile */
  .admin-sale-items-table-container{
    display:none !important;
  }
  
  /* Grid de informações de venda - mobile */
  .admin-sale-info-grid{
    grid-template-columns:1fr !important;
  }
  
  /* Forma de pagamento - mobile */
  .admin-payment-form{
    flex-direction:column !important;
  }
  
  .admin-payment-form > div{
    min-width:100% !important;
  }
  
  .admin-payment-form select{
    width:100% !important;
    min-width:100% !important;
  }
}

/* ===== ADMIN SIDEBAR - MENU LATERAL ===== */
/* Layout Principal: Sidebar + Header + Content */
body.admin-sidebar-layout{
  margin:0;
  padding:0;
}

/* Sidebar - Desktop Fixo */
.admin-sidebar{
  position:fixed;
  left:0;
  top:0;
  bottom:0;
  width:280px;
  background:#ffffff;
  border-right:1px solid #e2e8f0;
  box-shadow:2px 0 8px rgba(0,0,0,0.05);
  z-index:9998;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  overflow-x:hidden;
}

.admin-sidebar-header{
  padding:16px 20px;
  border-bottom:1px solid #e2e8f0;
  background:#ffffff;
  flex-shrink:0;
}

.admin-sidebar-logo{
  display:flex;
  align-items:center;
  text-decoration:none;
  color:#1a1a1a;
}

.admin-sidebar-logo-img{
  max-height:32px;
  max-width:100px;
  width:auto;
  height:auto;
  object-fit:contain;
}

.admin-sidebar-logo-text{
  font-size:14px;
  font-weight:700;
  color:#1a1a1a;
  letter-spacing:0.5px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.admin-sidebar-menu{
  flex:1;
  padding:16px 0;
  overflow-y:auto;
  overflow-x:hidden;
}

.admin-sidebar-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 20px;
  color:#64748b;
  text-decoration:none;
  font-size:14px;
  font-weight:500;
  transition:all 0.2s;
  border-left:3px solid transparent;
  position:relative;
}

.admin-sidebar-item:hover{
  background:#f1f5f9;
  color:#334155;
}

.admin-sidebar-item.active{
  background:#eef2ff;
  color:#4f46e5;
  border-left-color:#4f46e5;
  font-weight:600;
}

.admin-sidebar-item svg{
  flex-shrink:0;
  width:18px;
  height:18px;
}

.admin-sidebar-item.active svg{
  color:#4f46e5;
  stroke:#4f46e5;
}

/* Submenu (Accordion) */
.admin-sidebar-group{
  margin:4px 0;
}

.admin-sidebar-group-title{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 20px;
  color:#64748b;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.2s;
  user-select:none;
  border-left:3px solid transparent;
}

.admin-sidebar-group-title:hover{
  background:#f1f5f9;
  color:#334155;
}

.admin-sidebar-group-title.active{
  background:#eef2ff;
  color:#4f46e5;
  border-left-color:#4f46e5;
}

.admin-sidebar-group-title svg:first-child{
  flex-shrink:0;
  width:18px;
  height:18px;
}

.admin-sidebar-group-arrow{
  margin-left:auto;
  width:14px;
  height:14px;
  transition:transform 0.2s;
}

.admin-sidebar-group-title.active .admin-sidebar-group-arrow{
  transform:rotate(180deg);
}

.admin-sidebar-submenu{
  display:none !important;
  background:#f8f9fa;
  border-left:3px solid #e2e8f0;
  margin-left:24px;
  padding:4px 0;
}

.admin-sidebar-group.open .admin-sidebar-submenu{
  display:block !important;
}

.admin-sidebar-submenu-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 24px 10px 48px;
  color:#64748b;
  text-decoration:none;
  font-size:13px;
  font-weight:500;
  transition:all 0.2s;
}

.admin-sidebar-submenu-item:hover{
  background:#f1f5f9;
  color:#334155;
}

.admin-sidebar-submenu-item.active{
  background:#eef2ff;
  color:#4f46e5;
  font-weight:600;
}

.admin-sidebar-submenu-item svg{
  flex-shrink:0;
  width:16px;
  height:16px;
}

/* Item Especial (destaque) */
.admin-sidebar-item.highlight,
.admin-sidebar-submenu-item.highlight{
  background:#fff5f0;
  color:#ff6a3d;
  border-left-color:#ff6a3d;
}

.admin-sidebar-item.highlight:hover,
.admin-sidebar-submenu-item.highlight:hover{
  background:#ffe8dd;
}

.admin-sidebar-item.highlight.active,
.admin-sidebar-submenu-item.highlight.active{
  background:#fff5f0;
  color:#ff6a3d;
  border-left-color:#ff6a3d;
}

/* Header Limpo (Top Bar) */
.admin-top-bar{
  position:fixed;
  top:0;
  left:280px;
  right:0;
  height:64px;
  background:#ffffff;
  border-bottom:1px solid #e2e8f0;
  box-shadow:0 2px 8px rgba(0,0,0,0.08);
  z-index:9997;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 24px;
  gap:24px;
}

.admin-top-bar-left{
  display:flex;
  align-items:center;
  gap:16px;
  flex:1;
}

.admin-top-bar-title{
  font-size:18px;
  font-weight:700;
  color:#1a1a1a;
  margin:0;
}

.admin-top-bar-right{
  display:flex;
  align-items:center;
  gap:16px;
}

.admin-top-bar-user{
  display:flex;
  align-items:center;
  gap:12px;
  padding:8px 16px;
  border-radius:8px;
  background:#f8f9fa;
  color:#334155;
  font-size:14px;
  font-weight:500;
  text-decoration:none;
  transition:all 0.2s;
}

.admin-top-bar-user:hover{
  background:#e9ecef;
}

.admin-top-bar-user-avatar{
  width:32px;
  height:32px;
  border-radius:50%;
  background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:700;
  font-size:14px;
  flex-shrink:0;
}

.admin-top-bar-logout{
  padding:8px 16px;
  border-radius:8px;
  background:transparent;
  color:#dc3545;
  font-size:14px;
  font-weight:500;
  text-decoration:none;
  border:1px solid #dc3545;
  transition:all 0.2s;
}

.admin-top-bar-logout:hover{
  background:#dc3545;
  color:#fff;
}

.admin-top-bar-menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:none;
  background:transparent;
  border-radius:8px;
  cursor:pointer;
  color:#64748b;
  transition:all 0.2s;
  flex-shrink:0;
}

.admin-top-bar-menu-toggle:hover{
  background:#f1f5f9;
  color:#334155;
}

.admin-top-bar-menu-toggle svg{
  width:24px;
  height:24px;
}

/* Conteúdo Principal */
.admin-main-content{
  margin-left:280px;
  margin-top:64px;
  padding:24px;
  min-height:calc(100vh - 64px);
  background:#f8f9fa;
}

/* Overlay Mobile */
.admin-sidebar-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.5);
  z-index:9996;
  opacity:0;
  transition:opacity 0.3s ease;
}

.admin-sidebar-overlay.active{
  display:block;
  opacity:1;
}

/* Mobile: Sidebar como Overlay */
@media (max-width:1024px){
  .admin-sidebar{
    transform:translateX(-100%);
    transition:transform 0.3s ease;
    z-index:10000;
  }
  
  .admin-sidebar.open{
    transform:translateX(0);
  }
  
  .admin-top-bar{
    left:0;
  }
  
  .admin-top-bar-menu-toggle{
    display:flex;
  }
  
  .admin-main-content{
    margin-left:0;
  }
  
  .admin-sidebar-overlay.active{
    display:block;
  }
}

/* Scrollbar Personalizado para Sidebar */
.admin-sidebar-menu::-webkit-scrollbar{
  width:6px;
}

.admin-sidebar-menu::-webkit-scrollbar-track{
  background:transparent;
}

.admin-sidebar-menu::-webkit-scrollbar-thumb{
  background:#cbd5e1;
  border-radius:3px;
}

.admin-sidebar-menu::-webkit-scrollbar-thumb:hover{
  background:#94a3b8;
}
/* ===== SIDEBAR LATERAL MODERNO ===== */
/* Aplicado apenas para site público (não admin/owner) */
body:not(.admin-page):not(.owner-page) {
  margin: 0;
  padding: 0;
}

.sidebar-container {
  display: flex;
  min-height: 100vh;
}

/* Sidebar */
.sidebar {
  position: fixed;
  left: 0;
  top: 0;
  width: 280px;
  height: 100vh;
  background: linear-gradient(180deg, #1a1a1a 0%, #2a2a2a 100%);
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  z-index: 1000;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 2px 0 20px rgba(0, 0, 0, 0.3);
}

.sidebar-header {
  padding: 24px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sidebar-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: 0.5px;
}

.sidebar-logo img {
  height: 32px;
  width: auto;
}

.sidebar-toggle {
  background: transparent;
  border: none;
  color: #fff;
  cursor: pointer;
  padding: 8px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}

.sidebar-toggle:hover {
  background: rgba(255, 255, 255, 0.1);
}

.sidebar-nav {
  flex: 1;
  overflow-y: auto;
  padding: 16px 0;
}

.sidebar-search {
  padding: 0 16px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  margin-bottom: 16px;
}

.sidebar-search-input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.2s;
}

.sidebar-search-input-wrapper:focus-within {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 106, 61, 0.5);
}

.sidebar-search-input {
  flex: 1;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 14px;
  outline: none;
  padding: 0;
}

.sidebar-search-input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.sidebar-search-btn {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s;
}

.sidebar-search-btn:hover {
  color: #ff6a3d;
}

.sidebar-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sidebar-menu-item {
  margin: 0;
  padding: 0;
}

.sidebar-menu-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 20px;
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s;
  border-left: 3px solid transparent;
  position: relative;
}

.sidebar-menu-link:hover {
  background: rgba(255, 255, 255, 0.05);
  color: #fff;
  border-left-color: rgba(255, 106, 61, 0.5);
}

.sidebar-menu-link.active {
  background: linear-gradient(90deg, rgba(255, 106, 61, 0.2) 0%, transparent 100%);
  color: #ff6a3d;
  border-left-color: #ff6a3d;
  font-weight: 600;
}

.sidebar-menu-link svg {
  width: 18px;
  height: 18px;
  stroke-width: 2;
  flex-shrink: 0;
}

.sidebar-menu-link.active svg {
  color: #ff6a3d;
}

/* Subcategorias */
.sidebar-menu-category {
  position: relative;
}

.sidebar-menu-category-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 12px 20px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  transition: all 0.2s;
  border-left: 3px solid transparent;
}

.sidebar-menu-category-toggle:hover {
  background: rgba(255, 255, 255, 0.05);
  color: #fff;
}

.sidebar-menu-category-toggle svg {
  width: 16px;
  height: 16px;
  transition: transform 0.3s;
}

.sidebar-menu-category.expanded .sidebar-menu-category-toggle svg {
  transform: rotate(180deg);
}

.sidebar-submenu {
  list-style: none;
  margin: 0;
  padding: 0;
  background: rgba(0, 0, 0, 0.2);
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}

.sidebar-menu-category.expanded .sidebar-submenu {
  max-height: 1000px;
  transition: max-height 0.5s ease-in;
}

.sidebar-submenu-item {
  margin: 0;
  padding: 0;
}

.sidebar-submenu-link {
  display: block;
  padding: 10px 20px 10px 48px;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: 13px;
  transition: all 0.2s;
  border-left: 3px solid transparent;
}

.sidebar-submenu-link:hover {
  background: rgba(255, 255, 255, 0.05);
  color: #fff;
  border-left-color: rgba(255, 106, 61, 0.5);
}

.sidebar-submenu-link.active {
  color: #ff6a3d;
  border-left-color: #ff6a3d;
  font-weight: 500;
  background: rgba(255, 106, 61, 0.1);
}

.sidebar-footer {
  padding: 16px 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.sidebar-cart {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: rgba(255, 106, 61, 0.1);
  border: 1px solid rgba(255, 106, 61, 0.3);
  border-radius: 8px;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s;
  position: relative;
}

.sidebar-cart:hover {
  background: rgba(255, 106, 61, 0.2);
  border-color: #ff6a3d;
}

.sidebar-cart svg {
  width: 20px;
  height: 20px;
}

.sidebar-cart-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #ff6a3d;
  color: #fff;
  border-radius: 50%;
  min-width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  padding: 0 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.sidebar-user {
  padding: 12px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
}

/* Conteúdo principal */
.main-content {
  flex: 1;
  margin-left: 280px;
  transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  min-height: 100vh;
}

.sidebar.collapsed {
  transform: translateX(-280px);
}

.sidebar.collapsed ~ .main-content {
  margin-left: 0;
}

/* Top bar simplificada */
.main-header {
  background: #fff;
  border-bottom: 1px solid #e5e5e5;
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.main-header-left {
  display: flex;
  align-items: center;
  gap: 16px;
}

.sidebar-toggle-top {
  background: transparent;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  padding: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.sidebar-toggle-top:hover {
  background: #f5f5f5;
  border-color: #ddd;
}

.main-header-right {
  display: flex;
  align-items: center;
  gap: 16px;
}

/* Responsivo */
@media (max-width: 1024px) {
  .sidebar {
    transform: translateX(-100%);
  }
  
  .sidebar.active {
    transform: translateX(0);
  }
  
  .main-content {
    margin-left: 0;
  }
  
  .sidebar-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
  }
  
  .sidebar-overlay.active {
    opacity: 1;
    visibility: visible;
  }
}

/* Scrollbar personalizado para sidebar */
.sidebar-nav::-webkit-scrollbar {
  width: 6px;
}

.sidebar-nav::-webkit-scrollbar-track {
  background: transparent;
}

.sidebar-nav::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 3px;
}

.sidebar-nav::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.3);
}