/*
 * Theme Name: Musei Marche Child
 * Description: Musei Marche Theme based on genesis
 * Author: Argoserv by Sandhills
 * Author URI: https://argoserv.it
 * Version: 1.0.3c
 * Template: genesis
 * Text Domain: museimarche
 **/

body {
    font-family: 'Outfit', san-serif;
    max-width:100%;
}

h4{
    font-size: 18px;
}

.mm-menu-logo {
    min-width:100px;
    max-width:150px;
    height:auto;
}

.mm-image-overlay {
    width:100%;
    height:100%;
    object-fit:cover;
}

.mm-image-overlay-top {
    position:relative;
    z-index: 1;
    border-radius: 18px;
    display: inline-block;
    background: rgb(129 129 129 / 80%);
}

.mm-image-overlay.background-image {
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    /*object-fit:scale-down;*/
}

.mm-login-background {
    background-image: url("../../uploads/2023/09/palazzo-ducale.webp");
    background-position: center;
}

.mm-body--container {
    width:100%;
}

.mm-text-blue {
    color: #4182EB;
}

.mm-bg-blue {
    background: #4182EB;
}

.mm-bg-alarm {
    background: red;
}

.mm-bg-alarm--notification {
    color:red;
    width:50px;
    height:50px;
    border-radius:50%;
    position: absolute;
    top: 0;
    right: 0;
    font-size: 1.5rem;
}

.dashboard-content--card {
    border: solid 3px white
}

.card-widget {
    width:100%;
    min-width:200px;
    flex-grow:1;
}

.dashboard-content--card:hover {
    color:inherit;
    background:blue;
}

.mm-border-alarm {
    border-color: red!important;
}

.mm-text-alarm {
    color: red;
}

.mm-text-black {
    color: black;
}

.mm-bg-lightblue {
    background: #E6EFFE;
}

.mm-bg-lightgrey {
    background: lightgrey;
}

.mm-bg-grey {
    background: grey;
}

.mm-border-radius {
    border-radius:12px;
}

/* NAV */

.nav-link--wrapper > a.nav-link--link {
    border-top-right-radius: 0!important;
    border-bottom-right-radius: 0!important;
}

.nav-link--wrapper > a.nav-link--icon {
    border-top-left-radius: 0!important;
    border-bottom-left-radius: 0!important;
}

ul.nav li.nav-item a[aria-expanded="true"]:not(.collapsed),
ul.nav li.nav-item a[aria-expanded="true"]:not(.collapsed) + a,
ul.nav li.nav-item a[aria-expanded="true"]:not(.collapsed) > a,
ul.nav li.nav-item a[aria-expanded="true"]:not(.collapsed) > .nav-link--wrapper,
ul.nav li.nav-item a[aria-expanded="true"]:not(.collapsed) > .nav-link--wrapper a {
    background: #E6EFFE;
    color: #4182EB;
}

.nav-link {
    border-radius:12px;
}

ul.nav li.nav-item.active > .nav-link--wrapper,
ul.nav li.nav-item.active > .nav-link--wrapper > a,
ul.nav li.nav-item.active > a {
    background: #4182EB!important;
    color: white!important;
}

/* SIDE MENU */

.menu-side--top {
    max-height:100vh;
    overflow-y:auto;
    flex-grow:2;
}

.user-profile--picture {
    width:60px;
    height:60px;
    background: lightgrey;
    border-radius:12px;
}


.mm-side-menu--container {
    transition: all ease 0.3s;
    z-index:9999;
}

.mm-side-menu--container {
    width: 100%;
    min-width:100%;
    height: 100vh;
    position:fixed;
    top:0;
}

.menu-side--nav .nav li a {
    color: #000;
    border-radius: 12px;
}

.menu-side--account-info-item:hover {
    color: #4182EB;
}

.menu-side--nav .nav li {
    margin-bottom: .5rem;
}

.menu-side--nav .nav li a .fa-solid {
    margin-right: 10px;
}

.mm-side-menu--container {
    background:white;
}

