/**
 * Personalizzazione dell'aspetto.
 *
 * Ogni regola legge una variabile generata dal Customizer
 * (Aspetto → Personalizza → DMF Innovation → Navbar, Bottoni, Sfondi, Footer).
 * Caricato dopo style.css, quindi ha sempre l'ultima parola.
 */

/* =========================================================================
   SFONDO DEL SITO
   ========================================================================= */
body.dmf-body {
  background-color: var(--dmf-bg);
  background-image: var(--dmf-bg-image, none);
  background-size: var(--dmf-bg-size, cover);
  background-repeat: var(--dmf-bg-repeat, no-repeat);
  background-position: var(--dmf-bg-position, center center);
  background-attachment: var(--dmf-bg-attachment, scroll);
}

/* =========================================================================
   NAVBAR
   ========================================================================= */
.dmf-nav {
  position: var(--dmf-nav-position, fixed);
  background-color: var(--dmf-nav-bg, rgba(255, 255, 255, 0.72));
  backdrop-filter: saturate(180%) blur(var(--dmf-nav-blur, 20px));
  -webkit-backdrop-filter: saturate(180%) blur(var(--dmf-nav-blur, 20px));
  border-bottom: var(--dmf-nav-border-width, 1px) solid var(--dmf-nav-border, #e6e6e9);
  box-shadow: var(--dmf-nav-shadow, none);
}

.dmf-nav.is-scrolled {
  background-color: var(--dmf-nav-bg-scrolled, rgba(255, 255, 255, 0.8));
}

.dmf-nav__inner {
  max-width: var(--dmf-container, 980px);
}

.dmf-nav__brand,
.dmf-nav__brand:hover {
  color: var(--dmf-nav-brand-color, #1d1d1f);
  font-size: var(--dmf-nav-brand-size, 21px);
  display: flex;
  align-items: center;
  gap: 10px;
}

.dmf-nav__brand img,
.dmf-nav__logo {
  max-height: var(--dmf-nav-logo-height, 28px);
  width: auto;
}

.dmf-nav__logo--mobile { display: none; }

.dmf-nav__links {
  gap: var(--dmf-nav-link-gap, 32px);
}

.dmf-nav__link,
.dmf-nav__link:hover {
  color: var(--dmf-nav-link, #1d1d1f);
  font-size: var(--dmf-nav-link-size, 12px);
  font-weight: var(--dmf-nav-link-weight, 400);
  text-transform: var(--dmf-nav-link-caps, none);
}

.dmf-nav__link:hover {
  color: var(--dmf-nav-link-hover, #1d1d1f);
  opacity: 1;
}

.dmf-nav__link.is-active {
  color: var(--dmf-nav-link-active, #1d1d1f);
  opacity: 1;
}

.dmf-nav__mobile {
  background-color: var(--dmf-nav-mobile-bg, #ffffff);
}

.dmf-nav__mobile-link,
.dmf-nav__mobile-link:hover {
  color: var(--dmf-nav-mobile-link, #1d1d1f);
}

/* Pulsante dentro la navbar: stessa forma dei bottoni, misura ridotta. */
.dmf-nav__cta {
  font-size: calc(var(--dmf-nav-link-size, 12px) + 1px);
  padding: 6px 16px;
  line-height: 1.4;
  white-space: nowrap;
}

.dmf-nav__cta--mobile {
  display: block;
  margin-top: 16px;
  text-align: center;
  font-size: 15px;
  padding: 12px 20px;
}

@media (max-width: 767px) {
  .dmf-nav__logo--desktop { display: none; }

  .dmf-nav__logo--mobile {
    display: block;
    max-height: var(--dmf-nav-logo-height-m, 24px);
  }
}

/* =========================================================================
   BOTTONI
   ========================================================================= */
.button,
.button-secondary,
.dmf-button-outline {
  border-radius: var(--dmf-btn-radius, 980px);
  padding: var(--dmf-btn-padding-y, 12px) var(--dmf-btn-padding-x, 22px);
  font-size: var(--dmf-btn-size, 17px);
  font-weight: var(--dmf-btn-weight, 400);
  text-transform: var(--dmf-btn-caps, none);
  box-shadow: var(--dmf-btn-shadow, none);
  transition: background 0.15s ease-in-out, color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, transform 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.button {
  color: var(--dmf-btn-color, #ffffff);
}

.button:hover {
  color: var(--dmf-btn-color, #ffffff);
  transform: var(--dmf-btn-lift, none);
}

.button-secondary {
  background: var(--dmf-btn-sec-bg, transparent);
  border: var(--dmf-btn-border-width, 2px) solid var(--dmf-btn-sec-color, #ffffff);
  color: var(--dmf-btn-sec-color, #ffffff);
}

.button-secondary:hover {
  background: var(--dmf-btn-sec-hover-bg, #0077ed);
  border-color: var(--dmf-btn-sec-hover-bg, #0077ed);
  color: var(--dmf-btn-sec-hover-col, #ffffff);
  transform: var(--dmf-btn-lift, none);
}

.dmf-button-outline {
  background: transparent;
  border: var(--dmf-btn-border-width, 2px) solid var(--dmf-btn-out-color, #0066cc);
  color: var(--dmf-btn-out-color, #0066cc);
}

.dmf-button-outline:hover {
  background: var(--dmf-btn-out-hover-bg, #0066cc);
  border-color: var(--dmf-btn-out-hover-bg, #0066cc);
  color: var(--dmf-btn-out-hover-col, #ffffff);
  transform: var(--dmf-btn-lift, none);
}

/* =========================================================================
   INTESTAZIONE DELLE PAGINE INTERNE
   ========================================================================= */
.dmf-page-hero {
  position: relative;
  background-color: var(--dmf-pagehero-bg, #f5f5f7);
  background-image: var(--dmf-pagehero-image, none);
  background-size: cover;
  background-position: center center;
  padding-top: var(--dmf-pagehero-padding, 80px);
  padding-bottom: var(--dmf-pagehero-padding, 80px);
}

.dmf-page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #000;
  opacity: var(--dmf-pagehero-overlay, 0);
  pointer-events: none;
}

.dmf-page-hero__inner {
  position: relative;
  z-index: 1;
  max-width: var(--dmf-container, 980px);
}

.dmf-page-hero__title { color: var(--dmf-pagehero-text, #1d1d1f); }
.dmf-page-hero__subtitle { color: var(--dmf-pagehero-subtext, #6e6e73); }

/* =========================================================================
   LARGHEZZE E SPAZI
   ========================================================================= */
.dmf-container { max-width: var(--dmf-container, 980px); }

.dmf-generic-section {
  padding-top: var(--dmf-section-padding, 60px);
  padding-bottom: var(--dmf-section-padding, 60px);
}

/* =========================================================================
   FOOTER
   ========================================================================= */
.footer-main {
  background-color: var(--dmf-footer-bg, #f5f5f7);
  border-top-color: var(--dmf-footer-border, #d2d2d7);
}

.footer-container {
  max-width: var(--dmf-container, 980px);
  padding-top: var(--dmf-footer-padding, 20px);
  padding-bottom: var(--dmf-footer-padding, 20px);
}

.footer-logo { margin-bottom: 20px; }

.footer-logo img {
  max-height: var(--dmf-footer-logo-h, 32px);
  width: auto;
}

.footer-grid h3 { color: var(--dmf-footer-title, #1d1d1f); }
.footer-grid a { color: var(--dmf-footer-link, #6e6e73); }
.footer-grid a:hover { color: var(--dmf-footer-link-hover, #0066cc); }
.footer-bottom { border-top-color: var(--dmf-footer-border, #d2d2d7); }
.footer-policy .sep { color: var(--dmf-footer-border, #d2d2d7); }
.footer-copyright { color: var(--dmf-footer-text, #86868b); }

/* =========================================================================
   SOTTOMENU DELLA NAVBAR
   ========================================================================= */
.dmf-nav__item {
  position: relative;
  display: inline-flex;
  align-items: center;
  align-self: stretch;
}

.dmf-nav__item--has-children > .dmf-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.dmf-nav__chevron { transition: transform 0.2s ease; }

.dmf-nav__submenu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  min-width: 200px;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--dmf-nav-mobile-bg, #ffffff);
  border: 1px solid var(--dmf-nav-border, #e6e6e9);
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
  z-index: 10;
}

.dmf-nav__item--has-children:hover > .dmf-nav__submenu,
.dmf-nav__item--has-children:focus-within > .dmf-nav__submenu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.dmf-nav__item--has-children:hover > .dmf-nav__link .dmf-nav__chevron,
.dmf-nav__item--has-children:focus-within > .dmf-nav__link .dmf-nav__chevron {
  transform: rotate(180deg);
}

.dmf-nav__sub-link,
.dmf-nav__sub-link:hover {
  display: block;
  padding: 9px 12px;
  border-radius: 9px;
  white-space: nowrap;
  text-decoration: none;
  font-size: calc(var(--dmf-nav-link-size, 12px) + 1px);
  font-weight: var(--dmf-nav-link-weight, 400);
  text-transform: var(--dmf-nav-link-caps, none);
  color: var(--dmf-nav-link, #1d1d1f);
}

.dmf-nav__sub-link:hover {
  background: var(--dmf-bg-alt, #f5f5f7);
  color: var(--dmf-nav-link-hover, #1d1d1f);
}

.dmf-nav__sub-link.is-active {
  color: var(--dmf-nav-link-active, #1d1d1f);
  font-weight: 600;
}

/* Terzo livello: si apre di lato */
.dmf-nav__submenu .dmf-nav__item {
  display: flex;
  align-self: auto;
  width: 100%;
}

.dmf-nav__submenu .dmf-nav__item > .dmf-nav__sub-link {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.dmf-nav__submenu .dmf-nav__item > .dmf-nav__sub-link .dmf-nav__chevron {
  transform: rotate(-90deg);
}

.dmf-nav__submenu .dmf-nav__submenu {
  top: -8px;
  left: 100%;
  transform: translateX(6px);
}

.dmf-nav__submenu .dmf-nav__item--has-children:hover > .dmf-nav__submenu,
.dmf-nav__submenu .dmf-nav__item--has-children:focus-within > .dmf-nav__submenu {
  transform: translateX(0);
}

.dmf-nav__submenu .dmf-nav__item--has-children:hover > .dmf-nav__sub-link .dmf-nav__chevron,
.dmf-nav__submenu .dmf-nav__item--has-children:focus-within > .dmf-nav__sub-link .dmf-nav__chevron {
  transform: rotate(-90deg);
}

/* Su telefono i sottomenu restano in elenco, rientrati */
.dmf-nav__mobile-link.is-active { font-weight: 600; }

/* Tocco su tablet/telefono: la tendina resta aperta finché non si tocca fuori */
.dmf-nav__item--has-children.is-open > .dmf-nav__submenu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.dmf-nav__submenu .dmf-nav__item--has-children.is-open > .dmf-nav__submenu {
  transform: translateX(0);
}
