/* The "Make an offer" modal overlay — not part of the static reference (it
   has no offer feature at all), originally styled with Tailwind utility
   classes that no longer apply once the storefront stopped loading Tailwind's
   compiled CSS. Plain CSS backing the same positioning/backdrop. */

.st-mkoffer-overlay {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.5);
    padding: 0.521vw;
}

.st-mkoffer-modal {
    position: relative;
    width: 100%;
    background: #fff;
    border-radius: 8px;
    box-shadow:
        0 20px 25px -5px rgba(0, 0, 0, 0.1),
        0 8px 10px -6px rgba(0, 0, 0, 0.1);
    padding: 24px;
}

.st-mkoffer-close {
    position: absolute;
    top: 0.521vw;
    right: 0.521vw;
    font-size: 2.2vw;
    font-weight: 700;
    line-height: 1;
    color: var(--c-ink);
    background: none;
    border: 0;
    cursor: pointer;
}

.st-mkoffer-close:hover {
    color: var(--c-mute);
}

.st-mkoffer-title {
    font-family: var(--ff);
    font-size: 1.25vw;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.417vw;
}

.st-mkoffer-current-price {
    font-family: var(--ff);
    font-size: 1.354vw;
    font-weight: 800;
    color: var(--c-green);
    margin: 0 0 0.417vw;
}

.st-mkoffer-form {
    display: flex;
    flex-direction: column;
    gap: 0.313vw;
}

.st-mkoffer-form label {
    display: block;
    font-family: var(--ff);
    font-size: 0.938vw;
    font-weight: 700;
    color: var(--c-ink);
}

.st-mkoffer-form input,
.st-mkoffer-form select {
    margin-top: 0.208vw;
    width: 100%;
    border: 1px solid var(--c-line);
    border-radius: 0.208vw;
    padding: 0.417vw 0.625vw;
    font-family: var(--ff);
    font-size: 0.729vw;
    font-weight: 400;
    line-height: 1.4;
    color: var(--c-ink);
    box-sizing: border-box;
}

.st-mkoffer-price-row {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 0.521vw;
    margin-top: 0.208vw;
}

.st-mkoffer-price-wrap {
    position: relative;
    display: block;
    flex: 1 1 0;
    width: auto;
    height: 2.3vw;
    box-sizing: border-box;
    min-width: 6.5vw;
}

.st-mkoffer-price-row .st-mkoffer-submit {
    flex: 1 1 0;
    width: auto;
    height: 2.3vw;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.st-mkoffer-price-wrap .st-mkoffer-currency {
    position: absolute;
    top: 50%;
    left: 0.625vw;
    transform: translateY(-50%);
    font-family: var(--ff);
    font-size: 1.042vw;
    font-weight: 600;
    line-height: 1;
    color: var(--c-mute);
    pointer-events: none;
}

.st-mkoffer-form input.st-mkoffer-price-input {
    margin-top: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding-left: 1.8vw;
    font-size: 1.042vw;
    font-weight: 600;
    line-height: 1;
}

.st-mkoffer-form input:focus,
.st-mkoffer-form select:focus {
    outline: none;
    border-color: #94a3b8;
}

.st-mkoffer-form input[type="number"] {
    -moz-appearance: textfield;
}

.st-mkoffer-form input[type="number"]::-webkit-inner-spin-button,
.st-mkoffer-form input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.st-mkoffer-remember {
    display: flex;
    align-items: center;
    gap: 0.417vw;
}

/* .st-mkoffer-form label (bold) outranks the bare class, so the checkbox
   label rendered bold like the field captions above it */
.st-mkoffer-form .st-mkoffer-remember {
    display: flex;
    font-weight: 400;
}

.st-mkoffer-remember input {
    width: auto;
    margin-top: 0;
}

.st-mkoffer-note {
    font-family: var(--ff);
    font-size: 0.729vw;
    line-height: 1.4;
    color: var(--c-ink);
}

.st-mkoffer-note a {
    color: var(--c-green);
    font-weight: 700;
    text-decoration: underline;
}

.st-mkoffer-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.521vw;
}

.st-mkoffer-submit,
.st-mkoffer-success button {
    width: 100%;
    background: #3f9c8f;
    color: #fff;
    border: 0;
    border-radius: 0.195vw;
    padding: 0.391vw 0.521vw;
    text-align: center;
    font-family: var(--ff);
    font-size: 1.042vw;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
}

.st-mkoffer-submit:hover,
.st-mkoffer-success button:hover {
    background: #358579;
}

.st-mkoffer-success {
    text-align: center;
    color: var(--c-mute);
    display: flex;
    flex-direction: column;
    gap: 0.521vw;
}

/* Phone canvas. Everything above is sized against the 1920 design;
   these are the same values against 440, the width the theme itself
   uses below 767px. Only sizes are restated — layout, colour and
   everything else carries down from the rules above. */
@media (max-width: 767px) {
    .st-mkoffer-overlay {
        padding: 2.273vw;
    }

    .st-mkoffer-modal {
        border-radius: 1.705vw;
        padding: 4.545vw;
    }

    /* a proper thumb-sized target — at 3.409vw the × was ~13px */
    .st-mkoffer-close {
        top: 1.136vw;
        right: 1.136vw;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 9.091vw;
        height: 9.091vw;
        font-size: 7.273vw;
    }

    .st-mkoffer-title {
        font-size: 5.455vw;
        margin: 0 0 1.818vw;
    }

    .st-mkoffer-current-price {
        font-size: 5.909vw;
        margin: 0 0 1.818vw;
    }

    .st-mkoffer-form {
        gap: 1.364vw;
    }

    .st-mkoffer-form label {
        font-size: 4.091vw;
    }

    /* 16px floor: iOS Safari zooms the page into any field below that */
    .st-mkoffer-form input,
    .st-mkoffer-form select {
        margin-top: 0.909vw;
        border-radius: 0.909vw;
        padding: 1.818vw 2.727vw;
        font-size: max(16px, 3.182vw);
    }

    /* the notes had no phone size, so they kept the desktop 0.729vw (~3px) */
    .st-mkoffer-note {
        font-size: 3.182vw;
    }

    .st-mkoffer-form > .st-mkoffer-note:first-child {
        margin-bottom: 1.364vw;
    }

    .st-mkoffer-form > .st-mkoffer-note:last-child {
        margin-top: 1.364vw;
        text-align: center;
    }

    .st-mkoffer-remember {
        gap: 1.818vw;
    }

    .st-mkoffer-remember input {
        width: 4.545vw;
        height: 4.545vw;
    }

    .st-mkoffer-price-row {
        gap: 2.273vw;
        margin-top: 0.909vw;
    }

    .st-mkoffer-price-wrap,
    .st-mkoffer-price-row .st-mkoffer-submit {
        height: 10vw;
    }

    .st-mkoffer-price-wrap {
        min-width: 28vw;
    }

    .st-mkoffer-price-wrap .st-mkoffer-currency {
        left: 2.727vw;
        font-size: 4.545vw;
    }

    .st-mkoffer-form input.st-mkoffer-price-input {
        margin-top: 0;
        width: 100%;
        padding-left: 8vw;
        font-size: max(16px, 4.545vw);
    }

    .st-mkoffer-row {
        gap: 2.273vw;
    }

    .st-mkoffer-submit,
    .st-mkoffer-success button {
        border-radius: 0.852vw;
        padding: 2.727vw 2.273vw;
        font-size: 4.545vw;
    }

    .st-mkoffer-success {
        gap: 2.273vw;
    }
}