/* ============================================================
   FisioBooking · booking.css
   Override WordPress/tema + stili di integrazione + responsive
   ============================================================ */


.fisio-root *, #fisio-admin-panel * {
  box-sizing: border-box;
}

/* ── Larghezza pannello admin ────────────────────────────────── */
#fisio-admin-panel {
  max-width: 100% !important;
  width: 100% !important;
  overflow-x: hidden;
}

/* ── Btn-primary testo bianco (override tema WP) ─────────────── */
.fisio-root .fisio-btn-primary,
.fisio-root .fisio-btn-primary:hover,
.fisio-root .fisio-btn-primary:focus,
#fisio-admin-panel .fisio-btn-primary,
#fisio-admin-panel .fisio-btn-primary:hover {
  color: #ffffff !important;
}

/* ── Btn-ghost bordo verde chiaro ────────────────────────────── */
.fisio-btn.fisio-btn-ghost {
  border-style: solid !important;
  border-color: #e3f6e7 !important;
  border-width: 1px !important;
}

/* ── Card padding ────────────────────────────────────────────── */
.fisio-root .fisio-card,
#fisio-admin-panel .fisio-card {
  padding: 12px !important;
}

/* ── Griglia calendario (override tema) ──────────────────────── */
.fisio-root .fisio-cal-grid {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
  width: 100% !important;
}
.fisio-root .fisio-cal-day {
  display: flex !important;
  width: 100% !important;
}
.fisio-root .fisio-cal-weekdays {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
  width: 100% !important;
}

/* ── Giorni pieni ────────────────────────────────────────────── */
.fisio-root .fisio-cal-day.is-full {
  background: #e8edf2 !important;
  color: #94a3b8 !important;
  border-color: #dde3ea !important;
  cursor: not-allowed !important;
}
.fisio-root .fisio-cal-day.is-full .fisio-cal-day-num {
  text-decoration: line-through;
  color: #94a3b8;
}

/* ── Riepilogo step 2 e conferma ─────────────────────────────── */
.fisio-summary-box {
  background: #e6f9ea;
  border-radius: var(--fisio-radius-md);
  padding: var(--fisio-space-6) var(--fisio-space-6);
  margin-bottom: var(--fisio-space-6);
  width: 100%;
}
.fisio-summary-box .summary-row {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--fisio-text-md);
  font-weight: 600;
  color: var(--fisio-brand-text);
  line-height: 1.6;
  margin-bottom: var(--fisio-space-3);
}
.fisio-summary-box .summary-row:last-child { margin-bottom: 0; }
.fisio-summary-box .summary-row svg { flex-shrink: 0; color: var(--fisio-brand-text); }

/* ── Nota "Hai un imprevisto?" più grande ────────────────────── */
.fisio-root .fisio-note {
  font-size: var(--fisio-text-sm) !important;
}

/* ── Alert bar errori ────────────────────────────────────────── */
.fisio-alert-bar {
  margin: var(--fisio-space-5) 0;
  padding: var(--fisio-space-5) var(--fisio-space-6);
  background: var(--fisio-danger-soft);
  border: 1px solid var(--fisio-danger-border);
  border-radius: var(--fisio-radius-md);
  color: var(--fisio-danger-text);
  font-size: var(--fisio-text-sm);
}

/* ── Input/textarea override tema ────────────────────────────── */
.fisio-root .fisio-input,
.fisio-root .fisio-textarea,
#fisio-admin-panel .fisio-input {
  font-family: var(--fisio-font-body) !important;
  font-size: var(--fisio-text-base) !important;
  max-width: 100% !important;
  width: 100%;
}
.fisio-root .fisio-textarea { resize: vertical; }

/* ── Pill URL ────────────────────────────────────────────────── */
.fisio-pill-url {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  max-width: 100% !important;
}

/* ── Manage form card padding ────────────────────────────────── */
#fisio-manage-app .fisio-card {
  padding: 12px !important;
}

