/**
 * FAQ Section Block - Frontend Styles
 */

/* Container Styles */
.aAEoJgIHXflY {
    padding: 40px 0;
    margin: 40px 0;
}

/* Глобальный box-sizing для всех элементов FAQ блока */
.aAEoJgIHXflY *,
.aAEoJgIHXflY *::before,
.aAEoJgIHXflY *::after {
    box-sizing: border-box;
}

.cYkm4eyVtY3 {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Heading Styles */
.sAlxx6t80 {
    font-size: 2.5rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.aIckAJ8mt {
    font-size: 1.125rem;
    text-align: center;
    margin-bottom: 3rem;
    opacity: 0.8;
}

/* Search Box */
.mcteyCyIG9 {
    position: relative;
    max-width: 500px;
    margin: 0 auto 2rem;
}

.o2rVjfwMkWJ {
    width: 100%;
    padding: 12px 48px 12px 20px;
    font-size: 1rem;
    border: 2px solid var(--color-border, #e2e8f0);
    border-radius: 50px;
    background: var(--color-bg-primary, #ffffff);
    transition: all 0.3s ease;
}

.o2rVjfwMkWJ:focus {
    outline: none;
    border-color: var(--color-primary, #2563eb);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.yCLQ9pzR3pNn {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-text-secondary, #666);
    pointer-events: none;
}

/* FAQ Items Container */
.nY8S2OmSFwj {
    margin-top: 2rem;
}

/* FAQ Item - Default with borders */
.tFpDsxVAa {
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.tFpDsxVAa:first-child {
    border-top: 1px solid var(--color-border, #e2e8f0);
}

/* None Style - Remove all borders */
.zbGGrxRM1nv .tFpDsxVAa {
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
    box-shadow: none !important;
}

.zbGGrxRM1nv .tFpDsxVAa:first-child {
    border-top: none !important;
}

.zbGGrxRM1nv .tFpDsxVAa:last-child {
    border-bottom: none !important;
}

.zbGGrxRM1nv .tFpDsxVAa:hover {
    border: none !important;
    box-shadow: none !important;
}

.zbGGrxRM1nv .clDFrvl7ta {
    border: none !important;
}

.zbGGrxRM1nv .eHghuhjvQ {
    border: none !important;
    border-top: none !important;
}

/* Bordered Style */
.bngzyphxqZRL .tFpDsxVAa {
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 8px;
    margin-bottom: 1rem;
    overflow: hidden;
}

.bngzyphxqZRL .tFpDsxVAa:first-child {
    border-top: 1px solid var(--color-border, #e2e8f0);
}

/* Card Style */
.yMYdLJ0Jx .tFpDsxVAa {
    background: var(--color-surface, #ffffff);
    border: none;
    border-radius: 12px;
    margin-bottom: 1rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.yMYdLJ0Jx .tFpDsxVAa:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Special text contrast for Card style - УБРАЛИ mix-blend-mode чтобы избежать артефактов анимации */
.yMYdLJ0Jx .q5XsqNCR {
    /* mix-blend-mode убран - создавал артефакты при анимации */
    /* Color managed by reversal rules */
    isolation: isolate;
}

/* Text shadow для лучшей читаемости на card фоне */
.yMYdLJ0Jx .q5XsqNCR p,
.yMYdLJ0Jx .q5XsqNCR li {
    /* Уменьшили text-shadow для избежания артефактов */
    text-shadow: 0 0 0.5px rgba(255, 255, 255, 0.3);
}

/* Question Button */
.clDFrvl7ta {
    width: 100%;
    padding: 20px;
    background: transparent;
    border: none;
    text-align: left;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--color-text-primary, #1a1a1a); /* Ensure text is readable */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

.clDFrvl7ta:hover {
    /* Background is now controlled via inline styles from admin settings */
    /* background: var(--color-bg-secondary, #f8f9fa); */
    opacity: 0.95; /* Subtle hover effect without changing background */
}

.tFpDsxVAa.gzziFwpUPi .clDFrvl7ta {
    /* Color is now controlled via inline styles from admin settings */
    /* color: var(--color-primary, #2563eb); */
}

/* Hover Effects */
.v0Bbzf67oKO .tFpDsxVAa:hover .clDFrvl7ta {
    /* Background is now controlled via inline styles from admin settings */
    /* background: var(--color-primary-light, rgba(37, 99, 235, 0.05)); */
    opacity: 0.9; /* Subtle hover effect without changing background */
}

.dUZRT7SL .tFpDsxVAa:hover {
    transform: translateX(5px);
}

/* Question Text */
.fQ9rwCsWF2 {
    flex: 1;
    text-align: left;
}

/* Number */
.sbN4RMGB9V {
    color: var(--color-primary, #2563eb);
    font-weight: 700;
    margin-right: 10px;
}

/* Icon */
.kLea3NeF4m {
    position: relative;  /* Для absolute позиционирования дочерних span */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    transition: transform 0.3s ease;
    color: var(--color-primary, #2563eb);
}

/* ============================================
   РЕВЕРС ЦВЕТА ДЛЯ ВСЕГО КОНТЕНТА FAQ
   ============================================ */

/* На светлом фоне: используем черный цвет */
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .kLea3NeF4m,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .sbN4RMGB9V,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .fQ9rwCsWF2,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .eHghuhjvQ .q5XsqNCR,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .tFpDsxVAa .q5XsqNCR,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .sAlxx6t80,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .q5XsqNCR p,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .q5XsqNCR li,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .q5XsqNCR ul,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .q5XsqNCR ol,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .q5XsqNCR span,
body .aAEoJgIHXflY.nIjPc6Plm.gWfjNgZx .q5XsqNCR div,
body .nIjPc6Plm.gWfjNgZx .q5XsqNCR *,
body .nIjPc6Plm.gWfjNgZx .q5XsqNCR,
body .nIjPc6Plm.gWfjNgZx .eHghuhjvQ {
    color: #000000 !important;
}

/* На темном фоне: используем белый цвет */
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .kLea3NeF4m,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .sbN4RMGB9V,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .fQ9rwCsWF2,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .eHghuhjvQ .q5XsqNCR,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .tFpDsxVAa .q5XsqNCR,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .sAlxx6t80,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .q5XsqNCR p,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .q5XsqNCR li,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .q5XsqNCR ul,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .q5XsqNCR ol,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .q5XsqNCR span,
body .aAEoJgIHXflY.nIjPc6Plm.vfJuFWE0L .q5XsqNCR div,
body .nIjPc6Plm.vfJuFWE0L .q5XsqNCR *,
body .nIjPc6Plm.vfJuFWE0L .q5XsqNCR,
body .nIjPc6Plm.vfJuFWE0L .eHghuhjvQ {
    color: #ffffff !important;
}

/* СПЕЦИАЛЬНОЕ ПРАВИЛО ТОЛЬКО ДЛЯ ANSWER-CONTENT В CARD СТИЛЕ:
   Card всегда имеет белый фон карточек, поэтому ТОЛЬКО текст ответа ВСЕГДА черный.
   Остальные элементы (иконки, нумерация, вопросы) используют обычный реверс.
   Максимальная специфичность для перекрытия правил темного фона! */
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR p,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR li,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR ul,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR ol,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR span,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR div,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR *,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .tFpDsxVAa .q5XsqNCR,
body .aAEoJgIHXflY.nIjPc6Plm.yMYdLJ0Jx .eHghuhjvQ,
body .nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR,
body .nIjPc6Plm.yMYdLJ0Jx .q5XsqNCR *,
body .nIjPc6Plm.yMYdLJ0Jx .eHghuhjvQ {
    color: #000000 !important;
}

/* Для иконок с фоном (circle/square) - всегда используем primary цвет */
body .nIjPc6Plm.gWfjNgZx .dnxI3xhkdAmr .kLea3NeF4m,
body .nIjPc6Plm.gWfjNgZx .iNwSMrQWi6 .kLea3NeF4m,
body .nIjPc6Plm.vfJuFWE0L .dnxI3xhkdAmr .kLea3NeF4m,
body .nIjPc6Plm.vfJuFWE0L .iNwSMrQWi6 .kLea3NeF4m {
    color: var(--color-primary, #2563eb) !important;  /* Primary цвет на собственном фоне */
}

.kLea3NeF4m svg {
    width: 20px;
    height: 20px;
    display: block;
    flex-shrink: 0;
}

/* Icon state wrappers - absolute positioning для точного наложения */
.gg52I9qnQ7,
.wbwPC6Cgei {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

/* По умолчанию показываем только closed иконку */
.wbwPC6Cgei {
    display: none;
}

/* При раскрытии FAQ: скрываем closed, показываем open */
.tFpDsxVAa.gzziFwpUPi .gg52I9qnQ7 {
    display: none;
}

.tFpDsxVAa.gzziFwpUPi .wbwPC6Cgei {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

/* Icon Styles */
.dnxI3xhkdAmr .kLea3NeF4m {
    background: var(--color-primary-light, rgba(37, 99, 235, 0.1));
    border-radius: 50%;
    padding: 4px;
}

.iNwSMrQWi6 .kLea3NeF4m {
    background: var(--color-primary-light, rgba(37, 99, 235, 0.1));
    border-radius: 4px;
    padding: 4px;
}

/* Rotate animation for chevron/arrow */
.yRa6hCsg .tFpDsxVAa.gzziFwpUPi .kLea3NeF4m,
.wV4L1V6EORJH .tFpDsxVAa.gzziFwpUPi .kLea3NeF4m {
    transform: rotate(180deg);
}

/* Answer - базовые стили БЕЗ transition (анимация применяется через классы) */
.eHghuhjvQ {
    overflow: hidden;
    border-top: 1px solid var(--color-border-light, #f1f5f9);
    /* Убрали margin-top который создавал ступеньку */
    box-sizing: border-box; /* Гарантируем правильный box model */
}

.q5XsqNCR {
    padding: 15px 20px 20px;
    line-height: 1.6;
    /* Color managed by reversal rules below based on background */
}

.q5XsqNCR p {
    margin-bottom: 1rem;
    font-size: 0.95rem;
}

.q5XsqNCR p:last-child {
    margin-bottom: 0;
}

.q5XsqNCR ul,
.q5XsqNCR ol {
    margin: 0.75rem 0;
    padding-left: 1.5rem;
}

.q5XsqNCR li {
    margin-bottom: 0.5rem;
    font-size: 0.95rem;
}

.q5XsqNCR li:last-child {
    margin-bottom: 0;
}

/* Spacing Variants */
.d25tPhVjnvP .clDFrvl7ta {
    padding: 15px 20px;
}

.d25tPhVjnvP .q5XsqNCR {
    padding: 12px 20px 15px;
}

.vSgMdJGaX7c .clDFrvl7ta {
    padding: 25px;
}

.vSgMdJGaX7c .q5XsqNCR {
    padding: 20px 25px 25px;
}

/* Background Styles - REMOVED FROM SETTINGS */
/* These styles are kept for reference but not used anymore since FAQ Style and Background Style settings were removed
.oBHwNLa17InJ {
    background: var(--color-bg-secondary, #f8f9fa);
    padding: 60px 0;
    border-radius: 12px;
}

.p8Eo7dmb8f {
    background: linear-gradient(135deg,
        var(--color-primary-light, rgba(37, 99, 235, 0.05)) 0%,
        var(--color-bg-primary, #ffffff) 100%);
    padding: 60px 0;
}

.hk3XgOllW {
    background-image:
        radial-gradient(circle at 20% 80%, var(--color-primary-light, rgba(37, 99, 235, 0.05)) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, var(--color-secondary-light, rgba(100, 116, 139, 0.05)) 0%, transparent 50%);
    padding: 60px 0;
}
*/

/* Style Variations - REMOVED FROM SETTINGS */
/* These styles are kept for reference but not used anymore since FAQ Style setting was removed
.ytQgCIX1o .tFpDsxVAa {
    border: none;
}

.ytQgCIX1o .clDFrvl7ta {
    padding: 15px 0;
}

.ytQgCIX1o .q5XsqNCR {
    padding: 0 0 15px 0;
}

.gyLfzAJAZ8V8 .nY8S2OmSFwj {
    background: var(--color-surface, #ffffff);
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
*/

/* Responsive */
@media (max-width: 768px) {
    .sAlxx6t80 {
        font-size: 2rem;
    }

    .aIckAJ8mt {
        font-size: 1rem;
    }

    .clDFrvl7ta {
        font-size: 1rem;
        padding: 15px;
    }

    .q5XsqNCR {
        padding: 12px 15px 15px;
    }

    .cYkm4eyVtY3 {
        padding: 0 15px;
    }
}

/* ============================================
   ANIMATION CLASSES
   ============================================ */

/* Slide Animation - плавное раскрытие по height (управляется JS) */
.nRJIsmzmSX95 .eHghuhjvQ {
    transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: height;
}

/* Fade Animation - появление/исчезновение с прозрачностью */
.e0WugEPA .eHghuhjvQ {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.e0WugEPA .tFpDsxVAa.gzziFwpUPi .eHghuhjvQ {
    opacity: 1;
}

/* None Animation - нет анимации вообще */
.oHkGf52TbDz .eHghuhjvQ {
    transition: none !important;
}

/* No items message */
.y4hlFBK6NV {
    text-align: center;
    padding: 40px 20px;
    color: var(--color-text-secondary, #666);
    font-style: italic;
}

/* Additional icon types - УДАЛЕНО, используем SVG иконки из render.php */

/* Additional spacing options */
.umRkyENiNf .tFpDsxVAa {
    margin-bottom: 15px;
}

.umRkyENiNf .clDFrvl7ta {
    padding: 18px 20px;
}

.umRkyENiNf .q5XsqNCR {
    padding: 18px 20px;
}

/* Icon position - right */
.ykbEbQIKyjnM .clDFrvl7ta {
    flex-direction: row;
}

.ykbEbQIKyjnM .kLea3NeF4m {
    margin-left: auto;
    order: 2;
}

/* Icon position - left */
.yLmeLBIiX .clDFrvl7ta {
    flex-direction: row;
}

.yLmeLBIiX .kLea3NeF4m {
    margin-right: 15px;
    order: -1;
}