/* =====================================================
   Stile della pizzeria: Bootstrap fa quasi tutto,
   qui ci sono solo colori e pochi ritocchi.
   ===================================================== */
:root {
  --pizza: #b3261e;       /* rosso pomodoro */
  --pizza-scuro: #7f1712;
  --crema: #fff8ef;
}

body {
  background: var(--crema);
}

/* Striscia della versione demo */
.demo-striscia {
  background: #fff3cd;
  color: #664d03;
}
.demo-striscia a {
  color: #664d03;
  font-weight: 600;
}

/* Barra in alto */
.bg-pizza {
  background: var(--pizza);
}

/* Sezione grande iniziale */
.hero {
  background:
    linear-gradient(rgba(0, 0, 0, .55), rgba(0, 0, 0, .55)),
    radial-gradient(circle at 30% 20%, #e8a33d 0, #b3261e 45%, #3b0d0a 100%);
  padding: 4rem 0;
}

/* Card delle pizze */
.card-pizza {
  transition: transform .2s, box-shadow .2s;
}
.card-pizza:hover {
  transform: translateY(-3px);
  box-shadow: 0 .75rem 1.5rem rgba(0, 0, 0, .12) !important;
}
.prezzo {
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--pizza);
  white-space: nowrap;
}

/* Colori delle categorie */
.badge-classiche { background: #fde2e1; color: #9b1c1c; }
.badge-speciali  { background: #fff1c2; color: #8a5a00; }
.badge-bianche   { background: #e8eef5; color: #374151; }

/* Pulsanti filtro: il rosso al posto del blu di Bootstrap */
.btn-outline-danger.active {
  background: var(--pizza);
  border-color: var(--pizza);
}

/* Orari pieni nel menu a tendina */
option:disabled {
  color: #aaa;
}

/* Pagina di accesso */
.pagina-login {
  background: radial-gradient(circle at 30% 20%, #e8a33d 0, #b3261e 45%, #3b0d0a 100%);
}

/* Telefoni: un po' meno spazio */
@media (max-width: 575.98px) {
  .hero {
    padding: 2.5rem 0;
  }
  .hero .display-4 {
    font-size: 2rem;
  }
  .etichetta {
    font-size: .75rem;
  }
  #filtri {
    width: 100%;
  }
  #filtri .btn {
    flex: 1;
    font-size: .85rem;
    padding-left: .25rem;
    padding-right: .25rem;
  }
}