/* ======================================================= */
/* TERRASECURE PREMIUM CHECKOUT STYLES                     */
/* ======================================================= */
/* Токен: 6eaa63a17f8cc2f169280733b11e5f36 */

/* --- 1. БАЗОВЫЕ СТИЛИ И ФОН --- */
body {
    background-color: #121418; 
    color: #fff;
}

/* ==========================================
ЖЕСТКАЯ БЛОКИРОВКА ГОРИЗОНТАЛЬНОГО СКРОЛЛА
   ========================================== */

/* 1. Блокируем на уровне системы (добавлено отключение свайпа) */
html, body {
    overflow-x: hidden !important;
    width: 100vw !important; /* Строго 100% ширины экрана, ни пикселем больше */
    max-width: 100%;
    position: relative;
    overscroll-behavior-x: none; /* Убивает эффект резинового отскока по горизонтали */
}

/* 2. Ставим "ловушку" на главный контейнер страницы */
main#top, 
.main {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100vw !important;
}

/* 3. Жесткая изоляция блока оплат (обрезаем всё, что пытается вылезти из него) */
.shopping-cart-payment,
#payment-methods-container,
#payment-methods {
    overflow: hidden !important; /* Ключевой момент: обрезаем хвосты скрипта внутри блока */
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 4. Глушим отрицательные отступы у строк Bootstrap, которые часто рвут мобильную сетку */
#order .row {
    max-width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Токен: 6eaa63a17f8cc2f169280733b11e5f36 */
/* ==========================================
   ИЗОЛЯЦИЯ ПОЛЕЙ ВВОДА (БОРЬБА СО СКРОЛЛОМ ПРИ ВВОДЕ)
   ========================================== */

/* 1. Блокируем авто-зум на мобильных (Safari не зумит поля со шрифтом 16px) */
#order .form-control, 
#order .form-select-terrasecure {
    font-size: 16px !important; 
    box-sizing: border-box !important;
    max-width: 100% !important;
}

/* 2. Жестко глушим любые иконки валидации, которые скрипт пытается выкинуть за край экрана */
#order .form-control-feedback,
#order .glyphicon,
#order .has-error:after,
#order .has-success:after {
    display: none !important;
}

/* 3. Бетонируем контейнеры полей ввода (чтобы их не распирало при смене состояний) */
#order .form-group,
#order .form-floating {
    max-width: 100% !important;
    box-sizing: border-box !important;
    /* Если что-то попытается вылезти за пределы поля - отрезаем */
    overflow: hidden !important; 
}

/* 4. Фикс для специфических отступов плавающих ярлыков Bootstrap */
#order .form-floating > label {
    max-width: 100% !important;
    white-space: nowrap !important; /* Чтобы длинный текст не ломал ширину */
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* --- 2. ПРЕМИАЛЬНЫЕ ИНПУТЫ И ПЛАВАЮЩИЕ ЛЕЙБЛЫ --- */
.form-floating > .form-control { 
    background-color: transparent; 
    border: 1px solid rgba(255,255,255,0.1); 
    border-radius: 12px; 
    color: #fff; 
    font-family: 'Montserrat', sans-serif; 
    font-size: 0.95rem; 
}
.form-floating > .form-control:focus { 
    border-color: #8fac6a; 
    box-shadow: 0 0 10px rgba(143, 172, 106, 0.2); 
    background-color: rgba(255,255,255,0.02); 
}
.form-floating > label { 
    color: rgba(255,255,255,0.5); 
    padding-left: 1.2rem; 
    font-size: 0.85rem; 
    background-color: transparent !important;
}
.form-floating > .form-control:focus ~ label, 
.form-floating > .form-control:not(:placeholder-shown) ~ label { 
    color: #8fac6a; 
    opacity: 1; 
    transform: scale(0.85) translateY(-0.7rem) translateX(0.15rem); 
}

/* Убиваем белые плашки у плавающих лейблов */
.form-floating > .form-control:focus ~ label::after, 
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-select:focus ~ label::after, 
.form-floating > .form-select:not(:placeholder-shown) ~ label::after {
    background-color: #121418 !important;
    border-radius: 12px;
}

/* Исправление белого фона при автозаполнении браузером */
input:-webkit-autofill, input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px #121418 inset !important;
    -webkit-text-fill-color: #ffffff !important;
    transition: background-color 5000s ease-in-out 0s;
    caret-color: #ffffff;
}

