/* ============================================================
   Deus Flight Pro – Stili frontend (DEUS-PAG · www.deus-pag.it)
   Variabili: --dfp-primary, --dfp-accent, --dfp-radius
   ============================================================ */

.dfp-wrap {
  --dfp-primary: #0d6efd;
  --dfp-accent: #f59e0b;
  --dfp-radius: 12px;
  --dfp-text: #1f2937;
  --dfp-muted: #6b7280;
  --dfp-border: #e5e7eb;
  --dfp-bg: #f9fafb;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--dfp-text);
  max-width: 980px;
  margin: 0 auto;
}

/* ---------- Intestazione ---------- */
.dfp-heading { margin-bottom: 18px; }
.dfp-title { font-size: 1.6rem; font-weight: 700; margin: 0 0 6px; line-height: 1.3; }
.dfp-subtitle { margin: 0; color: var(--dfp-muted); }

/* ---------- Form ---------- */
.dfp-form {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  background: var(--dfp-bg);
  border: 1px solid var(--dfp-border);
  border-radius: var(--dfp-radius);
  padding: 16px;
}

.dfp-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }

.dfp-label {
  font-size: .78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--dfp-muted);
}

.dfp-select, .dfp-date {
  width: 100%;
  padding: 9px 11px;
  border: 1px solid var(--dfp-border);
  border-radius: calc(var(--dfp-radius) / 1.6);
  background: #fff;
  color: var(--dfp-text);
  font-size: .92rem;
  line-height: 1.4;
  min-height: 42px;
  box-sizing: border-box;
}
.dfp-select:focus, .dfp-date:focus {
  outline: none;
  border-color: var(--dfp-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--dfp-primary) 18%, transparent);
}

/* Tratta: andata e ritorno / solo andata */
.dfp-trip-toggle { display: flex; gap: 6px; }
.dfp-pill {
  flex: 1;
  cursor: pointer;
  border: 1px solid var(--dfp-border);
  border-radius: calc(var(--dfp-radius) / 1.6);
  background: #fff;
  padding: 9px 8px;
  text-align: center;
  font-size: .84rem;
  font-weight: 600;
  transition: all .15s;
}
.dfp-pill input { position: absolute; opacity: 0; pointer-events: none; }
.dfp-pill.is-active {
  border-color: var(--dfp-primary);
  background: color-mix(in srgb, var(--dfp-primary) 10%, #fff);
  color: var(--dfp-primary);
}

/* Passeggeri */
.dfp-pax { grid-column: span 2; }
.dfp-pax-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 0;
  border-bottom: 1px dashed var(--dfp-border);
}
.dfp-pax-row:last-child { border-bottom: none; }
.dfp-pax-name { font-size: .85rem; font-weight: 500; }
.dfp-pax-hint { font-size: .72rem; color: var(--dfp-muted); display: block; }
.dfp-stepper { display: flex; align-items: center; gap: 6px; }
.dfp-stepper button {
  width: 28px; height: 28px;
  border: 1px solid var(--dfp-border);
  background: #fff;
  border-radius: 8px;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  color: var(--dfp-text);
}
.dfp-stepper button:hover { border-color: var(--dfp-primary); color: var(--dfp-primary); }
.dfp-stepper input {
  width: 34px;
  text-align: center;
  border: 1px solid var(--dfp-border);
  border-radius: 8px;
  padding: 4px 2px;
  font-size: .9rem;
  -moz-appearance: textfield;
  appearance: textfield;
}
.dfp-stepper input::-webkit-outer-spin-button,
.dfp-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Pulsante ricerca */
.dfp-submit { grid-column: span 4; }
.dfp-btn {
  width: 100%;
  padding: 13px 18px;
  border: none;
  border-radius: calc(var(--dfp-radius) / 1.4);
  background: var(--dfp-primary);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .02em;
  cursor: pointer;
  transition: filter .15s, transform .1s;
}
.dfp-btn:hover { filter: brightness(1.08); }
.dfp-btn:active { transform: scale(.99); }
.dfp-btn:disabled { opacity: .65; cursor: wait; }

/* ---------- Risultati ---------- */
.dfp-results { margin-top: 20px; }
.dfp-results-inner { animation: dfpFade .25s ease; }
@keyframes dfpFade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.dfp-results-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 14px;
}
.dfp-results-summary { font-size: .95rem; }
.dfp-results-summary strong { font-size: 1.05rem; }
.dfp-results-summary .dfp-route-line { display: block; color: var(--dfp-muted); font-size: .85rem; }
.dfp-results-sort { display: flex; align-items: center; gap: 8px; font-size: .85rem; color: var(--dfp-muted); }
.dfp-results-sort select {
  padding: 7px 10px;
  border: 1px solid var(--dfp-border);
  border-radius: 8px;
  background: #fff;
  font-size: .85rem;
}

