:root {
    --main-color-working: var(--bs-primary);
    --main-color-offline: var(--bs-secondary);
    --main-color-issue: var(--bs-warning);
    --main-color-out-of-order: var(--bs-danger);
}

body {
    font-family: 'Inter';
}


.ms-n5 {
    margin-left: -40px;
}

.my-bordered-icon {
    text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
}

.color-working {
    color: var(--main-color-working);
}

.color-offline {
    color: var(--main-color-offline);
}

.color-issue {
    color: var(--main-color-issue);
}

.color-out-of-order {
    color: var(--main-color-out-of-order);
}

.background-working {
    background-color: var(--main-color-working);
}

.background-offline {
    background-color: var(--main-color-offline);
}

.background-issue {
    background-color: var(--main-color-issue);
}

.background-out-of-order {
    background-color: var(--main-color-out-of-order);
}

.text-working {
    color: var(--main-color-working);
}

.text-offline {
    color: var(--main-color-offline);
}

.text-issue {
    color: #96730BFF;
}

.text-out-of-order {
    color: #B02A37;
}

.suggestions {
    position: absolute;
    z-index: 1000;
    top: 100%;
    left: 50%; /* Center the suggestions div horizontally */
    transform: translateX(-50%); /* Center it accurately */
    width: 200%;
    max-height: 300px; /* Define a maximum height for the suggestions */
    overflow-y: auto; /* Enable vertical scrolling if necessary */
    background-color: #fff;
    border: 1px solid #ccc;
    border-top: none;
    border-radius: 5px; /* Rounded border */

    display: none; /* Initially hidden */
}

/* Style for suggestion items */
.suggestion-item {
    padding: 10px;
    border-bottom: 1px solid #ccc;
    cursor: pointer;
}

/* Highlight the selected suggestion */
.suggestion-item:hover {
    background-color: #f0f0f0;
}

.table-detail-stats {
    table-layout: fixed;
}

.table-detail-stats th {
    width: 33%;
    color: var(--bs-secondary-color) !important;
    font-weight: normal;
    padding: 0;
}

.table-detail-stats td {
    padding: 0;
}

.table-lifts th.asc:after {
    content: '\0000a0\0025b2';
    float: right;
    color: var(--bs-primary);
}

.table-lifts th.desc:after {
    content: '\0000a0\0025bc';
    float: right;
    color: var(--bs-primary);
}

/* ID */
.table-lifts td:nth-child(1) {
    width: 5%;
}

/* Status */
.table-lifts td:nth-child(2) {
    width: 15%;
}

/* Client */
.table-lifts td:nth-child(3) {
    width: 20%;
}

/* Temp */
.table-lifts td:nth-child(6) {
    width: 7%;
}

/* ------------------ */
/*  Map */
/* ------------------ */

.leaflet-container { /* all maps */
    height: 550px;
}

.map-legend {
    display: flex;
}

.map-legend .item {
    display: flex;
    margin-right: 10px;
}

.map-legend .text {
    align-self: center;
    margin-left: 8px;
}