
* {
    box-sizing: border-box;
}

*:focus,
*:focus-within {
    box-shadow: none !important;
}

body {
    background-color: var(--light-grey);
    font-family: "Inter", sans-serif !important;
}

.main-content-wrapper {
    padding-inline: 0 !important;
}

p {
    margin: 0;
    font-size: 15px;
    color: var(--dark-blue);
    font-weight: var(--font-weight-regular);
    line-height: 1.5;
}

a {
    text-decoration: none !important;
}

h1,
h2 {
    font-weight: var(--font-weight-bold);
    line-height: 1.2;
}

h1 {
    font-size: 27px;
    color: var(--medium-blue);
    margin-bottom: 30px;
    margin-top: 50px;
}

h2 {
    font-size: 22px;
    color: var(--dark-blue);
}

h3 {
    font-size: 16px;
    color: var(--dark-blue);
    font-weight: var(--font-weight-semibold);
}

.page-description {
    margin-bottom: 40px;
}

h1:has(+ .page-description) {
    margin-bottom: 10px;
}


/* SIDEBAR */

.sidebar {
    width: var(--sidebar-width);
    height: 100vh;
    background-color: var(--dark-blue);
    transition: width 0.3s ease;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
}

.sidebar-header {
    padding: 20px 29px;
    text-align: left;
}

.sidebar-link i.nav-icon {
    min-width: 32px;
    font-size: 18px;
    text-align: center;
}

.sidebar.collapsed {
    width: var(--sidebar-width-collapsed);
}

.sidebar-nav {
    overflow-y: auto;
    flex-grow: 1;
}

.sidebar-nav>li {
    padding: 6px 12px
}

.sidebar-nav>li ul.collapsing,
.sidebar-nav>li ul.show {
    padding-top: 0;
    padding-bottom: 0;
    height: auto;
    transition: all 0.3s ease;
}

.sidebar-nav>li ul.collapsing>li,
.sidebar-nav>li ul.show>li {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
    height: auto;
    transition: all 0.3s ease;
}

.sidebar-nav>li ul.collapsing>li:first-of-type,
.sidebar-nav>li ul.show>li:first-of-type {
    padding-top: .6rem;
}

.sidebar-nav>li ul.collapsing>li:last-of-type,
.sidebar-nav>li ul.show>li:last-of-type {
    padding-bottom: .6rem;
}

.sidebar-nav>li ul:not(.show) {
    padding-top: 0;
    padding-bottom: 0;
    height: 0;
    overflow: hidden;
    transition: all 0.3s ease;
}

.sidebar-link {
    display: flex;
    align-items: center;
    align-content: center;
    color: var(--blue-grey);
    transition: all 0.2s ease;
    border-radius: 0;
    margin: 0;
    padding: 10px 12px;
    overflow: hidden;
    text-decoration: none;
    font-size: 15px;
    line-height: 22px;
    font-weight: var(--font-weight-medium);
    border-radius: var(--border-radius-small);
}

.sidebar-link:hover,
.sidebar-link.active {
    color: var(--light-grey);
    background: var(--medium-blue);
}

.sidebar-link .menu-text {
    transition: opacity 0.2s ease, visibility 0.2s ease;
    margin-left: 5px;
}

.sidebar.collapsed .sidebar-link .menu-text {
    opacity: 0;
    visibility: hidden;
    width: 0;
}

.sidebar.collapsed .sidebar-link i.nav-icon {
    margin-right: 0;
}

.sidebar ul {
    padding-left: 0;
}

.sidebar ul#adminSubmenu>li>.sidebar-link {
    padding-left: 12px;
}

.sidebar ul#adminSubmenu>li>ul>li>.sidebar-link {
    padding-left: 50px;
}

.sidebar ul ul a {
    padding-left: 50px;
    font-size: 15px;
    font-weight: var(--font-weight-regular);
}

.sidebar ul ul ul a {
    padding-left: 83px;
    font-size: 15px;
}

.sidebar ul ul a:hover {
    background-color: var(--medium-blue);
}

.sidebar .dropdown-toggle::after {
    content: '\f054';
    font-family: 'Font Awesome 6 PRO';
    font-weight: var(--font-weight-regular);
    font-size: 16px;
    display: inline-block;
    margin-left: auto;
    transition: transform 0.3s ease;
    border: none;
}

.sidebar.collapsed .dropdown-toggle::after {
    display: none;
}

.sidebar .dropdown-toggle[aria-expanded="true"]::after {
    transform: rotate(90deg);
}

.sidebar-separator hr {
    border-top: 1px solid var(--blue-grey);
    margin: 0.75rem 1.5rem;
}

.sidebar.collapsed .sidebar-separator hr {
    margin: 0.75rem 0.5rem;
}

/* Hide scrollbar for chrome, safari, opera */
.sidebar-nav::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge, Firefox */
.sidebar-nav {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Regola per la voce Admin quando attiva */
.sidebar-link.admin-menu-item.active {
    background: var(--light-grey) !important;
    color: var(--medium-blue) !important;
}


/* MAIN CONTENT */

.main-content {
    margin-left: var(--sidebar-width-collapsed);
    width: calc(100% - var(--sidebar-width-collapsed));
    position: relative;
    padding-inline: 60px;
}

/* Quando la sidebar è collapsed, aggiorna il main-content */
.sidebar.collapsed~.main-content {
    margin-left: var(--sidebar-width-collapsed);
    width: calc(100% - var(--sidebar-width-collapsed));
}


/* HEADER */

header {
    background-color: var(--medium-blue);
    margin-top: 16px;
    border-radius: var(--border-radius-small);
    padding: 9px 30px;
}


/* ICONS */

.icons-header {
    gap: 15px;
}

.icons-header a.icon-header {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border: 1px solid transparent;
}

.icons-header a.icon-header:hover {
    border: 1px solid var(--white);
}

.icons-header a.icon-header i {
    color: var(--white);
    font-size: 20px;
}

.icons-header a.user {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--white);
    transition: all 0.3s ease;
}

.icons-header a.user:active,
.icons-header a.user:hover {
    background-color: var(--medium-blue);
    border: 1px solid var(--white);
}

.icons-header a.user:active i,
.icons-header a.user:hover i {
    color: var(--white);
}

.icons-header a.user i {
    color: var(--medium-blue);
    font-size: 16px;
    transition: all 0.3s ease;
}

.k-badge-edge.k-top-end {
    transform: translate(-45%, 40%);
}


/*USER DROPDOWN*/

.icons-header .dropdown-menu.user-menu {
    margin-top: 20px !important;
    border: 1px solid var(--blue-grey);
    min-width: 220px !important;
    padding: 0;
    left: auto;
    right: 0;
}

.icons-header .dropdown-menu.user-menu .user-info,
.user-actions {
    padding: 15px 25px;
}

.icons-header .dropdown-menu.user-menu p,
.icons-header .dropdown-menu.user-menu a {
    font-size: 15px;
    font-weight: var(--font-weight-medium);
    color: var(--dark-blue);
}

.icons-header .dropdown-menu.user-menu p.user-type {
    font-size: 13px;
    color: var(--medium-blue);
    margin-top: 4px;
}

.icons-header .dropdown-menu.user-menu .user-actions i {
    font-size: 18px;
    padding-right: 15px;
}

.icons-header .dropdown-menu.user-menu .user-actions a {
    display: inline-block;
    padding-top: 10px;
    padding-bottom: 10px;

}

.icons-header .dropdown-menu.user-menu .btn-container {
    padding: 15px 15px;
    text-align: center;
}

.icons-header .dropdown-menu.user-menu .btn-container .primary-btn {
    padding-inline: 74px;
    margin-top: 0;
}

.icons-header .dropdown-menu.user-menu hr {
    color: var(--blue-grey);
    opacity: 1;
    margin: 0;
}

/*********************************************************/


/* DASHBOARD */

.dashboard {
    margin-top: 24px;
    margin-bottom: 24px;
}

.dashb-panel {
    border-radius: var(--border-radius-base);
    padding: 30px 20px;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}

.two-panels-row>div>div,
.two-panels-row>div>div .dashb-panel {
    height: 100%;
}

