@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: "woodmart-font";
	src: url("//betoncserepek.hu/wp-content/themes/woodmart/fonts/woodmart-font-1-400.woff2?v=8.4.1") format("woff2");
}

@font-face {
	font-family: "star";
	font-weight: 400;
	font-style: normal;
	src: url("//betoncserepek.hu/wp-content/plugins/woocommerce/assets/fonts/star.eot?#iefix") format("embedded-opentype"), url("//betoncserepek.hu/wp-content/plugins/woocommerce/assets/fonts/star.woff") format("woff"), url("//betoncserepek.hu/wp-content/plugins/woocommerce/assets/fonts/star.ttf") format("truetype"), url("//betoncserepek.hu/wp-content/plugins/woocommerce/assets/fonts/star.svg#star") format("svg");
}

@font-face {
	font-family: "WooCommerce";
	font-weight: 400;
	font-style: normal;
	src: url("//betoncserepek.hu/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.eot?#iefix") format("embedded-opentype"), url("//betoncserepek.hu/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.woff") format("woff"), url("//betoncserepek.hu/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.ttf") format("truetype"), url("//betoncserepek.hu/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.svg#WooCommerce") format("svg");
}

:root {
	--wd-text-font: "Hind", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: #767676;
	--wd-text-font-size: 14px;
	--wd-title-font: "Palanquin Dark", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 400;
	--wd-title-color: #242424;
	--wd-entities-title-font: "Palanquin Dark", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 400;
	--wd-entities-title-color: #333333;
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Palanquin Dark", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 400;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Hind", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 600;
	--wd-header-el-transform: none;
	--wd-header-el-font-size: 13px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(255,145,79);
	--wd-alternative-color: #fbbc34;
	--btn-default-font-family: "Palanquin Dark", Arial, Helvetica, sans-serif;
	--btn-default-font-weight: 400;
	--btn-default-transform: uppercase;
	--btn-default-bgcolor: rgb(255,172,79);
	--btn-default-bgcolor-hover: rgb(255,130,58);
	--btn-accented-font-family: "Palanquin Dark", Arial, Helvetica, sans-serif;
	--btn-accented-font-weight: 400;
	--btn-accented-transform: uppercase;
	--btn-accented-bgcolor: rgb(255,145,79);
	--btn-accented-bgcolor-hover: rgb(255,124,48);
	--wd-form-brd-width: 1px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: #333333;
	--wd-link-color-hover: #242424;
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: #111111;
	background-image: url(https://betoncserepek.hu/wp-content/uploads/2021/10/tools-popup.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
	--wd-popup-padding: 15px;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: rgb(255,145,79);
	background-image: none;
}
html .product-image-summary-wrap .product_title, html .wd-single-title .product_title {
	font-family: "Palanquin Dark", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 32px;
	text-transform: uppercase;
}
.page :is(.wd-page-content, .whb-header) {
	background-color: rgb(248,248,248);
	background-image: none;
}
.product-labels .product-label.onsale {
	background-color: rgb(129,215,66);
}
.product-labels .product-label.new {
	background-color: rgb(255,145,79);
}
.product-labels .product-label.featured {
	background-color: rgb(221,51,51);
}
.product-labels .product-label.out-of-stock {
	background-color: rgb(255,145,79);
}
.product-labels .product-label.attribute-label:not(.label-with-img) {
	background-color: rgb(255,145,79);
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
.wd-builder-off .wd-fbt.wd-design-side {
	--wd-form-width: 100%;
}
:root{
--wd-container-w: 1400px;
--wd-form-brd-radius: 0px;
--btn-default-color: #fff;
--btn-default-color-hover: #fff;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 0px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-default-box-shadow-active: none;
--btn-default-bottom: 0px;
--btn-accented-bottom-active: -1px;
--btn-accented-brd-radius: 0px;
--btn-accented-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .15);
--btn-accented-box-shadow-hover: inset 0 -2px 0 rgba(0, 0, 0, .15);
--wd-brd-radius: 0px;
}

@media (min-width: 1400px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: rgb(255,145,79);
}

.wd-product .price {
    font-size: 16px !important;
}

.wd-nav>li>a {
    font-size: 20px !important;
	  text-transform: uppercase !important;
}

/* ===== PRODUCT CONTACT BOX – BRIDGE ===== */

.product-contact-box{
  margin-top: 25px;
  padding: 20px 22px;
  background: #ffffff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.06);
}

.product-contact-row{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 0;
  line-height: 1.35;
}

.product-contact-row + .product-contact-row{
  border-top: 1px solid rgba(0,0,0,0.06);
}

.product-contact-row strong{
  font-weight: 700; /* nem túl kövér */
  min-width: 90px;
  color: #111;
}

.product-contact-row a{
  font-weight: 600; /* a szám/email kevésbé kövér */
  text-decoration: none;
  color: #e53935;
}

.product-contact-muted{
  display: block;
  font-size: 14px;
  opacity: 0.75;
  margin-top: 4px;
}/* =========================
   NARANCSOS "KÁRTYÁS" BOXOK (több doboz egymás alatt)
   ========================= */

/* opcionális külső stack (ha van) */
.decision-stack,
.decision-wrap {
  display: grid;
  gap: 18px;
  margin: 18px 0;
}

/* maga a kártya */
.decision-box,
.decision-card {
  background: #ffffff;
  border: 1px solid #eeeeee;
  border-radius: 12px;
  overflow: hidden;
}

/* narancs fejléc sáv */
.decision-box .decision-title,
.decision-card .decision-title,
.decision-box .decision-head,
.decision-card .decision-head,
.decision-box > .title,
.decision-card > .title {
  background: #ff8a00;
  color: #111;
  font-weight: 800;
  font-size: 15px;
  line-height: 1.2;
  padding: 12px 14px;
}

/* tartalom (sorok környezete) */
.decision-box .decision-body,
.decision-card .decision-body {
  padding: 0;
}

/* 1 sor (bal: címke, jobb: érték) */
.decision-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 12px 14px;
  border-top: 1px solid #f0f0f0;
  align-items: center;
}