.admin-bar .mm-side-menu--container {
    height: calc( 100vh - 32px);
}

.menu-side--nav .submenu {
    list-style-type: none;
    padding-left: 0;
}

.menu-side--nav #nav_accordion .nav-item {
    border-radius:12px;
    margin-top:5px;
}

.menu-side--nav .nav li a[aria-expanded="true"],
.menu-side--nav .nav li:hover > a,
.menu-side--nav .nav li:hover > .nav-link--wrapper {
    background: #f4f6f8;
    color: black;
    border-radius:12px;
}

.nav-link--wrapper {
    border-radius:12px;
}

.menu-side--nav .nav li.active > a,
.menu-side--nav .nav li.active > .nav-link--wrapper,
.menu-side--nav .nav li.active > .nav-link--wrapper a {
    background: #E6EFFE;
    color: #4182EB;
}

.menu-side--nav .nav li a[aria-expanded="true"] span.float-end > .fa-solid:before {
    content: "\f106";
}

@media screen and (max-width:1199px) {
    .mm-menu-slide--toggle-on-mobile {
        transition: all ease 0.3s;
        transform: translateX(-100%);
    }
    .admin-bar .mm-side-menu--container {
        margin-top:32px;
    }
    .mm-storico-allarmi:nth-of-type(odd) {
        background-color: #E5E5E5;
    }
}

@media screen and (min-width:1200px) {

    .mm-side-menu--container {
        height: 100vh;
    }

    .mm-side-menu--container {
        width: 320px;
        min-width:320px;
        height: 100vh;
        position:sticky;
    }

    .admin-bar .mm-side-menu--container {
        height: calc( 100vh - 32px);
        top:32px;
    }


    .mm-menu-slide {
        transition: all ease 0.3s;
        right:0;
        margin-left:-100%;
    }

    .mm-menu-slide--toggle-on-desktop {
        margin-left:0;
    }

    .border-end-xl {
        border-right: solid 1px;
    }

}

/* BREADCRUMB */
.mm-breadcrumb--wrapper {
    background: #e6e6e6;
}

.mm-breadcrumb--wrapper a {
    text-decoration: none;
    color:black;
}

.mm-highlight {
    width: 10px;
    height: 10px;
    background-color: red;
    border-radius: 50%;
    position: absolute;
    top: 0;
    right: -5px;
}

.mm-highlight-sensor {
    width: 15px;
    height: 15px;
    background-color: red;
    border-radius: 50%;
    position: absolute;
    top: -4px;
    left: -4px;
}

/* UTILITIES */

.cursor-pointer {
    cursor:pointer;
}

.text-decoration-none {
    text-decoration:none;
}

/* dashboard body */

.mm-dashboard-container {
    background: #F4F6F8;
}

.text-decoratio {
    text-decoration:none;
}

.mm-download-button {
    border-radius:12px;
}

.mm-dropdown {
    max-height:0vh;
    transition: all ease 0.3s;
    overflow:hidden;
    position: absolute;
    z-index: 10;
    box-shadow: 7px 10px 37px -3px rgb(141 141 141 / 50%);
    cursor: pointer;
}

.mm-download-button--dropdown.open .mm-download-more > * {
    transform:rotate(180deg);
    transition: rotate ease 0.3s;
}

.mm-download-button--dropdown .mm-download-more > * {
    transition: rotate ease 0.3s;
}

.mm-download-button--dropdown.open .mm-dropdown {
    max-height:100vh;
    transition: all ease 0.3s;
}

.mm-dropdown--link:hover {
    background:#E6EFFE;
}

.mm-sensor-button {
    min-width:140px;
}

.mm-sensor-data {
    min-width:150px;
}

.mm-button-icon {
    border:solid 1px #CECECE;
    color: black;
    background-color:white;
}

.mm-button-icon .mm-button-icon--icon {
    color: #4182EB;
}

.mm-button-icon.active {
    border:solid 1px #4182EB;
    color: black;
    background-color: #4182EB;
}

.mm-button-icon.active .mm-button-icon--icon {
    color: white;
}

