﻿:root{
  --shop-line: rgba(0,0,0,.10);
  --shop-glass: rgba(255,255,255,.88);
  --shop-glass-2: rgba(255,255,255,.92);
}

/* Topbar padrao PypyShop: igual a pagina inicial */
.topbar{
  background:#fff !important;
  border-bottom:1px solid rgba(18,24,38,.10) !important;
  box-shadow:0 12px 34px rgba(15,23,42,.08) !important;
}
.nav a{
  color:#1f2937 !important;
}
.nav a:hover{
  color:#0b1215 !important;
  background:#fff !important;
}
.brand img{
  filter:none;
  border-radius:0;
}
.nav-toggle{
  border-color:rgba(18,24,38,.14) !important;
  background:#fff !important;
}
.nav-toggle span{
  background:#1f2937 !important;
}
/* Public buttons: more squared */
.btn,
.btn-primary,
.btn-ghost,
.ms-btn,
.ms-btn-primary,
.ms-btn-ghost{
  border-radius:12px !important;
}

/* Language flags (public) */
.lang-flags{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.lang-flag-btn{
  width:36px;
  height:30px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.10);
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(16px);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 12px 40px rgba(0,0,0,.10);
}
.lang-flag-btn.on{
  border-color:rgba(147,255,45,.85);
  box-shadow:0 0 0 4px rgba(147,255,45,.14);
}
.lang-flag{
  width:22px;
  height:16px;
  border-radius:4px;
  border:1px solid rgba(0,0,0,.10);
  background-size:cover;
  background-position:center;
}
.lang-flag.es{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23D52B1E'/%3E%3Crect y='5.333' width='24' height='5.334' fill='%23FFFFFF'/%3E%3Crect y='10.667' width='24' height='5.333' fill='%23003DA5'/%3E%3Ccircle cx='12' cy='8' r='1.55' fill='%23F5D04C' stroke='%2300703C' stroke-width='.35'/%3E%3C/svg%3E");
}
.lang-flag.py{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23D52B1E'/%3E%3Crect y='5.333' width='24' height='5.334' fill='%23FFFFFF'/%3E%3Crect y='10.667' width='24' height='5.333' fill='%23003DA5'/%3E%3Ccircle cx='12' cy='8' r='1.55' fill='%23F5D04C' stroke='%2300703C' stroke-width='.35'/%3E%3C/svg%3E");
}
.lang-flag.uk{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23012169'/%3E%3Cpath d='M0 0 L24 16 M24 0 L0 16' stroke='%23FFFFFF' stroke-width='4'/%3E%3Cpath d='M0 0 L24 16 M24 0 L0 16' stroke='%23C8102E' stroke-width='2'/%3E%3Cpath d='M12 0 v16 M0 8 h24' stroke='%23FFFFFF' stroke-width='6'/%3E%3Cpath d='M12 0 v16 M0 8 h24' stroke='%23C8102E' stroke-width='4'/%3E%3C/svg%3E");
}
.lang-flag.br{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23009639'/%3E%3Cpath d='M12 2 L22 8 L12 14 L2 8 Z' fill='%23FFDF00'/%3E%3Ccircle cx='12' cy='8' r='3.3' fill='%23002876'/%3E%3Cpath d='M8.9 7.1 C10.9 7.7 12.9 7.8 15.1 7.2' fill='none' stroke='%23FFFFFF' stroke-width='.8'/%3E%3C/svg%3E");
}

/* Customer area: slightly bigger logo */
.customer-area .brand img{
  height:124px;
  max-height:124px;
  width:auto;
  max-width:min(520px, 70vw);
  object-fit:contain;
}

/* Toast modal (fade-in/out) */
.toast{
  position:fixed;
  inset:0;
  z-index:25000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.18);
  opacity:0;
  pointer-events:none;
  transition:opacity .28s ease;
}
.toast.show{opacity:1;pointer-events:auto}
.toast-inner{
  border-radius:18px;
  border:1px solid rgba(0,0,0,.10);
  color:#0a0a0a;
  padding:14px 16px;
  box-shadow:0 18px 60px rgba(0,0,0,.18);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-weight:900;
  width:min(560px, 100%);
  transform:scale(.96);
  transition:transform .28s ease;
  background:linear-gradient(135deg, rgba(147,255,45,1), rgba(117,212,28,1));
}
.toast-inner.error{
  background:linear-gradient(135deg, rgba(255,95,95,1), rgba(220,40,40,1));
  color:#fff;
}
.toast-inner.info{
  background:linear-gradient(135deg, rgba(30,30,30,1), rgba(10,10,10,1));
  color:#fff;
}
.toast.show .toast-inner{transform:scale(1)}
.toast-sub{font-weight:800;opacity:.85}

