:root {
    --light-bg: #f8f9fa;
    --light-card-bg: #ffffff;
    --light-text: #212529;
    --light-text-muted: #6c757d;
    --light-border: #dee2e6;

    --dark-bg: #1a1a1a;
    --dark-card-bg: #2c2c2c;
    --dark-text: #e9ecef;
    --dark-text-muted: #adb5bd;
    --dark-border: #495057;

    --bs-primary: #0d6efd;
    --bs-success: #198754;
    --bs-danger: #dc3545;
    --bs-warning: #ffc107;

    --font-family-sans-serif: 'Vazirmatn', sans-serif;
}

body {
    font-family: var(--font-family-sans-serif);
    background-color: var(--light-bg);
    color: var(--light-text);
    transition: background-color 0.2s, color 0.2s;
}

body.dark-mode {
    background-color: var(--dark-bg);
    color: var(--dark-text);
}

body.dark-mode .text-muted {
    color: var(--dark-text-muted) !important;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h5,
body.dark-mode .h2,
body.dark-mode .h5,
body.dark-mode p {
    color: var(--dark-text);
}

body.dark-mode .card {
    background-color: var(--dark-card-bg);
    border-color: var(--dark-border);
}

.card {
    background-color: var(--light-card-bg);
    border-color: var(--light-border);
    border-radius: 0.75rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

body.dark-mode .card {
    background-color: var(--dark-card-bg);
    border-color: var(--dark-border);
}

.service-shutdown .card-body,
.service-shutdown .card-footer {
    opacity: 0.6;
}

.incident-card .admin-comment {
    background-color: rgba(0, 0, 0, 0.03);
    border-left: 4px solid var(--bs-primary);
}

.ltr {
    direction: ltr;
    text-align: left;
}

body.dark-mode .incident-card .admin-comment {
    background-color: rgba(255, 255, 255, 0.05);
}