.values {
    margin-top: 20px !important;
    position: inherit;
}

.values.values-nd-row {
    margin-top: 60px !important;
}

.values .col-bottom-line::after,
.dashb-assets .col-bottom-line::after,
.dashb-site .col-bottom-line::after,
.dashb-contracts .col-bottom-line::after {
    content: "";
    display: block;
    width: 100%;
    height: 5px;
    margin-top: 10px;
    background-color: var(--medium-blue);
}

.dashb-assets .col-bottom-line::after {
    background-color: var(--dark-blue);
}

.dashb-site .col-bottom-line::after,
.dashb-contracts .col-bottom-line::after {
    background-color: var(--blue-grey);
}

.col-bottom-line p,
.values .col p {
    display: inline-block;
}

.values .col p {
    text-transform: capitalize;
}

.panel-title {
    font-size: 27px;
    font-weight: var(--font-weight-bold);
    color: var(--dark-blue);
}

.dashb-num {
    font-size: 72px;
    font-weight: var(--font-weight-bold);
    margin-right: 20px;
}

.dashb-num-description,
.table-title span {
    display: inline-block;
}

.dashb-num-description {
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    max-width: 200px;
}

.dashb-num-description span,
.table-title span {
    font-size: smaller;
    font-weight: var(--font-weight-medium);
}

.dashboard .btn-container {
    text-align: end;
}

.primary-btn {
    display: inline-block;
    margin-top: 20px;
}

.dashb-devices,
.dashb-alarms,
.dashb-operators,
.dashb-customer,
.dashb-assets,
.dashb-site,
.dashb-contracts {
    position: relative;
}

.dashb-devices .dashb-num,
.dashb-alarms .dashb-num,
.dashb-operators .dashb-num,
.dashb-devices .dashb-num-description,
.dashb-alarms .dashb-num-description,
.dashb-operators .dashb-num-description,
.dashb-customer .dashb-num,
.dashb-customer .dashb-num-description {
    color: var(--pink-primary);
}

.dashb-devices::before,
.dashb-alarms::before,
.dashb-operators::before,
.dashb-customer::before,
.dashb-assets::before,
.dashb-site::before,
.dashb-contracts::before {
    content: "";
    display: inline-block;
    position: absolute;
    right: 20px;
    top: 30px;
    background-repeat: no-repeat;
    background-position: center center;
}

.dashb-devices,
.dashb-alarms,
.dashb-operators,
.dashb-customer {
    background-color: var(--white);
}

.dashb-devices::before {
    background-image: url('../images/dashboard-devices.svg');
    width: 140px;
    height: 123px;
}

.dashb-alarms::before {
    background-image: url('../images/dashboard-alarms.svg');
    width: 123px;
    height: 140px;
}

.dashb-operators::before {
    background-image: url('../images/dashboard-operators.svg');
    width: 175px;
    height: 140px;
}

.dashb-customer::before {
    background-image: url('../images/dashboard-customer.svg');
    width: 157px;
    height: 141px;
}

/* ASSETS */
.dashb-assets {
    background-color: var(--blue-grey);
}

.dashb-assets .dashb-num,
.dashb-assets .dashb-num-description {
    color: var(--dark-blue);
}

.dashb-assets::before {
    background-image: url('../images/dashboard-assets.svg');
    width: 175px;
    height: 140px;
}

/* SITE + CONTRACTS */
.dashb-site,
.dashb-contracts {
    background-color: var(--dark-blue);
}

.dashb-site .panel-title,
.dashb-site .dashb-num,
.dashb-contracts .panel-title,
.dashb-contracts .dashb-num,
.dashb-contracts .dashb-num-description {
    color: var(--blue-grey);
}

.dashb-site::before {
    background-image: url('../images/dashboard-site.svg');
    width: 105px;
    height: 140px;
}

.dashb-contracts::before {
    background-image: url('../images/dashboard-contracts.svg');
    width: 105px;
    height: 140px;
}

.dashb-site::after {
    content: "";
    display: inline-block;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    background: url('../images/site_svg.svg') no-repeat center center;
    background-size: cover;
    height: 100%;
    border-radius: var(--border-radius-base);
}

.abs-btn-row {
    position: relative;
    z-index: 999;
}

/* DASHBOARD: TABELLA SCROLLABLE DENTRO PANELS */
.dashb-table {
    overflow: hidden;
    border-radius: var(--border-radius-small);
    margin-top: 20px;
    border: 1px solid var(--blue-grey);
}

.dashb-table-row {
    border-radius: var(--border-radius-small);
    margin-top: auto !important;
}

.dashb-table-row.two-rows {
    flex-wrap: nowrap;
    gap: 20px;
}

.dashb-table-row.two-rows .table-list {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.dashb-table-row.two-rows .table-list ul {
    column-count: 1;
}

.dashb-table-row .dashb-table.table-1-of-2,
.dashb-table-row .dashb-table.table-2-of-2 {
    flex: auto;
}

.dashb-table .table-title {
    background-color: var(--light-grey);
    padding: 10px 20px;
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: var(--dark-blue);
}

.dashb-table .table-list {
    background-color: var(--white);
    padding-inline: 20px;
    padding-bottom: 20px;
    padding-top: 10px;
    max-height: 200px;
    overflow-y: auto;
    height: 100%;
}

.table-list ul {
    column-count: 2;
    column-gap: 80px;
    list-style-type: none;
    padding: 0;
}

.table-list ul.one-column-list {
    column-count: 1;
}

.table-list ul li {
    font-size: 18px;
    font-weight: var(--font-weight-regular);
    text-transform: uppercase;
    color: var(--dark-blue);
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--blue-grey);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.table-list ul li span {
    font-weight: var(--font-weight-bold);
}

.dashb-alarms .alarms-types-row {
    margin-top: 20px;
    display: flex;
}

.dashb-alarms .alarm-type {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.dashb-alarms .alarm-type::after {
    content: "";
    display: block;
    width: 100%;
    height: 5px;
    margin-top: 10px;
}

.dashb-alarms .alarm-type.shock-type::after {
    background-color: var(--shock-red);
}

.dashb-alarms .alarm-type.antit-type::after {
    background-color: var(--antit-yellow);
}

.dashb-alarms .alarm-type.check-type::after {
    background-color: var(--check-blue);
}

.dashb-alarms .alarm-type .dashb-icon-container {
    width: 48px;
    height: 48px;
    border: none;
    border-radius: var(--border-radius-small);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
}

.dashb-alarms .alarm-type.shock-type .dashb-icon-container {
    background-color: var(--shock-red);
}

.dashb-alarms .alarm-type.antit-type .dashb-icon-container {
    background-color: var(--antit-yellow);
}

.dashb-alarms .alarm-type.check-type .dashb-icon-container {
    background-color: var(--check-blue);
}

.dashb-alarms .alarm-type .dashb-icon-container i {
    color: var(--white);
    font-size: 24px;
}

.dashb-alarms .alarm-type .dashb-num-sm {
    font-size: 40px;
    font-weight: var(--font-weight-bold);
    margin-top: 20px;
}

.dashb-alarms .alarm-type.shock-type .dashb-num-sm {
    color: var(--shock-red);
}

.dashb-alarms .alarm-type.antit-type .dashb-num-sm {
    color: var(--antit-yellow);
}

.dashb-alarms .alarm-type.check-type .dashb-num-sm {
    color: var(--check-blue);
}

.dashb-alarms .alarm-type .dashb-num-sm-description {
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    color: var(--dark-blue);
}

/* FOOTER */
.footer-line {
    margin-top: 20px;
    margin-bottom: 20px;
    padding-inline: 60px;
    margin-left: var(--sidebar-width-collapsed);
    width: 100%;
}

.footer-line p {
    font-size: 15px;
    font-weight: var(--font-weight-regular);
}

.footer-line p a {
    color: var(--dark-blue);
}

.fixed-footer {
    position: fixed;
    bottom: 0;
    z-index: 1;
    width: calc(100% - var(--sidebar-width-collapsed));
}


/************************************************************************************/

/* COMPONENTI TELERIK */


/* SPINNER LOADER */

.k-loader {
    color: var(--dark-blue) !important;
}


/* GRID */

.grid-wrapper,
.k-wizard .k-wizard-step,
#map_wrapper,
.map-wrapper,
.filter .k-form,
.report-panel,
.checklist-panel__content,
.checklist-panel__description {
    background-color: var(--white);
    border-radius: var(--border-radius-base);
    padding: 20px;
}

.grid-wrapper:has(.k-toolbar):not(:has(.form-inline)) {
    padding-top: 0;
}

.k-grid {
    margin-bottom: 0;
    border-spacing: 0;
    border-collapse: separate;
    border: none;
    overflow: hidden;
}

.k-grid .k-grid-header {
    background-color: var(--medium-grey);
    margin-top: 0;
    padding-top: 0;
    border-top-left-radius: var(--border-radius-base);
    border-top-right-radius: var(--border-radius-base);
}

.k-toolbar {
    position: relative;
}

.k-toolbar.k-toolbar-resizable {
    height: 80px;
}

.k-grid .k-cell-inner {
    min-width: fit-content;
}

.k-grid .k-grid-table {
    margin-bottom: 20px;
}

.k-grid-header-wrap {
    border-top-left-radius: var(--border-radius-base);
    border-top-right-radius: var(--border-radius-base);
}

.k-grid-header-table th.k-table-th,
.k-grid-table td.k-table-td {
    border-bottom: 1px solid var(--medium-grey) !important;
}

.k-grid .k-table-th.k-sorted {
    background-color: var(--light-blue);
}

.k-grid .k-table-th.k-sorted .k-grid-column-menu {
    background-color: var(--light-blue) !Important;
}
 

.k-grid-header-table tr th:first-child,
.k-grid-table tr td:first-child {
    border-left: 1px solid var(--medium-grey) !important;
}

.k-grid-header-table tr th:last-child,
.k-grid-table tr td:last-child {
    border-right: 1px solid var(--medium-grey);
}

.k-grid-header-table tr th.k-table-th {
    border-top: 1px solid var(--medium-grey);
}

.k-grid-header-table tr th.k-table-th .k-grid-header-menu {
    height: auto;
    width: auto;
    border-radius: var(--border-radius-small);
    margin: 0;
}

.k-grid-header-table tr th.k-table-th .k-grid-header-menu:hover {
    background-color: var(--light-grey) !important;

}

.k-grid-header-table tr:first-child th:first-child {
    border-top-left-radius: var(--border-radius-base);
}

.k-grid-header-table tr:first-child th:last-child {
    border-top-right-radius: var(--border-radius-base);
}

.k-grid-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: var(--border-radius-base);
}

.k-grid-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: var(--border-radius-base);
}

