#kitchen-configurator{
max-width:1000px;
margin:auto;
}

.kitchen-colors{
    margin-bottom:15px;
    border: 1px solid #dbdbdb;
    padding: 15px;
    border-radius: 10px;
    margin-right: 15px;
}

.kitchen-scene{
position:relative;
}

#kitchen-bg{
width:100%;
display:block;
}

/* =========================
   Слоты
========================= */

/* оставляем один slot */
.slot{
    position:absolute;
    cursor:pointer;
    overflow:hidden;
    transition:all .2s ease;
    z-index: 3;
}

/* hover самого слота */



.slot::after{
    content:"+";

    position:absolute;
    top:50%;
    left:50%;

    transform:translate(-50%,-50%) rotate(0deg);

    width:30px;
    height:30px;
    border-radius:50%;

    background:var(--accent-blue);
    color:white;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:20px;
    line-height:1;

    opacity:0;
    transition:.2s;
    z-index:999;
}

.appliance-layer {
    position: absolute;
    z-index: 1;
    pointer-events: none;
    object-fit: contain;
}

/* показываем только для пустых при hover сцены */
.kitchen-scene:hover .slot::after{
    opacity:1;
}

/* hover по пустому слоту */
.slot.empty:hover::after{
    background:var(--badge-blue-dark);
}

.slot.filled::after{
    transform:translate(-50%,-50%) rotate(45deg);
}

/* иконка техники */

.appliance-icon{
width:70%;
height:70%;
object-fit:contain;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%) rotate(0deg);
transition: .2s;
}

/* название модели */

.appliance-name{
position:absolute;
bottom:-20px;
left:0;
width:100%;
text-align:center;
font-size:12px;
color:white;
}

/* координаты */

.oven {
    left: 261px;
    top: 367px;
    width: 107px;
    height: 107px;
    z-index: 4;
}

.hob{
    width: 140px;
    height: 40px;
    left: 245px;
    top: 320px;
}

.hood{
    width: 130px;
    height: 130px;
    left: 250px;
    top: 110px;
    z-index: 9;
}

.microwave{
    width: 110px;
    height: 110px;
    left: 470px;
    top: 260px;
}

.kettle{
    width: 90px;
    height: 90px;
    left: 170px;
    top: 252px;
}

.fridge{
    width: 100px;
    height: 320px;
    left: 796px;
    top: 170px;

}

.dishwasher{
    width: 103px;
    height: 145px;
    left: 582px;
    top: 337px;
}

/* popup */

#product-popup{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.7);
}

.popup-content{
background:white;
width:600px;
margin:100px auto;
padding:20px;
max-height:500px;
overflow:auto;
}

.product-item{
display:flex;
gap:10px;
padding:10px;
border-bottom:1px solid #ddd;
cursor:pointer;
}

.product-item img{
width:60px;
height:60px;
object-fit:cover;
}

.add-config{
margin-top:20px;
padding:10px 20px;
font-size:16px;
}

/* Preloader  */

#config-loader{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
inset: 0;
background:
        radial-gradient(circle at top,
        #ffffff,
        #f2f2f2);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:20px;
z-index:9999;
font-size:18px;
}



@keyframes spin{
0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}
}

.loader-sims {
    width: 340px;

    text-align: center;

    animation:
        loaderFade .5s ease;
}

.loader-title {
    margin-top: 25px;

    font-size: 22px;
    font-weight: 600;

    color: #111;
}

.loader-progress {
    width: 100%;
    height: 10px;

    background: #ddd;

    border-radius: 999px;

    overflow: hidden;

    margin-top: 30px;

    position: relative;
}

.loader-progress-bar {
    height: 100%;
    width: 0%;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            #00B3E3,
            #C9F5FE
        );

    transition: width .35s ease;
}

.loader-progress-bar::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            120deg,
            transparent,
            rgba(255,255,255,.5),
            transparent
        );

    animation:
        shimmer 2s linear infinite;
}

