.woocommerce-billing-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(3, 120px);
    gap: 40px;
}

.btn_chekout_wrapper{
    grid-column: 1/2;
    grid-row: 4/5;
}

#order_review {
    grid-column: 1/2;
    grid-row: 4/5;
}

#billing_comments_field {
    grid-column: 1/3;
    grid-row: 3/4;
}

#terms_field {
    grid-column: 2/3;
    grid-row: 4/5;
}

.checkout_page .woocommerce {
    background-color: #fff;
    padding: 40px;
    padding-bottom: 0;
    margin-bottom: 120px;
}

.checkout_page .form-row {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    gap: 26px;
}

.woocommerce-input-wrapper {
    display: flex;
    align-items: center;
    height: 100%;
}
.woocommerce-invalid-required-field{

}

.checkout_page .input-text {
    width: 100%;
    height: 100%;
    border-bottom: 1px solid var(--grid-gray);
}

.checkout_page .input-text:focus {
    border-bottom: 1px solid var(--orange-accent);
}
.btn_chekout_wrapper{
    margin-left: -40px;
    margin-bottom: -40px;
}

.btn_checkout {
    width: 100%;
    margin-left: -40px;
}

.amts_checkout_checkbox {
    width: 100%;
    height: 100%;
}

.amts_checkout_checkbox .woocommerce-input-wrapper {
    display: flex;
    align-items: center;
    justify-content: start;
}

.amts_agree_checkbox {
    display: inline-flex;
    align-items: center;
}

.amts_agree_checkbox::before {
    order: -1; /* Ставим псевдоэлемент в начало */
    margin-right: 8px;
}

.amts_submit_wrapper label.checkbox::before {
    content: "";
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 1px solid var(--grid-gray);
    background-color: var(--white);
    flex-shrink: 0;
    order: -1;
    margin-right: 15px;
}

.amts_submit_wrapper{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
}
.btn_cart{
    width: 50%;
}
.woocommerce-terms-and-conditions-wrapper{
    width: 50%;
    height: 100%;
}

.woocommerce-form__label.woocommerce-form__label-for-checkbox{
    display: flex;
    align-items: center;
    height: 100%;
}
    /* ========== ОСНОВНАЯ МАГИЯ: КАСТОМНЫЙ ЧЕКБОКС ========== */
/* Родительский label — главный контейнер для кастомного чекбокса */
.checkbox.amts_checkbox_agree {
    position: relative;
    display: inline-flex;
    align-items: flex-start; /* текст и звёздочка выравнены по верхнему краю, но визуально красиво */
    cursor: pointer;
    font-size: 0.95rem;
    line-height: 1.45;
    color: #1e2a3e;
    gap: 0;
    width: 100%;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

/* Скрываем нативный чекбокс, но оставляем его доступным для фокуса и взаимодействия */
.woocommerce-form__input-checkbox.input-checkbox {
    position: absolute;
    left: 0;
    top: 0;
    width: 50px; /* точный размер зоны клика */
    height: 50px;
    opacity: 0;
    margin: 0;
    padding: 0;
    cursor: pointer;
    z-index: 2; /* поверх кастомной рамки, чтобы клик точно срабатывал */
    pointer-events: auto;
}

/* Кастомный визуальный квадрат (незакрашенный) — создаём псевдоэлемент перед текстом */
woocommerce-form__label-for-checkbox::before {
    content: "✔";
    display: inline-block;
    width: 50px;
    height: 50px;
    background-color: #ffffff;
    border: 1px solid var(--black);
    margin-right: 14px;
    flex-shrink: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 0; /* скрыт по умолчанию — появляется только при checked */
    align-self: flex-start; /* для многострочного текста чекбокс не растягивается */
    /*margin-top: 2px;*/
}

/* Стиль для состояния "наведение" — мягкий эффект */
.woocommerce-form__input-checkbox:hover::before {
    border-color: var(--black);
}

/* Фокус-состояние для доступности (клавиатура) — обводка вокруг кастомного квадрата */
.woocommerce-form__input-checkbox:focus-within::before {
    border-color: var(--black);
}

/* ===== ГЛАВНОЕ: при checked отображаем SVG-галочку ===== */
/* Используем современный :has() — чисто CSS, без изменения структуры DOM */
.woocommerce-form__label-for-checkbox:has(.input-checkbox:checked)::before {
    border-color: var(--black);
    background-color: #ffffff;
    background-image: url("data:image/svg+xml,%3Csvg width='22' height='16' viewBox='0 0 22 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.34306 15.5163L0 8.17292L1.25 6.93195L7.34306 13.0253L20.3594 0L21.6094 1.25L7.34306 15.5163Z' fill='%23FD3D0E' /%3E%3C/svg%3E");
    background-size: 21px 15px; /* пропорционально уменьшаем галочку внутри квадрата 24px */
    background-position: center center;
    background-repeat: no-repeat;
}

/* Стиль текста согласия + ссылки */
.amts_agree_text {
    flex: 1;
    font-weight: 450;
    letter-spacing: -0.01em;
}

.amts_agree_text a {
    color: var(--orange-accent);
    text-decoration: none;
    font-weight: 500;
    transition: border 0.2s, color 0.2s;
}

.amts_agree_text a:hover {
    color: var(--orange-accent);
    border-bottom-color: var(--orange-accent);
}


/* Дополнительная стилизация для общей гармонии (поле формы) */
.form-row.checkbox_group {
    margin: 0;
    padding: 0;
}

/* поддержка длинных переносов */
.amts_agree_text {
    display: inline;
    word-break: break-word;
}

.woocommerce-shipping-fields, .woocommerce-additional-fields {
    display: none;
}

.woocommerce-terms-and-conditions-checkbox-text a{
    color: var(--orange-accent);
}

p.terms_description{
    display: none;
}

/* Скрываем inline-ошибку для чекбокса согласия */
.woocommerce-terms-and-conditions-wrapper .checkout-inline-error-message {
    display: none;
}

.woocommerce-error li a{
    color: red;
}
.woocommerce-error{
    padding-bottom: 15px;
}

/* Только в контексте формы оформления заказа */
.woocommerce-checkout [aria-invalid="true"] {
    border: 1px solid red;
}

.woocommerce-thankyou-order-received,
.woocommerce-order-details__title,
.woocommerce-column__title{
    margin-bottom: 20px;
}
.woocommerce-customer-details{
    padding-bottom: 40px;
}