.k-grid-header-table thead th.k-table-th {
    padding: 25px 10px !important;
    background-color: var(--medium-grey);
}

.k-grid-table td.k-table-td:has(img),
.k-grid-table td.k-table-td:has(> i),
.k-grid-table td.k-table-td:has(.k-checkbox) {
    text-align: center;
}

.k-grid th.k-table-th:has(.k-checkbox) {
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-grid th.k-table-th:has(.k-checkbox) label.k-no-text {
    margin: 0;
}

table colgroup col {
    width: 200px;
}

.k-grid-header-table th.k-table-th i {
    margin-left: 5px;
}

.k-grid-header-table th.k-table-th {
    font-weight: 600;
}

.k-grid-header-table th.k-table-th
/* , .k-grid-header-table th.k-table-th i */ { 
    font-size: 16px;
    color: var(--dark-blue);
}

.k-grid-header-table .k-link svg {
    fill: var(--dark-blue);
}

.k-grid-table td.k-table-td {
    font-size: 16px;
    line-height: 1.5;
    font-weight: var(--font-weight-regular);
    color: var(--dark-blue);
    vertical-align: middle;
    white-space: normal;
    overflow-wrap: break-word;
    padding: 10px;
}

.k-grid-table tbody tr.k-table-alt-row {
    background-color: var(--light-grey) !important;
}

.k-table-row.k-selected .k-table-td,
.k-table-row:hover .k-table-td {
    background-color: var(--light-blue) !important;
}

/* TD CHECKLIST */

.k-grid-table td.k-table-td.answer-red,
.k-grid-table td.k-table-td.answer-red i,
.answer-red {
    color: var(--red) !important;
}

.k-grid-table td.k-table-td.answer-green,
.k-grid-table td.k-table-td.answer-green i,
.answer-green {
    color: var(--green) !important;
}

.k-grid-table td.k-table-td.answer-yellow,
.k-grid-table td.k-table-td.answer-yellow i,
.answer-yellow {
    color: var(--yellow) !important;
}

.k-grid-table td.k-table-td.td-answer {
    text-align: left;
}

.k-grid-table td.k-table-td.td-answer i {
    font-size: 16px;
    margin-right: 6px;
}


/* TOOLTIP */

.k-tooltip {
    background-color: var(--dark-blue);
    padding: 6px 8px;
    border-radius: 6px;
    margin: 10px;
    width: max-content;
}

.k-tooltip .k-tooltip-content p{
    font-size: 12px;
    font-weight: var(--font-weight-regular);
    color: var(--white);
}

/* BUTTONS */

.grid-bottom-btn-container {
    display: flex;
    flex-direction: row;
    justify-content: end;
    gap: 20px;
    margin-top: 20px;
}

.k-button,
.primary-btn {
    padding: 8px 30px;
    transition: all 0.3s ease;
    box-sizing: border-box;
    border-radius: 0;
    border: 1px solid;
    transition: all 0.3s ease;
}

.k-button .k-button-text,
.k-button-solid-base,
.k-button-solid-primary,
.primary-btn {
    font-size: 16px !important;
    font-weight: var(--font-weight-semibold) !important;
}

.k-button.k-button-solid-base {
    background-color: var(--white);
    border-color: var(--medium-grey) !important;
}

.k-button.k-button-solid-base .k-button-text,
.k-button.k-button-solid-base .k-button-icon.k-svg-i-cancel,
.k-button.k-button-solid-base .k-button-icon.k-svg-i-undo,
.k-button.k-button-solid-base .k-svg-i-filter-clear {
    color: var(--pink-primary);
}

.k-button.k-button-solid-base:hover {
    background-color: var(--medium-grey);
    color: var(--dark-blue) !important;
}

.k-button.k-button-solid-base:hover .k-button-text,
.k-button.k-button-solid-base:hover .k-button-icon {
    color: var(--dark-blue);
}

.k-button.k-button-solid.k-button-solid-primary,
.k-button-solid-primary,
.primary-btn {
    background-color: var(--pink-primary) !important;
    color: var(--white) !important;
    border-color: var(--pink-primary) !important;
}

.k-button.k-button-solid.k-button-solid-primary:hover,
.k-button-solid-primary:hover,
.primary-btn:hover {
    background-color: var(--dark-blue) !important;
    border-color: var(--dark-blue) !important;
    color: var(--white) !important;
}

.k-button-solid-primary:focus,
.k-button-solid-primary.k-focus,
.k-button-solid-base:focus {
    box-shadow: none;
}

.k-button.k-button-solid.k-button-solid-primary .k-button-text,
.k-button-solid-primary,
a.k-grid-add.k-button-solid-primary:hover,
.k-button.k-button-solid.k-button-solid-primary:hover .k-button-icon,
.k-button-solid-primary:hover .k-button-icon {
    color: var(--white) !important;
}

.k-button-solid-primary:focus-visible,
.k-button-solid-base:focus-visible {
    outline: 2px solid var(--medium-blue);
    outline-offset: 2px;
}

/* regole pulsanti differenti dashboad, posti qui, 
dopo la definizione di primary-btn generico per sovrascriverne le regole */

.dashb-site .primary-btn,
.dashb-contracts .primary-btn {
    background-color: var(--white) !important;
    border-color: var(--medium-grey) !important;
    color: var(--pink-primary) !important;
}

.dashb-site .primary-btn:hover,
.dashb-contracts .primary-btn:hover {
    background-color: var(--medium-grey);
    color: var(--dark-blue) !important;
}

/* BTN CON ICONA FONT AWESOME */
.k-button i {
    font-size: 16px;
    margin-right: 5px;
    color: var(--white);
}

.k-grid-add {
    position: absolute;
    left: 0;
}


/* TABSTRIP */

.k-tabstrip-top{
    margin-top:50px;
}

.k-tabstrip .k-tabstrip-items-wrapper {
    border: none;
}

.k-tabstrip-item+.k-tabstrip-item {
    margin-left: -10px;
}

.k-tabstrip .k-tabstrip-items .k-tabstrip-item {
    padding: 15px 30px;
    background-color: var(--light-grey);
    border-top-left-radius: var(--border-radius-base);
    border-top-right-radius: var(--border-radius-base);
    text-align: center;
    box-shadow: var(--box-shdw);
    border: none;
    z-index: 1;
    position: relative;
}

.k-tabstrip .k-tabstrip-items .k-tabstrip-item .k-link {
    padding: 0;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: var(--font-weight-semibold);
    color: var(--dark-grey);
    transition: all 0.3s ease;
}

.k-tabstrip .k-tabstrip-items .k-tabstrip-item.k-active .k-link {
    color: var(--pink-primary);
}

.k-tabstrip .k-tabstrip-items .k-tabstrip-item:hover .k-link {
    color: var(--pink-primary);

}

.k-tabstrip .k-tabstrip-items .k-tabstrip-item.k-active {
    background-color: var(--white);
    z-index: 100;
}

.k-tabstrip .k-tabstrip-content {
    border: none;
    border-top-right-radius: var(--border-radius-base);
    border-bottom-left-radius: var(--border-radius-base);
    border-bottom-right-radius: var(--border-radius-base);
    background-color: var(--white);
    padding: 20px;
    z-index: 101;
}

.k-tabstrip .k-tabstrip-content:focus {
    outline: none;
}

.k-tabstrip-items>.k-item:nth-child(1) {
    z-index: 25;
}

.k-tabstrip-items>.k-item:nth-child(2) {
    z-index: 24;
}

.k-tabstrip-items>.k-item:nth-child(3) {
    z-index: 23;
}

.k-tabstrip-items>.k-item:nth-child(4) {
    z-index: 22;
}

.k-tabstrip-items>.k-item:nth-child(5) {
    z-index: 21;
}

.k-tabstrip-items>.k-item:nth-child(6) {
    z-index: 20;
}

.k-tabstrip-items>.k-item:nth-child(7) {
    z-index: 19;
}

.k-tabstrip-items>.k-item:nth-child(8) {
    z-index: 18;
}

.k-tabstrip-items>.k-item:nth-child(9) {
    z-index: 17;
}

.k-tabstrip-items>.k-item:nth-child(10) {
    z-index: 16;
}

.k-tabstrip-items>.k-item:nth-child(11) {
    z-index: 15;
}

.k-tabstrip-items>.k-item:nth-child(12) {
    z-index: 14;
}

.k-tabstrip-items>.k-item:nth-child(13) {
    z-index: 13;
}

.k-tabstrip-items>.k-item:nth-child(14) {
    z-index: 12;
}

.k-tabstrip-items>.k-item:nth-child(15) {
    z-index: 11;
}

.k-tabstrip-items>.k-item:nth-child(16) {
    z-index: 10;
}

.k-tabstrip-items>.k-item:nth-child(17) {
    z-index: 9;
}

.k-tabstrip-items>.k-item:nth-child(18) {
    z-index: 8;
}

.k-tabstrip-items>.k-item:nth-child(19) {
    z-index: 7;
}

.k-tabstrip-items>.k-item:nth-child(20) {
    z-index: 6;
}

.k-tabstrip-items>.k-item:nth-child(21) {
    z-index: 5;
}

.k-tabstrip-items>.k-item:nth-child(22) {
    z-index: 4;
}

.k-tabstrip-items>.k-item:nth-child(23) {
    z-index: 3;
}

.k-tabstrip-items>.k-item:nth-child(24) {
    z-index: 2;
}

.k-tabstrip-items>.k-item:nth-child(25) {
    z-index: 1;
}


/* PAGER + INPUT, SELECT, PICKER */

.k-pager {
    background-color: var(--white);
    padding: 0;
    border: none !important;
}

.k-pager .k-pager-input input {
    border-radius: var(--border-radius-big);
    background-color: var(--white);
    border: 1px solid var(--medium-grey);
    align-items: center;
    padding: 5px 15px;
}

.k-pager .k-pager-info,
.k-pager .k-picker .k-input-value-text,
.k-pager .k-pager-sizes,
.k-pager .k-pager-input {
    font-size: 15px;
    font-weight: var(--font-weight-regular);
    color: var(--dark-blue);
}

.k-pager .k-pager-sizes .k-picker {
    border-radius: var(--border-radius-big);
    background-color: var(--white);
    border: 1px solid var(--medium-grey);
    width: max-content;
    align-items: center;
}

.k-pager .k-pager-nav {
    color: var(--dark-blue);
    border-radius: var(--border-radius-small);
    transition: all 0.3s ease;
}

.k-pager .k-input-button,
.k-dropdownlist .k-input-button,
.k-combobox .k-input-button[aria-label="expand combobox"],
.k-colorpicker .k-input-button{
    background-color: var(--medium-grey);

}

.k-pager .k-input-button,
.k-dropdownlist .k-input-button,
.k-combobox .k-input-button[aria-label="expand combobox"],
.k-datepicker .k-input-button,
.k-dateinput .k-input-button,
.k-timepicker .k-input-button,
.k-colorpicker .k-input-button {
    height: 36px;
    width: 36px;
    border-radius: 100%;
}

.k-pager .k-input-button .k-button-icon,
.k-dropdownlist .k-input-button .k-button-icon,
.k-combobox .k-input-button[aria-label="expand combobox"] .k-button-icon {
    color: var(--dark-blue) !important;
}

.k-pager .k-input-button .k-svg-icon svg {
    fill: var(--dark-blue);
}

.k-pager .k-pager-numbers .k-button {
    padding: 0;
    width: 30px;
    height: 30px;
    border-radius: var(--border-radius-small);
}

.k-pager .k-pager-numbers .k-button:hover {
    color: var(--medium-grey) !important;
}

.k-pager .k-pager-numbers .k-button .k-button-text {
    font-size: 15px !important;
    font-weight: var(--font-weight-regular) !important;
    color: var(--dark-blue);
}

.k-pager .k-pager-numbers .k-button.k-selected {
    color: var(--dark-blue);
}

.k-pager .k-pager-numbers-wrap {
    align-items: center;
}

.k-pager .k-pager-refresh {
    color: var(--dark-blue);
}

.k-picker-solid:focus-within {
    background-color: var(--white);
    border-color: var(--medium-grey);
}

.k-colorpicker .k-input-inner{
    height: 28px !important;
    width: 28px !important;
    padding: 4px !important;
}

.k-colorpicker  .k-color-preview {
    border-radius: 100%;
}

/* DOT BADGE NOTIFICATION */

.k-badge.k-badge-dot {
    border-color: var(--dark-blue);
    background-color: var(--pink-primary)
}


/* DATETIME PICKER */

.form-inline {
    display: flex;
    align-items: center;
    gap: 20px;
}

label[for="datepicker"],
label[for="datetimepicker"],
label[for="beginDate"],
label[for="endDate"],
.k-floating-label {
    font-size: 15px;
    text-transform: uppercase;
    font-weight: var(--font-weight-semibold);
    color: var(--medium-blue);
    margin-bottom: 0;
    vertical-align: middle;
}

.k-datetimepicker .k-input-button,
.k-datepicker .k-input-button,
.k-dateinput .k-input-button,
.k-timepicker .k-input-button {
    background-color: var(--dark-blue);
    color: var(--white) !important;
    border: none !important;
}

.k-datetimepicker:focus,
.k-datetimepicker:focus-within {
    box-shadow: none;
}


/* CALENDAR */

.k-calendar-container,
.k-calendar {
    border-radius: var(--border-radius-base);
}

.k-calendar {
    background-color: var(--white);
    border: 1px solid var(--light-grey);
    box-shadow: var(--box-shdw);
    padding: 20px;
}

.k-calendar .k-header {
    box-shadow: none;
    border: none;
    background-color: var(--white);
    padding: 0;
}

.k-calendar .k-calendar-nav-fast,
.k-calendar .k-calendar-title,
.k-calendar .k-calendar-nav-next,
.k-calendar .k-calendar-nav-prev {
    font-size: 15px;
    font-weight: var(--font-weight-regular);
    color: var(--dark-blue);
    border-radius: var(--border-radius-small);
    transition: all 0.3s ease;
}

.k-calendar .k-calendar-nav-fast:hover {
    background-color: var(--light-grey);
}

.k-calendar .k-calendar-nav-next,
.k-calendar .k-calendar-nav-prev {
    padding: 0;
    transition: all 0.3s ease;
}

.k-calendar .k-calendar-view {
    margin-bottom: 20px;
}

.k-calendar .k-calendar-table .k-calendar-th {
    font-size: 12px;
    font-weight: var(--font-weight-bold);
    color: var(--medium-blue);
}

.k-calendar .k-calendar-table .k-calendar-td {
    font-size: 15px;
    font-weight: var(--font-weight-regular);
    color: var(--dark-blue);
}

.k-calendar .k-calendar-table .k-calendar-td .k-link {
    border-radius: var(--border-radius-small);
    padding: 7px;
    box-shadow: none !important;
}

.k-calendar .k-calendar-table .k-calendar-td.k-selected .k-link {
    background-color: var(--pink-primary);
    color: var(--white);
}

.k-calendar .k-calendar-table .k-calendar-td:hover .k-link,
.k-calendar .k-calendar-table .k-calendar-td.k-selected:hover .k-link {
    background-color: var(--light-grey);
    color: var(--dark-blue);
}

.k-calendar .k-calendar-table .k-calendar-td.k-other-month {
    color: var(--medium-grey);
}

.k-calendar .k-calendar-footer,
.k-calendar .k-calendar-footer .k-calendar-nav-today {
    padding: 0;
}

.k-calendar .k-calendar-footer .k-calendar-nav-today:hover {
    color: transparent;
}

.k-calendar .k-calendar-footer .k-calendar-nav-today .k-button-text {
    font-size: 12px;
    font-weight: var(--font-weight-bold);
    color: var(--dark-blue);
    text-transform: uppercase;
}

.k-calendar .k-range-start,
.k-calendar .k-range-end,
.k-calendar .k-range-mid {
    background-color: var(--light-grey);
}

.k-calendar .k-range-split-start::after,
.k-calendar .k-range-split-end::after {
    background-image: none;
}

/* TIME PICKER */

.k-list,
.k-list-content,
.k-list-container {
    border-radius: var(--border-radius-base);
}

.k-list-content {
    padding: 20px;
}

.k-list-ul:focus {
    outline-color: transparent;
}

.k-list-ul li.k-list-item {
    font-size: 15px;
    font-weight: var(--font-weight-regular);
    border-radius: var(--border-radius-small);
    color: var(--dark-blue);
}

.k-list-ul li.k-list-item:hover {
    background-color: var(--light-grey);
}

.k-list-item.k-selected:hover,
.k-selected.k-list-optionlabel:hover {
    color: var(--dark-blue) !important;
    background-color: var(--light-grey);
}

.k-list-item.k-selected {
    background-color: var(--pink-primary);
    color: var(--white) !important;

}

.k-selected.k-list-optionlabel {
    background-color: var(--dark-grey);
    color: var(--white);
    box-shadow: none;
}

.k-list-item.k-focus {
    box-shadow: none !important;
}

.k-list .k-list-group-sticky-header,
.k-list .k-list-item.k-first::before {
    color: var(--medium-blue);
}

.k-list .k-list-item-group-label {
    background-color: var(--medium-blue);
}

/* DATERANGE PICKER */

.k-daterangepicker {
    flex-direction: column;
    align-items: normal;
}

.k-daterangepicker .k-dateinput {
    width: 100%;
}

.k-daterangepicker>span:not(.k-floating-label-container) {
    display: none;
}

/* INPUT + RADIO BUTTON + LABEL */

.k-input, .k-colorpicker {
    border-radius: var(--border-radius-big);
    border: 1px solid var(--medium-grey) !important;
    background-color: var(--white);
}

.k-input-inner {
    padding: 5px 15px;
    font-size: 15px;
    color: var(--dark-blue);
    height: 36px;
}

.k-label {
    font-weight: var(--font-weight-medium);
}

.k-radio-label,
.k-label,
.k-checkbox-label,
.radio-block__label {
    font-size: 15px;
    color: var(--dark-blue);
}

.k-radio-label,
.k-checkbox-label {
    font-weight: var(--font-weight-regular) !important;
}

.k-radio:checked,
.k-radio.k-checked {
    background-color: var(--pink-primary);
    border-color: var(--pink-primary);
}


/* COLUMNS */

.k-column-menu,
.k-filter-menu-container {
    border-radius: var(--border-radius-base);
    padding: 20px !important;
    box-shadow: var(--box-shdw);
}

.k-menu-popup,
.k-animation-container,
.k-menu-group,
.k-filterable:has(.k-filter-menu-container),
.k-menu-item:hover:has(div.k-filterable) {
    border-radius: var(--border-radius-base);
}

.k-column-menu {
    margin-top: 5px;
}

.k-column-menu .k-columnmenu-item {
    display: none !important;
}

.k-column-menu .k-menu:not(.k-context-menu) .k-item:hover,
.k-menu-group .k-item>.k-link:hover,
.k-menu-group .k-item>.k-link.k-hover,
.k-menu.k-context-menu .k-item>.k-link:hover,
.k-menu.k-context-menu .k-item>.k-link.k-hover {
    background-color: var(--light-grey);
    color: var(--dark-blue);
}

.k-column-menu .k-columnmenu-actions {
    padding: 0;
}

.k-column-menu .k-column-list {
    margin-bottom: 30px;
}

.k-column-menu .k-column-list-item {
    padding-inline: 0;
    padding-block: 5px;
}

.k-column-menu .k-column-list-item:hover,
.k-columnmenu-item:hover {
    background-color: transparent;
}

.k-column-menu .k-menu-item {
    border-radius: var(--border-radius-small);
}

.k-column-menu .k-menu-item:hover {
    background-color: var(--light-grey);
}

.k-column-menu .k-menu-link {
    padding-block: 5px !important;
    padding-inline: 20px;
}

.k-column-menu .k-menu-link .k-menu-link-text {
    font-size: 15px;
    font-weight: var(--font-weight-regular);
    color: var(--dark-blue);
}

.k-column-menu .k-menu:not(.k-context-menu) .k-item.k-selected {
    background-color: var(--pink-primary);
}

.k-column-menu .k-menu:not(.k-context-menu) .k-item.k-selected .k-menu-link-text,
.k-column-menu .k-menu:not(.k-context-menu) .k-item.k-selected svg {
    color: var(--white);
}

.k-column-menu .k-expander.k-focus{
    box-shadow: none;
}
/* CHECKBOX */

.k-checkbox {
    border-color: var(--medium-grey);
    width: 15px;
    height: 15px;
}

.k-checkbox:checked,
.k-checkbox.k-checked,
.k-checkbox:indeterminate,
.k-checkbox.k-indeterminate {
    border-color: var(--pink-primary);
    background-color: var(--pink-primary);
}

.k-checkbox:focus {
    border-color: var(--pink-primary);
}

.k-checkbox:checked:focus {
    box-shadow: none;
    border: none;
}


/* FORM */

.k-form {
    padding: 20px;
    margin: 0 auto;
}

.k-window form {
    max-width: none;
    border: none;
}

.k-form .k-form-fieldset {
    margin-bottom: 10px;
    margin-top: 0;
}

.k-form .k-form-fieldset .k-form-legend,
.device-config__label,
.form-legend {
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    color: var(--dark-blue);
    text-transform: uppercase;
    padding-bottom: 5px;
    margin-top: 20px !important;
    border-bottom-width: 3px;
    border-bottom-color: var(--medium-blue);
    border-bottom-style: solid;
    display: block;
}

.form-legend {
    margin-bottom: 20px;
}

.k-form .k-form-fieldset:first-of-type .k-form-legend:first-of-type {
    margin-top: 0 !important;
}

.k-form .k-form-buttons {
    justify-content: center;
    gap: 20px;
}

.window-form-custom .k-form-field.inline-checkbox {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 20px;
}

.window-form-custom .k-form-field.inline-checkbox label {
    order: 2;
    margin-bottom: 0 !important;
    margin-left: 4px;
    font-weight: var(--font-weight-regular);
}

.window-form-custom .k-form-buttons {
    margin-top: 0;
    padding-top: 20px;
    position: relative;
}

.window-form-custom .k-form-buttons::before {
    content: "";
    height: 1px;
    width: calc(100% + 40px);
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--kendo-color-border, rgba(33, 37, 41, 0.13));
    position: absolute;
    top: 0;
}


