/*
 * Drone Preflight — Filament v2 Brand Color Theme
 * Harmonizes all Filament primary UI components with the official logo (#005ec4)
 */

:root {
    --dp-brand-50: 239 246 255;
    --dp-brand-100: 219 234 254;
    --dp-brand-200: 191 219 254;
    --dp-brand-300: 147 197 253;
    --dp-brand-400: 59 130 246;
    --dp-brand-500: 14 116 228;
    --dp-brand-600: 0 94 196;
    --dp-brand-700: 0 74 158;
}

/* ─── Filament Structural Accents & Rich Inputs ─── */
.filament-login-page {
    background-image: radial-gradient(circle at top, #dbeafe, #f8fafc 55%);
}

.filament-login-page form:before {
    background-image: linear-gradient(to right, #e2e8f0, #3b82f6, #e2e8f0);
}

:is(.dark .filament-login-page form):before {
    background-image: linear-gradient(to right, #374151, #3b82f6, #374151);
}

.filament-sidebar-header:before {
    background-image: linear-gradient(to right, #e2e8f0, #3b82f6, #e2e8f0);
}

:is(.dark .filament-sidebar-header):before {
    background-image: linear-gradient(to right, #374151, #3b82f6, #374151);
}

trix-toolbar .filament-forms-rich-editor-component-toolbar-button.trix-active {
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(var(--dp-brand-600) / var(--tw-bg-opacity));
    color: rgb(255 255 255 / var(--tw-text-opacity));
}

.is-focused .choices__inner,
.is-open .choices__inner {
    --tw-border-opacity: 1;
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--dp-brand-600) / var(--tw-ring-opacity));
    border-color: rgb(var(--dp-brand-600) / var(--tw-border-opacity));
}

.choices__list--multiple .choices__item {
    --tw-text-opacity: 1;
    background-color: rgba(0, 94, 196, 0.1);
    color: rgb(var(--dp-brand-700) / var(--tw-text-opacity));
}

.dark .choices__list--multiple .choices__item {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-400) / var(--tw-text-opacity));
}

.choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(var(--dp-brand-600) / var(--tw-bg-opacity));
    color: rgb(255 255 255 / var(--tw-text-opacity));
}

.choices[data-type*=select-multiple] .choices__button {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-700) / var(--tw-text-opacity));
}

/* ─── Base Primary Utilities ─── */
.border-primary-500 {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-600) / var(--tw-border-opacity));
}

.border-primary-600 {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-600) / var(--tw-border-opacity));
}

.bg-primary-50 {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-50) / var(--tw-bg-opacity));
}

.bg-primary-100 {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-100) / var(--tw-bg-opacity));
}

.bg-primary-200 {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-200) / var(--tw-bg-opacity));
}

.bg-primary-500 {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-600) / var(--tw-bg-opacity));
}

.bg-primary-500\/10 {
    background-color: rgba(0, 94, 196, 0.1);
}

.bg-primary-600 {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-600) / var(--tw-bg-opacity));
}

.bg-primary-700 {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-700) / var(--tw-bg-opacity));
}

.text-primary-50 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-50) / var(--tw-text-opacity));
}

.text-primary-400 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-400) / var(--tw-text-opacity));
}

.text-primary-500 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-600) / var(--tw-text-opacity));
}

.text-primary-600 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-600) / var(--tw-text-opacity));
}

.text-primary-700 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-700) / var(--tw-text-opacity));
}

.ring-primary-500 {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--dp-brand-600) / var(--tw-ring-opacity));
}

.ring-primary-600 {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--dp-brand-600) / var(--tw-ring-opacity));
}

/* ─── Hover, Focus & Group Variants ─── */
.focus-within\:border-primary-500:focus-within {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-600) / var(--tw-border-opacity));
}

.focus-within\:ring-primary-500:focus-within {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--dp-brand-600) / var(--tw-ring-opacity));
}

.hover\:bg-primary-500:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-500) / var(--tw-bg-opacity));
}

.hover\:bg-primary-600\/20:hover {
    background-color: rgba(0, 94, 196, 0.2);
}

.hover\:text-primary-500:hover {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-500) / var(--tw-text-opacity));
}

.hover\:text-primary-700:hover {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-700) / var(--tw-text-opacity));
}

