/* ==================================================================
   Eurosima — Chrome globale (header). Usa i token di style.css.
   Markup con classi .eu-* (nessuna classe Bootstrap) → nessun conflitto
   con la vecchia CSS del parent.
   ================================================================== */

/* Reset locale (neutralizza eventuali stili ereditati dal parent). */
.eu-header,
.eu-header * { box-sizing: border-box; }
.eu-header a { text-decoration: none; color: inherit; }
.eu-header ul { list-style: none; margin: 0; padding: 0; }
.eu-header button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
.eu-header .eu-icon { display: block; flex: none; }

.eu-hide-mobile { display: inline-flex; }

/* Rimozione FAB/banner indesiderati (PWA install + store notice E-Club demo). */
#install-btn { display: none !important; }
.woocommerce-store-notice,
.demo_store,
p.demo_store { display: none !important; }

/* Container max-width globale (header + sezioni). Vive qui perché chrome.css
   carica su TUTTE le pagine, mentre home.css solo in front page. */
.eu-container { max-width: var(--container-max); margin: 0 auto; padding-inline: var(--container-pad); }

/* --- Top-bar --- */
.eu-topbar { background: var(--color-navy); color: rgba(255, 255, 255, 0.85); font-size: var(--fs-xs); }
.eu-topbar__inner { display: flex; align-items: center; justify-content: space-between; padding-block: var(--space-2); }
.eu-topbar__group { display: flex; align-items: center; gap: var(--space-5); }
.eu-topbar__item { display: inline-flex; align-items: center; gap: 6px; }
.eu-topbar__item strong { color: #fff; font-weight: var(--fw-bold); }
.eu-topbar__sep { opacity: 0.4; }
.eu-topbar__mobile { display: none; }
.eu-topbar__dot { color: var(--color-primary); }

/* --- Fascia primaria --- */
.eu-primary { background: var(--color-surface); border-bottom: 1px solid var(--color-line); }
.eu-primary__inner { display: grid; grid-template-columns: auto 1fr auto; gap: var(--space-7); align-items: center; padding-block: var(--space-5); }
.eu-header .eu-primary__hamburger { display: none; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--color-ink); border-radius: var(--radius-md); background: var(--color-surface-alt); border: 1px solid var(--color-line); }
.eu-primary__logo img { height: 46px; width: auto; display: block; }

