/* ==========================================================
   HEAT WAVE INTENSITY GAUGE — styles
   Thermal palette (not a generic traffic-light gauge):
   straw gold -> ember orange -> deep red -> maroon
========================================================== */

.gauge-wrap {
    display: flex;
    justify-content: center;
    padding: 8px 0 4px;
	color:white;
	
}

.gauge-svg {
    width: 100%;
    max-width: 280px;
    overflow: visible;
}

.gauge-track {
    fill: none;
    stroke: rgba(255,255,255,0.08);
    stroke-width: 14;
    stroke-linecap: round;
}

.gauge-zone {
    fill: none;
    stroke-width: 14;
    stroke-linecap: butt;
}
.gauge-zone-low      { stroke: #E3B341; }  /* straw gold — mild */
.gauge-zone-moderate { stroke: #F0803C; }  /* ember orange */
.gauge-zone-high     { stroke: #D6432B; }  /* deep red */
.gauge-zone-veryhigh { stroke: #7A1F1F; }  /* maroon — extreme */

.gauge-tick {
    font-size: 8px;
    fill: rgba(255,255,255,0.55);
    font-family: inherit;
}

.gauge-readout {
    font-size: 26px;
    font-weight: 700;
    fill: #ffffff;
    font-family: inherit;
}

.gauge-readout-label {
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    fill: rgba(255,255,255,0.6);
    font-family: inherit;
	color:white;
}

.gauge-needle-group {
    transform: rotate(-90deg);
    transition: transform 1.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.gauge-needle {
    fill: #f5f5f5;
    filter: drop-shadow(0 0 2px rgba(0,0,0,0.4));
}

.gauge-hub {
    fill: #d1d5db;
    stroke: #4b5563;
    stroke-width: 1.5;
}

/* subtle danger pulse only at Very High — the one moment
   that earns extra motion, per the "spend boldness once" rule */
.gauge-wrap.gauge-danger .gauge-zone-veryhigh {
    animation: gauge-pulse 1.6s ease-in-out infinite;
}

@keyframes gauge-pulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.55; }
}

@media (prefers-reduced-motion: reduce) {
    .gauge-needle-group { transition: none; }
    .gauge-wrap.gauge-danger .gauge-zone-veryhigh { animation: none; }
}
