/* ===== Кастомные правки сайта ===== */

/* 1. Шрифт MorfinSans для основного текста (тело, параграфы) */
@font-face {
    font-family: "MorfinSans";
    src: url("https://db.onlinewebfonts.com/t/fd3232eea650fe2c6a9ecc944b51fd8e.eot");
    src: url("https://db.onlinewebfonts.com/t/fd3232eea650fe2c6a9ecc944b51fd8e.eot?#iefix") format("embedded-opentype"),
        url("https://db.onlinewebfonts.com/t/fd3232eea650fe2c6a9ecc944b51fd8e.woff2") format("woff2"),
        url("https://db.onlinewebfonts.com/t/fd3232eea650fe2c6a9ecc944b51fd8e.woff") format("woff"),
        url("https://db.onlinewebfonts.com/t/fd3232eea650fe2c6a9ecc944b51fd8e.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

:root {
    --text-font-family: "MorfinSans", "SMTextsFont", sans-serif;
    --title-font-family: "MorfinSans", "SMHeadersFont", sans-serif;
}

/* 1b. Надписи, у которых шрифт был жёстко прописан в CSS (а не через переменную),
   поэтому предыдущая замена --text-font-family их не затронула:
   имена ("Андрей", "Ирина") и подписи "жених"/"невеста" */
.sm-main_names,
.sm-main_names-text {
    font-family: "MorfinSans", "SMTextsFont", sans-serif;
}

/* 2. Новые фото жениха/невесты разного соотношения сторон — не растягиваем,
   а вписываем в рамку без искажений */
.sm-main__image-container img {
    object-fit: contain;
    object-position: bottom center;
}

/* 2b. Увеличиваем фото на ковре и подравниваем под стрелки/подписи
   (было 290x405 на десктопе и 230x351 на мобильном — слишком мелко) */
.sm-main__image-container img {
    width: 330px !important;
    height: 380px !important;
    left: -35px !important;
}

/* 2c. Левое фото (Андрей, cover-1) — увеличено ещё в ~1.1 раза и опущено,
   чтобы доходило до нижнего края ковра */
.sm-main__image-0 img {
    width: 363px !important;
    height: 418px !important;
    left: -92px !important;
    top: -10px !important;
}

/* 2d. Правое фото (cover-2) — чуть ниже, чтобы доходило до нижнего края ковра */
.sm-main__image-1 img {
    top: 28px !important;
}

@media (max-width: 500px) {
    .sm-main__image-container img {
        width: 250px !important;
        height: 300px !important;
        left: -50px !important;
    }

    .sm-main__image-0 img {
        width: 275px !important;
        height: 330px !important;
        left: -92px !important;
        top: 0 !important;
    }

    .sm-main__image-1 img {
        top: 30px !important;
    }
}

/* 3. Новое фото в блоке "До встречи!" — вписываем без искажений */
.sm-footer .sm-img img {
    object-fit: cover;
}

/* 5. Галочка в квадратных чекбоксах ("Что будете пить?").
   ВАЖНО: раньше иконка была подключена через CSS mask — а исходный
   checkbox.svg нарисован чёрными линиями на прозрачном фоне. По
   умолчанию CSS-маска работает в режиме "luminance" (яркость), а не
   по альфа-каналу: чёрный цвет = нулевая яркость, поэтому браузер
   считал маску пустой и прятал вообще весь квадрат целиком — это и
   был баг. Поэтому здесь используется НЕ маска, а обычная белая
   версия иконки (checkbox-check.svg), наложенная поверх залитого
   тёмным фона — так работает предсказуемо во всех браузерах. */
.sm-form_checkbox_input:checked+.sm-form_checkbox_box {
    background-color: var(--text-clr-1);
    background-image: url("./checkbox-check.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 65% 65%;
    -webkit-mask: none;
    mask: none;
}

/* 6. Круглые варианты ответа ("Придёте на свадьбу?") —
   при выборе просто заливаем кружок чёрным, без иконки */
.sm-form_checkbox_input[type="radio"]:checked+.sm-form_checkbox_box {
    background-color: var(--text-clr-1);
    background-image: none;
    -webkit-mask: none;
    mask: none;
}