﻿
        :root {
            --brand-secondary: #FFD700;
            --brand-primary: #040990;
            --brand-dark-gray: #434244;
            --brand-medium-gray: #808285;
            --brand-white: #ffffff;
        }

        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

            /* font-family: 'NORD', sans-serif; */
        }

        .navbar-dark {
            background-color: var(--brand-primary) !important;
        }

        .btn-primary {
            background-color: var(--brand-secondary);
            border-color: var(--brand-secondary);
            color: var(--brand-primary);
            font-weight: 600;
        }

        .btn-primary:hover, .btn-primary:focus {
            background-color: #FFD700;
            border-color: #FFD700;
            color: var(--brand-primary);
        }

        .btn-outline-primary {
            color: var(--brand-secondary);
            border-color: var(--brand-secondary);
        }

        .btn-outline-primary:hover {
            background-color: var(--brand-secondary);
            border-color: var(--brand-secondary);
            color: var(--brand-primary);
        }

        .text-primary {
            color: var(--brand-secondary) !important;
        }

        .bg-primary {
            background-color: var(--brand-secondary) !important;
            color: var(--brand-primary) !important;
        }

        .badge.bg-primary {
            background-color: var(--brand-secondary) !important;
            color: var(--brand-primary) !important;
        }

        .vehicle-card {
            transition: transform 0.3s, box-shadow 0.3s;
            border: none;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            border-radius: 12px;
            overflow: hidden;
        }

        .vehicle-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 25px rgba(255, 204, 0, 0.2);
        }

        .auction-timer {
            font-weight: bold;
            color: #dc3545;
            font-size: 0.9rem;
        }

        .vehicle-badge {
            position: absolute;
            top: 10px;
            left: 10px;
            z-index: 10;
        }

        .condition-badge {
            position: absolute;
            top: 10px;
            right: 10px;
            z-index: 10;
        }

        .vehicle-specs {
            font-size: 0.85rem;
            color: var(--brand-medium-gray);
        }

        .bid-section {
            background-color: #f8f9fa;
            border-top: 1px solid #dee2e6;
        }

        .filter-section {
            background-color: var(--brand-white);
            border-radius: 12px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            border: 2px solid var(--brand-secondary);
        }

        .hero-section {
            background: linear-gradient(135deg, var(--brand-primary), var(--brand-dark-gray));
            color: var(--brand-white);
            padding: 80px 0;
            position: relative;
            overflow: hidden;
        }

        .hero-section::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(270deg, #FFD700, #040990, #FFD700);
            background-size: 600% 600%;
            mix-blend-mode: overlay;
            animation: gradientFlow 20s ease infinite;
            opacity: 0.08;
            z-index: 0;
        }

        @keyframes gradientFlow {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
        }

        .hero-content {
            position: relative;
            z-index: 1;
        }


        .hero-content {
            position: relative;
            z-index: 2;
        }

        .stats-card {
            background: rgba(255, 204, 0, 0.1);
            backdrop-filter: blur(10px);
            border: 2px solid var(--brand-secondary);
            border-radius: 12px;
        }

        .brand-logo {
            color: var(--brand-secondary);
            font-weight: bold;
            font-size: 1.5rem;
        }

        .progress-bar {
            background-color: var(--brand-secondary);
        }

        .list-group-item.active {
            background-color: var(--brand-secondary);
            border-color: var(--brand-secondary);
            color: var(--brand-primary);
        }

        .page-link {
            color: var(--brand-dark-gray);
        }

        .page-item.active .page-link {
            background-color: var(--brand-secondary);
            border-color: var(--brand-secondary);
            color: var(--brand-primary);
        }

        .rental-badge {
            background-color: var(--brand-secondary);
            color: var(--brand-primary);
            font-weight: 600;
        }

        .card-header.bg-primary {
            background-color: var(--brand-secondary) !important;
            color: var(--brand-primary) !important;
            font-weight: 600;
        }

        .navbar-brand {
            font-weight: bold;
            font-size: 1.4rem;
        }

        .brand-secondary-text {
            color: var(--brand-secondary) !important;
        }

        .footer-bg {
            background-color: var(--brand-dark-gray) !important;
        }

        .maintenance-badge {
            background-color: #28a745;
            color: white;
        }
