/* ==========================================================================
   Stili per Pagina Controllo di Gestione - Justbit
   ========================================================================== */

/* Variabili Colore */
:root {
  --justbit-dark: #1a1a3d; /* Blu scuro Justbit (usato per testo su bianco) */
  --report-button-color: #ff5950; /* Colore principale bottone */
  --report-button-hover-color: #e64a40; /* Colore bottone in hover */
  --justbit-text-light: #ffffff; /* Testo chiaro (es. su bottoni) */
  --justbit-text-dark: #333333; /* Testo scuro standard */
  --body-background: #f4f4f8; /* Sfondo pagina leggermente grigio */
  --card-background: #ffffff; /* Sfondo card */
  --navbar-background: #ffffff; /* Sfondo navbar */
  --footer-background: #ffffff; /* Sfondo footer */
  --footer-border-color: #e0e0e0; /* Colore bordo superiore footer */
  --error-red: #d32f2f; /* Colore messaggi errore */
  --success-green: #388e3c; /* Colore messaggi successo */
}

/* Reset Base e Body */
body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  font-family: "Roboto", sans-serif; /* Font standard Material Design */
  background-color: var(--body-background);
  color: var(--justbit-text-dark);
  margin: 0;
}

main {
  flex: 1 0 auto; /* Fa sì che il main occupi lo spazio disponibile spingendo il footer in basso */
}

/* Navbar */
nav {
  background-color: var(--navbar-background) !important;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
    0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
  color: var(--justbit-dark); /* Colore testo di default nella navbar */
}

/* Contenitore link logo - diventa flex */
nav .brand-logo {
  display: flex !important;
  align-items: center !important;
  height: 100%; /* Assicura che prenda tutta l'altezza per l'allineamento */
  /* Nota: Materialize potrebbe applicare padding, aggiustare se necessario */
}

/* Stile logo testuale (se usato) */
nav .brand-logo .logo-text,
nav .brand-logo .logo-text .justbit-pink-text {
  /* .justbit-pink-text è un residuo, ora usa colore scuro */
  color: var(--justbit-dark) !important;
  font-weight: bold;
  font-size: 1.8rem;
}

/* Stile logo immagine (se usato) */
nav .brand-logo img.logo {
  height: 40px; /* Altezza desiderata logo */
  width: auto;
  display: block; /* Comportamento corretto in flex */
}

/* Stile titolo pagina accanto al logo */
.page-title {
  color: var(--justbit-dark) !important;
  font-size: 1.2rem;
  font-weight: normal; /* O bold se preferisci */
  margin-left: 15px; /* Spazio tra logo e titolo */
  white-space: nowrap; /* Evita che il titolo vada a capo */
  /* Allineato verticalmente grazie ad align-items sul parent (.brand-logo) */
}

/* Icona menu laterale (hamburger) */
nav .sidenav-trigger i {
  color: var(--justbit-dark) !important;
}

/* Card principale */
.card {
  background-color: var(--card-background);
  padding: 20px 25px; /* Più padding interno */
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); /* Ombra più sottile */
}

/* Titolo della card */
.card .card-title {
  font-weight: bold !important; /* Titolo in grassetto */
  color: var(--justbit-dark);
  margin-bottom: 20px; /* Spazio sotto il titolo */
}

/* Stile input fields */
.input-field label {
  color: #9e9e9e; /* Colore label standard */
}
.input-field input[type="password"]:focus + label {
  color: var(--report-button-color) !important;
}
.input-field input[type="password"]:focus {
  border-bottom: 1px solid var(--report-button-color) !important;
  box-shadow: 0 1px 0 0 var(--report-button-color) !important;
}
/* Colore icona prefisso quando attiva */
.input-field .prefix.active {
  color: var(--report-button-color) !important;
}

/* Bottone Genera Report */
.report-button-bg {
  /* Classe specifica per lo sfondo, se vuoi isolarlo */
  background-color: var(--report-button-color) !important;
}
.btn,
.btn:focus {
  background-color: var(--report-button-color);
  font-weight: bold !important; /* Testo grassetto */
  color: var(--justbit-text-light); /* Testo bianco */
  /* Rimuovi text-shadow se presente */
  text-transform: none; /* Evita TUTTO MAIUSCOLO se non desiderato */
  border-radius: 4px; /* Angoli leggermente arrotondati */
  height: 42px; /* Altezza standard bottone */
  line-height: 42px; /* Allinea testo verticalmente */
  padding: 0 2rem; /* Padding orizzontale */
}
.btn:hover {
  background-color: var(--report-button-hover-color) !important;
  /* Non serve !important se sovrascrivi .report-button-bg */
}
.btn i {
  /* Allinea icona nel bottone */
  line-height: 42px;
}

/* Indicatore di caricamento (Loader) */
.loader-container {
  margin-top: 20px;
  color: var(--justbit-dark); /* Colore testo "Generazione..." */
}
.preloader-wrapper.active .spinner-layer {
  border-color: var(--report-button-color) !important; /* Colore spinner */
}

/* Messaggi di Stato/Errore */
.status-message {
  margin-top: 15px;
  font-weight: 500;
  min-height: 1.2em; /* Evita salti di layout quando il messaggio appare/scompare */
}
.status-message.error {
  color: var(--error-red);
}
.status-message.success {
  color: var(--success-green);
}

/* Footer */
.page-footer {
  background-color: var(--footer-background) !important;
  border-top: 1px solid var(--footer-border-color);
  padding: 15px 0; /* Padding verticale */
  margin-top: 30px;
}
/* Testo nel footer */
.footer-text {
  color: var(--justbit-text-dark) !important;
  margin: 0; /* Rimuovi margini default paragrafo */
  font-size: 0.9rem;
}

/* Regole Responsive */
@media only screen and (max-width: 992px) {
  /* Nascondi titolo accanto al logo su tablet e mobile */
  .page-title {
    display: none !important;
  }
}

@media only screen and (max-width: 600px) {
  /* Riduci leggermente logo su mobile */
  nav .brand-logo img.logo {
    height: 35px;
  }
  nav .brand-logo .logo-text {
    font-size: 1.5rem;
  }

  /* Riduci padding card su mobile */
  .card {
    padding: 15px;
  }
  .card .card-title {
    font-size: 1.4rem;
    margin-bottom: 15px;
  }
}
