/* Force override specific Tailwind utilities if requested */
.mb-2 {
    margin-bottom: 0 !important;
}

/* Custom responsive padding override */
@media (min-width: 768px) {
    .md\:px-0 {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* Sidebar accordion styling */
.bg-slate-900\/30 {
    background-color: rgb(15 23 42 / 0.3);
    max-height: 300px;
}

/* Mobile responsive adjustments */
@media (max-width: 767px) {
    .min-w-0 {
        min-width: auto !important;
        width: 100% !important;
    }
}

/* Custom Scrollbar Hiding */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Custom Scrollbar Styling for Sidebar */
.custom-scrollbar::-webkit-scrollbar {
    width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: rgba(15, 23, 42, 0.5);
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(245, 158, 11, 0.3);
    border-radius: 2px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(245, 158, 11, 0.5);
}

/* Mask Linear Fade */
.mask-linear-fade {
    mask-image: linear-gradient(to right, transparent, black 20px, black calc(100% - 20px), transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 20px, black calc(100% - 20px), transparent);
}

/* Animations */
@keyframes slideUp {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}
.animate-slide-up {
    animation: slideUp 0.3s ease-out forwards;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
.animate-fade-in {
    animation: fadeIn 0.3s ease-out forwards;
}

/* Safe Area Padding */
.pb-safe {
    padding-bottom: env(safe-area-inset-bottom, 20px);
}

/* Hide Announcement Bar on Customizer Page */
.announcement-bar-swiper {
    display: none !important;
}

/* Tailwind CDN overrides/fixes if needed */
body {
    background-color: #ffffff; /* Changed to white for new design */
}

.to-amber-600 {
    --tw-gradient-to: #973c00 var(--tw-gradient-to-position);
}

.from-amber-500 {
    --tw-gradient-from: #973c00 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(245 158 11 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-amber-500.text-black {
    --tw-text-opacity: 1;
    color: rgb(255 255 255);
}

/* Hide Kato Float Container on Customizer Page */
#kato-float-container {
    display: none !important;
}

/* Accordion Styles */
.accordion-content {
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;
}

.accordion-header {
    position: relative;
}

.accordion-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.05), rgba(245, 158, 11, 0));
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    border-radius: 0.5rem;
}

.accordion-header:hover::before {
    opacity: 1;
}

/* Additional mobile fixes for sidebar accordion scrolling */
@media (max-width: 767px) {
    #cart-sidebar .sidebar-accordion-content div[style*="max-height"] {
        max-height: 400px !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }
}