.focus\:border-primary-300:focus {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-300) / var(--tw-border-opacity));
}

.focus\:border-primary-500:focus {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-600) / var(--tw-border-opacity));
}

.focus\:border-primary-600:focus {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-600) / var(--tw-border-opacity));
}

.focus\:bg-primary-50:focus {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-50) / var(--tw-bg-opacity));
}

.focus\:bg-primary-500:focus {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-500) / var(--tw-bg-opacity));
}

.focus\:bg-primary-500\/10:focus {
    background-color: rgba(0, 94, 196, 0.1);
}

.focus\:bg-primary-700:focus {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-700) / var(--tw-bg-opacity));
}

.focus\:bg-primary-700\/20:focus {
    background-color: rgba(0, 74, 158, 0.2);
}

.focus\:text-primary-500:focus {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-600) / var(--tw-text-opacity));
}

.focus\:text-primary-600:focus {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-600) / var(--tw-text-opacity));
}

.focus\:ring-primary-200:focus {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--dp-brand-200) / var(--tw-ring-opacity));
}

.focus\:ring-primary-500:focus {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--dp-brand-600) / var(--tw-ring-opacity));
}

.focus\:ring-primary-600:focus {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(var(--dp-brand-600) / var(--tw-ring-opacity));
}

.focus\:ring-offset-primary-700:focus {
    --tw-ring-offset-color: #004a9e;
}

.group:focus-within .group-focus-within\:text-primary-500 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-600) / var(--tw-text-opacity));
}

.group:hover .group-hover\:text-primary-100 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-100) / var(--tw-text-opacity));
}

.group:hover .group-hover\:text-primary-500 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-600) / var(--tw-text-opacity));
}

.group:focus .group-focus\:text-primary-100 {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-100) / var(--tw-text-opacity));
}

/* ─── Dark Mode Primary Variants ─── */
:is(.dark .dark\:border-primary-500) {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-400) / var(--tw-border-opacity));
}

:is(.dark .dark\:bg-primary-100) {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-100) / var(--tw-bg-opacity));
}

:is(.dark .dark\:bg-primary-600) {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-600) / var(--tw-bg-opacity));
}

:is(.dark .dark\:text-primary-300) {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-300) / var(--tw-text-opacity));
}

:is(.dark .dark\:text-primary-500) {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-400) / var(--tw-text-opacity));
}

:is(.dark .dark\:text-primary-700) {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-700) / var(--tw-text-opacity));
}

:is(.dark .dark\:checked\:border-primary-600:checked) {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-600) / var(--tw-border-opacity));
}

:is(.dark .dark\:checked\:bg-primary-500:checked) {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-500) / var(--tw-bg-opacity));
}

:is(.dark .dark\:checked\:bg-primary-600:checked) {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--dp-brand-600) / var(--tw-bg-opacity));
}

:is(.dark .dark\:hover\:bg-primary-500\/20:hover) {
    background-color: rgba(59, 130, 246, 0.2);
}

:is(.dark .dark\:hover\:text-primary-400:hover) {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-300) / var(--tw-text-opacity));
}

:is(.dark .dark\:hover\:text-primary-500:hover) {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-400) / var(--tw-text-opacity));
}

:is(.dark .dark\:focus\:border-primary-400:focus) {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-400) / var(--tw-border-opacity));
}

:is(.dark .dark\:focus\:border-primary-500:focus) {
    --tw-border-opacity: 1;
    border-color: rgb(var(--dp-brand-400) / var(--tw-border-opacity));
}

:is(.dark .dark\:focus\:bg-primary-600\/20:focus) {
    background-color: rgba(0, 94, 196, 0.2);
}

:is(.dark .dark\:focus\:text-primary-400:focus) {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-400) / var(--tw-text-opacity));
}

:is(.dark .dark\:focus\:text-primary-600:focus) {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-500) / var(--tw-text-opacity));
}

:is(.dark .dark\:focus\:ring-offset-primary-600:focus) {
    --tw-ring-offset-color: #005ec4;
}

:is(.dark .group:hover .dark\:group-hover\:text-primary-400) {
    --tw-text-opacity: 1;
    color: rgb(var(--dp-brand-400) / var(--tw-text-opacity));
}

