/* ==========================================================
   JCR MENU PRO v4.0 — acabamento premium inspirado no Taste Skill
   Camada visual não destrutiva: preserva o motor, Pix e Supabase.
   ========================================================== */
:root{
  --focus-ring:0 0 0 3px color-mix(in srgb,var(--primary) 22%,transparent);
  --surface-glass:color-mix(in srgb,var(--card) 86%,transparent);
  --premium-shadow:0 18px 48px rgba(0,0,0,.20);
}

/* Acessibilidade + sensação de produto pronto */
.skip-link{position:fixed;left:12px;top:10px;z-index:9999;transform:translateY(-160%);padding:10px 13px;border-radius:12px;background:#fff;color:#111;text-decoration:none;font-weight:900;box-shadow:0 12px 30px rgba(0,0,0,.24);transition:transform .18s ease}
.skip-link:focus{transform:translateY(0)}
:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:none;box-shadow:var(--focus-ring)!important}
:where(button,a,.product,.chip,.icon-btn,.market-primary,.secondary,.primary,.danger){-webkit-tap-highlight-color:transparent}
button,.product,.chip,.icon-btn,.market-primary,.secondary,.primary,.danger{transition:transform .18s ease,box-shadow .22s ease,background-color .22s ease,border-color .22s ease,opacity .22s ease}

/* Tipografia e ritmo */
body{font-family:"Segoe UI Variable","Aptos",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-variant-numeric:tabular-nums;text-rendering:optimizeLegibility}
h1,.section-head h2,.product-title,.brand-name{text-wrap:balance}
.p-desc,.hero-sub,.market-home-copy>p{text-wrap:pretty}
.shell{width:min(100%,1180px)}

/* Cabeçalho mais limpo e consistente */
.topbar{background:color-mix(in srgb,var(--bg) 84%,transparent);border-bottom-color:color-mix(in srgb,var(--line) 64%,transparent);box-shadow:0 8px 26px rgba(0,0,0,.08)}
.icon-btn{box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.brand-name{letter-spacing:-.015em}
.status{letter-spacing:.005em}

/* Busca e categorias */
.search input{box-shadow:inset 0 1px 0 rgba(255,255,255,.025);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.cats{scroll-snap-type:x proximity;padding-bottom:2px}
.chip{scroll-snap-align:start}

/* Cartões com hierarquia e microinteração */
.product{will-change:transform;box-shadow:0 10px 30px rgba(0,0,0,.11)}
.product .p-image img{transition:transform .32s cubic-bezier(.2,.75,.25,1),filter .28s ease}
.product .p-name{line-height:1.22}
.p-price{letter-spacing:-.025em}
.add,.demo-market-plus{transition:transform .17s ease,filter .2s ease,box-shadow .2s ease}

/* Market: refinamento sem alterar a estrutura aprovada */
body[data-family="market"] .market-home-shell{box-shadow:0 26px 68px rgba(5,28,86,.24);isolation:isolate}
body[data-family="market"] .market-home-copy:after{content:"";position:absolute;width:250px;height:250px;border-radius:50%;right:-110px;bottom:-130px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 18%,transparent),transparent 66%);pointer-events:none}
body[data-family="market"] .market-home-photo:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(1,15,48,.15));pointer-events:none}
body[data-family="market"] .market-primary{box-shadow:0 10px 25px rgba(255,210,26,.16)}
body[data-family="market"] .market-product{border-color:#dce5f1;box-shadow:0 12px 32px rgba(17,44,92,.10)}
body[data-family="market"] .market-product .p-image{border-bottom:1px solid #e8eef6}
body[data-family="market"] .market-product .p-name{letter-spacing:-.012em}
body[data-family="market"] .market-product .p-desc{color:#6b778a}
body[data-family="market"] .market-product-bottom{border-top:1px solid #edf1f7;margin-top:auto;padding-top:11px}
body[data-family="market"] .demo-market-plus{box-shadow:0 8px 18px rgba(18,58,152,.18)}
body[data-family="market"] .demo-catalog-note{box-shadow:0 8px 24px rgba(20,50,100,.06)}

/* Diálogos e carrinho */
.sheet{box-shadow:0 -28px 78px rgba(0,0,0,.48)}
.sheet-head{background:color-mix(in srgb,var(--card) 92%,transparent);backdrop-filter:blur(14px)}
.cartbar button{box-shadow:0 16px 40px color-mix(in srgb,var(--primary) 24%,transparent)}
.toast{box-shadow:0 16px 42px rgba(0,0,0,.28)}

/* Imagens: evita salto visual e melhora renderização */
.p-image img,.modal-image img,.hero-logo img,.brand-logo img{image-rendering:auto}
.p-image,.modal-image{contain:paint}

/* Light mode */
body[data-ui-theme="light"]{--premium-shadow:0 18px 45px rgba(15,23,42,.10)}
body[data-ui-theme="light"] .topbar{box-shadow:0 8px 24px rgba(15,23,42,.06)}
body[data-ui-theme="light"] .search input{box-shadow:0 8px 24px rgba(15,23,42,.055)}
body[data-ui-theme="light"] .sheet-head{background:rgba(255,255,255,.92)}
body[data-ui-theme="light"][data-family="market"] .market-product{box-shadow:0 12px 30px rgba(18,58,152,.09)}

/* Desktop: hover somente onde existe ponteiro fino */
@media (hover:hover) and (pointer:fine){
  .icon-btn:hover,.chip:hover{transform:translateY(-1px)}
  .product:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(0,0,0,.17)}
  .product:hover .p-image img{transform:scale(1.025)}
  body[data-family="market"] .market-product:hover{box-shadow:0 18px 42px rgba(18,58,152,.16)}
  .add:hover,.demo-market-plus:hover,.market-primary:hover,.primary:hover{filter:brightness(1.035);transform:translateY(-1px)}
}

/* Press feedback */
button:active,.product:active,.chip:active,.market-primary:active,.primary:active,.secondary:active,.danger:active{transform:scale(.985)}

/* Mobile: preserva duas colunas do mercado, mas respira melhor */
@media(max-width:520px){
  .content{padding-left:12px;padding-right:12px}
  body[data-family="market"] .market-home-shell{box-shadow:0 16px 42px rgba(5,28,86,.18)}
  body[data-family="market"] .market-product{border-radius:16px}
  body[data-family="market"] .market-product .p-image{height:144px}
  body[data-family="market"] .market-product .p-copy{min-height:142px;padding:10px 10px 11px}
  body[data-family="market"] .market-product .p-desc{min-height:25px}
  body[data-family="market"] .market-product-bottom{padding-top:9px}
  .sheet{border-radius:24px 24px 0 0}
}

/* Movimento reduzido */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}