
html {
    scroll-behavior: smooth !important;
  }

  .pswp--open{
    z-index: 99999999 !important;
  }

  .header.is-fixed .header-inner{
    z-index: 9999999;
  }

  #overlay_cookie_alert{
     z-index: 9999999;
  }

  .dropdown--content.fade-up.is-active{
    z-index: 9999999;
  }

  #overlay_login_outer {
    z-index: 999999999;
  }

  .filter-dropdown{
    z-index: 9999999;
  }
  
  ::-webkit-scrollbar {
    width: 14px !important;
    height: 14px !important;
    display: block !important;
  }
  
  ::-webkit-scrollbar-track {
    background: #121212 !important;
    border-radius: 10px !important;
  }

  ::-webkit-scrollbar-thumb {
    background-image: linear-gradient(145deg, #4ade80, #bf5af2) !important;
    background-color: #4ade80 !important; 
    border-radius: 10px !important;
    border: 3px solid #121212 !important;
  }

  ::-webkit-scrollbar-thumb:hover {
    background-image: linear-gradient(145deg, #22c55e, #a855f7) !important;
  }

  * {
    scrollbar-width: auto;
    scrollbar-color: #4ade80 #121212;
  }

  .mycontainer{
    max-width: 1530px !important;
    display: block !important;
    margin: 0 auto !important;
  }

:root {
    --neon-green: #4ade80;
    --neon-pink: #e910cb;
    --bg-dark: #121619;
    }
    body {
        margin: 0;
        font-family: "Nunito", "Helvetica", sans-serif;
        font-size: 1.4rem;
        font-weight: 400;
        line-height: 1.5;
        color: #fff;
        text-align: left;
        background-color: #1b1f22;
    }

    .my-custom-wrapper {
        display: flex;
        width: 100%;
        height: 40rem;
    }

    .tippy-box {
  
        color: #333;
       
    }

 

    @media (max-width: 1820px) {
        .my-custom-wrapper {

            height: 50rem;
        }
    }

    
    @media (max-width: 1690px) {
        #box_top_content{
            padding: 45rem 0 5rem 0 !important;
        }

       /*  .banner_start_big-carousel > .flickity-viewport {
            height: 21rem !important;
        } */
    }



    @media (max-width: 575.98px) {
        body.design_subver4 #page_PopupContainer.shop_popup_compare {
            max-width:100vw;
            max-height: 100vh;
            max-height: 100dvh;
        }

        body.design_subver4 .compare__row--iconmore img, body.design_subver4 .compare__row--icon img {
            max-height: 16px;
        }

        /* .banner_start_big-carousel > .flickity-viewport {
            height: 11rem !important;
        } */
    }



    .page_artref_inner {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 20px !important;
        flex: 0 0 calc(40% - 10px) !important;
    }

    #box_art_content {
        width: 50% !important;
        padding: 20px !important;
    }


    .my-custom-wrapper > div {
        width: 100% !important;
        padding: 20px 0;
    }

    @media (max-width: 991px) {

        #header_logo_img{
                width: 150px;
            display: block;
            margin: 0 auto;
        }
        
        .page_shop_start .start_artref, .page_shop_start .box_blog {
            flex:0 0 100%;
        }

        .product__badge-sale.badge--sale{
            font-size: 13px !important;
            padding: 0 4px !important;
        }

        #box_top_content {
            padding: 40rem 0 5rem 0 !important;
        }
       
    }

    #page_start_content {
        display: contents !important;
    }

    .category-a, #box_art_content {
        flex: 0 0 49% !important;
        max-width: 49% !important;
        display: block !important;
        float: none !important;
        padding: 20px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* Alap Switch stÃ­lus */
    .layout-switch {
        position: relative;
        display: inline-block;
        width: 50px;
        height: 24px;
        margin: 0 10px;
    }
    .layout-switch input { opacity: 0; width: 0; height: 0; }
    .slider {
        position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;
        background-color: #ccc; transition: .4s; border-radius: 24px;
    }
    .slider:before {
        position: absolute; content: ""; height: 16px; width: 16px; left: 4px; bottom: 4px;
        background-color: white; transition: .4s; border-radius: 50%;
    }
    input:checked + .slider { background-color: #2196F3; }
    input:checked + .slider:before { transform: translateX(26px); }

  
    body.alt-layout {
        background-color: #f0f4f8;
    }
    body.alt-layout .header {
        background-color: #333; 
        color: #fff;
    }
    body.alt-layout .logo {
        filter: grayscale(1) invert(1); 
    }
   
    body.alt-layout .main {
        display: flex;
        flex-direction: column-reverse; 
    }
    

    /* Alaphelyzet: az A kontÃ©ner lÃ¡tszik, a B rejtve van */
    .category-a { display: block;    width: 50% !important;
        padding: 20px !important;
        color: #ffffff !important;
    
    }
    .category-b { display: none; }

    /* Switch Ã¡llapot: az A elrejtve, a B megjelenik */

    .category-a, .category-b { transition: opacity 0.3s ease; }

    body.alt-layout .category-a { display: none !important; }
    body.alt-layout .category-b { display: block !important; }

    #box_art_content{
        color:#57e1a0 !important;
        display: none !important;
    }

  

    .product__inner {
        margin: 0 auto;
        position: relative;
     /*    max-width: 264px; */
        display: flex;
        flex-direction: column;
        height: 100%;
        background-color: var(--card-bg);
        border-radius: var(--card-radius);
        font-family: 'Nunito', sans-serif;
      /*   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); */
        border: 1px solid rgba(255, 255, 255, 0.05);
        transition: transform 0.3s ease;
        padding: 0 !important;
    }

	.product__inner:hover{
		/* scale:1.04 !important; */
        box-shadow: 0px 50px 46px rgba(0, 0, 0, .3);
	}
    

    .type--2 > .product__inner{
        max-width: 800px;
    }

    .type--2 .product__cart-col{
        background-color: #1b1f22;
    }

    .product__params, .product__stock{
        display: none !important;
    }

    .type--1 .product__main-btn {
        min-width: 9rem;
    }

    #page_PopupContainer_tooltip, #page_PopupContainer:not(.shop_popup_exitpopup){
        background: #1b1f22;
    }

    .product__main-btn,.blog__btn-more{
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        padding: 14px 28px;
        background: linear-gradient(145deg, #4ade80, #bf5af2);
        border: 2px solid rgba(255, 255, 255, 0.2);
        border-radius: 100px;
        color: #fff;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0.5px;
        cursor: pointer;
        overflow: hidden;
        transition: all 0.4s ease-in-out;
        box-shadow: 0 0 20px rgba(0, 255, 255, 0.1);
        backdrop-filter: blur(8px);
        z-index: 1;
    }

    .product__main-btn::before,.blog__btn-more::before {
        content: "";
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: conic-gradient(from 0deg, #4ade80, #bf5af2, #4ade80);
        animation: rotate 4s linear infinite;
        z-index: -2;
        }

        .product__main-btn::after,.blog__btn-more::after {
        content: "";
        position: absolute;
        inset: 2px;
        background: #1b1f22;
        border-radius: inherit;
        z-index: -1;
        }


        @keyframes border-glow {
            0% {
                --angle: 0deg;
            }
            100% {
                --angle: 360deg;
            }
        }
        
        *, *::before, *::after {
            box-sizing: border-box;
        }
        
        .product__inner:not(.is-fodrasz, .is-otthon) {
            position: relative;
            border-radius: 12px; /* Tetszőleges sarkítás */
            overflow: hidden;
            justify-content: center;
            transition: all 0.4s ease-in-out;
            box-shadow: 0 0 20px rgba(0, 255, 255, 0.1);
            z-index: 1;
        }
        
        /* Maga a 2px-es animált keret */
        .product__inner:not(.is-fodrasz, .is-otthon)::before {
            content: "";
            position: absolute;
            inset: 0;
            padding: 2px; /* EZ A KERET VASTAGSÁGA */
            border-radius: inherit;
            background: conic-gradient(from var(--angle, 0deg), #4ade80, #bf5af2, #4ade80);
            z-index: 99999;
            /* Kivágja a belsejét, így csak a keret marad meg */
            -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
            
            animation: rotate-angle 4s linear infinite;
            pointer-events: none;
        }
        
        @keyframes rotate-angle {
            to {
                /* Ha a böngésző támogatja a trükköt, a háttér forgásszögét módosítja */
                filter: hue-rotate(360deg);
            }
        }

        .subscribe-newsletter-box__name, .subscribe-newsletter-box__address, .subscribe-newsletter-box__email {
            border-color: #a376d7;
        }

        .is-done .order-step__icon{
            border:0;
        }

        .trancy-und{
            overflow: hidden;
        }

        .product_link_promo{
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 9999;
        }

        .product_link_normal{
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 9999;
        }

        .product__main-btn:hover,.blog__btn-more:hover {
        transform: scale(1.05);
        box-shadow: 0 0 40px rgba(0, 255, 255, 0.2);
        transition: all 2s;
        }

        .product__main-btn:hover .arrow {
        transform: translateX(6px);
        transition: all 2s;
        }

        .arrow {
        width: 22px;
        height: 22px;
        transition: transform 0.3s ease-in-out;
        color: #00ffff;
        }

        @keyframes rotate {
        0% {
            transform: rotate(0deg);
        }
        100% {
            transform: rotate(360deg);
        }
        }


    /* Az akciÃ³s plecsni (badge--sale) */
    .product__badge-sale.badge--sale {
        background-image: linear-gradient(transparent, transparent), linear-gradient(135deg, #bf5af2 0%, #4ade80  100%) !important;
        background-origin: border-box !important;
        background-clip: padding-box, border-box !important;
        background: transparent;
        border-radius: 10px 0px 0px 10px !important;
        font-weight: 800 !important;
        font-size: 14px;
        padding: 0px 10px;
        position: absolute !important;
        top: 0 !important;
        right: 0px !important;
        display: flex !important;
        align-items: center;
        z-index: 10;
    }

    /* Ha az UNAS % jelet tesz utÃ¡na a :after-el */
    .product__badge-sale.badge--sale span:after {
        content: "%";
        margin-left: 1px;
    }

    /* Az "ÃšJ" plecsni stÃ­lusa (hogy ne Ã¼ssÃ©k egymÃ¡st) */
    .product__badge-new.badge--new {
        color: #fff !important;
        position: relative;
        top: 0px !important;
        right: 0px !important;
        border: 2px solid transparent;
        background-image: linear-gradient(transparent, transparent), linear-gradient(135deg, #bf5af2 0%, #4ade80  100%) !important;
        background-origin: border-box !important;
        background-clip: padding-box, border-box !important;
        background: transparent;
        border-radius: 0px 10px 10px 0px !important;
        font-weight: 800 !important;
        font-size: 14px !important;
    }

    .product__badge-new.badge--new span{
        color: pink !important;
    }

    .favourites__icon {
        padding-top: 0px;
    }

    .product__func-btn {
        opacity: 0;
        transition: opacity 0.3s ease !important;
        background-image: linear-gradient(transparent, transparent), linear-gradient(135deg, #bf5af2 0%, #4ade80  100%) !important;
        backdrop-filter: blur(5px); /* ÃœveghatÃ¡s */
        border-radius: 50% !important;
        color: white !important;
    }

    /* Hoverre megjelennek */
    .product__inner:hover .product__func-btn {
        opacity: 1;
        transition: all 2s;
    }

    /* A gombok ikonjainak szÃ­ne */
    .product__func-icon {
        color: #ffffff !important;
    }


    .product__inner {
        background: linear-gradient(
            267deg, #121416 0%, #393a3b 35%, #393a3b 65%, #121416 100%) !important;
        border-radius: 20px !important;
        
        border: 1px solid rgba(255, 255, 255, 0.05) !important;
    }
        
    .type--1 .product__prices-wrap{
        text-align: left !important;
       
    }

    .color_green{
        color: #4ade80 !important
    }
    
    .color_purple{
        color: #833987 !important
    }

    .type--1 .product__prices {
        padding: 3rem 0 0 !important;
    }

    .last-seen-product-box{
        background-color: #1b1f22 !important;

    }

    .flickity-button{
        background-color: #1b1f22;
    }

    .flickity-button:hover{
        background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);;
    }

    .product__price-sale {
        line-height: 1 !important;
        letter-spacing: -0.5px !important;
        font-size: 1.4rem !important;
        text-shadow: black 1px 2px 1px;
    }

    .product__price-base{
        line-height: 1 !important;
        letter-spacing: -0.5px !important;
        font-size: 1.2rem !important;
        text-shadow: black 1px 2px 1px;
    }

    .has-sale-price .product__price-base{
        text-shadow: black 1px 2px 1px;
    }

    .type--1 .product__name-wrap::after {
 
        border-bottom: 0px !important;
       
    }

    .type--1 .product__name-wrap {
        position: relative;
        padding: 0 0 0rem 0;
        text-align: center;
    }

    .product__badges {
        width: 50px;
        height: 80px;
        position: absolute;
        top: 0;
        right: 0rem;
        bottom: 0;
        left: 0;
        z-index: 10;
        display: flex;
        flex-direction: column;
    }

    .badge {
        height: 2rem !important;
        line-height: 2rem;
    }

    .type--1 .product__name {
        font-size: 1.3rem !important;
        text-align: center !important;
        text-shadow: #833987  1px 2px 1px;
        color: #fff !important;
        margin: 0px 25px;
        text-transform: capitalize;
    }

    .product__price-base-value{
         text-shadow: #833987  1px 2px 1px;
        color: #fff !important;
    }

 
    .btn-primary:hover, .btn-primary:focus, .btn-primary:active ,.blog__btn-more:hover{
        background-color: #bf5af2 !important;
        border-color: #4ade80  !important;
        transition: all 2s;
    }

   

    .product__func-btn {
        display: inline-block;
        vertical-align: middle;
        text-align: center;
        position: relative;
        cursor: pointer;
        transition: color 0.4s;
        margin-bottom: 0.5rem;
        border-radius: 50%;
        background: rgb(149 14 14 / 80%);
        border: 0 solid transparent;
        font-size: 1.3rem;
        width: 2.5rem;
        height: 2.5rem;
        line-height: 2.5rem;
        margin: 3px 2px;
    }

    /* A kÃ¡rtya fÅ‘ kontÃ©nere */
    .blog-items > .page_content_item {
        position: relative;
        width: 100%;
        max-width: 200px;
        border-radius: 15px;
        overflow: hidden;
        background-color: #000;
        border: 1px solid rgba(255, 255, 255, 0.1);
        padding: 10px !important;
        margin: 5px 5px;
    }

    
    #box_top_content{
        padding: 20rem 0 5rem 0;
    }

    #box_top_content3{
        padding: 6rem 0 0 0;
    }

    

    /* A kÃ©p beÃ¡llÃ­tÃ¡sa, hogy kitÃ¶ltse a hÃ¡tteret */
    .page_content_item .page__image-wrap {
        width: 100%;
        height: 100%;
        margin: 0 !important;
        padding: 0 !important;
    }

    .page_content_item img {
        width: 100%;
        height: 100%;
        object-fit: cover; 
        display: block;
    }


    .page_content_item .page__content {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 20px;

        background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.4) 50%, transparent 100%);
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        min-height: 50%;
    }


    .blog-item__title, .blog-item__title a {
        color: #3cf38e !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        text-decoration: none !important;
        text-transform: none;
        text-shadow: 0 0 10px rgba(60, 243, 142, 0.3);
        height: 100%;
        width: 100%;
        z-index: 99;
        background: #1b1f22;
        padding: 5px 0 5px 0;
        text-align: center !important;
    }

    /* Hover effekt (opcionÃ¡lis) */
    .page_content_item:hover img {
        transform: scale(1.05);
        transition: transform 0.5s ease;
    }

    .blog{
        padding: 0px !important;
    }

    .blog-item__intro{
        display: none !important;
    }

    .blog-item__details-btn-wrap{
        display: none !important;
    }

    .blog-item__date-layer{
        display: none !important;
    }

    .btn-primary{
        color: #000000;
        background-color: #3cf38e;
        border-color: #222222;
    }


    .blog-item__inner{
        position: relative;
        width: 100%;
        max-width: 500px;
        overflow: hidden;
        border-radius: 12px;
        border: 2px solid rgba(170, 170, 170, .3);
        width: 300px;
    }

    .blog-item__img-wrap{
        margin-bottom: 0 !important;
    }

    .page_content_item:nth-child(3n+1) .blog-item__title a{
        color: #bf5af2 !important; /* Lila */
    }

    .page_content_item:nth-child(3n+2) .blog-item__title a {
        color: #2ecc71 !important; /* ZÃ¶ld */
    }

    .btn {
        display: inline-block;
        font-weight: 700;
        color: #ffffff !important;
        text-align: center;
        vertical-align: middle;
        user-select: none;
        background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
       
        padding: 1rem 1rem;
        font-size: 1.2rem;
        line-height: 1.1;
        border-radius: 1rem;
        transition: color 0.2s, background-color 0.2s, border-color 0.2s;
        text-shadow: black 1px 1px 1px;
    }

/*     .my-custom-wrapper > div{
        height: 400px !important;
    } */

    .neon-gradient {
        background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
        }

        .layoutToggleClass {
            background: linear-gradient(to right, #2ecc71, #bf5af2);
        }

        .bg-primary {
            background-color: #1b1f22 !important;
            box-shadow: 0 0 15px rgba(191, 90, 242, 0.3), 0 0 30px rgba(0, 242, 234, 0.2);
        }

        .footer {

            background-color: #151718;
        
        }

        .start_brand_slider {
            width: 90%;
            text-align: center;
            background: rgba(30, 33, 37, 0.8);
            backdrop-filter: blur(10px);
            border-radius: 20px;
            padding: 30px 40px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 2px;
            border: 1px solid rgba(0, 242, 234, 0.3);
            box-shadow: 0 0 20px rgba(0, 242, 234, 0.15), inset 0 0 10px rgba(255, 255, 255, 0.05);
            position: relative !important;
            left: 5%;
        }

        .filter-side-box-wrapper{
            background-color: #161a1d;
        }

        .artdet__data-right {
            background-color: #171a1c;
        }

        .filter-buttons button span {
            font-size: 1.9rem;
            vertical-align: middle;
            padding: 5px;
            color: #fff;
        }

        

        .dropdown--content {
            
            position: fixed;
            visibility: hidden;
            content-visibility: hidden;
            width: 320px;
            max-width: 100%;
            max-height: 100%;
            padding: 4rem 2rem 2rem;
            background: #1b1f22;
            border-radius: 20px;
            transition: transform ease 0.4s, height ease 0.4s, opacity ease 0.4s, margin-top ease 0.4s;
            overscroll-behavior-y: contain;
            z-index: 9999999;
        }

        .cart-box__del-btn {
            width: 3rem;
            height: 3rem;
            line-height: 3rem;
            position: absolute;
            top: -8px;
            right: -4px;
            color: #fff;
        }

        .sum-box {
            background-color: #1a1c1e;
            padding: 2rem;
            line-height: 1.2;
            border-radius: 20px;
        }

        .cart-item__input-wrap {
            border-radius: 1rem;
        }

        .btn-square, .btn--square {
            width: 2.6rem !important;
            height: 2.6rem !important;
            line-height: 0.5rem !important;
        }

        .order-step__text{
            color: #fff !important;
        }

        .is-done .order-step__icon {
            background: -moz-radial-gradient(center, ellipse cover, #fff 4px, #ff809e 4.5px);
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
            color: #fff;
        }

        .custom-control-input:checked ~ .custom-control-label::before {
                color: #ffffff;
                background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
                border-color: #4ade80 ;
            }

            .overlay_common {
            position: fixed;
            padding: 2rem;
            text-align: center;
            transform: translateX(-50%) !important;
            top: 10rem !important;
            left: 50% !important;
            width: 60rem;
            max-width: 90vw;
            max-height: 90vh;
            background: #181c1e;
            border-radius: 20px;
            overflow: hidden;
            overflow-y: auto;
            min-height: 100px;
        }

        .is-done:not(.is-active) .order-step__icon {
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
        }

        .order-step.is-done:not(.is-active)::after {
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
        }

        .order-mods--active .order-mods__name {
            color: #4ade80 ;
        }

        .page_tab.page_tab_active, .page_tab.page_tab_active a {
            color: #fff;
        }

        .page_tab.page_tab_active {
            border-bottom: 2px solid #4ade80 ;
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
        }

        .page_tab {
            display: inline-block;
            cursor: pointer;
            padding: 1rem 2rem;
            background: #151718;
            border-bottom: 2px solid #dddddd;
        }

        .page_tab:hover, .page_tab:hover a {
            color: #4ade80 ;
            transition: all 2s;
        }

        .header-inner {
            background-color: #1b1f22;
            position: relative;
            z-index: 1030;
            box-shadow: 0px 0px 20px rgba(0, 0, 0, .4);
            color: #fff;
        }

        .navbar-light .navbar-nav .nav-link {
            color: #fff;
            text-decoration: none;
            font-size: 14px;
            font-weight: normal;
            padding: 8px 8px;
            border-radius: 20px;
            position: relative;
            transition: all 0.6s ease;
      
        }

    /*     .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
            color: #10dbe9;
            text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #10dbe9;
            box-shadow: 0 0 10px rgba(16, 219, 233, 0.7);
            transition: all 2s;
        } */

        .hamburger__btn, .profile__btn, .cart-box__btn {
            color: #fff;
        }

        .toggle-container {
        display: flex;
        align-items: center;
        gap: 15px;
        }

        .label-text {
        font-weight: bold;
        letter-spacing: 1px;
        font-size: 18px;
        transition: all 0.3s ease;
        }

        /* AlapÃ¡llapot: FodrÃ¡szok aktÃ­v (ZÃ¶ld neon) */
        .fodrasz {
        color: var(--neon-green);
        text-shadow: 0 0 5px rgba(74, 222, 128, 0.5), 0 0 15px var(--neon-green);
        }

        .lakossagi {
        color: #633363; /* HalvÃ¡nyabb pink, amikor inaktÃ­v */
        }

        /* KapcsolÃ³ hÃ¡ttÃ©r */
        .switch {
        position: relative;
        display: inline-block;
        width: 70px;
        height: 34px;
        }

        .switch input {
        opacity: 0;
        width: 0;
        height: 0;
        }

        .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: transparent;
        border: 2px solid var(--neon-green);
        border-radius: 34px;
        transition: .4s;
        box-shadow: 0 0 10px var(--neon-green), inset 0 0 5px var(--neon-green);
        }

        /* A kapcsolÃ³ gombja (belsÅ‘ kÃ¶r) */
        .slider:before {
        position: absolute;
        content: "";
        height: 24px;
        width: 24px;
        left: 4px;
        bottom: 3px;
        background-color: var(--neon-green);
        border-radius: 50%;
        transition: .4s;
        box-shadow: 0 0 15px var(--neon-green);
        }

        /* --- AKTÃV ÃLLAPOT (Checkbox bekapcsolva) --- */

        /* Keret Ã©s Ã¡rnyÃ©k vÃ¡ltÃ¡sa pinkre */
        input:checked + .slider {
        border-color: var(--neon-pink);
        box-shadow: 0 0 10px var(--neon-pink), inset 0 0 5px var(--neon-pink);
        }

        /* Gomb mozgatÃ¡sa Ã©s szÃ­nezÃ©se */
        input:checked + .slider:before {
        transform: translateX(34px);
        background-color: var(--neon-pink);
        box-shadow: 0 0 15px var(--neon-pink);
        }

        /* SzÃ¶vegek fÃ©nyÃ©nek vÃ¡ltÃ¡sa */
        input:checked ~ .fodrasz {
        color: #2a4d35; /* HalvÃ¡nyabb zÃ¶ld inaktÃ­vkÃ©nt */
        text-shadow: none;
        }

        .toggle-container:has(input:checked) .fodrasz {
            color: #2a4d35;
            text-shadow: none;
        }

        .toggle-container:has(input:checked) .lakossagi {
            color: var(--neon-pink);
            text-shadow: 0 0 5px rgba(233, 16, 203, 0.5), 0 0 15px var(--neon-pink);
        }

        .cart-box__item-num {
            top: 50%;
            right: -0.5rem;
            transform: translateY(-50%);
            font-size: 1.2rem;
            font-weight: 700;
            letter-spacing: -0.5px;
            text-align: center;
            width: 2.4rem;
            height: 2.4rem;
            line-height: 2.2rem;
            border-radius: 50%;
            border: 1px solid #4ade80 ;
            color: #fff;
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
        }

        .hamburger__btn:hover, .hamburger__btn.is-active, .profile__btn:hover, .profile__btn.is-active, .cart-box__btn:hover, .cart-box__btn.is-active {
            color: #bf5af2 !important;
            transition: all 2s;
        }

        .selected-filters label {
            max-width: 100%;
            margin: 0.5rem 1rem 0.5rem 0;
            padding: 0.5rem 1rem;
            border-radius: 5px;
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
            user-select: none;
            vertical-align: top;
        }

        .page_content--blog:nth-last-of-type(1) {
             margin-right: 0 !important; 
        }

        #page_PopupContainer_tooltip{
   
            border-radius: 10px;
            border: 2px solid transparent; 
            border-image: linear-gradient(135deg, #bf5af2 0%, #4ade80 100%);
            border-image-slice: 1;
        }

        .overlay_close-btn, .shop_popup_artdet .close, #page_PopupContainer_tooltip .close, #page_PopupContainerMobile .close, #page_PopupContainer .close, .overlay-sign-in__btn-close {
            color: #222222;
            background: #ffffff;
            width: 2.4rem;
            height: 2.4rem;
            line-height: 2.2rem;
            display: block;
            text-align: center;
            position: absolute;
            right: 0;
            top: 0;
            cursor: pointer;
            z-index: 1;
            font-size: 1.5rem;
            text-decoration: none;
            border-radius: 20px;
        }

        .artdet__cart-btn-wrap {
            margin-left: 3rem;
        }

        .badge--sale {
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
            color: #ffffff;
            font-weight: 400;
        }

        body.design_subver4 .compare__title {
            padding: 1rem 5rem 1rem 2rem;
            margin-bottom: 0;
            background: linear-gradient(90deg, #ff00ff 0%, #00ffcc 100%);
            font-family: 'Inter', sans-serif;
            color: #fff;
            text-transform: uppercase;
            letter-spacing: 2px;
            margin: 0;
        }

        .search-box {
                background-color: transparent;
            }

        body.design_subver4 .compare__row--name .compare__label, body.design_subver4 .compare__row--name .compare__value {
            background-color: #222222;
        
        
            padding: 10px 20px;
            margin-bottom: 8px;
            text-align: right;
            display: block;
            color: #e0e0e0;
            border:0 !important;
        }

        body.design_subver4 .compare__label {
       
        
            padding: 10px 20px;
            margin-bottom: 8px;
            text-align: right;
            display: block;
            color: #e0e0e0;
            background-color: #333333 !important;
            border:0 !important;
        }

        body.design_subver4 .compare__value {

            padding: 0px 20px;
            margin-bottom: 8px;
            text-align: right;
            display: block;
            color: #e0e0e0;
            border-radius: 0;
            max-width: 100%;
            background-color: #222222 !important   ;
            border:0 !important;
            margin-bottom: 0px !important;

        }

    

        body.design_subver4 .compare__row--name {
      
            border: 0 !important;
        }


        body.design_subver4 .compare__row--functions .compare__value, body.design_subver4 .compare__row--functions .compare__label {
                background-color: #222222;
                    
            border-radius: 12px;
            padding: 10px 20px;
            margin-bottom: 8px;
            text-align: right;
            display: block;
            color: #e0e0e0;
            
        }

        body.design_subver4 .compare__row--functions {
            border:0 !important;
        }

        .compare__func-btn{
            color: #ffffff !important;
        }



        .compare__func-btn.btn {
            padding: 0 !important;
        }

        body.design_subver4 #page_PopupContainer.shop_popup_compare #page_PopupContainer_inner {
            padding: 0;
            overscroll-behavior: contain;
            max-height: inherit;
            min-width: 250px;
            background-color: #1a1a1a;
            border-radius: 20px;
            overflow: hidden;
            border:0 !important;
        }

        body.design_subver4 .compare__table-inner {
            height: 100%;
            -webkit-overflow-scrolling: touch;
            background-color: #dddddd;
            display: flex;
            flex-direction: column;
            background: #222222;
            padding: 20px;
            position: relative;
            border: 2px solid transparent;
            background-image: linear-gradient(#222, #222), linear-gradient(to bottom right, #ff00ff, #00ffcc);
            background-origin: border-box;
            background-clip: padding-box, border-box;
            box-shadow: 0 0 15px rgba(255, 0, 255, 0.2);
            border-radius: 0px 0px 25px 25px;
        }

        #compare__functions-label{
            background: transparent !important;
        }

        .compare__value{
            text-align: center !important;
        }

        /* Teljes kÃ©pernyÅ‘s sÃ¶tÃ©tÃ­tett, elmosott hÃ¡ttÃ©r */
        .loader-container {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background-color: rgba(10, 10, 12, 0.8); /* ÃttetszÅ‘ sÃ¶tÃ©t hÃ¡ttÃ©r */
        backdrop-filter: blur(8px); /* Finom elmosÃ¡s a mÃ¶gÃ¶tte lÃ©vÅ‘ dizÃ¡jnnak */
        -webkit-backdrop-filter: blur(8px);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 99999; /* Hogy biztosan minden felett jelenjen meg */
        font-family: sans-serif;
        transition: opacity 0.5s ease, visibility 0.5s ease;
        }
        .loader-container.hidden {
        opacity: 0;
        visibility: hidden;
        pointer-events: none; /* Hogy ne lehessen vÃ©letlenÃ¼l rÃ¡kattintani az eltÅ±nt elemre */
        }

        /* Az animÃ¡ciÃ³ kÃ¶zponti tÃ¡rolÃ³ja */
        .loader {
        position: relative;
        width: 120px;
        height: 120px;
        display: flex;
        justify-content: center;
        align-items: center;
        }

        /* KÃ¶zÃ¶s gyÅ±rÅ± tulajdonsÃ¡gok */
        .ring {
        position: absolute;
        border: 4px solid transparent;
        border-radius: 50%;
        }

        /* KÃ¼lsÅ‘ zÃ¶ld gyÅ±rÅ± - a webshop zÃ¶ld gombjÃ¡hoz igazÃ­tva */
        .ring-green {
        width: 100%;
        height: 100%;
        border-top-color: #00ff7f;
        border-right-color: #00ff7f;
        filter: drop-shadow(0 0 12px #00ff7f);
        animation: spin-clockwise 2s linear infinite;
        }

        /* BelsÅ‘ lila gyÅ±rÅ± - a webshop lila elemeihez igazÃ­tva */
        .ring-purple {
        width: 75%;
        height: 75%;
        border-bottom-color: #bd00ff;
        border-left-color: #bd00ff;
        filter: drop-shadow(0 0 12px #bd00ff);
        animation: spin-counter-clockwise 1.5s linear infinite;
        }

        /* PulzÃ¡lÃ³ betÃ¶ltÅ‘ szÃ¶veg */
        .loading-text {
        position: absolute;
        bottom: -45px;
        color: #ffffff;
        font-size: 13px;
        letter-spacing: 3px;
        text-transform: uppercase;
        animation: pulse 1.8s ease-in-out infinite;
        text-shadow: 0 0 8px rgba(255, 255, 255, 0.6);
        }

        /* --- AnimÃ¡ciÃ³k (Keyframes) --- */

        /* Ã“ramutatÃ³ jÃ¡rÃ¡sÃ¡val megegyezÅ‘ forgÃ¡s */
        @keyframes spin-clockwise {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
        }

        /* Ã“ramutatÃ³ jÃ¡rÃ¡sÃ¡val ellentÃ©tes forgÃ¡s (gyorsabb, dinamikusabb hatÃ¡s) */
        @keyframes spin-counter-clockwise {
        0% { transform: rotate(360deg); }
        100% { transform: rotate(0deg); }
        }

        /* SzÃ¶veg pulzÃ¡lÃ¡sa */
        @keyframes pulse {
        0%, 100% { opacity: 0.4; }
        50% { opacity: 1; }
        }

        #responsive_cat_menu {
            background: #222222;
            margin-bottom: 3rem;
            flex-grow: 1;
        }

        .overlay_close-btn, .shop_popup_artdet .close, #page_PopupContainer_tooltip .close, #page_PopupContainerMobile .close, #page_PopupContainer .close, .overlay-sign-in__btn-close{
            background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
            line-height: 2.5rem;
        }

        .form-control:focus {
            color: #ffffff;
            background-color: #414348;
            border-color: rgba(255, 255, 255, .4);
            outline: 0;
            box-shadow: 0 0 0 transparent;
        }

        #box_search_input {
            background-color: #414348;
            border-color: rgba(255, 255, 255, .4);
            color: #ffffff;
        }

        .ac_results li {
    
            background: #414348;
        }

        .ac_results li:hover, .ac_results li.ac_over{
            background: #595b61;
            transition: all 2s;
        }

        .header .search-btn-icon {
            color: #ffffff;
        }

        .search-box__inner {
            width: 800px;
        }

        .product__badge-new.badge--new span {
            color: #633363 !important;
        }

       
        .overlay-sign-in__btn-close.btn{
            padding: 0 !important;
        }

        .overlay_close-btn.btn {
            padding: 0 !important;
        }
   

        @media (max-width: 990px) {

            #box_top_content3{
                padding: 0;
            }

            .my-custom-wrapper {
                display: contents;
                width: 100%;
            }

            .my-custom-wrapper > div {
                    height: 100% !important;
                    width: 100% !important;
                    padding: 5px 5px;
                }
            .search-box {
                background-color: #414348;
            }

            #page_cat_artlist, #page_artref_inner, #box_art_content2{
                min-height: 3rem;
            }
        }

        @media (max-width: 767px) {

            .cart-box__btn {
                margin-right: 2rem !important;
            }

            .hamburger__btn {
                margin-left: 2rem !important;
            }

           /*  .toggle-container {
                display: grid !important;
          
            } */

           
            .switch {
                position: relative;
                display: inline-block;
                width: 70px;
                height: 34px;
              
            }
            #responsive_cat_menu ul li a {
                text-align: center;
            }

            .responsive_menu.black_active .responsive_menu_navbottom::before, .responsive_menu.black_active .responsive_menu_navbottom::after{
                background: #1b1f22;
            }

            .responsive_menu.black_active .responsive_menu_navbottom {
             
                    background: #222222;
                  
                }

                .full-width-bg::before{
                    background: #1b1f22;
                }

                .full-width-bg {
                    background-color: #1b1f22;
                }

                .filter-top .selected-filters{
                    overflow-y: hidden;
                }

                .blog-items > .row {
                    display: block; 
                     margin: 0;
                }

                .blog__btn-more-wrap{
                    margin: 0px 10px;
                }

              

                .page_shop_start .main-title {
                    text-align: center;
                }

            

         
                .page_content_item{
                    margin: 5px auto;
                }
                .page_content--blog:nth-last-of-type(1) {
                    margin-right: auto !important;
                }
        }

        /* Modal hÃ¡ttÃ©r sÃ¶tÃ©tÃ­tÃ©s */
        .variant-modal {
            position: fixed; /*  Ha ablakként kell */
            z-index: 99999999;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            /* background-color: rgba(0,0,0,0.6); */ /*  Ha ablakként kell */
            display: flex;
            justify-content: center;
            align-items: center;
            animation: scaleUp 200ms cubic-bezier(0.16, 1, 0.3, 1) all;
        }

        /* Modal fehÃ©r ablaka */
        .variant-modal-content {
            /* ÃtlÃ¡tszÃ³ keret, aminek a helyÃ©n Ã¡tlÃ¡tszik majd a neon */
            border: 3px solid transparent; 
            
            /* Az elsÅ‘ rÃ©teg a belsÅ‘ sÃ¶tÃ©t rÃ©sz (padding-box), a mÃ¡sodik a neon szegÃ©ly (border-box) */
            background-image: linear-gradient(#1b1f22, #1b1f22), linear-gradient(to bottom right, #ff00ff, #00ffcc);
            background-origin: border-box;
            background-clip: padding-box, border-box;

            padding: 25px;
            border-radius: 8px; /* Figyelem: rÃ©gebbi bÃ¶ngÃ©szÅ‘kben a border-image letilthatja a kerekÃ­tÃ©st */
           
            width: 90%;
            max-height: 80vh;
            overflow-y: auto;
            position: relative;
            box-shadow: 0 4px 20px rgba(0,0,0,0.3);
            animation: fadeIn 200ms ease-out all;
        }

        /* BezÃ¡rÃ³ X gomb */
        .variant-modal-close {
            position: absolute;
            right: 15px;
            top: 10px;
            font-size: 28px;
            font-weight: bold;
            cursor: pointer;
            color: #aaa;
        }
        .variant-modal-close:hover { color: #fff;   transition: all 2s;}

        /* A kÃ©pek rÃ¡csa a modalban */
        .variant-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
            gap: 15px;
        }

        .variant-label{
          /*   z-index: 9999;
           position: absolute;
            left: 7px;
            top: 6px;
            display: block; */
            border: 3px solid #4ade80 !important;
            padding: 1px 12px;
            border-radius: 10px;
            text-transform: none;
            font-size: 13px;
        }

        /* Egy-egy kÃ©p kÃ¡rtyÃ¡ja */
        .variant-card {
            position: relative;
            border: 2px solid transparent; 
           
            /* Az elsÅ‘ rÃ©teg a kÃ¡rtya belsÅ‘ hÃ¡ttere (itt pl. sÃ¶tÃ©tszÃ¼rke #222, de lehet #fff is), a mÃ¡sodik a neon */
            
            background-origin: border-box;
            background-clip: padding-box, border-box;

            border-radius: 6px;
            padding: 5px;
            text-align: center;
            cursor: pointer;
           
            opacity: 0.70; /* Alaphelyzetben kicsit halvÃ¡nyabb, hogy ne legyen tÃºl zavarÃ³ */
            transition: all 0.2s ease-in-out;
        }
        .variant-card img {
            width: 100%;
            height: auto;
            display: block;
            border-radius: 4px;
        }
        .custom-variant-btn{
            color: #fff;
        }
        .variant-card:not(.is-out-of-stock):hover {
           /*  background-image: linear-gradient(#1b1f22, #1b1f22), linear-gradient(to bottom right, #ff00ff, #00ffcc);  */
            opacity: 1; 
            transform: scale(1.14); 
        }
        .variant-card.active {background-image: linear-gradient(#1b1f22, #1b1f22), linear-gradient(to bottom right, #ff00ff, #00ffcc);opacity: 1; transform: scale(1.14); }

        @media (max-width: 1300px) {
            .search-box__inner {
                width: 400px;
            }
        }

        /* Konténer, ami levágja a kilógó fényt */
        .hair-swatch {
        position: relative;
        display: inline-block;
        overflow: hidden;
        border-radius: 15%; /* Ha a hajtincs képed kör alakú */
        }

        .hair-swatch img {
        display: block;
        width: 100%;
        height: auto;
        }

        /* A fényeffektus réteg */
        .hair-swatch::after {
        content: '';
        position: absolute;
        top: -50%;
        left: -150%;
        width: 100%;
        height: 200%;
        background: linear-gradient(
            60deg,
            rgba(255, 255, 255, 0) 20%,
            rgba(255, 255, 255, 0.6) 50%,
            rgba(255, 255, 255, 0) 80%
        );
        transform: rotate(25deg);
        pointer-events: none;
        }

        /* Animáció osztály triggereléskor */
        .hair-swatch.is-shining::after {
        animation: shine 0.8s ease-in-out;
        }

        @keyframes shine {
        0% {
            left: -150%;
        }
        100% {
            left: 150%;
        }
        }

    

        @media (max-width: 991.98px) {
            .page_tab2 {
          
                background: #252a2d;
           
            }

            .page_tab2_active {
                background: #633363;
                border-color: #633363;
                color: #ffffff;
            }

            
        }

            /* A logÃ³ kontÃ©nerÃ©nek beÃ¡llÃ­tÃ¡sa, ha szÃ¼ksÃ©ges */
            .header_logo-img-wrapper a {
                display: flex;
                justify-content: center;
                align-items: center;
                /* background-color: #121212; */ /* SÃ¶tÃ©t hÃ¡ttÃ©r a neon kiemelÃ©sÃ©hez */
                padding: 20px;
                border-radius: 8px;
                position: relative; /* PozÃ­cionÃ¡lÃ¡shoz */
            }

            /* Az integrÃ¡lt H4U neon logÃ³ kÃ©pÃ©nek stÃ­lusa */
            .header_logo-img-wrapper img {
                /* Alap neon ragyogÃ¡s - mindkÃ©t szÃ­nt alkalmazzuk,
                a megfelelÅ‘ eltolÃ¡ssal a kÃ©p szerint.
                A zÃ¶ld a 'H' Ã©s '4' baloldalÃ¡hoz, a lila a '4' jobboldalÃ¡hoz Ã©s a 'U'-hoz. */
                filter: 
                    /* ZÃ¶ld alap ragyogÃ¡s */
                    drop-shadow(0px 0 1px #4ade80) 
                    drop-shadow(-4px 0 6px rgba(74, 222 ,128, 0.5))
                    
                    /* Lila alap ragyogÃ¡s */
                    drop-shadow(0px 0 1px #9c27b0) 
                    drop-shadow(4px 0 6px rgba(156, 39, 176, 0.5))
                    
                    /* HalvÃ¡nyabb lila a hullÃ¡mos rÃ©sznek */
                    drop-shadow(10px 0 8px rgba(156, 39, 176, 0.25));
                    
                /* Az animÃ¡ciÃ³ hozzÃ¡adÃ¡sa a felemÃ¡s villogÃ¡shoz */
                animation: split-neon-flicker 4s infinite alternate ease-in-out;
            }

            /* A felemÃ¡s neon villogÃ¡s animÃ¡ciÃ³ */
            @keyframes split-neon-flicker {
                0%, 100% {
                    /* Alap Ã¡llapot */
                    filter: 
                        drop-shadow(0px 0 1px #4ade80) 
                        drop-shadow(-4px 0 6px rgba(74, 222 ,128, 0.5))
                        
                        drop-shadow(0px 0 1px #9c27b0) 
                        drop-shadow(4px 0 6px rgba(156, 39, 176, 0.5));
                }
                10% {
                    /* Hirtelen felvillan a zÃ¶ld */
                    filter: 
                        drop-shadow(0px 0 1px #4ade80) 
                        drop-shadow(-4px 0 12px rgba(74, 222 ,128, 0.8)) /* ErÅ‘sebb zÃ¶ld */
                        
                        drop-shadow(0px 0 1px #9c27b0) 
                        drop-shadow(4px 0 6px rgba(156, 39, 176, 0.5));
                }
                11%, 19% {
                    /* Hirtelen elhalvÃ¡nyul a zÃ¶ld */
                    filter: 
                        drop-shadow(0px 0 1px rgba(0, 243, 255, 0.2)) 
                        
                        drop-shadow(0px 0 1px #9c27b0) 
                        drop-shadow(4px 0 6px rgba(156, 39, 176, 0.5));
                }
                20%, 30% {
                    /* VisszaÃ¡ll az alapÃ¡llapot */
                    filter: 
                        drop-shadow(0px 0 1px #4ade80) 
                        drop-shadow(-4px 0 6px rgba(74, 222 ,128, 0.5))
                        
                        drop-shadow(0px 0 1px #9c27b0) 
                        drop-shadow(4px 0 6px rgba(156, 39, 176, 0.5));
                }
                60% {
                    /* Lila felvillan a '4' jobboldalÃ¡n Ã©s a 'U'-n */
                    filter: 
                        drop-shadow(0px 0 1px #4ade80) 
                        drop-shadow(-4px 0 6px rgba(74, 222 ,128, 0.5))
                        
                        drop-shadow(0px 0 1px #9c27b0) 
                        drop-shadow(4px 0 12px rgba(156, 39, 176, 0.8)) /* ErÅ‘sebb lila */
                        drop-shadow(10px 0 8px rgba(156, 39, 176, 0.25)); /* HalvÃ¡ny lila a hullÃ¡mnak */
                }
                61%, 69% {
                    /* Hirtelen elhalvÃ¡nyul a lila */
                    filter: 
                        drop-shadow(0px 0 1px #4ade80) 
                        drop-shadow(-4px 0 6px rgba(74, 222 ,128, 0.5))
                        
                        drop-shadow(0px 0 1px rgba(156, 39, 176, 0.2))
                        drop-shadow(10px 0 2px rgba(156, 39, 176, 0.1));
                }
            }

            .google-iframe.btn{
                background: transparent !important;
            }

            input.page_qty_input{
                background: transparent;
                color: #333;
            }

            .cart-item__qty-refresh-btn.btn{
                padding: 0;
            }

    /* Banner FÅ‘ KontÃ©ner */
    .hero-banner {
        width: 100%;
        min-height: 450px;
        background-color: #121315; /* SÃ¶tÃ©t hÃ¡ttÃ©r, ami egyezik a kÃ©ppel */
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        position: relative;
        padding: 20px;
    }

    .banner-container {
        width: 100%;
        max-width: 1920px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap; /* BiztosÃ­tja a mobilbarÃ¡t tÃ¶rÃ©st */
        gap: 40px;
    }

    /* Bal oldal elrendezÃ©se */
    .hero-left {
        display: flex;
        align-items: center;
        gap: 30px;
        flex: 1;
        min-width: 320px;
    }

    .hero-img {
        height: 450px; /* Fix magassÃ¡g asztali nÃ©zetben */
        object-fit: cover;
        pointer-events: none;
    }

    .hero-title {
        font-size: 2.8rem;
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: 1px;
        color: #00ffaa; /* Ã‰lÃ©nk zÃ¶ldes-kÃ©k Ã¡rnyalat */
        /* Enyhe lila izzÃ¡s a szÃ¶veg mÃ¶gÃ¶tt, mint a kÃ©pen */
        text-shadow: 0 0 20px rgba(168, 85, 247, 0.4); 
    }

    .hero-title .highlight {
        color: #00ffaa;
    }

    /* Jobb oldal elrendezÃ©se */
    .hero-right {
        display: flex;
        flex-direction: column;
        align-items: start;
        justify-content: right;
        min-width: 320px;
        text-align: right;
        padding-right: 0%;
    }

    /* A vilÃ¡gÃ­tÃ³ Neon Gomb */
    .neon-btn {
        display: inline-block;
        text-decoration: none;
        color: #52e5ff;
        font-weight: 700;
        font-size: 1.1rem;
        letter-spacing: 1px;
        padding: 18px 45px;
        border-radius: 50px;
        /* Ãtmenetes neon keret szimulÃ¡lÃ¡sa */
        border: 3px solid #00ffaa; 
        position: relative;
        box-shadow: 0 0 15px rgba(0, 255, 170, 0.4), 
                    inset 0 0 15px rgba(0, 255, 170, 0.4);
        transition: all 0.3s ease-in-out;
   
    }

    .neon-btn .btn-text {
        color: #00ffaa;
    }

    /* Gomb hover (rÃ¡mutatÃ¡si) effekt */
    .neon-btn:hover {
        color: #ffffff;
        border-color: #52e5ff;
        box-shadow: 0 0 25px rgba(82, 229, 255, 0.8), 
                    inset 0 0 20px rgba(82, 229, 255, 0.6);
        transform: scale(1.02);
        transition: all 2s;
    }

    /* AlsÃ³ aprÃ³ felirat */
    .sub-text {
        margin-top: 15px;
        font-size: 0.85rem;
        color: #888888;
        letter-spacing: 0.5px;
    }

    /* ==========================================
    RESZPONSZÃV BEÃLLÃTÃSOK (Mobil & Tablet)
    ========================================== */

    @media (max-width: 1024px) {
        .banner-container {
            flex-direction: column; /* EgymÃ¡s alÃ¡ rakja a kÃ©t oldalt */
            justify-content: center;
            text-align: center;
            gap: 20px;
        }

        .hero-left {
            flex-direction: column; /* Mobilon a szÃ¶veg a modell alÃ¡ kerÃ¼l */
            gap: 15px;
        }

        .hero-img {
            height: 300px; /* Kisebb kÃ©pernyÅ‘n ne foglaljon akkora helyet */
        }

        .hero-title {
            font-size: 2.2rem;
        }

        .hero-right {
            padding-right: 0;
            margin-bottom: 30px;
        }
    }

    @media (max-width: 480px) {
        .hero-title {
            font-size: 1.8rem;
        }

        .neon-btn {
            font-size: 0.9rem;
            padding: 14px 30px;
        }
    }

    body.front-page a, body.front-page a:visited, body.front-page p{
        color: rgb(255 255 255) !important;
    }

    .receive-method-list ul li .receive-more{
        color: #fff;
    }

    .contact_container{
        color: #fff;
    }

    .old_image_series_box{
        color: #fff;
    }

    div#on_jogai_container, div#adatkezelesek_container, div#adatfeldolgozok_container, div#fogyasztoi_panasz_container, div#aszf_download_container, div#at_download_container, div#em_download_container{
        background: #111416;
    }

    footer{
        margin-bottom: 0;
    }

    .main{
        color:#fff !important;
    }

    .preview_anchor{
        color: #fff !important;
    }

    .preview_anchor p{
        color: #fff !important;
    }

    body.front-page{
        color: #fff !important;
    }

    #page_help_content{
        color: #fff !important;
    }

    .type--1 .product__datas {
        padding: 0;
    }

    .product__img {
        border-radius: 17px 17px 0 0;
    }

    .embed-aszf-container{
        color: #fff !important;
    }


    /* ==========================================================================
        1. NORMÃL ELRENDEZÃ‰S (FÅ‘oldal Ã©s alapÃ©rtelmezett kategÃ³ria nÃ©zet)
    ========================================================================== */

    /* FodrÃ¡sz termÃ©kek - ZÃ¶ld (Csak ha elÃ©rhetÅ‘) */
    .is-fodrasz:not(.is-otthon):not(.is-out-of-stock), 
    .product__inner.is-fodrasz:not(.is-otthon):not(.is-out-of-stock) {
        border: 3px solid #4ade80 !important;
        color: #4ade80 !important;
        transition: all 5ms;
    }

    /* Otthoni termÃ©kek - Lila (JAVÃTVA: Most mÃ¡r lila, Ã©s csak ha elÃ©rhetÅ‘) */
    :not(.is-fodrasz) > .is-otthon:not(.is-fodrasz):not(.is-out-of-stock), 
    :not(.is-fodrasz) > .product__inner.is-otthon:not(.is-fodrasz):not(.is-out-of-stock) {
        border: 1px solid rgba(255, 255, 255, 0.05) !important;
        color: #ffffff !important;
        transition: all 5ms;
    }


    /* ==========================================================================
        2. ALTERNATÃV ELRENDEZÃ‰S (Amikor a JS bekapcsolja az alt-layout-active-ot)
    ========================================================================== */

    /* FodrÃ¡sz termÃ©kek alternatÃ­v nÃ©zetben - FehÃ©r / HalvÃ¡ny (Csak ha elÃ©rhetÅ‘) */
    body.alt-layout-active .is-fodrasz:not(.is-out-of-stock),
    body.alt-layout-active .product__inner.is-fodrasz:not(.is-out-of-stock),
    body.alt-layout-active .is-fodrasz.is-otthon:not(.is-out-of-stock),
    body.alt-layout-active .product__inner.is-fodrasz.is-otthon:not(.is-out-of-stock),
    body.alt-layout-active .is-otthon .is-fodrasz:not(.is-out-of-stock),
    body.alt-layout-active .is-otthon .product__inner.is-fodrasz:not(.is-out-of-stock) {
        border: 1px solid rgba(255, 255, 255, 0.05) !important;
        color: #ffffff !important;
        transition: all 5ms;
    }

    /* Otthoni termÃ©kek alternatÃ­v nÃ©zetben - ErÅ‘s lila (Csak ha elÃ©rhetÅ‘) */
    body.alt-layout-active :not(.is-fodrasz) > .is-otthon:not(.is-fodrasz):not(.is-out-of-stock), 
    body.alt-layout-active :not(.is-fodrasz) > .product__inner.is-otthon:not(.is-fodrasz):not(.is-out-of-stock) {
        border: 3px solid #833987 !important;
        color: #833987 !important;
        transition: all 5ms;
    }


    /* ==========================================================================
        3. ABSZOLÃšT LEGERÅSEBB SZABÃLY: KÃ‰SZLETHIÃNY (A KÃ“D LEGUTOLSÃ“ SORAI)
    ========================================================================== */

    /* BÃ¡rmilyen nÃ©zetben, bÃ¡rmilyen szÃ¼lÅ‘ alatt, ha out-of-stock, ez nyer! */
    body .is-out-of-stock,
    body .product__inner.is-out-of-stock,
    body .product__inner.is-out-of-stock.is-fodrasz,
    body .product__inner.is-out-of-stock.is-otthon,
    body.alt-layout-active .is-out-of-stock,
    body.alt-layout-active .product__inner.is-out-of-stock,
    body.alt-layout-active .product__inner.is-out-of-stock.is-fodrasz,
    body.alt-layout-active .product__inner.is-out-of-stock.is-otthon,
    :not(.is-fodrasz) > .product__inner.is-out-of-stock,
    :not(.is-otthon) > .product__inner.is-out-of-stock,
    body.alt-layout-active :not(.is-fodrasz) > .product__inner.is-out-of-stock,
    body.alt-layout-active :not(.is-otthon) > .product__inner.is-out-of-stock {
        opacity: 0.4 !important;
        border: 3px dashed #ff0000 !important;   /* Fix piros szaggatott keret mindenhol */
        color: #999999 !important;               /* HalvÃ¡nyÃ­tott szÃ¶vegszÃ­n */
        cursor: not-allowed !important;          /* TiltÃ³ egÃ©rmutatÃ³ */
        background-image: none !important;       /* EltÃ¼nteti az esetleges egyÃ©b hÃ¡ttereket */
    }

    /* Letiltja a kÃ¡rtyÃ¡n belÃ¼li elemek kurzorait is */
    .is-out-of-stock *,
    body .is-out-of-stock * {
        cursor: not-allowed !important;
    }



    .star-label:hover::before, .star-label:hover ~ .star-label::before, .star-radio:checked ~ .star-label::before {
        font-weight: 900;
        color: #833987;
        transition: all 5ms;

    }

    .progress-bar{
    
        background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
    }

    .star--full{
        color: #833987;
    }

    .variant-card.is-out-of-stock {
        opacity: 0.3 !important;
        border: 2px dashed #ff0000 !important;
        cursor: not-allowed !important;
    }

   

    @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
    }

    @keyframes scaleUp {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
    }

    .ui-slider-handle{
        background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%);
    }

    .ui-slider-range{
        background: linear-gradient(135deg, #bf5af2 0%, #4ade80  100%) !important;
    }

    .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus{
        background: linear-gradient(135deg, #bf5af2 0%, #4ade80 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent;
        color: #fff;
    }

    .navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active
    {
        background: linear-gradient(135deg, #bf5af2 0%, #4ade80 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent;
        color: #fff;  
    }

    .nav-item.active > .nav-link {
        text-shadow: none;
    }

    .menu-subtext {
        color: #8c8c8c !important;
        font-size: 0.85em;
        font-weight: normal;
        display: block;
        text-align: center;
    }

    .icon--details::before, .icon--a-details::after, .icon--b-details::before{
        content: "\f06e" !important;
    }

    .type--1 .product__main-wrap{
        display: flow !important;
    }

    @media (max-width: 990px) {
        input:checked + .slider:before {
            transform: translateX(32px);
        }
    }

    .product_filter_link::first-letter {
        text-transform: uppercase;
    }

.blog-item__img-wrap {
    padding-top: 60% !important; 
    position: relative;
    width: 100%;
}


.blog-item__img-wrap .blog-item__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}

@media (min-width: 1680px) {
    .type--1 .product.carousel-cell {
        width: 38.666667%;
        flex: 0 0 38.6666666667%;
    }
}

.back_to_top {
    line-height: 2.5rem !important;
}

.dropdown-toggle::after {
    margin-left: 45% !important;
}

.dropdown-menu {
    background: #1b1f22 !important;
}

.dropdown-item{

    color: #ffffff !important;
}

.dropdown-item:hover, .dropdown-item:focus {
    color: #ffffff !important;
    text-decoration: none;
    background: linear-gradient(135deg, #bf5af2 0%, #4ade80 100%) !important;;
}

.dropdown-item.active, .dropdown-item:active {
    color: #ffffff important;
    text-decoration: none;
    background: linear-gradient(135deg, #bf5af2 0%, #4ade80 100%) !important;
}

.responsive_menu.black_active .responsive_menu_navbottom::before, .responsive_menu.black_active .responsive_menu_navbottom::after{
    background-color: #1b1f22;
}

.responsive_menu.black_active .responsive_menu_navbottom{
    background-color: #1b1f22;
}

.full-width-bg,.full-width-bg::before,.full-width-bg::after{
    background-color: #1b1f22 !important;
}

.actcat a{
    background: linear-gradient(135deg, #bf5af2 0%, #4ade80 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    color: #fff;
}

.responsive_menu_back {
    background: linear-gradient(135deg, #bf5af2 0%, #4ade80 100%) !important;
}

#responsive_cat_menu ul li a {
    padding: 0 0 0 2rem !important;
}
/* 
.filter-top__delete-btn{
    padding: .5rem 1rem .5rem 0rem !important;
} */

.filter-side-box__buttons button {
    padding: 2px;
}

.filter-dropdown__close-btn{
    background-color: #1b1f22;
}

/* Biztosítjuk, hogy a konténernek legyen 3D perspektívája */
.header_logo-img-container {
    perspective: 1000px;
}

/* A wrapper fog fizikailag megfordulni */
.header_logo-img-wrapper {
    display: inline-block;
    transition: transform 0.3s ease-in-out;
    transform-style: preserve-3d;
}

/* Ez az osztály aktiválódik a gombnyomásra a JS által */
.header_logo-img-wrapper.logo-flipping {
    transform: rotateY(180deg);
}


.header_logo-img-wrapper img {
    backface-visibility: hidden; /* Opcionális: javítja a renderelést forgás közben */
    display: block;
    max-width: 100%;
    height: auto;
}

.type--1 .product__variants-inner{
    background-color: #1b1e21 !important;
}

.form-label-group input.placeholder-hide, .form-label-group select.placeholder-hide{
    background-color: #1b1e21;
    color: white;
    border-color: #bf5af2;
}