.loader-percent {
    margin-top: 12px;

    font-size: 15px;

    color: #555;
}

.loader-tip {
    margin-top: 28px;

    font-size: 14px;

    color: #666;

    min-height: 45px;

    line-height: 1.5;

    opacity: 0;

    transition: opacity .35s ease;
}

.loader-tip.visible {
    opacity: 1;
}

@keyframes shimmer {

    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(300%);
    }
}

@keyframes loaderFade {

    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* табы */

.tabs{
display:flex;
gap:10px;
margin-bottom:10px;
}

.tab{
	border-radius: 18px;
    padding: 10px 20px;
	background:var(--accent-cyan-dark);
	cursor:pointer;
	font-size: 10pt;
	text-align: center;
}

.tab.active{
background:var(--accent-blue);
color:white;
	border-radius: 18px;
    padding: 10px 20px;

}

#category-tabs {
    display: grid!important;
    grid-template-columns: repeat(3, 1fr);
	margin-bottom: 10px;
	gap: 8px;
}

#config-loader{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:white;
display:flex;
align-items:center;
justify-content:center;
font-size:22px;
z-index:9999;
}


/* popup */

#product-popup{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
align-items:center;
justify-content:center;
z-index:999;
}

.popup-content{
background:white;
width:700px;
max-height:80vh;
overflow:auto;
padding:20px;
position:relative;
}

.popup-header{
display:flex;
justify-content:space-between;
align-items:center;
}

.popup-close{
cursor:pointer;
font-size:22px;
}

#product-search{
width:100%;
padding:8px;
margin:10px 0;
border-radius: 18px;
}



/* подпись */



#config-panel{
width:400px;
background:#fff;
border:1px solid #ddd;
padding:15px;
z-index:500;
}

#config-panel h3{
margin-top:0;
}

.config-item{
border-bottom:1px solid #eee;
padding:6px 0;
font-size:14px;
}

.config-item a{
text-decoration:none;
color:#333;
}

.config-item a:hover{
text-decoration:underline;
}

.config-remove{
float:right;
cursor:pointer;
color:red;
transition: .3s;
}

.config-remove:hover{
    transform: rotate(90deg);
    cursor: pointer;
}

.config-total{
margin-top:10px;
font-size:16px;
}

.config-actions{
margin-top:10px;
display:flex;
flex-direction:column;
gap:6px;
}

.config-actions button{
	cursor: pointer;
    width: 100%;
    background: var(--accent-blue);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    border-radius: 18px;
    border: none;
    text-transform: uppercase;
    padding: 10px 20px;
    transition: all .3s;
}

.config-actions button:hover {
	background: var(--accent-cyan-dark);
	color: var(--badge-blue-dark);
}

.row-soc {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 6px;
}

.row-soc button {
	background: var(--accent-cyan-dark);
	border: 1px solid var(--accent-blue);
}

.row-soc button:hover {
	background: var(--white);
}

/* чайники */
.appliance-layer.kettle.cat-chajniki {
    width: 60px;
    height: 60px;
    left: 170px;
    top: 282px;
}


.appliance-layer.kettle.cat-grili {
    width: 90px;
    height: 90px;
    left: 170px;
    top: 252px;
}

.appliance-layer.kettle.cat-kofevarki {
    width: 80px;
    height: 80px;
    left: 170px;
    top: 262px;
}

.appliance-layer.kettle.cat-kofejnye-stanczii {
    width: 90px;
    height: 90px;
    left: 170px;
    top: 252px;
}

.appliance-layer.kettle.cat-kofemashiny-malaya-bytovaya-tehnika {
    width: 80px;
    height: 80px;
    left: 170px;
    top: 262px;
}

.appliance-layer.kettle.cat-kofemolki {
    width: 50px;
    height: 50px;
    left: 170px;
    top: 294px;
}

.appliance-layer.kettle.cat-kuhonnye-kombajny {
    width: 90px;
    height: 90px;
    left: 170px;
    top: 252px;
}

