/********************************************************************************************
 *                                                                                           *
 *   ██████╗░██╗░░░██╗░██████╗░█████╗░██████╗░███████╗░█████╗░████████╗██╗██╗░░░██╗███████╗  *
 *   ██╔══██╗██║░░░██║██╔════╝██╔══██╗██╔══██╗██╔════╝██╔══██╗╚══██╔══╝██║██║░░░██║██╔════╝  *
 *   ██████╔╝██║░░░██║╚█████╗░██║░░╚═╝██████╔╝█████╗░░███████║░░░██║░░░██║╚██╗░██╔╝█████╗░░  *
 *   ██╔══██╗██║░░░██║░╚═══██╗██║░░██╗██╔══██╗██╔══╝░░██╔══██║░░░██║░░░██║░╚████╔╝░██╔══╝░░  *
 *   ██║░░██║╚██████╔╝██████╔╝╚█████╔╝██║░░██║███████╗██║░░██║░░░██║░░░██║░░╚██╔╝░░███████╗  *
 *   ╚═╝░░╚═╝░╚═════╝░╚═════╝░░╚════╝░╚═╝░░╚═╝╚══════╝╚═╝░░╚═╝░░░╚═╝░░░╚═╝░░░╚═╝░░░╚══════╝  *
 *                                                                              © 2013-2026  *
 * ----------------------------------------------------------------------------------------- *
 * This is commercial software, only users who have purchased a valid license and accept     *
 * to the terms of the License Agreement can install and use this program.                   *
 * ----------------------------------------------------------------------------------------- *
 * www: https://ruscreative.com                                                              *
 * email: info@ruscreative.com                                                               *
 * @license       Commercial                                                                 *
 * @copyright (C) 2013-2026 RusCreative.com | All rights reserved.                           *
 ********************************************************************************************/
/**
 * mod_rcmforms preset: "bliss" — тема контактной формы под шаблон blissoflondonb3
 * сайта bliss-of-london.ru (сёдла Bliss of London).
 *
 * Эталон — сам сайт (templates/blissoflondonb3/css/style.css):
 *   ТЁМНАЯ тема (body{background:#000}), яркий бирюзовый акцент #1BBBB3
 *   (кнопки .button-green с radius 6px), светлый текст #fff/#ccc, ссылки #1BBBB3.
 *   Форма стоит прямо на чёрном фоне — значит подписи/заголовок должны быть
 *   светлыми, иначе сливаются с фоном; поля ввода остаются белыми.
 *
 * Scope: .rcmforms--preset-bliss (класс добавляется к <form> диспетчером).
 */

.rcmforms--preset-bliss {
    --rcmf-accent: #1bbbb3;            /* фирменная бирюза сайта */
    --rcmf-accent-text: #ffffff;
    --rcmf-radius: 6px;               /* как .button-green */
    --rcmf-control-bg: #ffffff;        /* поля белые поверх чёрного фона */
    --rcmf-control-border: #1bbbb3;
    --rcmf-control-text: #333333;      /* тёмный текст внутри белых полей */
    --rcmf-label-text: #cccccc;        /* светлые подписи на чёрном фоне */
    --rcmf-muted: #aaaaaa;
    --rcmf-error: #ff6b6b;             /* читаемый на тёмном фоне */
    --rcmf-success: #5cd6a0;
    --rcmf-gap: 1rem;
    --rcmf-control-padding: 0.6rem 0.85rem;
    --rcmf-font-size: 14px;

    /* Текст контейнера (не-поля) — светлый, чтобы не слиться с чёрным фоном. */
    color: #cccccc;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

    /* На странице шаблона hero-слайдер (ul.slider, position:absolute, ~915px)
     * вылезает из своего контейнера (slider-constraint 610px) вниз и по правилам
     * стекинга красится ПОВЕРХ непозиционированной (static) формы — поля
     * становятся некликабельными. Делаем форму позиционированной (relative,
     * без z-index): она попадает в слой позиционированных элементов и, будучи
     * ПОЗЖЕ слайдера в DOM, рисуется над ним. Это устраняет перекрытие штатно,
     * без absolute-хаков и z-index-войн. */
    position: relative;
}

/* Заголовок формы — светлый, в тон заголовкам сайта (#ccc). */
.rcmforms--preset-bliss .rcmforms__title {
    color: #ffffff;
    font-weight: 600;
}

/* Ссылки в согласии — фирменная бирюза, как ссылки сайта. */
.rcmforms--preset-bliss .rcmforms__consent a {
    color: #1bbbb3;
}

.rcmforms--preset-bliss .rcmforms__control {
    border-color: #ccc;
}

.rcmforms--preset-bliss .rcmforms__control:focus {
    outline: 0;
    border-color: #1bbbb3;
    box-shadow: 0 0 0 0.2rem rgba(27, 187, 179, 0.3);
}

