/* /static/dashboards/css/environmental_tropical.css */

/* Definice firemních barev pro snadnou údržbu */
:root {
    --citiq-dark-blue: #003366;
    --citiq-light-blue: #00AEEF;
    --citiq-bg-light: #f8f9fa; /* Světlé pozadí stránky */
    --citiq-cell-bg: #f0f4f8; /* Jemné pozadí pro datové buňky */
}

body {
    font-family: 'Inter', sans-serif;
}

.dashboard-bg {
    background-color: var(--citiq-bg-light);
}

.text-citiq-dark-blue { color: var(--citiq-dark-blue); }
.text-citiq-light-blue { color: var(--citiq-light-blue); }
.border-citiq-dark-blue { border-color: var(--citiq-dark-blue) !important; }
.border-citiq-light-blue { border-color: var(--citiq-light-blue) !important; }

/* Kompaktnější velikost ikon */
.icon-size {
    width: 3rem;  /* 48px */
    height: 3rem; /* 48px */
}

/* Styl pro vertikální osu s výškami */
.height-scale {
    position: relative;
    height: 100%;
    width: 1.5rem; /* 24px */
    display: flex;
    justify-content: center;
}

.height-scale-line {
    position: absolute;
    top: 1.5rem;
    bottom: 1.5rem;
    left: 50%;
    width: 2px;
    background-color: #d1d5db; /* Světle šedá */
    transform: translateX(-50%);
}

.height-marker {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    flex-direction: column;
}

.height-marker span {
    font-size: 0.75rem; /* 12px */
    font-weight: bold;
    color: var(--citiq-dark-blue);
    background-color: var(--citiq-bg-light);
    padding: 0 4px;
}

.height-marker::before {
    content: '';
    display: block;
    width: 0.75rem; /* 12px */
    height: 0.75rem; /* 12px */
    background-color: var(--citiq-dark-blue);
    border: 2px solid white;
    border-radius: 50%;
    margin-bottom: 4px;
}

 .is-hidden {
     display: none !important;
 }
.loading-overlay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(255, 255, 255, 0.85);
     display: flex;
     justify-content: center;
     align-items: center;
     z-index: 1050; /* Vyšší než většina Bootstrap komponent */
     transition: opacity 0.3s ease;
 }

/* --- Styly pro tlačítko rozbalení sekce technologií --- */
#toggle-technology-btn-wrapper a[aria-expanded="true"] .expand-icon {
    transform: rotate(180deg);
}

#toggle-technology-btn-wrapper .expand-icon {
    transition: transform 0.2s ease-in-out;
}