/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* MENU */
.vk_header-menu .bricks-nav-menu {
    align-items: center;
}

/* WPML */
.wpml-ls-current-language {
	color: var(--Gray-900, #171717);
	font-family: Poppins;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 26px; /* 162.5% */
	letter-spacing: 1px;
	text-transform: uppercase;
	text-transform: uppercase;
	border-radius: 999px;
	border: 1px solid  #E1E1E1;
	padding: 6px 24px;
}
/* BUTTONS */
.vk_header-btn a {
	text-transform: uppercase;
	border-radius: 999px;
	border: 1px solid  #E1E1E1;
	padding: 6px 24px;
}

.bricks-background-primary:hover svg {
	filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(27deg) brightness(109%) contrast(101%);
}
.bricks-background-secondary:hover svg {
	filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(27deg) brightness(109%) contrast(101%);
}

/* SLIDER SECTION */

#scroll-slider .splide__track {
  overflow: hidden;
}
#scroll-slider .splide__list {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  will-change: transform;

  /* plynulý běh */
  animation: vkMarquee 25s linear infinite; /* pomalé: 35s, rychlejší: 25s, hodně rychlé: 15s, turbo: 10s */

  transition: none !important;
}
#scroll-slider .splide__slide {
  flex: 0 0 auto;
}
#scroll-slider .splide__arrows,
#scroll-slider .splide__pagination {
  display: none !important;
}
@keyframes vkMarquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  #scroll-slider .splide__list {
    animation: none !important;
    transform: translateX(0) !important;
  }
}


/* WP */
h2.wp-block-heading {
	margin-bottom: 32px;
}
h3.wp-block-heading {
	margin: 32px 0 24px;
}
figure.wp-block-image {
	margin: 32px 0;
}

/* FLUENT FORMS */
.ff-default .ff-el-form-control {
	color: #17080A;
	font-size: 16px;
	font-family: Poppins;
	font-weight: 400;
    border: none;
	border-radius: 20px !important;
    padding: 16px !important;
	line-height: 1.3;
}
.frm-fluent-form .choices__inner {
	border-radius: 20px !important;
}
.frm-fluent-form .choices[data-type*=select-multiple] .choices__input {
	color: #17080A;
	font-size: 14px !important;
	font-family: Poppins !important;
	font-weight: 400 !important;
    border: none !important;
	border-radius: 20px !important;
    padding: 16px 6px !important;
	line-height: 1.2;
}
.fluentform input::placeholder,
.fluentform textarea::placeholder {
  color: #17080A !important;
  opacity: 1 !important;
}
.fluentform input::-ms-input-placeholder,
.fluentform textarea::-ms-input-placeholder {
  color: #17080A !important;
}
/* Styly pro zadaný text v polích (input, select, textarea) */
.fluentform .ff-el-form-control {
    color: var(--Gray-800, #17080A) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 25px !important;
	opacity: 0.7 !important;
}

/* Styly pro zástupný text (placeholder) */
.fluentform .ff-el-form-control::placeholder {
    color: var(--Gray-800, #17080A) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 25px !important;
    opacity: 0.7; /* Doporučuji mírně průhledné, aby to uživatel odlišil od vyplněného textu */
}
/* Styly pro kontejner, vstupní pole a všechny možnosti uvnitř "Choices" (roletky) */
.fluentform .choices__inner,
.fluentform .choices__input,
.fluentform .choices__list--dropdown .choices__item,
.fluentform .choices__list--multiple .choices__item {
    color: var(--Gray-800, #17080A) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 25px !important;
}

/* Zástupný text uvnitř tohoto specifického selectu */
.fluentform .choices__input::placeholder {
    color: var(--Gray-800, #17080A) !important;
    opacity: 0.7 !important;
}

/* Definitivní přepsání placeholderu pro vícenásobný výběr (Choices.js) */
.fluentform .choices__inner .choices__input.choices__input--cloned::placeholder,
.fluentform .choices__inner .choices__input.choices__input--cloned::-webkit-input-placeholder,
.fluentform .choices__inner .choices__input.choices__input--cloned::-moz-placeholder,
.fluentform .choices__inner .choices__input.choices__input--cloned:-ms-input-placeholder {
    color: #17080A !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 25px !important;
    opacity: 0.7 !important;
}

/* Zajištění, že stejný styl bude i pro text, když do toho pole začne uživatel psát */
.fluentform .choices__inner .choices__input.choices__input--cloned {
    color: #17080A !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
}
/* Styly pro vybrané položky (štítky) v roletce */
.fluentform .choices__inner .choices__list--multiple .choices__item {
    color: var(--Gray-800, #17080A) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 25px !important;
    
    /* Světlé pozadí a rámeček, aby byl tmavý text čitelný */
    background-color: #F3F4F6 !important; 
    border: 1px solid #E5E7EB !important;
    border-radius: 30px !important; /* Zakulacení podle tvého screenu */
}

/* Úprava křížku pro odstranění položky */
.fluentform .choices__inner .choices__list--multiple .choices__item .choices__button {
    border-left: 1px solid rgba(23, 8, 10, 0.2) !important; /* Jemná čára oddělující křížek */
    color: var(--Gray-800, #17080A) !important;
    opacity: 0.7 !important;
}

/* Hover efekt na křížek */
.fluentform .choices__inner .choices__list--multiple .choices__item .choices__button:hover {
    opacity: 1 !important;
}

/* 1. Křížek (tlačítko zavřít) v přesné barvě #17080A */
.fluentform .choices__inner .choices__list--multiple .choices__item .choices__button {
    /* Přepsání výchozího obrázku vlastním SVG s barvou %2317080A (což je #17080A v URL formátu) */
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.5 2.5 L7.5 7.5 M7.5 2.5 L2.5 7.5' stroke='%2317080A' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    opacity: 1 !important; /* Zrušíme jakoukoliv průhlednost */
    border-left: 1px solid rgba(23, 8, 10, 0.2) !important; /* Necháme jemnou oddělovací čárku */
}

/* 2. Placeholder absolutně bez průhlednosti (opacity: 1) */
.fluentform .choices__inner .choices__input.choices__input--cloned::placeholder,
.fluentform .choices__inner .choices__input.choices__input--cloned::-webkit-input-placeholder,
.fluentform .choices__inner .choices__input.choices__input--cloned::-moz-placeholder,
.fluentform .choices__inner .choices__input.choices__input--cloned:-ms-input-placeholder {
    color: var(--Gray-800, #17080A) !important;
    opacity: 0.7 !important; /* Tímto přepíšeme výchozí prohlížečovou průhlednost placeholderů */
}

/* RESPONSIVE */
@media screen and (max-width: 1200px) {
	.vk_header-btn a {
		border-radius: 0;
		border: 1px solid #ffffff;
		padding: 0px 30px;
		background: #fff;
		color: #000;
	}
	.wpml-ls-current-language {
		color: #fff;
		border-radius: 0;
		border: none;
		line-height: 60px;
		background-color: #000;
		padding: 0;
	}
}

@media (max-width: 767px) {
  
  #scroll-slider .splide__list {
    display: flex !important;
    flex-wrap: nowrap !important;
    animation: vkMarquee 45s linear infinite !important; /* Rychlost na mobilu */
    width: max-content; 
  }

  #scroll-slider .splide__slide {
    flex: 0 0 auto !important; 
    width: auto !important;
    padding: 0;
  }

  #scroll-slider .vk_carousel--item-text,
  #scroll-slider .splide__slide h3 {
    white-space: nowrap !important; 
    font-size: 1.2rem;
    overflow: visible !important;
  }
}