/* LYMPHAE — complemento de estilo do pop-up COD nas versoes IT/ES/PL.
   Carregado DEPOIS de checkout.css: nao substitui nada, so' acrescenta o
   que o pop-up hungaro nao tem (checkbox legal e provincia derivada). */

/* provincia derivada do codigo postal — texto de leitura, nunca campo */
#lymco .lymco__prov {
  color: #3d6b6b; font-weight: 600;
}

/* checkbox legal obrigatorio */
#lymco .lymco__check { margin: 4px 0 14px; }
#lymco .lymco__cbl {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 13.5px; line-height: 1.4; color: #3a5252;
  cursor: pointer; font-weight: 400;
}
#lymco .lymco__cbl input[type="checkbox"] {
  width: 20px; height: 20px; min-width: 20px; margin: 1px 0 0;
  accent-color: #028370; cursor: pointer;
}
#lymco .lymco__cbl a { color: #028370; text-decoration: underline; }
#lymco .lymco__check.is-bad .lymco__cbl input[type="checkbox"] {
  outline: 2px solid #c4372c; outline-offset: 2px; border-radius: 4px;
}
#lymco .lymco__check.is-bad .lymco__err { display: block; }

/* O CTA e' caixa-alta por CSS. Em polones isso transformava "219 zł" em
   "219 ZŁ" — em polones o simbolo da moeda e' minusculo. O texto do botao ja'
   vem em caixa alta do config (LYMPHAE_CO.cta), entao a transformacao do CSS
   deixa de ser necessaria e a moeda fica correta nos tres idiomas. */
#lymco .lymco__go { text-transform: none; }

/* Linha do frete: o checkout.css do pop-up hungaro estiliza .lymco__ship-opt
   (a versao com radio de escolha), mas nunca .lymco__ship-row, que e' o que o
   checkout-intl.js renderiza quando o frete e' unico. Sem display:flex os dois
   spans ficam colados — na tela lia-se "GLS · 2-4 días laborablesGratis", sem
   espaco. Defeito pre-existente do pop-up das 12; aparece igual na pagina.
   Corrigido aqui, no arquivo que so' as 12 carregam. */
#lymco .lymco__ship-row {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 12px; border: 1.5px solid #cfdedb; border-radius: 10px;
  background: #f4f8f7;
}
#lymco .lymco__ship-row .lymco__ship-info { flex: 1 1 auto; }

/* ==========================================================================
   MODO PAGINA — /<cc>/order/
   Mesmo markup e mesmas classes do pop-up; muda so' a moldura. Tudo aqui e'
   escrito com #lymco.lymco--pagina para NAO tocar em nenhuma regra do pop-up:
   a versao HU carrega checkout.css e nunca este arquivo, e as 12 versoes
   continuam com o pop-up disponivel em qualquer pagina que nao seja a /order/.
   ========================================================================== */
#lymco.lymco--pagina {
  position: static; inset: auto; z-index: auto; display: block;
}
#lymco.lymco--pagina .lymco__panel {
  position: static; left: auto; top: auto; transform: none;
  width: min(560px, 100%); max-width: 100%;
  max-height: none; overflow: visible;
  margin: 0 auto; border-radius: 16px;
  box-shadow: 0 6px 26px rgba(4, 40, 40, .10);
  border: 1px solid #e3eeec;
  padding: 22px 22px 26px;
}
/* no telefone o pop-up vira tela cheia fixa; na pagina, nao. */
@media (max-width: 480px) {
  #lymco.lymco--pagina .lymco__panel {
    position: static; width: 100%; max-width: 100%;
    height: auto; max-height: none; top: auto; left: auto;
    border-radius: 14px; padding: 16px 14px 24px;
  }
}

/* Concluido: na pagina, o titulo do pedido sai quando entra o "obrigado".
   No pop-up os dois convivem porque o cartao e' pequeno e some inteiro ao
   fechar; numa pagina, "Pedido — pagamento na entrega" logo acima de
   "Obrigado, recebemos o seu pedido" fica lendo como se ainda houvesse pedido
   a fazer. */
#lymco.lymco--pagina.is-done #lymco-title { display: none; }

