/*
* demo.css
* File include item demo only specific css only
******************************************************************************/

.menu .app-brand.demo {
  height: 64px;
}

.app-brand-logo.demo svg {
  width: 34px;
  height: 24px;
}

.app-brand-text.demo {
  font-size: 1.375rem;
}

/* ! For .layout-navbar-fixed added fix padding top to .layout-page */
/* Default navbar */
.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
  padding-top: 64px !important;
}
.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal):not(.layout-without-menu) .layout-page {
  padding-top: 72px !important;
}
/* Navbar page z-index issue solution */
.content-wrapper .navbar {
  z-index: auto;
}

/*
* Content
******************************************************************************/

.demo-blocks > * {
  display: block !important;
}

.demo-inline-spacing > * {
  margin: 1rem 0.375rem 0 0 !important;
}

/* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
.demo-vertical-spacing > * {
  margin-top: 1rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-lg > * {
  margin-top: 1.875rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-lg.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-xl > * {
  margin-top: 5rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-xl.demo-only-element > :first-child {
  margin-top: 0 !important;
}

/* Dropdown buttons going out of small screens */
@media (max-width: 576px) {
  #dropdown-variation-demo .btn-group .text-truncate {
    width: 254px;
    position: relative;
  }
  #dropdown-variation-demo .btn-group .text-truncate::after {
    position: absolute;
    top: 45%;
    right: 0.65rem;
  }
}

/*
* Layout demo
******************************************************************************/

.layout-demo-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 1rem;
}
.layout-demo-placeholder img {
  width: 900px;
}
.layout-demo-info {
  text-align: center;
  margin-top: 1rem;
}

/*
* Menu Davide
******************************************************************************/
.menu {
  display: flex;
  /* Perfect Scrollbar */
}

@media (min-width: 1200px) {
  .menu {
    box-shadow: none;
    background-color: transparent;
  }
  
  /* Rimuove la trasparenza solo quando il menu è ristretto */
  .layout-menu-collapsed .menu:hover {
    background-color: var(--bs-menu-bg) !important;
  }
}

body {
  font-size: 13px;
}

/*
* Tabelle Davide
******************************************************************************/
.table-bordered> :not(caption)>* {
  border-width: 1px;
}

.table th {
  letter-spacing: 0px;
  text-transform: capitalize;
}

.table> :not(caption)>*>* {
  padding: 0.782rem 0.8rem;
}

.btn {
  --bs-btn-font-size: 13px;
}

.toast {
  opacity: 1 !important;
}

#toast-container > div {
  opacity: 1 !important; 
}

.noUi-connect {
  background: var(--bs-primary) !important;
}

.menu-item.active > .menu-link:not(.menu-toggle) {
  background: linear-gradient(270deg, rgb(181 212 255) 0%, var(--bs-primary) 50%);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--bs-primary-rgb), 0.3);
  color: var(--bs-menu-active-color);
}

/* --- Pagine pubbliche con il footer legale (login, registrazione, documenti, consensi) ---
   Il body è una colonna alta quanto la finestra: il contenuto si espande, il footer
   resta in fondo e si vede senza scorrere quando il contenuto ci sta. Il wrapper
   Vuexy delle pagine di accesso non deve più occupare 100vh per conto suo, altrimenti
   il footer finisce sempre sotto il bordo. Se il contenuto è più alto della finestra
   (registrazione, documenti lunghi) la pagina scorre come è normale. */
body.con-footer-legale { min-height: 100vh; display: flex; flex-direction: column; }
body.con-footer-legale > .contenuto-pagina { flex: 1 0 auto; display: flex; flex-direction: column; }
body.con-footer-legale .authentication-wrapper { min-height: 0; flex: 1 0 auto; }