.appliance-layer.kettle.cat-kuhonnye-mashiny {
    width: 90px;
    height: 90px;
    left: 170px;
    top: 252px;
}


.appliance-layer.kettle.cat-myasorubki {
    width: 90px;
    height: 90px;
    left: 170px;
    top: 258px;
}

.appliance-layer.kettle.cat-nastolnye-blendery {
    width: 90px;
    height: 90px;
    left: 170px;
    top: 252px;
}

.appliance-layer.dishwasher.cat-posudomoechnye-mashiny {
	width: 150px;
    height: 150px;
    left: 557px;
    top: 347px;
}

.appliance-layer.dishwasher.dishwasher-45 {
    left: 582px;
    width: 75px;
    height: 145px;
    top: 330px;
}

.appliance-layer.microwave.cat-mikrovolnovye-pechi{
    width: 130px;
    height: 112px;
    left: 28px;
    top: 147px;
}


/**/

.appliance-layer.dishwasher.sku-4607934313747 {
    top: 350px;
    width: 155px;
    height: 155px;
}

.appliance-layer.dishwasher.sku-4607934314041{
    width: 145px;
    left: 546px;
    top: 345px;
}

.appliance-layer.dishwasher.sku-4607934310692 {
    width: 145px;
    height: 145px;
    left: 547px;
    top: 360px;
}

.appliance-layer.fridge.cat-holodilniki {
    width: 190px;
    height: 400px;
    left: 790px;
    top: 135px;
}

.appliance-layer.dishwasher.sku-4607934311033, .appliance-layer.dishwasher.sku-4607934311026, .appliance-layer.dishwasher.sku-4607934312153, .appliance-layer.dishwasher.sku-4607934312146, .appliance-layer.dishwasher.sku-4620766485581, .appliance-layer.dishwasher.sku-4620766486878, .appliance-layer.dishwasher.sku-4607934311002, .appliance-layer.dishwasher.sku-4607934311019{
    width: 100px;
    height: 100px;
    left: 68px;
    top: 378px;
}

.appliance-layer.oven.sku-4620766489329 {
    width: 162px;
    height: 110px;
    left: 282px;
    top: 349px;
}

.appliance-layer.oven.sku-4607934313709,
.appliance-layer.oven.sku-4607934314959,
.appliance-layer.oven.sku-4620766489558,
.appliance-layer.oven.sku-4607934310975,
.appliance-layer.oven.sku-4620766489541,
.appliance-layer.oven.sku-4607934310968,
.appliance-layer.oven.sku-4607934310029 {
    left: 38px;
    top: 225px;
    width: 109px;
    height: 109px;
}

.appliance-layer.fridge.sku-4607934311996,
.appliance-layer.fridge.sku-4607934311941 {
    width: 190px;
    height: 400px;
    left: 780px;
    top: 135px;
}

.appliance-layer.fridge.sku-4607934313839,
.appliance-layer.fridge.sku-4607934313556,
.appliance-layer.fridge.sku-4607934313488,
.appliance-layer.fridge.sku-4620766488926,
.appliance-layer.fridge.sku-4620766488919,
.appliance-layer.fridge.sku-4620766488933,
.appliance-layer.fridge.sku-4620766489787,
.appliance-layer.fridge.sku-4607934310999,
.appliance-layer.fridge.sku-4607934310982 {
    width: 170px;
    height: 400px;
    left: 797px;
    top: 135px;
}

.appliance-layer.fridge.sku-4607934312023,
.appliance-layer.fridge.sku-4607934311323,
.appliance-layer.fridge.sku-4607934311347,
.appliance-layer.fridge.sku-4607934311439,
.appliance-layer.fridge.sku-4607934311422,
.appliance-layer.fridge.sku-4607934311415,
.appliance-layer.fridge.sku-4607934311392,
.appliance-layer.fridge.sku-4607934310135,
.appliance-layer.fridge.sku-4607934310142,
.appliance-layer.fridge.sku-4620766489718,
.appliance-layer.fridge.sku-4620766489756,
.appliance-layer.fridge.sku-4620766489749,
.appliance-layer.fridge.sku-4620766489732,
.appliance-layer.fridge.sku-4620766489183,
.appliance-layer.fridge.sku-4620766489350 {
    width: 125px;
    height: 400px;
    left: 788px;
    top: 135px;
}