/* SELECT O DROPDOWN LIST */

.k-dropdownlist {
    border-radius: var(--border-radius-big);
    background-color: var(--white);
    border: 1px solid var(--medium-grey);
}

.k-dropdownlist:hover {
    background-color: var(--white);
}

.k-dropdownlist .k-input-inner {
    padding: 5px 15px;
    font-size: 15px;
    color: var(--dark-blue);
}

.k-dropdownlist .k-svg-icon {
    color: var(--dark-blue);
}


/* MULTISELECT */

.k-multiselect {
    padding: 5px;
}

.k-multiselect .k-chip {
    border-radius: var(--border-radius-big);
    padding: 5px 15px;
    font-size: 15px;
    font-weight: var(--font-weight-regular);
    background-color: var(--medium-grey);
    color: var(--dark-blue);
}

.k-multiselect .k-chip.locked-chip {
    background-color: var(--white);
    border: 1px solid var(--medium-grey);
    cursor: default;
}

.k-multiselect .k-chip.locked-chip .k-chip-remove-action {
    display: none;
}

/* K-SPIN-BUTTON */

.k-spin-button {
    height: 36px;
    width: 36px;
}

.k-spin-button .k-spinner-increase,
.k-spin-button .k-spinner-decrease {
    border: none !important;
    background-color: var(--medium-grey);
    color: var(--dark-blue);
    border-color: var(--medium-grey);
}