.eu-search { display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 6px 0 18px; background: var(--color-surface-alt); border: 1px solid var(--color-line); border-radius: var(--radius-pill); }
.eu-search__icon { color: var(--color-muted); }
.eu-search__input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none; font-family: var(--font-sans); font-size: var(--fs-base); color: var(--color-ink); }
/* !important per battere la vecchia styles.css del parent (hardcoded, carica dopo wp_head). */
.eu-header .eu-search__submit { display: inline-flex !important; align-items: center; height: 36px !important; padding: 0 18px !important; border: 0 !important; border-radius: var(--radius-pill) !important; background: var(--color-navy) !important; color: #fff !important; font-size: var(--fs-sm); font-weight: var(--fw-semibold); }

.eu-primary__actions { display: flex; align-items: center; gap: var(--space-5); }
.eu-action { display: flex; align-items: center; gap: 8px; color: var(--color-ink); }
.eu-action__icon { position: relative; width: 40px; height: 40px; border-radius: var(--radius-pill); border: 1px solid var(--color-line); background: var(--color-surface); display: flex; align-items: center; justify-content: center; }
.eu-action__label { font-size: var(--fs-sm); color: var(--color-ink-2); }
.eu-action__badge { position: absolute; top: -4px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--radius-pill); background: var(--color-accent); color: #fff; font-size: var(--fs-2xs); font-weight: var(--fw-bold); display: flex; align-items: center; justify-content: center; }

/* --- Barra categorie --- */
.eu-catbar { background: var(--color-surface); border-bottom: 1px solid var(--color-line); }
.eu-catbar__inner { display: flex; align-items: stretch; font-size: 13.5px; font-weight: var(--fw-medium); }
.eu-catbar__all { display: flex; align-items: center; gap: 10px; padding: 14px 18px; background: var(--color-primary); color: var(--color-navy); font-weight: var(--fw-bold); }
.eu-catbar__menu { display: flex; align-items: stretch; flex-wrap: wrap; }
.eu-catbar__menu li a { display: flex; align-items: center; gap: 6px; padding: 14px 16px; color: var(--color-ink-2); font-weight: var(--fw-medium); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.eu-catbar__menu li a .eu-icon { color: var(--color-muted); }
.eu-catbar__menu li.eu-catbar__item--active a { color: var(--color-navy); font-weight: var(--fw-bold); border-bottom-color: var(--color-primary); }
.eu-catbar__outlet { margin-left: auto; display: flex; align-items: center; padding: 14px 16px; color: var(--color-accent); font-weight: var(--fw-semibold); }

/* ================= Product card verticale (componente globale riusabile) ================= */
.eu-pcard-v { display: flex; flex-direction: column; background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius-lg-d); overflow: hidden; }
.eu-pcard-v__media { position: relative; padding: 22px; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; }
.eu-pcard-v__img { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.eu-pcard-v__media img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.eu-badge--discount { background: var(--color-accent); color: #fff; border-radius: var(--radius-pill); font-size: var(--fs-2xs); font-weight: var(--fw-bold); padding: 4px 10px; letter-spacing: 0.4px; }
.eu-pcard-v__media .eu-badge--discount { position: absolute; top: 14px; left: 14px; z-index: 1; }
.eu-pcard-v__wish { position: absolute; top: 14px; right: 14px; width: 32px; height: 32px; border-radius: var(--radius-pill); background: #fff; color: var(--color-ink-2); display: flex; align-items: center; justify-content: center; }
.eu-pcard-v__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.eu-pcard-v__brand { font-size: var(--fs-2xs); color: var(--color-muted); letter-spacing: 0.5px; text-transform: uppercase; }
.eu-pcard-v__title { font-size: 14.5px; line-height: 1.3; color: var(--color-ink); font-weight: var(--fw-medium); min-height: 38px; margin: 0; }
.eu-pcard-v__title a { color: inherit; text-decoration: none; }
.eu-stars { display: flex; align-items: center; gap: 4px; font-size: var(--fs-2xs); color: var(--color-muted); }
.eu-stars__icons { display: inline-flex; color: var(--color-accent); }
.eu-pcard-v__price { display: flex; align-items: flex-end; justify-content: space-between; margin-top: 8px; }
.eu-pcard-v__old, .eu-pcard-v__old .woocommerce-Price-amount { font-size: var(--fs-2xs); color: var(--color-muted); text-decoration: line-through; font-family: var(--font-sans); }
.eu-pcard-v__now { display: flex; align-items: baseline; gap: 4px; }
.eu-pcard-v__now .woocommerce-Price-amount { font-family: var(--font-serif); font-size: var(--fs-2xl); color: var(--color-ink); font-weight: var(--fw-medium); }
.eu-pcard-v__vat { font-size: 10px; color: var(--color-muted); }
.eu-pcard-v__add { flex: none; width: 38px; height: 38px; border-radius: var(--radius-pill); background: var(--color-primary); color: #fff; display: flex; align-items: center; justify-content: center; }

/* ================= Footer globale ================= */
.eu-footer { background: var(--color-navy); color: rgba(255, 255, 255, 0.7); padding: 40px 0 24px; margin-top: var(--space-14); font-family: var(--font-sans); }
.eu-footer a { color: inherit; text-decoration: none; }
.eu-footer * { box-sizing: border-box; }
.eu-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--space-8); padding-bottom: 28px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.eu-footer__logo { height: 32px; width: auto; filter: brightness(0) invert(1); margin-bottom: 14px; display: block; }
.eu-footer__tagline { font-size: 12.5px; line-height: 1.6; margin: 0; max-width: 320px; }
.eu-footer__col-title { color: #fff; font-size: var(--fs-sm); font-weight: var(--fw-bold); margin-bottom: 12px; }
.eu-footer__link { display: block; font-size: 12.5px; padding: 4px 0; color: rgba(255, 255, 255, 0.7); }
.eu-footer__link:hover { color: #fff; }
.eu-footer__bottom { padding-top: 18px; display: flex; align-items: center; justify-content: space-between; font-size: 11.5px; gap: var(--space-4); }
.eu-footer__pay { display: flex; gap: 16px; opacity: 0.7; }

/* ================= Mobile (≤768px) ================= */
@media (max-width: 768px) {
  .eu-hide-mobile { display: none !important; }
  .eu-container { padding-inline: var(--container-pad-mobile); }

  .eu-topbar__inner { justify-content: center; gap: var(--space-3); font-size: 11.5px; }
  .eu-topbar__group { display: none; }
  .eu-topbar__mobile { display: block; text-align: center; }

  /* Griglia: hamburger | logo (centro) | azioni; ricerca a tutta larghezza sotto. */
  .eu-primary__inner { grid-template-columns: auto 1fr auto; grid-template-areas: "ham logo actions" "search search search"; gap: var(--space-3) var(--space-2); padding-block: var(--space-3); }
  .eu-header .eu-primary__hamburger { display: flex; grid-area: ham; }
  .eu-primary__logo { grid-area: logo; display: flex; justify-content: center; }
  .eu-primary__logo img { height: 34px; }
  .eu-primary__actions { grid-area: actions; gap: var(--space-2); }
  .eu-search { grid-area: search; height: 44px; padding: 0 16px; border-radius: var(--radius-md); }
  .eu-header .eu-search__submit { display: none !important; }
  .eu-action--wishlist { display: none; }
  .eu-action__label { display: none; }
  .eu-action__icon { width: 38px; height: 38px; border-radius: var(--radius-md); background: var(--color-surface-alt); }

  /* Barra categorie nascosta su mobile (drawer hamburger = step successivo). */
  .eu-catbar { display: none; }

  .eu-footer__grid { grid-template-columns: 1fr 1fr; gap: var(--space-5); }
  .eu-footer__brand { grid-column: 1 / -1; }
  .eu-footer__bottom { flex-direction: column; align-items: flex-start; gap: 12px; }

  .eu-pcard-v { border-radius: var(--radius-lg); }
  .eu-pcard-v__media { padding: 12px; }
  .eu-pcard-v__wish { display: none; }
  .eu-pcard-v .eu-stars { display: none; }
  .eu-pcard-v__body { padding: 10px 12px 12px; gap: 4px; }
  .eu-pcard-v__brand { font-size: 10px; }
  .eu-pcard-v__title { font-size: 12.5px; line-height: 1.25; min-height: 32px; }
  .eu-pcard-v__now .woocommerce-Price-amount { font-size: var(--fs-lg); }
  .eu-pcard-v__add { width: 30px; height: 30px; background: var(--color-navy); }
}