/* Ошибки валидатора */
.has-error .form-control { border-color: #ff3a34 !important; box-shadow: 0 0 8px rgba(255, 58, 52, 0.2) !important; }
.has-error label { color: #ff3a34 !important; }
.alert-danger { background-color: rgba(255, 58, 52, 0.1); border: 1px solid #ff3a34; color: #ff3a34; border-radius: 12px; }

/* --- 3. ВЫПАДАЮЩИЕ СПИСКИ (SELECT) И ПАКОМАТЫ --- */
.form-select, select.form-control, .form-select-terrasecure {
    appearance: none !important; 
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    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-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 1.2rem center !important;
    background-size: 16px 12px !important;
    padding-right: 2.5rem !important; 
    background-color: transparent; 
    border: 1px solid rgba(255,255,255,0.1); 
    border-radius: 12px; 
    color: #fff; 
    font-family: 'Montserrat', sans-serif; 
    font-size: 0.95rem; 
    padding: 1rem 1.2rem;
}
.form-select:focus, select.form-control:focus, .form-select-terrasecure:focus { 
    border-color: #8fac6a; outline: 0; box-shadow: 0 0 10px rgba(143, 172, 106, 0.2); 
}
.form-select option, select.form-control option, .form-select-terrasecure option {
    background-color: #121418 !important; 
    color: #ffffff !important;            
    padding: 10px !important;
}

/* Токен: 6eaa63a17f8cc2f169280733b11e5f36 */

/* ==========================================
   MOBILE PREMIUM UX (max-width: 768px)
   ========================================== */
@media (max-width: 768px) {
    
    /* 1. Массивная итоговая сумма */
    #kuulubtasumisele {
        font-size: 1.8rem !important; /* Увеличиваем с 1.30rem */
        letter-spacing: -0.02em; /* Легкая стяжка цифр для монолитности */
    }

    /* 2. Крупные чекбоксы для удобного тапа */
    .form-check-input-terrasecure {
        width: 26px !important;
        height: 26px !important;
        margin-top: 0.25rem !important; /* Регулируй 0.2rem - 0.3rem для идеала */
        border-radius: 6px !important; /* Чуть скругляем углы для современной эстетики */
		
    }

    /* 3. Увеличенный текст соглашений и гарантий */
    .radio label {
        font-size: 0.95rem !important; /* Делаем текст читабельным без прищура */
        line-height: 1.4 !important;
        padding-top: 0 !important;
    }

    /* 4. Воздух между опциями (защита от промахов) */
    .form-group.mb-3 .radio {
        padding-bottom: 0.8rem !important; 
        margin-bottom: 0.5rem !important;
		align-items: flex-start !important;
    }

    /* 5. Премиальная кнопка оплаты */
    #submitButton {
        font-size: 1.15rem !important;
        padding-top: 1.1rem !important;
        padding-bottom: 1.1rem !important;
        /* Легкое свечение в цвет кнопки (#8fac6a) для эффекта объема 
        box-shadow: 0 8px 25px rgba(143, 172, 106, 0.25) !important; */
    }
}


  /* Premium Radio Cards UX */
        .package-card {
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 12px;
            padding: 1.25rem 1rem;
            margin-bottom: 1rem;
            cursor: pointer;
            transition: all 0.3s ease;
            background-color: rgba(255, 255, 255, 0.02);
            position: relative;
        }
        .package-card:hover {
            border-color: rgba(143, 172, 106, 0.5);
            background-color: rgba(143, 172, 106, 0.05);
        }
        .package-card.selected {
            border-color: #8fac6a;
            background-color: rgba(143, 172, 106, 0.1);
            box-shadow: 0 0 15px rgba(143, 172, 106, 0.15);
        }
        .package-card .check-circle {
            width: 22px;
            height: 22px;
            border: 2px solid rgba(255, 255, 255, 0.3);
            border-radius: 50%;
            display: inline-block;
            position: relative;
            margin-right: 15px;
            flex-shrink: 0;
            top: 2px;
            transition: all 0.2s ease;
        }
        .package-card.selected .check-circle {
            border-color: #8fac6a;
        }
        .package-card.selected .check-circle::after {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 10px;
            height: 10px;
            background-color: #8fac6a;
            border-radius: 50%;
        }
        .bestseller-badge {
            position: absolute;
            top: -12px;
            right: 20px;
            background-color: #8fac6a;
            color: #121418;
            font-size: 0.65rem;
            font-weight: 800;
            padding: 3px 12px;
            border-radius: 20px;
            text-transform: uppercase;
            letter-spacing: 1px;
            box-shadow: 0 4px 10px rgba(0,0,0,0.3);
        }
        /* Tooltip */
        .booster-tooltip {
            position: relative;
            display: inline-block;
            color: #8fac6a;
            cursor: help;
            margin-left: 5px;
        }
        .booster-tooltip .tooltip-text {
            visibility: hidden;
            width: 260px;
            background-color: #1a1d24;
            color: rgba(255,255,255,0.9);
            text-align: center;
            border-radius: 8px;
            padding: 10px 12px;
            position: absolute;
            z-index: 10;
            bottom: 130%;
            left: 50%;
            transform: translateX(-50%);
            opacity: 0;
            transition: opacity 0.3s;
            font-size: 0.75rem;
            font-weight: normal;
            border: 1px solid rgba(255,255,255,0.1);
            box-shadow: 0 10px 25px rgba(0,0,0,0.6);
            line-height: 1.4;
        }
        .booster-tooltip .tooltip-text::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: rgba(255,255,255,0.1) transparent transparent transparent;
        }
        .booster-tooltip:hover .tooltip-text {
            visibility: visible;
            opacity: 1;
        }