/* GRID */

.k-grid-toolbar {
    position: relative;
    padding: 0 !important;
    border: none;
    background-color: var(--white);
    justify-content: end;
}

.k-grid-toolbar .k-button.k-button-solid-primary {
    position: absolute;
    left: 0;
}


/*BUTTONS: COLUMN MENU E EXCEL*/

.k-grid-column-menu,
.k-grid-header-menu,
.k-grid-excel {
    height: 36px;
    width: 36px;
    border-radius: 50%;
    padding: 0;
    display: block;
    font-size: 0 !important;
    transition: all 0.3s ease;
}

.k-grid-column-menu {
    background-color: var(--medium-grey) !important;
}

.k-grid-column-menu:hover {
    background-color: var(--dark-blue) !important;
}

.k-grid-column-menu .k-svg-i-columns {
    color: var(--dark-blue);
}

.k-grid-column-menu:hover .k-svg-i-columns {
    color: var(--blue-grey);
}

.k-grid-header-menu {
    border-radius: var(--border-radius-small);
}

.k-grid-header-menu:hover {
    background-color: var(--light-grey);
}

.k-grid-header-menu .k-svg-icon {
    color: var(--dark-blue);
}

.k-grid-excel {
    background-color: var(--pink-primary) !important;
}

.k-grid-excel:hover {
    background-color: var(--dark-blue) !important;
}

