/*
 * Оформление заказа /order/: вид, который раньше давал плагин fixorder (те его функции, что были включены).
 * Цвета — из прежних настроек сайтов. Подключается на всех сайтах с плагином, в том числе там,
 * где остальное оформление buyblock выключено (настройка «Режим»).
 */

/* общее */
html body .s-order-page .s-order-section *:not(i) { box-sizing: border-box; }
html body .wa-link { user-select: none; }
html body .wa-toggle > * { font-size: 12px; }
html body .wa-order-form-wrapper .wa-tooltip:not(.custom):after { font-size: 13px; }
html body .bb-hidden { display: none !important; }
html body .bb-inline-block { display: inline-block !important; }
/* лишние заголовки: «Типы доставки», пометка об обязательных полях региона */
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-header,
html body .wa-order-form-wrapper .wa-step-region-section .wa-required-text { display: none; }

/* плитки типов доставки */
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper { padding: 10px 25px; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper:not(.is-active) { background: #fff !important; border-color: #cacaca !important; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper.is-active,
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper:hover { border-color: #cacaca; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper.is-active,
html body .wa-toggle > *.selected,
html body .wa-dropdown > .wa-dropdown-area > .wa-dropdown-item:hover,
html body .wa-order-dialog.wa-shipping-pickup-dialog .wa-variants-section .wa-variants-list .wa-variant-wrapper:hover { background: #d9ecff linear-gradient(to bottom, #d9ecff, #e6f2ff) !important; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper.is-active { position: relative; cursor: default; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper.is-active .wa-name a { cursor: default; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper .wa-name a { text-decoration: none !important; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper:not(.is-active) .wa-name a { color: #006bd8; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper.is-active .wa-name a,
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper:not(.is-active):hover .wa-name a,
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper .wa-price { color: #000; }
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper .wa-date { color: #272727; }

/* зелёная галочка на выбранной плитке доставки и карточке оплаты */
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-types-section .wa-types-list .wa-type-wrapper.is-active::after,
html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper.is-active::before {
    content: '\2714'; position: absolute; top: 5px; right: 5px; left: auto;
    width: 17px; height: 17px; border-radius: 50%; background: #3bb300; color: #fff;
    font-size: 10px; line-height: 17px; text-align: center;
}

/* карточки способов оплаты */
html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper { margin-bottom: 0; padding: 10px 25px; background: #fbfbfb; }
html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper:not(:last-child) { border-bottom-width: 0; }
html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper.is-active { position: relative; cursor: default; }
html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper.is-active,
html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper:hover { border-color: #cacaca; }
html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper .wa-payment-name a { color: #008fc3; text-decoration: none !important; }
html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper.is-active .wa-payment-name a { color: #555; }
@media screen and (max-width: 350px) {
    .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list .wa-method-wrapper .wa-method .wa-image-wrapper { width: 20%; }
}
@media screen and (min-width: 841px) and (max-width: 930px) {
    html body .wa-order-form-wrapper .wa-step-payment-section .wa-methods-list.wide .wa-method-wrapper .wa-method .wa-method-body .wa-payment-name { padding-left: 5px; padding-right: 5px; }
}

/* выпадающий список вариантов доставки и окно выбора пункта */
html body .s-checkout-order-page .wa-dropdown > .wa-dropdown-toggle { padding-left: 15px; font-size: 14px; background: #e6f2ff; color: #000; }
html body .wa-order-dialog.wa-shipping-pickup-dialog .wa-variants-section .wa-filters-wrapper .wa-filters-list .wa-filter-wrapper.is-active { background: #d9ecff; color: #000; }
html body .wa-order-dialog.wa-shipping-pickup-dialog .wa-variants-section .wa-variants-list .wa-variant-wrapper .wa-details .wa-service,
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-variants-section .wa-delivery-variant .wa-service { display: block; margin-top: 5px; color: #737272; opacity: 1; }
html body .wa-order-dialog.wa-shipping-pickup-dialog .wa-variants-section .wa-variants-list .wa-variant-wrapper .wa-details .wa-date,
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-variants-section .wa-delivery-variant .wa-date { font-weight: 600; opacity: 1; }
html body .wa-order-dialog.wa-shipping-pickup-dialog .wa-variants-section .wa-variants-list .wa-variant-wrapper .wa-details .wa-date::before,
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-variants-section .wa-delivery-variant .wa-date::before { content: '('; }
html body .wa-order-dialog.wa-shipping-pickup-dialog .wa-variants-section .wa-variants-list .wa-variant-wrapper .wa-details .wa-date::after,
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-variants-section .wa-delivery-variant .wa-date::after { content: ')'; }

/* серые рамки: поля покупателя, подробности доставки, поля адреса, описание доставки */
html body .wa-step-auth-section .wa-section-body { position: relative; bottom: 3px; margin-top: 0; padding: 25px 15px 10px !important; background: #fbfbfb; border: 1px solid #ccc; border-radius: 0 0 3px 3px; }
html body .wa-order-form-wrapper .wa-details-rates-section { position: relative; padding: 10px 15px; background: #fbfbfb; border: 1px solid #ccc; border-radius: 3px; cursor: default; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section { position: relative; bottom: 3px; margin-top: 0; padding: 40px 15px 10px; background: #fbfbfb; border: 1px solid #ccc; border-radius: 0 0 3px 3px; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section + .wa-details-fields-section { border-top: 0; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-field-wrapper { min-width: 80%; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-field-wrapper:first-child { padding-top: 0; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-fields-group { width: calc(100% - 15px); }
html body .bb-delivery-description { position: relative; display: block; clear: both; margin-top: 15px; padding: 10px 15px 10px 40px; font-size: 13px; background: #fbfbfb; border: 1px solid #ccc; border-radius: 3px; }
html body .bb-delivery-description::before { content: '!'; position: absolute; top: 7px; left: 7px; width: 20px; height: 20px; border-radius: 3px; background: #fff937; color: #000; font-size: 16px; font-weight: 900; line-height: 20px; text-align: center; }
html body .bb-delivery-description p { margin: 0 0 5px; }
html body .bb-delivery-description p:last-child { margin-bottom: 0; }

/* значок в углу рамки: зелёная галочка — всё заполнено, красная звёздочка — нет (класс ставит checkout.js) */
html body .wa-step-auth-section .wa-section-body::after,
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section::after {
    content: '\2714'; position: absolute; top: 5px; right: 5px;
    width: 17px; height: 17px; border-radius: 50%; background: #3bb300; color: #fff;
    font-size: 10px; line-height: 17px; text-align: center;
}
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section::after { top: 25px; }
html body .wa-step-auth-section .wa-section-body.bb-notready::after,
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section.bb-notready::after { content: '*'; top: 10px; background: none; color: #ff2d2d; font-size: 30px; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section.bb-notready::after { top: 30px; }

/* таблица подробностей доставки */
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-table > .wa-row > .wa-cell.wa-cell-name .wa-name,
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-additional-item .wa-label,
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-comment-item .wa-label { color: #555; font-weight: 600 !important; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-table > .wa-row > .wa-cell.wa-cell-name .wa-name::after { content: ':'; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-table .wa-cell-name { color: #555; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-table > .wa-row > .wa-cell.wa-cell-value { font-weight: normal; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-table .wa-cell-value,
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-table .wa-cell-value .wa-delivery-price { color: #000; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-table > .wa-row > .wa-cell.wa-cell-value .google-geolink { color: inherit; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-schedule-wrapper .wa-label { color: #555; font-weight: 600; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-schedule-wrapper .wa-days-wrapper .wa-day-wrapper .wa-value .wa-text { color: #333; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-schedule-wrapper .wa-days-wrapper .wa-day-wrapper .wa-date { width: 45%; padding-right: 20px; }
/* фото пункта выдачи */
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-photos-section .wa-action.is-disabled { display: none; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-photos-section .wa-action .wa-icon { width: 20px; height: 20px; padding: 5px; border-radius: 50%; background: #000; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-photos-section .wa-action:not(.is-disabled):hover .wa-icon { opacity: .8; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-photos-section .wa-photos-list { margin-left: 0; margin-right: 0; }
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-photos-section .wa-photos-list .wa-photo-wrapper .wa-photo { cursor: zoom-in; }
html body .bb-images-info { margin-top: 10px; font-size: 12px; font-style: italic; }
@media screen and (max-width: 600px) {
    html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-photos-section .wa-photos-list { display: flex; height: 100px; }
    html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-photos-section .wa-photos-list .wa-photo-wrapper { width: 33%; margin-right: 10px; }
}
@media screen and (max-width: 450px) {
    html body .wa-order-form-wrapper .wa-step-details-section .wa-details-rates-section .wa-photos-section .wa-photos-list .wa-photo-wrapper { width: 45%; margin-right: 20px; }
}

/* поля «желаемая дата и время» (настройка «Поля желаемой даты») */
html.bb-desired body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-field-wrapper.wa-field-date,
html.bb-desired body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-field-wrapper.wa-field-time { width: 120px; min-width: 120px; margin-top: 0 !important; }
html.bb-desired body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-field-wrapper.wa-field-date { margin-right: 10px; }
html.bb-desired body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-field-wrapper.wa-field-time { width: 150px; min-width: 150px; }
html.bb-desired body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-field-wrapper.wa-field-time select.datetime { background: #fff; }

/* «Комментарий к заказу»: пунктирное подчёркивание и стрелка */
html body .bb-dotted { border-bottom: 1px dotted; }
html body .bb-dotted:hover,
html body .wa-visible.is-opened .bb-dotted,
html body .wa-comment-section.is-opened .bb-dotted { border-color: transparent; }
html body .wa-order-form-wrapper .wa-visible .wa-icon.arrow-bottom { float: left; width: 12px; height: 12px; margin: 4px 5px 0 0; color: #888; transform: rotate(-90deg); }
html body .wa-order-form-wrapper .is-opened .wa-icon.arrow-bottom { transform: rotate(0deg) !important; }
html body .wa-order-form-wrapper .wa-step-confirm-section .wa-comment-section .wa-textarea { max-height: 200px; }
/* линия перед итогом (настройка «Линия перед итогом») */
html body .bb-hr { display: inline-block; width: 100%; height: 1px; margin-bottom: 30px; padding-bottom: 15px; border-bottom: 1px solid #e6e0e0; }

/* поля ввода */
html body .wa-field-wrapper .wa-label,
html body .wa-step-auth-section .wa-section-body .wa-label,
html body .wa-order-form-wrapper .wa-step-details-section .wa-details-fields-section .wa-label,
html body .wa-order-form-wrapper .wa-step-shipping-section .wa-delivery-variants-section > .wa-header { color: #888; }
html body input.wa-input, html body textarea.wa-textarea, html body select.wa-select, html body select.select,
html body .wa-field-wrapper .wa-select, html body .s-checkout-order-page .wa-field-wrapper .wa-select { border-color: #cfcfcf; }
html body input.wa-input, html body textarea.wa-textarea, html body select.wa-select { color: #000; }
html body input.wa-input:not(:disabled):hover, html body textarea.wa-textarea:not(:disabled):hover,
html body select.wa-select:not(:disabled):not(.wa-error):hover, html body select.select:not(:disabled):not(.wa-error):hover,
html body .wa-field-wrapper .wa-select:hover, html body .s-checkout-order-page .wa-field-wrapper .wa-select:hover,
html body .wa-input:not(:disabled):focus, html body .wa-textarea:not(:disabled):focus,
html body select.wa-select:not(:disabled):not(.wa-error):focus, html body select.select:not(:disabled):not(.wa-error):focus { border-color: #888; }
html body .wa-order-form-wrapper .wa-step-auth-section .wa-required,
html body .wa-order-form-wrapper .wa-step-region-section .wa-required,
html body .wa-order-form-wrapper .wa-step-details-section .wa-required { color: #ff2d2d; font-size: 13px; font-weight: 600; }
html body .wa-order-form-wrapper .wa-step-auth-section .wa-required.bb-required-auto { color: #ff8200; font-size: 13px; font-weight: 600; }
@media screen and (min-width: 841px) and (max-width: 1050px) { html body .s-order-section .wa-field-wrapper .wa-input::placeholder { font-size: 11px; } }
@media screen and (min-width: 841px) and (max-width: 1000px) { html body .s-order-section .wa-field-wrapper .wa-input::placeholder { font-size: 10px; } }
@media screen and (min-width: 841px) and (max-width: 920px) { html body .s-order-section .wa-field-wrapper .wa-input::placeholder { font-size: 9px; } }

/* ошибки в оплате и доставке — красная плашка */
.wa-step-payment-section .wa-error-text,
.wa-step-shipping-section .wa-error-text { display: inline-block; margin-top: 10px; padding: 5px 10px; font-size: 1.3em; background: red; color: #fff; cursor: default; }