.appliance-layer.fridge.sku-4607934311484,
.appliance-layer.fridge.sku-4607934311477 {
    width: 125px;
    height: 400px;
    left: 796px;
    top: 135px;
}

.appliance-layer.fridge.sku-4607934311446,
.appliance-layer.fridge.sku-4607934311453,
.appliance-layer.fridge.sku-4607934311460 {
    width: 115px;
    height: 400px;
    left: 796px;
    top: 135px;
}

.appliance-layer.fridge.sku-4607934311569,
.appliance-layer.fridge.sku-4607934311552,
.appliance-layer.fridge.sku-4607934311385,
.appliance-layer.fridge.sku-4607934311378,
.appliance-layer.fridge.sku-4607934311354,
.appliance-layer.fridge.sku-4607934311507,
.appliance-layer.fridge.sku-4607934311361 {
    width: 155px;
    height: 400px;
    left: 795px;
    top: 140px;
}

.appliance-layer.fridge.sku-4607934311415,
.appliance-layer.fridge.sku-4607934311439,
.appliance-layer.fridge.sku-4607934311422,
.appliance-layer.fridge.sku-4607934311408,
.appliance-layer.fridge.sku-4607934311392 {
    width: 115px;
    height: 400px;
    left: 788px;
    top: 147px;
}
.appliance-layer.fridge.sku-4607934310067,
.appliance-layer.fridge.sku-4607934310128,
.appliance-layer.fridge.sku-4607934310098,
.appliance-layer.fridge.sku-4607934310104 {
    width: 115px;
    height: 400px;
    left: 798px;
    top: 149px;
}

.appliance-layer.fridge.sku-4620766488261 {
    width: 170px;
    height: 400px;
    left: 797px;
    top: 145px;
}

.appliance-layer.fridge.sku-4627195740199,
.appliance-layer.fridge.sku-4627195740182 {
    top: 270px;
}

.appliance-layer.hood.sku-4607934310852 {
    width: 125px;
    left: 256px;
}

.k-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transition: opacity 0.3s ease;
    z-index: 2;
}

#kitchen-bg { z-index: 1; }
#layer-oven {
    z-index: 2;
}
#layer-top {
    z-index: 3;
    top: 114px;
    width: 645px;
    left: 150px;
    }
#layer-fridge {
    z-index:2;
    width: 140px;
    height: 399px;
    left: 772px;
    top: 111px;
}

#layer-dishwasher {
    z-index: 2;
    width: 160px;
    height: 165px;
    left: 577px;
    top: 352px;
}

#kitchen-configurator.oven-45 #layer-oven {
    width: 111px;
    height: 143px;
    left: 255px;
    top: 349px;
    z-index: 1;
}

#kitchen-configurator.oven-90 #layer-oven {
    width: 225px;
    height: 150px;
    left: 251px;
    top: 349px;
}

#kitchen-configurator.oven-60 #layer-oven {
    width: 223px;
    height: 143px;
    left: 251px;
    top: 349px;
    z-index: 1;
}

.appliance-layer.hood.hood-70-83 {
    left: 380px;
    width: 140px;
}

.appliance-layer.hood.hood-90 {
    left: 290px;
    width: 160px;
    height: 160px;
    top: 85px;
}

.kitchen-colors-flex {
    display: flex;
    gap: 12px;
    margin: 22px 0;
}

.kitchen-colors-flex:first-child {
    margin-bottom: 0px;
    gap: 0;
}

.kitchen-colors .btn-buy.active {
    background: #004258;
    color: #fff;
}

