/* Страница «Комплексные кассовые решения» (ru/komplec-kassa, kz/komplec-kassa). Блоки — zero.css,
   вкладки «Наши решения внедряют» — как на «Возможностях» (page-funkcii.css); здесь — попап заявки. */

.kk-popup .popup__box { padding: 50px 45px 40px; border-radius: 40px; background: #f3f3f3; color: #222; }
.kk-popup .popup__close { position: fixed; top: 16px; right: 16px; color: #fff; }
.kk-popup .popup__title { color: #222; font-size: 36px; font-weight: 500; line-height: 1.23; }
.kk-popup__sub { margin-top: 8px; color: #222; font-size: 16px; font-weight: 500; text-align: center; }
.kk-form { display: grid; gap: 25px; margin-top: 30px; }
.kk-form .field { position: relative; }
.kk-form input:not([type="checkbox"]), .kk-form textarea {
    display: block; width: 100%; height: 60px; padding: 0 20px; border: 1px solid var(--c-dark); border-radius: 5px;
    background: transparent; color: #000; font: inherit; font-size: 16px; outline: none;
}
.kk-form textarea { height: 100px; padding: 15px 20px; resize: vertical; }
.kk-form input::placeholder, .kk-form textarea::placeholder { color: #000; opacity: .5; }
.kk-form .field--error input { border-color: #ff3d3d; box-shadow: 0 0 0 1px #ff3d3d; }
.kk-form .field--phone input { padding-left: 62px; }
.kk-form .pz-flag { --u: 1px; left: 20px; }
.kk-form button { height: 60px; border: 0; border-radius: 5px; background: var(--c-dark); color: #fff; font-size: 16px; font-weight: 600; cursor: pointer; }
.kk-form button[disabled] { opacity: .6; cursor: default; }
.kk-form .form-msg { margin: 0; }
.kk-popup .form-done { color: #222; }

@media (max-width: 639px) {
    .kk-popup { width: 100%; max-width: none; height: calc(100% - 50px); max-height: none; margin: 50px 0 0; }
    .kk-popup .popup__box { height: 100%; max-height: none; padding: 20px 20px 30px; border-radius: 0 0 40px 40px; }
    .kk-popup .popup__close { top: 13px; right: 13px; }
    .kk-popup .popup__title { font-size: 20px; }
    .kk-popup__sub { margin-top: 4px; font-size: 12px; }
    .kk-form { gap: 25px; margin-top: 15px; }
    .kk-form input:not([type="checkbox"]) { height: 50px; padding: 0 15px; border-radius: 8px; }
    .kk-form .field--phone input { padding-left: 57px; }
    .kk-form .pz-flag { left: 15px; }
    .kk-form textarea { border-radius: 8px; }
    .kk-form button { height: 50px; border-radius: 8px; }
}