/* ── Azioni calendario admin ─────────────────────────────────── */
.fisio-cal-action-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px;
  background: #fff; border: 1px solid var(--fisio-border);
  border-radius: var(--fisio-radius-md);
  cursor: pointer; text-decoration: none; color: var(--fisio-text-muted);
  transition: background .15s; flex-shrink: 0;
}
.fisio-cal-action-btn:hover { background: var(--fisio-surface-2); color: var(--fisio-text); }

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE MOBILE (max 600px)
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 600px) {

  /* ── Calendario: fix celle su mobile (Divi 5) ─────────────── */
  .fisio-root .fisio-cal-day {
    aspect-ratio: unset !important;
    min-height: 40px !important;
    height: auto !important;
  }
  .fisio-root .fisio-cal-grid {
    gap: 3px !important;
  }

  /* ── Navbar: 2 righe 3+3, icona sopra testo sotto ─────────── */
  .fisio-navbar {
    flex-wrap: wrap !important;
    justify-content: stretch !important;
    gap: 4px !important;
    padding: 6px !important;
  }
  .fisio-nav-tab {
    flex: 1 1 calc(33.333% - 4px) !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    padding: 8px 4px !important;
    font-size: 0.7rem !important;
    white-space: nowrap;
    min-width: 0;
  }
  .fisio-nav-tab svg { width: 18px; height: 18px; }
  .fisio-nav-tab-spacer { display: none !important; }

  /* ── Vista giorno: badge+azioni a capo ─────────────────────── */
  #fisio-admin-panel [id^="appt-"] {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  #fisio-admin-panel [id^="appt-"] > div:last-child {
    width: 100% !important;
    justify-content: flex-start !important;
  }

  /* ── Vista settimana: lista verticale ──────────────────────── */
  .fisio-week-mobile-list { display: block !important; }
  .fisio-week-desktop-grid { display: none !important; }

  /* ── Token: 1 colonna ──────────────────────────────────────── */
  .fisio-token-gen-grid {
    grid-template-columns: 1fr !important;
  }

  /* ── Accessi: 1 colonna, tutto dentro schermo ──────────────── */
  .fisio-access-grid {
    grid-template-columns: 1fr !important;
  }
  .fisio-access-grid form,
  .fisio-access-grid .fisio-card,
  .fisio-access-grid input,
  .fisio-access-grid button,
  .fisio-access-grid .fisio-btn {
    max-width: 100% !important;
    width: 100% !important;
  }

  /* ── Orari settimanali: 2 righe ────────────────────────────── */
  #fisio-admin-panel .fisio-day-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
    padding: 10px 0 !important;
  }
  #fisio-admin-panel .fisio-day-row > label.fisio-toggle {
    width: 100% !important;
  }
  #fisio-admin-panel .fisio-day-row > div {
    width: 100% !important;
    display: block !important;
  }
  #fisio-admin-panel .fisio-day-row input[type="time"] {
    flex: 1 !important;
    min-width: 90px !important;
    padding: 8px !important;
  }

  /* ── Log WA filtri: 3 campi in colonna su mobile ──────────── */
  .fisio-log-filter-top {
    grid-template-columns: 1fr !important;
  }

  /* ── Log WA: nascondi tabella, mostra card ─────────────────── */
  #fisio-admin-panel .fisio-table { display: none !important; }
  #fisio-admin-panel .fisio-log-cards { display: flex !important; }

  /* ── Bottoni e input dentro admin: no overflow ─────────────── */
  #fisio-admin-panel button,
  #fisio-admin-panel input,
  #fisio-admin-panel select,
  #fisio-admin-panel .fisio-btn {
    max-width: 100% !important;
  }
}

/* Desktop: mostra tabella, nascondi card log */
.fisio-week-mobile-list { display: none; }
.fisio-week-desktop-grid { display: block; }
.fisio-log-cards { display: none; }



