﻿:root {
    --bgcolor1: #000000;
    --bgcolor2: #202124;
    --bgcolor3: #3C4043;
    --bgcolor4: #ffffff;

    --link1color: #000000; /*fekete*/
    --link2color: #ffffff; /*feher*/
    --link3color: #E8EAED;
    --link4color: #9AA0A6;
}

body { background-color: var(--bgcolor4); color:var(--link1color); font-family: Roboto, sans-serif; line-height: 1.4; margin: 0px; height: 100%; margin: 0; padding: 0; }
img { cursor:pointer;}
* { box-sizing: border-box; }
div { box-sizing: border-box; }

h1 { font-size: 36px; font-weight: bold; margin:0px;  }
h2 { font-size: 28px; font-weight: 600; margin-bottom: 1rem; }
h3 { font-size: 24px; font-weight: 600; margin-bottom: 0.75rem; }
ul {list-style-type:none; padding-left:10px;}

p { margin-bottom: 1rem; line-height: 1.6; }
a { color: var(--link1color); text-decoration:none; }
button { padding: 10px 20px; background-color: var(--link1color); color: white; font-size:20px; line-height:1.3em; border: none; border-radius: 8px; cursor: pointer; font-weight: bold; }

.au { text-decoration: none; background-image: linear-gradient(#1f1f1f, #1f1f1f); background-size: 0% 0.1em; background-position-y: 100%; background-position-x: 0%; background-repeat: no-repeat; transition: background-size 0.2s ease-in-out; }  
.au:hover,
.au:focus,
.au:active { background-size: 100% 0.1em; }

.abadge { border:2px solid var(--bgprimaybutton); color:var(--bgprimaybutton); padding:5px; border-radius:5px; }

.brbb { border-bottom:1px solid #000000;}

.title { font-size: 26px !important; }
.lead { font-size: 22px !important; }
.normal { font-size: 16px !important; }
.small { font-size: 14px !important; }
.tiny { font-size: 12px !important; }

.light {color:var(--link2color); }
.dark { color:var(--link1color); }
.green { color:#22c55e; }

.w-25 { width: 25% !important; }
.w-50 { width: 50% !important; }
.w-100 { width: 100% !important;}
.w50 { width: 50px !important; }
.w80 { width: 80px !important; }
.w100 { width: 100px !important; }
.flex { display: flex; flex-wrap:wrap; }

.pt20 { padding-top:20px !important;}
.pt40 { padding-top:40px !important;}

.pr10 { padding-right:10px !important;}
.pr20 { padding-right:20px !important;}

.pb20 { padding-bottom:20px;}

.pl10 { padding-left:10px !important;}
.pl20 { padding-left:20px !important;}
.pl40 { padding-left:40px !important;}

.mgt20 { margin-top:20px;}
.mgb20 { margin-bottom:20px;}

.tal { text-align:left;}
.tac { text-align:center;}
.tar { text-align:right;}

.brtb { border-top: 1px solid #000000;}
.bg2{ background-color:var(--bg2); }
.marginb16 { margin-bottom:16px; }
.text-danger { color:red;}
.buttonstyle { background-color: var(--bgcolor1); color:var(--link2color); border-radius: 5px; font-size:16px; font-weight:600;line-height:1.5;padding: 8px 16px; margin: 0px 16px 0px; display:inline-block; cursor:pointer; }
.form-control:focus { border-color: #007bff; outline: none; }
.form-control { background-color:#ffffff; width: 100%; height:32px; display: block; padding: 5px 12px; font-size: 1rem; font-weight: 400; line-height: 1.5; color: var(--link1color); -webkit-appearance: none; -moz-appearance: none; appearance: none; background-clip: padding-box; border: 1px solid #ccc; border-radius: 4px; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
textarea.form-control { height: auto; min-height: 3em; }

.form-group {margin-bottom:16px;}

.formfieldspace { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.formfieldlabel { min-width: 120px; }
.formfieldspace .input-wrap { flex: 1; }
.formfieldspace input, .formfieldspace textarea { width: 100%; }
.form-layout-row .formfieldspace { flex-direction: row; }
.form-layout-column .formfieldspace { flex-direction: column; align-items: stretch; }
.form-layout-column .formfieldspace label { min-width: auto; margin-bottom: 5px; }

.alert { padding: 15px; border-radius: 5px; margin-bottom: 20px; font-weight: bold; color: #fff; }
.alert a { color:#ffffff;}
.alert-success { background-color: #28a745; }
.alert-danger { background-color: #dc3545; }

.form-wrapper { display:flex;justify-content:center; }
.form-container { width:600px;background-color:var(--bgcolor2); color:var(--link2color); padding:30px;border-radius:8px; }

.overlay { height: 100%; width: 100%; display: none; position: fixed; z-index: 10000; top: 0; left: 0; background-color: rgb(0,0,0); background-color: rgba(0,0,0, 0.9); overflow: scroll; }
.overlay-content { position: relative; width: 100%; text-align: center; margin-top: 30px; }
.overlay a { padding: 8px; text-decoration: none; font-size: 12px; color: #ffffff; display: block; transition: 0.3s; z-index: 1; }
.overlay .closebtn { position: fixed; top: 0px; right: 25px; font-size: 30px; }

.popup { display:none; width:1200px; height:800px; position:fixed; top:30%; left:50%; transform:translate(-50%, -30%); background:white; padding:30px; border:1px solid #ccc; box-shadow:0 5px 15px rgba(0,0,0,0.3); z-index:1000;}
.popup .close { position:absolute; top:0px; right:10px; text-decoration:none; font-weight:800; font-size:28px; color:#333;}

.splideproduct { border-radius: 8px; color:var(--link2color); padding:0px 50px; }
.splideproduct a { color:var(--link1color);}
.splideproduct .splide .splide__arrows .splide__arrow--prev { left:-40px !important; }
.splideproduct .splide .splide__arrows .splide__arrow--next { right: -40px !important; }
#splidemain .splide__track { border-bottom-left-radius:8px; border-bottom-right-radius:8px; }
#splidehProductCustomization .splide__arrow { display:none;}


.myHomeSwiper { height: 460px; width: 100%; }
.myProdutDetailSwiper { height: 500px; width: 500px; }
.mySwiperProducts { width:100%; height:370px;}
.myProductThumbSwiper { width:500px; height: 20%; box-sizing: border-box; padding: 10px 0; }
.swiper-button-next, .swiper-button-prev { color:#000000 !important; }
.swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #000000 !important; } 
.swiper-slidee .productBox { padding-top:20px;}
.swiper-slide .productBox .productBoxBrand { display:none;}
.swiper-slide .productBox .prdescription { display:none;}


.top-nav { background-color: var(--bgcolor4); border-bottom: 1px solid var(--topnav-border); height: 50px; color: white; color:var(--link1color); }
.container { width: calc(100% - 40px); max-width: 1400px; margin: 0 auto !important; height: 100%; }
.containeralternate { margin-top:40px;padding:20px;background-color:var(--bgcolor2);}
.top-nav-main { height: 100%; display: flex;  justify-content: space-between; align-items: center; display: flex; align-items: center; }
.top-nav-main a{ color:var(--link1color); text-decoration:none; font-size:11px; }
.top-nav-left { display:flex;flex-direction:row; gap:10px;align-items:center; }
.right-content { display: flex; flex-direction: row; }
.hidden-header { transform: translateY(-100%); }
.show-header { transform: translateY(0); }

.divMenu { position: sticky; top: 0; z-index: 999; background: white; }
.cart-container { position: relative; }
.cart-count-badge { position: absolute; bottom: -2px; right: -4px; background-color: red; color: white; font-size: 12px; font-weight: bold; border-radius: 50%; padding: 2px 6px; min-width: 18px; text-align: center; line-height: 1; }

.chat-search-container { display: flex; align-items: center; max-width: 600px; margin: 20px auto; }
#searchtText { border: 2px solid var(--link1color); margin-right:20px; outline: none; box-shadow: none; flex: 1; padding: 10px; border-radius: 8px; background-color: #fff; color: #111; font-size: 16px; }
#searchtText:focus {outline: none; border: 2px solid #1f88ff; box-shadow: none; }
.btn_invers { padding: 10px 20px; background-color: var(--bgcolor4); color:var(--link1color); border:2px solid var(--bgcolor1) !important; font-size:20px; line-height:1.3em; border-radius: 8px; cursor: pointer; font-weight: bold; }
.btn_invers:hover {  padding: 10px 20px; background-color: var(--bgcolor1); color: white !important; font-size:20px; line-height:1.3em; border: none; border-radius: 8px; cursor: pointer; font-weight: bold; }

.chat-response { padding: 20px; max-width: 600px; margin: auto; white-space: pre-wrap; font-size: 16px; }

.scroll-top { position: fixed; bottom: 20px; right: 20px; width: 40px; height: 40px; font-size: 24px; border: none; border-radius: 50%; background-color: #333; color: white; cursor: pointer; z-index: 1000; display: none; justify-content: center; align-items: center; }
.scroll-top:hover { background-color: #555; }

.spinner { border: 3px solid #f3f3f3; border-top: 3px solid #3498db; border-radius: 50%; width: 16px; height: 16px; animation: spin 1s linear infinite; display: inline-block; vertical-align: middle; margin-left: 10px; }
.button-loading { background-color: #ccc !important; cursor: default; }
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* MAIN MENU */
.mainmenu { position: relative; }
.mainmenuul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; }
.mainmenuulli { float: left; }
.mainmenuullia { margin: 26px 16px; color: var(--link1color); display: inline-block; text-align: center; text-decoration: none; text-transform: uppercase; font-weight: bold; }
.mainmenuullia:hover, .dropdown:hover { color: var(--link1color) !important; }
.mainmenuullia { position: relative; padding-right: 8px; }
.mainmenuullia .arrow { display: inline-block; margin-left: 6px; width: 8px; height: 8px; border-right: 2px solid #333; border-bottom: 2px solid #333; transform: rotate(45deg); margin-bottom:4px; }
.dropdown:hover .dropdown-content { display: block !important; }
.dropdown { display: inline-block; }
.dropdown-content { display: none; position: absolute; background-color: #ffffff; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 999; }
.dropdown-content a { margin: 8px 8px; text-decoration: none; padding: 3px 0px; }
.mainmenufullwidth { width: 100% !important; left: 0px; padding-top: 20px; }
.dropdown-contentreal { padding: 0px 0px 0px 0px; background-color: var(--link2color); padding: 0px; }
.dropdown-contentreal div { padding: 0px 10px; line-height: 32px; }
.dropdown-contentreal div:hover { line-height: 32px; }
.dropdown-contentreal a { color: var(--link1color); }
.dropdown-contentreal a:hover { color: var(--link1color) !important; }
.simplesubmenu { list-style: none; padding: 0px; }
.simplesubmenu li { }
.simplesubmenu li:hover { }
.simplesubmenu li a { display: inline-block; padding: 10px 16px; text-decoration: none; text-transform: uppercase; }
.simplesubmenu li a:hover { display: inline-block; padding: 10px 16px; text-decoration: none; text-transform: uppercase; }

.menuCategoryDiv { padding: 10px 0px 0px 0px; }
.menuCategoryDivLink { padding-left: 0px !important; }
.menuCategoryDivLink a { padding-left: 0px !important; }
.menuCategoryDiv { width:100%; display:flex;flex-wrap:wrap; }
.menuCategoryItem { display:flex; }
.menuCategoryItem { width: 20% }
.menuCategoryDivImg { padding-right: 3px; }
.menuCategoryDivLink { font-size: 1rem; color: #000000 !important; padding-top: 10px; }

.brandmenusection{ display:flex;flex-direction:column;align-items:center; }
.brandmenusection div { min-height:50px;}
.brandmenutitle { font-size:1.2em; font-weight:bold;}
.brandmenuitem { display:flex;align-items:center;}
.brandmenuitem a {padding:0px; margin:0px;}
.brandmenuImage { filter: grayscale(100%); -webkit-filter: grayscale(100%); max-height: 50px; max-width: 120px; }
.brandmenuImageNo { max-height: 50px; max-width: 120px; }

.centered-content-wrapper { margin: auto auto; }
.centered-content { width: 520px; margin: 40px 0px; background-color: white; border-radius: 8px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .04), 0 4px 16px -4px rgba(0, 0, 0, .16); overflow: hidden; }
.form-alert { padding: 15px; font-weight: bold; color: #fff; border-top-left-radius: 8px; border-top-right-radius: 8px; }
.formpadding { padding:20px;}
.form-body { padding: 40px; }
.formlabel { width:180px;}


/* MAIN MENU END*/

.sideCart { height: 100%; width: 0; position: fixed; background-color:var(--bgcolor3); color:var(--link2color); z-index: 1100; top: 0; right: 0; overflow-x: hidden; transition: 0.3s; -webkit-box-shadow: -9px 0px 5px 0px rgba(0,0,0,0.53); -moz-box-shadow: -9px 0px 5px 0px rgba(0,0,0,0.53); box-shadow: -9px 0px 5px 0px rgba(0,0,0,0.53); }
.sideCart a { text-decoration: none; font-size: 0.9em; color: var(--link2color); display: block; transition: 0.3s; }
.sideCart a:hover { color: #000000; }
.sideCart .closebtn { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; }

.cart-sidebar {width:400px;padding:20px;overflow-y:auto;}

.cart-loading { display: flex; justify-content: center; align-items: center; height: 200px; /* kosár magassága amíg tölt */ }
.spinner { border: 4px solid rgba(0, 0, 0, 0.1); width: 36px; height: 36px; border-radius: 50%; border-left-color: #09f; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.divMiniCart { position: relative; width: 100%; }
.miniCart { padding: 20px 10px; }
.miniClassWidth { width: 400px; }
.miniCartName a { font-size: 1rem; }
.miniCartClose { position: absolute; top: 10px;right: 15px;}
.miniCartEmpty { text-align: center; font-weight: bold; line-height: 25px; }

.hightLightName { padding-top:20px;}

.blogmaincontainer { display:flex;width:430px; flex-direction:column; background-color:var(--bgcolor3); color: var(--link2color); border:1px solid var(--link1color); border-bottom-left-radius :10px; border-bottom-right-radius :10px;}
.blogmainlist {display: flex; justify-content: space-between; }
.blogmaintitle a { text-transform: uppercase; color:var(--link2color); font-size: 1.2rem; font-weight: bold; }
.blogmaindata {padding: 10px 20px 0px 20px;}
.blogmaindate { padding: 10px 0px; font-size: 1rem; padding:20px 30px !important; }
.blogmainlead { font-size: 1.1rem; }
.blogmainreadmore { margin-bottom: 20px; }
.blogmainreadmore a { color:var(--link4color); line-height: 30px; font-size: 1rem; }

.mpCatalog { margin-top: 20px; display: flex; flex-direction:row; flex-wrap: wrap; justify-content: space-between; }
.mpCatalogColumn { margin-bottom:20px;width: 320px; background-color:var(--bgcolor3); border-radius:10px; text-align:center; padding: 15px; margin-bottom: 20px; }    
.mpCatalogTitle { padding: 5px 0px 10px 0px;}
.mpCatalogTitle a { color:#ffffff;}

.brand-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 20px; padding: 20px 0; }
.brand-card { display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 10px; border: 1px solid #eee; border-radius: 10px; background-color: #fff; height: 220px; box-shadow: 0 2px 6px rgba(0,0,0,0.05); transition: transform 0.2s ease; }
.brand-card:hover { transform: translateY(-4px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.brand-image { display: flex; align-items: center; justify-content: center; height: 120px; width: 100%; }
.brand-image img { max-height: 100px; max-width: 100%; object-fit: contain; display: block; }
.brand-name { text-align: center; height: 40px; display: flex; align-items: center; justify-content: center; }
.brand-name a { text-decoration: none; color: #222; font-size: 14px; line-height: 1.2; }

.category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; padding: 20px 0; }
.category-card { display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 10px; border: 1px solid #eee; border-radius: 10px; background-color: #fff; height: 240px; box-shadow: 0 2px 6px rgba(0,0,0,0.05); transition: transform 0.2s ease; }
.category-card:hover { transform: translateY(-4px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.category-image { display: flex; align-items: center; justify-content: center; height: 180px; width: 100%; }
.category-image img { max-height: 180px; max-width: 100%; object-fit: contain; display: block; }
.category-name { text-align: center; height: 40px; display: flex; align-items: center; justify-content: center; }
.category-name a { text-decoration: none; color: #222; font-size: 14px; line-height: 1.2; }

.reference-grid { display: flex; flex-direction: row; justify-content:space-between; gap: 20px; flex-wrap: wrap;}
.reference-card { display: flex; justify-content: center; align-items: center; background-color:#ffffff; border-radius:8px; width: 150px; height: 100px; }
.reference-card img { width: 130px; height: auto; display: block; }

.bgcard {background-color:rgb(247 247 247/1);}

.cards-container { display: flex; flex-wrap: wrap; gap: 24px; justify-content: center; }
.card { background-color: var(--bgcolor3); color: var(--link2color); border-radius: 16px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05); padding: 24px; text-align: center; width: 240px; transition: transform 0.2s ease; }
.card img { width: 96px;    height: 96px; margin-bottom: 16px; }
.card h3 {  font-size: 18px; color: var(--link2color); margin-bottom: 8px; }
.card p { font-size: 14px; color: var(--link2color); }

.faq_container { padding:0px 20px 0px 20px; margin-bottom:20px; background-color:var(--bgcolor4); border: 1px solid var(--link1color); border-radius: 5px; }
.faq_question { position: relative; padding: 12px 40px 12px 12px; color:var(--link2color); cursor: pointer; margin: 6px 0px; font-size: 1.1rem; text-transform: none; }
.faq_answer { display: none; color:var(--link1color); }
.faq-toggle-sign { color:var(--link1color); }
.faqsubmitmobile { }
footer { background-color: var(--bgcolor3); padding: 2rem; font-size: 14px; color: var(--link3color); display: flex; flex-direction:row; flex-wrap: wrap; justify-content: center; gap: 2rem; }
.footer-section-container { display:flex; flex-direction:row;}
footer .footer-section { width: 20%; }
footer .footer-title { font-weight: bold; margin-bottom: 1rem; }
footer ul { list-style: none; padding: 0; }
footer ul li { margin-bottom: 0.5rem; }
footer a { text-decoration: none; color: var(--link3color); }
footer a:hover { text-decoration: underline; color: var(--link3color); }
.footer-bottom{ display:flex;flex-direction:row;justify-content:space-between;padding-top:10px;border-top:1px solid #ddd;}

.tabs { display: flex; cursor: pointer; }
.tab { padding: 10px 20px; background: #eee; margin-right: 5px; border-radius: 5px 5px 0 0; }
.tab.active { background: #ccc; font-weight: bold; }
.tab-content { display: none; padding: 15px; border: 1px solid #ccc; }
.tab-content.active { display: block; }

#chat-widget {position: fixed; bottom: 20px; right: 80px; width: 300px; font-family: sans-serif; z-index: 9999; }
#chat-header { background-color: var(--bgprimaybutton); color: white; padding: 10px; cursor: pointer; border-radius: 10px 10px 0 0; font-weight: bold; }
#chat-body {background-color: #111; color: white; border: 1px solid #333; border-top: none; border-radius: 0 0 10px 10px; max-height: 400px; display: flex; flex-direction: column; }
#chat-messages { padding: 10px; flex: 1; overflow-y: auto; max-height: 300px; }
.chat-input-row { padding:5px; display: flex; border-top: 1px solid #333; }
.chat-input-row input { flex: 1; background-color: #000; color: white; border: none; padding: 10px; outline: none; }
.chat-input-row button { background-color: var(--bgprimaybutton); color: white; border: none; padding: 10px; cursor: pointer; }
.chat-msg-user { text-align: right; margin: 5px 0; font-weight: bold; }
.chat-msg-bot { text-align: left; margin: 5px 0; color: #ccc; }

.scroll-top { position: fixed; bottom: 20px; right: 20px; width: 40px; height: 40px; font-size: 24px; border: none; border-radius: 50%; background-color: #333; color: white; cursor: pointer; z-index: 1000; display: none; justify-content: center; align-items: center; }

.pagepopup {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.75); display: none; z-index: 9999; }
.popup-frame-wrapper { position: relative; width: 800px;  height: 85%; margin: 5% auto; transition: width 0.3s ease; }
.popup-frame-wrapper iframe {width: 100%; height: 100%; border: none; background: white; border-radius: 6px; box-shadow: 0 0 15px rgba(0,0,0,0.3); display: block; }
/*.popup-frame-wrapper .close { position: absolute; top: -15px; right: -15px; background: white; color: black; font-size: 24px; width: 30px; height: 30px; line-height: 28px; text-align: center; border-radius: 50%; box-shadow: 0 0 5px rgba(0,0,0,0.3); cursor: pointer; text-decoration: none; }*/

.breadcrumb-nav { background-color: var(--bgcolor2); }
.breadcrumb { display: flex; flex-wrap: wrap; list-style: none; padding: 10px 0px; margin: 0; font-size: 0.95rem; }
.breadcrumb li { display: flex; align-items: center; color: var(--link2color);}
.breadcrumb li:not(:last-child):after { content: "\003E"; padding: 0 8px; color: #aaa; font-size: 1rem; }
.breadcrumb a { text-decoration: none; color: var(--link2color); transition: color 0.2s; }
.breadcrumb a:hover { color: var(--link2color); text-decoration: underline; }
.breadcrumb .active { color: var(--link2color); }

.pagination { color:var(--link2color);}
.pagination ul { display: flex; list-style: none; gap: 6px; padding: 0; }
.pagination li { width:40px; height:40px;border-radius:6px;border: 1px solid #1f1f1f; background-color:var(--bgcolor2); }
.pagination li a { display:flex; width:100%; height:100%;align-items:center;justify-content:center; text-decoration: none; color:var(--link2color); }
.pagination li span { display:flex; width:100%; height:100%;align-items:center;justify-content:center; text-decoration: none; }
.pagination li.active a { display:flex; width:100%; height:100%;align-items:center;justify-content:center; background-color: var(--bgcolor4); color:var(--link1color); border-radius:5px; }

.page-wrapper { min-height: 100vh;display: flex;flex-direction: column; }
.left_wrapper { width: 280px !important; margin: 0px 20px 0px 0px; !important }
.container2column { display:flex;padding-top:20px;}

.productbrandbanner { max-height:350px;overflow:hidden;}
.productlistitle { display: flex; align-items: center; gap: 8px;}
.productlisttitle h1 {margin: 0; font-size: 36px; line-height: 1.2;}
.productlistfilter { display: flex; flex-direction:row; justify-content: space-between; align-items: center; min-height: 50px; }


.google-review-container { display: flex; flex-direction: column; flex-wrap: wrap; gap: 20px; border-radius: 10px; background-color:black; margin: 20px 0px;padding:30px 30px; }
.google-reviews-title { display:flex;flex-direction:row;align-items:center;color:white;font-size:2em;font-weight:bold;}
.google-reviews { display: flex; flex-direction: row; flex-wrap: wrap; gap: 20px; }
.google-review { flex: 1; min-width: 250px;background-color: #3C4043; border-radius: 10px; padding: 15px; color:white; }
.google-review .author { font-weight: bold; margin-bottom: 5px; }
.google-review .stars { color: #fbc02d; margin-bottom: 10px; }
.google-review .text { font-style: italic; color: white; }
.google-review .text small a.toggle-review-link {color: #ffffff; font-size: 12px; text-decoration: none; cursor: pointer;}
.google-review .time { font-size: 12px; color: #888; margin-top: 10px; }


.color-filter-container { display: flex; flex-wrap: wrap; gap: 10px; padding: 0px 0px 20px 0px; }
.color-filter-item { position: relative; }
.color-checkbox { display: none; }
.filter-color-box { width: 30px; height: 30px; border: 1px solid #ccc; border-radius: 4px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 18px; color: white; font-weight: bold; position: relative; }
.filter-color-box .checkmark { display: none; }
.color-checkbox:checked + .filter-color-box .checkmark { display: block; }

.product-grid {  display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 16px;  }
.product-card { width: calc((100% - 3 * 16px) / 4);  }
.productBox { display: flex; flex-direction:column; width:100%; background-color:var(--bgcolor4); color:var(--link1color); padding: 10px 5px 20px 5px; font-size: 1.2rem; box-sizing: border-box; }
.productBox a  { color:var(--link1color); }
.productBoxBrand { text-align: center; text-transform: uppercase; height: 20px; font-size: 1rem; }
.productBoxName { text-align: center; text-transform: uppercase; overflow:hidden; height: 45px; font-size: 1rem; }
.productBoxName a { color:var(--link1color); }
.productBoxImage { display:flex; background-color:var(--link2color); border-radius:10px; justify-content: center;min-height: 200px; align-items: center; height:200px; }
.imgmix { mix-blend-mode: multiply; }
.productBoxImg { max-width: 200px; max-height: 200px; }
.productBoxColorContainer { padding-top:5px;min-height:45px; }
.productBoxColorContainer ul { display:flex;flex-direction:row;list-style: none;padding:0px;  margin:0px;}
.productBoxPrice { font-weight: bold; height: 25px; text-align: center;}
.productBoxStock{ min-height:25px; }
.productBoxPN { text-align: center; }
.prdescription { min-height:52px; height:52px; overflow:hidden;}

.color-box { display: inline-block; width: 18px; height: 18px; margin: 2px; border: 1px solid #ccc; border-radius: 0; cursor: pointer; border-radius: 4px;}

.contactus { display:flex;flex-direction:row;gap:20px;}
.contactus_left { width:600px;}
.contactus_right { width:400px;}
.officeMapIframe { width:100%; height:500px;}

.productImg { width: 500px; height: 500px; display:flex;align-items:center; }
.productImgDiv { text-align:center;background-color:#f4f4f4;height:600px; }
.productImgImg { max-height:500px;max-width:500px;mix-blend-mode:multiply; }
.productDetailRight { margin-left:20px; }
.productDetailRequest { width: 250px; margin: 0px 0px 0px 0px; -}
.prpopupimgdiv { background-color:white;width:800px;text-align:center;}
.thumbnails { display:flex;gap:20px;width:500px;overflow:hidden;}
.productinfoContainerMobile { display:none;}

.pdCustomization { display:flex;flex-direction:row;gap:50px;}
.pdCImageContainer { display:flex;align-items:center; min-height:200px; max-height:200px;}

.productfamilyContainer { display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between; }
.productfamilyItem { text-align:center; }

/*.thumbnail { opacity: 0.3; }*/
/*.thumbnail.is-active { opacity: 1; }*/
.responsiveImage { max-width: 100%; height: auto; }
#page-loading-overlay { display: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(255, 255, 255, 0.5); /* halvány overlay */ z-index: 9999; display: flex; /* középre igazításhoz flexbox */ justify-content: center; align-items: center; }


.specialProductContent { width: 200px; }
.specialProductImage { min-height: 240px; }

.infoMenuColumn { background-color: var(--bgcolor3); border-radius: 5px }
.infoMenuTitle { padding: 10px 14px 6px 24px; border-bottom: 1px solid var(--base1color); }
.infoMenuTitle h3 { margin: 0px; padding-left: 0px; color:var(--link2color); }
.infoMenuTitle h3 a { color:var(--link2color); }
.infoMenuItemContainer { padding:10px 0px 20px 20px; }
.infoMenuItem {padding:2px 0px 2px 20px}
.infoMenuItem a { color:var(--link2color);}

.divFilterItem { display:flex;flex-direction:row;gap:8px; color:var(--link2color);align-items:center;font-size:1.1em; }
.divFilterItem input[type="checkbox"] {
    width: 20px;
    height: 20px;
}

.blogmaincontainer { display:flex; flex-direction:column;}
.blogmainlist {display: flex; justify-content: space-between; }
.blogmaintitle a { text-transform: uppercase; color:var(--link2color); font-size: 1.2rem; font-weight: bold; }
.blogmaindate { padding: 10px 0px; font-size: 1rem; }
.blogmainlead { font-size: 1.1rem; }
.blogmainreadmore { margin-bottom: 20px; }
.blogmainreadmore a { line-height: 30px; font-size: 1rem; }

.bloglistitem { margin-bottom:30px;}
.bloglisttitle a { font-size: 1.3em; font-weight:bold; }
.bloglistdate { margin:10px 0px;}
.bloglistlead { }
.bloglistreadmore { margin:10px 0px 0px 0px; }
.bloglistreadmore a { }

.blogdetaillead { font-size: 1.2em; }
.blogdetaildate { margin-bottom:10px;}
.blogdetailContent{ font-size: 1.1em}
.blogdetailContent a{ font-size: 1.1em }

.filtercolorbox { width: 25px; height: 25px; margin: 5px; border: 1px solid #9a9a9a !important; }

.produtRequestForm { background-color:var(--bgcolor3); color:var(--link2color); padding:20px; border-radius:8px; }
.productpage { display:flex;flex-direction:column;}
.productContainer { padding-top:40px;display: flex; flex-direction: row; gap:20px; width: 100%; }
.productImgContainer { width: 500px; height:500px;display:table; border-radius:8px; background-color:#ffffff; }
.pdDetailContainer { flex: 0 0 500px;}
.pdDetailinfo { padding-left:20px;}
.imagedetailContainer { display: flex; }
.divProductColors { display:flex; flex-wrap:wrap; padding: 0px 3px 10px 3px; gap:20px; }
.divProductColors img { max-width: 60px; max-height: 60px; }
.propetyLead { font-weight:bold;}
.lead-content { display:flex; justify-content:space-between; align-items:center; padding:10px 0px; cursor:pointer; }
.propetyLead {border-top: 1px solid var(--link1color); cursor: pointer; padding: 10px 10px 10px 0px; text-align: left; outline: none; }
.propetyLeadContent { display: none; padding-bottom: 10px; }
.propetyLead[data-open="true"]:after { content: '\2212'; /* − jel */ }

.customizationList { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between;}
.customizationListItem { justify-items:center; }
.customizationListItem img { max-width:250px;}
.customizationListItemName { text-align:center; font-weight:bold;}

@media (max-width: 500px) { 
    .form-row-responsive { flex-direction: column; align-items: stretch; } 
    .form-row-responsive label { min-width: auto; margin-bottom: 5px; }
}

@media only screen and (max-width: 1200px) {
    h1 { margin-top:10px; margin-bottom:0px;}
    .brt { border: 1px solid;}
    .brtw { border: 1px solid #ffffff;}
    .brtb { border: 1px solid #000000;}
    .top-nav { display:none;}
    .divMenu { display:none;}
    .slidercontainer { display:none;}
    .mobilemenu { display:flex;flex-direction:row;background-color:#000000;width:100%;height:55px;justify-content:space-between;align-items:center;}
    .container {width:100%;}
    .containeralternate { width:100%;}
    .bg{ background-color:#ffffff;}
    .bgalternate { background-color:rgb(247 247 247/1); }
    .footer {display:none;}
    .noborder { border: 0px !important;}
    .overlay a { color:#000000;}

    #splidehProductCustomization .splide__arrow { display:block; }

    .mobileback { position:absolute; top:5px; right:10px; text-decoration:none; font-size:36px; font-weight:800; color:#000;}
    .mobileleftmenu { height: 100%; width: 0; background-color:#000000; position: fixed; z-index: 1000; top: 0; left: 0; overflow-x: hidden; transition: 0.3s;}
    .mobileleftmenu a { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 15px; display: block; transition: 0.3s; }
    .mobileleftmenu .closebtn { position: absolute; padding:0px; top: 0; right: 15px; font-size: 36px; margin-left: 60px; }
    .mobileleftmenu div { }
    .sidenavWidth { width:300px;}
    .breadcrumb-nav {padding-left:10px;}
    .menumobilecategories { padding-top:40px; color:white;border-color:white;}
    .mobil-search-form  { padding:20px 0px; }
    .search-form { max-width: 100%; padding:0px 20px; margin: 0 auto;position: relative; }
    .search-label { margin-bottom: 8px; font-size: 14px; font-weight: 500; color: #1f2937; position: absolute; left: -9999px; }  screen-reader only 
    .search-wrapper { position: relative; }
    .search-icon { position: absolute; top: 0; bottom: 0; left: 20; display: flex; align-items: center; padding-left: 12px; pointer-events: none; }
    .search-icon-svg { width: 16px; height: 16px; color: #6b7280; }
    .search-input { width: 100%; padding: 16px 16px 16px 40px; font-size: 14px; color: #111827; border: 1px solid #d1d5db; border-radius: 8px; background-color: #f9fafb; outline: none; }
    .search-input:focus { border-color: #3b82f6; box-shadow: 0 0 0 1px #3b82f6; }
    .search-button { position: absolute; right: 10px; bottom: 0px; background-color: var(--bgcolor1); color: white; padding: 16px 16px; font-size: 14px; font-weight: 500; border: none; border-radius: 8px; cursor: pointer; }
    .search-button:hover { background-color: #1e40af; }

    .cart-sidebar {width:300px; } 
    .miniClassWidth { width: 300px; }
    .hltitle1 { text-align:center;}

    .main_wrapper { margin:0px 10px;}
    .hightLightName { padding:0px; text-align:center; }

    .myProdutDetailSwiper { height: 80%; width: 100%;max-width: 100vw; }
    .myProductThumbSwiper { width:100%;max-width: 100vw;}
    .blogmainlist { flex-direction:column; gap:30px;}
    .blogmaincontainer { width:100%; border:0px; border-radius:0px;}
    .blogmaindata { padding:0px 20px;}

    .mpCatalogColumn { width:100%; border:0px; text-align:center;}
    .mpCatalogTitle { height:45px; max-height:45px; overflow:hidden;text-align:center; padding:5px 0px;}
    .mpCatalogTitle a { color:#ffffff;}

    .brand-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));  margin: 0 10px; }
    .brand-card { display: flex; flex-direction: row; justify-content: space-between; height: auto; min-height: 100px; align-items: center; padding: 0;   background-color: transparent; border: none; box-shadow: none; }
    .brand-image { display: flex; align-items: center; justify-content: center; height: 100px; width: 100%; }
    .brand-image img { max-height: 100px; max-width: 100%; object-fit: contain; display: block; }
    .brand-name { display:none; }
    .brand-name a { text-decoration: none; color: #222; font-size: 14px; line-height: 1.2; }

    .category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; margin: 0 10px; }
    .category-card { display: flex; flex-direction: column; align-items: center; padding: 0; background-color: transparent; border: none; box-shadow: none; height: auto; }
    .category-image { min-height: 150px; display: flex; align-items: center; justify-content: center; width: 100%; }
    .category-image img { max-height: 150px; max-width: 100%; object-fit: contain; display: block; }
    .category-name { text-align: center; height: 36px; display: flex; align-items: center; justify-content: center; }
    .category-name a { text-decoration: none; color: #222; font-size: 14px; line-height: 1.2; }

    .reference-grid { display: flex; flex-direction: row; justify-content:space-between; gap: 20px; flex-wrap: wrap;}
    .reference-card { display: flex; justify-content: center; align-items: center; width: 150px; height: 100px; }
    .reference-card img { width: 130px; height: auto; display: block; }

    .bgcard {background-color:rgb(247 247 247/1);}    
    .cards-container { display: flex; flex-direction:row; gap: 5px; }
    .card { background-color: white; border-radius: 16px;  padding-top: 15px; text-align: center; width: 49%; transition: transform 0.2s ease; }
    .card img { width: 96px;  height: 96px; margin-bottom: 16px; }
    .card h3 {  font-size: 18px;  margin-bottom: 8px; color: #0d2b4a; }
    .card p { font-size: 14px; color: #444; }

    .faqsubmitmobile { text-align:center; }

    footer { display: flex; flex-wrap: wrap; justify-content: center; flex-direction:column; background-color: var(--bg2); padding: 2rem; border-top: 1px solid #ddd; font-size: 14px; color: #555; gap: 2rem; }
    footer .footer-section { width: 100% }
    footer .footer-section img { width: 250px; }
    footer-bottom{ display:flex;flex-direction:column;justify-content:space-between;padding-top:10px;border-top:1px solid #ddd;}
    .propetyLead { display:flex;flex-direction:column; border-top:1px solid; font-size:18px; padding-left:0; }
    .propetyLeadNo { color:#ffffff; border-top:1px solid; font-size:18px; padding:10px 20px; }
    .lead-content { display:flex; justify-content:space-between; align-items:center; padding:10px 0px; cursor:pointer; }
    .toggle-sign { font-weight:bold; margin-left:10px; color:var(--link3color); }
    .propetyLeadContent a { color:#ffffff; }
    .propetyLeadContent ul { margin:0px; }
    .propetyLeadContent ul li { line-height:25px; }

    #chat-widget {position: fixed; bottom: 20px; right: 10px; width: 90px; max-width: 90%; background: white; border: 1px solid #ccc; border-radius: 10px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); font-family: sans-serif; z-index: 9999; }
    #chat-header { padding: 10px; background: #1f88ff; color: white; font-weight: bold; border-top-left-radius: 10px; border-top-right-radius: 10px; cursor: pointer; }
    #chat-widget.open { width: 300px; }
    #chat-body { display: none; flex-direction: column; height: 100%; }
    #chat-widget.open #chat-body { display: flex; }

    .scroll-top { position: fixed; bottom: 20px; left: 20px; width: 40px; height: 40px; font-size: 24px; border: none; border-radius: 50%; background-color: #333; color: white; cursor: pointer; z-index: 1000; display: none; justify-content: center; align-items: center; }

    .form-container  { width: 100%;}
    .formfieldspace { flex-direction:column;}
    .formfieldspace .input-wrap { width:100%; }
    .formfieldlabel { width:100%; text-align:left;}

    .contactus { display:flex;flex-direction:column;}
    .contactus_left { width:100%;}
    .contactus_right { width:100%;}

    .left_wrapper { display: none; }
    .container2column { padding:0px;}
    .filter-toggle-btn { display: inline-block; margin-bottom: 10px; background: #333; color: white; padding: 10px 15px; border: none; font-size: 16px; cursor: pointer; }
    .mobile-filter-panel {position: fixed; top: 0; left: -100%; width: 80%; max-width: 300px; height: 100%; background-color: #000000; box-shadow: 2px 0 10px rgba(0,0,0,0.2); padding: 20px; z-index: 9999; overflow-y: auto; transition: left 0.3s ease; }
    .mobile-filter-panel.active { left: 0; }
    .mobile-filter-close { position:absolute; padding:0px; right:20px; top: 5px; color:var(--link2color); background: none; border: none; font-size: 24px; cursor: pointer; }
    .productbrandbanner { display:none;}
    .productlistfilterCount { display:none;}
    
    .google-review-container { border-radius:0px; }
    .google-reviews { width:100%;}
    .google-reviews-title { flex-direction:column; }

    .infoMenuColumn { background-color:var(--bgcolor4); }
    .infoMenuTitle h3 { color:var(--link1color); }
    .infoMenuTitle h3 a { color:var(--link1color); }
    .divFilterItem { color:var(--link1color); }
    .product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; }
    .product-card { width:auto; padding:0px; }
    .pager { display:none;}   
    .pagermobile { display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:40px;margin:0px 0; }
    .mobilefiltercontainer {position: fixed; left: 10px; bottom: 15px; z-index: 9999; }
    .mobilefilter { border:1px solid #000000; background-color:#000000; display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:6px;cursor:pointer;}
    .productBoxName { height:45px !important; }
    .productlistfilter { flex-direction:column;}
    .prdescription { display:none; }

    .productContainer { flex-direction:column; padding-top:0px;}
    .productImgContainer { width:100%;height:auto;}
    .productImg { width:100%; height:auto;width:500px; }
    .productImgDiv{ height:auto;}
    .productImgImg { width:100% !important; height:auto;}
    .prpopupimgdiv { width:100%;background-color:white;text-align:center; }
    .pdimagecarousel { display:none;}
    .pdDetailContainer { width:100%;padding:0px 20px;}
    .thumbnails { display:none;}
    .produtRequestForm { border-radius:0px;}

    .productinfoContainer { display: none;}
    .productinfoContainerMobile { display:block; padding: 0px 10px; }
    
    .pdCustomization { display:flex;flex-direction:row;flex-wrap:wrap;}

    .productfamilyItem { width:50%;text-align:center; }

    .offer-help-box { margin: 0px 20px;}
    .carttitle { text-align:center;}
    .cart-summary { display:none;}
    .cartsubtitle { text-align:center;}
    .cartpagecontainer { flex-direction:column !important; }
    .cart-row { flex-direction: column; align-items: center; flex-wrap: wrap; }   
    .cart_form { flex-direction:column !important; margin:0px 20px; width:auto !important; }
    .cart_actions { flex-direction:column; padding:25px 25px 0px 25px !important; }

    .thumbnails { width:100% !important;}

    .customizationListItem { width:100%;}
}
@media (max-width: 768px) {
  .popup-frame-wrapper .close {
    top: 10px;
    right: 10px;
  }
}

@media only screen and (min-width: 1200px) {
    .footermobile { display:none;}
    .divMenuMobile { display:none;}
      .mobile-filter-panel,
     .filter-toggle-btn {
        display: none !important;
    }
    .pagermobile { display:none;}
    .mobilefiltercontainer { display:none;}
    .mobiletotalcount { display:none;} 
}

@media (min-width: 769px) {
    .card {
        width: 240px;
    }
}