input#top-cabinets-checkbox, input#oven-column-checkbox {
    transition: all .3s;
}

input#top-cabinets-checkbox:hover, input#oven-column-checkbox:hover {
    transform: rotate(360deg);
    cursor: pointer;
}

#layer-microwave-bg {
    z-index: 1;
    width: 105px;
    height: 182px;
    left: 40px;
    top: 166px;
}

#layer-dishwasher-extra {
    z-index: 1;
    width: 108px;
    height: 144px;
    left: 579px;
    top: 350px;
}


/* колонна */
.appliance-layer.oven.oven-column {
    left: 38px;
    top: 238px;
    width: 109px;
    height: 109px;
}

/* 45 */

.hood-universal-45 {
    top: 242px;
    width: 80px;
    height: 80px;
    left: 275px;
}

/* 60 */

.hood-universal-60 {
    top: 235px;
    width: 100px;
    height: 100px;
    left: 265px;
}

/* 90 */

.appliance-layer.hood.hood-universal-90 {
    top: 228px;
    height: 94px;
    left: 295px;
    width: 130px;
}


.appliance-layer.hood.sku-4620766489404 {
    top: 120px;
}

.appliance-layer.hood.sku-4620766482214,
.appliance-layer.hood.sku-4620766482191 {
    width: 110px;
    height: 110px;
    left: 260px;
    top: 140px;
}

.appliance-layer.hood.sku-4620766487349,
.appliance-layer.hood.sku-4620766487356,
.appliance-layer.hood.sku-4620766487660 {
    width: 110px;
    height: 110px;
    left: 261px;
    top: 146px;
}

.appliance-layer.hood.sku-4620766487424 {
    top: 192px;
}

/* SMALL */

.appliance-layer.hob.hob-small {
    width: 100px;
    height: 10px;
    left: 265px;
    top: 335px;
    transform: perspective(10px) rotateX(10deg);
    object-fit: fill;;
}



/* MEDIUM */

.appliance-layer.hob.hob-medium {
    width: 100px;
    height: 10px;
    left: 265px;
    top: 335px;
    transform: perspective(10px) rotateX(10deg);
    object-fit: fill;;
}

/* LARGE */

.appliance-layer.hob.hob-large {
    width: 150px;
    height: 10px;
    left: 288px;
    top: 335px;
    transform: perspective(10px) rotateX(10deg);
    object-fit: fill;;
}

.appliance-layer.hood.hood-slideout {  }
.appliance-layer.hood.hood-slideout-45 {
    width: 123px;
    height: 123px;
    left: 255px;
    top: 184px;
    z-index: 9;
}
.appliance-layer.hood.hood-slideout-60 {
    width: 133px;
    height: 133px;
    left: 250px;
    top: 179px;
    z-index: 9;
}
.appliance-layer.hood.hood-slideout-90 {
    width: 195px;
    height: 195px;
    left: 265px;
    top: 149px;
    z-index: 9;
}


/* Block mobile */

.mobile-warning {
    position: fixed;
    inset: 0;
    z-index: 999999;
    width: 100vw;
    height: 100dvh;

    display: flex;
    justify-content: center;
    align-items: center;

    padding: 24px;

    background:
        linear-gradient(
            180deg,
            #111 0%,
            #1b1b1b 100%
        );

    overflow: hidden;
}

.mobile-warning-content {

    width: 100%;
    max-width: 420px;

    padding: 32px 24px;

    border-radius: 24px;

    background: rgba(255,255,255,0.04);

    backdrop-filter: blur(10px);

    text-align: center;

    box-sizing: border-box;
}

.mobile-warning-content h1 {

    margin: 0 0 16px;

    font-size: clamp(28px, 7vw, 42px);
    line-height: 1.1;

    color: #fff;
}

.mobile-warning-content p {

    margin: 0;

    font-size: clamp(15px, 4vw, 18px);
    line-height: 1.5;

    color: rgba(255,255,255,0.75);
}