.dfp-demo-note {
  background: #fffbeb;
  border: 1px solid #fde68a;
  color: #92400e;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: .85rem;
  margin-bottom: 14px;
}

/* ---------- Card volo ---------- */
.dfp-cards { display: flex; flex-direction: column; gap: 12px; }

.dfp-card {
  display: flex;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid var(--dfp-border);
  border-radius: var(--dfp-radius);
  padding: 16px 18px;
  gap: 16px;
  transition: box-shadow .15s, border-color .15s;
  position: relative;
}
.dfp-card:hover { box-shadow: 0 6px 18px rgba(0, 0, 0, .07); border-color: #d1d5db; }

.dfp-best-badge {
  position: absolute;
  top: -10px;
  left: 16px;
  background: var(--dfp-accent);
  color: #fff;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: 3px 12px;
  border-radius: 20px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
}

.dfp-card-main { display: flex; flex: 1 1 560px; gap: 16px; flex-wrap: wrap; min-width: 0; }
.dfp-legs { flex: 1 1 380px; min-width: 0; }

.dfp-leg { padding: 8px 0; }
.dfp-leg + .dfp-leg { border-top: 1px dashed var(--dfp-border); }
.dfp-leg-label {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--dfp-muted);
  background: var(--dfp-bg);
  border-radius: 6px;
  padding: 2px 8px;
  margin-bottom: 6px;
}
.dfp-leg-row { display: flex; align-items: center; gap: 12px; }
.dfp-time { font-size: 1.12rem; font-weight: 700; white-space: nowrap; }
.dfp-time.right { text-align: right; }
.dfp-time small { display: block; font-size: .68rem; color: var(--dfp-muted); font-weight: 500; }
.dfp-route-line-flex { flex: 1; text-align: center; position: relative; padding: 0 4px; }
.dfp-airports { font-size: .82rem; font-weight: 600; white-space: nowrap; }
.dfp-flight-line {
  height: 2px;
  background: var(--dfp-border);
  margin: 4px auto 3px;
  width: 100%;
  position: relative;
  border-radius: 2px;
}
.dfp-flight-line::after {
  content: "";
  position: absolute;
  right: -3px;
  top: -3px;
  border: solid var(--dfp-border);
  border-width: 0 2px 2px 0;
  padding: 2px;
  transform: rotate(-45deg);
}
.dfp-duration { font-size: .72rem; color: var(--dfp-muted); }

.dfp-airline-line { font-size: .78rem; color: var(--dfp-muted); margin-top: 6px; }
.dfp-airline-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--dfp-bg);
  border-radius: 6px;
  padding: 2px 8px;
  font-weight: 600;
  font-size: .75rem;
  margin-right: 4px;
}
.dfp-airline-badge .dfp-al-code {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  border-radius: 6px;
  background: var(--dfp-primary);
  color: #fff;
  font-size: .62rem;
  font-weight: 800;
}

