/* Melhorias de navegação e checkout das lojas. */
@media (max-width: 767.98px) {
  .loja-header .loja-header-row { display: flex; flex-wrap: wrap; padding: 10px 0; gap: 10px; }
  .loja-header .loja-brand { max-width: calc(100% - 108px); flex: 1 1 auto; }
  .loja-header .loja-header-actions { margin-left: auto; }
  .loja-header .loja-header-row > form { order: 3; flex: 1 0 100%; width: 100%; }
  .loja-header input[type="search"] { height: 44px; font-size: 16px; }
  .loja-header-actions a { min-width: 44px; min-height: 44px; }
  .loja-checkout input, .loja-checkout select, .loja-checkout textarea { font-size: 16px; scroll-margin-top: 150px; }
  .loja-checkout-summary { position: static !important; }
  .loja-checkout-grid { display: flex !important; flex-direction: column; }
  .loja-checkout-form-panel { order: 1; padding: 20px; }
  .loja-checkout-summary-panel { order: 2; }
  .loja-checkout-confirm-panel { order: 3; }
  .loja-checkout-submit { min-height: 52px; width: 100%; border-radius: 12px; padding: 14px 20px; }
}
.loja-checkout [aria-invalid="true"] { border-color: #dc2626; outline: 2px solid #fee2e2; }
.loja-cart-photo { width: 64px; height: 64px; flex: 0 0 64px; object-fit: contain; background: white; border-radius: 8px; }
.loja-cart-product-heading { display: flex; gap: 12px; align-items: center; min-width: 0; }
.loja-cart-product-heading h2 { flex: 1; }
.loja-checkout-submit { cursor: pointer; }
.loja-checkout-submit:disabled { opacity: .6; cursor: wait; }
@media (min-width: 768px) { .loja-checkout-submit { margin-top: 16px; } }

@media (min-width: 1024px) {
  .loja-checkout .loja-checkout-grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); column-gap: 24px; row-gap: 0; align-items: stretch; }
  .loja-checkout .loja-checkout-form-panel { grid-column: 1; grid-row: 1; border-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
  .loja-checkout .loja-checkout-confirm-panel { grid-column: 1; grid-row: 2; background: white; padding: 0 24px 24px; border: 1px solid #f3f4f6; border-top: 0; border-radius: 0 0 12px 12px; }
  .loja-checkout .loja-checkout-summary-panel { grid-column: 2; grid-row: 1 / span 2; min-width: 0; }
  .loja-checkout .loja-checkout-summary { position: sticky; top: 100px; max-height: calc(100vh - 116px); overflow-y: auto; }
  .loja-checkout .loja-checkout-submit { width: 100%; min-height: 52px; border-radius: 12px; }
}
/* Cabeçalho igual em todas as páginas das duas vitrines. */
.loja-header { font-family: Arial, Helvetica, sans-serif; position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid #e5e7eb; }
.loja-header > div { max-width: 1200px; margin: auto; padding: 0 16px; }
.loja-header .loja-header-row { display: flex; align-items: center; gap: 16px; padding: 12px 0; }
.loja-header .loja-brand { display: flex; align-items: center; flex: 0 0 auto; min-width: 0; color: #172033; text-decoration: none; }
.loja-header .loja-header-row > form { flex: 1; min-width: 0; }
.loja-header input[type="search"] { box-sizing: border-box; display: block; width: 100%; height: 44px; padding: 10px 12px 10px 38px; border: 1px solid #dfe3e8; border-radius: 24px; background: #f8fafc; font-size: 14px; }
.loja-header .loja-header-actions { display: flex; align-items: center; gap: 10px; }
.loja-header .loja-header-actions > a { box-sizing: border-box; display: flex !important; align-items: center; justify-content: center; flex: 0 0 44px; width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; max-width: 44px; max-height: 44px; padding: 0 !important; border-radius: 50%; background: #059669; color: #fff; position: relative; text-decoration: none; }
.loja-header .loja-header-actions svg { width: 20px !important; height: 20px !important; flex: 0 0 20px; }
.loja-header #loja-carrinho-badge:not(:empty) { position: absolute; right: -4px; top: -4px; display: flex !important; align-items: center; justify-content: center; box-sizing: border-box; min-height: 20px !important; height: 20px !important; min-width: 20px; width: auto; padding: 0 4px; background: #dc2626; color: #fff; border-radius: 12px; font-size: 11px; line-height: 18px; }
.loja-header #loja-carrinho-badge:empty { display: none; }
/* Checkout completo com CSS local, inclusive os estados ocultos do formulário. */
body.loja-checkout { margin: 0; font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 1.5; color: #172033; background: #f5f7fa; min-height: 100vh; }
.loja-checkout *, .loja-checkout *::before, .loja-checkout *::after { box-sizing: border-box; }
.loja-checkout .hidden { display: none !important; }
.loja-checkout a { text-decoration: none; }
.loja-checkout-main { max-width: 1152px; margin: auto; padding: 24px 16px 40px; }
.loja-checkout-main > h1 { font-size: 26px; line-height: 1.25; margin: 0 0 24px; font-weight: 700; }
.loja-checkout h2 { font-size: 18px; margin: 0 0 16px; line-height: 1.3; }
.loja-checkout .loja-checkout-grid { display: grid; gap: 20px; }
.loja-checkout .loja-checkout-form-panel, .loja-checkout .loja-checkout-summary { min-width: 0; padding: 24px; border: 1px solid #e5e7eb; border-radius: 12px; background: #fff; }
.loja-checkout-login { margin-bottom: 24px; padding: 16px; border: 1px solid #e5e7eb; border-radius: 12px; background: #f8fafc; }
.loja-checkout-login p { margin: 0 0 12px; color: #64748b; }
.loja-checkout .loja-google-login { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 48px; padding: 12px; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff; color: #334155; font-weight: 600; }
.loja-checkout .loja-google-login svg { width: 20px !important; height: 20px !important; flex: 0 0 20px; }
.loja-checkout #checkoutForm > * + * { margin-top: 16px; }
.loja-checkout #checkoutForm > h2:not(:first-child) { padding-top: 12px; }
.loja-checkout #checkoutForm label:not(:has(input[type="radio"])) { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 600; }
.loja-checkout #checkoutForm input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]):not([type="file"]), .loja-checkout #checkoutForm select, .loja-checkout #checkoutForm textarea { display: block; width: 100%; min-width: 0; min-height: 44px; border: 1px solid #cbd5e1; border-radius: 8px; padding: 10px 12px; background: #fff; font: inherit; font-size: 16px; color: #172033; }
.loja-checkout textarea { min-height: 88px; resize: vertical; }
.loja-checkout input:focus, .loja-checkout textarea:focus, .loja-checkout select:focus { outline: 2px solid #a7f3d0; border-color: #059669; }
.loja-checkout [class~="grid"] { display: grid; gap: 16px; }
.loja-checkout [class~="grid-cols-2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
.loja-checkout [class~="relative"] { position: relative; }
.loja-checkout #checkoutForm p { font-size: 12px; line-height: 1.5; margin-bottom: 0; }
.loja-checkout #telefoneErro, .loja-checkout #cpfErro, .loja-checkout #emailErro, .loja-checkout #cepErro { color: #b91c1c; margin-top: 6px; }
.loja-checkout #emailMpAviso { color: #92400e; }
.loja-checkout #checkoutForm label:has(input[type="radio"]) { display: flex; align-items: flex-start; gap: 10px; padding: 14px; border: 1px solid #dfe3e8; border-radius: 8px; cursor: pointer; }
.loja-checkout #checkoutForm label:has(input[type="radio"]:checked) { border-color: #059669; background: #ecfdf5; }
.loja-checkout input[type="radio"] { width: 18px; height: 18px; flex: 0 0 18px; margin: 2px 0 0; accent-color: #059669; }
.loja-checkout #checkoutForm [class~="space-y-2"] > * + * { margin-top: 8px; }
.loja-checkout #cardFields { padding: 16px; background: #f8fafc; border: 1px solid #e5e7eb; border-radius: 8px; }
.loja-checkout #cardFields > * + * { margin-top: 12px; }
.loja-checkout .loja-checkout-summary ul { list-style: none; padding: 0; margin: 0 0 16px; max-height: 256px; overflow-y: auto; }
.loja-checkout .loja-checkout-summary li { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; margin-bottom: 12px; }
.loja-checkout .loja-checkout-summary li > span:last-child { white-space: nowrap; font-weight: 600; }
.loja-checkout .loja-checkout-summary > div { padding-top: 16px; margin-top: 16px; border-top: 1px solid #e5e7eb; }
.loja-checkout .loja-checkout-summary > div > div, .loja-checkout .loja-checkout-summary > div:last-child { display: flex; justify-content: space-between; gap: 12px; }
.loja-checkout .loja-checkout-summary > div > div + div { margin-top: 8px; }
.loja-checkout .loja-checkout-summary > div:last-child { font-size: 20px; font-weight: 700; }
.loja-checkout #checkoutTotal { color: #047857; white-space: nowrap; }
.loja-checkout #checkoutTaxaMsg { font-size: 12px; color: #64748b; }
.loja-checkout .loja-checkout-submit { border: 0; background: #059669; color: #fff; font: inherit; font-weight: 700; min-height: 52px; padding: 14px 20px; width: 100%; border-radius: 12px; }
.loja-checkout #cepLoading { position: absolute; right: 12px; top: 12px; width: 20px; height: 20px; border: 2px solid #a7f3d0; border-top-color: #059669; border-radius: 50%; animation: loja-checkout-spin 1s linear infinite; }
@keyframes loja-checkout-spin { to { transform: rotate(360deg); } }
.loja-checkout #modalPix { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0,0,0,.5); }
.loja-checkout #modalPix > div { background: #fff; border-radius: 12px; padding: 24px; width: 100%; max-width: 448px; max-height: calc(100vh - 32px); overflow-y: auto; }
.loja-checkout #modalPix img { max-width: 100%; }
.loja-checkout #modalPix button { padding: 12px; border: 0; border-radius: 8px; width: 100%; margin-top: 16px; cursor: pointer; }
.loja-checkout > footer:not(.bf-footer) { background: #fff; border-top: 1px solid #e5e7eb; padding: 24px 16px; font-size: 12px; color: #64748b; }
@media (max-width:767.98px) {
 .loja-header .loja-header-row { flex-wrap: wrap; gap: 10px; }
 .loja-header .loja-brand { flex: 1; max-width: calc(100% - 108px); }
 .loja-header .loja-header-row > form { order: 3; flex: 1 0 100%; }
 .loja-header input[type="search"] { font-size: 16px; }
 .loja-checkout .loja-checkout-form-panel, .loja-checkout .loja-checkout-summary { padding: 20px; }
}
@media (min-width:640px) {
 .loja-checkout [class~="sm:grid-cols-2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .loja-checkout [class~="sm:grid-cols-3"] { grid-template-columns: repeat(3,minmax(0,1fr)); }
 .loja-checkout [class~="sm:col-span-2"] { grid-column: span 2; }
}
@media (min-width:1024px) {
 .loja-checkout .loja-checkout-grid { grid-template-columns: minmax(0,3fr) minmax(0,2fr); column-gap: 24px; row-gap: 0; }
 .loja-checkout .loja-checkout-form-panel { border-bottom: 0; border-radius: 12px 12px 0 0; }
 .loja-checkout .loja-checkout-confirm-panel { border-color: #e5e7eb; }
}
.loja-checkout-account { display: flex; align-items: center; gap: 12px; padding: 16px; margin-bottom: 24px; border: 1px solid #a7f3d0; border-radius: 12px; background: #ecfdf5; }
.loja-checkout-account > img, .loja-checkout-account > div:first-child:not(:last-child) { width: 44px; height: 44px; min-width: 44px; flex: 0 0 44px; border-radius: 50%; object-fit: cover; }
.loja-checkout-account p { margin: 0; overflow-wrap: anywhere; }
.loja-checkout-account > a { margin-left: auto; color: #64748b; }
