/**
 * Cookie Banner 152-FZ Styles v2 — 6 стилей позиционирования, кастомные размеры
 */

/* 1. БАЗОВЫЕ СТИЛИ КОНТЕЙНЕРА */
.cb152fz-wrapper {
    position: fixed;
    z-index: 999999;
    padding: 24px;
    border-radius: 20px;
    box-shadow: var(--cb152fz-shadow, 0 8px 32px rgba(0,0,0,0.18));
    font-family: var(--cb152fz-font-family, inherit);
    box-sizing: border-box;
    transition: opacity 0.3s ease, transform 0.3s ease;
    text-align: var(--cb152fz-align, left);
    width: var(--cb152fz-width, auto);
    height: var(--cb152fz-height, auto);
}

/* 2. ПОЗИЦИИ */

/* 2a. Нижняя панель — фиксированная полоска снизу (широкая) */
.cb152fz-pos-bottom {
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: var(--cb152fz-width, 90%);
    max-width: var(--cb152fz-width, 680px);
    border-radius: 20px;
}

/* 2b. Верхний баннер — полоска сверху */
.cb152fz-pos-top {
    top: 0;
    left: 0;
    right: 0;
    bottom: auto;
    width: 100%;
    max-width: 100%;
    border-radius: 0 0 16px 16px;
    box-shadow: var(--cb152fz-shadow, 0 8px 32px rgba(0,0,0,0.18));
    /* При заданной ширине — центрируем */
    width: var(--cb152fz-width, 100%);
}

/* 2c. Боковая панель — слева */
.cb152fz-pos-left {
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    width: var(--cb152fz-width, 90%);
    max-width: var(--cb152fz-width, 350px);
    border-radius: 20px;
    box-shadow: var(--cb152fz-shadow, 0 8px 32px rgba(0,0,0,0.18));
}

/* 2d. Боковая панель — справа */
.cb152fz-pos-right {
    top: 50%;
    right: 20px;
    left: auto;
    transform: translateY(-50%);
    width: var(--cb152fz-width, 90%);
    max-width: var(--cb152fz-width, 350px);
    border-radius: 20px;
    box-shadow: var(--cb152fz-shadow, 0 8px 32px rgba(0,0,0,0.18));
}

/* 2e. Inline-блок в правом нижнем углу (компактный) */
.cb152fz-pos-bottom-right {
    bottom: 24px;
    right: 24px;
    left: auto;
    width: var(--cb152fz-width, 320px);
    max-width: var(--cb152fz-width, 360px);
    border-radius: 20px;
    box-shadow: var(--cb152fz-shadow, 0 8px 32px rgba(0,0,0,0.18));
}

/* 2f. Footer-уведомление — прибита к самому низу, без отступов */
.cb152fz-pos-footer {
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 100%;
    border-radius: 0;
    padding: 16px 24px;
    box-shadow: var(--cb152fz-shadow, 0 8px 32px rgba(0,0,0,0.18));
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

/* Footer: горизонтальный layout */
.cb152fz-pos-footer .cb152fz-content {
    flex: 1 1 auto;
}

.cb152fz-pos-footer .cb152fz-text {
    margin-bottom: 0;
}

.cb152fz-pos-footer .cb152fz-title {
    margin-bottom: 6px;
}

.cb152fz-pos-footer .cb152fz-actions {
    flex: 0 0 auto;
    flex-direction: row;
}

.cb152fz-pos-footer #cb152fz-btn-accept,
.cb152fz-pos-footer #cb152fz-btn-save {
    width: var(--cb152fz-btn-accept-w, auto);
    flex: 0 0 auto;
}

.cb152fz-pos-footer .cb152fz-categories {
    width: 100%;
    flex-basis: 100%;
    margin-top: 10px;
}

/* 3. ТЕКСТ И ЭЛЕМЕНТЫ */
.cb152fz-title {
    display: block !important;
    font-size: var(--cb152fz-font-size-title, 20px);
    font-weight: var(--cb152fz-font-weight-title, 700);
    margin-bottom: 12px;
    line-height: 1.2;
}

.cb152fz-text {
    font-size: var(--cb152fz-font-size-text, 14px);
    font-weight: var(--cb152fz-font-weight-text, 400);
    line-height: 1.5;
    margin-bottom: 20px;
}

/* Если задана высота, текст может прокручиваться */
.cb152fz-wrapper[style*="--cb152fz-height"] .cb152fz-content {
    overflow-y: auto;
    max-height: calc(var(--cb152fz-height, 9999px) - 120px);
}

.cb152fz-categories {
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cb152fz-categories label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 14px;
}