/* ── fisio-page: larghezza piena ─────────────────────────────── */
.fisio-root .fisio-page {
  max-width: 100% !important;
}

/* ── Orari: input time senza icona orologio che copre testo ─── */
.fisio-day-row input[type="time"] {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 8px !important;
}

/* ── Orari settimanali: fix mobile only ─────────────────────── */
@media (max-width: 600px) {
  /* Riga toggle+nome: block per non rompere il layout */
  #fisio-admin-panel .fisio-day-row {
    display: block !important;
  }
  /* Rimuove il rientro che taglia i campi a destra */
  #fisio-admin-panel [id^="fp-day-wrap-"] {
    padding-left: 0 !important;
  }
  /* Righe orari: flex per affiancare i due campi */
  #fisio-admin-panel [id^="fp-day-wrap-"] > div {
    gap: 8px !important;
    align-items: flex-end !important;
  }
  /* I div campo (etichetta+input) si dividono lo spazio equamente */
  #fisio-admin-panel [id^="fp-day-wrap-"] > div > div {
    flex: 1 !important;
    min-width: 0 !important;
  }
  #fisio-admin-panel [id^="fp-day-wrap-"] input[type="time"] {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* ── Navbar: Esci separato ───────────────────────────────────── */
/* Su desktop: posizionato in assoluto a destra della navbar */
/* Su mobile: la navbar è 2 righe da 3, Esci sta fuori e in alto a destra */
@media (max-width: 600px) {
  /* Il contenitore relativo deve avere spazio sopra per il pulsante Esci */
  #fisio-admin-panel > div:first-child {
    padding-top: 36px !important;
  }
  /* Esci in alto a destra sopra la navbar */
  #fisio-admin-panel > div:first-child > a[href*="wp-login"] {
    top: 0 !important;
    transform: none !important;
  }
  /* Nascondi etichetta "Esci" su mobile, mostra solo icona */
  .fisio-esci-label {
    display: none;
  }
}

/* ── Fix placeholder campi data (Divi 5 override) ───────────── */
.fisio-root input[type="date"],
#fisio-admin-panel input[type="date"] {
  color: var(--fisio-text) !important;
  -webkit-text-fill-color: var(--fisio-text) !important;
}
.fisio-root input[type="date"]::-webkit-datetime-edit-fields-wrapper,
#fisio-admin-panel input[type="date"]::-webkit-datetime-edit-fields-wrapper {
  color: var(--fisio-text) !important;
}
.fisio-root input[type="date"]::-webkit-datetime-edit-text,
.fisio-root input[type="date"]::-webkit-datetime-edit-month-field,
.fisio-root input[type="date"]::-webkit-datetime-edit-day-field,
.fisio-root input[type="date"]::-webkit-datetime-edit-year-field,
#fisio-admin-panel input[type="date"]::-webkit-datetime-edit-text,
#fisio-admin-panel input[type="date"]::-webkit-datetime-edit-month-field,
#fisio-admin-panel input[type="date"]::-webkit-datetime-edit-day-field,
#fisio-admin-panel input[type="date"]::-webkit-datetime-edit-year-field {
  color: var(--fisio-text) !important;
}

/* ── Fix padding input con icone SVG (Divi override) ────────── */
/* L'icona è posizionata a left:12px, larghezza ~16px → padding-left 36px garantisce
   che testo e placeholder non si sovrappongano mai all'icona, su tutti i dispositivi */
.fisio-root .fisio-field-control .fisio-input,
.fisio-root .fisio-field-control .fisio-textarea,
#fisio-admin-panel .fisio-field-control .fisio-input,
#fisio-admin-panel .fisio-field-control .fisio-textarea {
  padding-left: 36px !important;
}
/* Campi senza icona: reset padding normale */
.fisio-root .fisio-input-plain,
#fisio-admin-panel .fisio-input-plain {
  padding-left: 14px !important;
}
