/* Visual Arte Nerd sobre as páginas da Reserva INK (produto, conta, carrinho e checkout).
   Escopo: body.an-skin. As classes da Reserva vêm do Tailwind dela; as cores usam as variáveis do tema. */

body.an-skin {
  --color-primary: #171a14;
  --color-font: #ffffff;
  --color-button: #171a14;
  --color-button-font: #ffffff;
  font-family: 'DM Sans', system-ui, sans-serif;
  color: #171a14;
  background: #ffffff;
}
body.an-skin.font-poppins, body.an-skin .font-poppins { font-family: 'DM Sans', system-ui, sans-serif; }
body.an-skin h1, body.an-skin h2, body.an-skin h3 { font-family: 'Space Grotesk', system-ui, sans-serif; letter-spacing: -.03em; }

/* Cabeçalho e rodapé da Reserva dão lugar aos nossos. O carrinho lateral dela continua funcionando. */
body.an-skin:not(.an-checkout) header.header,
body.an-skin:not(.an-checkout) footer.footer { display: none !important; }
body.an-skin .an-chrome .site-header { z-index: 45; }
/* Algumas páginas da Reserva forçam Poppins e tamanhos de título com !important; o nosso cabeçalho/rodapé e conteúdo resistem. */
body.an-skin :is(.an-chrome, main#conteudo) :is(a, label, p, span, nav, li, button, input, div, dt, dd, summary, strong, del, kbd) { font-family: 'DM Sans', system-ui, sans-serif !important; }
body.an-skin :is(.an-chrome, main#conteudo) :is(h1, h2, h3) { font-family: 'Space Grotesk', system-ui, sans-serif !important; color: inherit; font-style: normal !important; }
body.an-skin :is(.an-chrome, main#conteudo) .universe-title { font-family: 'Space Grotesk', system-ui, sans-serif !important; }
body.an-skin :is(.an-chrome, main#conteudo) .container { max-width: none !important; width: min(100% - var(--gutter) * 2, var(--container)) !important; padding-inline: 0 !important; }
body.an-skin .an-chrome a { text-decoration: none; }

/* Página de produto */
body.an-skin .details-product { max-width: 108rem; margin-inline: auto; }
body.an-skin .container.m-auto { width: min(100% - clamp(1rem, 3.2vw, 3rem) * 2, 108rem) !important; max-width: none !important; padding-inline: 0 !important; }
body.an-skin .details-product h1,
body.an-skin .section-details h1 { font-size: clamp(2rem, 3.4vw, 2.9rem) !important; font-weight: 600 !important; line-height: 1.05 !important; letter-spacing: -.04em; }
body.an-skin .section-details .text-4xl { font-family: 'DM Sans', sans-serif; font-weight: 700 !important; font-size: 1.9rem !important; letter-spacing: -.02em; color: #171a14 !important; }
body.an-skin .section-details .text-green-500,
body.an-skin .section-details .text-green-600,
body.an-skin .section-details .lg\:text-green-600 { color: #66695f !important; }
body.an-skin .section-details .text-blue-600,
body.an-skin .section-details a { color: #171a14; }
body.an-skin .form-product-options span.font-semibold,
body.an-skin .form-product-options legend,
body.an-skin .section-details .text-base.font-semibold { font-size: .72rem !important; font-weight: 600 !important; letter-spacing: .18em; text-transform: uppercase; color: #66695f !important; }

/* Opções (modelo, tamanho, "também disponível em"): quadradas, no estilo dos filtros da vitrine */
body.an-skin .form-product-options label:not(:has(input[name="color"])),
body.an-skin .section-details button.border { border-radius: 0 !important; }
body.an-skin .form-product-options input:checked + label,
body.an-skin .form-product-options label:has(input:checked):not(:has(input[name="color"])):not([for*="-color-"]) { background: #171a14 !important; color: #c3dd2a !important; border-color: #171a14 !important; }

/* Botão principal: verde-limão, quadrado, como no design */
body.an-skin .form-product-options__add-to-cart button,
body.an-skin .form-product-options__add-to-cart-mobile button,
body.an-skin .bg-store-button {
  background: #c3dd2a !important;
  color: #171a14 !important;
  border-radius: 0 !important;
  font-weight: 600 !important;
  min-height: 3.4rem;
}
body.an-skin .form-product-options__add-to-cart button:hover,
body.an-skin .bg-store-button:hover { background: #afc824 !important; box-shadow: none !important; }
body.an-skin .form-product-options__add-to-cart .text-green-600,
body.an-skin .form-product-options__add-to-cart .text-green-500 { color: #171a14 !important; font-weight: 600; }

/* Quantidade e campos */
body.an-skin .form-product-options .rounded-full:not(:has(input[name="color"])):not([class*="w-9"]) { border-radius: 0 !important; }
body.an-skin input[type="text"], body.an-skin input[type="email"], body.an-skin input[type="tel"],
body.an-skin input[type="number"], body.an-skin input[type="search"], body.an-skin select { border-radius: 0 !important; }

/* Cards de recomendação da Reserva no mesmo tom dos nossos */
body.an-skin .card-thumb img { background: #e9e9e7; }
body.an-skin .card-thumb { font-family: 'DM Sans', sans-serif; }
body.an-skin .card-thumb .rounded-lg, body.an-skin .card-thumb .rounded-md { border-radius: 0 !important; }

/* Carrinho lateral */
body.an-skin .cart-drawer { font-family: 'DM Sans', sans-serif; }
body.an-skin .cart-drawer__header, body.an-skin .cart-drawer__header * { background-color: #171a14 !important; color: #ffffff !important; }
body.an-skin .cart-drawer .rounded-lg, body.an-skin .cart-drawer .rounded-md, body.an-skin .cart-drawer button { border-radius: 0 !important; }
body.an-skin #checkout-btn { background: #c3dd2a !important; color: #171a14 !important; font-weight: 700 !important; letter-spacing: .01em; }
body.an-skin #checkout-btn:hover { background: #afc824 !important; }

/* Aviso de cookies e ajuda */
body.an-skin .cookie-acceptance { border-radius: 0 !important; font-family: 'DM Sans', sans-serif; }
body.an-skin .cookie-acceptance button { background: #171a14 !important; color: #ffffff !important; border-radius: 0 !important; }

/* Checkout: só estilo, sem trocar estrutura nem scripts */
body.an-checkout header, body.an-checkout .bg-black { background: #171a14 !important; }
body.an-checkout h1, body.an-checkout h2 { font-family: 'Space Grotesk', sans-serif !important; letter-spacing: -.03em; }
body.an-skin.an-checkout input, body.an-skin.an-checkout select, body.an-skin.an-checkout textarea { border-radius: 0 !important; background-color: #ffffff !important; border-color: #c9cbc2 !important; }
body.an-checkout input:focus, body.an-checkout select:focus { border-color: #171a14 !important; box-shadow: 0 0 0 1px #171a14 !important; outline: none !important; }
body.an-checkout button[type="submit"], body.an-checkout .bg-green-600, body.an-checkout .bg-green-500, body.an-checkout .bg-emerald-600 {
  background: #c3dd2a !important; color: #171a14 !important; border-radius: 0 !important; font-weight: 700 !important;
}
body.an-checkout button[type="submit"]:hover { background: #afc824 !important; }
body.an-checkout .bg-gray-100, body.an-checkout .bg-gray-50 { background: #f6f5f0 !important; }
body.an-checkout .rounded-lg, body.an-checkout .rounded-md, body.an-checkout .rounded-full:not(.w-5):not(.w-6) { border-radius: 0 !important; }

/* Login e cadastro (páginas sem cabeçalho): mesmo tratamento do checkout */
body.an-minimal { background: #f6f5f0 !important; }
body.an-minimal .bg-white.rounded-lg, body.an-minimal .shadow, body.an-minimal .rounded-xl { border-radius: 0 !important; }
body.an-skin.an-minimal button, body.an-skin.an-minimal input[type="submit"], body.an-skin.an-minimal .bg-gray-900, body.an-skin.an-minimal .bg-black {
  background: #c3dd2a !important; color: #171a14 !important; border-radius: 0 !important; font-weight: 700 !important;
}
body.an-skin.an-minimal button *, body.an-skin.an-checkout button[type="submit"] * { color: #171a14 !important; }
body.an-skin.an-minimal button:disabled { opacity: .55; }
body.an-skin.an-minimal a.text-gray-900, body.an-skin.an-minimal a:has(svg) { background: none !important; color: #171a14 !important; }

/* Página de rastreio: ilustração própria */
body.an-skin img[src^="/_an/img/rastreio.svg"] { width: min(100%, 34rem) !important; max-width: none !important; max-height: none !important; height: auto !important; margin-top: 1rem; }
body.an-skin:has(img[src^="/_an/img/rastreio.svg"]) h1 { font-size: clamp(2.2rem, 4vw, 3.6rem) !important; line-height: 1.05 !important; font-weight: 600 !important; }
body.an-skin:has(img[src^="/_an/img/rastreio.svg"]) form { border-radius: 0 !important; }
body.an-skin:has(img[src^="/_an/img/rastreio.svg"]) .rounded-lg, body.an-skin:has(img[src^="/_an/img/rastreio.svg"]) .rounded-xl { border-radius: 0 !important; }
body.an-skin:has(img[src^="/_an/img/rastreio.svg"]) input[type="submit"].bg-black { background: #c3dd2a !important; color: #171a14 !important; border-radius: 0 !important; font-weight: 700 !important; }

/* O nosso botão de WhatsApp substitui o botão "Ajuda?" da Reserva */
body.an-skin:not(.an-checkout) [data-controller="ink-store--help-button"] { display: none !important; }
/* Na página de produto do celular, o botão sobe acima da barra fixa de "Adicionar ao carrinho" */
@media (max-width: 1023px) {
  body.an-skin:has(.form-product-options__add-to-cart-mobile) .whatsapp-float { bottom: 5.6rem; }
}

/* Títulos pequenos do rodapé ficam em DM Sans, como no restante do design */
body.an-skin :is(.an-chrome, main#conteudo) .site-footer h2 { font-family: 'DM Sans', system-ui, sans-serif !important; letter-spacing: .2em; }

/* Link de acessibilidade: só aparece ao navegar pelo teclado (a Reserva sobrescrevia o deslocamento) */
body.an-skin .an-chrome .skip-link { position: fixed !important; top: .5rem !important; left: .5rem !important; z-index: 99 !important; transform: translateY(-200%) !important; }
body.an-skin .an-chrome .skip-link:focus { transform: none !important; }

/* Avaliações (página da loja e página de produto): estrelas e barras verdes, conteúdo afastado da borda */
body.an-skin :is(.text-yellow-300, .text-yellow-400, .text-yellow-500) { color: #a6c21d !important; }
body.an-skin :is(.bg-yellow-300, .bg-yellow-400, .bg-yellow-500) { background-color: #a6c21d !important; }
body.an-skin :is(.fill-yellow-300, .fill-yellow-400) { fill: #a6c21d !important; }
body.an-skin turbo-frame#store_reviews_frame { display: block; width: min(100% - 2.5rem, 64rem) !important; margin: 2.5rem auto 4rem !important; }
body.an-skin svg[id^="star-"] stop[stop-color="#FACA15"], body.an-skin svg stop[stop-color="#FACA15"] { stop-color: #a6c21d !important; }
body.an-skin svg path[fill="#FACA15"], body.an-skin svg path[fill="#FACC15"], body.an-skin svg path[fill="#FFC107"] { fill: #a6c21d !important; }
/* Estrelas da página de produto: desenhadas por script (imagem amarela); o filtro leva o amarelo para o verde da marca */
body.an-skin #rater, body.an-skin [id^="rater"], body.an-skin .star-rating { filter: hue-rotate(28deg) saturate(1.15) brightness(.9); }

/* Checkout: barra verde de vantagens (mesma das outras páginas; o checkout não carrega styles.css) */
body.an-checkout .announcement { background: #c3dd2a; color: #171a14; font: 600 .8rem/1.2 'DM Sans', system-ui, sans-serif; }
body.an-checkout .announcement ul { display: grid; margin: 0; padding: 0; list-style: none; text-align: center; }
body.an-checkout .announcement li { grid-area: 1 / 1; padding: .55rem 1rem; opacity: 0; animation: an-ck-fade 12s infinite; }
body.an-checkout .announcement li:nth-child(2) { animation-delay: 4s; }
body.an-checkout .announcement li:nth-child(3) { animation-delay: 8s; }
@keyframes an-ck-fade { 0%, 30% { opacity: 1; } 34%, 100% { opacity: 0; } }
@media (min-width: 768px) {
  body.an-checkout .announcement ul { display: flex; justify-content: center; gap: 3rem; }
  body.an-checkout .announcement li { opacity: 1; animation: none; padding-inline: 0; }
}
@media (prefers-reduced-motion: reduce) { body.an-checkout .announcement li { animation: none; } body.an-checkout .announcement li:first-child { opacity: 1; } }
/* Checkout: some a barra preta de benefícios da Reserva; fica só a nossa, fixa no topo */
body.an-checkout .header-benefits { display: none !important; }
body.an-checkout > .announcement { position: sticky; top: 0; z-index: 60; }

/* ===== Visual novo nas páginas da Reserva (produto, avaliações, conta, checkout) ===== */
body.an-skin :is(h1, h2, h3, h4, h5):not(.an-chrome *) { font-family: 'Space Grotesk', system-ui, sans-serif !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: -.03em; color: #171a14; }
body.an-skin .details-product h1, body.an-skin .section-details h1, body.an-skin h1[data-ink-labs-anchor="product_title"] { font-weight: 700 !important; letter-spacing: -.035em !important; line-height: .98 !important; }
body.an-skin h5.text-xl { font-size: clamp(1.6rem, 4vw, 2.4rem) !important; line-height: 1 !important; margin-bottom: .5rem; }
/* Cards de recomendação ("Você também vai gostar", "Visto recentemente") iguais aos da vitrine */
body.an-skin .card-thumb__infos { align-items: flex-start !important; text-align: left !important; padding-top: .9rem; }
body.an-skin .card-thumb__title { font-family: 'DM Sans', system-ui, sans-serif !important; font-size: .92rem !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .01em !important; text-shadow: none !important; color: #171a14 !important; text-align: left !important; }
body.an-skin .card-thumb__details-v2, body.an-skin .card-thumb__prices-v2, body.an-skin .card-thumb__parcial-price { text-align: left !important; justify-content: flex-start !important; align-items: flex-start !important; }
body.an-skin .card-thumb__prices-v2 { font-weight: 700 !important; color: #171a14 !important; }
body.an-skin .card-thumb__parcial-price { color: #66695f !important; font-size: .8rem !important; }
body.an-skin .card-thumb img { border-radius: 0 !important; }
body.an-skin .card-thumb__title { display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.2 !important; }
@media (max-width: 767px) {
  body.an-skin .card-thumb__title { font-size: .72rem !important; letter-spacing: 0 !important; }
  body.an-skin .card-thumb__prices-v2 { font-size: .8rem !important; }
  body.an-skin .card-thumb__parcial-price { font-size: .68rem !important; }
}

/* Cor na página de produto: bolinha sem fundo; a escolhida ganha um anel verde (igual à personalização) */
body.an-skin .form-product-options__select-type-colors { gap: .9rem; padding: 6px; margin-left: -6px; }
body.an-skin .form-product-options__select-type-colors-item label,
body.an-skin .form-product-options__select-type-colors-item input:checked + label { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; border-radius: 50% !important; }
body.an-skin .form-product-options__select-type-colors-item label > span { width: 2.4rem !important; height: 2.4rem !important; border: 1px solid #c9cbc2; box-shadow: none !important; }
body.an-skin .form-product-options__select-type-colors-item input:checked + label > span { outline: 3px solid #a6c21d; outline-offset: 3px; }
body.an-skin .form-product-options__select-type-colors-item input:focus-visible + label > span { outline: 2px solid #171a14; outline-offset: 3px; }