/* Farmacia Navarra — patch al CSS React per l'integrazione WordPress/WooCommerce.
   app.min.css resta intatto; qui solo aggiunte e piccoli adattamenti. */

/* Contenuto pagine generiche (dentro .main > .page come il React) */
.fn-article__title, .page__title { font-size: 3.2rem; font-weight: 700; color: #464646; margin: 0 0 2.4rem; }
.fn-article__content { font-size: 1.6rem; line-height: 1.6; color: #4D4D4D; max-width: 90rem; }
.fn-article__content h2 { font-size: 2.4rem; margin: 3rem 0 1.4rem; }
.fn-article__content h3 { font-size: 2rem; margin: 2.4rem 0 1.2rem; }
.fn-article__content p { margin: 0 0 1.4rem; }
.fn-article__content ul, .fn-article__content ol { margin: 0 0 1.6rem 2.2rem; }
.fn-article__content li { margin-bottom: .6rem; }
.fn-article__content a { color: #469D97; text-decoration: underline; }
.fn-article__content a:hover { color: #4eafa8; }

/* WooCommerce dentro il layout React */
.fn-wc .woocommerce { font-size: 1.6rem; color: #4D4D4D; }

/* Messaggi WC in stile */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  border: 1px solid #E1E6EC; border-radius: 1.2rem; padding: 1.4rem 1.8rem;
  font-size: 1.5rem; margin-bottom: 2rem; background: #F6FBFF; list-style: none;
}
.woocommerce-message { border-color: #469D97; background: #f0faf9; }
.woocommerce-error { border-color: #DF4747; background: #fdf3f3; color: #C9282B; }

/* Bottoni WC allineati alle pill del design */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.button.alt,
.woocommerce button.button.alt, .woocommerce input.button.alt {
  display: inline-block; font: 700 2rem/2.6rem Roboto, sans-serif; color: #fff;
  background: #469D97; border: .2rem solid #469D97; border-radius: 2.5rem;
  min-height: 5rem; padding: 1rem 2.4rem; cursor: pointer; text-align: center;
  transition: background .2s, border-color .2s;
}
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover {
  background: #4eafa8; border-color: #4eafa8; color: #fff;
}

/* Checkbox assicurazione consegna */
.fn-insurance { margin: 2rem 0; font-size: 1.6rem; text-align: left; }
.fn-insurance__label { display: flex; align-items: flex-start; gap: 1rem; cursor: pointer; font-weight: 500; }
.fn-insurance__label input { width: 2rem; height: 2rem; margin-top: .2rem; accent-color: #469D97; }
.fn-insurance__label small { display: block; font-weight: 400; color: #9AA3AC; margin-top: .4rem; }

/* ---- Fix checkout FunnelKit: il CSS FK nasconde i checkbox/radio nativi ----
   e li sostituisce con pseudo-elementi brandizzati; qui ripristiniamo i
   controlli nativi, puliti e allineati. */

/* Radio del metodo di pagamento (PayPal): niente bullet arancione flottante. */
#wfacp-e-form #payment input#payment_method_mecom_paypal {
    -webkit-appearance: radio !important; appearance: radio !important;
    display: inline-block !important; position: relative !important;
    top: auto !important; left: auto !important; float: none !important;
    width: 16px !important; height: 16px !important; min-height: 0 !important;
    margin: 0 10px 0 0 !important; padding: 0 !important; opacity: 1 !important;
    vertical-align: middle !important;
}
#wfacp-e-form #payment input#payment_method_mecom_paypal::before,
#wfacp-e-form #payment input#payment_method_mecom_paypal:checked::before {
    display: none !important; content: none !important;
}
#wfacp-e-form #payment input#payment_method_mecom_paypal + label {
    display: inline !important; padding-left: 0 !important;
    vertical-align: middle !important; line-height: 1.4 !important;
}

/* Checkbox assicurazione: visibile e cliccabile dentro il form FK. */
#wfacp-e-form .wfacp_main_form .fn-insurance input[type="checkbox"],
#wfacp-e-form .fn-insurance input[type="checkbox"] {
    -webkit-appearance: checkbox !important; appearance: auto !important;
    display: inline-block !important; position: static !important;
    width: 20px !important; height: 20px !important; min-height: 0 !important;
    margin: 2px 10px 0 0 !important; padding: 0 !important; opacity: 1 !important;
    float: none !important; clip: auto !important; accent-color: #4a9b8e;
    pointer-events: auto !important;
}
#wfacp-e-form .wfacp_main_form .fn-insurance input[type="checkbox"]::before,
#wfacp-e-form .wfacp_main_form .fn-insurance input[type="checkbox"]:checked::before {
    display: none !important; content: none !important;
}
#wfacp-e-form .fn-insurance__label { padding-left: 0 !important; display: flex !important; }

/* L'admin bar WP sposta il layout: compensazione minima */
.admin-bar .header { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar .header { top: 46px; } }

/* ------------------------------------------------ selettore confezioni */
/* Pill "tipo taglie" + pannello acquisto singolo (sostituisce la vecchia
   griglia 11 righe x 11 bottoni). */
.fn-packs {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem;
  margin: 2rem 0 2.4rem;
}
.fn-pack {
  position: relative; display: flex; flex-direction: column; align-items: center;
  gap: .3rem; padding: 1.6rem 1rem 1.3rem; background: #fff;
  border: .2rem solid #E1E6EC; border-radius: 1.6rem; cursor: pointer;
  font-family: Roboto, sans-serif; text-align: center;
  transition: border-color .2s, background .2s, transform .15s;
}
.fn-pack:hover { border-color: #469D97; }
.fn-pack.is-active {
  border-color: #469D97; background: #f0faf9;
  box-shadow: 0 .4rem 1.4rem rgba(70,157,151,.18);
}
.fn-pack__badge {
  position: absolute; top: -1.1rem; left: 50%; transform: translateX(-50%);
  background: #469D97; color: #fff; font-size: 1.05rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; white-space: nowrap;
  padding: .35rem 1rem; border-radius: 999px;
}
.fn-pack__qty { font-size: 1.7rem; font-weight: 700; color: #464646; }
.fn-pack__price { font-size: 1.9rem; font-weight: 700; color: #469D97; }
.fn-pack__unit { font-size: 1.15rem; color: #9AA3AC; }

.fn-buy {
  display: flex; align-items: center; justify-content: space-between;
  gap: 2rem; flex-wrap: wrap;
  border: 1px solid #ECF0F3; border-radius: 1.6rem; background: #fff;
  padding: 2rem 2.4rem; margin-bottom: 2rem;
}
.fn-buy__prices { display: flex; align-items: baseline; gap: 1.2rem; }
.fn-buy__sale { font-size: 3.4rem; font-weight: 700; color: #464646; text-decoration: none; }
.fn-buy__regular { font-size: 2rem; color: #C9282B; }
.fn-buy__meta { font-size: 1.4rem; color: #9AA3AC; margin-top: .4rem; }
.fn-buy__btn { min-width: 26rem; text-align: center; }

@media (max-width: 991px) {
  .fn-packs { grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
  .fn-buy { flex-direction: column; align-items: stretch; text-align: center; }
  .fn-buy__prices { justify-content: center; }
  .fn-buy__btn { min-width: 0; width: 100%; }
  .fn-buy__sale { font-size: 2.8rem; }
}

/* ------------------------------------------------------ pagina shop */
.fn-shop-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(26rem, 1fr));
  gap: 2.4rem; margin: 3rem 0;
}
.fn-shop-card {
  border: .1rem solid #e0e0e0; border-radius: .8rem; padding: 2rem;
  display: flex; flex-direction: column; gap: 1.2rem; background: #fff;
}
.fn-shop-card__img img { width: 100%; max-height: 20rem; object-fit: contain; display: block; margin: 0 auto; }
.fn-shop-card__name { font-size: 1.8rem; margin: 0; }
.fn-shop-card__name a { color: #464646; text-decoration: none; }
.fn-shop-card__name a:hover { color: #469D97; }
.fn-shop-card__desc { font-size: 1.4rem; color: #555; margin: 0; }
.fn-shop-card__foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.fn-shop-card__price { font-size: 2rem; font-weight: 700; color: #464646; }
.fn-shop-card__price ins { text-decoration: none; }
.fn-shop-card__price del { color: #C9282B; font-size: 1.5rem; margin-right: .6rem; }
@media (max-width: 575px) {
  .fn-shop-grid { grid-template-columns: 1fr; }
  .fn-shop-card__foot .ui-btn { width: 100%; text-align: center; }
}

/* ------------------------------------------------------ form contatti */
.fn-form { max-width: 60rem; margin-top: 2rem; }
.fn-form label { display: block; font-size: 1.4rem; font-weight: 500; color: #4D4D4D; }
.fn-form input[type="text"], .fn-form input[type="email"], .fn-form textarea {
  width: 100%; border: .2rem solid #E1E6EC; border-radius: 2.5rem;
  height: 5rem; padding: 0 2rem; font: 400 1.6rem Roboto, sans-serif;
  color: #4D4D4D; background: #fff; outline: none; transition: border-color .2s;
}
.fn-form textarea { border-radius: 2rem; height: auto; padding: 1.4rem 2rem; resize: vertical; }
.fn-form input:focus, .fn-form textarea:focus { border-color: #469D97; }
.fn-form .fn-form__msg { font-size: 1.4rem; margin-top: 1rem; }

/* --------------------------------------------- pagina di pagamento */
.fn-payment__subtitle { font-size: 1.6rem; color: #4D4D4D; margin: 0 0 2.4rem; }
.fn-payment__h2 { font-size: 1.8rem; font-weight: 700; color: #464646; margin: 0 0 1.4rem; }
.fn-payment__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; }
@media (max-width: 991px) { .fn-payment__grid { grid-template-columns: 1fr; } }

.fn-recap { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid #ECF0F3; border-radius: 1.2rem; overflow: hidden; background: #fff; font-size: 1.5rem; }
.fn-recap td { padding: 1.2rem 1.6rem; border-bottom: 1px solid #ECF0F3; color: #4D4D4D; }
.fn-recap tbody tr:last-child td { border-bottom: none; }
.fn-recap tfoot td { border-top: 2px solid #E1E6EC; border-bottom: none; }
.fn-recap__val { text-align: right; white-space: nowrap; }
.fn-recap__total { font-size: 2rem; }
.fn-recap__qty { color: #9AA3AC; }
.fn-recap ins { text-decoration: none; }

/* finestra croppata sui bottoni PayPal/carta della hosted page */
.fn-crop-win { overflow: hidden; width: 100%; max-width: 56rem; margin: 0 auto; border: 1px solid #ECF0F3; border-radius: 1.2rem; background: #fff; }
.fn-crop-frame { width: 100%; border: 0; display: block; height: 1100px; }

.fn-payment__trust { list-style: none; padding: 0; margin: 2rem 0 1rem; font-size: 1.4rem; color: #4D4D4D; }
.fn-payment__trust li { margin-bottom: .8rem; }
.fn-payment__legal { font-size: 1.3rem; color: #9AA3AC; }
.fn-payment__status { margin-top: 1.6rem; font-size: 1.5rem; }
.fn-payment__ok { color: #168935; font-weight: 700; font-size: 1.7rem; }
.fn-payment__err { color: #DF4747; font-weight: 500; }
.fn-payment__err a { color: #469D97; }
.fn-payment__note { color: #9AA3AC; }

/* ------------------------------------------------ checkout classico */
/* .col-1/.col-2 di WC collidono con la grid di app.min.css: ripristino layout */
.woocommerce-checkout .col2-set, .woocommerce-page .col2-set { display: flex; flex-wrap: wrap; gap: 3rem; }
.woocommerce-checkout .col2-set .col-1, .woocommerce-checkout .col2-set .col-2,
.woocommerce-page .col2-set .col-1, .woocommerce-page .col2-set .col-2 {
  flex: 1 1 40rem; width: auto; float: none; max-width: none; padding: 0;
}
/* coppie di campi su due colonne come il checkout React */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; }
@media (max-width: 768px) {
  .woocommerce-billing-fields__field-wrapper,
  .woocommerce-shipping-fields__field-wrapper { grid-template-columns: 1fr; }
}
.woocommerce form .form-row { width: 100%; float: none; padding: 0; margin: 0 0 1.6rem; }
.woocommerce form .form-row-first, .woocommerce form .form-row-last { width: 100%; float: none; }
.woocommerce form .form-row label { display: block; font-size: 1.4rem; font-weight: 500; color: #4D4D4D; margin-bottom: .6rem; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
  width: 100%; border: .2rem solid #E1E6EC; border-radius: 2.5rem; height: 5rem;
  padding: 0 2rem; font: 400 1.6rem Roboto, sans-serif; color: #4D4D4D;
  background: #fff; outline: none; transition: border-color .2s; box-shadow: none;
}
.woocommerce form .form-row textarea { border-radius: 2rem; height: auto; padding: 1.4rem 2rem; }
.woocommerce form .form-row input:focus, .woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus { border-color: #469D97; }
.woocommerce form .form-row .required { color: #C9282B; }
/* select2 (selettore paese) allineato alle pill */
.woocommerce .select2-container .select2-selection--single {
  height: 5rem; border: .2rem solid #E1E6EC; border-radius: 2.5rem; display: flex; align-items: center; padding: 0 2rem;
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 5rem; padding: 0; color: #4D4D4D; font-size: 1.6rem; }
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow { height: 5rem; right: 1.2rem; }

/* titoli sezioni checkout */
.woocommerce-checkout h3, .woocommerce-checkout #order_review_heading {
  font-size: 2.2rem; font-weight: 700; color: #464646; margin: 3rem 0 1.6rem;
}

/* tabella riepilogo ordine + metodi */
.woocommerce-checkout table.shop_table, .woocommerce-cart table.shop_table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  border: 1px solid #ECF0F3; border-radius: 1.2rem; overflow: hidden; background: #fff; font-size: 1.5rem;
}
.woocommerce-checkout table.shop_table th, .woocommerce-checkout table.shop_table td,
.woocommerce-cart table.shop_table th, .woocommerce-cart table.shop_table td {
  padding: 1.2rem 1.6rem; border-bottom: 1px solid #ECF0F3; color: #4D4D4D;
}
.woocommerce-checkout table.shop_table thead th, .woocommerce-cart table.shop_table thead th { background: #F6FBFF; font-weight: 600; text-align: left; }
.woocommerce ul#shipping_method { list-style: none; padding: 0; margin: 0; }
.woocommerce ul#shipping_method li { padding: .6rem 0; }
.woocommerce ul#shipping_method input { accent-color: #469D97; }

/* box pagamento gateway */
.woocommerce #payment { background: transparent; }
.woocommerce #payment ul.payment_methods { list-style: none; padding: 0; margin: 2rem 0; border: 1px solid #ECF0F3; border-radius: 1.2rem; background: #fff; overflow: hidden; }
.woocommerce #payment ul.payment_methods li { padding: 1.6rem; border-bottom: 1px solid #ECF0F3; }
.woocommerce #payment ul.payment_methods li:last-child { border-bottom: none; }
.woocommerce #payment div.payment_box { background: #F6FBFF; border-radius: 1rem; }
.woocommerce #payment div.payment_box::before { display: none; }
.woocommerce-privacy-policy-text { font-size: 1.3rem; color: #9AA3AC; }

/* botone place order */
.woocommerce #place_order, .woocommerce-page #place_order {
  width: 100%; font-size: 2rem; min-height: 5.5rem; margin-top: 1.6rem;
}

/* ------------------------------------------------- carrello classico */
.woocommerce-cart .shop_table td.product-name { font-weight: 500; }
.woocommerce-cart .shop_table td.product-name a { color: #464646; text-decoration: none; }
.woocommerce-cart .shop_table td.product-name a:hover { color: #469D97; }
.woocommerce-cart .shop_table .product-thumbnail img { width: 6rem; height: auto; }
.woocommerce-cart .shop_table .product-remove a.remove { color: #C9282B !important; font-size: 2rem; text-decoration: none; }
.woocommerce-cart .shop_table input.qty {
  width: 7rem; height: 4.4rem; border: .2rem solid #E1E6EC; border-radius: 2.2rem;
  padding: 0 1rem; font-size: 1.6rem; text-align: center; outline: none;
}
.woocommerce-cart .actions .coupon .input-text {
  width: 22rem; height: 5rem; border: .2rem solid #E1E6EC; border-radius: 2.5rem;
  padding: 0 2rem; font-size: 1.6rem; outline: none;
}
.woocommerce-cart .actions { padding: 1.4rem 1.6rem !important; }
.woocommerce-cart .cart-collaterals .cart_totals { width: 100%; max-width: 48rem; float: none; }
.woocommerce-cart .cart_totals h2 { font-size: 2.2rem; font-weight: 700; color: #464646; margin: 3rem 0 1.6rem; }
.woocommerce-cart .wc-proceed-to-checkout .checkout-button { width: 100%; text-align: center; font-size: 2rem; min-height: 5.5rem; display: flex; align-items: center; justify-content: center; }

/* icone font WC mancanti: via i ::before rotti */
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error { padding-left: 1.8rem; }

/* -------------------------------------------- thank-you (ordine ricevuto) */
.woocommerce-order > .woocommerce-notice-success, .woocommerce-thankyou-order-received {
  display: block; border: 1px solid #469D97; background: #f0faf9; color: #168935;
  border-radius: 1.2rem; padding: 2rem 2.4rem; font-size: 1.8rem; font-weight: 700;
}
.woocommerce-thankyou-order-received::before { content: "✓ "; }
ul.woocommerce-order-overview { display: flex; flex-wrap: wrap; gap: 1.6rem 3rem; list-style: none; padding: 0; margin: 2rem 0 3rem; font-size: 1.4rem; }
ul.woocommerce-order-overview li { text-transform: uppercase; color: #9AA3AC; font-size: 1.2rem; }
ul.woocommerce-order-overview li strong { display: block; text-transform: none; color: #464646; font-size: 1.6rem; margin-top: .4rem; }
.woocommerce-order-details__title, .woocommerce-column__title { font-size: 2rem; font-weight: 700; color: #464646; margin: 3rem 0 1.4rem; }
.woocommerce table.woocommerce-table--order-details { width: 100%; max-width: 72rem; border-collapse: separate; border-spacing: 0; border: 1px solid #ECF0F3; border-radius: 1.2rem; overflow: hidden; font-size: 1.5rem; }
.woocommerce table.woocommerce-table--order-details th, .woocommerce table.woocommerce-table--order-details td { padding: 1.2rem 1.6rem; border-bottom: 1px solid #ECF0F3; }
.woocommerce table.woocommerce-table--order-details thead th { background: #F6FBFF; text-align: left; }
.woocommerce-columns--addresses .woocommerce-column { max-width: 36rem; }
.woocommerce-columns--addresses address { border: 1px solid #ECF0F3; border-radius: 1.2rem; padding: 1.6rem; font-size: 1.5rem; font-style: normal; }

/* Il payment_box di CardsShield contiene testo/grafica della modalita' hosted:
   in smart-button mode resta nascosto (i bottoni ufficiali stanno nel
   container dedicato sotto il place order). NIENTE regola display:block su
   #place_order: il plugin deve poterlo nascondere (.important-hide). */
.payment_box.payment_method_mecom_paypal { display: none !important; }

/* Semplificazione carrello/checkout: via la riga "Spedizione a <indirizzo>"
   e il calcolatore indirizzo (l'indirizzo si inserisce al checkout). */
.woocommerce-shipping-destination, .shipping-calculator-button,
.shipping-calculator-form { display: none !important; }

/* input coupon nel carrello: larghezza leggibile */
.woocommerce-cart .actions .coupon { display: flex; gap: 1rem; flex-wrap: wrap; }
.woocommerce-cart .actions .coupon .input-text { flex: 1 1 24rem; min-width: 20rem; }

/* ------------------------------------------------ mini-cart laterale
   (rimosso il pannello custom: lo slide cart e' di FunnelKit Cart) */

/* lo spinner WC sul bottone durante l'aggiunta */
.ui-btn.loading { opacity: .6; pointer-events: none; }