/* Global Styles */
body { 
    font-family: 'Plus Jakarta Sans', sans-serif; 
    background-color: #ffffff; 
    color: #1e293b; 
    overflow-x: hidden; 
    -webkit-tap-highlight-color: transparent; 
}

/* View Transitions */
.app-view { 
    display: none; 
    opacity: 0; 
    transition: opacity 0.3s ease-in-out; 
    padding-bottom: 80px; 
}
.app-view.active { 
    display: block; 
    opacity: 1; 
    animation: fadeInUp 0.5s ease-out forwards; 
}

/* Modern Glass Header */
.glass-header {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(226, 232, 240, 0.8);
}

/* Toast */
#toast-notification {
    position: fixed; 
    top: 100px; 
    right: 24px; 
    z-index: 200; 
    transform: translateX(150%); 
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
#toast-notification.show {
    transform: translateX(0);
}

/* Exit Toast */
#exit-toast.show {
    opacity: 1;
}

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

.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Remove Arrows from Number Input */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none; 
    margin: 0; 
}
input[type=number] {
    -moz-appearance: textfield;
}

/* Slider Styles */
.slider-wrapper {
    display: flex;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    align-items: stretch;
}
.slider-slide {
    min-width: 100%;
    flex-shrink: 0;
    padding: 0 0.5rem; 
    position: relative; 
}
.slider-dots .dot {
    transition: all 0.3s;
    background-color: rgba(255,255,255,0.5);
}
.slider-dots .dot.active {
    background-color: #fff; 
    border: 1px solid #0d9488;
    width: 24px;
}

/* Dynamic Category Icons (Used in JS for randomizing category card colors) */
.cat-bg-0 { background-color: #f0fdf4; border-color: #bbf7d0; color: #16a34a; }
.cat-bg-1 { background-color: #eff6ff; border-color: #bfdbfe; color: #2563eb; }
.cat-bg-2 { background-color: #fdf4ff; border-color: #fbcfe8; color: #db2777; }
.cat-bg-3 { background-color: #fffbeb; border-color: #fde68a; color: #d97706; }
.cat-bg-4 { background-color: #f5f3ff; border-color: #ddd6fe; color: #7c3aed; }
.cat-bg-5 { background-color: #fff1f2; border-color: #fecdd3; color: #e11d48; }
.cat-bg-6 { background-color: #f0fdfa; border-color: #a7f3d0; color: #059669; }
.cat-bg-7 { background-color: #f8fafc; border-color: #e2e8f0; color: #475569; }

/* Admin Table Container */
.table-container {
    max-height: 60vh;
    overflow-y: auto;
}