.rcmforms--preset-bliss .rcmforms__submit:hover {
    filter: none;
    background: #17a39c;          /* чуть темнее бирюзы на hover */
}

/* ── Блок согласия — НЕЙТРАЛЬНАЯ разметка (markup_style=neutral) ─────────────
 * Форма bliss переведена на neutral (.rcmforms__consent / __consent-input /
 * __consent-text). Глобальные правила legacy-темы (`input{width:280px}`,
 * `label{...}`) ломают блок: без явных правил label-флекс схлопывается в узкую
 * колонку и текст налезает на кнопку. Здесь форсируем полную ширину и перенос.
 */
.rcmforms--preset-bliss .rcmforms__consent {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.6rem;
    width: 100%;
    margin: 0.25rem 0 0.75rem;
    color: #e0e0e0;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.45;
}

.rcmforms--preset-bliss .rcmforms__consent-input {
    flex: 0 0 auto;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    min-width: 20px;
    padding: 0;
    margin: 1px 0 0;
}

.rcmforms--preset-bliss .rcmforms__consent-text {
    flex: 1 1 0;
    min-width: 0;            /* разрешает перенос и использование всей ширины */
}

.rcmforms--preset-bliss .rcmforms__consent a {
    color: var(--rcmf-accent);
    text-decoration: underline;
}

/* ── Легаси BS5-разметка (.form-check) — оставлено для обратной совместимости,
 *    если форму вернут на markup_style=bootstrap. На neutral не применяется.
 */
.rcmforms--preset-bliss .form-check {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.6rem;
    margin: 0;
    padding: 0;
    font-size: 14px;                  /* как текст полей формы */
}

/* Кастомный чекбокс (appearance:none) — на чёрном фоне нативный почти не виден.
   Белый бокс с бирюзовой рамкой, при выборе — заливка бирюзой + белая галочка. */
.rcmforms--preset-bliss .form-check-input {
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    padding: 0;                       /* перебить возможный глобальный form input{padding} */
    margin: 1px 0 0;                  /* совместить с первой строкой текста */
    border: 2px solid var(--rcmf-accent);
    border-radius: 4px;
    background: #ffffff;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.rcmforms--preset-bliss .form-check-input:hover {
    border-color: #4fd6cf;
}

.rcmforms--preset-bliss .form-check-input:checked {
    background-color: var(--rcmf-accent);
    border-color: var(--rcmf-accent);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px;
}

.rcmforms--preset-bliss .form-check-input:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(27, 187, 179, 0.45);
}

.rcmforms--preset-bliss .form-check-label {
    flex: 1 1 auto;
    width: auto;
    margin: 0;
    padding: 0;
    color: #e0e0e0;                   /* светлый, в тон тексту формы — как её часть */
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;  /* шаблон bliss даёт label{Lucida Grande} — перебиваем под шрифт формы */
    font-size: 14px;                  /* как поля формы */
    font-weight: 400;
    line-height: 1.45;
    cursor: pointer;
}

.rcmforms--preset-bliss .form-check-label a {
    color: var(--rcmf-accent);
    text-decoration: underline;
}

.rcmforms--preset-bliss .invalid-feedback {
    display: none;            /* BS5 по умолчанию скрывает — дублируем для BS3 */
    flex: 0 0 100%;
    margin: 0.25rem 0 0;
    color: var(--rcmf-error);
    font-size: 0.85em;
}

.rcmforms--preset-bliss .form-check-input.is-invalid ~ .invalid-feedback,
.rcmforms--preset-bliss .form-check.is-invalid .invalid-feedback {
    display: block;
}

/* ── Возвратка успеха (inline) ──────────────────────────────────────────────
 * .rcmforms__success — инлайн-замена формы после успешной отправки. База его не
 * стилизует (был «просто текст»). Делаем заметную карточку в тон bliss: тёмная
 * подложка с бирюзовой рамкой, кружок-галочка сверху, крупный светлый текст.
 */
.rcmforms--preset-bliss .rcmforms__success {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.85rem;
    text-align: center;
    padding: 2.25rem 1.5rem;
    border: 1px solid rgba(27, 187, 179, 0.55);
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(27, 187, 179, 0.14), rgba(27, 187, 179, 0.04));
    color: #ffffff;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1.15rem;
    font-weight: 600;
    line-height: 1.45;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
    animation: rcmforms-bliss-success-in .35s ease both;
}

.rcmforms--preset-bliss .rcmforms__success::before {
    content: "";
    flex: 0 0 auto;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: var(--rcmf-accent);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 34px;
    box-shadow: 0 0 0 7px rgba(27, 187, 179, 0.18);
}

@keyframes rcmforms-bliss-success-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}