:root {
            /* Fully Dynamic Light Mode - Premium Agency */
            --color-brand-dark: 248 250 252;  /* Slate 50 for a clean, premium background */
            --color-brand-light: 2 6 23;      /* Slate 950 for very sharp text */
            --color-brand-primary: 79 70 229;    /* Indigo 600 */
            --color-brand-secondary: 234 88 12;  /* Orange 600 */
            --color-brand-accent: 8 145 178;     /* Teal Blue #0891B2 */
        }

        .dark {
            /* Fully Dynamic Dark Mode - Premium Agency */
            --color-brand-dark: 12 10 16;     /* Deep rich dark bg */
            --color-brand-light: 248 250 252; /* Crisp white-ish text */
            --color-brand-primary: 99 102 241;   /* Indigo 500 */
            --color-brand-secondary: 251 146 60; /* Orange 400 (Funky Energy) */
            --color-brand-accent: 8 145 178;    /* Teal Blue #0891B2 */
        }

        /* Dynamic Text Shine Effect based on theme */
        .shine-text {
            background: linear-gradient(90deg, 
                rgb(var(--color-brand-light)), 
                rgb(var(--color-brand-secondary)), 
                rgb(var(--color-brand-accent)), 
                rgb(var(--color-brand-primary)), 
                rgb(var(--color-brand-light))
            );
            background-size: 200% auto;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            animation: shine 8s linear infinite;
        }
        
        @keyframes shine {
            to { background-position: -200% center; }
        }

        /* Nice Select 2 Custom Styling */
        select {
            display: none !important;
        }

        .nice-select {
            background-color: transparent !important;
            background: transparent !important;
            border: 1px solid rgb(var(--color-brand-light) / 0.1) !important;
            border-radius: 0.75rem !important; /* rounded-xl */
            color: rgb(var(--color-brand-light) / 0.7) !important;
            height: auto !important;
            padding: 16px 20px !important; /* Matches py-4 px-5 */
            line-height: 1.5 !important;
            width: 100% !important;
            transition: all 0.3s ease !important;
            display: flex !important;
            align-items: center !important;
            font-size: 0.875rem !important;
        }

        .nice-select .current {
            color: rgb(var(--color-brand-light) / 0.9) !important;
            font-weight: 500 !important;
        }

        /* Hide the redundant FontAwesome arrow icon if it exists */
        .nice-select + i, 
        .nice-select + .fa-chevron-down,
        .nice-select + .fas {
            display: none !important;
        }

        .nice-select:after {
            border-bottom: 2px solid rgb(var(--color-brand-accent)) !important;
            border-right: 2px solid rgb(var(--color-brand-accent)) !important;
            width: 8px !important;
            height: 8px !important;
            right: 20px !important;
        }

        .nice-select .list, 
        .nice-select-dropdown {
            background-color: rgb(var(--color-brand-dark) / 0.95) !important;
            backdrop-filter: blur(12px) !important;
            border: 1px solid rgb(var(--color-brand-light) / 0.1) !important;
            border-radius: 1rem !important;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
            width: 100% !important;
            margin-top: 0px !important;
            max-height: 250px !important;
            overflow-y: auto !important;
            -ms-overflow-style: none !important;
            scrollbar-width: none !important;
            z-index: 9999 !important;
        }

        .nice-select .list::-webkit-scrollbar,
        .nice-select-dropdown::-webkit-scrollbar {
            display: none !important;
        }

        .nice-select .option {
            padding: 12px 20px !important;
            color: rgb(var(--color-brand-light) / 0.7) !important;
            transition: all 0.2s ease !important;
            line-height: 1.4 !important;
            font-size: 0.875rem !important;
        }

        .nice-select .option:hover, 
        .nice-select .option.focus, 
        .nice-select .option.selected.focus {
            background-color: rgb(var(--color-brand-accent) / 0.1) !important;
            color: rgb(var(--color-brand-accent)) !important;
        }

        .nice-select .option.selected {
            font-weight: 700 !important;
            color: rgb(var(--color-brand-accent)) !important;
        }

        .nice-select.open {
            border-color: rgb(var(--color-brand-accent) / 0.5) !important;
            background: rgb(var(--color-brand-accent) / 0.05) !important;
            z-index: 9999 !important;
        }

        .nice-select:active, .nice-select.open, .nice-select:focus {
            border-color: rgb(var(--color-brand-accent) / 0.5) !important;
        }

        /* Fix for potential white background in some browsers */
        .nice-select .nice-select-dropdown {
            background-color: rgb(var(--color-brand-dark) / 0.98) !important;
            border: 1px solid rgb(var(--color-brand-light) / 0.1) !important;
            border-radius: 1rem !important;
            box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6) !important;
        }

        /* ============================================================
           Custom Theme Gradient Scrollbar (Transparent Track)
           ============================================================ */
        /* Firefox */
        html {
            scrollbar-width: thin;
            scrollbar-color: #06b6d4 transparent;
        }

        /* WebKit (Chrome, Edge, Safari, Opera) */
        ::-webkit-scrollbar {
            width: 9px;
            height: 9px;
        }

        ::-webkit-scrollbar-track {
            background: transparent !important;
        }

        ::-webkit-scrollbar-thumb {
            background: linear-gradient(180deg, 
                #06b6d4 0%, 
                #0891b2 30%, 
                #6366f1 70%, 
                #a855f7 100%
            ) !important;
            border-radius: 9999px !important;
            border: 1.5px solid rgba(0, 0, 0, 0.2) !important;
            box-shadow: inset 0 0 4px rgba(255, 255, 255, 0.3);
            transition: all 0.3s ease;
        }

        ::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(180deg, 
                #f97316 0%, 
                #ec4899 35%, 
                #8b5cf6 70%, 
                #06b6d4 100%
            ) !important;
            box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.5), 0 0 8px rgba(6, 182, 212, 0.6);
        }

        ::-webkit-scrollbar-corner {
            background: transparent !important;
        }