/*
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

.facet-wrap .facetwp-type-fselect {
  margin-bottom: 0;
}
.facet-wrap .facetwp-type-fselect .fs-wrap {
  width: 100%;
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-label-wrap {
  border: 0;
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-label-wrap .fs-label {
  padding: 16px;
  background-color: #F0EFEA;
  color: #2A251E;
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-label-wrap .fs-label:before {
  font-family: 'seducoicons' !important;
  margin-right: 8px;
  color: #2A251E;
  font-size: 1.25rem;
}
.facet-wrap .facetwp-type-fselect.facetwp-facet-haustyp .fs-wrap .fs-label-wrap .fs-label:before {
  content: '\e813';
}
.facet-wrap .facetwp-type-fselect.facetwp-facet-grobe .fs-wrap .fs-label-wrap .fs-label:before {
  content: '\e81d';
}
.facet-wrap .facetwp-type-fselect.facetwp-facet-zimmeranzahl .fs-wrap .fs-label-wrap .fs-label:before {
  content: '\e81f';
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-label-wrap .fs-arrow {
	display: none;
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-label-wrap .fs-label::after {
	content: '\e800';
	font-family: 'seducoicons' !important;
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	color: #2A251E;
	font-size: 1.25rem;
	transition: all 0.3s ease;
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-dropdown .fs-search {
  display: none;
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-dropdown .fs-options {
  padding: 4px 0;
  background-color: #F0EFEA;
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-dropdown .fs-options .fs-option {
  color: #2A251E;
  background-color: #F0EFEA;
  padding: 12px 8px 12px 50px;
}
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-dropdown .fs-options .fs-option .fs-checkbox {
  width: 24px;
  left: 20px;
}
/* Základný štýl kontajnera ikony - odstránenie rámčeka */
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-dropdown .fs-options .fs-option .fs-checkbox i {
    border-radius: 0;
    background-color: transparent;
    width: auto;
    height: auto;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
    border: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
}
/* Normálny stav (nevybraté) - prázdna ikona */
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-dropdown .fs-options .fs-option .fs-checkbox i::before {
    content: '\e815';
    font-family: 'seducoicons' !important;
    color: #2A251E;
    font-size: 1.25rem;
    line-height: 1;
}
/* Selected stav - odstránenie pozadia */
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-dropdown .fs-options .fs-option.selected .fs-checkbox i {
    background-color: transparent;
}

/* Selected stav - vyplnená ikona */
.facet-wrap .facetwp-type-fselect .fs-wrap .fs-dropdown .fs-options .fs-option.selected .fs-checkbox i::before {
    content: '\e817';
    color: #2A251E;
}
.facet-wrap .facetwp-type-fselect .fs-wrap:focus .fs-label-wrap .fs-label,
.facet-wrap .facetwp-type-fselect .fs-wrap.fs-open .fs-label-wrap .fs-label,
.facet-wrap .facetwp-type-fselect .fs-wrap:hover .fs-label-wrap .fs-label {
  background-color: #2A251E;
  color: white;
}
.facet-wrap .facetwp-type-fselect .fs-wrap:focus .fs-label-wrap .fs-label::after,
.facet-wrap .facetwp-type-fselect .fs-wrap.fs-open .fs-label-wrap .fs-label::after {
	transform: translateY(-50%) rotateX(180deg);
  color: #fff;
}
.facet-wrap .facetwp-type-fselect .fs-wrap:hover .fs-label-wrap .fs-label::after {
  color: #fff;
}
.facet-wrap .facetwp-type-fselect .fs-wrap:focus .fs-label-wrap .fs-label:before,
.facet-wrap .facetwp-type-fselect .fs-wrap.fs-open .fs-label-wrap .fs-label:before,
.facet-wrap .facetwp-type-fselect .fs-wrap:hover .fs-label-wrap .fs-label:before {
  color: white;
}
/* FacetWP Sort - základný štýl */
.facet-wrap .facetwp-type-sort {
    margin-bottom: 0;
    position: relative;
}

.facet-wrap .facetwp-type-sort select {
    width: 100%;
    padding: 14px;
    padding-left: 44px; /* priestor pre ikonu */
    padding-right: 40px; /* priestor pre šípku */
    background-color: #F0EFEA;
    border: 0;
    color: #2A251E;
    font-size: inherit;
    font-family: inherit;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    transition: all 0.3s ease;
    border-radius: 0;
}

/* Ikona pred textom - seducoicons */
.facet-wrap .facetwp-type-sort.facetwp-facet-sortierung::before {
    content: '\e812';
    font-family: 'seducoicons' !important;
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: #2A251E;
    font-size: 1.25rem;
    pointer-events: none;
    z-index: 1;
    transition: all 0.3s ease;
}

/* Vlastná šípka dropdown */
.facet-wrap .facetwp-type-sort::after {
	content: '\e800';
	font-family: 'seducoicons' !important;
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	color: #2A251E;
	font-size: 1.5rem;
	pointer-events: none;
	transition: all 0.3s ease;
}

/* Hover a focus stavy */
.facet-wrap .facetwp-type-sort select:hover,
.facet-wrap .facetwp-type-sort select:focus {
    background-color: #2A251E;
    color: white;
    outline: none;
    border-radius: 0;
}

