/** Shopify CDN: Minification failed

Line 487:12 Unexpected "{"
Line 487:21 Expected ":"

**/
/* ╔══════════════════════════════════════════════════════════════════════╗
   ║  NOTINO ESPAÑA — CSS PERSONALIZADO MASTER                          ║
   ║  Versão: 4.0 | Mercado: Espanha (EUR)                             ║
   ║  Este ficheiro sobrescreve TODOS os estilos do tema Dawn           ║
   ║  para adaptar ao mercado espanhol COD (Contra Reembolso)           ║
   ║                                                                     ║
   ║  ÍNDICE:                                                           ║
   ║  1. VARIÁVEIS GLOBAIS                                              ║
   ║  2. PREÇOS (Verde + Tachado + Badge -XX%)                         ║
   ║  3. PÁGINA DE PRODUTO (Mobile-first)                              ║
   ║  4. BOTÃO COMPRAR (Verde COD)                                     ║
   ║  5. CARDS DE COLEÇÃO                                               ║
   ║  6. CART DRAWER (Carrinho lateral)                                 ║
   ║  7. CRONÓMETRO DE OFERTA                                          ║
   ║  8. BADGES E TRUST                                                 ║
   ║  9. MOBILE — Otimizações gerais                                   ║
   ╚══════════════════════════════════════════════════════════════════════╝ */


/* ══════════════════════════════════════════
   1. VARIÁVEIS GLOBAIS
   Cores e tamanhos base usados em todo o site
   ══════════════════════════════════════════ */
:root {
  --notino-green: #1B7A1B;
  --notino-green-dark: #145a14;
  --notino-green-light: #2e7d32;
  --notino-green-bg: #f0faf0;
  --notino-red: #c62828;
  --notino-red-dark: #b71c1c;
  --notino-gold: #ffd54f;
  --notino-gray: #666;
  --notino-gray-light: #999;
  --notino-border: #eee;
  --notino-radius: 8px;
  --notino-shadow: 0 2px 8px rgba(0,0,0,.08);
}


/* ══════════════════════════════════════════
   2. PREÇOS — Verde escuro em TODO o site
   NOTA: Usa !important porque o tema Dawn
   aplica color:rgb(var(--color-foreground))
   que sobrescreve estilos normais.
   ══════════════════════════════════════════ */

