html {
  min-height: 100%;
  //margin-left: calc(100vw - 100%);
}
body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100%;
}
main {
 -webkit-box-flex: 1;
 -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  min-height: 100vh;                 /* fallback per browser vecchi */
  min-height: 100svh;                /* Chrome 108+: altezza realmente visibile */
  min-height: var(--app-h, 100svh);  /* browser datati: altezza reale impostata via JS */
}

.narrow-input {
    width: 100px; /* Puoi modificare questa larghezza secondo le tue esigenze */
}
.tagify__tag {
            font-size: 18px;
}
.tagify__input {
            font-size: 18px;
}
.tagify__dropdown__item {
    font-size: 18px; 
}
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}
.dropdown-item:focus, .dropdown-item:hover {
    color: #16181b;
    text-decoration: none;
    background-color: #f8f9fa;
}
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #007bff;
}

.style1 {
  margin-top: 10px;
  margin-bottom: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.style2 {
  margin-top: 5px;
  margin-bottom: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.style3 {
  margin-top: 10px;
  margin-bottom: 10px;
}
.style4 {
  margin-top: 10px;
  margin-bottom: 10px;
}
.style5 {
  margin-bottom: 0px;
  padding-top: 20px;
  padding-bottom: 0px;
}
.style6 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.style7 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.style8 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.style9 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.style10 {
  margin-top: 25px;
  padding-bottom: 0px;
}
.style11 {
  margin-bottom: 35px;
}
@media (min-width: 1200px) {
.style11 {
    padding-bottom: 20px;
  }
}
@media print and (min-width:7in) and (max-height: 11in) {
    /* on modal open bootstrap adds class "modal-open" to body, so you can handle that case and hide body */
    body.modal-open {
        visibility: hidden;
    }

    body.modal-open .modal .modal-header,
    body.modal-open .modal .modal-body {
        visibility: visible; /* make visible modal body and header */
        width: 100%!important; 
    }
}

.style12 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.style13 {
  margin-left: 5px;
  margin-right: 10px;
  padding: 10px 5px;
}
.style14 {
  margin-bottom: 5px;
  padding-top: 5px;
  padding-bottom: 0px;
}
.style15 {
  padding-left: 10px;
  padding-right: 10px;
}
.style16 {
  padding: 1px 5px;
}
.style17 {
  clear: both;
}
.style18 {
  margin-top: 0px;
  padding-top: 15px;
  padding-bottom: 15px;
}
.style19 {
  padding-top: 10px;
}
.style20 {
  margin-top: 0px;
  padding-top: 10px;
}
.style21 {
  padding-top: 10px;
}

/* ===========================================================
   Videate operative — centratura verticale tra header e footer
   (schermo tipo smartphone / pistola). Header e footer restano fissi.
   Agganciata agli id del body: #shoot = rifornimento + rifornimento-carico,
   #ok = ok + ok2. Cosi' resiste alla rigenerazione di Wappler senza dipendere
   da una classe nel markup. admin-login (#adminlogin) resta escluso.
   =========================================================== */
:root {
  --header-h: 66px;
  --footer-h: 104px;
}

#shoot container,
#ok container {
  display: flex;
  flex-direction: column;
  justify-content: center;   /* centro verticale del contenuto */
  align-items: center;       /* centro orizzontale */
  min-height: 100vh;                 /* fallback per browser vecchi */
  min-height: 100svh;                /* Chrome 108+: altezza realmente visibile */
  min-height: var(--app-h, 100svh);  /* browser datati: altezza reale impostata via JS */
  box-sizing: border-box;
  padding-top: calc(var(--header-h) + 10px);
  padding-bottom: calc(var(--footer-h) + 10px);
}

/* Larghezza tipo smartphone, centrato; sezioni alte quanto il contenuto */
#shoot container > section,
#ok container > section {
  width: 100%;
  max-width: 460px;
  margin-left: auto;
  margin-right: auto;
  flex: 0 0 auto;
}

/* Nasconde lo spacer vuoto iniziale (h4  ) ora che centriamo */
#shoot container > section:first-child,
#ok container > section:first-child {
  display: none;
}

/* Nasconde le immagini spaziatrice (white.jpg) che gonfiavano il blocco */
#shoot container img[src*="white.jpg"],
#ok container img[src*="white.jpg"] {
  display: none;
}

/* ---- Rinfresco leggero: elementi piu' grandi e leggibili per la pistola ---- */
#shoot container .form-control,
#ok container .form-control {
  font-size: 1.15rem;
  height: auto;
  padding: .6rem .8rem;
  border-radius: .6rem;
}
#shoot container .btn-lg,
#ok container .btn-lg {
  font-size: 1.15rem;
  padding: .7rem 1.1rem;
  border-radius: .6rem;
}
#shoot container h5, #shoot container h6,
#ok container h5, #ok container h6 {
  margin-bottom: .6rem;
}