body {
    font-family: 'Atkinson Hyperlegible', sans-serif !important;
}
.atkinson-hyperlegible-regular {
    font-family: "Atkinson Hyperlegible", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.atkinson-hyperlegible-bold {
    font-family: "Atkinson Hyperlegible", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.atkinson-hyperlegible-regular-italic {
    font-family: "Atkinson Hyperlegible", sans-serif;
    font-weight: 400;
    font-style: italic;
}

.atkinson-hyperlegible-bold-italic {
    font-family: "Atkinson Hyperlegible", sans-serif;
    font-weight: 700;
    font-style: italic;
}

:root {
    --openbox-bg-light: 206, 222, 242;
    --openbox-bg-table-hover: 198, 208, 221;
}


.filter-line-separator {
    height: 2px;
    width: 100%;
    margin: 0;
}

.hide {
    display: none !important;
}

.color-square {
    height: 25px;
    min-height: 15px;
    min-width: 15px;
    width: 25px;
}

/* Rimuovi il margine interno dei contenitori dei datepicker */
.input-group .datepicker-wrapper {
    display: flex;
    align-items: center;
    margin-right: -1px; /* Per evitare gap tra gli elementi */
}

/* Rimuovi il border-radius dagli elementi centrali */
.input-group .datepicker-wrapper .form-control {
    border-radius: 0;
}

.bg-light {
    background-color: rgb(var(--openbox-bg-light)) !important;
}
.table-striped td {
    box-shadow: none;
}
.table-striped tbody tr:nth-child(2n-1) {
    background-color: rgb(var(--openbox-bg-light)) !important;
}
.table-striped tbody tr:nth-child(2n-1):hover {
    background-color: rgb(var(--openbox-bg-table-hover)) !important;
}
.table-striped tbody tr:nth-child(2n):hover {
    background-color: rgb(var(--openbox-bg-table-hover)) !important;
}

.no-padding-check .form-check {
    padding-left: 0;
}
/*.ob-table*/

:not(.filter-operator-wrapper) .form-control:read-only:not(:disabled) {
    background-color: var(--ct-tertiary-bg);
    opacity: 1;
}

/*.logo img {*/
/*    height: auto;*/
/*    width: 90%;*/
/*}*/

.macroarea-buttons .macroarea-option {
    width: calc(33.33% - 10px);
    margin-bottom: 10px;
    text-align: center;
    padding: 12px;
    border-radius: 50px;
    cursor: pointer;
    background-color: #e9ecef; /* Colore di base */
    color: #6c757d; /* Testo grigio */
    transition: background-color 0.3s, color 0.3s;
}

.macroarea-option.selected {
    background-color: #0dcaf0; /* Colore selezionato */
    color: #fff;
    font-weight: bold;
}

.macroarea-option:hover {
    background-color: #d4d9dd; /* Colore hover */
}

.side-nav-link > .menu-arrow {
    right: 0;
}

.breadcrumb-container {
    position: sticky;
    top: var(--ct-topbar-height);
    background-color: var(--ct-body-bg);
    z-index: 10;
    min-height: 45px;
}

.leftside-menu {
    box-shadow: none;
}

.dropdown-item {
    text-wrap: auto;
}

a:hover, a > i:hover{
    color: #727cf5;
}

.nav-user-ob {
    padding: 7px;
    background-color: #28385b;
    color: #fff;
    border-radius: 5px;
}

.bg-ob-dopodime {
    background-color: rgba(147, 192, 31, 0.70);
}

.bg-yellow {
    background-color: rgba(255, 248, 205, 0.35);
}

.bg-red {
    background-color: rgba(215, 176, 209, 0.35);
}

.bg-green {
    background-color: rgba(153, 211, 182, 0.35);
}

.icon-red {
    color: #e60032;
}

html[data-layout-mode="detached"]:not([data-layout="topnav"]) .wrapper .footer.footer-ob {
    height: unset;
    top: unset;
    right: unset;
    bottom: unset;
    left: unset;
    padding: 20px 0;
    position: relative;
}

html[data-layout-mode="detached"]:not([data-layout="topnav"]) .wrapper .footer.footer-ob .container-fluid {
    --ct-gutter-x: 1.5rem;
    --ct-gutter-y: 0;
    padding-right: calc(var(--ct-gutter-x) * 0.5);
    padding-left: calc(var(--ct-gutter-x) * 0.5);
}

html[data-layout-mode="detached"]:not([data-layout="topnav"]) .content-page {
    padding-bottom: 0px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: calc(100vh - var(--ct-topbar-height) - 0.75rem - 21.6px - 1.5rem * 0.5);
    padding-top: 0;
    border-radius: 0.3rem;
}

a.btn.bg-primary:hover > i {
    color: #fff;
}
a.btn.bg-primary:hover {
    background-color: #6973e3 !important;
}

a.btn.bg-primary {
    border: none;
}

h1, h2, h3, h4, h5, h6 {
    /*color: rgb(40,70,100);*/
    color: rgb(0,95,152);
}

.card {
    box-shadow: none !important;
}

.ri-notification-3-line {
    /*color: rgb(40,70,100);*/
    color: rgb(0,95,152);
}

.logo-lg img, .logo-sm img {
    display: block;
    height: var(--ct-topbar-height);
    width: auto;
}

@media (min-width: 1141px) {
    .button-toggle-menu {
        display: none;
    }
}

@media (max-width: 1140px) {
    .button-toggle-menu {
        width: 25%;
        text-align: left;
        padding: 0;
    }

    .topbar-menu {
        width: 25%;
    }
}

@media (max-width: 768px) {
    .breadcrumb-container {
        padding: 0 0.75rem;
    }

    html[data-layout-mode="detached"]:not([data-layout="topnav"]) .wrapper .navbar-custom .topbar {
        max-width: calc( 100% - 2 * 0.75rem);
        margin: 0 0.75rem;
    }
}

.breadcrumb-container .uil-home-alt {
    font-size: var(--ct-menu-item-icon-size);
    line-height: var(--ct-menu-item-icon-size);
    display: block;
}

.side-nav .side-nav-item > a.side-nav-link {
    font-size: 16px;
    font-weight: 600;
}

.dropdown .btn:hover {
    color: #fff;
    background-color: #284664;
    border-color: #284664;
}

.dropdown .btn.show {
    color: #fff;
    background-color: #284664;
    border-color: #284664;
}

.bg-primary.selected {
    background-color: #D4D9DD !important;
    color: #000 !important;
}

.nav-pills .nav-link.active {
    background-color: #284664;
}

.nav-pills .nav-link.bg-success.active {
    background-color: #68a28a !important;
}

.border-radius-ob {
    border-radius: 50px;
}

.bg-light-ob {
    background-color: rgb(238,242,247);
}

:root,
[data-bs-theme=light] {
    --ct-danger: #E60032;
    --ct-success: #68A28A;
}

.footer-cards .card {
    min-height: 255px;
}

.footer-cards .card .card-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.table-coperture td {
    padding-top: 2px;
    padding-bottom: 2px;
    padding-right: 2px;
    padding-left: 2px;
}