/* ============================================================
   Mayo School — Extra WordPress
   Pagine interne/legali · WooCommerce · TutorLMS · nav account/carrello.
   Usa i token :root definiti in styles.css (var --terra, --brown, ecc.).
   ============================================================ */

/* ---------- Header solido su pagine interne ---------- */
/* Sulle pagine non-home il contenuto sotto è chiaro: l'header deve avere
   subito lo sfondo marrone (come lo stato is-scrolled) per restare leggibile. */
.site-header.is-solid {
  background: var(--brown);
  box-shadow: 0 2px 18px -8px rgba(61,36,24,0.5);
}

/* ---------- Header / nav (versione WP: + Accedi + carrello) ---------- */
/* Il tema WP aggiunge "Accedi" e il carrello rispetto al prototipo: senza questo
   le voci a più parole andavano a capo ("IL / CORSO") accavallandosi sul logo.
   NB: l'off-canvas mobile fino a 1080px è già in styles.css — qui solo gli extra WP. */
.nav__link, .nav-account, .nav__cta { white-space: nowrap; }

/* header un filo più largo per ospitare la nav completa */
.site-header .container.header__inner { max-width: 1320px; }

@media (min-width: 1081px) {
  .site-header .nav { gap: clamp(0.8rem, 1.5vw, 1.7rem); flex-wrap: nowrap; }
  .site-header .nav__link { font-size: 0.78rem; letter-spacing: 0.08em; }
}

/* Extra WP dentro il menu off-canvas (breakpoint allineato a styles.css) */
@media (max-width: 1080px) {
  .site-header .nav { gap: 1.6rem; width: min(82vw, 340px); }
  .site-header .nav__cta { align-self: flex-start; color: var(--brown) !important; }
  .site-header .nav-cart { margin-top: 0.2rem; }
  .site-header .nav-cart-count { position: static; margin-left: 0.5rem; opacity: 1; transform: none; }
}

