.table {
    width: 100%;
    border-collapse: collapse;
    background: #fff
}

.table th,
.table td {
    border-bottom: 1px solid var(--border);
    padding: 12px;
    text-align: left
}

.table th.right,
.table td.right {
    text-align: right
}

.table-responsive {
    overflow: auto
}

.badge {
    background: #e2e8f0;
    color: #334155;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 12px
}

.badge.danger {
    background: rgba(211, 47, 47, .12);
    color: #d32f2f
}

.input {
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: var(--radius)
}

.tools {
    display: flex;
    gap: 10px;
    align-items: center
}

.form {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.form-actions {
    display: flex;
    gap: 8px
}

.modal-wrap {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(0, 0, 0, .35)
}

.modal-card {
    background: #fff;
    width: min(560px, 92vw);
    border-radius: var(--radius)
}

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border)
}

.modal-body {
    padding: 16px
}

.loader-overlay {
    position: fixed;
    inset: 0;
    display: none;
    place-items: center;
    background: rgba(255, 255, 255, .6)
}

.loader-card {
    background: #fff;
    padding: 12px 18px;
    border-radius: var(--radius);
    border: 1px solid var(--border)
}

.btn.small {
    padding: 6px 10px;
    font-size: 13px
}

.btn.ghost {
    background: transparent;
    border: 1px solid var(--border)
}

.btn.danger {
    background: #d32f2f;
    color: #fff
}

/* --- Pulse Animations for Action Buttons --- */
@keyframes pulse-orange {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(249, 115, 22, 0.7);
    }

    70% {
        transform: scale(1.05);
        box-shadow: 0 0 0 10px rgba(249, 115, 22, 0);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(249, 115, 22, 0);
    }
}

@keyframes pulse-red {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7);
    }

    70% {
        transform: scale(1.05);
        box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
    }
}

/* --- Row Pulse (Subtle background glow) --- */
@keyframes row-pulse-orange {
    0% {
        background-color: rgba(249, 115, 22, 0.05);
    }

    50% {
        background-color: rgba(249, 115, 22, 0.15);
    }

    100% {
        background-color: rgba(249, 115, 22, 0.05);
    }
}

@keyframes row-pulse-red {
    0% {
        background-color: rgba(239, 68, 68, 0.05);
    }

    50% {
        background-color: rgba(239, 68, 68, 0.15);
    }

    100% {
        background-color: rgba(239, 68, 68, 0.05);
    }
}

/* Classes Application */
.action-btn.pulse-orange {
    animation: pulse-orange 2s infinite;
    background-color: #f97316 !important;
    color: white !important;
    border: none !important;
}

.action-btn.pulse-red {
    animation: pulse-red 1.5s infinite;
    background-color: #ef4444 !important;
    color: white !important;
    border: none !important;
}

/* Row Pulse Classes */
tr.pulse-row-alert {
    animation: row-pulse-orange 2.5s infinite;
}

tr.pulse-row-blocked {
    animation: row-pulse-red 2s infinite;
}

.vehicle-card.pulse-card-alert {
    animation: row-pulse-orange 2.5s infinite;
    border-color: #f97316 !important;
}

.vehicle-card.pulse-card-blocked {
    animation: row-pulse-red 2s infinite;
    border-color: #ef4444 !important;
}

/* --- Telemetry Visual Icons --- */
.battery-icon {
    width: 38px;
    height: 18px;
    border: 1.5px solid #64748b;
    border-radius: 3px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1px;
    margin-right: 8px;
    background: #f1f5f9;
}

.battery-icon::after {
    content: '';
    position: absolute;
    right: -4px;
    top: 3px;
    width: 2.5px;
    height: 7px;
    background: #64748b;
    border-radius: 0 1.5px 1.5px 0;
}

.battery-level {
    position: absolute;
    left: 1px;
    top: 1px;
    bottom: 1px;
    border-radius: 1px;
    transition: width 0.3s ease;
    z-index: 1;
}

.battery-text {
    font-size: 8px;
    font-weight: 800;
    color: #000;
    z-index: 2;
    line-height: 1;
    text-shadow: 0 0 2px rgba(255, 255, 255, 0.9);
}

