/* ==========================================================================
   Lunara Engine - Глобальные стили (assets/css/style.css)
   ========================================================================== */

/* --- АНИМАЦИИ --- */
@keyframes blob { 
    0% { transform: translate(0px, 0px) scale(1); } 
    33% { transform: translate(30px, -50px) scale(1.1); } 
    66% { transform: translate(-20px, 20px) scale(0.9); } 
    100% { transform: translate(0px, 0px) scale(1); } 
}
.animate-blob { animation: blob 7s infinite; } 
.animation-delay-2000 { animation-delay: 2s; }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in { animation: fadeIn 0.5s ease-out forwards; }

/* --- СТИЛИ ДЛЯ ЖИВОГО ПОИСКА --- */
#live-search-results { display: none; z-index: 100; }
#search-results-list::-webkit-scrollbar { width: 4px; }
#search-results-list::-webkit-scrollbar-thumb { background-color: #cbd5e1; border-radius: 4px; }

/* --- СКРОЛЛБАРЫ И СКРЫТИЕ ЭЛЕМЕНТОВ --- */
/* Кастомный скроллбар (универсальный для горизонтали и вертикали) */
.custom-scrollbar::-webkit-scrollbar { height: 6px; width: 4px; } 
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; border-radius: 8px; } 
.custom-scrollbar::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; } 
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* Полностью скрытый скроллбар (для галереи) */
.hide-scroll::-webkit-scrollbar { display: none; }
.hide-scroll { -ms-overflow-style: none; scrollbar-width: none; }

/* Убираем стрелочки у input type="number" */
.no-spinners::-webkit-inner-spin-button, 
.no-spinners::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.no-spinners { -moz-appearance: textfield; }

/* --- КАРТОЧКА ТОВАРА --- */
#main-product-image { transition: all 0.3s ease; }

/* --- ФОРМАТИРОВАНИЕ ОПИСАНИЯ ТОВАРА (TinyMCE / HTML редактор) --- */
.html-description h1 { font-size: 2.5em; font-weight: 900; color: #0f172a; margin: 2rem 0 1.5rem; }
.html-description h2 { font-size: 2em; font-weight: 800; color: #0f172a; margin: 1.8rem 0 1.2rem; }
.html-description h3 { font-size: 1.5em; font-weight: 700; color: #0f172a; margin: 1.5rem 0 1rem; }
.html-description p { margin-bottom: 1.5rem; line-height: 1.9; color: #475569; }
.html-description ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1.5rem; }
.html-description ol { list-style: decimal; padding-left: 1.5rem; margin-bottom: 1.5rem; }
.html-description strong, .html-description b { font-weight: 900; color: #1e293b; }
.html-description a { color: #6366f1; text-decoration: underline; font-weight: 800; }
.html-description iframe { width: 100%; aspect-ratio: 16/9; border-radius: 2.5rem; margin: 3rem 0; border: none; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); }
.html-description .ql-align-center { text-align: center; }
.html-description .ql-align-right { text-align: right; }
.html-description .ql-align-justify { text-align: justify; }