.smart-address-locate-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.smart-address-locate-btn[disabled] {
    opacity: 0.65;
    cursor: progress;
}

.smart-address-locate-status.text-danger {
    color: #dc3545 !important;
}

.smart-address-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    max-height: 220px;
    overflow-y: auto;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;
    background: #fff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    margin-top: 2px;
}

.smart-address-suggestions .list-group-item {
    cursor: pointer;
    text-align: start;
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.smart-address-suggestions .list-group-item:last-child {
    border-bottom: none;
}

.smart-address-suggestions .list-group-item:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

/*
 * Pre-existing bug in the ecommerce plugin's own checkout CSS (front-theme.scss), not something
 * this plugin introduced: its floating-label rules pin the label with a physical `left: 12px` /
 * `left: 16px` instead of an RTL-aware property, so on this RTL site the label always sits at the
 * true left edge regardless of text direction. That's invisible for short values (name, phone,
 * city...) but a long Arabic address reaches all the way to that spot and collides with it. This
 * can't be fixed by editing the ecommerce plugin directly, so it's corrected here instead — these
 * selectors match body[dir='rtl'] scoping already used by the plugin's own RTL stylesheet
 * (front-theme-rtl.scss) and are more specific than the original rules, so they win regardless of
 * CSS load order.
 */
body[dir='rtl'] .form-input-wrapper label {
    left: auto;
    right: 16px;
}

body[dir='rtl'] .form-input-wrapper .form-control:focus + label,
body[dir='rtl'] .form-input-wrapper .form-control:not(:placeholder-shown) + label,
body[dir='rtl'] .form-input-wrapper .form-control.has-value + label {
    left: auto;
    right: 12px;
}