/* Declaración de tu fuente local de 7 segmentos */
@font-face {
    font-family: 'SevenSegmentLocal';
    src: url('../fonts/seven_segment/Seven Segment.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

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

.font-anton {
    font-family: 'Anton', sans-serif;
    letter-spacing: 0.05em;
}

/* -------------------------------------------------------------
   REGLA DE CAPAS (Z-INDEX): Menú desplegable por encima del HUD
   ------------------------------------------------------------- */
.relative.group #web3-dropdown-container,
.relative.group .absolute {
    z-index: 1000 !important;
}

/* -------------------------------------------------------------
   TEMPORIZADOR EVANGELION NERV FLOTANTE
   ------------------------------------------------------------- */
#evangelion-follower {
    position: fixed;
    pointer-events: none;
    z-index: 900; /* Queda por debajo del menú flotante (1000) */
    background: rgba(10, 10, 8, 0.95);
    border: 1px solid rgba(212, 160, 23, 0.5);
    border-radius: 6px;
    padding: 8px 12px;
    box-shadow: 0 0 12px rgba(212, 160, 23, 0.2);
    transition: all 0.3s ease;
    transform: translate(20px, 20px);
    width: 290px;
    color: #e2b714;
    font-family: 'SevenSegmentLocal', monospace;
}

/* Estado de Alarma Roja */
#evangelion-follower.eva-danger {
    background: rgba(90, 0, 0, 0.95) !important;
    border-color: #ff3333 !important;
    color: #ff3333 !important;
    box-shadow: 0 0 20px rgba(255, 0, 0, 0.6) !important;
    animation: evaBlink 0.8s infinite alternate;
}

/* Estado de Advertencia Amarilla */
#evangelion-follower.eva-warning-yellow {
    background: rgba(80, 65, 0, 0.95) !important;
    border-color: #ffd700 !important;
    color: #ffd700 !important;
    box-shadow: 0 0 20px rgba(255, 215, 0, 0.5) !important;
    animation: evaBlinkYellow 0.8s infinite alternate;
}

@keyframes evaBlink {
    0% { opacity: 0.7; }
    100% { opacity: 1; }
}

@keyframes evaBlinkYellow {
    0% { opacity: 0.7; }
    100% { opacity: 1; }
}

/* -------------------------------------------------------------
   COMPONENTES INTERNOS DEL HUD DE EVANGELION
   ------------------------------------------------------------- */
.eva-header {
    display: flex;
    justify-content: space-between;
    font-size: 7px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding-bottom: 2px;
    margin-bottom: 4px;
    letter-spacing: 0.05em;
    opacity: 0.8;
    font-family: 'Karla', sans-serif;
}

.eva-main-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.eva-timer-display {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.time-main {
    font-size: 48px;
    font-weight: bold;
    letter-spacing: 0.08em;
    line-height: 1;
    text-shadow: 0 0 6px currentColor;
}

.time-ms {
    font-size: 16px;
    font-weight: normal;
    opacity: 0.85;
    letter-spacing: 0.05em;
}

.eva-side-panel {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 8px;
    text-align: right;
    opacity: 0.85;
    font-family: 'Karla', sans-serif;
}

.eva-status-block {
    border: 1px solid currentColor;
    padding: 1px 4px;
    border-radius: 2px;
    line-height: 1;
}

.eva-status-block .eva-jp {
    display: block;
    font-size: 9px;
    font-weight: bold;
}

.eva-status-block .eva-en {
    display: block;
    font-size: 5px;
}

.eva-footer-bar {
    display: flex;
    justify-content: space-between;
    font-size: 6px;
    margin-top: 4px;
    border-top: 1px dashed rgba(255, 255, 255, 0.15);
    padding-top: 3px;
    opacity: 0.75;
    font-family: 'Karla', sans-serif;
}

.eva-tag small {
    font-size: 5px;
    display: block;
}

.eva-tag.red {
    background: #cc2222;
    color: #fff;
    padding: 0 2px;
    font-weight: bold;
}