//
//  One Step Checkout Delivery Date
//  ______________________________

//
//  Variables
//  ---------------------------------------------

@faq-average-rating__color: #ffc700;
@checkout-delivery-date-field-required__color: #e02b27;

//
//  Common
//  ---------------------------------------------

& when (@media-common = true) {
    .amcheckout-delivery-date .field {
        & {
            box-sizing: border-box;
            float: left;
            padding-top: 4px;
            width: 100%;
        }

        &.comment {
            width: 100%;
        }

        &.datepicker,
        &.timepicker {
            align-items: center;
            display: flex;
            justify-content: space-between;
        }

        &.datepicker .control,
        &.timepicker .control {
            flex: none;
            width: 60%;
        }

        &.datepicker .control .ui-datepicker-trigger {
            margin-left: 7px;
        }

        .label {
            display: block;
            margin: 12px 0;
        }
    }

    .amcheckout-delivery-date .clearer {
        clear: both;
    }

    .amcheckout-delivery-date .field._required > .label:after {
        color: @checkout-delivery-date-field-required__color;
        content: '*';
        font-size: 1.2rem;
        margin: 0 0 0 5px;
    }

    .page-main .block.block-order-details .delivery {
        & {
            float: right;
            font-weight: 600;
        }

        .delivery-field {
            float: left;
            margin-left: 12px;
        }
    }
}

//
//  Tablet
//  ---------------------------------------------

.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
    .checkout-index-index .opc-wrapper.am-opc-wrapper .amcheckout-delivery-date .field {
        & {
            display: block;
            width: 50%;
        }

        &:nth-child(2n) {
            padding-left: 7px;
        }

        &.datepicker .control,
        &.timepicker .control,
        &.comment {
            width: 100%;
        }
    }
}
