/* Black & Orange Theme - Muted Tones */

/* Body - pure black background with white text */
body {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* Header - black with subtle orange border */
header {
    background-color: #000000 !important;
    border-color: #FFA060 !important;
}

/* Navigation links - muted orange */
nav a {
    color: #FFB070 !important;
}
nav a:hover {
    color: #FF8E48 !important;
}

/* Buttons - muted orange styling */
.bg-black.text-white:not(.hover\:bg-gray-800) {
    background-color: #FFA060 !important;
    color: #000000 !important;
}
.bg-black.text-white:not(.hover\:bg-gray-800):hover {
    background-color: #FFB070 !important;
}
.hover\:bg-gray-800:hover.bg-black {
    background-color: #FFA060 !important;
}

/* White backgrounds - pure black */
.bg-white {
    background-color: #000000 !important;
}

/* Gray backgrounds - dark shades with slight warmth */
.bg-gray-50 {
    background-color: #1a1208 !important;
}
.bg-gray-100 {
    background-color: #1f1610 !important;
}
.bg-gray-900, .from-gray-90\.to-black {
    background-color: #000000 !important;
}
.to-black {
    background-color: #000000 !important;
}

/* Gray-800 backgrounds - muted orange */
.bg-gray-800 {
    background-color: #FFA060 !important;
    color: #000000 !important;
}

/* Text colors - white for body, orange for headings */
.text-gray-900, .text-gray-800, .text-gray-700, .text-gray-600, .text-gray-500 {
    color: #ffffff !important;
}

/* Text white should remain white */
.text-white {
    color: #ffffff !important;
}

/* Hover states */
.text-gray-700:hover\:text-gray-900:hover {
    color: #FF8E48 !important;
}

/* Borders - muted orange */
.border-gray-100, .border-gray-200 {
    border-color: #FFA060 !important;
}
.border-gray-300 {
    border-color: #FFB070 !important;
}

/* Form inputs - warm dark background with white text */
input, textarea, select {
    background-color: #1f1610 !important;
    color: #ffffff !important;
    border-color: #FFA060 !important;
}

input::placeholder, textarea::placeholder {
    color: #FFA060 !important;
}

.input, textarea, select option {
    background-color: #1f1610 !important;
    color: #ffffff !important;
}

/* Green button - change to muted orange */
.bg-green-500 {
    background-color: #FFA060 !important;
    color: #000000 !important;
}
.bg-green-500:hover\:bg-green-600:hover {
    background-color: #FFB070 !important;
}

/* Available badge - ensure black text on orange background */
.bg-green-500.text-white {
    background-color: #FFA060 !important;
    color: #000000 !important;
}

/* Mobile nav - pure black */
#mobileNav {
    background-color: #000000 !important;
    border-color: #FFA060 !important;
}

/* Shadow colors - muted orange glow */
.shadow-sm {
    box-shadow: 0 1px 2px 0 rgba(255, 142, 72, 0.3) !important;
}

/* Gradients - black (but not on sections with background images) */
section.bg-gradient-to-br[class*="from-gray-900"],
section.bg-gradient-to-br[class*="from-gray-900"] * {
    background-image: none !important;
}

section.bg-gradient-to-br[class*="from-gray-900"] {
    background-color: #000000 !important;
}

/* Stars and icons - muted orange */
.text-yellow-400, svg.text-yellow-400, .flex.text-yellow-400 svg, .flex.text-yellow-400 .text-yellow-400 {
    color: #FFB070 !important;
    fill: #FFB070 !important;
}

/* All star icons in reviews */
.flex.text-yellow-400 svg path {
    fill: #FFB070 !important;
}

/* Specific rating star styling */
svg[fill="currentColor"] {
    color: #FFB070 !important;
    fill: #FFB070 !important;
}

/* Ensure star elements are always orange in dark mode */
.bg-white.rounded-2xl .flex.text-yellow-400 svg,
.bg-gray-50.rounded-2xl .flex.text-yellow-400 svg,
.bg-white .flex.text-yellow-400 svg {
    color: #FFB070 !important;
    fill: #FFB070 !important;
}

/* Accent color - muted orange */
.text-accent-500, .accent {
    color: #FF8E48 !important;
}

/* Star icons - ensure orange in all contexts */
.star-rating, .rating-stars svg {
    color: #FFB070 !important;
    fill: #FFB070 !important;
}

/* Light blue message bar - dark orange theme */
.bg-blue-50 {
    background-color: #331a00 !important;
}

.bg-blue-50 p.text-blue-900, .bg-blue-50 .text-blue-900 {
    color: #FF8E48 !important;
}

.bg-blue-50.border-blue-100 {
    border-color: #FFA060 !important;
}