.k-grid-excel .k-svg-i-file-excel,
.k-grid-excel:hover .k-svg-i-file-excel {
    color: var(--white) !important;
}

.k-button-solid-base.k-grid-excel {
    border: none !important;
}

.k-grid-excel .k-button-text,
.k-grid-column-menu .k-button-text {
    display: none;
}


/* SEARCH BOX */

.k-searchbox {
    flex-direction: row-reverse;
}

.k-searchbox .k-svg-i-search {
    height: 24px;
    width: 24px;
    border-radius: 100%;
    background-color: var(--medium-grey);
    color: var(--dark-blue);
    transition: all 0.3s ease;
    cursor: pointer;
}

.k-searchbox .k-svg-i-search:hover {
    background-color: var(--dark-blue);
    color: var(--blue-grey);
}


/*******************************************/

/* BUTTONS SOPRA LA GRID */

.grid-button {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 7px;
    padding: inherit;
    transition: all 0.3s ease;
    background-color: var(--medium-grey);
    color: var(--dark-blue);
}

.grid-button i {
    font-size: 16px;
}

.grid-button:hover {
    background-color: var(--dark-blue);
}

.grid-button:hover i {
    color: var(--blue-grey);
}

.grid-button.export-excel {
    background-color: var(--pink-primary);
}

.grid-button.export-excel i {
    color: var(--white);
}

.grid-button.export-excel:hover {
    background-color: var(--dark-blue);
}


/* ICONS */

i.grid-static-icon {
    color: var(--dark-blue);
    font-size: 24px;
}

i.inactive-icon {
    opacity: 20%;
}


/* ACTION BUTTONS */

.action-btn {
    width: 48px;
    height: 48px;
    background-color: var(--medium-grey);
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
}

.action-btn i {
    color: var(--dark-blue);
    font-size: 18px;
}

.action-btn:hover {
    background-color: var(--dark-blue);
}

.action-btn:hover i {
    color: var(--blue-grey);
}

.action-btn.inactive-action {
    position: relative;
}

.action-btn.inactive-action::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: rgba(211, 211, 211, 0.8);
}

.action-btn.inactive-action:hover {
    background-color: var(--medium-grey);
    cursor: default;
}

.action-btn.inactive-action:hover i {
    color: var(--dark-blue);
}

.action-btn-wrapper {
    display: flex;
    flex-direction: row;
    gap: 10px;
    justify-content: center;
}


/* SD CARD ICON */

.fa-sd-card-container {
    position: relative;
}

.red-btn.fa-sd-card-container::after {
    content: "";
    position: absolute;
    display: block;
    width: 65%;
    height: 2px;
    background-color: var(--white);
    transform: rotate(45deg);
}

.action-btn.red-btn {
    background-color: var(--red);
}

.action-btn.red-btn:hover {
    background-color: #B41F20;
}

.action-btn.red-btn i {
    color: var(--white);
}


/* ALARMS BUTTONS */

#deleteAllAlarmsButton {
    background-color: var(--dark-blue);
    transition: all 0.3s ease;
    border-color: var(--dark-blue) !important;
}

#deleteAllAlarmsButton .k-button-text {
    color: var(--white);
}

#deleteAlarmsButton {
    background-color: var(--white);
    border: 1px solid var(--dark-blue) !important;
    transition: all 0.3s ease;
}

#deleteAlarmsButton .k-button-text {
    color: var(--dark-blue);
}

.k-spacer {
    display: none;
}


/* K-WINDOW / K-DIALOG */

.k-window,
.k-dialog {
    height: fit-content !important;
    border-radius: var(--border-radius-base);
    border: 1px solid var(--light-grey);
    background-color: var(--white);
    box-shadow: var(--box-shdw);
    max-height: 80dvh;
}

.k-window .k-window-content .confirmation-content {
    text-align: center;
    padding: 40px 30px;
}

.k-window .k-window-content .confirmation-content p {
    padding: 0 !important;
}

.k-window .k-window-content,
.k-dialog .k-dialog-content {
    padding: 0;
}

.k-window .k-window-content p,
.k-dialog .k-dialog-content p {
    font-size: 15px;
    font-weight: var(--font-weight-medium);
    padding-block: 20px;
    margin: 0 !important;
}

.k-window .k-window-titlebar-action,
.k-dialog .k-dialog-titlebar-action {
    border-radius: var(--border-radius-small);
    padding: 0;
    color: var(--dark-blue);
}

.k-window .k-window-titlebar .k-window-title,
.k-dialog .k-dialog-titlebar .k-dialog-title {
    padding: 0;
    font-weight: var(--font-weight-semibold);
    font-size: 20px;
    color: var(--dark-blue);
}