.decision-row:first-child {
  border-top: 0;
}

/* bal oldali felirat */
.decision-label,
.decision-key,
.decision-row .label,
.decision-row .key {
  font-weight: 700;
  color: #222;
  font-size: 13px;
}

/* jobb oldali érték */
.decision-value,
.decision-val,
.decision-row .value,
.decision-row .val {
  font-weight: 800;
  color: #111;
  font-size: 13px;
  text-align: right;
  word-break: break-word;
}

/* kis "tábla" érzés: enyhe kerekítés a doboz sarkain belül */
.decision-box,
.decision-card {
  box-shadow: 0 1px 0 rgba(0,0,0,0.03);
}

/* mobilon egymás alá a két oszlop */
@media (max-width: 640px) {
  .decision-row {
    grid-template-columns: 1fr;
  }
  .decision-value,
  .decision-val,
  .decision-row .value,
  .decision-row .val {
    text-align: left;
  }
}/* =========================
   FELSŐ BLOKK – NARANCS SIGNATURE PANEL
   ========================= */

.brand-tech-panel {
  background: #ffffff;
  border-left: 8px solid #ff8a00;
  border-radius: 16px;
  padding: 28px;
  margin-top: 30px;
  box-shadow: 0 15px 40px rgba(0,0,0,0.06);
}

.brand-tech-title {
  font-size: 18px;
  font-weight: 800;
  margin-bottom: 22px;
  letter-spacing: 0.5px;
}

.brand-tech-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}

.brand-tech-item {
  background: #f7f7f7;
  padding: 18px;
  border-radius: 12px;
  transition: all 0.25s ease;
}

.brand-tech-item:hover {
  background: #efefef;
  transform: translateY(-3px);
}

.brand-tech-name {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 6px;
  color: #222;
}

.brand-tech-value {
  font-size: 13px;
  font-weight: 700;
  color: #ff8a00;
}

@media (max-width: 768px){
  .brand-tech-grid {
    grid-template-columns: 1fr;
  }.adria-title{
  font-weight: 900;
  font-size: 18px;
  margin: 10px 0 8px 0;
  border-left: 8px solid #ff8a00;
  padding-left: 12px;
}

.adria-text{
  background:#fff;
  border:1px solid #f0f0f0;
  border-radius:16px;
  padding:18px 18px;
  box-shadow:0 12px 30px rgba(0,0,0,0.06);
  line-height:1.65;
  color:#444;
}

.adria-specs-title{
  margin-top:16px;
  font-weight:900;
  font-size:16px;
  position:relative;
  padding-left:14px;
}

.adria-specs-title::before{
  content:"";
  position:absolute;
  left:0;
  top:3px;
  width:4px;
  height:16px;
  background:#ff8a00;
  border-radius:2px;
}

.adria-spec-list{
  list-style:none;
  padding:0;
  margin:12px 0 0 0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 14px;
}

.adria-spec-list li{
  background:#f7f7f7;
  border:1px solid rgba(0,0,0,0.04);
  border-radius:12px;
  padding:12px 12px;
  font-weight:700;
}

.adria-spec-list strong{
  color:#222;
}

@media (max-width:768px){
  .adria-spec-list{ grid-template-columns:1fr; }
}
}/* =========================================
   FELSŐ BLOKK – ERŐS, MÁRKÁS PANEL (ADRIA)
   ========================================= */