/* All blue backgrounds - change to warm dark tones */
.bg-blue-100, .bg-green-100, .bg-purple-100, .bg-yellow-100, .bg-orange-100,
.bg-red-100, .bg-indigo-100, .bg-teal-100 {
    background-color: #1f1610 !important;
}

/* Blue text on light backgrounds - headings in orange */
.text-blue-900 {
    color: #FF8E48 !important;
}

/* Border colors */
.border-blue-100, .border-green-100, .border-purple-100, .border-yellow-100 {
    border-color: #FFA060 !important;
}

/* Modal overlay - pure black */
.fixed.inset-0.z-50, .bg-black\/50 {
    background-color: rgba(0, 0, 0, 0.95) !important;
}

/* Modal content - black */
.bg-white.max-w-2xl.shadow-xl.rounded-2xl {
    background-color: #000000 !important;
}

/* Footer - pure black */
footer.bg-gray-50 {
    background-color: #000000 !important;
}

/* Ensure modal overlays everything */
.fixed.inset-0.z-\\[9999\\], .z-\\[10000\\], .z-\\[10001\\] {
    z-index: 2147483647 !important;
}

/* Vehicle description and content containers - pure black */
.bg-white\/95.backdrop-blur-xl, .bg-white\/80.backdrop-blur-sm {
    background-color: #000000 !important;
}

/* Ensure all text within background containers is readable */
.bg-white p, .bg-gray-50 p, [class*="bg-white"] p,
.bg-white div, .bg-gray-50 div, [class*="bg-white"] div {
    color: inherit !important;
}

/* Force override for text colors in dark mode - white */
.text-gray-600, p.text-gray-600, div.text-gray-600, span.text-gray-600 {
    color: #ffffff !important;
}

/* Card backgrounds - pure black */
.bg-white\/95 {
    background-color: #000000 !important;
}

/* Gradient overlays on images - black */
.bg-gradient-to-t {
    background-image: linear-gradient(to top, #000000 0%, rgba(0, 0, 0, 0.5) 50%, transparent 100%) !important;
}

/* Backdrop blur elements */
.backdrop-blur-xl, .backdrop-blur-sm {
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
}

/* Content wrappers with mixed backgrounds - black */
.bg-white\/95 {
    background: rgba(0, 0, 0, 0.95) !important;
}

/* Fix for inline text content - white */
.text-gray-600 {
    color: #ffffff !important;
}

/* Ensure descriptions are visible - white */
p.text-gray-600[style*="color"], p[style*="color"].text-gray-600 {
    color: #ffffff !important;
}

/* Override any inline styles for text color - headings in orange, body white */
h1, h2, h3, h4, h5, h6 {
    color: #FF8E48 !important;
}
p, div, span {
    color: #ffffff !important;
}

/* Finance modal - ensure it's on top */
#financeModal {
    position: fixed !important;
    z-index: 2147483647 !important;
}

#financeModal > div {
    position: relative !important;
    z-index: 2147483648 !important;
}

/* Override any stacking context issues */
div.relative.z-10, div[class*="z-"][class*="relative"] {
    z-index: auto !important;
}

/* Ensure modals appear above all content */
.modal-overlay, .fixed.inset-0[class*="Modal"] {
    z-index: 2147483647 !important;
    position: fixed !important;
}

/* Specific fix for finance modal visibility */
#financeModal {
    z-index: 999999 !important;
    position: fixed !important;
    transform: none !important;
}

#financeModal iframe {
    position: relative !important;
    z-index: 1000000 !important;
}

/* Any modal overlay */
[class*="Modal"], .modal-overlay {
    position: fixed !important;
    z-index: 2147483646 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
}

/* Modal content */
[class*="Modal"] > div, .modal-overlay > div {
    position: relative !important;
    z-index: 2147483647 !important;
}

/* Force disable stacking context creation */
.backdrop-blur-xl, .backdrop-blur-sm {
    transform: none !important;
    perspective: none !important;
    filter: none !important;
    -webkit-filter: blur(0px) !important;
    filter: blur(0px) !important;
}

/* Ensure modals are directly on body */
body > #financeModal {
    position: fixed !important;
    z-index: 2147483647 !important;
}

/* Override any stacking context from transforms */
div.transform, div[class*="backdrop"] {
    transform: none !important;
}

/* Status badges - ensure proper contrast */
.bg-green-100, .bg-green-500 {
    background-color: #FFA060 !important;
}

.text-green-800, .text-green-600 {
    color: #000000 !important;
}

/* Green icon backgrounds */
.bg-green-100 svg, .text-green-600 svg {
    color: #000000 !important;
}

/* Fix any inline white text on orange backgrounds */
[class*="bg-green-500"] [class*="text-white"],
.bg-green-500.text-white {
    color: #000000 !important;
}