.k-window .k-window-content .modal-content {
    padding: 30px 150px;
    background-color: var(--light-blue);
    margin-bottom: 20px;
}

.k-window-actions,
.k-dialog-actions {
    padding: 20px;
    display: flex;
    justify-content: center;
}

.k-window-content:has(.MicrosoftMap) {
    padding: 20px;
}


/* MODALE K-WINDOW */

.modal-header {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.modal-title h3 {
    font-size: 20px;
    font-weight: var(--font-weight-semibold);
}

.detail-wrapper {
/*    display: flex;
    flex-direction: column;*/
    align-items: center;
}

.row.detail {
    border-bottom: 2px solid var(--medium-blue);
    align-items: end;
    margin-bottom: 20px;
    width: 100%;
}

.row.detail:last-of-type {
    margin-bottom: 0;
}

.detail-property,
.detail-value {
    margin-bottom: 3px;
}

.detail-property {
    text-align: start;
    padding-left: 0;
}

.detail-value {
    text-align: end;
    padding-right: 0;
}

.detail-property p,
.detail-value p {
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 12px;
    padding-block: 3px !important;
}

.detail-property p {
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    color: var(--pink-primary);
}

.detail-value p {
    font-weight: var(--font-weight-medium);
    color: var(--dark-blue);
}

.detail-dialog {
    background-color: var(--white);
    border-radius: var(--border-radius-base);
    width: fit-content;
    margin-bottom: 40px;
}

.detail-dialog .detail-wrapper {
    padding: 30px;
}

.detail-dialog .detail-wrapper .row.detail {
    /*min-width: 450px;*/
    margin-left: 0;
    margin-right: 0;
}


/* FLEET LOCALIZATION */

#map_wrapper .km-scroll-wrapper {
    position: relative;
}

.k-map .k-navigator {
    border-color: var(--medium-grey);
    background-color: var(--white);
    color: var(--dark-blue);
    box-shadow: var(--box-shdw);
}

.k-map .k-map-controls {
    bottom: 30px;
    right: 30px;
}

.k-map .k-navigator button {
    border-radius: 100%;
}

.k-map .k-zoom-control {
    gap: 5px;
}

.k-map .k-zoom-control .k-zoom-in,
.k-map .k-zoom-control .k-zoom-out {
    background-color: var(--white);
    border-radius: 100% !important;
    color: var(--dark-blue);
    border-color: var(--medium-grey);
    box-shadow: var(--box-shdw);
}

.k-svg-i-map-marker svg {
    color: var(--dark-blue);
}

.InfoboxCustom,
.Infobox {
    background-color: var(--white);
    padding: 20px;
    border-radius: var(--border-radius-base);
    color: var(--dark-blue);
}

.filter .form-group, .filter .k-form{
    height: 100%;
}

.filter .k-form{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* REPORTS */

.report-panel {
    margin-bottom: 24px;
}

.k-chart {
    border: none !important;
    box-shadow: none;
}

.k-chart text {
    color: var(--dark-blue) !important;
    font-family: "Inter", sans-serif !important;
}


/* DOCUMENTATION */

#Documentation {
    background-color: var(--white);
    color: var(--dark-blue);
    padding: 40px;
    border-radius: var(--border-radius-base);
}


/* TREEVIEW */

.k-treeview-leaf {
    border-radius: 6px;
    box-shadow: none;
}

.k-treeview-leaf.k-selected {
    background-color: var(--pink-primary);
    box-shadow: none;
}

.k-treeview-leaf.k-selected:hover {
    color: var(--dark-blue);
    box-shadow: none;
}

.k-treeview-leaf:hover,
.k-treeview-leaf.k-hover {
    background-color: var(--light-grey);
    box-shadow: none;
}

.k-treeview-leaf:focus {
    color: var(--dark-blue);
    box-shadow: none;
}

.k-treeview-leaf-text {
    word-wrap: break-word;
    word-break: break-word;
    white-space: normal;
}

.k-treeview-item {
    padding: 0 0 0 18px;
}

.k-treeview-list {
    max-height: 700px;
    overflow-y: auto;
}

.k-treeview-label {
    padding-bottom: 10px;
}

/* K-WIZARD */

.k-wizard .k-progressbar .k-selected.k-progressbar-value {
    background-color: var(--pink-primary);
}

.k-wizard .k-step:hover .k-step-indicator {
    background-color: var(--dark-grey);
}

.k-wizard .k-step .k-step-indicator {
    border: none !important;
    background-color: var(--dark-grey);
    color: var(--white);
    margin: 0;
}

.k-wizard .k-step.k-step-done .k-step-indicator {
    background-color: var(--pink-primary);
}

.k-wizard .k-step a {
    background-color: var(--light-grey);
    box-shadow: var(--box-shdw) !important;
    padding: 15px 10px;
    border-radius: var(--border-radius-base);
    max-width: 280px;
    flex-direction: row;
    justify-content: space-evenly;
}

.k-wizard .k-step.k-step-done a {
    background-color: var(--white);
}

.k-wizard .k-step .k-step-label {
    font-size: 15px;
    text-transform: uppercase;
    font-weight: var(--font-weight-semibold);
    color: var(--dark-grey);
    margin: 0;
}

.k-wizard .k-step.k-step-done .k-step-label {
    color: var(--pink-primary);
}

.k-wizard .k-step .k-step-label .k-step-text {
    max-width: fit-content;
}

.k-stepper .k-step.k-focus .k-step-indicator::after,
.k-stepper .k-step-link:focus .k-step-indicator::after {
    border: 2px solid var(--pink-primary);
}


/* ERROR PAGE */

