:root{
    --mv2-stroke:#e9e9e9;
    --mv2-muted:#7a7a7a;
    --mv2-text:#111;
    --mv2-accent:#f6c35e;
    --mv2-accent2:#f1b544;
    --mv2-radius:16px;
}

/* локальный сброс чтобы ваши глобальные стили не ломали */
.metal-v2, .metal-v2 * { box-sizing: border-box; }
.metal-v2 button, .metal-v2 input { font: inherit; }

.metal-v2{
    background:#fff;
    padding:28px 34px;
    color:var(--mv2-text);
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

/* legacy: прячем, но оставляем в DOM */
.metal-v2__legacy{
    position:absolute !important;
    left:-99999px !important;
    top:auto !important;
    width:1px !important;
    height:1px !important;
    overflow:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
}

/* TOP */
.metal-v2__top{ display:flex; gap:14px; align-items:flex-start; margin-bottom:18px; }
.metal-v2__stepno{
    width:44px; height:44px; border-radius:999px;
    border:2px solid var(--mv2-accent);
    display:flex; align-items:center; justify-content:center;
    color:var(--mv2-accent2); font-weight:900;
}
.metal-v2__topcol{ display:flex; flex-direction:column; gap:10px; padding-top: 10px }
.metal-v2__title{ font-size:22px; font-weight:900; line-height:1.1; }
.metal-v2__pill{
    width:fit-content;
    background:#fff;
    border:1px solid #dcdcdc;
    border-radius:999px;
    padding:6px 14px;
    font-size:14px;
    display:flex; align-items:center; gap:10px;
    cursor:pointer;
}

/* GRID */
.metal-v2__grid{
    display:grid;
    grid-template-columns: 560px 1fr;
    gap:20px;
    align-items:start;
}

.metal-v2__card{
    background:#fff;
    border:1px solid var(--mv2-stroke);
    border-radius:var(--mv2-radius);
    padding:22px;
    box-shadow: 0 0 8px -2px rgba(0, 0, 0, 0.25);
}
.metal-v2__card--wide{ padding:22px 24px; }

.metal-v2__cardtitle{
    font-size:28px;
    font-weight:900;
    display:flex; align-items:center; gap:10px;
    line-height:1.1;
}
.metal-v2__info{
    width:22px; height:22px; border-radius:999px;
    border:1px solid #f0d39a;
    color:#b67c12;
    display:inline-flex; align-items:center; justify-content:center;
    font-size:13px;
}
.metal-v2__cardsub{
    margin-top:6px;
    margin-bottom:12px;
    /*color:var(--mv2-muted);*/
    font-size:16px;
}

.metal-v2__segrow{ display:flex; gap:14px; }
.metal-v2__segrow--top{ margin-top:6px; }

.metal-v2__segbtn{
    height:56px;
    border-radius:14px;
    border:1px solid #e6e6e6;
    background:#fff;
    font-weight:600 !important;
    padding:0 58px;
    cursor:pointer;
    min-width:0;
}
.metal-v2__segbtn--active{
    background:var(--mv2-accent);
    border-color:var(--mv2-accent);
}

/* поля t/kg */
.metal-v2__segfield{
    flex:0 0 100px;
    height:56px;
    border-radius:14px;
    border:1px solid var(--mv2-accent);
    background:#fff;
    display:flex; align-items:center; justify-content:center;
    gap:10px;
    padding:0 14px;
}
.metal-v2__seginput{
    width:60px;
    border:0;
    outline:none;
    font-weight:900;
    font-size:22px;
    text-align:center;
    background:transparent;
}
.metal-v2__segunit{ font-weight:900; font-size:18px; }

.metal-v2__qtitle{
    margin-top:26px;
    font-size:24px;
    font-weight:900;
    line-height:1.15;
    margin-bottom: 10px;
}

/* upload */
.metal-v2__uploadrow{
    margin-top:14px;
    display:flex;
    align-items:flex-start;
    gap:18px;
}

/* кнопка как на макете */
.metal-v2__uploadbtn{
    position:relative;
    height:56px;
    padding:0 22px;
    border-radius:14px;
    background: var(--mv2-accent);
    border:1px solid var(--mv2-accent);
    font-weight:900;
    display:inline-flex;
    align-items:center;
    gap:12px;
    cursor:pointer;
    user-select:none;
    min-width: 240px;
    justify-content:center;
}
.metal-v2__uploadic{
    width:28px;
    height:28px;
    border-radius:999px;
    background: rgba(255,255,255,.55);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
}

/* legacy clear (общий крестик) */
#clear_select_file{ display:none; }
/*#clear_select_file.active{ display:inline-flex !important; }*/
.metal-v2__clear{
    /*position:absolute;*/
    /*right:8px; top:8px;*/
    /*width:26px; height:26px;*/
    /*border-radius:999px;*/
    /*border:0;*/
    /*background:rgba(0,0,0,.12);*/
    /*cursor:pointer;*/
    display: none !important;
}

/* сетка 2x2 справа */
.metal-v2__uploadgrid{
    margin-left:auto;
    display:grid;
    grid-template-columns: repeat(2, 70px);
    gap:14px;
    margin-top: 20px;
}

/* слот: серый фон как на макете */
.metal-v2__slot{
    width:70px;
    height:70px;
    border-radius:14px;
    background:#f3f3f3;
    border:1px solid #eee;
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
}

/* иконка плейсхолдера внутри */
.metal-v2__ph{
    width:22px;
    height:22px;
    opacity:.55;
    background: center/contain no-repeat url("/order/img/PhotoGroup.svg");
}

.metal-v2__pill-ic{
    width:25px;
    height:25px;
    /*opacity:.55;*/
    background: center/contain no-repeat url("/order/img/metal1.jpg");
}

/* если в слоте есть фото — прячем иконку */
.metal-v2__slot.has-photo .metal-v2__ph{
    display:none;
}

/* кнопка удаления конкретной фотки (показывается только на has-photo) */
#mv2_photo_grid .mv2-remove-photo{
    position:absolute;
    top:6px;
    right:6px;
    width:22px;
    height:22px;
    border-radius:999px;
    border:0;
    background:rgba(0,0,0,.55);
    color:#fff;
    cursor:pointer;
    display:none;
    align-items:center;
    justify-content:center;
    line-height:1;
    font-weight:900;
    z-index:5;
}
#mv2_photo_grid .metal-v2__slot.has-photo .mv2-remove-photo{
    display:inline-flex;
}