/* Специфичные стили для пакоматов */
.address-inputs select option { background-color: #1a1d24 !important; color: #ffffff !important; padding: 5px !important; }
.address-inputs select optgroup, .address-inputs select option:disabled, .address-inputs select option[value="none"] {
    background-color: #121418 !important; color: #8fac6a !important; font-weight: 700 !important; font-size: 0.9rem !important; font-style: normal !important;
}
.address-inputs select option[value=""] { color: rgba(255,255,255,0.4) !important; background-color: #1a1d24 !important; }

/* --- 4. ЧЕКБОКСЫ И ВЫРАВНИВАНИЕ --- */
.form-check { display: flex !important; align-items: flex-start !important; margin-bottom: 1rem !important; }
.form-check .form-check-input { margin-top: 0.2rem !important; flex-shrink: 0 !important; margin-right: 0.75rem !important; }
.form-check .form-check-label { display: block !important; line-height: 1.4 !important; margin-left: 0 !important; }
.form-check-input-terrasecure { background-color: transparent; border: 1px solid rgba(255,255,255,0.2); width: 1.2rem; height: 1.2rem; margin-top: 0.15rem; cursor: pointer; }
.form-check-input-terrasecure:checked { background-color: #8fac6a; border-color: #8fac6a; }

/* --- 5. КАРТОЧКА ЗАКАЗА И КНОПКА --- */
.order-summary-card { background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(255, 255, 255, 0.05); border-radius: 24px; padding: 2rem; position: sticky; top: 100px; backdrop-filter: blur(10px); }
.btn-brand-green { background-color: #8fac6a !important; border-color: #8fac6a !important; color: #ffffff !important; transition: all 0.3s ease; }
.btn-brand-green:hover { background-color: #7a945b !important; transform: translateY(-2px); }

/* --- 6. ЭФФЕКТЫ ДЛЯ ТРИГГЕРОВ ДОВЕРИЯ --- */
.trust-badge-item { display: flex; align-items: start; margin-bottom: 1rem; color: rgba(255,255,255,0.5); font-size: 0.75rem; font-weight: 500; }
.trust-badge-item .fas { color: #8fac6a; opacity: 0.8; font-size: 1rem; width: 1.5rem; text-align: center; margin-right: 0.75rem; margin-top: 2px; }
.trust-badge-premium { cursor: default; }
.trust-badge-icon { width: 38px; height: 38px; background: rgba(143, 172, 106, 0.08); border-radius: 12px; color: #8fac6a; font-size: 15px; border: 1px solid transparent; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); }
.trust-badge-premium:hover .trust-badge-icon { background: rgba(143, 172, 106, 0.18); border: 1px solid rgba(143, 172, 106, 0.3); transform: scale(1.08) translateY(-2px); box-shadow: 0 6px 15px rgba(143, 172, 106, 0.15); }
.trust-badge-premium:hover .trust-title { color: #8fac6a !important; }
.payment-logos { opacity: 0.3; transition: opacity 0.3s; margin-top: 5px; }

/* --- 7. БАНКОВСКИЕ ССЫЛКИ (СЕТКА) --- */
#payment-methods .col-md-4 { width: 100% !important; max-width: 500px !important; margin: 0 auto !important; padding: 0 !important; flex: none !important; }
#payment-methods .form-group { margin-bottom: 0 !important; }
.form-group-payments { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 10px !important; width: 100% !important; margin-top: 10px !important; }
.form-group-payments .payment-group { width: 100% !important; margin: 0 !important; padding: 0 !important; }
.form-group-payments a { display: block; height: 100%; text-decoration: none; }
.form-group-payments .payment-control { display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer; border-radius: 8px !important; background: #ffffff !important; height: 48px !important; padding: 5px 10px !important; border: 2px solid transparent !important; transition: all 0.2s ease-in-out !important; box-shadow: 0 2px 6px rgba(0,0,0,0.1) !important; }
.form-group-payments .payment-control > img { width: 100% !important; max-height: 24px !important; object-fit: contain !important; display: block !important; }
.form-group-payments .payment-control:hover { transform: translateY(-2px) !important; border-color: #8fac6a !important; box-shadow: 0 6px 15px rgba(143, 172, 106, 0.2) !important; }
#pangalink section, .shopping-cart-payment { padding: 0 !important; margin: 0 !important; position: static !important; }

@media (max-width: 450px) {
    /* Переключаем сетку на 2 колонки для узких смартфонов (iPhone 5/SE) */
    .form-group-payments { 
        grid-template-columns: repeat(2, 1fr) !important; 
        gap: 8px !important; 
    }
    /* Делаем кнопки чуть комфортнее для нажатия пальцем */
    .form-group-payments .payment-control { 
        height: 44px !important; 
        padding: 6px 8px !important; 
        border-radius: 8px !important; 
    }
    /* Позволяем логотипам стать чуть крупнее */
    .form-group-payments .payment-control > img { 
        max-height: 20px !important; 
    }
}

/* --- 8. ОПЛАТА ПРИ ПОЛУЧЕНИИ (САРКОФАГ ОТ THEME.MIN.CSS) --- */
#payOnDeliveryAgreement { padding-left: 0 !important; padding-right: 0 !important; background: transparent !important; border: none !important; }
#payOnDeliveryAgreement .checkbox-container { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; align-items: flex-start !important; margin-bottom: 1rem !important; padding-bottom: 1rem !important; border-bottom: 1px solid rgba(255,255,255,0.05) !important; width: 100% !important; background: none !important; }
#payOnDeliveryAgreement .checkbox-container:last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; border-bottom: none !important; }
#payOnDeliveryAgreement .switch { position: relative !important; display: block !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 24px !important; min-height: 24px !important; margin: 0 !important; margin-right: 12px !important; margin-top: 2px !important; padding: 0 !important; flex-shrink: 0 !important; background: transparent !important; }
#payOnDeliveryAgreement .switch input { position: absolute !important; opacity: 0 !important; width: 0 !important; height: 0 !important; }
#payOnDeliveryAgreement .slider { position: absolute !important; cursor: pointer !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; background-color: rgba(255,255,255,0.15) !important; border-radius: 34px !important; transition: .3s !important; border: 1px solid rgba(255,255,255,0.05) !important; }
#payOnDeliveryAgreement .slider::before { position: absolute !important; content: "" !important; height: 18px !important; width: 18px !important; left: 2px !important; bottom: 2px !important; background-color: #fff !important; border-radius: 50% !important; transition: .3s !important; box-shadow: 0 2px 4px rgba(0,0,0,0.3) !important; }
#payOnDeliveryAgreement input:checked + .slider { background-color: #8fac6a !important; border-color: #8fac6a !important; }
#payOnDeliveryAgreement input:checked + .slider::before { transform: translateX(20px) !important; }
#payOnDeliveryAgreement .checkbox-label { flex: 1 1 0% !important; min-width: 0 !important; width: 100% !important; height: auto !important; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; text-align: left !important; color: rgba(255, 255, 255, 0.7) !important; font-family: 'Montserrat', sans-serif !important; font-size: 0.8rem !important; line-height: 1.4 !important; margin: 0 !important; padding: 0 !important; padding-right: 5px !important; font-weight: 400 !important; position: static !important; white-space: normal !important; word-wrap: break-word !important; }
#payOnDeliveryAgreement ul, #payOnDeliveryAgreement ol, #payOnDeliveryAgreement li { list-style: none !important; padding: 0 !important; margin: 0 !important; }
#payOnDeliveryAgreement .pod_terms_marker { display: inline !important; white-space: normal !important; word-wrap: break-word !important; }
#payOnDeliveryAgreement .checkbox-label::before, #payOnDeliveryAgreement .checkbox-label::after, #payOnDeliveryAgreement .pod_terms_marker::before, #payOnDeliveryAgreement .pod_terms_marker::after, #payOnDeliveryAgreement li::before, #payOnDeliveryAgreement li::after { display: none !important; content: none !important; }
#payOnDeliveryAgreement .pod_terms { color: #ffffff !important; font-weight: 600 !important; border-bottom: 1px dashed rgba(143, 172, 106, 0.6) !important; text-decoration: none !important; transition: all 0.2s !important; }
#payOnDeliveryAgreement .pod_terms:hover { border-bottom: 1px solid #8fac6a !important; }
#payOnDeliveryAgreement .has-error .checkbox-label { color: #ff3a34 !important; transition: color 0.3s ease !important; }
#payOnDeliveryAgreement .has-error .pod_terms { color: #ff3a34 !important; border-bottom: 1px dashed rgba(255, 58, 52, 0.6) !important; }
#payOnDeliveryAgreement .has-error .slider { border: 1px solid #ff3a34 !important; background-color: rgba(255, 58, 52, 0.08) !important; }


/* --- 9. ВСПЛЫВАЮЩИЕ УВЕДОМЛЕНИЯ (ОШИБКИ И УСПЕХ) --- */

#responseError, #responseNotification {
    max-width: 600px; /* Сохраняем аккуратный размер */
    margin: 0 auto 2rem auto !important; /* Центрируем */
    text-align: center;
    padding: 1rem 1.5rem;
    border-radius: 12px;
    backdrop-filter: blur(10px); /* Сохраняем эффект матового стекла */
    font-weight: 500;
    letter-spacing: 0.3px; /* Чуть-чуть премиального воздуха буквам */
}

/* Специфичный стиль для ОШИБКИ (Мягкий коралловый премиум) */
#responseError {
    background-color: rgba(229, 115, 115, 0.08) !important; 
    border: 1px solid rgba(229, 115, 115, 0.3) !important; 
    color: #e57373 !important;
    box-shadow: 0 8px 20px rgba(229, 115, 115, 0.1) !important; /* Мягкое свечение */
}

/* Специфичный стиль для УСПЕХА (Наш фирменный зеленый) */
#responseNotification {
    background-color: rgba(143, 172, 106, 0.08) !important;
    border: 1px solid rgba(143, 172, 106, 0.3) !important;
    color: #8fac6a !important;
    box-shadow: 0 8px 20px rgba(143, 172, 106, 0.1) !important;
}

/* --- 10. ИДЕАЛЬНОЕ ЦЕНТРИРОВАНИЕ МАКЕТА НА ДЕСКТОПЕ --- */

@media (min-width: 992px) {
    /* Ограничиваем максимальную ширину всей формы и выравниваем по центру экрана */
    #order {
        max-width: 1150px !important; 
        margin: 0 auto !important; 
    }
}

/* ==========================================
   ПРЕМИАЛЬНЫЕ ОШИБКИ ВАЛИДАЦИИ (ТЕМНАЯ ТЕМА)
   ========================================== */

/* Делаем текст ошибки мягким коралловым вместо кислотно-красного */
#order .text-danger {
    color: #e57373 !important; 
    font-weight: 500;
    letter-spacing: 0.3px;
    margin-top: 6px !important; /* Чуть отодвигаем текст от рамки, даем воздух */
}

/* Смягчаем красную рамку вокруг самого поля */
#order .has-error .form-control,
#order .form-control.is-invalid {
    border-color: #e57373 !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 115, 115, 0.15) !important; /* Мягкое свечение */
}

/* Успокаиваем цвет съехавшего вверх ярлыка (label) */
#order .has-error label,
#order .is-invalid ~ label {
    color: #e57373 !important;
    opacity: 0.9;
}

/* ==========================================
   ПОДСВЕТКА ГАЛОЧКИ СОГЛАСИЯ С УСЛОВИЯМИ
   ========================================== */

/* Красим саму галочку и даем мягкое свечение */
#agreed.is-invalid {
    border-color: #e57373 !important;
    background-color: rgba(229, 115, 115, 0.15) !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 115, 115, 0.15) !important;
}

/* Красим текст рядом с галочкой, убирая его тусклость */
#agreed.is-invalid ~ .terms_agree {
    color: #e57373 !important;
    opacity: 1 !important; /* Делаем текст ярче (перебиваем text-white-50) */
    transition: all 0.3s ease;
}

