/* Part 7 / B4 — design tokens.
   Brand family stays teal (the live identity: header band, buttons, underlines).
   -400 is the historical brand teal (was hardcoded everywhere), kept for decor;
   -600 is a deepened action teal so white button text clears contrast; the reds
   replace the old harsh ca1000/830d00/a00e00/bf1300/red family and are reserved
   for price-drop, out-of-stock and destructive/error semantics only. */
/* Part 8 / S2: "did you mean" search-correction notice */
.sd-didyoumean{
    background: var(--sd-teal-050);
    border: 1px solid var(--sd-teal-100, #d1ebe4);
    border-radius: 12px;
    padding: 12px 16px;
    margin: 6px 4px 14px;
    font-size: 14px;
    color: var(--sd-ink);
}
.sd-didyoumean > i{ color: var(--sd-teal-600); margin-inline-end: 6px; }
.sd-didyoumean > a{
    color: var(--sd-teal-600);
    font-family: 'iransans2', sans-serif;
    font-weight: 700;
    text-decoration: underline;
    margin: 0 4px;
}
.sd-didyoumean > a:hover{ color: #0b6f5c; }
/* multiple candidates → chips */
.sd-didyoumean-list{ display: inline-flex; flex-wrap: wrap; gap: 8px; margin-inline-start: 6px; vertical-align: middle; }
.sd-didyoumean-list > a{
    background: #fff;
    border: 1px solid var(--sd-teal-100, #d1ebe4);
    border-radius: 999px;
    padding: 4px 14px;
    font-family: 'iransans2', sans-serif;
    font-weight: 700;
    font-size: 13px;
    color: var(--sd-teal-600);
    text-decoration: none;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.sd-didyoumean-list > a:hover{ background: var(--sd-teal-600); border-color: var(--sd-teal-600); color: #fff; }

/* Brand tokens — the single source of truth (docs/design-system.md §6). Mirrored by
   the @theme block in resources/css/storefront.css; keep the two in sync.
   Part 14 / P7 folded in teal 200/300/500/700, which had been declared in a :root
   block inside products10.css. */
:root{
    --sd-teal-050: #e7f6f2;
    --sd-teal-100: #d1ebe4;
    --sd-teal-200: #a7d9cd;
    --sd-teal-300: #6ec9b3;
    --sd-teal-400: #1abc9c;
    --sd-teal-500: #14a386;
    --sd-teal-600: #0e8a72;
    --sd-teal-700: #0a6e5a;
    --sd-teal-hover: #0b6f5c;
    --sd-red-050: #fff1f0;
    --sd-red-500: #d25a4e;
    --sd-red-700: #a53f36;
    --sd-ink: #23312d;
    --sd-muted: #6d7a76;
    --sd-bg: #f2f5f4;
    --sd-line: #e3e8e6;
}
/* classes replacing per-view inline colours (Part 7 / B4) */
.basket-total{
    color: var(--sd-red-700);
    font-size: 16px;
}
.fav-heart-on{
    font-size: 25px;
    color: var(--sd-red-500);
}
/*start menu*/
body{
    background: var(--sd-bg);
}
.icon_top_flash{
    position: absolute;
    top: -22px;
    left: 15px;
    font-size: 30px;
    color: var(--sd-muted);

}
@media (max-width: 960px) {
    .nav-menu-full-p, .stickytop
    {
        background: unset;
        padding: 0px 0 0px;
        box-shadow: unset;
        margin-top: 0px;
        margin-bottom: 0px;
    }
}
.col-item
{
    border: 1px solid #E1E1E1;
    border-radius: 5px;
    background: #FFF;
}
.col-item .photo img
{
    margin: 0 auto;
    width: 100%;
}
footer .enamad img
{
    width: 100px;
    height: 100px;
    object-fit: contain;
    background: #fff;
    border-radius: 5px;
}

[class*=uk-dropdown-bottom]{
    margin-top: 8px;
}
.uk-dropdown
{
    border-top: 2px solid var(--sd-teal-400);
    min-width: 140px;
    padding: 10px;
}
.uk-dropdown-nav>li>a:hover{
    border-bottom: 1px solid var(--sd-teal-400);
    color: var(--sd-teal-400);
}
.col-item .info
{
    padding: 10px;
    border-radius: 0 0 5px 5px;
    margin-top: 1px;
}

.col-item:hover .info {
    background-color: #F5F5DC;
}
.col-item .price
{
    /*width: 50%;*/
    float: left;
    margin-top: 5px;
}

.col-item .price h5
{
    line-height: 20px;
    margin: 0;
}

.price-text-color
{
    color: #219FD1;
}

.col-item .info .rating
{
    color: #777;
}

.col-item .rating
{
    /*width: 50%;*/
    float: left;
    font-size: 17px;
    text-align: right;
    line-height: 52px;
    margin-bottom: 10px;
    height: 52px;
}

.col-item .separator
{
    border-top: 1px solid #E1E1E1;
}

.clear-left
{
    clear: left;
}

.col-item .separator p
{
    line-height: 20px;
    margin-bottom: 0;
    margin-top: 10px;
    text-align: center;
}

.col-item .separator p i
{
    margin-right: 5px;
}
.col-item .btn-add
{
    width: 50%;
    float: left;
}

.col-item .btn-add
{
    border-right: 1px solid #E1E1E1;
}

.col-item .btn-details
{
    width: 50%;
    float: left;
    padding-left: 10px;
}
.controls
{
    margin-top: 20px;
}
[data-slide="prev"]
{
    margin-right: 10px;
}

.testss {
    width: 100%;
    height: 300px;
    background: #fff;
    color: #000;
    font-size: 22px;
    margin: 0 auto;
    direction: rtl;
    text-align: center;
    box-shadow: 5px 5px 5px #6d6d6d;
    border-bottom: 1px solid #6d6d6d;
    border-left: 1px solid #6d6d6d
}
#store_ss .testss {
    width: 95%;
    margin-left: 5px
}
.links0 {
    width: 100%;
    height: auto;
    display: block;
    text-align: center;
    color: #444;
    margin-bottom: 24px;
}
.clear {
    clear: both;
    margin: 80px auto;
}
#product_s .tests {
    width: 95%;
    margin-left: 5px
}
.links0 {
    width: 100%;
    height: auto;
    display: block;
    text-align: center;
    color: #444;
    margin-bottom: 24px;
}
.clear {
    clear: both;
    margin: 80px auto;
}
#shoper1
{
    width: 400px;
    height: 50px;
    position: absolute;
    background: white;
    box-shadow: 0 0 5px #6d6d6d;
    top:100px;
    right: 100px;
    bottom: 0;
    z-index: 1500;
    display: none;
}
.nav-menu > li:hover > a, .rmenu a:hover, .widget-content li:hover:before, .active-grid-btn, .nav-menu-normal > li:hover > a, .nav-menu-normal > li > .sub-menu li:hover > a, .nav-menu > li.menu-item-has-children > ul.sub-menu > li:hover > a, .menu-tp > ul > li > a:hover, .menu-tp > ul > li:hover, .services-feature-part a:hover, .widget-content li a:hover, .copyright-right ul li a:hover, .product-car-p a:hover, .product-name > a:hover, .shop_table.wishlist .product-name h6 a:hover, .shop_table.wishlist .product-name h6 a:focus, .product-name > a:focus,  .product_list_widget li:hover .product-title, .feature-attr h2 a:hover, .woocommerce-MyAccount-content a:hover, .woocommerce-LostPassword.lost_password a:hover, .blog-post-comment #respond a:hover{
    color: var(--sd-teal-400) !important;
}
ul.feature-tabs li.current:after{
    border-right-color: var(--sd-teal-400) !important;
}
.nav-menu > li:hover > a::after, .nav-menu-normal > li:hover > a::after, .nav-menu > li.menu-item-has-children > ul.sub-menu > li:hover{
    border-bottom-color: var(--sd-teal-400);
}
.cat-menu-cb .nav-menu > li:hover > a::after{
    border-right-color: var(--sd-teal-400);
}
.nav-menu-normal > li.menu-item-has-children > .sub-menu, .nav-menu-normal li.menu-item-has-children > ul > li.menu-item-has-children ul.sub-menu, .nav-menu > li.menu-item-has-children > ul.sub-menu {
    border-top:2px solid var(--sd-teal-400);
}

/*end menu*/
/*start ukgrid*/

.uk-position-center-left,.uk-position-center-right{
    background: rgba(255,255,255,0.2);
    color: #37753a!important;
}
@media (min-width: 1200px)
{
    .uk-card-primary.uk-card-body .uk-slidenav, .uk-card-primary>:not([class*=uk-card-media]) .uk-slidenav, .uk-card-secondary.uk-card-body .uk-slidenav, .uk-card-secondary>:not([class*=uk-card-media]) .uk-slidenav, .uk-light .uk-slidenav, .uk-offcanvas-bar .uk-slidenav, .uk-overlay-primary .uk-slidenav, .uk-section-primary:not(.uk-preserve-color) .uk-slidenav, .uk-section-secondary:not(.uk-preserve-color) .uk-slidenav, .uk-tile-primary:not(.uk-preserve-color) .uk-slidenav, .uk-tile-secondary:not(.uk-preserve-color) .uk-slidenav{
        color: #fff;
    }
    .uk-grid{
        padding-left: unset;
        margin-left: unset;
        margin-right: unset;
    }
    .uk-grid>*{
        padding-right: 5px;
        padding-left: 5px;
    }
    *+.uk-grid-margin, .uk-grid+.uk-grid, .uk-grid>.uk-grid-margin {
        margin-top: 0px;
    }

}
.uk-grid{
    padding-left: unset;
    margin-left: unset;
    margin-right: unset;
}
.uk-grid>*{
    padding-right: 5px;
    padding-left: 5px;
}
*+.uk-grid-margin, .uk-grid+.uk-grid, .uk-grid>.uk-grid-margin {
    margin-top: 0px;
}
/*end ukgrid*/

/*!*scrool start*!*/
/*!* width *!*/
/*::-webkit-scrollbar {*/
    /*width: 13px;*/
/*}*/

/*!* Track *!*/
/*::-webkit-scrollbar-track {*/
    /*background: #fff;*/
/*}*/

/*!* Handle *!*/
/*::-webkit-scrollbar-thumb {*/
    /*background: var(--sd-teal-400);*/
/*}*/
/*::-webkit-scrollbar-button {*/
    /*background: red;*/
/*}*/
/*!* Handle on hover *!*/
/*::-webkit-scrollbar-thumb:hover {*/
    /*background: #555;*/
/*}*/
/*!*scrool end*!*/


/*start font*/
h1,h2,h3,h4,h5,h6,p,div,a,span,strong,del,header,footer,section,input,select,td,label{
    font-family: iransans;
}
a{
    text-decoration: none!important;
}
.login_a,.register_a{
    font-family:yekan;
    font-size: 15px;
}
/* Part 7 / B2: base bumped 12px -> 13px — Persian in IRANSans Light needs the
   extra size; paragraphs get a generous Persian line-height. */
input,p,span,del,select,strong,div,header,footer,a,td{
    font-size: 13px;
}
p{
    line-height: 1.8;
}
/* Prices and other digit runs: the heavier IRANSans cut, isolated so comma
   groups keep their order inside RTL sentences. */
.numberPrice{
    font-family: iransans2;
    unicode-bidi: isolate;
}
/* Hero heading of the three homepages: scales with viewport instead of
   overflowing on phones. */
.baner h1{
    font-size: clamp(19px, 4.2vw, 30px);
    line-height: 1.7;
}
/*end font*/



/*start header*/
.header_desktop{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: var(--sd-teal-400);
    height: 35px;
    line-height: 34px;
}
.header_desktop>div>div>.lab_a{
    padding: 0 10px;
    color: #fff;
}
.header_desktop>div>div>.lab_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_desktop>div>div>.dentel_a{
    padding: 0 10px;
    color: #fff;
}
.header_desktop>div>div>.dentel_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_desktop>div>div>.index_a{
    padding: 0 10px;
    color: #fff;
}
.header_desktop>div>div>.index_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_desktop>div>div>.basket_a{
    padding: 0 10px;
    color: #fff;
    font-size: 17px;
}
.header_desktop>div>div>.basket_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_desktop>div>div>.login_a{
    padding: 0 10px;
    color: #fff;
}
.header_desktop>div>div>.login_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_desktop>div>div>.register_a{
    padding: 0 10px;
    color: #fff;
}
.header_desktop>div>div>.register_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_desktop>div>div>.active_a{

    background: #5eba5e;
    box-shadow: 0 0 1px 1px #54a754 inset;
    border-radius: 4px;

}
.fav_com{
    list-style: none!important;
    margin-top: 8%;
}
.fav_com>li{
    padding: 5px 5px;
}
.header_desktop>div>div>.basket_a>.basket_num{
    background: #f00606;
    border-radius: 50%;
    height: 20px;
    width: 20px;
    line-height: 19px;
    text-align: center;
    position: absolute;
    left: 22px;
}
.header_logo_desktop>a>img{
    width: 70%;
}
.uk-float-left::after{
    content: unset!important;
}
.header_search_desktop>form{
    margin-top: 6%;
    width: 600px;
}
@media(max-width: 959px)
{
    .header_search_desktop>form{
        margin-top: 5%;
        width: 320px;
    }
}
@media(max-width: 640px)
{
    .header_search_desktop>form{
        margin-top: 1%;
        width: 320px;
    }
}
@media(max-width: 600px)
{
    .header_logo_desktop>a>img{
        width: 100%;
    }
    .header_search_desktop>form{
        margin-top: 3%;
        width: 320px;
    }
}
@media(max-width: 470px)
{
    .header_logo_desktop>a>img{
        width: 100%;
    }
    .header_search_desktop>form{
        margin-top: 1%;
        width: 320px;
    }
}
.header_search_desktop>form>div>input
{
    border-radius:  20px 0 0 20px;
}
.header_search_desktop>form>div>button{
    background: var(--sd-teal-600);
    color: #fff!important;
    border-radius: 20px;
    width: 100px!important;
    left: 3px!important;
    height: 36px;
    top: 2px!important;
}
#myBtn1>svg{
    display: none;
}
#myBtn2>svg{
    display: none;
}
#myBtn3>svg{
    display: none;
}
.header_search_desktop>form>div>.uk-search-icon-flip>svg{
    width: 30px;
    height: 30px;
}
.uk-search-default .uk-search-icon-flip~.uk-search-input{
    padding-right: 8px;
    padding-left: 101px;
}
.header_tablet{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: var(--sd-teal-400);
    height: 35px;
    line-height: 34px;
}
@media(max-width: 640px)
{
    .header_tablet>div>.basket_a>.basket_num{
       left: 20px!important;
        height: 15px!important;
        width: 15px!important;
        line-height: 14px!important;
    }
}
.header_tablet>div>.lab_a{
    padding: 0 10px;
    color: #fff;
}
.header_tablet>div>.lab_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_tablet>div>.dentel_a{
    padding: 0 10px;
    color: #fff;
}
.header_tablet>div>.dentel_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_tablet>div>.index_a{
    padding: 0 10px;
    color: #fff;
}
.header_tablet>div>.index_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_tablet>div>.basket_a{
    padding: 0 10px;
    color: #fff;
    font-size: 17px;
}
.header_tablet>div>.basket_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_tablet>div>.login_a{
    padding: 0 10px;
    color: #fff;
}
.header_tablet>div>.login_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_tablet>div>.register_a{
    padding: 0 10px;
    color: #fff;
}
.header_tablet>div>.register_a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
.header_tablet>div>.active_a{

    background: #5eba5e;
    box-shadow: 0 0 1px 1px #54a754 inset;
    border-radius: 4px;

}
.header_tablet>div>.basket_a>.basket_num{
    background: #f00606;
    border-radius: 50%;
    height: 20px;
    width: 20px;
    line-height: 19px;
    text-align: center;
    position: absolute;
    left: 30px;
}
.heart_tablet{
    color: #444;
    padding: 2px 1px;
}
.heart_tablet:hover{
    box-shadow: 0 0 1px 1px #444;
    color: #444;
}
.compar_tablet{
    color: #444;
    padding: 2px 1px;
}
.header_desktop1{
    margin-top: 30px!important;
    background: #fff;
    box-shadow: 0 2px 2px 1px  rgba(0,0,0,0.05);
}
.header_desktop1>div>ul{
    list-style: none!important;
    margin-top: 4%;

}
.header_desktop1>div>ul>li{
    margin-bottom: 5px;
}
.compar_tablet:hover{
    box-shadow: 0 0 1px 1px #444;
    color: #444;
}
@media(max-width: 500px)
{
    .header_tablet>div>.lab_a{
        padding: 0 3px;
        color: #fff;
    }

    .header_tablet>div>.dentel_a{
        padding: 0 3px;
        color: #fff;
    }

    .header_tablet>div>.index_a{
        padding: 0 3px;
        color: #fff;
    }
    .header_tablet>div>.login_a
    {
        padding: 0 3px;
        color: #fff;
    }
    .header_tablet>div>.basket_a
    {
        padding: 0 3px;
    }
}
@media(max-width: 370px){
    .header_tablet>div>.index_a{
       display: none;
    }
}
/*end header*/

