.input-alerta {
    border: 2px solid #fdd14b;
    box-shadow: 0 0 5px #fdd14b;
}

.sidebar-wrapper {
    height: 100vh;
    display: flex;
    flex-direction: column;
}

.mt-auto {
    margin-top: auto;
}

#timer {
    font-family: Arial, sans-serif;
    font-size: 18px;
    fill: #000;
    text-anchor: middle;
    dominant-baseline: middle;
}

.circle-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.circle-background {
    fill: white;
    stroke: #28a745;
    stroke-width: 10;
    transition: stroke 0.3s linear;
}

.circle-progress {
    fill: none;
    stroke: #e6e6e6;
    stroke-width: 10;
    transition: stroke 0.3s linear, stroke-dashoffset 0.3s linear;
    transform: rotate(-90deg);
    transform-origin: 50% 50%;
}

.timer-warning {
    fill: darkred !important;
    animation: blinkText 1s step-start infinite;
}

@keyframes blinkText {
    50% { opacity: 0.3; }
}

.circle-warning {
    animation: pulseCircle 1s ease-in-out infinite;
}

@keyframes pulseCircle {
    0%   { transform: rotate(-90deg) scale(1); }
    50%  { transform: rotate(-90deg) scale(1.02); }
    100% { transform: rotate(-90deg) scale(1); }
}