/* Hover ikona - zmena na bielu */
.facet-wrap .facetwp-type-sort:has(select:hover)::before,
.facet-wrap .facetwp-type-sort:has(select:focus)::before {
    color: white;
}

/* Hover šípka - zmena na bielu */
.facet-wrap .facetwp-type-sort:has(select:focus)::after {
	color: #fff;
  transform: translateY(-50%) rotateX(180deg);
}
.facet-wrap .facetwp-type-sort:has(select:hover)::after {
  color: #fff;
}

/* Dropdown options styling */
.facet-wrap .facetwp-type-sort select option {
    color: #2A251E;
    background-color: #F0EFEA;
    padding: 12px 12px 12px 0;
}
/* FacetWP pagination - centrovanie */
.facetwp-pager {
    display: flex;
    justify-content: center;
    gap: 8px; /* medzera medzi tlačidlami */
}

/* FacetWP pagination - štýl tlačidiel */
.facetwp-pager .facetwp-page {
    width: 56px;
    height: 56px;
    border-radius: 100px;
    border: 1px solid rgba(42, 37, 30, 0.30);
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: #2A251E !important;
    transition: all 0.3s ease;
    cursor: pointer;
    font-weight: 600;
    padding: 0;
    margin: 0;
}

/* FacetWP pagination - aktívna stránka a hover */
.facetwp-pager .facetwp-page.active,
.facetwp-pager .facetwp-page:hover {
    border-color: #2A251E;
    background: #2A251E;
    color: #fff !important;
}

.elementor-field-type-radio {
  margin-top: 16px;
}
/* Skryť pôvodné radio buttony */
.elementor-field-type-radio .elementor-field-option input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/* Štýl pre labely ako tlačidlá */
.elementor-field-type-radio .elementor-field-option label {
    display: block !important;
    align-items: center;
    padding: 12px 24px;
    background-color: #F0EFEA;
    color: #2A251E !important;
    border: 1px solid #F0EFEA;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600 !important;
    margin: 8px 0;
}

/* Pridať checkmark ikonu pred text */
.elementor-field-type-radio .elementor-field-option label:before {
    font-family: 'seducoicons' !important;
    content: '\e814'; /* Checkbox Blank-circle-line - zmeň tento kód podľa tvojho icon fontu */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    border-radius: 50%;
    background-color: transparent;
    color: #2A251E;
    font-size: 14px;
    transition: all 0.3s ease;
    font-size: 1.25rem;
}

/* Štýl pre vybraté tlačidlo */
.elementor-field-type-radio .elementor-field-option input[type="radio"]:checked + label {
    background-color: #2A251E;
    color: #ffffff !important;
    border-color: #2A251E;
}

/* Checkmark pri vybranom tlačidle */
.elementor-field-type-radio .elementor-field-option input[type="radio"]:checked + label:before {
    content: '\e816'; /* Checkbox Circle-fill - zmeň tento kód podľa tvojho icon fontu */
    color: #fff;
}

/* Hover efekt */
.elementor-field-type-radio .elementor-field-option label:hover {
    border-color: #ccc;
}

/* FacetWP Reset - Zrušiť všetky filtre */
.facetwp-type-reset {
	margin-bottom: 0 !important;
}

.facetwp-type-reset button {
	background-color: transparent;
	color: #2A251E;
	border-radius: 0;
	cursor: pointer;
	transition: all 0.3s ease;
	display: inline-flex;
	align-items: center;
	gap: 4px;
  border: 1px solid #DDD;
  padding: 0 12px 0 16px;
  height: 40px;
}

/* Ikona X pred textom */
.facetwp-type-reset button:after {
	content: '\e810'; /* X ikona - zmeň podľa tvojho seducoicons kódu */
	font-family: 'seducoicons' !important;
	font-size: 1.25rem;
	color: #2A251E;
	transition: all 0.3s ease;
}

/* Hover efekt */
.facetwp-type-reset button:hover {
	background-color: #2A251E;
	color: #ffffff;
	border-color: #2A251E;
}

.facetwp-type-reset button:hover:after {
	color: #fff;
}

/* FacetWP User Selections - aktívne filtre */
.facetwp-selections {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
  margin-bottom: -10px;
}
.facetwp-selections ul {
  padding: 0;
}
.facetwp-selection-label {
  display: none;
}

.facetwp-selection-value {
  background-image: none !important;
  background-color: transparent;
	color: #2A251E;
	border-radius: 0;
	cursor: pointer;
	transition: all 0.3s ease;
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px;
  border: 1px solid #DDD;
  padding: 0 12px 0 16px !important;
  height: 40px;
  margin: 0 10px 10px 0;
}

/* X ikona na odstránenie */
.facetwp-selection-value:after {
	content: '\e810'; /* X ikona - zmeň podľa tvojho seducoicons kódu */
	font-family: 'seducoicons' !important;
	font-size: 1.25rem;
	color: #2A251E;
	cursor: pointer;
	transition: all 0.3s ease;
}

/* Hover efekt */
.facetwp-selection-value:hover {
	background-color: #2A251E;
	color: #fff;
}

.facetwp-selection-value:hover:after {
	color: #fff;
}
