@import 'layout_custom_color.css';



/* , h1, form, fieldset, legend, ol, li */
html,
body,
table,
.pagination,
.menubarra,
.submenubarra {
  margin: 0px 5px 0px 5px;
  padding: 0;
}

body,
html {
  font-size: 92%;
  margin-left: auto;
  margin-right: auto;
  font-family: Arial, Verdana, sans-serif;

  background: var(--sfondo-bg);
  color: black;
}

label {
  vertical-align: middle;
}

table {
  border-collapse: collapse;
  white-space: nowrap;
  width: calc(100% - 10px);
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 2px 6px;
}

td.wrap {
  /* Sequences of whitespace will collapse into a single whitespace. 
  Text will wrap when necessary, and on line breaks */
  white-space: pre-line;
}


tr { background-color: var(--sfondo-bg);}

th, tr.row_pari { background-color: #f2f4f5;}
tr.row_disp { background-color: var(--sfondo-bg); }

.row_bulk {
    border-left: 4px solid #ffa726; /* arancione acceso ma non troppo forte */
    background-color: #f9fbfc; /* colore neutro, quasi bianco */
  }

  .row_bulk td {
    padding-left: 8px; /* piccolo spazio per non attaccare il testo al bordo */
  }

tr.row_sep { background-color: var(--sfondo-barra); }
tr.avviso, td.avviso { background-color: var(--bg-avviso); }
tr.allarme, td.allarme { background-color: var(--bg-allarme); }
tr.info, td.info { background-color: var(--bg-info); }
tr.running, td.running { background-color: var(--bg-runnig); }
tr.ok, td.ok { background-color: var(--bg-ok); }
th.last, td.last {
  width: 100%;
  border: none;
  background-color: white;
}
tr.disabled { 
   background-color: var(--bg-disabled);  
    opacity: 0.7;
}

fieldset td.last, fieldset th.last {   background:var(--bg-fieldset); }


.viewlink {
  padding-left: 16px;
  background: url(img/icon-viewlink.svg) 0 1px no-repeat;
}

.changelink {
  padding-left: 16px;
  background: url(img/icon-changelink.svg) 0 1px no-repeat;
}

.addlink {
  padding-left: 16px;
  background: url(img/icon-addlink.svg) 0 1px no-repeat;
}

.arrowlink {
  margin: 0;
  padding: 5px 18px;
  
  width: 32px; /* Aumenta la larghezza per margine aggiuntivo */
  height: 24px; /* Aumenta l'altezza */
  background: url(img/icon-circular.svg) 0 1px no-repeat;
  background-size: 22px 22px;
}

.deletelink {
  padding-left: 16px;
  background: url(img/icon-deletelink.svg) 0 1px no-repeat;
}

.loglink {
  padding-left: 16px;
  background: url(img/icon-loglink.svg) 0 1px no-repeat;
}

.checklink { background: url(img/icon-check_mark.png) no-repeat center; }

/* 18/07/2023 Stella per la riga di default */
.star-icon {
  display: inline-block;
  width: 12px; 
  height: 12px; 
  background-color: yellow; 
  clip-path: polygon(50% 0%, 63% 38%, 100% 38%, 69% 59%, 82% 100%, 50% 75%, 18% 100%, 31% 59%, 0% 38%, 37% 38%);
}


/*  messaggi di conferma e di errore nei form  */


.message { 
  position: relative; 
  margin: 0px 5px 0px 5px;
}

.error {
  border-left: 5px solid #ff0000; /* Evidenzia il bordo sinistro */
  background-color:   #fc8585;
  padding: 12px;
}

.success {
  border-left: 5px solid #07d611c9; /* Evidenzia il bordo sinistro */
  background-color:  #b5f5b8;
  padding: 12px;
}

.warning {
  border-left: 5px solid #ffc107; /* Giallo ambra (bootstrap warning) */
  background-color: #fff3cd;      /* Giallo chiaro pastello */
  padding: 12px;
}

.close-btn {
  position: absolute;
  font-size: 20px;
  cursor: pointer;
  top: 0px;
  right: 0px;
  padding-right: 12px;
  /* 07/06/2023 rimosso transform: translate(-50%, -50%);  */
}


.form-row {
    display: flex;              /* Imposta il contenitore esterno a flex */
    justify-content: space-between; /* Distribuisce lo spazio uniformemente tra i controlli */
    width: 100%;                /* Imposta la larghezza al 100% del contenitore genitore */
}

.custom-form-group {
    display: flex;
    flex-direction: column;  /* Imposta la direzione degli elementi figli in verticale */
    width: 20%;              /* Scegli una larghezza appropriata per il tuo layout */
    margin-bottom: 10px;
    
}

.custom-form-group label {
    width: auto  !important;
    text-align: left !important;
    white-space: nowrap;
    overflow: hidden;     /* Nasconde il testo che supera la larghezza del contenitore */
    text-overflow: ellipsis;  /* Aggiunge puntini di sospensione se il testo è troppo lungo */

}

.custom-form-group input,
.custom-form-group select {
    width: 100%;
    box-sizing: border-box;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}