/* moldura da propria pagina de pedido */
.lym-order { padding: 26px 16px 48px; background: #f7fbfa; }
.lym-order__voltar {
  display: block; width: min(560px, 100%); margin: 0 auto 14px;
  font-size: 14px; line-height: 1.4;
}
.lym-order__voltar a { color: #0a6b62; text-decoration: underline; }
.lym-order__aviso {
  width: min(560px, 100%); margin: 14px auto 0; font-size: 12.5px;
  color: #5d7676; text-align: center; line-height: 1.5;
}

/* ==========================================================================
   CAMADA DE PAGAMENTO — Stripe (cartao, Apple Pay, Google Pay) + entrega paga
   Ordem do CEO, 10/09/2026. Tudo aqui e' ADITIVO: nenhuma regra do pop-up
   hungaro (checkout.css) e' tocada, e a versao HU nao carrega este arquivo.
   ========================================================================== */

/* --- Express Checkout Element: Apple Pay / Google Pay ---------------------
   O contentor nasce com [hidden] e so' perde o atributo quando o evento
   "ready" da Stripe confirma que existe carteira NESTE navegador. Sem isso a
   tela ficaria com um titulo e um retangulo vazio no Chrome do Windows. */
#lymco .lymco__express { margin: 0 0 18px; }
#lymco.lymco--pagina .lymco__express {
  width: min(560px, 100%); margin: 0 auto 18px;
}
#lymco .lymco__express[hidden] { display: none !important; }
#lymco .lymco__express-hint {
  margin: 0 0 10px; font-size: 13px; line-height: 1.4;
  color: #3d6b6b; text-align: center;
}
#lymco #lymco-stripe-express { min-height: 0; }
#lymco .lymco__sep {
  height: 1px; background: #dcebe8; margin: 18px 0 2px;
}

/* --- seletor de metodo (so' nos 6 mercados com entrega paga) ------------- */
#lymco .lymco__metodo {
  border: 0; padding: 0; margin: 4px 0 14px; min-width: 0;
}
#lymco .lymco__metodo-tit {
  padding: 0; margin: 0 0 8px; font-size: 14px; font-weight: 700; color: #0a3f3f;
}
#lymco .lymco__opt {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px; margin: 0 0 8px;
  border: 1.5px solid #cfdedb; border-radius: 10px; background: #fff;
  cursor: pointer;
}
#lymco .lymco__opt:has(input:checked) {
  border-color: #028370; background: #f2faf8;
}
#lymco .lymco__opt input[type="radio"] {
  width: 20px; height: 20px; min-width: 20px; margin: 1px 0 0;
  accent-color: #028370; cursor: pointer;
}
#lymco .lymco__opt-txt { display: block; line-height: 1.35; }
#lymco .lymco__opt-lab { display: block; font-size: 14.5px; color: #0a3f3f; }
#lymco .lymco__opt-sub {
  display: block; margin-top: 3px; font-size: 12.5px; color: #5d7676; font-weight: 400;
}
#lymco .lymco__opt-sub[hidden] { display: none !important; }

/* --- Payment Element (cartao) + aviso honesto ---------------------------- */
#lymco .lymco__card { margin: 0 0 14px; }
#lymco .lymco__card[hidden] { display: none !important; }
#lymco #lymco-stripe-payment[hidden] { display: none !important; }
/* Enquanto stripe_pk / stripe_endpoint estiverem vazios e' ISTO que o cliente
   ve' no lugar do campo de cartao. Nao e' erro tecnico: e' aviso honesto. */
#lymco .lymco__pay-off {
  padding: 12px 14px; border: 1.5px solid #e3c98f; border-radius: 10px;
  background: #fdf7e8; color: #6b4f16; font-size: 13.5px; line-height: 1.5;
}
#lymco .lymco__pay-off[hidden] { display: none !important; }
#lymco .lymco__secure {
  margin: 10px 0 0; font-size: 12.5px; line-height: 1.5; color: #5d7676;
}
#lymco .lymco__secure[hidden] { display: none !important; }

/* --- nota de reembolso e nota de processamento --------------------------- */
#lymco .lymco__refund {
  margin: 6px 0 12px; font-size: 12.5px; line-height: 1.5; color: #5d7676;
}
#lymco .lymco__refund[hidden] { display: none !important; }
#lymco .lymco__working {
  margin: 8px 0 0; font-size: 12.5px; line-height: 1.5;
  color: #0a3f3f; font-weight: 600; text-align: center;
}
#lymco .lymco__working[hidden] { display: none !important; }
#lymco .lymco__micro[hidden] { display: none !important; }
#lymco .lymco__pay[hidden] { display: none !important; }