/* Box prezzo */
.dfp-price-box {
  flex: 0 0 200px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 4px;
  border-left: 1px solid var(--dfp-border);
  padding-left: 16px;
  text-align: right;
}
.dfp-price { font-size: 1.55rem; font-weight: 800; line-height: 1.1; }
.dfp-price small { font-size: .78rem; font-weight: 500; color: var(--dfp-muted); display: block; }
.dfp-price-total { font-size: .78rem; color: var(--dfp-muted); }
.dfp-book {
  margin-top: 8px;
  padding: 10px 22px;
  background: var(--dfp-accent);
  color: #fff;
  border-radius: calc(var(--dfp-radius) / 1.4);
  font-weight: 700;
  font-size: .9rem;
  text-decoration: none;
  transition: filter .15s;
}
.dfp-book:hover { filter: brightness(1.08); color: #fff; }

/* ---------- Skeleton ---------- */
.dfp-skeleton { display: flex; flex-direction: column; gap: 12px; }
.dfp-skeleton .sk {
  height: 110px;
  border-radius: var(--dfp-radius);
  background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 50%, #f3f4f6 75%);
  background-size: 200% 100%;
  animation: dfpShimmer 1.4s infinite;
}
@keyframes dfpShimmer { to { background-position: -200% 0; } }

/* ---------- Messaggi ---------- */
.dfp-msg {
  border-radius: var(--dfp-radius);
  padding: 16px 18px;
  font-size: .92rem;
  border: 1px solid var(--dfp-border);
  background: #fff;
}
.dfp-msg.dfp-error { border-color: #fecaca; background: #fef2f2; color: #991b1b; }
.dfp-msg.dfp-none { border-color: var(--dfp-border); background: var(--dfp-bg); text-align: center; color: var(--dfp-muted); }

/* ---------- Footer risultati e crediti ---------- */
.dfp-results-foot {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--dfp-border);
  font-size: .76rem;
  color: var(--dfp-muted);
  text-align: center;
}
.dfp-credit { margin-top: 14px; font-size: .74rem; color: var(--dfp-muted); text-align: center; }
.dfp-credit a { color: var(--dfp-muted); }

/* ---------- Responsive ---------- */
@media (max-width: 782px) {
  .dfp-form { grid-template-columns: repeat(2, 1fr); }
  .dfp-submit { grid-column: span 2; }
  .dfp-pax { grid-column: span 2; }
}
@media (max-width: 520px) {
  .dfp-form { grid-template-columns: 1fr; }
  .dfp-submit, .dfp-pax { grid-column: span 1; }
  .dfp-price-box {
    flex-basis: 100%;
    border-left: none;
    border-top: 1px solid var(--dfp-border);
    padding-left: 0;
    padding-top: 12px;
    align-items: center;
    text-align: center;
  }
}

/* ============================================================
   LAYOUT GRAFICI ALTERNATIVI (v1.2.0 · DEUS-PAG)
   ============================================================ */

/* ---------- Layout HERO (homepage) ---------- */
.dfp-layout-hero {
  background:
    radial-gradient(1000px 500px at 85% -10%, rgba(255, 255, 255, .18), transparent 60%),
    linear-gradient(135deg, #083a8f 0%, var(--dfp-primary) 55%, #1e7ae0 100%);
  border-radius: calc(var(--dfp-radius) * 1.4);
  padding: 44px 24px 36px;
  margin-bottom: 24px;
}
.dfp-layout-hero .dfp-title {
  color: #fff;
  font-size: 2rem;
  text-align: center;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .18);
}
.dfp-layout-hero .dfp-subtitle {
  color: rgba(255, 255, 255, .88);
  text-align: center;
  font-size: 1.05rem;
}
.dfp-layout-hero .dfp-form {
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .28);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  max-width: 880px;
  margin: 18px auto 0;
  box-shadow: 0 18px 40px rgba(0, 20, 60, .25);
}
.dfp-layout-hero .dfp-label { color: rgba(255, 255, 255, .92); }
.dfp-layout-hero .dfp-btn { font-size: 1.05rem; padding: 14px 20px; }
.dfp-layout-hero .dfp-credit,
.dfp-layout-hero .dfp-credit a { color: rgba(255, 255, 255, .8); }
.dfp-layout-hero .dfp-results-head,
.dfp-layout-hero .dfp-results-summary { color: #fff; }
.dfp-layout-hero .dfp-results-summary .dfp-route-line { color: rgba(255, 255, 255, .75); }

/* ---------- Layout BOXED (pagina singola, evidenza) ---------- */
.dfp-layout-boxed.dfp-wrap { max-width: 860px; }
.dfp-layout-boxed .dfp-form {
  box-shadow: 0 12px 34px rgba(15, 23, 42, .10), 0 2px 6px rgba(15, 23, 42, .05);
  border: 1px solid #d8dee8;
  background: #fff;
  padding: 22px;
}
.dfp-layout-boxed .dfp-heading { text-align: center; }
.dfp-layout-boxed .dfp-title { font-size: 1.7rem; }

/* ---------- Layout COMPACT (sidebar / footer / widget) ---------- */
.dfp-layout-compact.dfp-wrap { max-width: 360px; margin: 0; }
.dfp-layout-compact .dfp-form {
  grid-template-columns: 1fr;
  gap: 10px;
  padding: 14px;
}
.dfp-layout-compact .dfp-submit,
.dfp-layout-compact .dfp-pax { grid-column: span 1; }
.dfp-layout-compact .dfp-title { font-size: 1.1rem; margin-bottom: 4px; }
.dfp-layout-compact .dfp-subtitle { display: none; }
.dfp-layout-compact .dfp-credit { display: none; }
.dfp-layout-compact .dfp-btn { padding: 11px 14px; }
.dfp-layout-compact .dfp-pax-row { padding: 3px 0; }
.dfp-layout-compact .dfp-select,
.dfp-layout-compact .dfp-date { min-height: 38px; padding: 7px 10px; }

/* ---------- Layout STANDARD: leggera ombra opzionale ---------- */
.dfp-layout-standard .dfp-form { box-shadow: 0 4px 14px rgba(15, 23, 42, .06); }