.adria-topblock{
  margin-top: 16px;
  display: grid;
  gap: 16px;
}

/* Felső szövegpanel */
.adria-hero{
  background: linear-gradient(135deg, #ffffff 0%, #fff3e7 100%);
  border: 2px solid rgba(255,138,0,0.35);
  border-left: 10px solid #ff8a00;
  border-radius: 18px;
  padding: 22px 22px;
  box-shadow: 0 18px 45px rgba(0,0,0,0.10);
}

.adria-badge{
  display: inline-block;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .8px;
  text-transform: uppercase;
  background: #1f1f1f;
  color: #fff;
  padding: 7px 12px;
  border-radius: 999px;
  margin-bottom: 10px;
}

.adria-title{
  font-weight: 1000;
  font-size: 20px;
  margin: 0 0 10px 0;
  color: #111;
}

.adria-text{
  font-size: 13.5px;
  line-height: 1.7;
  color: #2a2a2a;
}

/* Rendszerelemek panel (fent) */
.adria-specs{
  background: #111;
  border-radius: 18px;
  padding: 18px 18px;
  box-shadow: 0 18px 45px rgba(0,0,0,0.18);
  border: 1px solid rgba(255,255,255,0.08);
}

.adria-specs-title{
  color: #fff;
  font-weight: 950;
  font-size: 16px;
  margin: 0 0 14px 0;
  position: relative;
  padding-left: 14px;
}

.adria-specs-title::before{
  content:"";
  position:absolute;
  left:0;
  top:3px;
  width:4px;
  height:16px;
  background:#ff8a00;
  border-radius:2px;
}

.adria-spec-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.adria-spec-item{
  background: rgba(255,255,255,0.06);
  border-radius: 14px;
  padding: 12px 12px;
  border: 1px solid rgba(255,255,255,0.06);
}

.adria-spec-name{
  font-weight: 850;
  font-size: 13px;
  color:#ffffff;
  margin-bottom: 4px;
}

.adria-spec-val{
  font-weight: 900;
  font-size: 13px;
  color:#ff8a00;
}

@media (max-width: 768px){
  .adria-spec-grid{ grid-template-columns: 1fr; }
}


/* =========================================
   ALSÓ BLOKK – NARANCSOS DECISION-BOX (TÖBB KÁRTYA)
   ========================================= */

.decision-stack{
  display: grid;
  gap: 16px;
  margin: 18px 0;
}

.decision-card{
  background: #fff7ef;
  border: 1px solid #ffd0aa;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(255, 132, 0, 0.14);
}

.decision-title{
  background: linear-gradient(90deg, #ff7a00, #ff9a3d);
  color: #111;
  font-weight: 950;
  font-size: 15px;
  padding: 12px 14px;
}

.decision-body{
  padding: 0;
  background: #fff;
}

.decision-row{
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 12px;
  padding: 12px 14px;
  border-top: 1px solid #f0f0f0;
  align-items: center;
}

.decision-row:first-child{ border-top: 0; }

.decision-label{
  font-weight: 800;
  font-size: 13px;
  color: #222;
}

.decision-value{
  font-weight: 900;
  font-size: 13px;
  color: #111;
  text-align: right;
  word-break: break-word;
}

@media (max-width: 640px){
  .decision-row{ grid-template-columns: 1fr; }
  .decision-value{ text-align: left; }
}/* ======================================================
   GRAFIT PANEL – FELÜLÍRÁS (ALSÓ RENDSZERELEMEK)
   ====================================================== */

.adria-topblock .adria-specs{
  background: linear-gradient(135deg, #2e2e2e 0%, #232323 100%) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  box-shadow: 0 20px 45px rgba(0,0,0,0.18) !important;
}

.adria-topblock .adria-spec-item{
  background: rgba(255,255,255,0.10) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
}

.adria-topblock .adria-spec-item:hover{
  background: rgba(255,255,255,0.16) !important;
}

.adria-topblock .adria-spec-name{
  color: #ffffff !important;
}

.adria-topblock .adria-spec-val{
  color: #ff8a00 !important;
}/* ======================================================
   ADRIA SPEC PANEL – MELEG HÁTTÉR + GRAFIT KÁRTYÁK
   ====================================================== */

.adria-topblock .adria-specs{
  background: linear-gradient(135deg, #fff3e7 0%, #ffe9d6 100%) !important;
  border: 2px solid rgba(255,138,0,0.25) !important;
  box-shadow: 0 18px 40px rgba(255,138,0,0.12) !important;
}

.adria-topblock .adria-specs-title{
  color: #222 !important;
}

.adria-topblock .adria-spec-item{
  background: linear-gradient(135deg, #2c2c2c 0%, #1f1f1f 100%) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.25);
}

.adria-topblock .adria-spec-item:hover{
  background: linear-gradient(135deg, #3a3a3a 0%, #262626 100%) !important;
}

.adria-topblock .adria-spec-name{
  color: #ffffff !important;
}

.adria-topblock .adria-spec-val{
  color: #ff8a00 !important;
}/* =========================
   VARIÁCIÓS SZÍNVÁLASZTÓ – “NÉZZ IDE” FINOM CTA
   (csak illeszd a CSS legaljára)
========================= */

/* A teljes variációs blokk legyen kicsit “kiemeltebb”, ha van benne szín */
.woocommerce div.product form.variations_form{
  position: relative;
}

/* Cím elé ikon + kicsit nagyobb hangsúly */
.woocommerce div.product form.variations_form .variations label{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.woocommerce div.product form.variations_form .variations label::before{
  content: "🎨";
  font-size: 16px;
  line-height: 1;
  transform: translateY(1px);
}

/* A dropdown kapjon “CTA” kinézetet (nem giccs, csak feltűnő) */
.woocommerce div.product form.variations_form select{
  background: linear-gradient(180deg, #ffffff 0%, #fff1e3 100%);
  border: 2px solid #ff8a00 !important;
  box-shadow: 0 10px 22px rgba(255,138,0,.16);
  font-weight: 800;
}

/* Placeholder (“Válassz egy lehetőséget”) legyen kifejezetten látható */
.woocommerce div.product form.variations_form select{
  color: #111; /* ha már választott, ez marad */
}

/* Trükk: amíg NINCS választás, a select kapjon “villogás nélküli” kiemelést */
.woocommerce div.product form.variations_form select:invalid{
  color: rgba(17,17,17,.78);
  border-color: #ff8a00 !important;
  box-shadow: 0 0 0 4px rgba(255,138,0,.18), 0 12px 26px rgba(0,0,0,.08);
}

/* A legtöbb Woo select-nél az üres opció value="" -> ezt tesszük “placeholder” stílusra */
.woocommerce div.product form.variations_form select option[value=""]{
  color: rgba(17,17,17,.62);
  font-weight: 700;
}

/* Jobb oldali kis nyíl (dropdown arrow) vizuális erősítése */
.woocommerce div.product form.variations_form select{
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 14px 14px;
  padding-right: 40px;
}

/* Finom “figyelem” szöveg a dropdown alá – csak ott jelenjen meg, ahol van variáció */
.woocommerce div.product form.variations_form .variations td{
  position: relative;
}

.woocommerce div.product form.variations_form .variations td::after{
  content: "Válassz színt a rendeléshez";
  display: inline-block;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 700;
  color: rgba(0,0,0,.60);
}

/* Ha kiválasztották a variációt (Woo ilyenkor beteszi a found_variation állapotot),
   akkor a kis szöveg halványodjon, hogy ne legyen zaj */
.woocommerce div.product form.variations_form.woocommerce-variation-found .variations td::after{
  opacity: .35;
}/* =========================
   SZÍNVÁLASZTÓ IKON NAGYOBB
   (csak illeszd a CSS legaljára)
========================= */
/* ===== SZÍNVÁLASZTÓ PULZÁLÁS ===== */

@keyframes selectPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255,138,0,0.45);
  }
  70% {
    box-shadow: 0 0 0 12px rgba(255,138,0,0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255,138,0,0);
  }
}

.woocommerce div.product form.variations_form .variations select{
  animation: selectPulse 2s infinite;
}

.woocommerce div.product form.variations_form .variations select:hover,
.woocommerce div.product form.variations_form .variations select:focus{
  animation: none;
}
.woocommerce div.product form.variations_form .variations label::before{
  content: "🎨";
  font-size: 24px;
  line-height: 1;
  margin-right: 8px;
  transform: translateY(2px);
}/* =========================
   SZÍNVÁLASZTÓ IKON CSERE
   (csak illeszd a CSS legaljára)
========================= */

.woocommerce div.product form.variations_form .variations label::before{
  content: "⬇";
  font-size: 22px;
  font-weight: 900;
  color: #ff8a00;
  margin-right: 8px;
  transform: translateY(-1px);
}/* ===== ERŐS JOBBRA NYÍL ===== */

.woocommerce div.product form.variations_form .variations label::before{
  content: "➡";
  font-size: 30px;
  font-weight: 900;
  color: #ff8a00;
  margin-right: 12px;
}/* ===== PULZÁLÁS KIKAPCS, HA RÁVISZED AZ EGERET ===== */

.woocommerce div.product form.variations_form .variations select:focus,
.woocommerce div.product form.variations_form .variations select:hover{
  animation: none;
}