/* Dynamic Theme CSS for Django Unfold Admin - Targeted Approach */

:root {
    --theme-primary: #ffed00;
    --theme-primary-hover: #fef371;
    --theme-text: #000000;
    --theme-button-text: #000000;
    --theme-font: "Courier New", monospace;
}

/* TARGETED FONT OVERRIDE - Only text elements, not icons */
body,
html,
.font-inter,
input, textarea, select, button,
h1, h2, h3, h4, h5, h6,
p, span:not([class*="material-"]):not([class*="icon"]),
div:not([class*="icon"]),
a:not([class*="icon"]),
li:not([class*="icon"]),
td, th,
label,
.form-control,
.sidebar a,
.nav-link,
.breadcrumb {
    font-family: var(--theme-font) !important;
}

/* TEXT COLOR - Use primary text color for all text */
body,
html,
h1, h2, h3, h4, h5, h6,
p, span:not([class*="material-"]):not([class*="icon"]),
div:not([class*="icon"]),
a:not([class*="icon"]),
li:not([class*="icon"]),
td, th,
label,
.form-control,
.sidebar a,
.nav-link,
.breadcrumb,
.text-gray-900,
.text-gray-800,
.text-gray-700,
.text-gray-600,
.text-gray-500 {
    color: var(--theme-text) !important;
}

/* PRIMARY COLOR BUTTONS */
.bg-primary-600,
.bg-primary-500,
.bg-primary-700,
button[type="submit"],
.btn-primary,
input[type="submit"],
.button,
.submit-row input,
[class*="bg-primary-"] {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
}

/* HOVER STATES */
.bg-primary-600:hover,
.bg-primary-500:hover,
.bg-primary-700:hover,
button[type="submit"]:hover,
.btn-primary:hover,
input[type="submit"]:hover,
.button:hover,
[class*="bg-primary-"]:hover,
nav a:hover,
nav button:hover,
.sidebar a:hover,
.sidebar button:hover,
.nav-link:hover,
.menu-item:hover {
    background-color: var(--theme-primary-hover) !important;
    color: var(--theme-text) !important;
}

/* ACTIVE/CLICKED STATES - Target containers, not child elements */
.active,
.selected,
.current,
[aria-selected="true"],
[aria-current="page"],
.bg-primary-100,
.bg-primary-50,
.bg-gray-100,
nav .active,
.sidebar .active,
.nav-item.active,
.nav-link.active,
.tab.active,
.menu-item.active,
li.active,
tr.selected,
.row-selected,
button:active,
.btn:active {
    background-color: var(--theme-primary) !important;
}

/* Active state text color - target text elements within active containers */
.active span:not([class*="material-"]):not([class*="icon"]),
.selected span:not([class*="material-"]):not([class*="icon"]),
.current span:not([class*="material-"]):not([class*="icon"]),
[aria-selected="true"] span:not([class*="material-"]):not([class*="icon"]),
[aria-current="page"] span:not([class*="material-"]):not([class*="icon"]),
.bg-gray-100 span:not([class*="material-"]):not([class*="icon"]),
nav .active span:not([class*="material-"]):not([class*="icon"]),
.sidebar .active span:not([class*="material-"]):not([class*="icon"]),
.nav-item.active span:not([class*="material-"]):not([class*="icon"]),
.nav-link.active span:not([class*="material-"]):not([class*="icon"]),
.tab.active span:not([class*="material-"]):not([class*="icon"]),
.menu-item.active span:not([class*="material-"]):not([class*="icon"]),
li.active span:not([class*="material-"]):not([class*="icon"]),
button:active span:not([class*="material-"]):not([class*="icon"]),
.btn:active span:not([class*="material-"]):not([class*="icon"]) {
    color: var(--theme-text) !important;
}

/* Override Tailwind text-primary-* classes */
.text-primary-600,
.text-primary-500,
.text-primary-700 {
    color: var(--theme-text) !important;
}

/* PRIMARY TEXT COLORS - specific classes that should use primary color */
.text-primary-600,
.text-primary-500,
.text-primary-700,
a.text-primary-600 {
    color: var(--theme-primary) !important;
}

/* PRIMARY TEXT COLOR CLASS - should use text color, not primary color */
.text-primary-text-color {
    color: var(--theme-text) !important;
}

/* BUTTON TEXT COLOR CLASS - should use button text color */
.text-button-text-color {
    color: var(--theme-button-text) !important;
}

/* BACKGROUND COLORS FOR THEME CLASSES */
.bg-primary-field-color {
    background-color: var(--theme-primary) !important;
}

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

/* BORDER COLORS FOR THEME CLASSES */
.border-primary-field-color {
    border-color: var(--theme-primary) !important;
}

/* OVERRIDE COMPILED CSS CLASSES */
/* Override text-white to use theme button text color for buttons - with higher specificity */
button.bg-primary-600.text-white,
button.bg-primary-500.text-white,
button.bg-primary-700.text-white,
.bg-primary-600.text-white,
.bg-primary-500.text-white,
.bg-primary-700.text-white,
button.text-white,
.btn.text-white,
input[type="submit"].text-white,
.button.text-white,
button[type="submit"].text-white {
    color: var(--theme-button-text) !important;
}

/* BORDER COLORS */
.border-primary-600,
.border-primary-500,
.border-primary-700,
[class*="border-primary-"] {
    border-color: var(--theme-primary) !important;
}

/* FOCUS STATES */
input:focus,
textarea:focus,
select:focus,
.focus\:ring-primary-500:focus,
.focus\:ring-primary-600:focus,
.focus\:border-primary-500:focus,
.focus\:border-primary-600:focus {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 0 2px var(--theme-primary) !important;
}

/* FORM ELEMENTS */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
}

/* TABLE ROW HOVER */
tr:hover,
.table-row:hover,
.list-row:hover {
    background-color: color-mix(in srgb, var(--theme-primary) 10%, transparent) !important;
}

/* RING COLORS */
.ring-primary-500,
.ring-primary-600,
[class*="ring-primary-"] {
    --tw-ring-color: var(--theme-primary) !important;
}