.metal-v2__notes{ margin-top:12px; color:var(--mv2-muted); font-size:14px; }

/* RIGHT */
.metal-v2__wide{ display:grid; grid-template-columns: 260px 1fr; gap:40px; }
.metal-v2__widetitle{ font-size:28px; font-weight:900; margin-bottom:27px; }
.metal-v2__stack{ display:flex; flex-direction:column; gap:14px; width:260px; }

.metal-v2__widebtn{
    height:56px;
    border-radius:14px;
    border:1px solid #e6e6e6;
    background:#fff;
    font-weight:600 !important;
    cursor:pointer;
}
.metal-v2__widebtn--active{ background:var(--mv2-accent); border-color:var(--mv2-accent); }
.metal-v2__widebtn:disabled{ opacity:.45; cursor:not-allowed; }

.metal-v2__desc{
    color:var(--mv2-muted);
    font-size:15px;
    line-height:1.35;
    margin-bottom:14px;
    max-width:620px;
}

.metal-v2__addrrow{ position:relative; display:flex; gap:14px; align-items:center; }
.metal-v2__addrinput{
    flex:1 1 auto;
    height:56px;
    border-radius:14px;
    border:2px solid var(--mv2-accent);
    padding:0 18px;
    font-weight:800;
    font-size:20px;
    outline:none;
}
.metal-v2__gps{
    flex:0 0 56px;
    width:56px; height:56px;
    border-radius:14px;
    border:0;
    background:var(--mv2-accent);
    font-weight:900;
    cursor:pointer;
}

/* dropdown адресов — строго под input */
.metal-v2__addrlist{
    position:absolute !important;
    left:0 !important;
    top:66px !important;
}

