:root {
    --bg-primary: #0a0a0a;
    --bg-secondary: #111;
    --bg-card: #141414;
    --bg-card-hover: #1a1a1a;
    --bg-input: #0d0d0d;
    --text-primary: #d0d0d0;
    --text-secondary: #999;
    --text-muted: #666;
    --accent: #8b0000;
    --accent-light: #a00000;
    --accent-gold: #c9a84c;
    --accent-green: #00cc66;
    --accent-green-bg: #0a1a0a;
    --border: #1a1a1a;
    --border-light: #252525;
}

html, body {
    background: #0a0a0a !important;
    color: #d0d0d0 !important;
    font-family: 'Segoe UI', system-ui, sans-serif !important;
    margin: 0;
    padding: 0;
}

.navbar {
    background: #0d0d0d !important;
    border-bottom: 1px solid #1a1a1a !important;
}

.navbar-brand {
    color: #c9a84c !important;
    font-weight: 700;
    letter-spacing: 3px;
}

.navbar-nav .nav-link {
    color: #999 !important;
}

    .navbar-nav .nav-link:hover {
        color: #c9a84c !important;
    }

.card {
    background: #141414 !important;
    border: 1px solid #1a1a1a !important;
    border-radius: 6px;
    transition: all 0.3s;
}

    .card:hover {
        border-color: #8b0000;
        box-shadow: 0 0 20px rgba(139,0,0,0.2);
    }

.card-header {
    background: linear-gradient(135deg,#0a0000,#1a0000) !important;
    border-bottom: 1px solid #8b0000 !important;
    color: #c9a84c !important;
}

.card-footer {
    background: #0d0d0d !important;
    border-top: 1px solid #1a1a1a !important;
}

.table {
    color: #d0d0d0 !important;
}

    .table thead th {
        background: #0d0d0d !important;
        color: #c9a84c !important;
        border-color: #1a1a1a !important;
    }

    .table td {
        background: transparent !important;
        border-color: #1a1a1a !important;
    }

.btn {
    border-radius: 4px;
    font-weight: 500;
    transition: all 0.3s;
}

.btn-primary {
    background: #8b0000 !important;
    border-color: #8b0000 !important;
}

    .btn-primary:hover {
        background: #a00000 !important;
        box-shadow: 0 0 15px rgba(139,0,0,0.4);
    }

.btn-success {
    background: #0a1a0a !important;
    border-color: #0a2a0a !important;
    color: #00cc66 !important;
}

.btn-secondary {
    background: #1a1a1a !important;
    border-color: #2a2a2a !important;
    color: #999 !important;
}

.btn-danger {
    background: #1a0a0a !important;
    border-color: #2a0a0a !important;
    color: #f66 !important;
}

.btn-info {
    background: #0a1a2a !important;
    border-color: #1a2a3a !important;
    color: #6af !important;
}

.btn-outline-primary {
    border-color: #8b0000 !important;
    color: #a00000 !important;
    background: transparent !important;
}

    .btn-outline-primary:hover {
        background: #8b0000 !important;
        color: #fff !important;
    }

.form-control, .form-select {
    background: #0d0d0d !important;
    border: 1px solid #252525 !important;
    color: #d0d0d0 !important;
}

    .form-control:focus, .form-select:focus {
        border-color: #8b0000 !important;
        box-shadow: 0 0 0 0.15rem rgba(139,0,0,0.3) !important;
    }

.form-label {
    color: #999 !important;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 1px;
}

.alert-success {
    background: #0a1a0a !important;
    border-color: #0a2a0a !important;
    color: #00cc66 !important;
}

.alert-danger {
    background: #1a0a0a !important;
    border-color: #2a0a0a !important;
    color: #f66 !important;
}

.alert-warning {
    background: #1a1a0a !important;
    border-color: #2a2a0a !important;
    color: #cc6 !important;
}

.alert-info {
    background: #0a1a1a !important;
    border-color: #0a2a2a !important;
    color: #6cc !important;
}

a {
    color: #c9a84c;
    text-decoration: none;
}

    a:hover {
        color: #e0c060;
    }

h1, h2, h3, h4, h5, h6 {
    color: #d0d0d0;
}

.text-muted {
    color: #666 !important;
}

.dropdown-menu {
    background: #141414 !important;
    border: 1px solid #1a1a1a !important;
}

.dropdown-item {
    color: #999 !important;
}

    .dropdown-item:hover {
        background: #1a1a1a !important;
        color: #c9a84c !important;
    }

.footer {
    background: #0d0d0d !important;
    border-top: 1px solid #1a1a1a !important;
}

.price-tag {
    background: #0a1a0a;
    color: #00cc66;
    border: 1px solid #0a3a0a;
    padding: 6px 14px;
    display: inline-block;
    font-size: 1rem;
    text-shadow: 0 0 8px rgba(0,204,102,0.4);
    letter-spacing: 1px;
    border-radius: 4px;
}

.role-card {
    cursor: pointer;
    border: 2px solid #1a1a1a !important;
    background: #141414 !important;
    transition: all 0.3s;
}

    .role-card:hover, .role-card.selected {
        border-color: #8b0000 !important;
        box-shadow: 0 0 25px rgba(139,0,0,0.4);
        background: #0f0505 !important;
    }

.list-group-item {
    background: #141414 !important;
    border-color: #1a1a1a !important;
    color: #d0d0d0 !important;
}

.list-group-item-action {
    color: #999 !important;
}

    .list-group-item-action:hover {
        background: #1a1a1a !important;
        color: #c9a84c !important;
    }

.breadcrumb {
    background: transparent !important;
}

.breadcrumb-item a {
    color: #c9a84c;
}

.breadcrumb-item.active {
    color: #666;
}

@media (max-width: 768px) {
    .display-4 {
        font-size: 2rem;
    }

    .card-body {
        padding: 12px;
    }

    h1 {
        font-size: 1.5rem;
    }
}
.rating-stars {
    display: flex;
    justify-content: center;
    gap: 4px;
    flex-direction: row-reverse;
}

    .rating-stars input {
        display: none;
    }

    .rating-stars label {
        cursor: pointer;
        font-size: 1.8rem;
        color: #666;
        transition: color 0.2s;
    }

        .rating-stars label:hover, .rating-stars label:hover ~ label,
        .rating-stars input:checked ~ label {
            color: #c9a84c;
        }