/* Красим ссылку внутри текста (müügitingimustega) */
#agreed.is-invalid ~ .terms_agree a {
    color: #e57373 !important;
}

/* Жестко красим рамку самого квадратика галочки */
input[type="checkbox"]#agreed.is-invalid {
    border: 2px solid #e57373 !important;
    background-color: rgba(229, 115, 115, 0.1) !important;
    box-shadow: 0 0 0 0.25rem rgba(229, 115, 115, 0.2) !important;
}

/* Красим весь текст рядом с галочкой */
input[type="checkbox"]#agreed.is-invalid ~ .terms_agree {
    color: #e57373 !important;
    opacity: 1 !important;
    transition: all 0.3s ease;
}

/* Принудительно перекрашиваем зеленую ссылку в коралловый при ошибке */
input[type="checkbox"]#agreed.is-invalid ~ .terms_agree a {
    color: #e57373 !important;
}

/* ==========================================
   СКРЫТИЕ ТЕКСТОВЫХ ОШИБОК КОНТАКТОВ (МИНИМАЛИЗМ)
   ========================================== */

/* Скрываем текст под полями ввода, оставляем только коралловые рамки */
#order .row.g-3 .help-block.with-errors {
    display: none !important;
}

/* Возвращаем стандартные отступы полям, так как текста под ними больше нет */
#order .row.g-3 .form-group {
    margin-bottom: 1rem !important;
}