.mm-button-icon.active {
    border:solid 1px transparent;
    background-color: #4182EB;
    color: white;
}

.circle-icon {
    min-width:70px;
    min-height:70px;
    width: 70px;
    height:70px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    font-size:1.5rem;
}

.circle-icon-white {
    background:white;
    color:#4182EB;
}

.circle-icon-alarm {
    background:white;
    color:red;
}

.circle-icon-grey {
    background:#E6EFFE;
    color:#4182EB;
}

input.mm-sensor-checkbox {
    width: 1.3em;
    height: 1.3em;
    border:solid 1px red;
    vertical-align: text-bottom;
}

.text-inherit {
    color:inherit;
}

.dashboard-content--card {
    transition: all ease 0.3s;
}

.dashboard-content--card:hover {
    transition: all ease 0.3s;
    transform:scale(1.02);
}

/* BODY MENU SLIDE IN ANIMATION */

#body-menu.is-fixed {
    position:fixed;
    z-index:999;
    top:0;
    transition: top ease 0.3s;
}

#body-menu {
    top:-100%;
    transition: top ease 0.3s;
}

/*  PAGINA STANZA  */

.mm-btn-sensor {
    width: 100%;
    height:50px;
    position: relative;
    text-align:left;
}

.mm-btn-sensor:hover, .mm-btn-sensor.selected {
    background: #0d6efd;
    color: white;
}

.mm-btn-sensor span{
    position: absolute;
    bottom: 20%;
    right: 13px;
    transform: translateX(8px);
    background-color: white;
    font-size: 14px;
    line-height: 0;
    font-weight: 500;
    color: blue;
    padding: 1em 0.7em;
    border-radius: 5px;
}

.mm-container-icon img {
    width: 80px;
}

.col-lg-border {
    padding-top: 3em;
    padding-bottom: 3em;
    border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
    border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
}

@media screen and (min-width: 992px) {

    .mm-btn-sensor {
        width: 80%;
    }
    .col-lg-border {
        padding-top: 0;
        padding-bottom: 0;
        border-top: 0!important;
        border-bottom: 0!important;
        border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
    }

}



/* GRAPHS CSS */
/* GAUGE */
.gauge.highcharts-figure,
.gauge .highcharts-data-table table {
    min-width: 150px;
    max-width: 300px;
    margin: 10px auto 0 auto;
}

.gauge .highcharts-data-table table {
    font-family: Verdana, sans-serif;
    border-collapse: collapse;
    border: 1px solid #ebebeb;
    margin: 10px auto;
    text-align: center;
    width: 100%;
    max-width: 500px;
}

.gauge .highcharts-data-table caption {
    padding: 1em 0;
    font-size: 1.2em;
    color: #555;
}

.gauge .highcharts-data-table th {
    font-weight: 600;
    padding: 0.5em;
}

.gauge .highcharts-data-table td,
.gauge .highcharts-data-table th,
.gauge .highcharts-data-table caption {
    padding: 0.5em;
}

.gauge .highcharts-data-table thead tr,
.gauge .highcharts-data-table tr:nth-child(even) {
    background: #f8f8f8;
}

.gauge .highcharts-data-table tr:hover {
    background: #f1f7ff;
}

.modal-backdrop{
    z-index: 10 ;
}

.mm-download-button.dropdown-disabled {
    pointer-events: none;
    background-color: rgb(100, 100, 100, 0.3) !important;
}

.h-130{
    height: 130px !important;
}

.mm-notification-list:nth-child(odd) {
    background-color: rgba(246, 246, 246, 0.96);
}

.mm-notification-list:nth-child(even) {
    background-color: #fff;
}

.img-object-contain{
    object-fit: contain;
}

.modal-content-notes{
    max-width: 60%;
}

.line-note{
    text-align: left;
}
@media screen and (max-width:768px) {
    .logo-sx.ps-4 img{
        padding-left: 1rem !important;
        max-width: 40px;
    }

    .logo-dx img {
        max-width: 40px;
    }

}