:root {
    /* Single point of theme control */
    --primary-color: #1254A2;
    --primary-color-600: #1254A2;
    --primary-color-800: #1254A2;
    --primary-color-rgb: 18, 84, 162;
    --primary-50: rgba(var(--primary-color-rgb), 0.12);
    --primary-100: rgba(var(--primary-color-rgb), 0.22);
}

body {
    margin: 0;
    padding: 0;
    font-family: 'Quicksand', sans-serif;
    background: #f9fafb;
}

.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Shared Select2 theme */
.select2-container--default .select2-selection--single {
    height: 42px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    background-color: #fff !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #374151 !important;
    line-height: 40px !important;
    padding-left: 12px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px !important;
    right: 10px !important;
}

.select2-dropdown {
    border: 1px solid #f1f5f9 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    z-index: 9999 !important;
}

/* Map hardcoded amber utility classes to global primary color */
.text-primary-500 {
    color: var(--primary-color) !important;
}

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

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

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

.bg-primary-50\/50 {
    background-color: rgba(var(--primary-color-rgb), 0.12) !important;
}

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

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

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

.border-primary-100 {
    border-color: var(--primary-100) !important;
}

.border-primary-100\/50 {
    border-color: rgba(var(--primary-color-rgb), 0.22) !important;
}

.border-primary-500 {
    border-color: var(--primary-color) !important;
}

.hover\:text-primary-500:hover {
    color: var(--primary-color) !important;
}

.hover\:text-primary-600:hover {
    color: var(--primary-color-600) !important;
}

.hover\:text-white:hover {
    color: #ffffff !important;
}

.group:hover .group-hover\:text-primary-500 {
    color: var(--primary-color) !important;
}

.hover\:bg-primary-500:hover {
    background-color: var(--primary-color) !important;
}

.hover\:bg-primary-600:hover {
    background-color: var(--primary-color-600) !important;
}

.hover\:bg-primary-50:hover {
    background-color: var(--primary-50) !important;
}

.hover\:border-primary-500\/50:hover {
    border-color: rgba(var(--primary-color-rgb), 0.5) !important;
}

.focus\:border-primary-500\/50:focus {
    border-color: rgba(var(--primary-color-rgb), 0.5) !important;
}

.focus\:ring-primary-500\/5:focus {
    --tw-ring-color: rgba(var(--primary-color-rgb), 0.05) !important;
}

.hover\:ring-primary-500\/10:hover {
    --tw-ring-color: rgba(var(--primary-color-rgb), 0.1) !important;
}

.hover\:ring-primary-500\/20:hover {
    --tw-ring-color: rgba(var(--primary-color-rgb), 0.2) !important;
}

.peer:focus~.peer-focus\:ring-primary-500\/10 {
    --tw-ring-color: rgba(var(--primary-color-rgb), 0.1) !important;
}

.hover\:shadow-primary-500\/20:hover {
    --tw-shadow-color: rgba(var(--primary-color-rgb), 0.2) !important;
    --tw-shadow: var(--tw-shadow-colored) !important;
}

.group:focus-within .group-focus-within\:text-primary-500 {
    color: var(--primary-color) !important;
}

.group:focus-within .group-focus-within\:text-primary-600 {
    color: var(--primary-color-600) !important;
}

.accent-primary-500 {
    accent-color: var(--primary-color) !important;
}

.peer:checked~.peer-checked\:bg-primary-500 {
    background-color: var(--primary-color) !important;
}

/* Backward compatibility for existing amber classes */
.text-amber-500 {
    color: var(--primary-color) !important;
}

.text-amber-600 {
    color: var(--primary-color-600) !important;
}

.text-amber-800 {
    color: var(--primary-color-800) !important;
}

.bg-amber-50 {
    background-color: var(--primary-50) !important;
}

.bg-amber-50\/50 {
    background-color: rgba(var(--primary-color-rgb), 0.12) !important;
}

.bg-amber-100 {
    background-color: var(--primary-100) !important;
}

.bg-amber-500 {
    background-color: var(--primary-color) !important;
}

.bg-amber-600 {
    background-color: var(--primary-color-600) !important;
}

.border-amber-100 {
    border-color: var(--primary-100) !important;
}

.border-amber-100\/50 {
    border-color: rgba(var(--primary-color-rgb), 0.22) !important;
}

.border-amber-500 {
    border-color: var(--primary-color) !important;
}

.hover\:text-amber-500:hover {
    color: var(--primary-color) !important;
}

.hover\:text-amber-600:hover {
    color: var(--primary-color-600) !important;
}

.group:hover .group-hover\:text-amber-500 {
    color: var(--primary-color) !important;
}

.hover\:bg-amber-500:hover {
    background-color: var(--primary-color) !important;
}

.hover\:bg-amber-600:hover {
    background-color: var(--primary-color-600) !important;
}

.hover\:bg-amber-50:hover {
    background-color: var(--primary-50) !important;
}

.hover\:border-amber-500\/50:hover {
    border-color: rgba(var(--primary-color-rgb), 0.5) !important;
}

.focus\:border-amber-500\/50:focus {
    border-color: rgba(var(--primary-color-rgb), 0.5) !important;
}

.focus\:ring-amber-500\/5:focus {
    --tw-ring-color: rgba(var(--primary-color-rgb), 0.05) !important;
}

.hover\:ring-amber-500\/10:hover {
    --tw-ring-color: rgba(var(--primary-color-rgb), 0.1) !important;
}

.hover\:ring-amber-500\/20:hover {
    --tw-ring-color: rgba(var(--primary-color-rgb), 0.2) !important;
}

.peer:focus~.peer-focus\:ring-amber-500\/10 {
    --tw-ring-color: rgba(var(--primary-color-rgb), 0.1) !important;
}

.hover\:shadow-amber-500\/20:hover {
    --tw-shadow-color: rgba(var(--primary-color-rgb), 0.2) !important;
    --tw-shadow: var(--tw-shadow-colored) !important;
}

.group:focus-within .group-focus-within\:text-amber-500 {
    color: var(--primary-color) !important;
}

.group:focus-within .group-focus-within\:text-amber-600 {
    color: var(--primary-color-600) !important;
}

.accent-amber-500 {
    accent-color: var(--primary-color) !important;
}

.peer:checked~.peer-checked\:bg-amber-500 {
    background-color: var(--primary-color) !important;
}