/* ==========================================
   ФИКС ДЛЯ ДЛИННЫХ СЛОВ НА УЗКИХ ЭКРАНАХ (IPHONE SE)
   ========================================== */

.premium-footer-link {
    /* Разрешаем браузеру ломать слишком длинные слова, если они не влезают */
    word-wrap: break-word !important; 
    overflow-wrap: break-word !important;
    
    /* Добавляем аккуратные дефисы при переносе (работает в современных браузерах) */
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    
    display: inline-block;
    max-width: 100%;
}

/* ==========================================
   ПРЕМИАЛЬНАЯ КНОПКА ЗАКАЗА (ФИКС HOVER-ЭФФЕКТА)
   ========================================== */

/* 1. Даем кнопке «воздух», чтобы при поднятии она не билась головой о потолок */
#acceptdeny,
#acceptdeny .form-group {
    overflow: visible !important;
    padding-top: 5px; 
    margin-top: 5px;
}

/* 2. Очищаем кнопку от старого мусора и делаем идеальную капсулу */
button#submitButton.btn-decorate {
    border-radius: 50px !important;
    transition: all 0.3s ease !important;
    position: relative;
    overflow: visible !important; /* Тень не должна обрезаться */
    z-index: 10;
    border: none !important; 
}

/* 3. Убиваем старые анимации (именно они создают неуклюжие квадратные подложки) */
button#submitButton.btn-decorate::before,
button#submitButton.btn-decorate::after {
    display: none !important;
}

/* 4. Создаем дорогой hover-эффект (плавная левитация + фирменное свечение) */
button#submitButton.btn-decorate:hover {
    transform: translateY(-3px) !important; /* Мягко поднимаем вверх */
    box-shadow: 0 10px 25px rgba(143, 172, 106, 0.4) !important; /* Рассеянная зеленая тень */
    background-color: #9ab973 !important; /* Чуть-чуть осветляем основной цвет для живости */
    color: #ffffff !important;
}

/* 5. Эффект физического нажатия (тактильность) */
button#submitButton.btn-decorate:active {
    transform: translateY(0) !important; /* Кнопка проваливается обратно */
    box-shadow: 0 4px 10px rgba(143, 172, 106, 0.3) !important; /* Тень сжимается */
}