/* DVR Monitor - Dark Theme */

:root {
    --green-main: #00c853;
    --green-dark: #007e33;
}

/* Status dots */
.status-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    animation: pulse 2s infinite;
}
.status-dot.online {
    background-color: var(--green-main);
    box-shadow: 0 0 6px var(--green-main);
}
.status-dot.offline {
    background-color: #f44336;
    box-shadow: 0 0 6px #f44336;
    animation: none;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.4; }
}

/* Camera stream */
.camera-stream {
    display: block;
    background: #000;
    min-height: 300px;
    max-height: 70vh;
    object-fit: contain;
}

/* Login card */
.login-card {
    border: 1px solid #2a2a2a;
    background: #1a1a1a !important;
}

/* Table improvements */
.table-dark th {
    background: #1a1a1a;
    border-color: #333;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Alert badge pulse */
.animate-pulse {
    animation: pulse 1.5s infinite;
}

/* Card improvements */
.card {
    background-color: #1a1a1a;
}
.card-header {
    background-color: #111;
    border-bottom-color: #2a2a2a;
}
.card-footer {
    background-color: #111;
    border-top-color: #2a2a2a;
}

/* Navbar */
.navbar-dark.bg-dark {
    background-color: #0d0d0d !important;
}

/* Form controls */
.form-control, .form-select {
    background-color: #1e1e1e;
    border-color: #333;
    color: #e0e0e0;
}
.form-control:focus, .form-select:focus {
    background-color: #1e1e1e;
    border-color: var(--green-main);
    color: #e0e0e0;
    box-shadow: 0 0 0 0.2rem rgba(0, 200, 83, 0.2);
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #111; }
::-webkit-scrollbar-thumb { background: #444; border-radius: 3px; }

/* Responsive camera */
@media (max-width: 576px) {
    .camera-stream { min-height: 200px; }
}