* { font-family: 'Inter', sans-serif; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.break-inside-avoid { break-inside: avoid; }
.snap-x { scroll-snap-type: x mandatory; }
.snap-start { scroll-snap-align: start; }
.gradient-bg { background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%); }
.dark .gradient-bg { background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); }

/* Card Hover Effects */
.prompt-card { 
    border-radius: 20px; 
    overflow: hidden; 
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
    background: white; 
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); 
    cursor: pointer;
}
.dark .prompt-card { background: #1e293b; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3); }
.prompt-card:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); }

.gold-badge { background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%); color: #7c310b; font-weight: 800; letter-spacing: 0.05em; }

/* Masonry Grid */
.columns-container { column-count: 1; column-gap: 1.5rem; }
@media (min-width: 640px) { .columns-container { column-count: 2; } }
@media (min-width: 1024px) { .columns-container { column-count: 3; } }
@media (min-width: 1280px) { .columns-container { column-count: 4; } }
.column-item { break-inside: avoid; margin-bottom: 1.5rem; }

.category-card { transition: all 0.3s ease; cursor: pointer; }
.category-card:hover { transform: translateY(-5px) scale(1.02); }

/* Slider Fixes */
.draggable-slider { cursor: grab; user-select: none; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.draggable-slider.active { cursor: grabbing; cursor: -webkit-grabbing; }
.draggable-slider .snap-start { pointer-events: none; } 
.draggable-slider.active .snap-start { pointer-events: none; }

/* Professional Ad Styles */
.responsive-ad { 
    background: linear-gradient(145deg, #ffffff, #f8fafc);
    border: 1px solid #e2e8f0; 
    display: flex; 
    flex-direction: column;
    position: relative;
    break-inside: avoid;
    margin-bottom: 1.5rem;
    border-radius: 20px;
    overflow: hidden;
    transition: transform 0.3s ease;
}
.responsive-ad:hover { transform: translateY(-2px); }
.dark .responsive-ad { background: linear-gradient(145deg, #1e293b, #0f172a); border-color: #334155; }

.ad-badge { 
    position: absolute; 
    top: 12px; 
    right: 12px; 
    background: rgba(0,0,0,0.05); 
    backdrop-filter: blur(4px);
    color: #64748b; 
    padding: 2px 8px; 
    font-size: 10px; 
    font-weight: 700; 
    border-radius: 6px; 
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 1px solid rgba(0,0,0,0.05);
}
.dark .ad-badge { background: rgba(255,255,255,0.1); color: #94a3b8; border-color: rgba(255,255,255,0.05); }

/* Admin Panel Styles */
.admin-sidebar { transition: transform 0.3s ease-in-out; }
.admin-nav-item.active { background: #f3f4f6; border-right: 4px solid #f59e0b; }
.dark .admin-nav-item.active { background: #1f2937; border-right: 4px solid #fbbf24; }

/* Toggle Switch */
.toggle-checkbox:checked { right: 0; border-color: #fbbf24; }
.toggle-checkbox:checked + .toggle-label { background-color: #fbbf24; }

/* Custom Checkbox for Batch Select */
.custom-checkbox {
    appearance: none;
    background-color: #fff;
    margin: 0;
    font: inherit;
    color: currentColor;
    width: 1.15em;
    height: 1.15em;
    border: 2px solid #cbd5e1;
    border-radius: 0.15em;
    display: grid;
    place-content: center;
    cursor: pointer;
}
.dark .custom-checkbox { background-color: #1f2937; border-color: #4b5563; }
.custom-checkbox::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    box-shadow: inset 1em 1em white;
    background-color: CanvasText;
    transform-origin: center;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}
.custom-checkbox:checked { background-color: #f59e0b; border-color: #f59e0b; }
.custom-checkbox:checked::before { transform: scale(1); }

@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes fadeInUp {
    0% { opacity: 0; transform: translateY(10px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes slideIn {
    0% { opacity: 0; transform: translateX(-50%) translateY(20px); }
    100% { opacity: 1; transform: translateX(-50%) translateY(0); }
}

.animate-fade-in { animation: fadeIn 0.5s ease-in-out; }
.animate-fade-in-up { animation: fadeInUp 0.5s ease-out; }
.animate-slide-in { animation: slideIn 0.3s ease-out; }

/* Prompt Box Scroll Fix */
#detail-prompt {
    max-height: 300px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-right: 8px;
}