/* INFO + BOTTOM */
.metal-v2__infobar{
    margin-top:22px;
    background:#f1f1f1;
    border-radius:14px;
    padding:16px 18px;
    display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.metal-v2__infotext{ color:#4d4d4d; font-size:16px; }
.metal-v2__faqbtn{
    height:44px;
    padding:0 18px;
    border-radius:12px;
    border:1px solid var(--mv2-accent);
    background:#fff;
    font-weight:600 !important;
    cursor:pointer;
}

.metal-v2__bottom{
    margin-top:22px;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:18px;
}
.metal-v2__prevlink{
    width:74px; height:56px;
    border-radius:14px;
    background:#eee;
    border:1px solid #e6e6e6;
    display:flex; align-items:center; justify-content:center;
    text-decoration:none;
    color:#777;
    font-size:28px;
    font-weight:900;
}
.metal-v2__nextbtn{
    /*min-width:360px;*/
    height:56px;
    border-radius:14px;
    border:1px solid var(--mv2-accent);
    background:var(--mv2-accent);
    font-weight:900;
    cursor:pointer;
}
.metal-v2__nextbtn:disabled{ opacity:.55; cursor:not-allowed; }
/*.metal-v2__arr{ margin-left:14px; }*/
.metal-v2__hidden{ display:none !important; }

.sm-reward-title{
    font-size:22px;
    font-weight:900;
    line-height:1.1;
    margin-bottom:18px;
}

.sm-reward-row{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:24px;
    padding:10px 0;
}

.sm-reward-left{
    font-size:18px;
    color:#111;
}

.sm-reward-right{
    font-size:18px;
    font-weight:900;
    color:#111;
    white-space:nowrap;
}

.sm-note{
    margin-top:18px;
    background:#f1f1f1;
    border-radius:18px;
    padding:18px 20px;
    display:flex;
    gap:14px;
    align-items:flex-start;
}

.sm-note__icon{
    width:28px;
    height:28px;
    border-radius:999px;
    border:2px solid #111;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
    line-height:1;
    flex:0 0 28px;
    margin-top:2px;
}

.sm-note__text{
    color:#111;
    font-size:16px;
    line-height:1.35;
}

.sm-note__link{
    color:#d93025;
    font-weight:900;
    text-decoration:underline;
}

.sm-divider{ height:1px; background:#e9e9e9; margin:18px 0; }

.scrap-metal-summary .order__desc-summary__content{
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.sm-summary-row{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
}

.sm-summary-row-last {
    padding-bottom: 20px;
    border-bottom:1px solid #D3D3D3;
    margin-bottom: 20px;
}

.sm-summary-label{
    font-size: 18px;
    color: #111;
}

.sm-summary-value{
    font-size: 18px;
    font-weight: 700;
    text-align: right;
    max-width: 55%;
}

.scrap-metal-summary{
    display: none;
}


/* по умолчанию скрыто во всех карточках */
.offer_option_wrap .mv2-offer-disclaimer{ display:none; }

/* показываем только в выбранной карточке */
.offer_option_wrap.chosen .mv2-offer-disclaimer{ display:block; }

.order__three-select__offers {
    height: fit-content;
    max-height: 650px;
    min-height: 400px;
}

.offer_option_wrap .offer_price{
    position: relative;
}

.offer_option_wrap .mv2-offer-tons{
    position:absolute;
    right:0;
    top:0;
    font-weight:800;
    font-size: 16px;
    line-height:1;
    white-space:nowrap;
}

.order__four-summary__info--table .order__four-summary__row{
    display:grid;
    grid-template-columns: 240px 1fr;
    gap: 24px;
    padding: 16px 0;
    border-bottom: 1px solid #e8e8e8;
}

.order__four-summary__info--table .order__four-summary__label{
    color:#111;
    opacity:.9;
    font-size:18px;
}

.order__four-summary__info--table .order__four-summary__value{
    text-align:right;
    font-weight:600;
    font-size:20px;
}

#sm4_receiver_address{
    font-weight:400;
    font-size:18px;
    opacity:.9;
}

/* Step 4 summary rows styling like макет */
.order__four-summary__info .sm4-row{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:24px;
    /*padding:14px 0;*/
    padding-bottom: 10px;
    border-bottom:1px solid #dcdcdc;
}

.order__four-summary__info .sm4-row .order__four-summary__name{
    margin:0;
    font-size:16px;
    color:#222;
    flex:0 0 auto;
}

.order__four-summary__info .sm4-row .order__four-summary__value{
    margin:0;
    font-size:16px;
    color:#222;
    font-weight:500;
    text-align:right;
    max-width:55%;
    line-height:1.25;
}

/* receiver value (2 строки) */
#sm4_receiver .sm4-sub{
    font-weight:500;
}









@media screen and (max-width: 1230px) {
    .metal-v2__grid {
        grid-template-columns: auto;
    }
}

/* ===================== MOBILE FIX metal-v2 ===================== */
/*   На мобилке делаем normal flow. *!*/
/*@media (max-width: 768px){*/
/*    .order__wrapper-step--metal.metal-v2{*/
/*        position: relative !important;*/
/*        opacity: 1 !important;*/
/*        pointer-events: auto !important;*/
/*    }*/
/*}*/

/* Общие адаптивы */
@media (max-width: 1024px){
    .metal-v2{
        padding: 20px 16px;
    }

    /* сетка в 1 колонку */
    .metal-v2__grid{
        grid-template-columns: 1fr;
        gap: 16px;
    }

    /* правая wide часть в колонку */
    .metal-v2__wide{
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .metal-v2__stack{
        width: 100%;
    }

    .metal-v2__widetitle{
        margin-bottom: 16px;
        font-size: 22px;
    }

    .metal-v2__cardtitle{
        font-size: 22px;
    }

    .metal-v2__qtitle{
        font-size: 20px;
    }

    .metal-v2__desc{
        font-size: 15px;
    }
}

/* Самые проблемные места — ряды с кнопками/инпутами */
@media (max-width: 768px){
    /* TOP */
    .metal-v2__top{
        gap: 12px;
    }
    .metal-v2__title{
        font-size: 18px;
    }
    .metal-v2__stepno{
        width: 38px;
        height: 38px;
    }

    /* row: кнопка + t/kg -> включаем перенос */
    .metal-v2__segrow{
        flex-wrap: wrap;
        gap: 10px;
    }

    /* кнопка "Металлолом" не должна быть гигантской */
    .metal-v2__segbtn{
        height: 50px;
        padding: 0 16px;
        flex: 1 1 160px;   /* на узких экранах уйдет на всю ширину */
        min-width: 0;
    }

    /* инпуты t/kg делаем резиновыми */
    .metal-v2__segfield{
        flex: 1 1 120px;
        height: 50px;
    }

    .metal-v2__seginput{
        width: 100%;
        font-size: 18px;
    }

    /* upload: в колонку */
    .metal-v2__uploadrow{
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }

    .metal-v2__uploadbtn{
        min-width: 0;
        width: 100%;
        height: 52px;
    }

    /* сетка фоток под кнопку, по ширине контейнера */
    .metal-v2__uploadgrid{
        margin-left: 0;
        margin-top: 0;
        grid-template-columns: repeat(4, 1fr);
        gap: 10px;
    }
    .metal-v2__slot{
        width: 100%;
        aspect-ratio: 1 / 1;
        height: auto;
    }

    /* address input */
    .metal-v2__addrrow{
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    .metal-v2__addrinput{
        height: 52px;
        font-size: 16px;
    }

    /* dropdown под инпутом — не вылезать за экран */
    .metal-v2__addrlist{
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        top: 58px !important;
    }

    /* инфобар в колонку */
    .metal-v2__infobar{
        flex-direction: column;
        align-items: stretch;
    }
    .metal-v2__faqbtn{
        width: 100%;
    }

    /* bottom кнопки */
    .metal-v2__bottom{
        justify-content: space-between;
        gap: 12px;
    }
    .metal-v2__prevlink{
        width: 60px;
        height: 52px;
    }
    .metal-v2__nextbtn{
        flex: 1 1 auto;
        height: 52px;
    }

    /* чтобы низ не упирался в safe-area (iPhone) */
    .metal-v2{
        padding-bottom: calc(18px + env(safe-area-inset-bottom));
    }
}

/* совсем узкие телефоны */
@media (max-width: 420px){
    .metal-v2__uploadgrid{
        grid-template-columns: repeat(2, 1fr);
    }
}