:root{
    --main-color: #c8241b;
    --dark-gray: #666666;
    --text-color: #3e3536;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #FFF;
}
::-moz-placeholder { /* Firefox 19+ */
    color: #FFF;

}
:-ms-input-placeholder { /* IE 10+ */
    color: #FFF;

}
:-moz-placeholder { /* Firefox 18- */
    color: #FFF;

}

body {
    font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 13px;
    line-height: 1.846;
    color: var(--text-color);
    background-color: #ffffff;
}

a {color:var(--main-color);}

.site-font-color{color:var(--main-color);}
.z-index-100{z-index:100;}
.btn{
    text-transform: uppercase;
    border: 1px solid transparent;
    -webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    border-radius: 25px;
    padding: 6px 16px;
}

.btn.btn-info{background-color: var(--main-color);color:#FFF;border-color: var(--main-color);}
.btn.btn-outline{color:#FFF;background-color: var(--main-color);border-color: var(--main-color);}
.btn.btn-zavgar{background-color: var(--main-color);color:#FFF;border-color: var(--main-color);}
.btn.btn-zavgar:hover,
.btn.btn-outline:hover {
    background: #fff;
    color: var(--main-color);
    border-color: var(--main-color);
}
.btn.btn-info:hover {
    background: #fff;
    color: var(--main-color);
    border-color: var(--main-color);
}

.alert.alert-up-arrow::before, .alert.alert-up-arrow::after{content: "";border: solid 10px transparent;position: absolute;}
.alert.alert-up-arrow::after {border-bottom-color: inherit;top: -20px;left: 15px;}



a:active, a:hover {color: var(--main-color);text-decoration: blink;}

.header .headerTop {background: #339664;border-bottom: 0 solid #f0f0ed;}
.header .headerTop a{color:#FFF;font-size:13px;}
.header .main-menu {background:url(../images/mydacha6.jpg) no-repeat center;background-attachment:cover;border-color: transparent;    background-size: cover;}
.header .main-menu .navbar .collapse .navbar-nav .nav-link{font-size:14px;color:#FFF;}
.header .main-menu .navbar .collapse .navbar-nav .nav-link.active{color:var(--main-color);}
.header .main-menu .navbar .collapse .navbar-nav .nav-link i{color:var(--main-color);}
.header .main-menu .navbar .collapse .navbar-nav .nav-link:hover {color: var(--main-color); text-decoration: underline}
/*.header .main-menu .navbar .collapse .navbar-nav .nav-item:first-child .nav-link:hover {background-color: #fff;}*/

.header .main-menu .navbar .collapse .navbar-nav .nav-item:first-child .nav-link.active{color:#FFF;}
.header .main-menu .dropdown-item{font-size:13px;padding: 0.25rem 0.5rem;}
.header .main-menu .dropdown-item.active,
.header .main-menu .dropdown-item:active,
.header .main-menu .dropdown-item:focus {
    background-color: transparent;
    color: var(--main-color);
    outline: none;
    box-shadow: none;
}
.catalog-dropdown-menu .dropdown-item,
.catalog-dropdown-menu-main .dropdown-item {
    color: #ffffff;
    background-color: transparent;
}
.catalog-dropdown-menu .dropdown-item:hover,
.catalog-dropdown-menu-main .dropdown-item:hover {
    background-color: transparent;
    color: var(--main-color) !important;
}
.catalog-dropdown-menu .dropdown-item.active,
.catalog-dropdown-menu .dropdown-item:active,
.catalog-dropdown-menu .dropdown-item:focus,
.catalog-dropdown-menu-main .dropdown-item.active,
.catalog-dropdown-menu-main .dropdown-item:active,
.catalog-dropdown-menu-main .dropdown-item:focus {
    background-color: transparent;
    color: var(--main-color) !important;
    outline: none;
    box-shadow: none;
}
.header .main-menu .navbar .collapse .navbar-nav .nav-item:first-child .nav-link{background-color:var(--main-color);border-radius: 25px;padding: 6px 16px;color:#FFF;}

.header .main-menu-second{background-color: var(--dark-gray);}

body > .header {background-attachment: scroll;background-color: #212121;width: 100%;position: relative;
    box-shadow: 0 3px 40px 0 rgba(0, 0, 0, 0.5);transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;}

.mobileLogoText {color: #FFF;display: inline-block;line-height: 12px;transition: all 0.2s;}

.mobileLogoText p {font-size: 11px;margin: 0px;line-height: 11px;padding-bottom: 5px;}
.mobileLogoText span {font-size: 20px;line-height: 14px;font-weight: 600;}
.mobileLogoText span i {top: 2px;}


.mainAboutBlock {width: 100%;position: relative;background:#FFF;}
.mainAboutBlock .menuBoxInner{background: #fff url("./images/tireback.png");background-repeat: no-repeat;background-position: right bottom;}
.mainAboutBlock .menuBoxInner .nav-item{color:#2e2d2d;font-weight:bold;}
.mainAboutBlock .menuBoxInner .nav-link{color:#666;font-weight:normal;padding: 0.2rem 0rem;}

.footerBottom{padding-top: 20px;padding-bottom: 20px;background: #222;color:#5f5f5f;font-size:12px;}
.footer-up-block{background: rgba(0, 0, 0, 0.8);}
.footer-up-block .menu {display: inline-block;margin: 0px;padding: 0px;}
.footer-up-block .menu li {width: 100%;display: inline-block;}
.footer-up-block .menu li.header {font-size: 18px;font-weight: bold;text-transform: uppercase;color: var(--main-color);margin-bottom: 13px;}
.footer-up-block .menu li a {width: 100%;display: inline-block;color: #FFF;font-size: 14px;margin-bottom: 11px;padding-bottom: 1px;}


.child-catalogs-box.nav .nav-item .nav-link{padding: 0rem 0.4rem;}

/** Кнопки разделов каталога **/
.catalog-section-button:hover {
    background: var(--main-color);
    color: #fff;
}
/** Кнопки разделов каталога **/

/** Основной раздел каталога **/
.catalog-section-title a {
    color: #000;
}
.catalog-section-title:hover a {
    color: var(--main-color);
}

.catalog-section-group {
    margin-bottom: 30px; /* Отступ после каждого основного раздела */
}
/** Основной раздел каталога **/

/** Подраздел каталога **/
.child-catalogs-box.nav {
    margin-bottom: 40px;
}
/** Подраздел каталога **/

/** Сортировка каталога */
.catalog-items-sort-block .btn-link {
    color: var(--dark-gray);
    font-weight: 500;
    text-decoration: none;
    padding: 4px 10px;
    border-radius: 4px;
    transition: color 0.2s, border-color 0.2s;
    border: 1px solid #cccccc;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    box-shadow: none;
}
.catalog-items-sort-block .btn-link:hover {
    color: var(--main-color);
    text-decoration: none;
    background-color: transparent;
    border-color: var(--main-color);
    box-shadow: none;
}
.catalog-items-sort-block .btn-link.active {
    color: var(--main-color);
    font-weight: 700;
    border-color: var(--main-color);
    box-shadow: none;
}
.catalog-items-sort-block .btn-link .fas {
    font-size: 11px;
    line-height: 1;
}
.catalog-items-sort-block .btn-link .fa-sort-up::before {
    position: relative;
    top: 2px;
}
.catalog-items-sort-block .btn-link .fa-sort-down::before {
    position: relative;
    top: -2px;
}
/** Сортировка каталога */

/** Короткий товар */
.catalog-item-short{border: 1px dashed #ccc;}
.catalog-item-short .itemContent .itemTitle {margin-top: 0px;font-size: 14px;font-weight: 400;line-height: 18px;}

.catalog-item-short .itemContent .priceBlock strong {font-size: 14px;display: inline-block;width: 100%;text-decoration: line-through;font-weight: 600;}
.catalog-item-short .itemContent .priceBlock strong.internet {font-size: 22px;text-decoration: none;color: #313131;}

.catalog-item-short .itemContent .priceBlock strong.internet .kopecks::before{content:".";}
.catalog-item-short .itemContent .priceBlock strong.internet span:first-child+*{color:#999;font-size:12px;opacity: 0.6;}
.catalog-item-short .itemContent .priceBlock .mute {font-size: 15px;color: #ccc;position: relative;top: -10px;}

.catalog-item-short:hover {border: 1px dashed #ccc;-webkit-box-shadow: 0 15px 18px 2px rgba(198, 201, 221, .2);box-shadow: 0 15px 18px 2px rgba(198, 201, 221, .2)}

.catalog-item-short .catalog-item-short-action-buttons .addToBasketOneClick{padding:6px 3px;font-size:12px;}
/** Короткий товар */


/** Полный товар */

.item-properties-block{border: 1px solid transparent;border-radius: 3px;box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;color: #313131;min-height: 20px;}
.item-properties-block .item-price-block span {color: var(--main-color);font-size: 24px;font-weight: bold;display: inline-block;}
.item-properties-block .item-price-block span b {text-decoration: line-through;}
.item-properties-block .item-price-block span.internet {display: flex;font-size:1.5rem;text-decoration: none;}
.item-properties-block .item-price-block span small {color: var(--text-color);font-size: 16px;}
.item-properties-block .item-price-block span .kopecks {color: var(--main-color); font-size: 14px; font-weight: bold; display: inline-block; text-decoration: underline;}
/** Полный товар */


/** КОРЗИНА */

/*.cart-item .cart-item-title-block{max-width:300px;}*/
.cart-item .cart-item-title-block{max-width:250px;}
.cart-item .cart-item-price-block .currentPrice{font-size:16px;font-weight:bold;}

.basket-options-list-block .steps-block{position:relative;}
.basket-options-list-block .steps-block:before{content:"";position:absolute;height:95%;top:2.5%;width:1px;background-color:#000;left:13px;}

.basket-options-list-block .steps-block .step-block{padding-left:35px;position:relative;}
.basket-options-list-block .steps-block .step-block:first-child:before{content:"1";}
.basket-options-list-block .steps-block .step-block:first-child+*:before{content:"2";}
.basket-options-list-block .steps-block .step-block:first-child+*+*:before{content:"3";}
.basket-options-list-block .steps-block .step-block:first-child+*+*+*:before{content:"4";}
.basket-options-list-block .steps-block .step-block:before{content:"1";position:absolute;left:0%;top:0%;top:5px;font-size:14px;line-height:14px;color:#333;background-color:#FFF;padding:5px;padding-left:8px;padding-right:8px;border-radius:15px;border:1px solid #CCC;font-weight:bold;}

.align-items-stretch {
/*    height: 100px;
    border-bottom: 1px dashed #c1633f;*/
}
.cart-item-image-block.pr-3 {
}
.cart-item-image-block.pr-3 img {
    width: 90px;
    height: auto;
}
/** КОРЗИНА */


/*** News on main ****/
.mainNewsBlock h3{text-transform:uppercase;    font-size: 24px;color: #2e2d2d;font-weight: bold;}
/*** News on main ****/



/** main-banner-block  */
.main-banner-block{background-color: #CCC;background-repeat: no-repeat;background-position: top center;min-height:300px;}
/** main-banner-block  */

/**HEAdER SEARCH FORM*/

.headerSearchForm .inputSearch{background:#FFF;border:0;border-bottom:transparent;-webkit-transition:-webkit-box-shadow ease-in-out .15s;-o-transition: box-shadow ease-in-out .15s;transition: box-shadow ease-in-out .15s;  -webkit-box-shadow: inset 0 -1px 0 #dddddd;box-shadow: inset 0 -1px 0 #dddddd;color:#333;margin-right:3px;}
.headerSearchForm .inputSearch::-webkit-input-placeholder {
    color: #666;
}
.headerSearchForm .inputSearch:focus{    box-shadow: inset 0 -2px 0 #2196f3;-webkit-box-shadow: inset 0 -2px 0 #2196f3;}

/**HEAdER SEARCH FORM*/


/** новости и обзоры */
.newBlockMain {
    margin-bottom: 20px;
}

.newBlockMain .left .titleBlock, .newBlockMain .right .titleBlock {
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
}

.newBlockMain .left .titleBlock span, .newBlockMain .right .titleBlock span {
    font-size: 24px;
    color: #2e2d2d;
    font-weight: bold;
    text-transform: uppercase;
}

.newBlockMain .left .titleBlock a, .newBlockMain .right .titleBlock a {
    display: inline-block;
    padding-bottom: 1px;
    border-bottom: 1px dashed var(--main-color);
    color: var(--text-color);
    font-size: 15px;
    font-weight: 400;
    margin-left: 20px;
}

.newBlockMain .left .itemsList .item {
    min-height: 112px;
    padding: 18px 10px 26px;
    border-top: 2px dashed #f0f0f0;
    color: #2e2d2d;
    text-decoration: none;
    -webkit-transition: .1s background-color;
    transition: .1s background-color;
    display: inline-block;
    width: 100%;
}

.newBlockMain .left .itemsList .item:hover {
    background-color: #f0f0f0;
}

.newBlockMain .left .itemsList .item .photoBlock {
    margin-right: 15px;
    float: left;
}

.newBlockMain .left .itemsList .item .photoBlock img {
    width: 64px;
    height: 64px;
}

.newBlockMain .left .itemsList .item .descr p {
    font-size: 15px;
    font-weight: bold;
}

.newBlockMain .right .itemsList .item {
    margin-bottom: 30px;
}

.newBlockMain .right .itemsList .item .photoBlock {
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    height: 300px;
    margin-bottom: 10px;
}

.newBlockMain .right .itemsList .item .descrBlock p {
    min-height: 50px;
    color: #2e2d2d;
    font-size: 17px;
    font-weight: bold;
    line-height: 24px;
}

/** новости и обзоры */


#scroller{position:fixed;border:0;outline:0;bottom:10%;width:50px;height:50px;border-radius: 25px;background-color:rgba(0,0,0,0.6);right:10%;}

/* Скрытие гамбургер-меню в мобильной версии */
.catalog-hamburger-menu {
    display: none;
}

/* Плавающее меню при скролле для десктопной версии */
@media(min-width:768px) {
    .main-menu-second {
        transition: all 0.3s ease;
    }

    .main-menu-second.floating {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1050;
        box-shadow: 0 2px 10px rgba(0,0,0,0.3);
        background-color: var(--dark-gray) !important;
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }
    
    .main-menu-second.placeholder {
        height: 70px; /* Создает пустое пространство, равное высоте плавающего меню */
    }

    /* Стили для гамбургер-меню каталога */
    .catalog-hamburger-menu {
        position: relative;
        display: none; /* Сначала скрыто */
    }
    
    .main-menu-second.floating .catalog-hamburger-menu {
        display: inline-block; /* Показываем только при плавающем состоянии */
    }
    
    .hamburger-btn {
        background: none;
        border: none;
        cursor: pointer;
        padding: 5px;
        display: flex;
        flex-direction: column;
        justify-content: center; /* Центрируем по вертикали */
        align-items: center; /* Центрируем по горизонтали */
        width: 35px; /* Чуть больше */
        height: 35px; /* Чуть больше */
        outline: none;
    }
    
    .hamburger-btn span {
        display: block;
        height: 3px;
        width: 22px; /* Фиксированная ширина */
        background-color: #ffffff;
        border-radius: 2px;
        transition: all 0.3s ease;
        margin: 2px 0; /* Одинаковое расстояние между палочками */
        transform-origin: center;
    }
    
    .hamburger-btn:hover span {
        background-color: #ffffff;
        opacity: 0.8;
    }
    
    /* Анимация превращения гамбургера в крест */
    .hamburger-btn.active span:nth-child(1) {
        transform: translateY(6px) rotate(45deg);
    }
    
    .hamburger-btn.active span:nth-child(2) {
        opacity: 0;
        transform: scale(0);
    }
    
    .hamburger-btn.active span:nth-child(3) {
        transform: translateY(-6px) rotate(-45deg);
    }
    
    .catalog-dropdown-menu {
        position: absolute;
        top: 100%;
        left: 0;
        background-color: var(--dark-gray);
        min-width: 300px;
        box-shadow: 0 8px 16px rgba(0,0,0,0.2);
        z-index: 1000;
        display: none;
        padding: 15px;
        border-radius: 5px;
    }
    
    .catalog-dropdown-menu.show {
        display: block;
    }
    
    /* Двухколоночное отображение меню каталога */
    .catalog-dropdown-menu .menu {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        margin: 0;
        padding: 0;
        color: #ffffff; /* Белый цвет для всего меню */
    }
    
    .catalog-dropdown-menu .menu li {
        list-style: none;
        margin: 0;
        padding: 5px 0;
        color: #ffffff;
    }
    
    .catalog-dropdown-menu .menu li a {
        color: #ffffff;
        text-decoration: none;
        font-size: 14px;
        display: block;
        padding: 5px 10px;
        border-radius: 3px;
        transition: background-color 0.2s ease;
    }
    
    .catalog-dropdown-menu .menu li a:hover {
        background-color: rgba(255, 255, 255, 0.1);
        text-decoration: none;
        color: #ffffff;
    }
    
    /* Принудительный белый цвет для всех элементов меню */
    .catalog-dropdown-menu,
    .catalog-dropdown-menu * {
        color: #ffffff !important;
    }
    
    /* Стили для основного меню каталога */
    .catalog-dropdown-menu-main {
        position: absolute;
        top: 100%;
        left: 0;
        background-color: var(--dark-gray);
        min-width: 300px;
        box-shadow: 0 8px 16px rgba(0,0,0,0.2);
        z-index: 1000;
        display: none;
        padding: 15px;
        border-radius: 5px;
    }
    
    .catalog-dropdown-menu-main.show {
        display: block;
    }
    
    /* Двухколоночное отображение меню каталога в основном меню */
    .catalog-dropdown-menu-main .menu {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        margin: 0;
        padding: 0;
        color: #ffffff;
    }
    
    .catalog-dropdown-menu-main .menu li {
        list-style: none;
        margin: 0;
        padding: 5px 0;
        color: #ffffff;
    }
    
    .catalog-dropdown-menu-main .menu li a {
        color: #ffffff;
        text-decoration: none;
        font-size: 14px;
        display: block;
        padding: 5px 10px;
        border-radius: 3px;
        transition: background-color 0.2s ease;
    }
    
    .catalog-dropdown-menu-main .menu li a:hover {
        background-color: rgba(255, 255, 255, 0.1);
        text-decoration: none;
        color: #ffffff;
    }
    
    /* Принудительный белый цвет для всех элементов основного меню */
    .catalog-dropdown-menu-main,
    .catalog-dropdown-menu-main * {
        color: #ffffff !important;
    }

    .w-md-auto{
        width:auto !important;
    }
}

@media(max-width:400px){
    .headerTop .menu-right .nav-item a{padding: 0.3rem 0.3em;}
    .main-menu nav.navbar .navbar-brand{width:100%;text-align:center;}
}

@media(max-width:900px){
    #scroller{bottom:22%;}
}