.signal-strength {
    display: inline-flex;
    align-items: flex-end;
    gap: 2px;
    height: 14px;
    width: 22px;
}

.signal-bar {
    width: 3.5px;
    background: #e2e8f0;
    border-radius: 1px;
    transition: background 0.3s ease;
}

.signal-bar:nth-child(1) {
    height: 4px;
}

.signal-bar:nth-child(2) {
    height: 7px;
}

.signal-bar:nth-child(3) {
    height: 10px;
}

.signal-bar:nth-child(4) {
    height: 14px;
}

.signal-bar.active {
    background: currentColor;
}

/* --- Digital Speedometer Panel (PREMIUM DS-DIGITAL) --- */
.digital-speed-panel {
    background: #ffffff;
    border-radius: 12px;
    padding: 15px 20px;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05), inset 0 1px 2px rgba(255, 255, 255, 0.1);
    border: 1px solid #e2e8f0;
    margin: 10px 0;
    overflow: hidden;
    position: relative;
}

.digital-speed-panel::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* Comentado em fundo branco para mais clareza */
    background: none;
    pointer-events: none;
}

.speed-digital-val {
    font-family: 'DS-Digital', 'Orbitron', sans-serif !important;
    font-size: 3.2rem;
    color: #00e600;
    /* Vibrant Neon Green */
    text-shadow: 0 0 2px rgba(0, 230, 0, 0.2);
    line-height: 1;
    font-weight: 500;
}

.speed-digital-unit {
    font-family: inherit !important;
    font-size: 0.85rem;
    color: #00e600;
    opacity: 1;
    font-weight: 700;
    text-transform: uppercase;
    text-shadow: 0 0 1px rgba(0, 230, 0, 0.2);
}

/* Ensure vehicle card speed looks same as dashboard */
.vehicle-card .speed-digital-val,
.dv-body .speed-digital-val {
    font-size: 3.4rem !important;
}

.v-detail-row.full-width {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 2px;
}

.v-detail-row.full-width span:first-child {
    font-size: 0.75rem;
    color: #94a3b8;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}


/* --- Safe Block Pending Badge (PREMIUM) --- */
.v-badge-safe-block {
    background: #fffbeb;
    /* Amber 50 */
    color: #fbbf24;
    /* Amber 400 */
    border: 1px solid #fcd34d;
    box-shadow: 0 0 15px rgba(251, 191, 36, 0.2);
    animation: pulse-premium-amber 2s infinite ease-in-out;
    font-weight: 800 !important;
    letter-spacing: 0.5px;
    padding: 6px 12px !important;
    text-transform: uppercase;
    font-size: 0.75rem !important;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 42px;
    line-height: 1.1;
}

/* Red Version for Blocked Status */
.v-badge-blocked-premium {
    background: #fef2f2;
    /* Red 50 */
    color: #dc2626;
    /* Red 600 */
    border: 1px solid #fecaca;
    box-shadow: 0 0 15px rgba(220, 38, 38, 0.2);
    animation: pulse-premium-red 1.5s infinite ease-in-out;
    font-weight: 800 !important;
    letter-spacing: 0.5px;
    padding: 6px 12px !important;
    text-transform: uppercase;
    font-size: 0.85rem !important;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 42px;
}

@keyframes pulse-premium-red {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.4);
    }

    50% {
        transform: scale(1.05);
        box-shadow: 0 0 20px rgba(220, 38, 38, 0.2);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0);
    }
}

@keyframes pulse-premium-amber {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.4);
    }

    50% {
        transform: scale(1.02);
        box-shadow: 0 0 15px rgba(251, 191, 36, 0.1);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(251, 191, 36, 0);
    }
}

/* Dashboard Specific Pulse */
@keyframes pulse-orange-text {
    0% {
        opacity: 0.6;
        text-shadow: 0 0 0px rgba(249, 115, 22, 0);
    }

    50% {
        opacity: 1;
        text-shadow: 0 0 8px rgba(249, 115, 22, 0.5);
    }

    100% {
        opacity: 0.6;
        text-shadow: 0 0 0px rgba(249, 115, 22, 0);
    }
}

.pulse-orange-premium {
    animation: pulse-orange-text 1.5s infinite;
}