/* ---------- Nav: account + carrello ---------- */
.nav-account { display: inline-flex; align-items: center; }
.nav-cart {
  position: relative; display: inline-flex; align-items: center;
  color: rgba(255,255,255,0.9); transition: color 0.25s var(--ease);
}
.nav-cart:hover { color: #fff; }
.nav-cart-icon { width: 22px; height: 22px; }
.nav-cart-count {
  position: absolute; top: -8px; right: -10px; min-width: 18px; height: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 5px; border-radius: 999px; background: var(--tan); color: var(--brown);
  font-family: var(--round); font-weight: 700; font-size: 0.66rem; line-height: 1;
  opacity: 0; transform: scale(0.6); transition: all 0.25s var(--ease);
}
.nav-cart-count.has-items { opacity: 1; transform: scale(1); }

@media (max-width: 760px) {
  .nav-cart { margin-top: 0.4rem; }
  .nav-cart-count { position: static; margin-left: 0.5rem; opacity: 1; transform: none; }
}

/* ---------- Pagine interne / legali ---------- */
.default-page,
.legal-page,
.wc-page {
  padding-top: clamp(7.5rem, 12vw, 11rem);
}

.page-header { margin-bottom: 2rem; }
.page-content,
.legal-content { max-width: 70ch; }

.legal-content h2 {
  font-family: var(--round); font-weight: 600; color: var(--brown);
  font-size: clamp(1.25rem, 1rem + 1vw, 1.7rem);
  margin: 2.2rem 0 0.8rem;
}
.legal-content p,
.page-content p { color: var(--ink-soft); margin-bottom: 1rem; }
.legal-content ul,
.page-content ul { margin: 0 0 1.2rem 1.2rem; list-style: disc; color: var(--ink-soft); }
.legal-content li { margin-bottom: 0.5rem; }
.legal-content a,
.page-content a { color: var(--terra-deep); text-decoration: underline; text-underline-offset: 2px; }
.legal-content a:hover { color: var(--terra); }
.legal-content strong { color: var(--ink); font-weight: 600; }
.legal-updated { margin-top: 2.5rem; font-size: 0.85rem; color: var(--muted); font-style: italic; }

/* ============================================================
   WooCommerce — restyle brand
   ============================================================ */
.wc-page h1,
.wc-page h2,
.woocommerce .section__title { font-family: var(--round); color: var(--brown); }

/* Bottoni WC → terracotta */
.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 {
  background: var(--terra); color: #fff;
  font-family: var(--round); font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.08em; border-radius: var(--radius); padding: 0.9em 1.8em;
  transition: background 0.3s var(--ease), transform 0.3s var(--ease);
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: var(--terra-deep); color: #fff; transform: translateY(-2px);
}

.woocommerce .price,
.woocommerce-Price-amount { color: var(--brown); font-family: var(--round); font-weight: 700; }

/* Tabelle, totali */
.woocommerce table.shop_table { border-color: var(--line); border-radius: var(--radius); }
.woocommerce-cart table.cart td,
.woocommerce table.shop_table th { font-family: var(--body); }

/* Form fields */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce .select2-container--default .select2-selection--single {
  border: 1px solid var(--line); border-radius: var(--radius); padding: 0.7em 0.9em;
  font-family: var(--body);
}
.woocommerce form .form-row input.input-text:focus { outline: 2px solid var(--terra); border-color: var(--terra); }

/* Notices */
.woocommerce-message,
.woocommerce-info { border-top-color: var(--terra); }
.woocommerce-error { border-top-color: #b3261e; }

/* Account: navigazione laterale */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li {
  border-bottom: 1px solid var(--line);
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block; padding: 0.8em 0; font-family: var(--round); font-weight: 600;
  color: var(--ink-soft); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.85rem;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { color: var(--terra); }

/* Checkbox di consenso al checkout */
.mayoschool-consent { margin: 1rem 0; padding: 0.9rem 1rem; border-radius: var(--radius); background: var(--cream-2); }
.mayoschool-consent label { font-size: 0.9rem; color: var(--ink-soft); }
.mayoschool-consent a { color: var(--terra-deep); }
.mayoschool-consent-critical { background: rgba(168,72,31,0.1); border: 1px solid rgba(168,72,31,0.4); }
.mayoschool-consent-critical strong { color: var(--terra-deep); }

/* ============================================================
   TutorLMS — restyle brand (override variabili colore + font)
   ============================================================ */
:root {
  --tutor-color-primary: #a8481f;
  --tutor-color-primary-hover: #8a3817;
  --tutor-color-primary-light: #f4ebdd;
  --tutor-fontspace-bs: var(--round);
  --tutor-body-font-family: "Nexa", sans-serif;
}

.tutor-wrap,
.tutor-course-details-page,
[class*="tutor-"] { font-family: var(--body); }

.tutor-course-name,
.tutor-course-details-title,
.tutor-segment-title,
.tutor-color-black { font-family: var(--round) !important; color: var(--brown) !important; }

/* Bottoni TutorLMS → terracotta */
.tutor-btn-primary,
.tutor-btn.tutor-btn-primary {
  background-color: var(--terra) !important; border-color: var(--terra) !important;
  font-family: var(--round); font-weight: 600;
}
.tutor-btn-primary:hover { background-color: var(--terra-deep) !important; border-color: var(--terra-deep) !important; }

.tutor-btn-outline-primary {
  color: var(--terra) !important; border-color: var(--terra) !important; font-family: var(--round);
}
.tutor-btn-outline-primary:hover { background-color: var(--terra) !important; color: #fff !important; }

/* Progress bar / accenti */
.tutor-progress-bar .tutor-progress-value { background-color: var(--terra) !important; }

/* Pagina LEZIONE (player TutorLMS immersivo).
   Il player ha già la SUA barra in alto (← titolo ✕) e la sidebar "Contenuto del
   corso", entrambe in posizione fissa. Il nostro header/footer FISSO del sito le
   copriva → li nascondiamo qui: il player occupa lo schermo senza sovrapposizioni.
   Equivale ad attivare "Spotlight Mode" in TutorLMS → Settings (consigliato). */
.mayoschool-lesson .site-header,
.mayoschool-lesson .site-footer {
  display: none !important;
}
.mayoschool-lesson .tutor-lesson-wrapper,
.mayoschool-lesson .tutor-lesson-content-area {
  padding-top: 0 !important;
}

/* ---------- Override template Tutor (tema/tutor/) ---------- */
/* Wrapper principale (template.php) per parti dashboard */
.mayoschool-tutor-wrap {
  padding-top: clamp(6.5rem, 10vw, 9rem);
  padding-bottom: clamp(3rem, 6vw, 5rem);
  background: var(--cream);
  min-height: 60vh;
}

/* Barra intro della pagina corso (single-course.php) */
.mayoschool-course-intro {
  background: var(--cream);
  padding-top: clamp(6.5rem, 10vw, 8.5rem);
  padding-bottom: 0.75rem;
}
.mayoschool-course-intro__back {
  font-family: var(--round); font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.08em; font-size: 0.78rem; color: var(--terra-deep);
  transition: color 0.25s var(--ease);
}
.mayoschool-course-intro__back:hover { color: var(--terra); }

/* Pagina corso */
.mayoschool-course-page {
  background: var(--cream);
  padding-bottom: clamp(3rem, 6vw, 5rem);
}
.mayoschool-course-page .tutor-course-details-title,
.mayoschool-course-page .tutor-course-name {
  font-family: var(--round) !important; color: var(--brown) !important;
}