/* Header: responsive nav */
.topbar-inner{gap:16px}
.nav-toggle{
  display:none;
  width:44px;height:44px;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.72);
  cursor:pointer;
}
.nav-toggle:active{transform:scale(.98)}
.nav-toggle span{
  display:block;width:18px;height:2px;background:#1a1a1a;margin:4px auto;border-radius:999px;
}
.nav-drawer{
  display:none;
  position:fixed;
  inset:0;
  z-index:25;
}
.nav-drawer.show{display:block}
.nav-drawer .backdrop{position:absolute;inset:0;background:rgba(0,0,0,.28)}
.nav-drawer .panel{
  position:absolute;left:16px;right:16px;top:96px;
  border-radius:22px;
  border:1px solid var(--shop-line);
  background:var(--shop-glass-2);
  backdrop-filter:blur(14px);
  box-shadow:0 30px 90px rgba(0,0,0,.20);
  padding:12px;
}
.nav-drawer a{
  display:block;
  padding:14px 14px;
  border-radius:18px;
  font-weight:900;
  color:rgba(0,0,0,.75);
  border:1px solid rgba(0,0,0,.06);
  background:#fff;
}
.nav-drawer a + a{margin-top:10px}

@media(max-width: 980px){
  .nav{display:none}
  .nav-toggle{display:block}
}

/* Page shell */
.shop-page{padding:18px 0 30px}
.shop-title{margin:0;font-size:2rem;letter-spacing:-.05em}
.shop-sub{margin:8px 0 0;color:#5e5e5e}
.shop-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:14px;margin-top:14px}
.shop-card{
  border:1px solid var(--shop-line);
  border-radius:22px;
  background:rgba(255,255,255,.90);
  backdrop-filter:blur(12px);
  box-shadow:0 20px 60px rgba(0,0,0,.10);
  overflow:hidden;
}
.shop-card-in{padding:16px}

@media(max-width: 920px){
  .shop-grid{grid-template-columns:1fr}
}

/* Cart/summary items */
.shop-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid rgba(0,0,0,.08)}
.shop-item:last-child{border-bottom:none}
.shop-item-left{display:flex;align-items:center;gap:12px;min-width:0}
.shop-item-img{height:52px;width:52px;border-radius:16px;border:1px solid rgba(0,0,0,.10);overflow:hidden;background:rgba(0,0,0,.02);flex:0 0 auto}
.shop-item-img img{height:100%;width:100%;object-fit:cover}
.shop-item-name{font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shop-item-meta{margin-top:4px;color:rgba(0,0,0,.62);font-weight:800;font-size:.92rem}
.shop-total{display:flex;align-items:center;justify-content:space-between;font-weight:950;font-size:1.05rem;margin-top:10px}

/* Payment options */
.paygrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.opt{
  border:1px solid rgba(0,0,0,.12);
  border-radius:18px;
  padding:14px 14px;
  background:#fff;
  cursor:pointer;
  font-weight:950;
  text-align:left;
}
.opt small{display:block;margin-top:4px;color:rgba(0,0,0,.62);font-weight:800}
.opt.active{border-color:rgba(147,255,45,.95);box-shadow:0 0 0 4px rgba(147,255,45,.18)}
@media(max-width: 520px){ .paygrid{grid-template-columns:1fr} }

/* Forms */
.shop-form .ms-label{font-weight:950}
.shop-form .ms-input{border-radius:16px}

/* Pix box */
.pixbox{margin-top:12px;border:1px dashed rgba(0,0,0,.18);border-radius:18px;padding:12px;background:rgba(0,0,0,.02)}
.pixbox textarea{width:100%;min-height:120px;border-radius:14px;border:1px solid rgba(0,0,0,.12);padding:10px;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace}