/* --- Preço atual (normal e em promoção) --- */
.price-item--sale,
.price-item--sale.price-item--last,
.price-item--regular,
.price .price-item,
.price__sale .price-item--sale,
.price__regular .price-item--regular {
  color: var(--notino-green) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

/* --- Preço grande na página de produto --- */
.price--large .price-item--sale,
.price--large .price-item--regular,
.price--large .price-item {
  font-size: 2rem !important;
  font-weight: 800 !important;
  color: var(--notino-green) !important;
}

/* --- Preço tachado (compare_at_price) — CINZA em TODAS as páginas --- */
.price--on-sale .price-item--regular,
.price__sale s.price-item--regular,
s.price-item,
s.price-item--regular,
.price s,
.card-information s,
.price__regular s {
  color: #999 !important;
  font-weight: 400 !important;
  font-size: 1.2rem !important;
  text-decoration: line-through !important;
  opacity: 1 !important;
}

/* --- Preço tachado grande (produto) --- */
.price--large.price--on-sale .price-item--regular,
.price--large s.price-item--regular {
  font-size: 1.3rem !important;
  color: #999 !important;
  opacity: 1 !important;
}

/* --- Badge "-XX%" VERDE — inline com preço --- */
.badge.price__badge-sale,
.badge.color-scheme-4 {
  background: #1B7A1B !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  padding: 0.2rem 0.6rem !important;
  border-radius: 4px !important;
  border: none !important;
  letter-spacing: .3px !important;
  vertical-align: middle !important;
  display: inline-block !important;
  margin-left: 4px !important;
  line-height: 1.4 !important;
}
/* Preço container: flex inline para manter tudo na mesma linha */
.price__container {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}
.price--show-badge {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

/* --- Badge "Agotado" --- */
.badge.price__badge-sold-out {
  background: #555 !important;
  color: #fff !important;
  font-weight: 600 !important;
  border: none !important;
}

/* --- Ocultar texto de impostos/envio abaixo do preço --- */
.product__tax {
  display: none !important;
}

/* --- Preço unitário --- */
.unit-price {
  color: var(--notino-gray) !important;
  font-size: 1.05rem !important;
}


/* ══════════════════════════════════════════
   3. PÁGINA DE PRODUTO — Mobile-first
   Espaçamento, fontes, e layout otimizado
   para ecrãs pequenos (320px–480px)
   ══════════════════════════════════════════ */

/* --- Título do produto mais compacto --- */
.product__title h1,
.product__title {
  font-size: 2rem !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 2px !important;
}

/* --- Estrelas: espaçamento compacto em TODAS as páginas --- */
.product-stars-rating {
  margin: 2px 0 4px !important;
  padding: 0 !important;
  line-height: 1.3 !important;
}
/* Cards (coleção/home) */
.card-information .product-stars-rating {
  margin: 1px 0 2px !important;
}

/* --- Vendor/marca menor --- */
.product__text.caption-with-letter-spacing {
  font-size: 1.1rem !important;
  letter-spacing: .08em !important;
  color: var(--notino-gray) !important;
  margin-bottom: 2px !important;
  text-transform: uppercase !important;
}

/* --- Selector de variante (capacidade, cor, etc.) --- */
.product-form__input .form__label,
fieldset.product-form__input legend {
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  color: #333 !important;
  margin-bottom: 4px !important;
}

/* --- Botões de variante mais touch-friendly --- */
.product-form__input input[type="radio"] + label {
  min-height: 40px !important;
  padding: 8px 16px !important;
  font-size: 1.3rem !important;
  border-radius: 6px !important;
}

/* --- Quantidade: Label e input --- */
.quantity__label,
.product-form__quantity label {
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  color: #333 !important;
}
.quantity__input {
  font-size: 1.4rem !important;
  font-weight: 700 !important;
}
.quantity__button {
  min-width: 40px !important;
  min-height: 40px !important;
}

/* --- Reduzir espaço entre blocos no produto --- */
@media screen and (max-width: 749px) {
  .product__title h1,
  .product__title {
    font-size: 1.8rem !important;
    margin-bottom: 1px !important;
  }
  .product__info-wrapper {
    padding: 0 1.5rem !important;
  }
  .product__info-container > *:not(:last-child) {
    margin-bottom: 0.8rem !important;
  }
  .product__info-container > .product-form {
    margin-bottom: 0.5rem !important;
  }
  /* Preço grande mobile */
  .price--large .price-item--sale,
  .price--large .price-item--regular,
  .price--large .price-item {
    font-size: 2rem !important;
  }
  .price--large.price--on-sale .price-item--regular {
    font-size: 1.3rem !important;
  }
}


/* ══════════════════════════════════════════
   4. BOTÃO COMPRAR — Verde COD
   Gradiente verde com texto em maiúsculas
   "AÑADIR AL CARRITO" ou "PAGO CONTRA REEMBOLSO"
   ══════════════════════════════════════════ */

/* --- Botão principal (Añadir al carrito) --- */
.product-form__submit,
.product-form__submit.button--primary,
.product-form__submit.button--secondary {
  background: linear-gradient(180deg, #43a047, #2e7d32) !important;
  color: #fff !important;
  border: none !important;
  font-weight: 800 !important;
  font-size: 1.5rem !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  border-radius: var(--notino-radius) !important;
  padding: 14px 20px !important;
  min-height: 52px !important;
  box-shadow: 0 4px 15px rgba(46,125,50,.3) !important;
  transition: all .2s ease !important;
}
.product-form__submit:hover {
  background: linear-gradient(180deg, #388e3c, #1b5e20) !important;
  box-shadow: 0 6px 20px rgba(46,125,50,.4) !important;
  transform: translateY(-1px) !important;
}
.product-form__submit[disabled] {
  background: #bbb !important;
  box-shadow: none !important;
  transform: none !important;
}

/* --- Botão "Comprar ahora" (Shopify Payments / dinâmico) --- */
.shopify-payment-button__button {
  border-radius: var(--notino-radius) !important;
  min-height: 50px !important;
  font-size: 1.4rem !important;
}
.shopify-payment-button__button--unbranded {
  background: #333 !important;
  color: #fff !important;
  font-weight: 700 !important;
}

/* --- Mobile: botões tocáveis (mínimo 48px) --- */
@media screen and (max-width: 749px) {
  .product-form__submit {
    font-size: 1.4rem !important;
    padding: 16px 20px !important;
    min-height: 54px !important;
  }
}


/* ══════════════════════════════════════════
   5. CARDS DE COLEÇÃO
   Preços verdes e layout compacto nos cards
   de produto em páginas de coleção
   ══════════════════════════════════════════ */

/* --- Preço nos cards (só preço de venda = verde) --- */
.card-information .price .price-item--sale,
.card-information .price__regular .price-item--regular,
.card-information .price .price-item--last {
  color: var(--notino-green) !important;
  font-weight: 700 !important;
}
/* --- Preço tachado nos cards = CINZA --- */
.card-information .price--on-sale .price-item--regular,
.card-information .price s,
.card-information .price s.price-item,
.card-information .price s.price-item--regular,
.card-information s {
  color: #999 !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
  opacity: 1 !important;
}

/* --- Badge nos cards (canto) --- */
.card__badge .badge {
  font-size: 1rem !important;
  padding: 0.3rem 0.7rem !important;
  border-radius: 4px !important;
}

/* --- Título do card --- */
.card__heading a,
.full-unstyled-link {
  font-size: 1.3rem !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
}

/* --- Mobile cards: mais compactos --- */
@media screen and (max-width: 749px) {
  .card__heading a,
  .full-unstyled-link {
    font-size: 1.2rem !important;
  }
  .card-information .price .price-item--sale,
  .card-information .price__regular .price-item--regular,
  .card-information .price .price-item--last {
    font-size: 1.3rem !important;
  }
}


/* ══════════════════════════════════════════
   6. CART DRAWER — Estilos do carrinho
   Já incluídos inline no cart-drawer.liquid
   mas aqui ficam os overrides globais que
   precisam aplicar mesmo após refresh AJAX
   ══════════════════════════════════════════ */

/* --- Drawer: esconder tabela headers --- */
cart-drawer thead {
  display: none !important;
}
cart-drawer th {
  display: none !important;
}
cart-drawer .cart-item__totals {
  display: none !important;
}
cart-drawer .cart-item__quantity {
  display: none !important;
}

/* --- Drawer: botão checkout verde --- */
cart-drawer .cart__checkout-button,
.cart__checkout-button {
  background: linear-gradient(180deg, #43a047, #2e7d32) !important;
  color: #fff !important;
  border: none !important;
  font-weight: 800 !important;
  font-size: 1.5rem !important;
  border-radius: var(--notino-radius) !important;
  padding: 14px 20px !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  box-shadow: 0 4px 15px rgba(46,125,50,.3) !important;
}
cart-drawer .cart__checkout-button:hover {
  background: linear-gradient(180deg, #388e3c, #1b5e20) !important;
}

/* --- Drawer: preços verdes --- */
.cd-price-current {
  color: var(--notino-green) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}
.cd-price-old {
  color: var(--notino-gray-light) !important;
  font-size: 12px !important;
  text-decoration: line-through !important;
}
.cd-price-badge {
  background: var(--notino-red) !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
}

/* --- Drawer: card ahorro verde --- */
.cd-total-saved {
  text-align: center !important;
  font-size: 12px !important;
  color: #fff !important;
  font-weight: 700 !important;
  padding: 10px 15px !important;
  margin: 0 0 14px !important;
  background: linear-gradient(135deg, #2e7d32, #43a047) !important;
  border-radius: var(--notino-radius) !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(46,125,50,.25) !important;
}

/* --- Drawer: remover TODOS os borders do footer --- */
cart-drawer .drawer__footer,
cart-drawer .drawer__footer *,
cart-drawer .cart-drawer__footer,
.drawer__footer,
.cart-drawer__footer {
  border: none !important;
  box-shadow: none !important;
}

/* --- Drawer: ocultar totais e notas fiscais originais --- */
cart-drawer .tax-note {
  display: none !important;
}
cart-drawer .totals {
  display: none !important;
}


/* ══════════════════════════════════════════
   7. CRONÓMETRO DE OFERTA
   Barra acima do header com countdown
   ══════════════════════════════════════════ */
#cb-bar {
  background: #fff !important;
  color: #000 !important;
  font-family: inherit !important;
  z-index: 999 !important;
  position: relative !important;
}

/* --- Mobile: cronómetro mais compacto --- */
@media screen and (max-width: 749px) {
  #cb-bar {
    padding: 5px 12px !important;
    gap: 6px !important;
  }
  #cb-bar span:first-child {
    font-size: 11px !important;
  }
  #cb-d, #cb-h, #cb-m, #cb-s {
    font-size: 18px !important;
  }
}


/* ══════════════════════════════════════════
   8. BADGES
   Badge de desconto -XX% VERDE
   ══════════════════════════════════════════ */

/* --- Badge -XX% verde (já definido acima, backup) --- */


/* ══════════════════════════════════════════
   9. MOBILE — Otimizações gerais
   Spacing, touch targets, fontes, scroll
   ══════════════════════════════════════════ */

@media screen and (max-width: 749px) {
  /* Espaçamento mais apertado entre secções */
  .section-{{ section.id }}-padding,
  .shopify-section {
    --padding-top: 20px;
    --padding-bottom: 20px;
  }

  /* Imagem de produto: sem overflow desnecessário */
  .product__media-wrapper {
    margin-bottom: 0 !important;
  }

  /* Tabs/accordions mais tocáveis */
  .product__accordion summary {
    min-height: 44px !important;
    padding: 12px 0 !important;
  }

  /* Inputs: mínimo 44px para touch */
  input, select, textarea, button {
    min-height: 44px;
  }

  /* Links: maior área de toque */
  .cart-item__name {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }

  /* Drawer: full width em mobile */
  .drawer__inner {
    max-width: 100vw !important;
    width: 100vw !important;
  }

  /* Announcement bar compacto */
  .announcement-bar {
    padding: 8px 12px !important;
  }
  .announcement-bar__message {
    font-size: 11px !important;
  }
}

/* Touch target mínimo 44x44px em todo o site */
@media (pointer: coarse) {
  a, button, [role="button"], input[type="submit"], input[type="button"] {
    min-height: 44px;
    min-width: 44px;
  }
}

/* Prevenir zoom inesperado em iOS com inputs */
@media screen and (max-width: 749px) {
  input[type="text"],
  input[type="email"],
  input[type="number"],
  input[type="tel"],
  input[type="password"],
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* Smooth scroll global */
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

/* Otimizar rendering de imagens */
img {
  content-visibility: auto;
}

/* Unit price - inside price block */
.nt-unit-price{font-size:13px;color:#888;font-weight:400;margin:2px 0 0;padding:0}
@media(max-width:749px){.nt-unit-price{font-size:12px}}


/* ══════════════════════════════════════════
   10. ESTRELAS TRUSTPILOT + ESPAÇAMENTO
   ══════════════════════════════════════════ */

/* ── A) CARDS: eliminar TODO gap extra ── */
.card--standard > .card__content .card__information,
.card__information {
  padding: 6px 0 8px !important;
}
.card__information .card__heading {
  margin: 0 !important;
  padding: 0 !important;
}
.card__information .card__heading.h5 {
  margin: 0 !important;
}
.tp-stars-sm {
  margin: 1px 0 0 !important;
  padding: 0 !important;
}
.card__information .card-information {
  margin: 1px 0 0 !important;
  padding: 0 !important;
}
/* Price inside cards: remove default margins */
.card-information .price {
  margin: 0 !important;
  line-height: 1.2 !important;
}
.card-information .price .price-item {
  margin: 0 4px 0 0 !important;
}

/* Tamanhos preço nos cards */
.card-information .price .price-item--sale,
.card-information .price__regular .price-item--regular,
.card-information .price .price-item,
.card-information .price .price-item--last {
  font-size: 1.4rem !important;
  font-weight: 700 !important;
}
.card-information .price--on-sale .price-item--regular,
.card-information .price s.price-item--regular,
.card-information s.price-item {
  font-size: 1.15rem !important;
}

/* ── B) PRODUTO ── */
.product__title {
  margin-bottom: 0 !important;
}
.tp-stars {
  margin: 1px 0 2px !important;
}

/* ── C) MOBILE ── */
@media screen and (max-width: 749px) {
  .card__information {
    padding: 4px 0 6px !important;
  }
  .card-information .price .price-item--sale,
  .card-information .price__regular .price-item--regular,
  .card-information .price .price-item,
  .card-information .price .price-item--last {
    font-size: 1.3rem !important;
  }
  .card-information .price--on-sale .price-item--regular,
  .card-information .price s.price-item--regular,
  .card-information s.price-item {
    font-size: 1.05rem !important;
  }
  .card__heading a,
  .card__heading .full-unstyled-link {
    font-size: 1.1rem !important;
    line-height: 1.25 !important;
  }
}

/* ── D) TABLET ── */
@media screen and (min-width: 750px) and (max-width: 1024px) {
  .card__information {
    padding: 5px 0 7px !important;
  }
}