.cb152fz-categories input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--cb152fz-primary, #005bff);
    cursor: pointer;
}

/* 4. КНОПКИ */
.cb152fz-actions {
    display: flex;
    gap: 10px;
    flex-direction: row;
    justify-content: center;
}

.cb152fz-btn {
    border: none;
    padding: 14px 24px;
    font-size: var(--cb152fz-font-size-btn, 16px);
    font-weight: var(--cb152fz-font-weight-btn, 700);
    border-radius: 12px;
    cursor: pointer;
    text-align: center;
    transition: background 0.2s, transform 0.1s;
    white-space: nowrap;
    flex: 1 1 auto; /* по умолчанию растягиваются равномерно */
}

.cb152fz-btn:active {
    transform: scale(0.98);
}

.cb152fz-btn-primary {
    background-color: var(--cb152fz-primary, #005bff) !important;
    color: #ffffff !important;
}

/* Ширина кнопок — если задана в админке, flex сбрасывается */
#cb152fz-btn-accept {
    width: var(--cb152fz-btn-accept-w, auto);
    flex: var(--cb152fz-btn-accept-flex, 1 1 auto);
}

#cb152fz-btn-save {
    width: var(--cb152fz-btn-save-w, auto);
    flex: var(--cb152fz-btn-save-flex, 1 1 auto);
}

/* 5. ССЫЛКИ */
.cb152fz-text-link, 
.cb152fz-details-link {
    text-decoration: var(--cb152fz-link-decoration, underline) !important;
    text-underline-offset: 3px;
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
    cursor: pointer;
}

/* 6. ТЕМЫ */
.cb152fz-theme-dark {
    background-color: var(--cb152fz-bg, #1a1a1a) !important;
    color: var(--cb152fz-text, #ffffff) !important;
}

.cb152fz-theme-dark .cb152fz-text-link,
.cb152fz-theme-dark .cb152fz-details-link,
.cb152fz-theme-dark .cb152fz-categories label {
    color: var(--cb152fz-text, #ffffff) !important;
}

.cb152fz-theme-dark .cb152fz-text-link,
.cb152fz-theme-dark .cb152fz-details-link {
    color: var(--cb152fz-link, var(--cb152fz-text, #ffffff)) !important;
}

.cb152fz-theme-light {
    background-color: var(--cb152fz-bg, #ffffff) !important;
    color: var(--cb152fz-text, #1a1a1a) !important;
}

.cb152fz-theme-light .cb152fz-categories label {
    color: var(--cb152fz-text, #1a1a1a) !important;
}

/* Ссылки в cookie-баннере (светлая тема) */
.cb152fz-theme-light .cb152fz-text-link,
.cb152fz-theme-light .cb152fz-details-link {
    color: var(--cb152fz-link, #737373) !important;
}

.cb152fz-theme-light .cb152fz-text-link:hover,
.cb152fz-theme-light .cb152fz-details-link:hover {
    color: var(--cb152fz-text, #1a1a1a) !important;
}

.cb152fz-text-link:active,
.cb152fz-details-link:active {
    opacity: 0.6 !important;
}

.cb152fz-open-settings {
    color: var(--cb152fz-link, #737373) !important;
    text-decoration: underline;
}

.cb152fz-open-settings:hover {
    color: var(--cb152fz-text, #1a1a1a) !important;
}

/* 7. СКРЫТИЕ РЕКЛАМЫ до согласия */

/* 8. МОБИЛЬНАЯ АДАПТИВНОСТЬ */
@media (max-width: 600px) {
    /* Все позиции на мобильном — нижняя полоска */
    .cb152fz-wrapper {
        width: 95% !important;
        max-width: none !important;
        left: 50% !important;
        right: auto !important;
        top: auto !important;
        transform: translateX(-50%) !important;
        bottom: 12px !important;
        padding: 18px 16px;
        border-radius: 16px;
    }

    /* Footer на мобильном — не центрируем трансформой, прибиваем нормально */
    .cb152fz-pos-footer {
        left: 0 !important;
        right: 0 !important;
        transform: none !important;
        width: 100% !important;
        border-radius: 0 !important;
        bottom: 0 !important;
    }

    /* Top на мобильном — оставляем наверху */
    .cb152fz-pos-top {
        top: 0 !important;
        bottom: auto !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        transform: none !important;
        border-radius: 0 0 12px 12px !important;
    }

    .cb152fz-title { font-size: var(--cb152fz-font-size-title, 17px); }
    .cb152fz-btn   { font-size: var(--cb152fz-font-size-btn, 15px); padding: 12px; }

    .cb152fz-pos-footer .cb152fz-actions {
        flex-direction: column;
        width: 100%;
    }
}