.error-page__container {
    padding: 40px 120px;
    background-color: var(--white);
    border-radius: var(--border-radius-base);
    margin-top: 100px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.error-page__container .error-page__message {
    margin-block: 24px;
}

.error-page__container .error-page__message h1 {
    margin-bottom: 16px;
    font-size: 35px;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
}

.error-page__container .error-page__message h1,
.error-page__container .error-page__message p {
    color: var(--dark-blue);
}

.error-page__container .error-page__message p {
    font-size: 18px;
    line-height: 1.5;
}

.error-page__container .error-page__btn-container {
    margin-bottom: 40px;
}


/* CHECKLIST CONFIG */

.checklist__config h2 {
    font-size: 20px;
    text-transform: uppercase;
    font-weight: var(--font-weight-bold);
    color: var(--dark-blue);
    margin-block: 20px;
}

.checklist-panel__header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.checklist-panel__header .k-dropdownlist {
    height: 100%;
    max-width: 300px;
}

.checklist-panel__header .checklist-panel__header-actions {
    margin-left: auto;
}

.checklist-panel__content {
    border-radius: var(--border-radius-base);
}

.checklist-panel__checklist-container .k-listbox {
    margin-top: 20px;
}

.checklist-panel__checklist-container .checklist-panel__content {
    padding-inline: 10%;
}

.random-order h3 {
    margin-top: 10px;
    margin-bottom: 5px;
}

.help-text-sm {
    font-size: 12px;
    font-weight: var(--font-weight-regular);
    line-height: 1.3;
}

/* LISTBOX */

.k-listbox .k-list-scroller {
    border-color: transparent;
    background-color: transparent;
}

.k-listbox .k-list-content {
    padding: 0 !important;
    min-height: 90px;
    background-color: var(--light-grey);
}

.k-listbox .k-list-item:hover,
.k-listbox .k-list-item.k-selected,
.k-drag-clue {
    background-color: transparent !important;
    border-color: transparent;
}

.k-listbox .k-list-item:last-of-type {
    padding-bottom: 20px;
}

.k-listbox-actions {
    display: flex;
    justify-content: center;
}

.k-listbox-actions button {
    border-radius: 100%;
    background-color: var(--medium-grey) !important;
    opacity: 1 !important;
}

.panel-wrapper {
    box-shadow: var(--box-shdw);
    border-radius: var(--border-radius-base);
}


/* PANELBAR */

ul.k-panelbar {
    background-color: transparent;
    border: none;
}

/* ul.k-panelbar>li+li {
    margin-top: 12px;
} */

.k-panelbar>.k-panelbar-header+.k-panelbar-header {
    border: none;
}

.checklist-question__category {
    display: inline-block;
    border: 2px solid var(--dark-blue);
    padding: 5px 10px;
    border-radius: var(--border-radius-base);
    font-size: 12px;
    font-weight: var(--font-weight-bold);
    line-height: 1.3;
    text-transform: uppercase;
    white-space: nowrap;
}

/* .checklist__answers {
    list-style: none;
    padding: 0;
}

.checklist__answers li {
    font-size: 12px;
    font-weight: var(--font-weight-medium);
    color: var(--dark-blue);
    border-bottom: 1px solid var(--light-grey);
    padding-bottom: 2px;
    text-transform: uppercase;
}

.checklist__answers li+li {
    margin-top: 20px;
} */

.k-panelbar-item-text .k-panelbar-item-text {
    flex-wrap: wrap;
    word-wrap: break-word;
    white-space: normal;
    word-break: break-word;
}

.k-panelbar>.k-panelbar-header>.k-link,
.k-panelbar>.k-panelbar-header>.k-link.k-selected {
    padding: 20px;
    border-radius: var(--border-radius-base);
    text-transform: uppercase;
    background-color: var(--white) !important;
    transition: all 0.3s ease;
    box-shadow: none;
}

.k-panelbar .k-panelbar-header.k-expanded>.k-link {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom: 1px solid var(--light-grey);
}

/* Hover */
/* 
.k-panelbar>.k-panelbar-header>.k-link:hover {
    background-color: var(--dark-blue) !important;
}

.k-panelbar>.k-panelbar-header>.k-link.k-selected:hover {
    background-color: var(--white) !important;
}

.k-panelbar>.k-panelbar-header>.k-link:hover span,
.k-panelbar>.k-panelbar-header>.k-link:hover .k-icon>svg {
    color: var(--white) !important;
    fill: var(--white) !important;
}

.k-panelbar>.k-panelbar-header>.k-link:hover .checklist-question__category {
    border-color: var(--white);
}

.k-panelbar>.k-panelbar-header>.k-link.k-selected:hover .checklist-question__category {
    border-color: var(--dark-blue);
}

.k-panelbar>.k-panelbar-header>.k-link.k-selected:hover span,
.k-panelbar>.k-panelbar-header>.k-link.k-selected:hover .k-icon>svg {
    color: var(--dark-blue) !important;
    fill: var(--dark-blue) !important;
} */

.k-panelbar .k-link span {
    color: var(--dark-blue);
}

.k-panelbar .k-link .k-panelbar-item-text {
    font-size: 16px;
    font-weight: var(--font-weight-semibold);
    line-height: 1.3;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
}

.k-panelbar .k-link .k-panelbar-item-text>br {
    display: none;
}

.checklist-panel__checklist-container .k-panelbar .k-link .k-panelbar-item-text .panel-title {
    font-size: 18px !important;
}

.k-panelbar .k-link .k-icon>svg {
    fill: var(--dark-blue);
    width: 16px;
    height: 16px;
}

@media (max-width: 1550px) {
    .k-panelbar .k-link .k-panelbar-item-text {
        flex-direction: column;
        align-items: start;
    }

    .checklist-panel__header h2 {
        flex: 1 1 100%;
    }
}

.k-panelbar .k-panelbar-content {
    background-color: var(--white);
    color: var(--dark-blue);
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    padding: 20px 30px;
}

.checklist-question__info {
    margin-bottom: 30px;
}

.radio-block__label {
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
}

.answer-green,
.answer-red,
.answer-yellow {
    font-weight: var(--font-weight-bold) !important;
}

/*DEVICE CONFIG*/

.device-config__form {
    padding: 0;
}

#DeviceConfig-form-label {
    margin: 0;
    font-size: 18px;
    font-weight: var(--font-weight-bold);
    color: var(--dark-blue);
    background-color: transparent;
    border: 1px solid var(--dark-blue);
    padding: 10px 30px;
    width: fit-content;
    border-radius: var(--border-radius-base);
    line-height: 1;
}

.device-config__form .k-tabstrip {
    margin-top: 20px;
}

.device-config__form .k-tabstrip .k-tabstrip-items .k-tabstrip-item {
    padding: 12px 18px;
}

.device-config__form .k-tabstrip .k-tabstrip-items .k-tabstrip-item .k-link {
    font-size: 15px;
    gap: 5px;
    color: var(--medium-blue);
}

.device-config__form .k-tabstrip .k-tabstrip-items .k-tabstrip-item.k-active .k-link,
.device-config__form .k-tabstrip .k-tabstrip-items .k-tabstrip-item:hover .k-link {
    color: var(--dark-blue);
}

.device-config__form .k-tabstrip-item+.k-tabstrip-item {
    margin-left: -8px;
}

@media (max-width: 1880px) {
    .device-config__form .k-tabstrip .k-tabstrip-items .k-tabstrip-item .k-link {
        font-size: 12px;
    }

    .device-config__form .k-tabstrip .k-tabstrip-items .k-tabstrip-item {
        padding: 10px 12px;
    }

    .device-config__form .k-tabstrip-item+.k-tabstrip-item {
        margin-left: -5px;
    }
}

.device-config__tab-content {
    max-width: 700px;
    margin: 50px auto;
    background-color: var(--light-blue);
    border: 1px solid var(--medium-grey);
    border-radius: var(--border-radius-base);
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.device-config__tab-title {
    text-align: center;
    font-size: 22px;
    font-weight: var(--font-weight-bold);
    color: var(--dark-blue);
    margin-bottom: 20px;
    margin-top: 0;
}

.device-config__element {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.device-config__label:first-of-type {
    margin-top: 0 !important;
}

.device-config__selection {
    position: relative;
}

.device-config__selection+.device-config__selection {
    margin-top: 20px;
}

.device-config__element+.device-config__element {
    margin-top: 20px;
}

.device-config__tab-content.device-config__wider {
    max-width: 1000px;
}

.device-config__element .k-radio-list {
    justify-content: space-evenly;
}

.device-config__selection-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
    gap: 20px;
}

.device-config__selection-wrapper.row {
    gap: 0;
}

.private-element {
    background-color: rgba(32, 24, 88, 0.1) !important;
}

.tablet-element {
    background-color: rgba(108, 169, 179, 0.3) !important;
}

.tablet-element-private {
    background-color: rgba(108, 169, 179, 0.7) !important;
}
.device-config__selection.private-element {
    background-color: transparent !important;
}

.device-config__selection.private-element::after {
    content: "";
    position: absolute;
    background-color: rgba(32, 24, 88, 0.1);
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    pointer-events: none;
}

.k-radio-list {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px !important;
}

.k-radio-list .k-link {
    padding: 0 !important;
} 

.k-card{
    border-radius: var(--border-radius-base);
    height: 100%;
}

.k-card .k-card-body{
    padding: 20px;
}

.k-card .k-card-body .k-card-title{
    font-size: 16px;
    font-weight: var(--font-weight-semibold);
    color: var(--dark-blue);
}

.k-switch-on .k-switch-track {
    border-color: var(--pink-primary) !important;
    background-color: var(--pink-primary) !important;
}

#shock-detail-img {
    width: 80%;
    margin-bottom: 20px;
}

.multibinding-config__element {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.status-icon-cell {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
}

.leaflet-bottom.leaflet-right {
    display: none !important;
}

/* kendoProgressBar for Firmware-progress  */
.firmware-progress.progress-fail .k-selected,
.firmware-progress.progress-fail .k-state-selected {
    background-color: #e30613 !important;
}

.firmware-progress.progress-complete .k-selected,
.firmware-progress.progress-complete .k-state-selected {
    background-color: #3dab36 !important;
}

.firmware-progress.progress-in-progress .k-selected,
.firmware-progress.progress-in-progress .k-state-selected {
    background-color: #5a77d8 !important;
}

.firmware-progress.progress-zero {
    background-color: #cdd4dc !important;
}

.firmware-progress.progress-zero .k-selected,
.firmware-progress.progress-zero .k-state-selected {
    background-color: #a7acb2 !important;
}
/* kendoProgressBar for Firmware-progress  */

.heatmap-report-panel {
    overflow-y: auto;
}