:root{
  --arancio-vivace : #ff8b00;
  --arancio-caldo  : #ea8623;
  --verde-acceso   : #55ea23;
  --verde-lime     : #a8ea23;
  --giallo-sole    : #ead923;
  --rosso-fuoco    : #ea3323;
  --rosa-lampone   : #ea2366;
  --fucsia         : #ea23b9;
  --viola-orchidea : #c823ea;
  --indaco         : #7523ea;

  --ocra:       #febb26;
  --verde:      #1eb253;
  --blue:       #017cf3;
  --azzurro-reale: #4f7af9; /* Era il tuo --viola */
  --viola-chiaro:  #9c78fe; /* Era il tuo --pervinca */
  --bianco:     #FFFFFF;

}
body, html{
  padding: 0;
  margin: 0;
}
html, body{
  margin: 0;
  padding: 0;
  background-color: #fff;
}

/* CSSPAGINA LOGIN */
#login{
        width: 100vw;
        height: 100vh;
        background-image: url(../immagini/bg-login.jpg);
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: cover;
    }

.login-container {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    align-content: normal;
    min-width: 33vw;
    width: 33vw;
    height: 100vh;
    background-color: rgba(255, 255, 255, 0.9);

  }

.login-box{
    width: 400px;
    margin: auto;
  }

 #login .errore{
    min-width: 400px;
    width: 400px;
}


/* COLORI ICONE */
.arancio-vivace {color: var(--arancio-vivace);}
.arancio-caldo  {color: var(--arancio-caldo);}
.verde-acceso   {color: var(--verde-acceso);}
.verde-lime     {color: var(--verde-lime);}
.giallo-sole    {color: var(--giallo-sole);}
.rosso-fuoco    {color: var(--rosso-fuoco);}
.rosa-lampone   {color: var(--rosa-lampone);}
.fucsia         {color: var(--fucsia);}
.viola-orchidea {color: var(--viola-orchidea);}
.indaco         {color: var(--indaco);}

.ocra           {color: var(--ocra);}
.verde          {color: var(--verde);}
.blue           {color: var(--blue);}
.azzurro-reale  {color: var(--azzurro-reale);}
.viola-chiaro   {color: var(--viola-chiaro);}
.bianco         {color: var(--bianco);}

/* SFONDI */

.bg-arancio-caldo  {color: #FFFFFF; background-color: var(--arancio-caldo)}
.bg-arancio-vivace {color: #FFFFFF; background-color: var(--arancio-vivace)}
.bg-azzurro-reale  {color: #FFFFFF; background-color: var(--azzurro-reale)}
.bg-blue           {color: #FFFFFF; background-color: var(--blue)}
.bg-fucsia         {color: #FFFFFF; background-color: var(--fucsia)}
.bg-giallo-sole    {color: #FFFFFF; background-color: var(--giallo-sole)}
.bg-indaco         {color: #FFFFFF; background-color: var(--indaco)}
.bg-ocra           {color: #FFFFFF; background-color: var(--ocra)}
.bg-rosa-lampone   {color: #FFFFFF; background-color: var(--rosa-lampone)}
.bg-rosso          {color: #FFFFFF; background-color: var(--rosso)}
.bg-rosso-fuoco    {color: #FFFFFF; background-color: var(--rosso-fuoco)}
.bg-verde          {color: #FFFFFF; background-color: var(--verde)}
.bg-verde-acceso   {color: #FFFFFF; background-color: var(--verde-acceso)}
.bg-verde-lime     {color: #FFFFFF; background-color: var(--verde-lime)}
.bg-viola-chiaro   {color: #FFFFFF; background-color: var(--viola-chiaro)}
.bg-viola-orchidea {color: #FFFFFF; background-color: var(--viola-orchidea)}

/* Menù principale */
#menu a{
  color: inherit !important;
}
#menu a:hover{
  color: #017cf3 !important;
}

#menu a:active{
  background-color: inherit;
}

/* Bottoni dashboard */
/* Bottoni Full Width e Split */
.btn-split-full {
  display: flex;
  width: 100%; /* Occupa tutto lo spazio della colonna */
  align-items: stretch;
  padding: 0;
  overflow: hidden;
  border: none;
  transition: all 0.2s ease;
  color: white !important;
  text-decoration: none;
  border-radius: 0.5rem; /* Arrotondamento moderno */
}

.btn-split-full .icon-area {
  background: rgba(0, 0, 0, 0.15);
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 55px;
}

.btn-split-full .text-area {
  padding: 1rem 0.5rem;
  flex-grow: 1;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: start;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.5px;

}

.btn-split-full:hover {
  filter: brightness(115%);

}

.container-big{
  width: 95% !important;
  max-width: 1700px !important;
}