/* Cookie/PD баннер fzpd (тема minimal) — стилизован под тему сайта nova (nova2, тёмная). Отличие от default только в геометрии баннера: компактная карточка 300px в левом нижнем углу с кнопками в столбик. Токены берём из body.stn2 (var(--stn2-*)), от которого баннер наследуется как потомок ; для каждого var указан тёмный фолбэк, чтобы баннер оставался читаемым без темы. */ .fzpd-app-cookie-consent { position: fixed; bottom: 15px; left: 15px; width: 300px; background: var(--stn2-card-solid, #1b1f2e); color: var(--stn2-text, #f1f2f7); border: 1px solid var(--stn2-border-2, rgba(255, 255, 255, 0.12)); padding: 18px; box-shadow: 0 24px 60px -22px rgba(0, 0, 0, 0.75); display: flex; flex-direction: column; justify-content: space-between; align-items: stretch; row-gap: 16px; z-index: 2147483547; border-radius: var(--stn2-radius-md, 14px); font-size: 14px; line-height: 1.5; } .fzpd-app-cookie-consent-text { color: var(--stn2-text2, #c2c6d2); } .fzpd-app-cookie-consent-buttons { display: flex; flex-wrap: wrap; gap: 10px; justify-content: stretch; } /* Базовая кнопка — «призрачная» (вторичная). */ .fzpd-app-cookie-consent-buttons button { background: var(--stn2-card-alt-a, rgba(255, 255, 255, 0.06)); color: var(--stn2-text, #f1f2f7); border: 1px solid var(--stn2-border-2, rgba(255, 255, 255, 0.14)); padding: 11px 20px; text-align: center; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; border-radius: var(--stn2-radius-sm, 10px); font-size: 14px; font-weight: 600; transition: transform 0.12s, filter 0.12s, background 0.2s, border-color 0.2s; flex: 1 1 auto; } .fzpd-app-cookie-consent-buttons button:hover { filter: brightness(1.08); border-color: var(--stn2-border-2, rgba(255, 255, 255, 0.24)); } /* «Принять все» — основная кнопка, фирменный градиент сайта, на всю ширину. */ .fzpd-app-cookie-consent-buttons button[data-state="1"] { flex: 1 1 100%; background: var(--stn2-gradient, linear-gradient(120deg, #7C5CFC, #2DD4BF)); border: none; color: #fff; box-shadow: 0 12px 28px -14px var(--stn2-accent1, #7C5CFC); } .fzpd-app-cookie-consent-buttons button[data-state="1"]:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 16px 34px -12px var(--stn2-accent1, #7C5CFC); } .fzpd-app-cookie-consent-buttons button.outlined { background: transparent; border: 1px solid var(--stn2-border-2, rgba(255, 255, 255, 0.22)); color: var(--stn2-text, #f1f2f7); } .fzpd-app-cookie-consent-buttons button.outlined:hover { background: var(--stn2-card-alt-a, rgba(255, 255, 255, 0.06)); } /* --- Настройки сегментов (переключатели) --- */ .fzpd-switch-container { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; padding: 12px 14px; background: var(--stn2-card-alt-b, rgba(255, 255, 255, 0.04)); border: 1px solid var(--stn2-border, rgba(255, 255, 255, 0.08)); border-radius: var(--stn2-radius-sm, 10px); } .fzpd-switch-info { display: flex; align-items: center; } .fzpd-switch { position: relative; display: inline-block; width: 40px; height: 22px; margin-right: 15px; flex: none; } .fzpd-switch input { opacity: 0; width: 0; height: 0; } .fzpd-switch-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--stn2-faint, #6b7280); transition: 0.3s; border-radius: 34px; } .fzpd-switch-slider:before { position: absolute; content: ""; height: 18px; width: 18px; left: 2px; bottom: 2px; background-color: #fff; transition: 0.3s; border-radius: 50%; } .fzpd-app-cookie-settings-form input:checked + .fzpd-switch-slider { background: var(--stn2-gradient, linear-gradient(120deg, #7C5CFC, #2DD4BF)); } .fzpd-app-cookie-settings-form input:checked + .fzpd-switch-slider:before { transform: translateX(18px); } .fzpd-switch-label { font-weight: 600; color: var(--stn2-text, #f1f2f7); } .fzpd-switch input:disabled + .fzpd-switch-slider { opacity: 0.55; cursor: not-allowed; } .fzpd-switch input:checked:disabled + .fzpd-switch-slider { opacity: 0.6; } .fzpd-toggle-description-btn { background: var(--stn2-card-alt-a, rgba(255, 255, 255, 0.08)); color: var(--stn2-text, #f1f2f7); border: 1px solid var(--stn2-border, rgba(255, 255, 255, 0.08)); border-radius: 50%; width: 30px; height: 30px; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: filter 0.2s, background 0.2s; flex: none; } .fzpd-toggle-description-btn:hover { filter: brightness(1.2); } .fzpd-description { display: none; padding: 14px; background: var(--stn2-card-alt-b, rgba(255, 255, 255, 0.04)); border: 1px solid var(--stn2-border, rgba(255, 255, 255, 0.08)); border-radius: var(--stn2-radius-sm, 10px); color: var(--stn2-text2, #c2c6d2); margin-top: 10px; margin-bottom: 12px; animation: fadeIn 0.3s; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fzpd-submit-btn { display: block; width: 100%; padding: 13px; background: var(--stn2-gradient, linear-gradient(120deg, #7C5CFC, #2DD4BF)); color: #fff; border: none; border-radius: var(--stn2-radius-md, 12px); font-size: 15px; font-weight: 600; cursor: pointer; transition: transform 0.12s, filter 0.12s; margin-top: 18px; box-shadow: 0 12px 28px -14px var(--stn2-accent1, #7C5CFC); } .fzpd-submit-btn:hover { transform: translateY(-1px); filter: brightness(1.06); } /* --- Модальное окно (политика / настройка cookie) --- */ .fzpd-app-popup-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.72); backdrop-filter: blur(3px); display: flex; justify-content: center; align-items: center; z-index: 2147483647; opacity: 0; visibility: hidden; transition: all 0.3s ease; } .fzpd-app-popup-overlay.active { opacity: 1; visibility: visible; } .fzpd-app-popup-container { background: var(--stn2-card-solid, #1b1f2e); color: var(--stn2-text, #f1f2f7); border: 1px solid var(--stn2-border-2, rgba(255, 255, 255, 0.12)); border-radius: var(--stn2-radius-lg, 20px); width: 90%; max-width: 700px; max-height: 80%; overflow: hidden; box-shadow: 0 30px 80px -24px rgba(0, 0, 0, 0.8); transform: translateY(20px); transition: transform 0.3s ease; display: flex; flex-direction: column; } .fzpd-app-popup-overlay.active .fzpd-app-popup-container { transform: translateY(0); } .fzpd-app-popup-header { position: sticky; top: 0; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--stn2-border, rgba(255, 255, 255, 0.08)); padding: 16px 20px; } .fzpd-app-popup-close { width: 24px; height: 24px; cursor: pointer; opacity: 0.6; transition: opacity 0.3s; position: relative; padding: 0; } .fzpd-app-popup-close:hover { opacity: 1; } .fzpd-app-popup-close::before, .fzpd-app-popup-close::after { content: ''; position: absolute; top: 50%; left: 50%; width: 100%; height: 2px; background-color: var(--stn2-text, #f1f2f7); } .fzpd-app-popup-close::before { transform: translate(-50%, -50%) rotate(45deg); } .fzpd-app-popup-close::after { transform: translate(-50%, -50%) rotate(-45deg); } .fzpd-app-popup-title { color: var(--stn2-text, #f1f2f7); font-weight: 700; margin: 0; } .fzpd-app-popup-content { overflow: auto; line-height: 1.6; color: var(--stn2-text2, #c2c6d2); padding: 20px 26px 26px; } /* Ссылки — акцент сайта (бирюзовый). */ .fzpd-link { color: var(--stn2-accent2, #2DD4BF) !important; font-weight: 600; text-decoration: none; cursor: pointer; } .fzpd-link:hover { text-decoration: underline; filter: brightness(1.1); }