/*start footer*/
.solid_footer{
    height: 50px;
    background: rgba(1,2,2,0.12);
    box-shadow: 0 -1px 2px 0.5px #666;
    margin-top: 10px;
}
.solid_footer>ul{
    height: 100%;
}
.solid_footer>ul>li{
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
    background: rgba(107,214,207,0.7);
    border-radius: 35px 35px 0 0;
    margin-left: 5px;
    margin-right: 5px;
    height: 105%;
    margin-top: -3px;
    padding: 0 15px;
}
.solid_footer>ul>li>a>i{
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
    color: #000;
    font-size: 35px;
    line-height: 60px;
}
.solid_footer>ul>li:hover {
    background: var(--sd-teal-600);
    height: 115%;
    margin-top: -8px;
}
/* P12: removed — this (0,2,3) rule outranked the icon theme and pinned the hover
   colour to #fff. The footer hover colour now lives in icons-theme.css
   (--sd-ic-on-dark-hover) so it can be changed in one place with the rest. */
.footer{
    background: #313131;
    padding: 20px;
}
/* Part 13 / P8: footer column titles were <h4> — demoted to .footer-title divs so
   they stop competing with the page <h1> in the heading outline. */
.footer>div>div>.footer-title{
    color: #fff!important;
    padding-bottom: 5px;
    border-bottom: 1px solid #fff!important;
}
.footer>div>div>a>.footer-title{
    color: #fff;
    padding-bottom: 5px;
    border-bottom: 1px solid #fff;
}
.footer>div>div>p{
    color: #fff;
}
.footer>div>div>p>i{
    color: #fff;
    font-size: 20px;
    padding-left: 10px;
}
.footer>div>div>p>a{
    color: #fff;
}
.footer>div>div>p>a:hover{
    color: var(--sd-teal-400);
}
.footer>div>div>p>a>i{
    color: #fff;
    font-size: 20px;
    padding-left: 10px;
}
.order{
    width: 75%;
    text-align: center;
    padding: 15px;
    border: 1px solid #fff;
    border-radius: 7px;
    margin-bottom: 10px;
    margin-top: 20px;
    margin-right: 50%;
    transform: translateX(50%);
}
.order>p{
    color: #fff;
}
.order>a{
    background: var(--sd-teal-600);
    color: #fff;
    padding: 5px 15px;
    border-radius: 3px;
}
.order>a>i{
    padding-left: 3px;
}
.order>a:hover{
    box-shadow: 0 0 1px 1px #fff;
}
footer>div>div>img{
    width: 50%;
}
.margintops-15
{
    margin-top: 15px!important;
}
.copy_right_ss{
    padding: 10px;
    background: #4a4a4a;
    color: #fff;
}
.copy_right_ss>a{
    color: var(--sd-teal-400);
    font-size: 17px;
}
.copy_right_ss>a:hover{
    color: #fff999;
}
/*end footer*/
/*start slider*/
.body{
    padding: 5px 20px;
}
@media (min-width:1400px)
{
    .f_body{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .body{
        width: 1400px;
    }
    .footer{
         display: flex;
         align-items: center;
         justify-content: center;
     }
    .f_footer{
        width: 1400px;
    }
    .f_menu{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .menu{
        width: 1400px;
    }
    .f_search{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .search{
        width: 1400px;
    }
    .f_mmm{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .mmm{
        width: 1400px;
    }
    /*.header_desktop>div>div>.basket_a>.basket_num{*/
        /*left: 78px;*/
    /*}*/
}
@media (max-width: 960px) {
    .slider{
        margin-top: 10px!important;
    }
}
@media(max-width: 450px){

    .body{
        padding: 5px 1px;
    }
}

.baner{

    /*max-height: 320px;*/
    /*min-height: 250px;*/
    padding: 10px 10px!important;
}
.baner>div{
    border-radius: 4px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.1)
}
.baner_img{
    border-radius: 4px;
    -webkit-transition: all 2s; /* For Safari 3.1 to 6.0 */
    transition: all 2s;
}
.baner_img:hover{
    transform: scale(1.0, 1.0)rotate(0deg);
    /*transform: scale(1.0, 1.0)rotate(-0.5deg);*/
}
.baner_img1{
    border-radius: 4px;
    -webkit-transition: all 2s; /* For Safari 3.1 to 6.0 */
    transition: all 2s;
}
.uk-dotnav>*{
    z-index: 9;
}
.uk-dotnav>*>*
{
    box-shadow: 0 0 2px 1px #fff;
    width: 15px;
    height: 15px;
}
.uk-dotnav>.uk-active>*{
    background: var(--sd-teal-400);
}
.baner_img1:hover{
    transform: scale(1.0, 1.0)rotate(0deg);
}
.baner-group{
    margin: 15px 0!important;
}
.slider{
    padding: 10px!important;
}
.slider>div{
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.1)
}
/*end slider*/
/*stert product-slider*/
.product-slider{
    padding: 0 10px;
    margin-top: 10px;
}
.product-slider>div{
    background: #fff;
    padding: 10px 2px;
    box-shadow: 0 2px 2px 1px rgba(0,0,0,0.03);
}
.product-slider ul li img{
    height: 200px;
    width: 100%;


}
.product-slider ul li{
    /*background-color: var(--sd-red-500);*/
    padding: 2px;
}

.cart-viwe{
    color: var(--sd-ink);
    padding-bottom: 50px;
    border-radius: 8px;
    border: 1px solid var(--sd-line);
    background: #fff;
}
.cart-viwe div{

    text-align: center;
    padding: 11px 0;
}
.add-to-cart{
    text-decoration: none;
    outline: none;
    color: #fff!important;
    transition: all 0.25s ease-in;
    position: absolute;
    /*bottom: 2px;*/
    right:53px;
    left: 53px;
    background: var(--sd-teal-600);
    padding: 10px 10px!important;
    border-radius: 22px;
    text-align: center;
}
.add-to-cart span{margin-left: 5px}
.add-to-cart:hover{
    background-color: #ffffff;
    border: 2px solid var(--sd-teal-400);
    color: var(--sd-teal-400)!important;
}
.no-to-cart{
    text-decoration: none;
    outline: none;
    color: #fff!important;
    transition: all 0.25s ease-in;
    position: absolute;
    /*bottom: 2px;*/
    right:53px;
    left: 53px;
    background: #9ebcae;
    padding: 10px 10px!important;
    border-radius: 22px;
    text-align: center;
}
.no-to-cart:hover{
    background-color: #ffffff;
    border: 2px solid #9ebcae;
    color: #9ebcae!important;
}
.no-to-cart span{margin-left: 5px}
.add-to-compros{
    text-decoration: none;
    position: absolute;
    padding: 10px 10px!important;
    font-size: 16px;
    color: var(--sd-teal-600)!important;
    right: 0px;
    bottom: 8px;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.add-to-compros:hover{
    /* Part 7 / B1: scale, not font-size — the old grow reflowed the card */
    transform: scale(1.2);
}
.add-to-hart{
    text-decoration: none;
    position: absolute;
    padding: 10px 10px!important;
    font-size: 16px;
    color: var(--sd-teal-600)!important;
    left: 0px;
    bottom: 8px;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.add-to-hart:hover{
    transform: scale(1.2);
}
.add-to-hart1{
    text-decoration: none;
    position: absolute;
    padding: 10px 10px!important;
    font-size: 16px;
    color: var(--sd-red-500)!important;
    left: 0px;
    bottom: 8px;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.add-to-hart1:hover{
    transform: scale(1.2);
}
.cart-viwe del{
    margin-left: 10px;
}
.hover_product>img{
    width: 100%;height: 200px;
}

/*end product-slider*/
/*start titr*/
.titr{
    /*background-color: var(--sd-teal-400);*/

    padding: 5px 10px;
    margin-right: 10px;
    margin-left: 10px;
    margin-top: 10px;
    background: #fff;
    border-radius: 3px;

}
/*end titr*/

/*start product*/
.offer{
    position: absolute;
    top: 0px;
    right: -9px;
    width: 80px!important;
    height: 75px!important;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.cart-viwe{
    -webkit-transition: all 0.3s; /* For Safari 3.1 to 6.0 */
    transition: all 0.3s;
}
.cart-viwe:hover {
    /* Part 7 / B1: lift via transform (the old margin-top:-5px reflowed the row) */
    transform: translateY(-4px);
    box-shadow: 0 6px 18px rgba(35,49,45,.10);
}

/*.cart-viwe:hover .offer{*/
/*margin-top: -5px;*/
/*}*/
.add-to-bas{
    background: var(--sd-teal-600);
    text-align: center;
    color: #fff;
    padding: 7px 10px;
    border-radius: 6px;
    position: absolute;
    width: 135px;
    font-size: 13px!important;
    right: 50%;
    transform: translateX(50%);
    margin-top: 10px;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.add-to-bas:hover{
    box-shadow: 0 4px 12px rgba(14,138,114,.35);
    color: #fff;
}
.add-to-order{
    background: var(--sd-red-700);
    color: #fff;
    padding: 7px 15px;
    border-radius: 6px;
    position: absolute;
    text-align: center;
    font-size: 13px;
    width: 130px;
    right: 50%;
    transform: translateX(50%);
    margin-top: 10px;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.add-to-order:hover{
    box-shadow: 0 4px 12px rgba(165,63,54,.35);
    color: #fff;
}
.p_name{
    color: var(--sd-muted);
}
.p_name>p{
    height: 30px;
}
.p_name>p>del{
    color: var(--sd-red-500);
}
.p_name>.ban_p{
    color: var(--sd-red-700);
    margin-top: 0px;
    font-size: 18px;
    margin-bottom: 25px;
}
.p_name>p>.call_p{
    color: var(--sd-teal-400);
    border-bottom: 1px solid var(--sd-teal-400);
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.p_name>p>.call_p:hover{
    color: var(--sd-red-700);
    border-bottom: 1px solid var(--sd-red-700);
}
.myimage125 {
    width: 100%;
    /*height: 400px;*/
}
.myimage126 {
    width: 100px!important;
    height: 90px;
}
@media (max-width: 959px) {
    .myimage125 {
        width: 100%;
        /*height: 250px;*/
    }
    .myimage126 {
        width: 50px!important;
        height: 45px;
    }
}
@media (max-width: 499px) {
    .p_name>.ban_p{
        color: var(--sd-red-700);
        margin-top: 0px;
        margin-bottom: 25px;
        font-size: 18px;

    }
    .p_name>p{
        margin-bottom: 7px;
        margin-top: 5px;
        font-size: 11px;
        height: 45px;
    }
    .p_name>p:last-child
    {
        margin-top: 25px;
    }
    .p_name{
        padding: 0;
    }
    .product-slider ul li img
    {
        width: 100%;
        height: 150px;
    }
    .cart-viwe{
        color: var(--sd-ink);
        /*box-shadow: 0 0 1px 1px rgba(0,0,0,0.13);*/
        padding-bottom: 50px;
        border-radius: 2px;
        background: #fff;
    }
    .cart-viwe div{

        text-align: center;
        padding: 11px 0;
    }
    .add-to-cart{
        text-decoration: none;
        outline: none;
        color: #fff!important;
        transition: all 0.25s ease-in;
        position: absolute;
        /*bottom: 2px;*/
        right:53px;
        left: 53px;
        background: var(--sd-teal-600);
        padding: 10px 10px!important;
        border-radius: 22px;
        text-align: center;
    }
    .add-to-cart span{margin-left: 5px}
    .add-to-cart:hover{
        background-color: #ffffff;
        border: 2px solid var(--sd-teal-400);
        color: var(--sd-teal-400)!important;
    }
    .no-to-cart{
        text-decoration: none;
        outline: none;
        color: #fff!important;
        transition: all 0.25s ease-in;
        position: absolute;
        /*bottom: 2px;*/
        right:53px;
        left: 53px;
        background: #9ebcae;
        padding: 10px 10px!important;
        border-radius: 22px;
        text-align: center;
    }
    .no-to-cart:hover{
        background-color: #ffffff;
        border: 2px solid #9ebcae;
        color: #9ebcae!important;
    }
    .no-to-cart span{margin-left: 5px}
    .add-to-compros{
        display: none;
        text-decoration: none;
        position: absolute;
        padding: 10px 10px!important;
        /*border-radius: 22px;*/
        /*border: 1px solid var(--sd-teal-400);*/
        color: var(--sd-teal-400)!important;
        right: 0px;
        bottom: 8px;
        -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
        transition: all  0.3s;
    }
    .add-to-compros:hover{
        font-size: 18px;
    }
    .add-to-hart{
        display: none;
        text-decoration: none;
        position: absolute;
        padding: 10px 10px!important;
        /*border-radius: 22px;*/
        /*border: 1px solid var(--sd-teal-400);*/
        color: var(--sd-teal-400)!important;
        left: 0px;
        bottom: 8px;
        -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
        transition: all  0.3s;
    }
    .add-to-hart:hover{
        font-size: 18px;
    }
    .add-to-hart1{
        display: none;
        text-decoration: none;
        position: absolute;
        padding: 10px 10px!important;
        /*border-radius: 22px;*/
        /*border: 1px solid var(--sd-teal-400);*/
        color: var(--sd-red-500)!important;
        left: 0px;
        bottom: 8px;
        -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
        transition: all  0.3s;
    }
    .add-to-hart1:hover{
        font-size: 18px;
    }
    .cart-viwe del{
        margin-left: 5px;
        font-size: 12px;
    }
    .hover_product>img
    {
        width: 100%;
        height: 105px;
    }
    .offer {
        width: 55px !important;
        height: 47px !important;
        right: -4px;
    }

    .myimage125 {
        width: 100%;
        height: 200px;
    }
    .myimage126 {
        width: 40px!important;
        height: 35px;
    }
    .add-to-bas{
        text-align: center;
        background: var(--sd-teal-600);
        color: #fff;
        font-size: 11px!important;
        padding: 7px 15px;
        border-radius: 3px;
        position: absolute;
        width: 136px!important;
        font-size: 14px;
        right: 50%;
        transform: translateX(50%);
        margin-top: 10px;
        -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
        transition: all  0.3s;
    }
}
/* Part 7 / B1: refreshed home product card (.pc-*). Scoped under .pc-body so
   the legacy card markup still used on category/search/product pages keeps
   its old .p_name rules. */
.slider-item-placeholder{
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;      /* reserves the image box before load — kills CLS */
    border-radius: 6px;
    overflow: hidden;
}
.cart-viwe .slider-item-placeholder{
    padding: 0;               /* the generic .cart-viwe div padding would unsquare it */
}
.product-slider .slider-item-placeholder img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #fff;         /* opaque box covers the loading shimmer underneath */
}
.pc-body{
    min-height: 100px;        /* title + one price/note row, so button rows align */
}
.pc-body>p{
    height: auto;
    margin: 0;
}
.pc-body>.pc-title{
    color: var(--sd-ink);
    line-height: 1.7;
    height: 3.4em;            /* always two lines so card rows align */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.pc-body>.pc-price{
    margin-top: 6px;
    color: var(--sd-muted);
}
.pc-price .numberPrice{
    font-size: 15px;
    color: var(--sd-ink);
}
.pc-price .pc-price-old{
    font-size: 12px;
    color: var(--sd-red-500);
}
.pc-body>.pc-note{
    margin-top: 2px;
    font-size: 12px;
    color: var(--sd-teal-600);
}
.pc-body>.ban_p{
    display: inline-block;
    margin: 8px auto 0;
    padding: 3px 14px;
    font-size: 13px;
    color: var(--sd-red-700);
    background: #faf0ee;
    border-radius: 20px;
}
.pc-btn-call{
    width: 150px;
}
.add-to-bas:focus-visible, .add-to-order:focus-visible, .add-to-compros:focus-visible,
.add-to-hart:focus-visible, .add-to-hart1:focus-visible{
    outline: 2px solid var(--sd-teal-600);
    outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce){
    .slider-item-placeholder{
        animation: none;
    }
    .slider-item-placeholder img.is-loaded{
        transition: none;
    }
}
/* Part 7 / B3: shared empty state (partials/empty-state.blade.php) — an
   invitation to act, not an error; replaces the red uk-alert-danger these
   pages used to show for "empty". */
.empty-state{
    width: 100%;
    padding: 48px 16px;
    text-align: center;
    background: #fff;
    border: 1px dashed var(--sd-line);
    border-radius: 8px;
}
.empty-state-icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: var(--sd-teal-050);
    color: var(--sd-teal-600);
    font-size: 28px;
    margin-bottom: 14px;
}
.empty-state-title{
    font-size: 15px;
    color: var(--sd-ink);
    margin: 0 0 4px;
}
.empty-state-text{
    font-size: 13px;
    color: var(--sd-muted);
    margin: 0;
}
.empty-state-btn{
    display: inline-block;
    margin-top: 16px;
    padding: 8px 22px;
    border-radius: 6px;
    background: var(--sd-teal-600);
    color: #fff!important;
    font-size: 13px;
    transition: all .3s;
}
.empty-state-btn:hover{
    box-shadow: 0 4px 12px rgba(14,138,114,.35);
    color: #fff;
}
/*end product*/

/*start news*/
.news_box{
    padding: 5px;
}
.body_news{
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
    max-width: 1300px;
}
.body_news:hover{
    box-shadow: 0 0 2px 1px var(--sd-teal-400);
}
.box_s{
    background: #fff;
    box-shadow: 0 0 2px 1px  rgba(0,0,0,0.05);
    border-radius: 3px;
}
.box_s>.header_news{
    background: var(--sd-teal-600);
    height: 35px;
    line-height: 34px;
    color: white;
    border-radius: 3px 3px 0 0;
}
.box_s>.header_news>h2{
    color: #fff;
}
.box_s>a>.body_news{
    padding: 2px;
    border: 1px solid rgba(15,163,134,0.24);
    margin: 7px;

}
.box_s>a>.body_news>.img_news{
    padding: unset;
}
.box_s>a>.body_news>.img_news>img{
    width: 100%;height: 90px;
}
.box_s>a>.body_news>.text_news{
    padding: 2px 10px;
}
.box_s>a>.body_news>.text_news>.title{
    position: absolute;
    top: 50%;
    transform: translateY(-60%);
    color: #000;
    margin-bottom: -10px;
    margin-top: 5px;
}
.box_s>a>.body_news>.text_news>.text{
    color: var(--sd-muted);
    font-size: 12px;
}
.news_all_link{
    width: 100%;
    padding: 10px 10px;
    text-align: left;

}
.news_all_link>a{
    color: var(--sd-muted);
    font-size: 17px;
    padding: 5px 10px;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.news_all_link>a:hover{
    box-shadow: 0 0 2px 1px var(--sd-teal-400);
}
/*end news*/

/*products page*/

.right_col,.left_col{
    padding: 10px;
}
.filters{
    box-shadow: 0 0 1px 1px  rgba(0,0,0,0.05);
    border-radius: 3px;
    background: #fff;
}
@media(max-width: 550px)  {
    .filters{
        margin-bottom: -17px;
    }
    .uk-accordion{
        margin-bottom: 0;
    }
}
.header_filters
{
    background: #fff;
    border-radius: 3px 3px 0 0 ;
    height: 35px;
    line-height: 34px;
    padding: 0 10px;

    color: var(--sd-muted);
}
.header_filters>p{
    color: var(--sd-muted);
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
.filtering{
    margin-bottom: 7px;
    padding: 8px;
    max-height: 170px;
    overflow-y: auto;
}
.filtering>span>a{
    padding-right: 5px;
    color: #fff;
}
.filtering>span>a:hover{
    color: var(--sd-red-500);
}
.filtering>span{
    margin-top: 5px;
    margin-right: 5px;
}
.filtering_brand>p{
    margin-bottom: 3px;
    margin-top: 3px;
}

.btn_filter{
    /*box-shadow: 0 0 1px 1px var(--sd-teal-400);*/
    padding: 5px 7px;
    margin-right: 2px;
    border-radius: 2px;
    color: #000;
}
.btn_filter:hover{
    color: var(--sd-teal-400);
}
.active_btn_filter{
    box-shadow: 0 0 1px 1px var(--sd-teal-400);
    background: var(--sd-teal-600);
    color: #fff;
    padding: 5px 7px;
    margin-right: 2px;
    border-radius: 2px;
}
.active_btn_filter:hover
{
    color: #fff!important;
}
.filter_btn{
    /*border-bottom: 1px solid #d6d6d6;*/
    background: #fff;
    padding: 16px 2px;
    box-shadow: 0 0 1px 1px  rgba(0,0,0,0.05);
    border-radius: 2px;
}
@media(max-width: 960px)
{
    .count{
        margin-top: 15px!important;
    }}
.addressbar_page{
    background: #fff;
    border-radius: 5px;
    padding: 10px 20px;
    box-shadow: 0 2px 2px 1px  rgba(0,0,0,0.05);
    margin-bottom: 0;
}
.addressbar_page>a{
    font-size: 15px;
}
@media (max-width: 960px) {
    .addressbar_page{
        margin-top: 15px;
    }

}
.addressbar_page>a{
    color: #0f0f0f!important;
    font-size: 15px;
}
.products_search{
    padding-top: 15px!important;
    padding-bottom: 15px!important;
    background: #fff;
}

.uk-pagination>.page>a{
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
    padding: 2px 8px;
}
.uk-pagination>.page>a:hover{
    box-shadow: 0 0 1px 1px #d6d6d6;
    background: rgba(107,214,207,0.18);
    border-radius: 50%;
}
.uk-pagination>.uk-active>a{
    background: var(--sd-teal-600);
    color: #fff;
    box-shadow: 0 0 1px 1px #d6d6d6;
    border-radius: 50%;
}
.uk-pagination>.uk-active>a:hover{
    background: var(--sd-teal-600);
    color: #fff;
    box-shadow: 0 0 1px 1px #d6d6d6;
    border-radius: 50%;
}
.uk-pagination>*{
    padding-right: 5px;
    padding-left: 5px;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus
{
    background-color: var(--sd-teal-600);
    border-color: var(--sd-teal-400);
}
.pagination > li > a, .pagination > li > span
{
    color: var(--sd-teal-400);
}
/*end product page*/

/*rang price*/
/* Ion.RangeSlider
// css version 2.0.3
// Â© 2013-2014 Denis Ineshin | IonDen.com
// ===================================================================================================================*/

/* =====================================================================================================================
// RangeSlider */

.irs {
    position: relative; display: block;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.irs-line {
    position: relative; display: block;
    overflow: hidden;
    outline: none !important;
}
.irs-line-left, .irs-line-mid, .irs-line-right {
    position: absolute; display: block;
    top: 0;
}
.irs-line-left {
    left: 0; width: 11%;
}
.irs-line-mid {
    left: 9%; width: 82%;
}
.irs-line-right {
    right: 0; width: 11%;
}

.irs-bar {
    position: absolute; display: block;
    left: 0; width: 0;

}
.irs-bar-edge {
    position: absolute; display: block;
    top: 0; left: 0;
}

.irs-shadow {
    position: absolute; display: none;
    left: 0; width: 0;
}

.irs-slider {
    position: absolute; display: block;
    cursor: default;
    z-index: 1;
}
.irs-slider.single {

}
.irs-slider.from {
    transform: rotate(0deg);
}
.irs-slider.to {
    transform: rotate(180deg);
}
.irs-slider.type_last {
    z-index: 2;
}

.irs-min {
    position: absolute; display: block;
    left: 0;
    cursor: default;
}
.irs-max {
    position: absolute; display: block;
    right: 0;
    cursor: default;
}

.irs-from, .irs-to, .irs-single {
    position: absolute; display: block;
    top: 0; left: 0;
    cursor: default;
    white-space: nowrap;
}

.irs-grid {
    position: absolute; display: none;
    bottom: 0; left: 0;
    width: 100%; height: 20px;
}
.irs-with-grid .irs-grid {
    display: block;
}
.irs-grid-pol {
    position: absolute;
    top: 0; left: 0;
    width: 1px; height: 8px;
    background: #000;
}
.irs-grid-pol.small {
    height: 4px;
}
.irs-grid-text {
    position: absolute;
    bottom: 0; left: 0;
    white-space: nowrap;
    text-align: center;
    font-size: 9px; line-height: 9px;
    padding: 0 3px;
    color: #000;
}

.irs-disable-mask {
    position: absolute; display: block;
    top: 0; left: -1%;
    width: 102%; height: 100%;
    cursor: default;
    background: rgba(0,0,0,0.0);
    z-index: 2;
}
.lt-ie9 .irs-disable-mask {
    background: #000;
    filter: alpha(opacity=0);
    cursor: not-allowed;
}

.irs-disabled {
    opacity: 0.4;
}


.irs-hidden-input {
    position: absolute !important;
    display: block !important;
    top: 0 !important;
    left: 0 !important;
    width: 0 !important;
    height: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    outline: none !important;
    z-index: -9999 !important;
    background: none !important;
    border-style: solid !important;
    border-color: transparent !important;
}


/* Ion.RangeSlider, Simple Skin
// css version 2.0.3
// Â© Denis Ineshin, 2014    https://github.com/IonDen
// Â© guybowden, 2014        https://github.com/guybowden
// ===================================================================================================================*/

/* =====================================================================================================================
// Skin details */

.irs {
    height: 55px;
}
.irs-with-grid {
    height: 75px;
}
.irs-line {
    height: 5px; top: 33px;
    background: #EEE;
    background: linear-gradient(to bottom, #DDD -50%, #FFF 150%); /* W3C */
    border: 1px solid #CCC;
    border-radius: 16px;
    -moz-border-radius: 16px;
}
.irs-line-left {
    height: 8px;
}
.irs-line-mid {
    height: 8px;
}
.irs-line-right {
    height: 8px;
}

.irs-bar {
    height: 5px; top: 33px;
    border-top: 1px solid var(--sd-teal-400);
    border-bottom: 1px solid var(--sd-teal-400);
    background: var(--sd-teal-400);
    background: linear-gradient(to top, rgba(26,188,156,1) 0%,rgba(32,255,209,1) 100%); /* W3C */
}
.irs-bar-edge {
    height: 5px; top: 33px;
    width: 14px;
    border: 1px solid var(--sd-teal-400);
    border-right: 0;
    background: var(--sd-teal-400);
    background: linear-gradient(to top, rgba(26,188,156,1) 0%,rgba(32,255,209,1) 100%); /* W3C */
    border-radius: 16px 0 0 16px;
    -moz-border-radius: 16px 0 0 16px;
}

.irs-shadow {
    height: 2px; top: 38px;
    background: #000;
    opacity: 0.3;
    border-radius: 5px;
    -moz-border-radius: 5px;
}
.lt-ie9 .irs-shadow {
    filter: alpha(opacity=30);
}

.irs-slider {
    top: 27px;
    width: 0px;
    height: 0px;
    background-color: transparent;
    border-width: 9px;
    border-style: solid;
    border-color: transparent transparent transparent var(--sd-teal-400);
    transform: rotate(270deg);
}
.irs-slider.state_hover, .irs-slider:hover {
    /*background: var(--sd-teal-400);*/
}
.irs-slider.to{

}

.irs-min, .irs-max {
    color: #333;
    font-size: 12px; line-height: 1.333;
    text-shadow: none;
    top: 0;
    padding: 1px 5px;
    background: rgba(0,0,0,0.1);
    border-radius: 3px;
    -moz-border-radius: 3px;
}

.lt-ie9 .irs-min, .lt-ie9 .irs-max {
    background: #ccc;
}

.irs-from, .irs-to, .irs-single {
    color: #fff;
    font-size: 14px; line-height: 1.333;
    text-shadow: none;
    padding: 1px 5px;
    background: var(--sd-teal-400);
    border-radius: 3px;
    -moz-border-radius: 3px;
}
.lt-ie9 .irs-from, .lt-ie9 .irs-to, .lt-ie9 .irs-single {
    background: #999;
}

.irs-grid {
    height: 27px;
}
.irs-grid-pol {
    opacity: 0.5;
    background: var(--sd-teal-400);
}
.irs-grid-pol.small {
    background: #999;
}

.irs-grid-text {
    bottom: 5px;
    color: #99a4ac;
}

.irs-disabled {
}
.btn_price{
    width: 100%;
    border-radius: 3px;
    background: var(--sd-teal-600);
    color: #fff;
    font-size: 17px;
    border:unset;
    box-shadow: 0 0 1px 1px #d6d6d6;
    padding: 10px 15px;
    /*position: absolute;*/
    /*right: 50%;*/
    /*transform: translateX(-25%);*/

}
.btn_price:hover{
    box-shadow: 0 0 2px 1px #6d6d6d;
}
*+.uk-hr, *+hr{
    margin-top: unset;
    margin-bottom: 5px;
}

/*end rang price*/

/*brand*/
.brand_slider{

    /*background: #fff;*/
    margin-top: 10px;
    /*box-shadow: 0 0 1px 1px #d6d6d6;*/
    border-radius: 5px;
}
.brand_slider>h3{
    margin-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    /*border-bottom: 2px solid #666;*/
    width: 80px;
}
.cart-brand
{
    padding: 10px;
    width: 50%;
    float: right;
}
.cart-brand>div>img{
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
    width: 100%!important;
    /*float: right!important;*/
    height: 100px!important;
}
.cart-brand:hover .img1
{
    transform: scale(1.1, 1.1);
}
.cart-brand:hover .img125{
    opacity: 0;
}
.cart-brand:hover .img2
{
    transform: scale(1.1, 1.1);
}
/*end brand*/
/*basket_page*/
.basket_page{
    background: #fff;
    box-shadow: 0 0 2px 1px  rgba(0,0,0,0.05);
    border-radius: 4px;
    padding: 10px 20px;
    margin-top: 5px;
    padding-top: 30px;
    margin-bottom: 10px;

}
.del{
    color: var(--sd-red-700);
}
.del:hover{
    color: var(--sd-teal-400);
}
tr>td>img{
    width: 100px;
    height: 90px;
}
.table-pic{
    width: 13%;
}
.table-name{
    width: 15%;
}
.width-model{
    width: 15%;
}
.width-num{
    width: 15%;
}
.width-price{
    width: 14%;
}
.width-del{
    width: 14%;
}
.uk-table th{
    text-align: center;
}
.uk-table td{
    vertical-align: middle;
    text-align: center;
}
.basket_table{
    position: relative;
    padding: 10px;
    box-shadow: 0 0 1px 1px  rgba(0,0,0,0.05);
    margin-top: 8px!important;
    width: 100%;

}
.basket_table>div>img{
    width: 90px ;height: 80px;
}
.model_tbl>span,.price_tbl>span{
    color: #550002;
}
.name_tbl>span,.price1_tbl>span{
    color: #550002;
}
.del_tbl{
    position: absolute;
    left: 5px;
    bottom: 5px;
    color:#a40004;
}
.del_tbl:hover{
    color: var(--sd-teal-400);
}
.price1_tbl{
    margin-bottom: 0;
    padding-bottom: 0;
    padding-top: 0;
    margin-top: 5px;
}
.price_tbl
{
    margin-bottom: 0;
    padding-bottom: 0;
    padding-top: 0;
    margin-top: 5px;
}
.name_pro>.model_tbl,
.name_pro>.name_tbl
.name_pro>.price_tbl
.name_pro>.price1_tbl
{
    margin-top: 10px;
    margin-bottom: 5px;
}
.del_tbl_mob{
    color: #a40004;
    margin-top: 10px;
}
.del_tbl_mob :hover{
    color: var(--sd-teal-400);
}
.allprice{
    border-top:  1px solid #666;
    border-bottom:  1px solid #666;
    padding: 10px;
}
.btn_basket{
    background: var(--sd-teal-600);
    color: #fff;
    text-align: center;
    padding: 8px 15px;
    border-radius: 3px;
    width: 135px;

    margin-top: 10px;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
@media (max-width: 500px)
{
    .btn_basket{
        text-align: center;
        background: var(--sd-teal-600);
        color: #fff;
        padding: 8px 18px;
        border-radius: 3px;
        width: 95px;
        /*transform: translateX(50%);*/
        margin-top: 10px;
        -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
        transition: all  0.3s;
    }
    .btn_basket_m{
        width: 118px!important;
    }
}
.btn_basket:hover{
    box-shadow: 0 0 2px 1px #6d6d6d;
    color: #fff;
}
.btn_bas{
    padding: 20px;
}

.send_type{
    box-shadow: 0 0 1px 1px  rgba(0,0,0,1);
    border-radius: 4px;
}
.col1{
    border-left: 2px solid #000!important;
}
.col2>img{
    width: 80px;
    height: 70px;
}
.col3{
    text-align: right!important;
}
.col4{
    border-right: 2px solid #000!important;
}
.post_link{
    color: #0409a4;
    border-bottom: 1px solid;
}
.post_link:hover
{
    color: var(--sd-teal-400);
}
.icon_bus{
    height: unset!important;
}

/*end basket*/

/*product single*/
div.stars {
    width: 270px;
    display: inline-block;
}
label.star {
    padding: 2px 2px!important;
}
label.star {
    float: right;
    padding: 10px;
    font-size: 13px;
    color: #444;
    transition: all .2s;
}
div.stars {
    width: 270px;
    display: inline-block;
}
input.star {
    display: none;
}
.coment{
    color: var(--sd-ink);
}
.hart{
    font-size: 24px;
    color: var(--sd-red-500);
}
.price--line-through {

    background-image: repeating-linear-gradient(163deg, transparent 0%, transparent 48%, var(--sd-red-500) 50%, transparent 52%, transparent 100%);
    font-size: 15px!important;
    font-weight: bold!important;
}
.sengel-discription{
    background-color: #ffffff;
    padding: 25px!important;
    direction: ltr;
}
.dis-border{
    border-bottom: 1px solid silver;margin-top: 20px;margin-bottom: 20px
}
.tab-titel a span{
    color: #999;

}
.tab-titel a {
    color: #999;
    font-size: 15px;
}
.tab-titel a:hover{
    color: var(--sd-ink);
    /*font-size: 20px;*/
}
.selected{
    padding: 2px 15px;
    border-radius: 25px;
    border: none;
    background-color: #99cc96
}
.discript{
    padding: 25px!important;
}
.add-cart{
    font-family: IRANsans;float: left;margin-top: 20px;background: #249b25;border-radius: 50px;padding: 10px 25px;text-shadow: 0px 0px 0px var(--sd-teal-400);color: white;font-weight: bold;
    font-size: 11px;
}
.data{
    font-size: 15px!important;margin-top: 10px;font-weight: bold!important;"
}
.dis1{
    font-size: 15px!important;font-weight: bold
}
.dis2{
    font-size: 15px!important;color: #145300
}
#gal1,#gal2{list-style: none}
#gal1 li,#gal2 li{
    border: 1px dotted #b7b7b7;
    padding: 5px;
    float: right;

}
#gal1 li img,#gal2 li img{
    width: 100px;
}
#gal1 li:hover,#gal2 li:hover{
    box-shadow: 1px 1px 2px 2px #6b6b6b;
}
.tabssec{
    background-color: #fff;
    margin-top: 25px;
    padding: 30px!important;
}
.description span, .description p, .description h1, .description h2, .description h3, .description h4, .description h5, .description h6 {
    font-family: 'iransans' !important;
}

.description p {
    text-align: justify !important;
}

.product-slider1{
    background-color: #ffffff;
    margin-top: 25px!important;
    padding: 20px!important;
}
.product-s{
    border: 1px solid #ebeced;
    border-radius: 9px;
    padding: 25px;
}
.titr-home {
    font-size: 13px!important;

}
.coment:hover{
    color: var(--sd-teal-400);
}
/*.titr-home {*/
/*padding: 0px 26px 0px 26px;*/
/*}*/
.titr-home {
    border-radius: 9px;
    font-size: 20px;
    float: right;
    width: 100%;
    background-color: #fff;
    direction: rtl;
    line-height: 38px;
    /*padding-right: 15px;*/
    text-align: right;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}
.group-select{
    background: rgba(0,0,0,0.02);padding: 10px 10px!important;border-radius: 7px;margin-top: 5px!important;
}
.like-icon1 {
    position: unset!important;
    border: none;
    color: #8a8686;
    right: 7%;
    bottom: -23%;}
.fa-star{
    color: #ffe800;

}
.fa-star-half-alt{
    color: #ffe800;

}
.compar-icon{
    color: var(--sd-muted);
}
.compar-icon:hover{
    color: var(--sd-teal-400);
}
.compar-icon>i{
    font-size: 24px;
}
/*end product*/


/*start login*/
.box-login{
    box-shadow: 0 0 2px 2px  rgba(0,0,0,0.05);
    border-radius: 5px;
    margin-top: 15px!important;
    padding: 50px 35px!important;
    background: #fff;
}
.box-comparis{
    background: #fff;
    margin-bottom: 20px!important;
    border-radius: 7px;
    box-shadow: 0 0 2px 2px  rgba(0,0,0,0.05);
}
@media(max-width: 1000px)
{
    .comparis-tabl
    {
        /*min-width: 595px;*/
        overflow-x: auto;
    }
    /*.comparis-tabl>table{*/
        /*min-width: 600px;overflow: auto*/
    /*}*/
}
.text-login{
    border-radius: 5px;
}
.login-submit{

}
.reset-pass-login{
    margin: 5px 0 15px 0;
}
.reset-pass-login a{
    color: var(--sd-ink);
}
/*start login*/


/*start user registr*/
.register{text-align: center}
.register i{font-size: 70px;margin-bottom: 10px}
.register span{color: #777;font-size: 13px; line-height: 0.3}
.register h2{line-height: 0.3;margin-top: 15px!important;font-size: 20px !important;}
.box-user-reg{
    box-shadow:  0 0 2px 1px rgba(0,0,0,0.05);
    /*border: 0.5px solid silver;*/
    border-radius: 5px;
    margin-top: 15px!important;
    padding: 35px!important;
}
.float-left{
    float: left;
}
.float-right{
    float: right;
}
.box-user-reg form div label {
    color: #98a3a9;
}
.box-user-reg form div label span {
    color: var(--sd-red-500);

    margin-right: 3px;

    font-size: 10px;

    text-decoration: unset !important;
}

.user-reg-text{

    width: 100%;

    border-radius: 3px;

    height: 35px;

    border: 1px solid #b9b6b6 !important;
}
.box-input-reg{
    margin-top: 15px!important;
}
abbr {

    color: var(--sd-red-500);
    margin-right: 3px;
    font-size: 17px;
    text-decoration: unset !important;
    font-family: IRANSans;

}
.box-user-reg form div select{

    width: 100%;

    border-radius: 3px;

    height: 35px;

    border: 1px solid #b9b6b6 !important;
    webkit-appearance: none;
}
.msg {

    background: #ff5853 !important;
    padding: 3px 10px !important;
    color: black !important;
    font-size: 12px;

}
/*start user registr*/

/*start news*/
.div_all {
    padding: 15px 10px;
    direction: rtl;
    margin-top: 10px!important;
}
.all {
    border: 0.5px solid silver;
    padding: 5px;
}
.div_titr {
    height: 45px;
    line-height: 45px;
    text-align: center;
    background: rgba(0,0,0,0.03);
}
.div_titr > a {
    font-size: 15px !important;
}
.pull-right {
    float: right;
}
.w-100 {
    width: 100% !important;
}
.img1 {
    width: 100%;
    height: 330px;
}
.news-box{
    margin-top: 25px!important;
    padding: 30px;
}
.div_text {
    margin-top: 15px;
    height: 30px;
}
.nwes_a {
    background: transparent;
    border: 1px solid var(--sd-teal-400);
    color: var(--sd-teal-400);
    border-radius: 9px;
    padding: 4px 10px;
    padding-left: 10px;
    font-weight: bold;
    position: relative;
    padding-left: 19px;
    float: left;
    bottom: 28px;
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.nwes_a:hover{
    box-shadow: 0 0 2px 1px  rgba(0,0,0,0.05);
    color: var(--sd-teal-400)!important;
}
.text_news_div{
    text-align: justify;
}
.div_titr a {
    color: #444;
}
.all{
    -webkit-transition: all  0.3s; /* For Safari 3.1 to 6.0 */
    transition: all  0.3s;
}
.all:hover{
    box-shadow: 0 0 2px 2px  rgba(0,0,0,0.05);
    border-radius: 6px;
    transform: translateY(-5px);
}
.news-text{
    font-size: 16px;
    text-align: justify;
    line-height: 1.9;

    padding: 15px;
}
/*end news*/
/*start comparison*/
.box-comparis{
    border-radius: 9px;
    box-shadow: 0 0 2px 2px  rgba(0,0,0,0.05);
    margin: 15px 0px!important;
    padding: 25px 45px!important;
    background-color: #fff;
}
@media (max-width:500px) {
    .box-comparis{

        padding: 5px 5px!important;

    }
}
.compar_tablet-img{
    width: 100px;
    height: 100px;
}
.bascet-comparis{
    text-decoration: none;

    border: 1px solid var(--sd-teal-400);

    border-radius: 9px;

    padding: 5px;

    color: var(--sd-teal-400);

    font-size: 12px;
}
.bascet-comparis:hover{
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, .17);
    color:var(--sd-teal-400) ;
}
.bastet-delet{
    color: var(--sd-red-500);
}
.bastet-delet:hover
{
    color: var(--sd-teal-400);
}
.titel-comparis{
    border-bottom: 1px solid #eeeff1;
}
input[type=text]{
    background: white!important;
}
/*end comparison*/

/*provider*/
@media (min-width: 1200px)
{

    .uk-grid{
        padding-left: unset;
        margin-left: unset;
        margin-right: unset;
    }
    .uk-grid>*{
        padding-right: 5px;
        padding-left: 5px;
    }
    *+.uk-grid-margin, .uk-grid+.uk-grid, .uk-grid>.uk-grid-margin {
        margin-top: 0px;
    }

}
.uk-grid{
    padding-left: unset;
    margin-left: unset;
    margin-right: unset;
}
.uk-grid>*{
    padding-right: 5px;
    padding-left: 5px;
}
*+.uk-grid-margin, .uk-grid+.uk-grid, .uk-grid>.uk-grid-margin {
    margin-top: 0px;
}
/*end ukgrid*/
/*start navbar*/
.nav-bar{
    height: 40px;
    border-bottom: 1px solid #f1f1f1;
    box-shadow: 0 0 7px 5px rgba(0, 0, 0, .02);
    background-color: #f8f9fa !important;

}.nav-bar-m{
     height: 40px;
     border-bottom: 1px solid #f1f1f1;
     box-shadow: 0 0 7px 5px rgba(0, 0, 0, .02);
     background-color: #f8f9fa !important;

 }
.nav-bar .uk-navbar-left{
    margin: -20px auto  ;
}.nav-bar-m .uk-navbar-left{
     margin: -20px 0px  ;
 }
.ul-nav li a{
    color: #0f0f0f !important;
    font-family: iransans;
    font-size: 16px;
}

/*end navbar*/
.box-right{
    padding-left:0px;
}
.right-culom{

    background-color: #fff;
    border: 1px solid #ebeced;
    -ms-border-radius: 4px;
    border-radius: 9px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1);
    margin-top: 5px;
    text-align: center;
    line-height: 3;
}
.titr-home {
    font-size: 17px!important;
    padding: 20px 25px 13px 25px!important;
    padding: 0px 26px 0px 26px;
}
.green-btn{
    background-color: #28a745;
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    font-size: 13px;
    text-decoration: none;
    margin: 5px;
}

.red-btn{
    background-color: #f86f2f;
    color: #fff;
    padding: 0 5px;
    border-radius: 5px;
    font-size: 13px;
    text-decoration: none;
    margin: 5px;
}
.red-btn1{
    padding: 5px;
    color: var(--sd-red-500)!important;
    background: unset;
    border: unset;
}
.red-btn1:hover{
    color: var(--sd-teal-400)!important;
}
.green-btn1{
    padding: 5px;
    color: #666!important;
}
.green-btn1:hover{

    color: var(--sd-teal-400)!important;
}
.green-btn:hover{
    background-color: var(--sd-teal-600);
    color: #fff!important;
    box-shadow: 3px 2px 5px 0px #6b6b6b;
    text-decoration: none;
}
.red-btn:hover{
    background-color: #bc491c;
    color: #fff!important;
    box-shadow: 3px 2px 5px 0px #6b6b6b;
    text-decoration: none;
}
/*start continer*/
.cont-img{
   box-shadow: 0 0 2px 1px rgba(0,0,0,0.1);
    padding: 15px;
    border-radius: 3px;
    max-height: 205px;
    height: 205px;
    margin: 5px;
    background: #fff;
}
.cont-box{
    padding: 0!important;
    margin: 0px;
}
.cont-form{
    border-radius: 3px;
    border-color: #ececec;
    box-shadow: 0 0 4px 2px rgba(0, 0, 0, .02);
    margin: 10px 3px;

    border: 1px solid rgba(0,0,0,.125);
}
.cont-form-header{
    color: #777;
    border-color: #f1f1f1;
    background-color: #fbfbfb;
    padding: .75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
}
.card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1.25rem;
}
.cont-form-body{
    padding: 15px;
    background: #fff;
}
.cont-alert{
    background-color: var(--sd-red-500);
    text-align: center;
    font-size: 15px;
    color: #fff;
    padding: 10px;
    border-radius: 5px;
}
.box-input {
    padding: 10px 0;
}
.box-input label {
    float: right;
    width: 30%;
    font-family: iransans;
    position: relative;
    color: #98a3a9;

}
.input-panel{
    background-color: transparent;
    border: 1px solid #b9b6b6 !important;
    border-radius: 35px;
    color: #2c2c2c;
    line-height: normal;
    font-size: .8571em;
    width: 70%;
    padding: 8px;
    -webkit-appearance: none;
}
.input-panel1{
    background-color: transparent;
    border: 1px solid #b9b6b6 !important;
    border-radius: 35px;
    color: #2c2c2c;
    line-height: normal;
    font-size: .8571em;
    width: 100px;
    padding: 3px;
    -webkit-appearance: none;
}


/*end continer*/


/*start maseg*/
.text-btn{
    border: unset;
    background-color: unset;
    color: blue;
}
abbr{color: var(--sd-red-500)}
.maseg-box input{
    width: 100%;
    height: 40px;
}
.maseg-box textarea{
    width: 100%;
}
.close-btn{
    background-color: #f0506e;
    color: #fff;
    padding: 8px 30px;
    font-size: 13px;
    text-decoration: none;
    margin: 5px;
}
.send-btn{
    background-color: #1e87f0;
    color: #fff;
    padding: 8px 30px;
    font-size: 13px;
    text-decoration: none;
    margin: 5px;
}
/*end maseg*/
/*start info*/
.me-info{
    border: 1px solid black;
    width: 100%;
}
.me-info td{
    border: 1px solid #0f0f0f;
    border: 1px solid #0f0f0f;
    line-height: 2;
    padding: 15px;
}
.uk-grid-margin1{
    margin-top: 25px!important;
}
/*end info*/


/*end provider*/

/*karbar*/
/*start col right*/
.col-r .hade{
    height: 60px;
    background: rgba(0,0,0,0.04)

}
.hade1{
    height: 60px;
    background: rgba(0,0,0,0.04);
    line-height: 60px;
    text-align: center;
    margin: 3px 3px 5px 3px;


}
.p_name>p:first-child{
    font-size: 14px!important;
}
.p_name>p>span:last-child
{
    margin-right: 3px;
}
.hade-img {
    border-radius: 50%;
    width: 85px;
    height: 70px;
    /*margin-top: 30px;*/
    position: absolute;
    right: 50%;
    transform: translateX(50%);
    top: 20px;
}
.colr-box{
    position: relative;
    background-color: #fff;
    padding-right:unset!important; ;
    padding-left:unset!important; ;
    margin: 15px 0;
}
.col-r-box>p{
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    margin-top: 35px!important;
    margin-bottom: 10px;
    width: 100%;
}
.col-r-box{
    box-shadow: 0 0 2px 1px  rgba(0,0,0,0.05);
    /* width: 100%; */
    margin-bottom: 10px;
    background: white;

}
.col-r-box>a{
    padding-top: 10px;
}
.col-r-box>a>p{
    margin-top: 0px!important;
}
.col-r-box .menu {
    width: 100%;
    margin: 3px 3px 0 3px;
    text-align: right;
    padding: 6px 20px;
}
.hade1>p {
    font-size: 15px;
    font-weight: bold;
}
/*end col right*/

/*start contant*/
.box-content{
    background-color: #fff;
    padding: 3px 3px 8px 3px;
    margin-top: 15px;
    box-shadow: 0 0 1px 1px  rgba(0,0,0,0.05);
}
.hade2{
    height: 60px;
    background: rgba(0,0,0,0.04);
    line-height: 60px;
    text-align: center;
}
.p_c {
    width: 100%;
    text-align: right;
    padding: 10px 5px;
    margin-bottom: -40px;
    margin-top: 20px;
    /*border-color: rgba(0,0,0,0.04)!important;*/
    border-collapse: collapse;
}
.a_b {
    padding: 10px;
    border: 1px solid rgba(0,0,0,0.04)!important;;
}
.a_a{
    padding: 15px;
    text-align: center;
    border: 1px solid rgba(0,0,0,0.04)!important;;
}
/* Part 17 / P2: `.a_a`'s #1e87f0, and the `.order-table` thead's #38659d-with-white-
   text, were the two off-palette blues in the account panel — the only blues on a site
   that is teal everywhere else. Both are gone; every panel table (including .order-table)
   is now styled once in pages15.css against the palette tokens. The `!important` on the
   old `.order-table th` colour is why this had to be deleted here rather than overridden
   there. */
.order-ok{
    color: var(--sd-teal-600);
    font-weight: bold;
}
.order-no{
    color: var(--sd-red-500);
    font-weight: bold;
}
.box-content-body{
    height: 480px;
    overflow-y: auto;
    padding: 10px 70px;
}
@media (max-width: 700px)
{
    .box-content-body{
        height: 480px;
        overflow-y: auto;
        padding: 10px 5px;
    }
}
.box-content-body form{line-height: 2}
.active_user_panel{
    background: var(--sd-teal-600);
    color: #fff;
}
/*endcontant*/
/*end karbar*/
/* Part 16 / P9 — back-to-top.
   Was a translucent muddy-green 3px-corner square that slid in from `bottom:-100px`
   (an inline style written by header9.js on every scroll frame) and animated
   `transition: top`, a property it never sets — so the entrance was an instant jump.
   It is the same surface language as the rest of Part 9–15 now: a round white glass
   chip, hairline border, wide soft shadow, teal glyph, and it fades + lifts into
   place off a class instead of an inline offset. */
#to_top{
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 8000;
    width: 42px;
    height: 42px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid rgba(18,86,74,.12);
    background: rgba(255,255,255,.82);
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    box-shadow: 0 12px 30px -14px rgba(26,62,55,.5);
    color: var(--sd-teal-600);
    /* hidden state — not display:none, so the transition has something to run on */
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity .25s ease, transform .25s ease, visibility .25s,
                background .18s ease, color .18s ease, box-shadow .18s ease;
}
#to_top.is-visible{
    opacity: 1;
    visibility: visible;
    transform: none;
}
#to_top svg{ width: 17px; height: 17px; }
.fixed_to_top:hover,.fixed_to_top:active,.fixed_to_top:focus{
    color: #fff;
    background: var(--sd-teal-600);
    border-color: var(--sd-teal-600);
    box-shadow: 0 14px 32px -12px rgba(14,138,114,.6);
}
@media (max-width: 640px){
    #to_top{ width: 38px; height: 38px; right: 12px; bottom: 14px; }
    #to_top svg{ width: 15px; height: 15px; }
}
@media (prefers-reduced-motion: reduce){
    #to_top{ transition: opacity .01s linear, visibility .01s linear; transform: none; }
}
.uk-accordion-title{
    padding-right: 15px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    line-height:2;
    font-size: 15px;
}
.uk-accordion-title::before
{
    height: 2em;
}
.uk-accordion-content{
    margin-top: 0;
}
@media (max-width: 500px)
{
    .box-login{
        box-shadow: unset;
        padding:15px 5px!important;
    }
    .box-user-reg{
        box-shadow: unset;
        padding:15px 5px!important;
    }
}
/* Part 7 / B2: section headers — one flex rule replaces the old 6-breakpoint
   float/percent layout. Same visual: bold title over a brand underline, a
   hairline running the rest of the row (RTL-aware via flex direction). */
.titr{
    display: flex;
    align-items: flex-end;
    gap: 10px;
}
.titr_hhh, .titr_hhh2{
    flex: 0 0 auto;
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: var(--sd-ink);
    border-bottom: 2px solid var(--sd-teal-400);
    padding: 0 2px 8px;
    line-height: 1.6;
}
.titr_hhh1, .titr_hhh3{
    flex: 1 1 auto;
    margin: 0;
    border-bottom: 1px solid var(--sd-line);
    padding-bottom: 9px;
}
@media(max-width: 768px)
{
    .col2{
        width: 15%;
    }
}
@media(max-width: 600px)
{

    .col2{
        width: 15%;
    }
    .col2>img{
        width: 35px;
        height: 35px;
    }
    .uk-alert-danger>h4{
        font-size: 14px;
    }
}
@media(max-width: 400px)
{

    .col2{
        width: 20%;
    }
    .col2>img{
        width: 20px;
        height: 20px;
    }
    .uk-alert-danger>h4{
        font-size: 14px;
    }
}

@media (min-width: 1150px) {
    .icon_div{
        padding: 5px;
        background: var(--sd-teal-600);
        height: 130px;
        width: 130px;
        line-height: 15px;
        border-radius: 50%;
    }
    .icon_div>p{
        font-size: 15px;
        color: white;
        margin-top: 20px;
    }
    .icon_pp>i{
        font-size: 40px;
        color: white;
    }
    .class_tel{
        margin-top: 130px!important;
    }
}
@media (max-width: 1150px) {
    .icon_div{
        padding: 5px;
        background: var(--sd-teal-600);
        height: 110px;
        width: 110px;
        line-height: 15px;
        border-radius: 50%;
    }
    .icon_div>p{
        font-size: 14px;
        color: white;
        margin-top: 20px;
    }
    .icon_pp>i{
        font-size: 35px;
        color: white;
    }
    .class_tel{
        margin-top: 130px!important;
    }
}
@media (max-width: 750px) {
    .icon_div{
        padding: 5px;
        background: var(--sd-teal-600);
        height: 90px;
        width: 90px;

        border-radius: 50%;
    }
    .icon_div>p{
        font-size: 12px;
        color: white;
        margin-top: 10px;
    }
    .icon_pp>i{
        font-size: 25px;
        color: white;
    }
    .class_tel{
        margin-top: 130px!important;
    }
}
@media (max-width: 520px) {
    .icon_div{
        padding: 5px;
        background: var(--sd-teal-600);
        height: 50px;
        width: 50px;

        border-radius: 50%;
    }
    .icon_div>p{
        font-size: 9px;
        color: white;
        margin-top: 4px;
    }
    .icon_pp>i{
        font-size: 30px;
        color: white;
    }
    .class_tel{
        margin-top: 80px!important;
    }
}
.icon_div:hover{
    box-shadow: 0 0 2px 1px rgba(0,0,0,0.3);

}
.call_a>i{
    font-size: 20px;
}
.call_a:hover
{
    color: var(--sd-teal-400)!important;
}

.m_top_mini{
    margin-top: -35px!important;
}
.level_1,.level_2,.level_3,.level_4{
    padding-left: 0!important;
    padding-right: 0!important;
}
.level_1>.level
{
    border: 2px solid #666;
    border-radius: 50%;
    font-size: 20px;
    font-weight: bold;
    padding: 3px 16px;
    background: #fff;
}
.level_1>.level_text
{
    margin-top: 15px!important;
    margin-bottom: 20px;
    font-size: 17px;
    font-weight: bold;
}
.level_1>.active_level
{
    background: var(--sd-teal-600);
    border: 2px solid #fff;
    box-shadow: 0 0 1px 1px #666;
    color: #fff;
    position: relative;
    top: -22px;
}
.level_2>.level
{
    border: 2px solid #666;
    border-radius: 50%;
    font-size: 20px;
    font-weight: bold;
    padding: 3px 15px;
    background: #fff;
}
.level_2>.level_text
{
    margin-top: 15px!important;
    margin-bottom: 20px;
    font-size: 17px;
    font-weight: bold;
}
.level_2>.active_level
{
    background: var(--sd-teal-600);
    border: 2px solid #fff;
    box-shadow: 0 0 1px 1px #666;
    color: #fff;
    position: relative;
    top: -22px;
}
.level_3>.level
{
    border: 2px solid #666;
    border-radius: 50%;
    font-size: 20px;
    font-weight: bold;
    padding: 3px 14px;
    background: #fff;
}
.level_3>.level_text
{
    margin-top: 15px!important;
    margin-bottom: 20px;
    font-size: 17px;
    font-weight: bold;
}
.level_3>.active_level
{
    background: var(--sd-teal-600);
    border: 2px solid #fff;
    box-shadow: 0 0 1px 1px #666;
    color: #fff;
    position: relative;
    top: -22px;
}
.level_4>.level
{
    border: 2px solid #666;
    border-radius: 50%;
    font-size: 20px;
    font-weight: bold;
    padding: 3px 14px;
    background: #fff;
}
.level_4>.level_text
{
    margin-top: 15px!important;
    margin-bottom: 20px;
    font-size: 17px;
    font-weight: bold;
}
.level_4>.active_level
{
    background: var(--sd-teal-600);
    border: 2px solid #fff;
    box-shadow: 0 0 1px 1px #666;
    color: #fff;
    position: relative;
    top: -22px;
}
.active_border{
    border-bottom: 2px solid var(--sd-teal-400);
    position: relative;
    top: 13px;
}
.btn_basket2{
    padding: 8.5px 15px;
    position: relative;
    top: 1px;
}
@media (max-width: 650px) {
    .level_1>.level_text
    {
        margin-top: 15px!important;
        margin-bottom: 20px;
        font-size: 13px;
        font-weight: 400;
    }
    .level_2>.level_text
    {
        margin-top: 15px!important;
        margin-bottom: 20px;
        font-size: 13px;
        font-weight: 400;
    }
    .level_3>.level_text
    {
        margin-top: 15px!important;
        margin-bottom: 20px;
        font-size: 13px;
        font-weight: 400;
    }
    .level_4>.level_text
    {
        margin-top: 15px!important;
        margin-bottom: 20px;
        font-size: 13px;
        font-weight: 400;
    }
    .m_top15600{
        margin-top: 15px!important;
    }
    .m_top12600{
        margin-top: 12px!important;
    }
}
.pos_top{
    position: relative;
    top: -22px;
}

/* ============================================================================
   Part 7 / Phase C — home "polish the old look" (additive only; no markup change).
   Scoped to existing home classes; overrides earlier rules by source order.
   ============================================================================ */

/* Rail section titles (فروش ویژه / جدیدترین‌ها / …): add a small teal accent tab
   before the text so the half-built header reads as a finished section label.
   Applies to all rails at once — pure CSS, no per-rail markup. */
.titr_hhh, .titr_hhh2{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'iransans2', sans-serif;
}
.titr_hhh::before, .titr_hhh2::before{
    content: "";
    flex: 0 0 auto;
    width: 5px;
    height: 16px;
    border-radius: 9px;
    background: var(--sd-teal-600);
}

/* The orphaned page <h1>: give it intentional weight + a centered accent underline
   so it stops floating above the banners. */
.baner > h1{
    font-family: 'iransans2', sans-serif;
    font-weight: 700;
    color: var(--sd-ink);
    margin: 8px 0 4px;
}
.baner > h1::after{
    content: "";
    display: block;
    width: 54px;
    height: 3px;
    border-radius: 3px;
    background: var(--sd-teal-400);
    margin: 12px auto 0;
}

/* ---- Trust bar: a clinical "guarantee strip" under the hero banners. The one
   bold new band on the page — everything else stays quiet (see-all pills, tabs). */
.sd-trust{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin: 16px 10px 6px;
}
.sd-trust-item{
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid var(--sd-line);
    border-radius: 14px;
    padding: 14px 16px;
    transition: transform .25s ease, box-shadow .25s ease;
}
.sd-trust-item:hover{
    transform: translateY(-3px);
    box-shadow: 0 12px 26px -14px rgba(35,49,45,.24);
}
/* P12: the tinted 46px box is gone — the glyph itself is now 46px. Size, colour
   and the hover animation are set in icons-theme.css, which loads after this. */
.sd-trust-ic{
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sd-trust-tx{ display: flex; flex-direction: column; line-height: 1.55; }
.sd-trust-tx > b{ font-family: 'iransans2', sans-serif; font-weight: 700; font-size: 14px; color: var(--sd-ink); }
.sd-trust-tx > span{ font-size: 11.5px; color: var(--sd-muted); }

/* ---- Rail headers: bigger title + a working «مشاهده همه» pill on the far end. */
.titr_hhh, .titr_hhh2{ font-size: 19px; }
.titr_hhh::before, .titr_hhh2::before{ height: 18px; }
.sd-seeall{
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 3px;
    font-family: 'iransansmed', 'iransans', sans-serif;
    font-size: 12.5px;
    color: var(--sd-teal-600);
    background: var(--sd-teal-050);
    border: 1px solid var(--sd-teal-100);
    padding: 6px 14px;
    border-radius: 999px;
    white-space: nowrap;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.sd-seeall:hover{ background: var(--sd-teal-600); color: #fff; border-color: var(--sd-teal-600); }
.sd-seeall > i{ font-size: 12px; }

@media(max-width: 640px){
    .sd-trust{ grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 12px 6px 4px; }
    .sd-trust-item{ padding: 11px 12px; gap: 9px; border-radius: 12px; }
    /* P12: glyph size now comes from icons-theme.css (--sd-ic-lg-sm) */
    .sd-trust-tx > b{ font-size: 12.5px; }
    .sd-trust-tx > span{ font-size: 10.5px; }
    .titr_hhh, .titr_hhh2{ font-size: 16px; }
    .sd-seeall{ font-size: 11px; padding: 5px 11px; }
}

/* ---- Category quick-nav: pill chips to the top-level shelves. Wrap on desktop,
   horizontal-scroll on mobile so it never stacks into many rows. */
.sd-cats{
    display: flex;
    flex-wrap: nowrap;              /* C17: single line at every width */
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 9px;
    margin: 14px 10px 4px;
    padding-bottom: 4px;
}
.sd-cats::-webkit-scrollbar{ display: none; }
.sd-cat{
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: 'iransansmed', 'iransans', sans-serif;
    font-size: 13px;
    color: var(--sd-ink);
    background: #fff;
    border: 1px solid var(--sd-line);
    border-radius: 999px;
    padding: 8px 16px;
    white-space: nowrap;
    transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease;
}
.sd-cat:hover{
    color: #fff;
    background: var(--sd-teal-600);
    border-color: var(--sd-teal-600);
    transform: translateY(-2px);
}
.sd-cat--all{
    color: #fff;
    background: var(--sd-teal-600);
    border-color: var(--sd-teal-600);
}
.sd-cat--all:hover{ background: #0b6f5c; }

.sd-cat > i{ color: var(--sd-teal-600); font-size: 12px; }
.sd-cat--all > i, .sd-cat:hover > i{ color: inherit; }

/* C16/C17 category scroll arrows: the strip is a single scrolling line at every
   width; JS puts .has-overflow on the wrap when the chips don't fit, which is
   what reveals the arrows (desktop wide enough = no arrows). */
.sd-cats-wrap{ position: relative; }
.sd-cats-nav{
    display: none;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: calc(50% - 4px);
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--sd-line);
    color: var(--sd-ink);
    box-shadow: 0 2px 10px -3px rgba(35,49,45,.3);
    z-index: 2;
    cursor: pointer;
    font-size: 13px;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.sd-cats-nav:hover{ background: var(--sd-teal-600); border-color: var(--sd-teal-600); color: #fff; }
.sd-cats-wrap.has-overflow .sd-cats-nav{ display: flex; }
.sd-cats-wrap.has-overflow .sd-cats{ padding-inline: 34px; }
.sd-cats-nav--next{ left: 4px; }   /* left edge (RTL) reveals more */
.sd-cats-nav--prev{ right: 4px; }

@media(max-width: 640px){
    .sd-cats{ margin: 12px 6px 4px; }
    .sd-cat{ font-size: 12px; padding: 7px 13px; }
}

/* ---- Featured shelf: the فروش ویژه rail sits on a teal-tinted band so the sale
   section visually outranks the other (white) rails. Inner panels go transparent
   (overrides .product-slider>div white bg by specificity + source order). */
.product-slider.sd-rail--featured{
    background: linear-gradient(160deg, var(--sd-teal-050), var(--sd-teal-100));
    border: 1px solid var(--sd-teal-100);
    border-radius: 18px;
    margin: 18px 10px 8px;
    padding: 4px 10px 10px;
}
.product-slider.sd-rail--featured > div{
    background: transparent;
    box-shadow: none;
}
.sd-rail--featured .titr{ background: transparent; }
.sd-rail--featured .titr_hhh1{ border-bottom-color: rgba(14,138,114,.22); }
/* pill reads better as a solid white chip on the tinted band */
.sd-rail--featured .sd-seeall{ background: #fff; border-color: #fff; }
.sd-rail--featured .sd-seeall:hover{ background: var(--sd-teal-600); border-color: var(--sd-teal-600); }
/* white hairline under the card bodies would vanish — strengthen card separation */
.sd-rail--featured .sd-card .sd-body{ border-color: rgba(255,255,255,.9); }
/* the card plates share the band's teal tints and melt into it — give cards a crisp
   white ring. (0,3,0) so it survives shivadent-card.css loading later; hover state
   restated so the card's lift shadow keeps working. */
.product-slider.sd-rail--featured .sd-card{
    border-radius: 24px;
    box-shadow: 0 0 0 2px rgba(255,255,255,.95), 0 8px 20px -14px rgba(35,49,45,.22);
}
.product-slider.sd-rail--featured .sd-card:hover{
    box-shadow: 0 0 0 2px #fff, 0 24px 46px -22px rgba(35,49,45,.30);
}

@media(max-width: 640px){
    .product-slider.sd-rail--featured{ margin: 12px 6px 6px; border-radius: 14px; padding: 2px 6px 6px; }
}

/* ---- Header refresh (C6, CSS-only): the category menu bar was menucss.css's gray
   #616161 with white 11px links, "|" separators and a hover caret — the last
   visibly dated band. Restyled white-on-hairline with ink links + teal hover.
   .stickytop kept in every selector so the scroll-stuck clone matches. */
.nav-menu-full-p, .stickytop{
    background: #fff;
    border-top: 1px solid var(--sd-line);
    border-bottom: 1px solid var(--sd-line);
    box-shadow: 0 6px 14px -12px rgba(35,49,45,.18);
    margin-bottom: 12px;
}
/* top-level bar items only (dropdown panels keep their own menucss.css colors) */
.nav-menu-full > li{ margin-left: 12px; }
.nav-menu-full > li > a{
    color: var(--sd-ink);
    font-family: 'iransansmed', 'iransans', sans-serif;
    font-size: 12.5px;
    padding: 0 4px 6px;
    transition: color .2s ease, box-shadow .2s ease;
}
.nav-menu-full > li:hover > a{
    color: var(--sd-teal-600);
    box-shadow: inset 0 -2px 0 var(--sd-teal-400);   /* underline w/o layout shift */
}
/* kill the dated "|" separators and the white hover caret */
.nav-menu-full-p .nav-menu > li:after,
.stickytop .nav-menu > li:after{ content: none; }
.nav-menu-full-p .nav-menu > li:hover > a:after,
.stickytop .nav-menu > li:hover > a:after{ content: none; }

/* search field: quiet resting state, clear teal focus ring */
.header_search_desktop .uk-search-input{
    background: #f8faf9;
    border: 1px solid var(--sd-line);
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.header_search_desktop .uk-search-input:focus{
    background: #fff;
    border-color: var(--sd-teal-400);
    box-shadow: 0 0 0 3px rgba(26,188,156,.15);
}

/* ---- برند ها header: match the rail-title treatment (accent tab + iransans2) */
.brand_slider>h3{
    width: auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'iransans2', sans-serif;
    font-size: 19px;
    font-weight: 700;
    color: var(--sd-ink);
}
.brand_slider>h3::before{
    content: "";
    flex: 0 0 auto;
    width: 5px;
    height: 18px;
    border-radius: 9px;
    background: var(--sd-teal-600);
}
@media(max-width: 640px){
    .brand_slider>h3{ font-size: 16px; }
}

/* ---- C9 service cards: replace the four p1–p4 image tiles. Same visual family
   as the trust bar but these are links: chevron cue + teal border on hover. */
.sd-services{
    display: grid;
    /* C17: minmax(0,1fr) — the nowrap labels otherwise set the tracks' min-content
       width and push the grid past the viewport on narrow screens */
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 16px 10px 6px;
}
.sd-service{
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid var(--sd-line);
    border-radius: 14px;
    padding: 14px 16px;
    text-decoration: none;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.sd-service:hover{
    transform: translateY(-3px);
    border-color: var(--sd-teal-100);
    box-shadow: 0 12px 26px -14px rgba(35,49,45,.24);
}
/* P12: box removed — see the note on .sd-trust-ic above. */
.sd-service-ic{
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sd-service-tx{ display: flex; flex-direction: column; line-height: 1.55; min-width: 0; }
.sd-service-tx > b{ font-family: 'iransans2', sans-serif; font-weight: 700; font-size: 13.5px; color: var(--sd-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sd-service-tx > span{ font-size: 11px; color: var(--sd-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sd-service-go{
    margin-inline-start: auto;
    color: var(--sd-muted);
    font-size: 14px;
    transition: color .2s ease, transform .2s ease;
}
.sd-service:hover .sd-service-go{ color: var(--sd-teal-600); transform: translateX(-3px); }

@media(max-width: 960px){
    .sd-services{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media(max-width: 640px){
    .sd-services{ gap: 8px; margin: 12px 6px 4px; }
    .sd-service{ padding: 11px 12px; gap: 9px; border-radius: 12px; }
    /* P12: glyph size now comes from icons-theme.css (--sd-ic-lg-sm) */
    .sd-service-tx > b{ font-size: 12px; }
    .sd-service-tx > span{ font-size: 10px; }
}

@media (prefers-reduced-motion: reduce){
    .sd-trust-item, .sd-cat, .sd-seeall, .sd-service, .sd-service-go{ transition: none; }
    .sd-trust-item:hover, .sd-cat:hover, .sd-service:hover, .sd-service:hover .sd-service-go{ transform: none; }
}

/* ---- C10 hero rebalance: tagline under the h1; every ad/slider surface in the
   hero + banner rows gets one uniform frame (radius + hairline ring) so the
   admin-uploaded artwork reads as a curated set instead of raw rectangles. */
.sd-tagline{
    margin: 6px auto 2px;
    font-size: 13px;
    color: var(--sd-muted);
    line-height: 1.8;
}
.baner .uk-slideshow-items,
.slider .uk-slideshow-items{
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 0 0 1px var(--sd-line);
    background: #fff;
}
.baner .uk-slideshow-items img,
.slider .uk-slideshow-items img{
    transition: transform .4s ease;
}
.baner:hover .uk-slideshow-items img{
    transform: scale(1.02);
}
@media (prefers-reduced-motion: reduce){
    .baner .uk-slideshow-items img, .slider .uk-slideshow-items img{ transition: none; }
    .baner:hover .uk-slideshow-items img{ transform: none; }
}
@media(max-width: 640px){
    .sd-tagline{ font-size: 11px; padding: 0 14px; }
    .baner .uk-slideshow-items, .slider .uk-slideshow-items{ border-radius: 12px; }
}

/* ---- C11 news/articles/journals: card-ified columns. Overrides the legacy
   block above (equal-or-higher specificity, later in source). */
.box_s{
    border-radius: 16px;
    border: 1px solid var(--sd-line);
    box-shadow: none;
    overflow: hidden;
    padding-bottom: 4px;
}
.box_s>.header_news{
    background: #fff;
    height: auto;
    line-height: 1.6;
    padding: 13px 16px 9px;
    border-bottom: 1px solid var(--sd-line);
    border-radius: 0;
    text-align: right;
}
/* Part 13 / P8: was <h4> — promoted to <h2> so the home page stops skipping a
   heading level (h1 → h2 → h4). line-height restated: UIkit gives h2 1.3, h4 1.4. */
.box_s>.header_news>h2{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: var(--sd-ink);
    font-family: 'iransans2', sans-serif;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.4;
}
.box_s>.header_news>h2::before{
    content: "";
    flex: 0 0 auto;
    width: 4px;
    height: 15px;
    border-radius: 9px;
    background: var(--sd-teal-600);
}
.box_s>a>.body_news{
    border: none;
    border-bottom: 1px solid #f1f4f3;
    border-radius: 0;
    margin: 0;
    padding: 10px 12px;
}
.box_s>a:last-of-type>.body_news{ border-bottom: none; }
.box_s>a>.body_news:hover{
    box-shadow: none;
    background: var(--sd-teal-050);
}
.box_s>a>.body_news>.img_news>img{
    width: 100%;
    height: 64px;
    object-fit: cover;
    border-radius: 10px;
}
.box_s>a>.body_news>.text_news>.title{
    color: var(--sd-ink);
    font-size: 12.5px;
    line-height: 1.7;
}
.news_all_link>a{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: 'iransansmed', 'iransans', sans-serif;
    font-size: 12.5px;
    color: var(--sd-teal-600);
    background: var(--sd-teal-050);
    border: 1px solid var(--sd-teal-100);
    padding: 6px 14px;
    border-radius: 999px;
}
.news_all_link>a:hover{
    box-shadow: none;
    background: var(--sd-teal-600);
    border-color: var(--sd-teal-600);
    color: #fff;
}

/* ---- C12 footer refresh: one continuous brand-ink block (social band → columns
   → copyright) replacing the gray #313131/#4a4a4a patchwork. Overrides the
   legacy footer rules above; the !importants below counter legacy !importants. */
.solid_footer{
    height: auto;
    padding: 16px 0 6px;
    background: var(--sd-ink);
    box-shadow: none;
    margin-top: 24px;
}
.solid_footer>ul>li{
    background: transparent;
    border-radius: 0;
    height: auto;
    margin: 0 5px;
    padding: 0;
}
.solid_footer>ul>li:hover{
    background: transparent;
    height: auto;
    margin-top: 0;
}
/* P12: the 42px pill is gone — the glyph itself is now 42px. Colour, size and the
   hover lift come from icons-theme.css, which loads after this file. */
.solid_footer>ul>li>a{
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: 0;
    transition: color .2s ease;
}
.footer{
    background: var(--sd-ink);
    padding: 24px 20px 20px;
}
.footer>div>div>.footer-title,
.footer>div>div>a>.footer-title{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-bottom: none!important;
    padding-bottom: 0;
    margin-bottom: 12px;
    font-family: 'iransans2', sans-serif;
    font-size: 15px;
    line-height: 1.4;
}
.footer>div>div>.footer-title::before,
.footer>div>div>a>.footer-title::before{
    content: "";
    flex: 0 0 auto;
    width: 4px;
    height: 15px;
    border-radius: 9px;
    background: var(--sd-teal-400);
}
.footer>div>div>p{
    color: rgba(255,255,255,.78);
    font-size: 12.5px;
    line-height: 2;
}
.footer>div>div>p>i,
.footer>div>div>p>a>i{
    color: var(--sd-teal-400);
    font-size: 15px;
}
.footer>div>div>p>a{
    color: rgba(255,255,255,.78);
}
.order{
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.04);
    border-radius: 14px;
}
.order>p{
    color: rgba(255,255,255,.72);
    font-size: 12px;
    line-height: 1.9;
}
.order>a{
    display: inline-block;
    margin-top: 4px;
    padding: 7px 18px;
    border-radius: 10px;
    font-size: 12.5px;
}
.order>a:hover{
    box-shadow: none;
    background: var(--sd-teal-400);
}
.copy_right_ss{
    background: #1c2824;
    color: rgba(255,255,255,.6);
    font-size: 12px;
    padding: 12px 10px;
}

/* ---- C13/C19 compact sticky header: a fixed bar that slides down on scroll,
   sitting BELOW the always-fixed 35px teal top bar (.header_desktop /
   .header_tablet) so that bar — nav, login, basket — never disappears. Separate
   from the in-flow header → no layout shift.
   Positioning: anchored top:0, hidden = translateY(-100%) (fully clears the
   viewport, no peeking), shown = translateY(35px) (drops below the teal bar).
   z-index sits BELOW the 9999 teal bars so it slides out from behind them. */
.sd-ministicky{
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 9000;
    background: #fff;
    border-bottom: 1px solid var(--sd-line);
    box-shadow: 0 6px 18px -12px rgba(35,49,45,.25);
    transform: translateY(-100%);
    transition: transform .28s ease;
    will-change: transform;
}
.sd-ministicky.is-shown{ transform: translateY(35px); }
.sd-ministicky-inner{
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 7px 20px;
}
.sd-ministicky-logo{ flex: 0 0 auto; display: flex; align-items: center; }
.sd-ministicky-logo img{ height: 34px; width: auto; }
.sd-page-title{
    margin: 18px 0 14px;
    color: var(--sd-ink);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.55;
}
/* search = the same rounded pill + teal «جستجو» button as the main header search,
   but width-capped and centred so it isn't a full-width bar on desktop */
.sd-ministicky-search{
    flex: 0 1 400px;
    max-width: 400px;
    margin-inline: auto;
    display: flex;
    align-items: center;
    height: 38px;
    background: #fff;
    border: 1px solid var(--sd-line);
    border-radius: 20px;
    overflow: hidden;
}
.sd-ministicky-search input{
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    padding: 0 15px;
    font-family: 'iransans', sans-serif;
    font-size: 13px;
    color: var(--sd-ink);
}
.sd-ministicky-search button{
    flex: 0 0 auto;
    border: 0;
    cursor: pointer;
    background: var(--sd-teal-600);
    color: #fff;
    border-radius: 20px;
    width: 92px;
    height: 32px;
    margin: 2px;
    font-family: 'iransans2', sans-serif;
    font-size: 13px;
}
.sd-ministicky-search button:hover{ background: #0b6f5c; }
/* C21 (#7): sticky search on ALL widths (mobile wanted it back). It sits below
   the always-fixed 35px teal bar and covers the in-flow header as it scrolls
   under — one search, header + search stuck together, fav/compare gone. */
@media(max-width: 640px){
    .sd-ministicky-inner{ gap: 10px; padding: 6px 10px; }
    .sd-ministicky-logo img{ height: 28px; }
    .sd-ministicky-search{ height: 34px; flex: 1 1 auto; max-width: none; }
    .sd-ministicky-search input{ font-size: 12px; padding: 0 12px; }
    .sd-ministicky-search button{ width: 70px; height: 28px; font-size: 12px; }
    /* S7: the long placeholder needs a smaller font to fit on narrow screens
       (only the placeholder shrinks — typed text keeps its size) */
    .header_search_desktop .uk-search-input::placeholder,
    .sd-ministicky-search input::placeholder{ font-size: 10.5px; }
    .header_search_desktop .uk-search-input::-webkit-input-placeholder,
    .sd-ministicky-search input::-webkit-input-placeholder{ font-size: 10.5px; }
}
@media (prefers-reduced-motion: reduce){ .sd-ministicky{ transition: none; } }

/* ---- C14 rail nav: the native prev/next arrows surfaced OVER a card on hover
   and can't be lifted into the header (they must live inside the slider's
   overflow:hidden container). So hide them and drive the slider from slim
   circular buttons in the header, beside the «مشاهده همه» pill, via a proxy
   click (see index.blade @section js). Scoped to home rails via .sd-railnav. */
.sd-railnav a[uk-slider-item]{ display: none; }
/* C17 (#7): unified segmented control — [prev] مشاهده همه [next] in one pill */
/* C21 (#5): bigger, higher-contrast rail arrows — teal-050 fill, teal-600 icons */
.sd-railnav-btns{
    display: inline-flex;
    align-items: stretch;
    margin-bottom: 3px;
    background: var(--sd-teal-050);
    border: 1px solid var(--sd-teal-400);
    border-radius: 999px;
    overflow: hidden;
}
.sd-railnav-btns button{
    width: 44px;
    height: 36px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--sd-teal-600);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 18px;
    transition: background .2s ease, color .2s ease;
}
.sd-railnav-btns button:hover{
    background: var(--sd-teal-600);
    color: #fff;
}
/* the two arrow buttons share the pill with a divider between them */
.sd-railnav-btns button + button{ border-inline-start: 1px solid var(--sd-teal-400); }
.sd-rail--featured .sd-railnav-btns{ border-color: #fff; background: #fff; }
.sd-rail--featured .sd-railnav-btns button + button{ border-inline-start-color: var(--sd-teal-100); }
@media(max-width: 640px){
    /* touch users swipe the rail (and tap the end card) — hide the header arrows */
    .sd-railnav-btns{ display: none; }
}

/* C21: «مشاهده بیشتر» end card — last slide, links to the full listing.
   HALF the width of a product card; height flex-fills the li (the slider row
   stretches every li to the tallest product card, so it matches on every
   breakpoint). Solid teal-600 (the search-button colour) with white text and a
   white circle holding a big dark arrow, so it reads as a clear call to action. */
.product-slider .uk-slider-items > li:has(> .sd-rail-more){ box-sizing: border-box; display: flex; width: 132px; min-width: 132px; padding: 12px 8px 20px; }
.sd-rail-more{
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 12px;
    text-align: center;
    border-radius: 24px;
    background: var(--sd-teal-600);
    color: #fff;
    text-decoration: none;
    font-family: 'iransans2', sans-serif;
    font-size: 14px;
    transition: background .25s ease, transform .25s ease;
}
.sd-rail-more:hover{ background: #0b6f5c; transform: translateY(-4px); }
.sd-rail-more-ic{
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: #fff;
    color: var(--sd-ink);          /* big dark arrow on a white disc — clearly visible */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    transition: transform .25s ease;
}
.sd-rail-more:hover .sd-rail-more-ic{ transform: translateX(-4px); }
@media (max-width: 640px){
    .product-slider .uk-slider-items > li:has(> .sd-rail-more){ width: 22vw; min-width: 0; padding: 8px 5px 14px; }
    .sd-rail-more{ border-radius: 18px; gap: 10px; font-size: 12px; }
    .sd-rail-more-ic{ width: 40px; height: 40px; font-size: 18px; }
}
@media (prefers-reduced-motion: reduce){
    .sd-rail-more, .sd-rail-more-ic{ transition: none; }
    .sd-rail-more:hover{ transform: none; }
    .sd-rail-more:hover .sd-rail-more-ic{ transform: none; }
}
/* C17 (#3) + C18: every rail is ONE panel with the featured band's geometry —
   the header row and slider used to be two separate white boxes with a strip of
   page background between them. Plain rails get the white card here; the
   featured rail keeps its teal gradient (excluded via :not). Cards clip on the
   same 18px curve everywhere. */
.product-slider.sd-railnav:not(.sd-rail--featured){
    background: #fff;
    border: 1px solid var(--sd-line);
    border-radius: 18px;
    margin: 18px 10px 8px;
    padding: 4px 10px 10px;
}
.product-slider.sd-railnav:not(.sd-rail--featured) > div{
    background: transparent;
    box-shadow: none;
}
.sd-railnav .titr{ background: transparent; }
.sd-railnav .uk-slider-container{ border-radius: 18px; }
@media(max-width: 640px){
    .product-slider.sd-railnav:not(.sd-rail--featured){ margin: 12px 6px 6px; border-radius: 14px; padding: 2px 6px 6px; }
}

/* ---- C15 responsive consistency: the icon rows (trust bar + service cards) both
   drop to 2-up on tablet so they never disagree or cramp mid-range. The trust
   bar used to stay 4-across until 640, wrapping its labels to 2–3 lines at ~768. */
@media(max-width: 960px){
    .sd-trust{ grid-template-columns: repeat(2, 1fr); }
    .sd-trust-item{ padding: 13px 14px; }
}



/* ============================================================
   Part 16 — the <picture> wrapper fix
   ------------------------------------------------------------
   responsive_img() (App\Services\ResponsiveImage::picture) emits a bare <img> when
   no WebP derivative has been generated for a file, and <picture><source><img>
   when one has. Several sizing rules written before that helper existed target the
   image as a DIRECT CHILD — `.img_news > img`, `td > img`, `.basket_table > div >
   img` — so they silently stopped applying to exactly the images that DO have a
   WebP variant.

   The visible result was the reported one: on the home page the اخبار / مقالات /
   مجلات columns were different heights because some thumbnails were clamped to
   64px and their neighbours rendered at full size, and the basket table had rows
   of wildly different heights for the same reason.

   These restate the same intent with a descendant combinator, so they hold whether
   or not the helper wrapped the image. Later in source than the originals, so no
   specificity fight.
   ============================================================ */
.box_s .body_news .img_news picture,
.basket_page picture,
.basket_table picture{ display: block; }

/* home: اخبار / مقالات / مجلات list thumbnails — one fixed 64px band, always */
.box_s .body_news .img_news img{
    width: 100%;
    height: 64px;
    object-fit: cover;
    border-radius: 10px;
}

/* basket: desktop table cell + the tablet/mobile cards */
.basket_page td img{
    width: 100px;
    height: 90px;
    object-fit: contain;
}
.basket_page .basket_table > div img{
    width: 90px;
    height: 80px;
    object-fit: contain;
}

/* ---- Part 16 / P24: equal-height content columns -----------------------------
   The three home columns are independent cards in a plain uk-grid, so each one was
   as tall as its own content and the row bottom was ragged. Stretching them makes
   the block read as one shelf regardless of how many items each column holds. */
.news_box{ display: flex; }
.news_box > .box_s{ flex: 1 1 auto; display: flex; flex-direction: column; }
.news_box > .box_s > .news_all_link{ margin-top: auto; }
