/*
 * ACJC - zakladni styly tematu.
 *
 * Mrizka i nazvy trid odpovidaji puvodnimu builderu, aby platily stavajici
 * upravy webu (/static/smtx.css) a stranky vypadaly stejne jako predtim.
 */

:root {
	--acjc-accent: #fe7912;
	/*
	 * Barva textu a odkazu - drzi se loga, at je web barevne jednotny.
	 * Odstin je stejny jako v logotypu. Proti bile ma ale kontrast jen
	 * 2,65:1 - min, nez zada WCAG AA. Vedomy ustupek firemni barve.
	 */
	--acjc-accent-ink: #fe7912;
	--acjc-accent-dark: #c85a00;
	--acjc-dark: #161922;
	--acjc-text: #626262;
	--acjc-muted: #888888;
	--acjc-border: #e2e2e2;
	--acjc-soft: #f8f8f8;
	--acjc-container: 1280px;
	--acjc-gutter: 12px;

	/*
	 * Mezery mezi sloupci. Stejny zapis i hodnoty jako v puvodni mrizce,
	 * aby se daly prepsat pro jednotlive oblasti (napr. hlavicku).
	 */
	--mfn-column-gap-top: 0;
	--mfn-column-gap-bottom: 40px;
	--mfn-column-gap-left: 12px;
	--mfn-column-gap-right: 12px;
	--acjc-font: "Titillium Web", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;

	/* Tlacitka - stejne nazvy i hodnoty jako v puvodni sablone. */
	--mfn-button-bg: #f7f7f7;
	--mfn-button-color: #747474;
	--mfn-button-bg-hover: #eaeaea;
	--mfn-button-color-hover: #747474;
	--mfn-button-padding: 16px 20px;
	--mfn-button-gap: 10px;
	--mfn-button-font-size: 18px;
	--mfn-button-font-weight: 400;
	--mfn-button-letter-spacing: 0px;
}

/* --- Zaklad --------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--acjc-font);
	font-size: 18px;
	line-height: 25px;
	font-weight: 400;
	color: var(--acjc-text);
	background: #fff;
	-webkit-font-smoothing: antialiased;
}

/*
 * Obrazky zustavaji radkove, jako v puvodni sablone. Mezeru pod nimi
 * (misto pro dolni dotahy pisma) rusi az obaly, ktere maji line-height: 0.
 */
img,
svg,
video {
	max-width: 100%;
	height: auto;
}

a {
	color: var(--acjc-accent-ink);
	text-decoration: none;
}

a:hover,
a:focus-visible {
	text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 15px;
	color: var(--acjc-dark);
	font-weight: 400;
	line-height: 1.15;
}

h1 { font-size: 48px; line-height: 50px; }
h2 { font-size: 36px; line-height: 40px; }
h3 { font-size: 30px; line-height: 34px; }
h4 { font-size: 21px; line-height: 25px; font-weight: 500; }
h5 { font-size: 15px; line-height: 25px; font-weight: 700; }
h6 { font-size: 14px; line-height: 25px; }

/* Na uzkych obrazovkach se nadpisy zmensi - hranice 769 px je z puvodniho webu. */
@media only screen and (max-width: 769px) {
	h1 { font-size: 30px; line-height: 40px; }
	h2 { font-size: 23px; line-height: 30px; }
	h3 { font-size: 20px; line-height: 26px; }
}

p {
	margin: 0 0 15px;
}

/*
 * Seznam sam o sobe odrazky nema. Vypis parametru vozu, polozky menu nebo
 * zaskrtavaci pole ve formulari jsou take seznamy a odrazky by tam
 * prekazely - puvodni sablona to resi stejne.
 */
ul, ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Odrazky patri jen do textu stranky. Odsazuje je vnejsi mezera. */
.column_column ul,
.column_post_content ul:not(.mfn-list),
.column_helper ul,
.column_visual ul,
.icon_box ul,
.the_content_wrapper ul,
.acjc-post__content ul {
	margin: 0 0 15px 30px;
	list-style: outside disc;
}

.column_column ol,
.column_post_content ol,
.column_helper ol,
.column_visual ol,
.icon_box ol,
.the_content_wrapper ol,
.acjc-post__content ol {
	margin: 0 0 15px 30px;
	list-style: outside decimal;
}

/*
 * Ve vnorenych seznamech nechavame stejnou odrazku jako v prvni urovni -
 * prohlizec by jinak stridal kolecko, krouzek a ctverecek.
 */
ul ul,
ul ol,
ol ul,
ol ol {
	list-style-type: inherit;
}

li {
	margin: 0;
}

/* V textu clanku maji polozky seznamu mezeru pod sebou. */
.column_column ul li,
.column_post_content ul li,
.the_content_wrapper ul li,
.column_column ol li,
.the_content_wrapper ol li {
	margin-bottom: 10px;
}

small {
	font-size: 15px;
}

table {
	width: 100%;
	margin: 0 0 15px;
	border-collapse: collapse;
	border-spacing: 0;
	border-radius: 5px;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.acjc-skip-link:focus {
	position: fixed;
	top: 8px;
	left: 8px;
	z-index: 9999;
	width: auto;
	height: auto;
	clip: auto;
	clip-path: none;
	padding: 10px 16px;
	background: #fff;
	color: var(--acjc-dark);
	box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
}

.clearfix::after {
	content: "";
	display: table;
	clear: both;
}

/* --- Mrizka builderu ------------------------------------------------ */

/*
 * flow-root udrzi horni mezeru prvni sekce uvnitr obsahu - jinak by
 * "prosakla" ven a posunula celou stranku.
 */
#Content,
.content_wrapper,
.sections_group {
	display: flow-root;
}

.section {
	position: relative;
	width: 100%;
}

/*
 * height:100% dovoli, aby se obsah svisle vystredil v sekci, ktera ma
 * zadanou vysku - stejne jako v puvodni mrizce.
 */
.section_wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	max-width: var(--acjc-container);
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	/*
	 * Radky se ve vychozim stavu neroztahuji na vysku nejvyssiho souseda.
	 * Sekce, ktera to potrebuje, si stretch zapina ve svem vlastnim stylu.
	 */
	align-items: flex-start;
}

/* Radek i sloupec jsou vztazny bod pro prvky vyjmute z toku. */
.wrap {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: flex-start;
	min-width: 0;
}

/*
 * align-self: stretch dovoli, aby se vnitrek radku protahl na vysku
 * nejvyssiho sousedniho radku - stejne jako v puvodni mrizce.
 */
.mcb-wrap-inner {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	align-items: flex-start;
	align-self: stretch;
	width: 100%;
}

/*
 * Sloupec si nese jen zakladni vlastnosti. Odsazeni zamerne nenastavujeme -
 * stavajici upravy webu si ho na nekterych sloupcich pridavaji.
 */
.column {
	position: relative;
	min-width: 0;
	margin: 0;
}

/* Textovy sloupec je flexbox - stejne jako v puvodni mrizce. */
.column_column {
	display: flex;
}

.mcb-item-column-inner {
	width: 100%;
	word-break: break-word;
}

.mfn-header-tmpl .column_column {
	flex-shrink: 1 !important;
}

/* Mezery mezi sloupci nese az vnitrni obal - stejne jako v puvodni mrizce. */
.mcb-column-inner {
	min-width: 0;
	margin: var(--mfn-column-gap-top) var(--mfn-column-gap-right) var(--mfn-column-gap-bottom) var(--mfn-column-gap-left);
}

/* Obrazek nesmi pod sebou nechavat mezeru po radku textu. */
.column_image {
	line-height: 0;
}

/* Prvek vyjmuty z toku stranky nema mezery sloupce. */
.mcb-column-absolute > .mcb-column-inner {
	width: 100%;
	margin: 0;
	z-index: 1;
}

@media only screen and (max-width: 1360px) {
	.section_wrapper {
		max-width: calc(100% - 2 * var(--acjc-gutter));
	}
}

/* Sirky sloupcu - stejne hodnoty jako puvodni mrizka. */
.wrap.one,            .column.one            { width: 100%; }
.wrap.five-sixth,     .column.five-sixth     { width: 83.333%; }
.wrap.four-fifth,     .column.four-fifth     { width: 80%; }
.wrap.three-fourth,   .column.three-fourth   { width: 75%; }
.wrap.two-third,      .column.two-third      { width: 66.666%; }
.wrap.three-fifth,    .column.three-fifth    { width: 60%; }
.wrap.one-second,     .column.one-second     { width: 50%; }
.wrap.two-fifth,      .column.two-fifth      { width: 40%; }
.wrap.one-third,      .column.one-third      { width: 33.333%; }
.wrap.one-fourth,     .column.one-fourth     { width: 25%; }
.wrap.one-fifth,      .column.one-fifth      { width: 20%; }
.wrap.one-sixth,      .column.one-sixth      { width: 16.666%; }

/* Sirky obrazovek presne podle puvodni sablony: 1440 / 959 / 767 px. */
@media only screen and (max-width: 1440px) {
	.wrap.laptop-one,            .column.laptop-one            { width: 100%; }
	.wrap.laptop-five-sixth,     .column.laptop-five-sixth     { width: 83.333%; }
	.wrap.laptop-four-fifth,     .column.laptop-four-fifth     { width: 80%; }
	.wrap.laptop-three-fourth,   .column.laptop-three-fourth   { width: 75%; }
	.wrap.laptop-two-third,      .column.laptop-two-third      { width: 66.666%; }
	.wrap.laptop-three-fifth,    .column.laptop-three-fifth    { width: 60%; }
	.wrap.laptop-one-second,     .column.laptop-one-second     { width: 50%; }
	.wrap.laptop-two-fifth,      .column.laptop-two-fifth      { width: 40%; }
	.wrap.laptop-one-third,      .column.laptop-one-third      { width: 33.333%; }
	.wrap.laptop-one-fourth,     .column.laptop-one-fourth     { width: 25%; }
	.wrap.laptop-one-fifth,      .column.laptop-one-fifth      { width: 20%; }
	.wrap.laptop-one-sixth,      .column.laptop-one-sixth      { width: 16.666%; }
	.hide-laptop                                               { display: none !important; }
}

@media only screen and (max-width: 959px) {
	.wrap.tablet-one,            .column.tablet-one            { width: 100%; }
	.wrap.tablet-five-sixth,     .column.tablet-five-sixth     { width: 83.333%; }
	.wrap.tablet-four-fifth,     .column.tablet-four-fifth     { width: 80%; }
	.wrap.tablet-three-fourth,   .column.tablet-three-fourth   { width: 75%; }
	.wrap.tablet-two-third,      .column.tablet-two-third      { width: 66.666%; }
	.wrap.tablet-three-fifth,    .column.tablet-three-fifth    { width: 60%; }
	.wrap.tablet-one-second,     .column.tablet-one-second     { width: 50%; }
	.wrap.tablet-two-fifth,      .column.tablet-two-fifth      { width: 40%; }
	.wrap.tablet-one-third,      .column.tablet-one-third      { width: 33.333%; }
	.wrap.tablet-one-fourth,     .column.tablet-one-fourth     { width: 25%; }
	.wrap.tablet-one-fifth,      .column.tablet-one-fifth      { width: 20%; }
	.wrap.tablet-one-sixth,      .column.tablet-one-sixth      { width: 16.666%; }
	.hide-tablet                                               { display: none !important; }
}

@media only screen and (max-width: 767px) {
	.wrap.mobile-one,            .column.mobile-one            { width: 100%; }
	.wrap.mobile-five-sixth,     .column.mobile-five-sixth     { width: 83.333%; }
	.wrap.mobile-four-fifth,     .column.mobile-four-fifth     { width: 80%; }
	.wrap.mobile-three-fourth,   .column.mobile-three-fourth   { width: 75%; }
	.wrap.mobile-two-third,      .column.mobile-two-third      { width: 66.666%; }
	.wrap.mobile-three-fifth,    .column.mobile-three-fifth    { width: 60%; }
	.wrap.mobile-one-second,     .column.mobile-one-second     { width: 50%; }
	.wrap.mobile-two-fifth,      .column.mobile-two-fifth      { width: 40%; }
	.wrap.mobile-one-third,      .column.mobile-one-third      { width: 33.333%; }
	.wrap.mobile-one-fourth,     .column.mobile-one-fourth     { width: 25%; }
	.hide-mobile                                               { display: none !important; }
}

@media only screen and (min-width: 768px) {
	.hide-desktop { display: none !important; }
}

/*
 * Blok Novinky se vklada pod obsah na vsech strankach. Kde ho mit nechceme
 * (titulni strana a vypis novinek) ho skryva site CSS podle cisla stranky,
 * jinde si o svem obsahu rozhoduje zkratka sama - stejne jako v originalu.
 */

/*
 * Obal .container pouzivaji vlastni vsuvky webu (napr. blok Novinky pod
 * clankem). Sirka je stejna jako u mrizky builderu.
 */
.container {
	position: relative;
	width: 100%;
	max-width: var(--acjc-container);
	margin: 0 auto;
}

@media only screen and (max-width: 1360px) {
	.container {
		max-width: calc(100% - 2 * var(--acjc-gutter));
	}
}

/*
 * Pruh s nazvem stranky nad obsahem. Vysku i odsazeni ma stejne jako driv:
 * 110 px celkem, nadpis 30/35 a pod nim drobeckova navigace.
 */
#Subheader {
	background: #fff;
}

/* Spodni mezeru pruhu uz dodava vlastni styl webu. */
#Subheader .container {
	padding: 30px 0 0;
}

#Subheader .column.one {
	width: 100%;
}

/*
 * Web dava nadpisum vlastni horni mezeru, tady ji nechceme. Barvu drzi
 * puvodni sablona pravidlem vazanym na tridu tela stranky; tu nemame,
 * proto barvu zapisujeme primo.
 */
#Subheader .title {
	margin: 0 !important;
	color: var(--acjc-accent-ink);
	text-align: left;
	font-size: 30px;
	line-height: 35px;
	letter-spacing: 1px;
}

/* Detail vozu nema v zahlavi nadpis, takze ani horni mezeru pro nej. */
.single-product #Subheader .container {
	padding: 0;
}

#Subheader .breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 10px;
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
	font-size: 18px;
	line-height: 25px;
}

#Subheader .breadcrumbs li {
	margin: 0;
}

#Subheader .breadcrumbs a {
	color: inherit;
}

#Subheader .breadcrumbs a:hover {
	color: var(--acjc-accent-ink);
}

#Subheader .mfn-breadcrumbs-separator {
	opacity: .4;
}

/*
 * Oddelovac je v puvodni sablone znak z ikonoveho pisma. Cele pismo kvuli
 * jedine sipce nevozime, kreslime ji obrazkem obarvenym podle textu.
 */
#Subheader .mfn-breadcrumbs-separator i {
	display: inline-block;
	width: 18px;
	height: 18px;
	vertical-align: -3px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3l5 5-5 5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px 10px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3l5 5-5 5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px 10px no-repeat;
}

/* Obsah stranky z editoru vyplnuje celou sirku mrizky. */
.the_content_wrapper {
	width: 100%;
	margin-bottom: 15px;
}

.acjc-spacer {
	height: 40px;
}

/* --- Hlavicka ------------------------------------------------------- */

.acjc-header .section_wrapper {
	align-items: center;
	flex-wrap: nowrap;
}

/*
 * V hlavicce nemaji radky pevnou sirku - rozdeli se podle obsahu a podle
 * flex-grow, ktere si k nim ulozil builder. Diky tomu zabere menu tolik
 * mista, kolik potrebuje, a lupa u nej jen svuj ctverecek.
 */
.acjc-header .wrap {
	width: auto;
	min-width: 0;
}

/*
 * Hlavicka ma tri podoby: bezne radky, radek pro mobil a radek, ktery se
 * pripne k hornimu okraji po odrolovani. Vzdy je videt prave jedna sada.
 */
.acjc-header .mfn-header-mobile-section {
	display: none;
}

.acjc-header .mfn-header-sticky-section {
	display: none;
}

/*
 * Hlavicka ma vlastni, uzsi mezery mezi prvky. Zaroven stoji nad obsahem
 * stranky, aby se rozbalene menu nekrylo se sekcemi pod nim.
 */
.acjc-header,
.mfn-header-tmpl {
	position: relative;
	z-index: 3;
	width: 100%;
}

.acjc-header {
	--mfn-column-gap-left: 5px;
	--mfn-column-gap-right: 5px;
	--mfn-column-gap-bottom: 0;
}

@media only screen and (max-width: 767px) {
	.acjc-header .mfn-default-section,
	.acjc-header .mfn-header-sticky-section {
		display: none;
	}

	.acjc-header .mfn-header-mobile-section {
		display: block;
	}
}

/* Po odrolovani se hlavicka zmensi na jediny pripnuty radek. */
@media only screen and (min-width: 768px) {
	body.acjc-scrolled .acjc-header {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 300;
		box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
	}

	body.acjc-scrolled .acjc-header .mfn-default-section {
		display: none;
	}

	body.acjc-scrolled .acjc-header .mfn-header-sticky-section {
		display: block;
	}
}

/*
 * Logo se vykresli ve sve vlastni velikosti. Odkaz je flexbox, jinak by se
 * v sloupci se sirkou "podle obsahu" obrazek smrsknul na nulu.
 */
.acjc-logo {
	display: flex;
	align-items: center;
}

/*
 * Logo je SVG s pouhym pomerem stran, zadnou vlastni velikost nema.
 * Puvodni sablona mu dava celou sirku sloupce a vysku dopocita z pomeru
 * stran - bez toho by prohlizec zvolil svych 300 px a logo by bylo mensi.
 */
.acjc-logo img {
	flex: none;
	width: 100%;
	height: auto;
	max-width: 100%;
	max-height: none;
}

/* V hlavicce nema posledni odstavec spodni mezeru. */
.mfn-header-tmpl .column_column .column_attr > *:last-child {
	margin-bottom: 0;
}

/* Prosté menu v hlavicce - rozmery jsou stejne jako v puvodni sablone. */
.acjc-nav__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}

.acjc-nav__list a {
	display: flex;
	align-items: center;
	padding: 8px 20px;
	color: var(--acjc-dark);
	font-size: 18px;
	line-height: 19.8px;
	font-weight: 500;
}

/*
 * Polozka s podmenu ma za nazvem sipku dolu. Puvodni sablona ji bere
 * z ikonoveho pisma; to s sebou nevozime, kreslime ji obrazkem.
 */
.acjc-nav__list .mfn-menu-subicon {
	display: block;
	flex: none;
	width: 13px;
	height: 22px;
	margin-left: 10px;
}

.acjc-nav__list .mfn-menu-subicon i {
	display: block;
	width: 13px;
	height: 22px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px 11px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px 11px no-repeat;
}

/* V podmenu uz sipka neni. */
.acjc-nav__list ul .mfn-menu-subicon {
	display: none;
}

.acjc-nav__list a:hover {
	color: var(--acjc-accent-ink);
	text-decoration: none;
}

/* Podmenu ceka schovane a vyjede az po najeti na polozku. */
.acjc-nav__list li {
	position: relative;
	margin: 0;
}

.acjc-nav__list ul {
	position: absolute;
	left: 0;
	top: 100%;
	z-index: 5;
	display: none;
	min-width: 220px;
	margin: 0;
	padding: 6px 0;
	list-style: none;
	background: #fff;
	box-shadow: 0 6px 24px rgba(0, 0, 0, .12);
}

.acjc-nav__list li:hover > ul,
.acjc-nav__list li:focus-within > ul {
	display: block;
}

.acjc-nav__list ul a {
	padding: 6px 16px;
	white-space: nowrap;
}

/*
 * Vyhledavani v hlavicce. Videt je jen oranzove tlacitko s lupou; formular
 * se otevre uprostred obrazovky. Rozmery i barvy jsou z puvodni sablony.
 */
.column_header_icon .mfn-icon-box {
	display: flex;
	align-items: center;
	color: inherit;
}

.column_header_icon .icon-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 80px;
	height: 70px;
	position: relative;
	background: var(--acjc-accent);
}

.column_header_icon .icon-wrapper svg {
	display: block;
	width: 29px;
	height: 29px;
}

.column_header_icon svg .path {
	fill: none;
	stroke: #000;
	stroke-miterlimit: 10;
	stroke-width: 1.5px;
}

/* Vyhledavaci vrstva. Otevre ji odkaz na kotvu, takze funguje i bez skriptu. */
.mfn-header-tmpl .column_header_icon .search_wrapper {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: none;
	z-index: 205;
	width: 600px;
	max-width: 80%;
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 10px 46px 0 rgba(1, 7, 39, .1);
}

.mfn-header-tmpl .column_header_icon .search_wrapper:target,
.mfn-header-tmpl .column_header_icon .search_wrapper.is-open {
	display: block;
}

.mfn-header-tmpl .column_header_icon .search_wrapper .form-searchform {
	position: relative;
}

.mfn-header-tmpl .column_header_icon .search_wrapper .icon_search {
	position: absolute;
	left: 25px;
	top: 50%;
	transform: translateY(-50%);
	line-height: 0;
}

.mfn-header-tmpl .column_header_icon .search_wrapper input[type="text"] {
	width: 100%;
	margin: 0;
	padding: 22px 30px 22px 60px;
	border: 0;
	background: none;
	box-shadow: none;
	font: inherit;
	font-size: 15px;
	color: var(--acjc-text);
}

.mfn-header-tmpl .column_header_icon .search_wrapper .display-none {
	display: none;
}

.mfn-header-tmpl .column_header_icon .search_wrapper .mfn-close-icon {
	position: absolute;
	right: 18px;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	color: var(--acjc-muted);
	cursor: pointer;
}

/* --- Prvky builderu ------------------------------------------------- */

/* Ramecek obrazku nesmi pod obrazkem nechat mezeru po radku textu. */
.image_frame {
	display: block;
	position: relative;
	overflow: hidden;
	max-width: 100%;
	margin: 0;
	line-height: 0;
}

.image_frame a {
	display: block;
	-webkit-tap-highlight-color: transparent;
}

.image_frame .image_wrapper {
	position: relative;
}

/*
 * Prouzek s odkazy (lupa, odkaz) ceka schovany pod obrazkem a vyjede az
 * po najeti mysi - stejne jako v puvodni sablone.
 */
.image_frame .image_wrapper .mask {
	position: absolute;
	inset: 0;
	z-index: 3;
}

.image_frame .image_wrapper .image_links {
	display: flex;
	position: absolute;
	left: 0;
	bottom: -60px;
	width: 100%;
	height: 60px;
	z-index: 4;
	overflow: hidden;
	background: rgba(0, 0, 0, .55);
	transition: bottom .2s ease;
}

.image_frame:hover .image_wrapper .image_links,
.image_frame:focus-within .image_wrapper .image_links {
	bottom: 0;
}

.image_frame .image_wrapper .image_links a {
	display: flex;
	flex: 1 1 0;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 100%;
	height: 100%;
	color: #fff;
}

.image_frame .image_wrapper .image_links svg {
	width: 22px;
	height: 22px;
}

/* Obrazky se nezvetsuji nad svou velikost - logy znacek musi zustat male. */
.image_frame img,
img.scale-with-grid {
	max-width: 100%;
	height: auto;
}

/* Bannery a fotky vozu naopak vyplnuji sirku sloupce. */
.mfn-banner-box img,
.post-item .image_frame img,
.acjc-loop .image_frame img {
	width: 100%;
}

/*
 * Obrazek s pevnou vyskou. Vysku predepisuje styl stranky, tady jen
 * zaridime, aby se obrazek orizl a nezmenil pomer stran roztazenim.
 */
.image_frame.mfn-coverimg {
	display: inline-block;
	width: 100%;
}

.image_frame.mfn-coverimg .mfn-coverimg-wrapper {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.image_frame.mfn-coverimg .mfn-coverimg-wrapper img {
	flex-grow: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/*
 * Tlacitko. Hodnoty jsou stejne jako v puvodni sablone vcetne nazvu
 * promennych, takze stavajici upravy webu na ne dal plati.
 */
.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--mfn-button-gap);
	position: relative;
	padding: var(--mfn-button-padding);
	border: 0;
	border-radius: var(--mfn-button-radius, 0);
	background-color: var(--mfn-button-bg);
	color: var(--mfn-button-color);
	font-size: var(--mfn-button-font-size);
	font-weight: var(--mfn-button-font-weight);
	letter-spacing: var(--mfn-button-letter-spacing);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: background-color .15s ease, color .15s ease;
}

.button_label {
	display: block;
}

/*
 * Tlacitko v barve webu (trida button_theme puvodni sablony). Bez tohoto
 * pravidla melo sede pozadi a bily popisek - text byl neciteny.
 */
.button.button_theme,
a.button.button_theme {
	background-color: var(--acjc-accent);
	color: #fff;
}

.button.button_theme .button_label {
	color: #fff;
}

.button.button_theme:hover,
.button.button_theme:focus-visible {
	background-color: #e56a08;
	color: #fff;
}

.button.button_full_width {
	display: flex;
	width: 100%;
}

.button:hover,
.button:focus-visible {
	background-color: var(--mfn-button-bg-hover);
	color: var(--mfn-button-color-hover);
	text-decoration: none;
}

/* V prvku builderu nema tlacitko zadne vlastni odsazeni. */
.column_button .button {
	vertical-align: middle;
	margin: 0 !important;
}

/* Plne tlacitko pro hlavni akce. */
.button_full {
	background: var(--acjc-accent);
	color: #fff;
}

/* Prvek, ktery si bere jen tolik mista, kolik potrebuje. */
.acjc-item-inline {
	width: auto !important;
	flex: 0 0 auto;
}

/* Menu v hlavicce je vyjimka - roztahne se do zbyleho mista. */
.acjc-item-inline.column_header_menu,
.acjc-item-inline.column_header_promo_bar {
	flex: 1 1 0;
}

.button_full_width {
	display: block;
	width: 100%;
}

/* Banner s obrazkem a popiskem */
.mfn-banner-box {
	position: relative;
	display: block;
	overflow: hidden;
	color: #fff;
}

.mfn-banner-box .banner-image img {
	width: 100%;
	transition: transform .4s ease;
}

.mfn-banner-box:hover .banner-image img {
	transform: scale(1.04);
}

.mfn-banner-box .banner-desc {
	position: absolute;
	inset: auto 0 0 0;
	padding: 20px;
	background: linear-gradient(to top, rgba(0, 0, 0, .72), rgba(0, 0, 0, 0));
}

.mfn-banner-box .banner-desc .title,
.mfn-banner-box .banner-desc .subtitle {
	margin: 0;
	color: #fff;
}

.mfn-banner-box .banner-desc .subtitle {
	margin-top: 6px;
	font-size: 16px;
	line-height: 1.35;
}

/* Vypis clanku z builderu */
.posts_group {
	display: grid;
	gap: 0 30px;
}

.posts_group.col-2 { grid-template-columns: repeat(2, 1fr); }
.posts_group.col-3 { grid-template-columns: repeat(3, 1fr); }
.posts_group.col-4 { grid-template-columns: repeat(4, 1fr); }

@media only screen and (max-width: 959px) {
	.posts_group.col-3,
	.posts_group.col-4 { grid-template-columns: repeat(2, 1fr); }
}

@media only screen and (max-width: 767px) {
	.posts_group { grid-template-columns: 1fr !important; }
}

/* Odstupy ve vypisu clanku jsou prevzate 1:1 z puvodni sablony. */
.post-item {
	margin-bottom: 20px;
}

/*
 * Stitek s datem pres obrazek se nepouziva - datum je v hlavicce clanku.
 * Puvodni sablona ho take jen skryva, proto ho tu nechavame v HTML.
 */
.post-item .date_label {
	display: none;
}

.post-desc {
	display: grid;
	padding: 20px 0 0;
}

/* V mrizce ma text jeste odsazeni zprava, at se nedotyka dalsiho sloupce. */
.grid .post-desc {
	padding: 20px 20px 0 0;
}

.post-meta {
	margin-bottom: 8px;
	color: var(--acjc-muted);
}

.post-item .entry-title {
	margin-bottom: 15px;
}

.post-item .entry-title a {
	color: var(--acjc-dark);
}

.post-item .entry-title a:hover {
	color: var(--acjc-accent-ink);
	text-decoration: none;
}

.post-excerpt {
	margin-bottom: 15px;
}

.post-footer {
	padding: 7px 15px;
	overflow: hidden;
	line-height: 30px;
}

/*
 * V mrizce patka presahuje pres pravy odsazeny okraj az k hrane karty.
 * Vlevo odsazeni neni, takze zaporny okraj patri jen doprava - jinak by
 * karta prerostla sloupec a na mobilu roztahla celou stranku.
 */
.grid .post-footer {
	box-sizing: border-box;
	margin: 0 -20px 0 0;
}

/* Presah nesmi vylezt z karty ven, jinak roztahne celou stranku. */
.post-item {
	overflow-x: clip;
}

/* Tlacitko "Libi se vam?" web nepouziva. */
.button-love {
	display: none;
}

/*
 * "Cist dale" vypadalo jako obycejny sedy text - ted je to odkaz v barve
 * webu se sipkou a s dostatecne velkou plochou na dotyk.
 */
.post-item .post-more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 44px;
	color: var(--acjc-accent-ink);
	font-weight: 600;
	text-decoration: none;
}

.post-item .post-more::after {
	content: "";
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M8.6 18 7.2 16.6 11.8 12 7.2 7.4 8.6 6l6 6z'/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M8.6 18 7.2 16.6 11.8 12 7.2 7.4 8.6 6l6 6z'/%3E%3C/svg%3E") no-repeat center / contain;
	transition: transform .15s ease;
}

.post-item .post-more:hover,
.post-item .post-more:focus-visible {
	color: var(--acjc-accent-ink);
	text-decoration: underline;
}

.post-item .post-more:hover::after {
	transform: translateX(3px);
}

/* Datum s ikonou hodin drzi na jednom radku. */
.post-meta .date {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

/* Rozbalovaci sekce */
.acjc-accordion__item {
	border-bottom: 1px solid var(--acjc-border);
}

.acjc-accordion__title {
	padding: 14px 0;
	font-weight: 600;
	color: var(--acjc-dark);
	cursor: pointer;
	list-style: none;
}

.acjc-accordion__title::-webkit-details-marker {
	display: none;
}

.acjc-accordion__title::before {
	content: "+";
	display: inline-block;
	width: 1.2em;
	color: var(--acjc-accent-ink);
	font-weight: 700;
}

.acjc-accordion__item[open] .acjc-accordion__title::before {
	content: "\2013";
}

.acjc-accordion__body {
	padding: 0 0 14px 1.2em;
}

/* --- Sekce se smyckou pres prispevky (reference, doporucene) --------- */

.acjc-loop-section {
	--acjc-loop-cols: 3;
	--acjc-loop-cols-tablet: 2;
	--acjc-loop-cols-mobile: 1;
}

/*
 * Vodorovny pas s prichytavanim. Chova se jako posuvnik, ale nepotrebuje
 * zadny skript - listovat jde tahem, kolem i klavesnici.
 */
.acjc-loop {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--acjc-loop-cols) - 1) * 24px) / var(--acjc-loop-cols));
	gap: 24px;
	width: 100%;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0 var(--acjc-gutter);
	overscroll-behavior-x: contain;
	/* Posuvnik neni videt, stejne jako u puvodniho posuvniku na skriptu. */
	scrollbar-width: none;
}

.acjc-loop::-webkit-scrollbar {
	display: none;
}

/* Sipky pasu - viditelne jen tam, kde se obsah nevejde. */
.acjc-loop-wrap {
	position: relative;
}

.acjc-loop__arrow {
	position: absolute;
	top: 50%;
	z-index: 4;
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	padding: 0;
	border: 1px solid var(--acjc-border);
	border-radius: 50%;
	background: #fff;
	color: var(--acjc-dark);
	box-shadow: 0 4px 14px rgba(0, 0, 0, .14);
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease, opacity .15s ease;
}

.acjc-loop-wrap.has-arrows .acjc-loop__arrow {
	display: flex;
}

.acjc-loop__arrow:hover:not(:disabled) {
	background: var(--acjc-accent);
	border-color: var(--acjc-accent);
	color: #fff;
}

.acjc-loop__arrow:disabled {
	opacity: 0;
	pointer-events: none;
}

.acjc-loop__arrow--prev {
	left: -6px;
}

.acjc-loop__arrow--next {
	right: -6px;
}

@media only screen and (max-width: 767px) {
	.acjc-loop__arrow {
		width: 44px;
		height: 44px;
		margin-top: -22px;
	}

	.acjc-loop__arrow--prev {
		left: 2px;
	}

	.acjc-loop__arrow--next {
		right: 2px;
	}
}

.acjc-loop__item {
	scroll-snap-align: start;
	min-width: 0;
}

.acjc-loop__item .column,
.acjc-loop__item .wrap {
	width: 100%;
	padding: 0;
}

/* Posledni sloupec v polozce uz nedrzi mezeru zdola - stejne jako driv. */
.acjc-loop__item .mcb-column:last-child > .mcb-column-inner {
	margin-bottom: 1px;
}

@media only screen and (max-width: 959px) {
	.acjc-loop {
		grid-auto-columns: calc((100% - (var(--acjc-loop-cols-tablet) - 1) * 24px) / var(--acjc-loop-cols-tablet));
	}
}

@media only screen and (max-width: 767px) {
	.acjc-loop {
		grid-auto-columns: calc(100% / var(--acjc-loop-cols-mobile));
	}
}

/* --- Vypis clanku --------------------------------------------------- */

.acjc-postlist__item {
	display: flex;
	gap: 24px;
	padding: 0 0 24px;
	margin: 0 0 24px;
	border-bottom: 1px solid var(--acjc-border);
}

.acjc-postlist__image {
	flex: 0 0 260px;
	max-width: 40%;
}

.acjc-postlist__title {
	font-size: 24px;
	margin-bottom: 6px;
}

.acjc-postlist__title a {
	color: var(--acjc-dark);
}

.acjc-postlist__meta {
	color: var(--acjc-muted);
	font-size: 14px;
	margin-bottom: 10px;
}

.acjc-postlist__more {
	font-weight: 600;
}

@media only screen and (max-width: 767px) {
	.acjc-postlist__item {
		flex-direction: column;
		gap: 12px;
	}

	.acjc-postlist__image {
		flex: none;
		max-width: 100%;
	}
}

/* --- Vysledky hledani ----------------------------------------------- */

.acjc-results {
	margin-bottom: 40px;
}

.acjc-results__title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 26px;
	margin-bottom: 18px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--acjc-border);
}

.acjc-results__count {
	padding: 2px 10px;
	border-radius: 999px;
	background: var(--acjc-accent);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
}

.acjc-results__more {
	margin-top: 18px;
}

.acjc-carlist {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

@media only screen and (max-width: 959px) {
	.acjc-carlist { grid-template-columns: repeat(2, 1fr); }
}

@media only screen and (max-width: 600px) {
	.acjc-carlist { grid-template-columns: 1fr; }
}

.acjc-carlist__link {
	display: block;
	color: inherit;
	border: 1px solid var(--acjc-border);
	border-radius: 6px;
	overflow: hidden;
	transition: border-color .15s ease;
}

.acjc-carlist__link:hover,
.acjc-carlist__link:focus-visible {
	border-color: var(--acjc-accent);
	text-decoration: none;
}

.acjc-carlist__image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.acjc-carlist__body {
	display: block;
	padding: 14px 16px 16px;
}

.acjc-carlist__name {
	display: block;
	font-weight: 600;
	line-height: 1.3;
	margin-bottom: 6px;
}

.acjc-carlist__price {
	display: block;
	color: var(--acjc-accent-ink);
	font-weight: 700;
}

/*
 * Stranka s uzkym sloupcem vedle obsahu. Mrizka 1300 px se deli na 975
 * pro text a 325 pro panel - presne jako v puvodnim tematu.
 */
.acjc-aside--on {
	display: flex;
	flex-wrap: nowrap;
	max-width: 1300px;
	width: 100%;
	margin: 0 auto;
}

.acjc-aside--on .acjc-aside__main {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0 10px;
}

.acjc-aside__side {
	flex: 0 0 325px;
	padding: 0 20px;
}

@media only screen and (max-width: 959px) {
	.acjc-aside--on {
		flex-wrap: wrap;
	}

	.acjc-aside--on .acjc-aside__main,
	.acjc-aside__side {
		flex: 1 1 100%;
		padding: 0;
	}
}

/* Detail clanku - stejne velikosti jako v puvodnim tematu. */
.acjc-single .post-header {
	width: 100%;
}

.acjc-single .post-meta {
	margin-bottom: 8px;
	color: var(--acjc-muted);
}

.acjc-single h1.entry-title {
	font-size: 30px;
	line-height: 35px;
	margin-bottom: 18px;
}

.acjc-single .post-wrapper-content {
	width: 100%;
}

.acjc-single .the_content_wrapper {
	margin-bottom: 15px;
}

/* --- Katalog vozu --------------------------------------------------- */

/*
 * Katalog vozu. Rozmery jsou stejne jako driv: mrizka 1300 px, filtr
 * vlevo v pruhu 325 px, vypis vozu v 975 px.
 */
/* Sirsi mrizka plati jen pro katalog s filtrem, ne pro detail vozu. */
.acjc-shop--with-sidebar .section_wrapper {
	max-width: 1300px;
}

@media only screen and (max-width: 1360px) {
	.acjc-shop--with-sidebar .section_wrapper {
		max-width: calc(100% - 2 * var(--acjc-gutter));
	}
}

/* Nadpis katalogu - stejne odsazeni jako driv. */
.acjc-shop__title {
	width: 100%;
	margin: 30px 0 0;
	padding-left: 10px;
	color: var(--acjc-accent-ink);
	font-size: 30px;
	line-height: 35px;
	letter-spacing: 1px;
}

.acjc-shop__layout {
	display: flex;
	flex-wrap: nowrap;
	width: 100%;
}

/* Filtr zacina o kus niz, aby lícoval s prvnim vozem. */
.acjc-shop__sidebar .widget {
	margin: 30px 0;
}

/*
 * Lista nad vypisem: vlevo pocet vysledku, vpravo razeni. Rozmery jsou
 * stejne jako driv.
 */
.acjc-shop .shop-filters {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0 25px;
	padding: 15px 0 15px 10px;
	margin-bottom: 20px;
}

.acjc-shop .shop-filters .woocommerce-result-count {
	margin: 0;
}

.acjc-shop .shop-filters .woocommerce-ordering {
	margin: 0 0 0 auto;
}

.acjc-shop .shop-filters .woocommerce-notices-wrapper:empty {
	display: none;
}

.acjc-shop__main {
	flex: 1 1 auto;
	min-width: 0;
}

/*
 * Detail vozu sklada sloupce vedle sebe. Puvodni sablona na to pouziva
 * flexbox; v beznem toku by prazdne <br> mezi bloky pridavaly radky navic.
 */
.single-product .acjc-shop__main {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}

.acjc-shop--with-sidebar .acjc-shop__layout {
	margin-top: 10px;
}

.acjc-shop--with-sidebar .acjc-shop__main {
	padding: 0 10px;
}

/* Filtr zabira ctvrtinu mrizky - pri 1300 px je to 325 px jako driv. */
.acjc-shop__sidebar {
	flex: 0 0 25%;
	/* min-width: 0 - jinak by sloupec roztahl nejsirsi popisek filtru. */
	min-width: 0;
	order: -1;
	padding: 0 20px;
}

/*
 * Tablet a mobil: filtr stoji nad vypisem pres celou sirku a je slozeny
 * pod tlacitkem. Ve sloupci vedle vozu by mel jen ~180 px, do kterych se
 * dlazdice znacek ani jezdci rozsahu nevejdou.
 */
@media only screen and (max-width: 959px) {
	.acjc-shop__layout {
		flex-wrap: wrap;
	}

	.acjc-shop__sidebar {
		flex: 1 1 100%;
		padding: 0;
	}

	.acjc-shop__sidebar .widget {
		margin: 0 0 16px;
	}

	.acjc-shop--with-sidebar .acjc-shop__layout {
		margin-top: 0;
	}

	.acjc-shop--with-sidebar .acjc-shop__main {
		flex: 1 1 100%;
		padding: 0;
	}
}

.acjc-breadcrumb {
	font-size: 14px;
	color: var(--acjc-muted);
	margin-bottom: 16px;
}

/* --- Strankovani ---------------------------------------------------- */

.pagination,
.woocommerce-pagination {
	margin: 30px 0;
}

.pagination .nav-links,
.woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}

.woocommerce-pagination li {
	margin: 0;
	border: 0;
}

.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 10px;
	border: 1px solid var(--acjc-border);
	border-radius: 4px;
	color: var(--acjc-text);
	line-height: 1;
}

.page-numbers:hover,
.page-numbers:focus-visible {
	border-color: var(--acjc-accent);
	color: var(--acjc-accent-ink);
	text-decoration: none;
}

.page-numbers.current {
	background: var(--acjc-accent);
	border-color: var(--acjc-accent);
	color: #fff;
	font-weight: 600;
}

/* Ikona a nazev site drzi pohromade a rada se sklada do mrizky. */
.acjc-social-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px 20px;
}

.acjc-social {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
}

@media only screen and (max-width: 767px) {
	.acjc-social-row {
		display: grid;
		grid-template-columns: repeat(2, auto);
		justify-content: center;
		gap: 2px 26px;
	}

	.acjc-social {
		justify-content: flex-start;
	}

	/* Pravni odkazy pod sebou, bez lomitek - jinak se lamou uprostred nazvu. */
	.acjc-legal-row {
		display: grid;
		justify-content: center;
		gap: 2px;
		text-align: center;
	}

	.acjc-legal-row .acjc-sep {
		display: none;
	}
}

/*
 * Odkazy na socialni site v paticce jsou jen text vysoky 21 px a stoji
 * tesne u sebe - prst je netrefi. Odsazeni je zvetsi na 27 px a odsune
 * od sebe, vzhled zustava.
 */
a[href*="facebook.com"],
a[href*="youtube.com"],
a[href*="instagram.com"],
a[href*="linkedin.com"] {
	display: inline-block;
	padding: 3px 5px;
}

/*
 * Vysvetlivky u vybavy vozu ("i") se od okolniho textu lisily jen barvou -
 * kdo barvy nerozlisi, odkaz nepozna.
 */
.paoc-popup-simple_link {
	text-decoration: underline;
}

/*
 * Na strance porovnani nemaji novinky co delat - uzivatel prisel srovnavat
 * vozy. (Tridu na <body> pridava inc/compare.php.)
 */
.acjc-compare-page .snews {
	display: none;
}

/* --- Zpet nahoru ------------------------------------------------------ */

.acjc-totop {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 340;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--acjc-dark);
	color: #fff;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .28);
	cursor: pointer;
	opacity: .92;
	animation: acjc-totop-in .2s ease;
	transition: background-color .15s ease;
}

.acjc-totop:hover,
.acjc-totop:focus-visible {
	background: var(--acjc-accent);
	opacity: 1;
}

@keyframes acjc-totop-in {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
}

@media print {
	.acjc-totop {
		display: none;
	}
}

/* S otevrenym filtrem by tlacitko sedelo na "Smazat filtry". */
body:has(.acjc-filters.is-open) .acjc-totop {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.acjc-totop {
		animation: none;
	}
}

/*
 * Tecky pod galerii maji 18 px - prst je netrefi. Neviditelna plocha
 * kolem nich rozsiri cil na 44 px, aniž by se zmenil vzhled.
 */
.fg-carousel-bullet {
	position: relative;
}

.fg-carousel-bullet::after {
	content: "";
	position: absolute;
	inset: -13px;
}

/* Na dotyk maji cisla stranek 44 px a vetsi mezeru mezi sebou. */
@media only screen and (max-width: 959px) {
	.page-numbers {
		min-width: 44px !important;
		height: 44px !important;
		padding: 0 10px;
	}

	.pagination .nav-links,
	.woocommerce-pagination ul {
		gap: 8px;
	}
}

/* --- Ikony ----------------------------------------------------------
 * Web pouziva jen osm ikon, takze misto celeho fontu staci vektory primo
 * ve stylu. Barvu prebiraji z textu.
 * ------------------------------------------------------------------- */

[class^="icon-"],
[class*=" icon-"] {
	display: inline-block;
	width: 1em;
	height: 1em;
	vertical-align: -0.125em;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.icon-call,
.icon-phone {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.6 10.8c1.4 2.8 3.8 5.2 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.2 1l-2.3 2.2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.6 10.8c1.4 2.8 3.8 5.2 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.2 1l-2.3 2.2z'/%3E%3C/svg%3E");
}

.icon-email,
.icon-mail-line {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4.2-8 5-8-5V6l8 5 8-5v2.2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4.2-8 5-8-5V6l8 5 8-5v2.2z'/%3E%3C/svg%3E");
}

/*
 * Hodiny u data, dokument u prilohy a sipky v drobeckove navigaci. Bez
 * obrazku se prvek vykreslil jako plny ctverecek v barve textu.
 */
.icon-clock {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm.5-13H11v6l5 3 .8-1.3-4.3-2.5z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm.5-13H11v6l5 3 .8-1.3-4.3-2.5z'/%3E%3C/svg%3E");
}

.icon-doc-text {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8zm-1 7V3.5L18.5 9zM8 13h8v2H8zm0 4h8v2H8z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8zm-1 7V3.5L18.5 9zM8 13h8v2H8zm0 4h8v2H8z'/%3E%3C/svg%3E");
}

.icon-down-open {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m12 15.4-6-6L7.4 8l4.6 4.6L16.6 8 18 9.4z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m12 15.4-6-6L7.4 8l4.6 4.6L16.6 8 18 9.4z'/%3E%3C/svg%3E");
}

.icon-right-open {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M8.6 18 7.2 16.6 11.8 12 7.2 7.4 8.6 6l6 6z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M8.6 18 7.2 16.6 11.8 12 7.2 7.4 8.6 6l6 6z'/%3E%3C/svg%3E");
}

.icon-facebook-squared {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20 2H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v-7H9.5v-3H12V9.8C12 7.3 13.5 6 15.7 6c1 0 1.9.1 2.1.1v2.5h-1.5c-1.2 0-1.4.6-1.4 1.4V12h2.8l-.4 3H15v7h5a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20 2H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v-7H9.5v-3H12V9.8C12 7.3 13.5 6 15.7 6c1 0 1.9.1 2.1.1v2.5h-1.5c-1.2 0-1.4.6-1.4 1.4V12h2.8l-.4 3H15v7h5a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2z'/%3E%3C/svg%3E");
}

.icon-youtube {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M23 7.5s-.2-1.6-.9-2.3c-.9-.9-1.8-.9-2.3-1C17 4 12 4 12 4s-5 0-7.8.2c-.4 0-1.4 0-2.3 1C1.2 5.9 1 7.5 1 7.5S.8 9.4.8 11.3v1.4C.8 14.6 1 16.5 1 16.5s.2 1.6.9 2.3c.9.9 2 .9 2.5 1 1.8.2 7.6.2 7.6.2s5 0 7.8-.2c.5-.1 1.4-.1 2.3-1 .7-.7.9-2.3.9-2.3s.2-1.9.2-3.8v-1.4c0-1.9-.2-3.8-.2-3.8zM9.8 15.1V9l6.4 3.1-6.4 3z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M23 7.5s-.2-1.6-.9-2.3c-.9-.9-1.8-.9-2.3-1C17 4 12 4 12 4s-5 0-7.8.2c-.4 0-1.4 0-2.3 1C1.2 5.9 1 7.5 1 7.5S.8 9.4.8 11.3v1.4C.8 14.6 1 16.5 1 16.5s.2 1.6.9 2.3c.9.9 2 .9 2.5 1 1.8.2 7.6.2 7.6.2s5 0 7.8-.2c.5-.1 1.4-.1 2.3-1 .7-.7.9-2.3.9-2.3s.2-1.9.2-3.8v-1.4c0-1.9-.2-3.8-.2-3.8zM9.8 15.1V9l6.4 3.1-6.4 3z'/%3E%3C/svg%3E");
}

.icon-instagram {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2.2c3.2 0 3.6 0 4.9.1 1.2.1 1.8.2 2.2.4.6.2 1 .5 1.4.9.4.4.7.8.9 1.4.2.4.4 1 .4 2.2.1 1.3.1 1.7.1 4.9s0 3.6-.1 4.9c-.1 1.2-.2 1.8-.4 2.2-.2.6-.5 1-.9 1.4-.4.4-.8.7-1.4.9-.4.2-1 .4-2.2.4-1.3.1-1.7.1-4.9.1s-3.6 0-4.9-.1c-1.2-.1-1.8-.2-2.2-.4-.6-.2-1-.5-1.4-.9-.4-.4-.7-.8-.9-1.4-.2-.4-.4-1-.4-2.2C2.2 15.6 2.2 15.2 2.2 12s0-3.6.1-4.9c.1-1.2.2-1.8.4-2.2.2-.6.5-1 .9-1.4.4-.4.8-.7 1.4-.9.4-.2 1-.4 2.2-.4 1.3-.1 1.7-.1 4.8-.1zm0 3.3A6.5 6.5 0 1 0 18.5 12 6.5 6.5 0 0 0 12 5.5zm0 10.7A4.2 4.2 0 1 1 16.2 12 4.2 4.2 0 0 1 12 16.2zm6.8-10.9a1.5 1.5 0 1 1-1.5-1.5 1.5 1.5 0 0 1 1.5 1.5z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2.2c3.2 0 3.6 0 4.9.1 1.2.1 1.8.2 2.2.4.6.2 1 .5 1.4.9.4.4.7.8.9 1.4.2.4.4 1 .4 2.2.1 1.3.1 1.7.1 4.9s0 3.6-.1 4.9c-.1 1.2-.2 1.8-.4 2.2-.2.6-.5 1-.9 1.4-.4.4-.8.7-1.4.9-.4.2-1 .4-2.2.4-1.3.1-1.7.1-4.9.1s-3.6 0-4.9-.1c-1.2-.1-1.8-.2-2.2-.4-.6-.2-1-.5-1.4-.9-.4-.4-.7-.8-.9-1.4-.2-.4-.4-1-.4-2.2C2.2 15.6 2.2 15.2 2.2 12s0-3.6.1-4.9c.1-1.2.2-1.8.4-2.2.2-.6.5-1 .9-1.4.4-.4.8-.7 1.4-.9.4-.2 1-.4 2.2-.4 1.3-.1 1.7-.1 4.8-.1zm0 3.3A6.5 6.5 0 1 0 18.5 12 6.5 6.5 0 0 0 12 5.5zm0 10.7A4.2 4.2 0 1 1 16.2 12 4.2 4.2 0 0 1 12 16.2zm6.8-10.9a1.5 1.5 0 1 1-1.5-1.5 1.5 1.5 0 0 1 1.5 1.5z'/%3E%3C/svg%3E");
}

.icon-linkedin {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20.4 2H3.6C2.7 2 2 2.7 2 3.5v17c0 .8.7 1.5 1.6 1.5h16.8c.9 0 1.6-.7 1.6-1.5v-17c0-.8-.7-1.5-1.6-1.5zM8 19H5V9.5h3V19zM6.5 8.2a1.7 1.7 0 1 1 0-3.5 1.7 1.7 0 0 1 0 3.5zM19 19h-3v-4.6c0-1.1 0-2.5-1.6-2.5S12.6 13 12.6 14.3V19h-3V9.5h2.9v1.3h.1c.4-.8 1.4-1.6 2.9-1.6 3.1 0 3.7 2 3.7 4.7V19z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20.4 2H3.6C2.7 2 2 2.7 2 3.5v17c0 .8.7 1.5 1.6 1.5h16.8c.9 0 1.6-.7 1.6-1.5v-17c0-.8-.7-1.5-1.6-1.5zM8 19H5V9.5h3V19zM6.5 8.2a1.7 1.7 0 1 1 0-3.5 1.7 1.7 0 0 1 0 3.5zM19 19h-3v-4.6c0-1.1 0-2.5-1.6-2.5S12.6 13 12.6 14.3V19h-3V9.5h2.9v1.3h.1c.4-.8 1.4-1.6 2.9-1.6 3.1 0 3.7 2 3.7 4.7V19z'/%3E%3C/svg%3E");
}

/* --- Vyskakovaci okno ----------------------------------------------- *
 * Otevre ho odkaz na kotvu #mfn-popup-template-<id>, takze funguje
 * i bez JavaScriptu. Zavira se odkazem s krizkem.
 * -------------------------------------------------------------------- */

.mfn-popup-tmpl {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 400;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.mfn-popup-tmpl:target {
	display: flex;
}

.mfn-popup-tmpl::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .24);
	backdrop-filter: blur(3px);
}

.mfn-popup-tmpl-content {
	position: relative;
	width: 600px;
	max-width: 100%;
	max-height: 100%;
	overflow: auto;
	background: var(--acjc-accent);
}

.mfn-popup-tmpl .exit-mfn-popup-abs {
	position: absolute;
	right: 30px;
	top: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	background: #2b2b2b;
	color: #fff;
	font-size: 14px;
	line-height: 1;
}

/* --- Paticka -------------------------------------------------------- */

/* Pozadi si nesou jednotlive sekce paticky, tady jen barva textu. */
.acjc-footer {
	color: #3f3f3f;
}

.acjc-footer a {
	color: inherit;
}

.acjc-footer a:hover {
	color: var(--acjc-accent-ink);
}

/*
 * Na mobilu maji sekce hlavicky a paticky jine odsazeni nez obsah stranky:
 * hlavicka jde az ke krajum, paticka se naopak odsadi o 33 px. Stejna
 * pravidla mela i puvodni sablona.
 */
@media only screen and (max-width: 767px) {
	/*
	 * V obsahu stranky se sloupce skladaji pod sebe, takze uz nepotrebuji
	 * bocni mezery - misto nich maji jednotny odstup 20 px zdola.
	 */
	.content_wrapper .mcb-column-inner {
		margin: 0 0 20px;
	}

	.content_wrapper .mcb-column-absolute .mcb-column-inner,
	.content_wrapper .mfn-column-absolute .mcb-column-inner {
		margin: 0;
	}

	.no-sec-padding .mcb-section .section_wrapper,
	.no-sec-padding-mob .mcb-section .section_wrapper {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.mfn-header-tmpl .section_wrapper {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.mfn-footer-tmpl .mcb-section:not(.full-width) {
		max-width: 100%;
		padding-left: 33px;
		padding-right: 33px;
	}

	.mfn-footer-tmpl .mcb-section .section_wrapper {
		max-width: 100% !important;
	}
}

/* -------------------------------------------------------------------------
 * Horni lista: ikony a stav prodejny
 * ---------------------------------------------------------------------- */

/*
 * Telefon a e-mail v horni liste maji ikonu z ikonoveho pisma puvodni
 * sablony. To s sebou nevozime, kreslime je obrazkem v barve webu.
 */
.mfn-header-tmpl .column_attr .icon-phone,
.mfn-header-tmpl .column_attr .icon-mail-line {
	display: inline-block;
	width: 17px;
	height: 17px;
	margin-right: 8px;
	vertical-align: -3px;
	background-color: var(--acjc-accent);
}

.mfn-header-tmpl .column_attr .icon-phone {
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 3h3l1.5 3.7-2 1.4a12 12 0 0 0 4.8 4.8l1.4-2 3.7 1.5v3a2 2 0 0 1-2.2 2A16.5 16.5 0 0 1 4.6 5.2 2 2 0 0 1 6.6 3z' fill='%23000'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 3h3l1.5 3.7-2 1.4a12 12 0 0 0 4.8 4.8l1.4-2 3.7 1.5v3a2 2 0 0 1-2.2 2A16.5 16.5 0 0 1 4.6 5.2 2 2 0 0 1 6.6 3z' fill='%23000'/%3E%3C/svg%3E") center / contain no-repeat;
}

.mfn-header-tmpl .column_attr .icon-mail-line {
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6.5A1.5 1.5 0 0 1 4.5 5h15A1.5 1.5 0 0 1 21 6.5v11a1.5 1.5 0 0 1-1.5 1.5h-15A1.5 1.5 0 0 1 3 17.5z' fill='none' stroke='%23000' stroke-width='2'/%3E%3Cpath d='m4 7 8 6 8-6' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6.5A1.5 1.5 0 0 1 4.5 5h15A1.5 1.5 0 0 1 21 6.5v11a1.5 1.5 0 0 1-1.5 1.5h-15A1.5 1.5 0 0 1 3 17.5z' fill='none' stroke='%23000' stroke-width='2'/%3E%3Cpath d='m4 7 8 6 8-6' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
}

/*
 * Telefon v horni liste mel sirku presne na cislo. Odznak s oteviraci
 * dobou potrebuje misto navic, proto se sloupec roztahne podle obsahu.
 */
.mfn-header-tmpl .mcb-wrap-4b968096d,
.mfn-header-tmpl .mcb-wrap-inner-4b968096d,
.mfn-header-tmpl .mcb-item-6861d283a,
.mfn-header-tmpl .mcb-column-inner-6861d283a,
.mfn-header-tmpl .mcb-item-6861d283a .column_attr {
	width: auto !important;
	flex: 0 0 auto;
	white-space: nowrap;
}

.mfn-header-tmpl .mcb-wrap-inner-4b968096d {
	gap: 0 24px;
}

/*
 * Stav prodejny vedle telefonu. V liste je jen tecka - zelena kdyz je
 * otevreno, cervena kdyz zavreno; cely text vyjede az po najeti mysi
 * nebo po prechodu klavesnici.
 */
.acjc-open {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	margin-left: 4px;
	padding: 0;
	/*
	 * Ctverec 22 px sedne na stred cisla telefonu (18 px, radek 25 px)
	 * prave pri +2 px - "middle" i "baseline" ho posadi o kus niz.
	 */
	vertical-align: 2px;
	cursor: help;
}

.acjc-open.is-open {
	color: #1b7a35;
}

.acjc-open.is-closed {
	color: #c92a2a;
}

.acjc-open__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: currentColor;
}

.acjc-open__text {
	position: absolute;
	left: 50%;
	top: calc(100% + 6px);
	z-index: 400;
	padding: 6px 10px;
	border-radius: 6px;
	background: var(--acjc-dark, #161922);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.3;
	white-space: nowrap;
	transform: translateX(-50%);
	opacity: 0;
	visibility: hidden;
	transition: opacity .15s ease;
	pointer-events: none;
}

/* Sipka k tecce, at je videt, ke kteremu prvku bublina patri. */
.acjc-open__text::before {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 100%;
	border: 5px solid transparent;
	border-bottom-color: var(--acjc-dark, #161922);
	transform: translateX(-50%);
}

.acjc-open:hover .acjc-open__text,
.acjc-open:focus .acjc-open__text,
.acjc-open:focus-visible .acjc-open__text {
	opacity: 1;
	visibility: visible;
}

/* Ramecek pri prechodu klavesnici kopiruje tvar tecky. */
.acjc-open:focus {
	outline: none;
}

.acjc-open:focus-visible {
	outline: 2px solid var(--acjc-accent);
	outline-offset: 1px;
	border-radius: 50%;
}

.acjc-open.is-open .acjc-open__dot {
	box-shadow: 0 0 0 0 rgba(27, 122, 53, .55);
	animation: acjc-open-pulse 2s ease-out infinite;
}

@keyframes acjc-open-pulse {
	70% {
		box-shadow: 0 0 0 7px rgba(27, 122, 53, 0);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(27, 122, 53, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.acjc-open.is-open .acjc-open__dot {
		animation: none;
	}
}

@media only screen and (max-width: 767px) {
	.acjc-open {
		margin-left: 2px;
	}
}

/* -------------------------------------------------------------------------
 * Detail vozu - parametry, vybava, poptavka
 * ---------------------------------------------------------------------- */

/*
 * Prehled parametru je tabulka: nazev vlevo, hodnota vpravo, kazdy radek
 * oddeleny linkou. Driv to byl souvisly odstavec textu.
 */
.amnts ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * Puvodni styl radky plave ve dvou sloupcich - mrizka uvnitr je proto
 * s odsazenim zprava, at hodnota nenarazi do nazvu vedlejsiho sloupce.
 */
.amnts ul li {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 8px 16px;
	align-items: baseline;
	box-sizing: border-box;
	margin: 0;
	padding: 9px 24px 9px 0;
	border-bottom: 1px solid var(--acjc-border);
	color: var(--acjc-muted);
}

@media only screen and (max-width: 767px) {
	.amnts ul li {
		float: none !important;
		width: 100% !important;
		padding-right: 0;
	}
}

.amnts ul li:last-child {
	border-bottom: 0;
}

.amnts ul li strong {
	color: var(--acjc-dark);
	text-align: right;
	word-break: break-word;
}

/* Poptavkove tlacitko pod parametry ma stejnou sirku jako tabulka. */
.bigpop {
	margin-top: 22px;
}

/* --- Poptavkovy formular ----------------------------------------------- */

/*
 * Formular mel mezi poli 30 px a odesilaci tlacitko sirku podle textu.
 * Pole stoji v mrizce, tlacitko je pres celou sirku - na dotyk se treti.
 */
.wpforms-container .wpforms-field {
	padding: 8px 0 !important;
}

/*
 * Souhlas se zpracovanim udaju stoji na vlastnim radku a odesilaci
 * tlacitko pod nim. Puvodni styl webu si tlacitko pritahoval o 48 px
 * nahoru (pocital s uzkym tlacitkem vedle zaskrtavatka) - pres celou
 * sirku ale souhlas prekrylo a nesel zaskrtnout.
 */
.wpforms-container .wpforms-field.wpforms-field-checkbox {
	width: 100% !important;
	float: none !important;
}

.wpforms-container .wpforms-submit-container {
	padding-top: 6px !important;
}

/*
 * Selektor musi prebit puvodni pravidlo se stejnou vahou i !important -
 * proto "body" navic.
 */
body .wpforms-container .wpforms-field-container:has(> .wpforms-field-checkbox:last-child) + .wpforms-submit-container button[type="submit"],
.wpforms-container .wpforms-submit {
	margin-top: 16px !important;
}

.wpforms-container button[type="submit"],
.wpforms-container .wpforms-submit {
	width: 100%;
	min-height: 50px;
	border-radius: 8px;
	font-size: 17px;
	font-weight: 600;
}

@media only screen and (max-width: 620px) {
	/* Dve pole vedle sebe maji na telefonu 150 px - radeji pod sebe. */
	.wpforms-container .wpforms-field.wpforms-one-half,
	.wpforms-container .wpforms-field.wpforms-two-thirds,
	.wpforms-container .wpforms-field.wpforms-one-third {
		float: none !important;
		width: 100% !important;
		margin-left: 0 !important;
	}
}

/* --- Vybava ------------------------------------------------------------ */

/*
 * Kazda skupina vybavy je vlastni obal (.dl_v_part), takze mrizku davame
 * na jejich spolecneho rodice - jinak by stale stály pod sebou.
 */
.column:has(> .dl_v_part) {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 20px;
	align-items: start;
}

/* Nadpis sekce a pripadny dalsi obsah drzi celou sirku mrizky. */
.column:has(> .dl_v_part) > *:not(.dl_v_part) {
	grid-column: 1 / -1;
}

.dl_v_part {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
}

.dl_v_inpart {
	margin: 0 !important;
	padding: 18px 20px !important;
	border-radius: 10px;
	background: #fff;
}

.dl_v_inpart ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.dl_v_inpart ul li {
	margin: 0;
	padding: 4px 0;
}

.dl_v_inpart h4 {
	display: flex;
	align-items: center;
	gap: 10px;
}

.acjc-equip-icon {
	flex: none;
	width: 26px;
	height: 26px;
	color: var(--acjc-accent-ink);
}

/* -------------------------------------------------------------------------
 * Tym (plugin Team Members)
 *
 * Plugin sklada lidi z plovoucich sloupcu s velkym odsazenim a fotku
 * vytahuje zapornym okrajem nahoru. Jeden clovek tak zabral pres 600 px.
 * Prepisujeme to na mrizku s kompaktni kartou.
 * ---------------------------------------------------------------------- */

.tmm {
	margin: 0 0 40px;
	width: 100%;
}

/*
 * Plugin sklada lidi po radcich - kazdy radek je vlastni obal. Kdyz byla
 * mrizka na obalu, radky na sebe nasedaly bez mezery a posledni se
 * zarovnal do jineho rastru. Mrizka je proto az na vnejsim obalu a radkove
 * obaly se z rozlozeni vypousteji (display: contents), takze vsichni lide
 * lezi v jedne spolecne mrizce.
 */
.tmm .tmm_wrap {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 34px 24px;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

.tmm .tmm_container:not(.tmm_two_containers_tablet) {
	display: contents !important;
}

/*
 * Plugin mezi lidi vklada znacky pro zalomeni sloupcu a prazdny clearfix.
 * V mrizce by kazda z nich zabrala jedno misto (a posunula tak cely dalsi
 * radek), proto je z rozlozeni vypousti.
 */
.tmm [class*="tmm_two_containers"],
.tmm [class*="tmm_columns_containers"],
.tmm .tmm_wrap > div:empty,
.tmm .tmm_container > div:empty {
	display: none !important;
}

/* Clearfix pluginu uz neni k cemu. */
.tmm::before,
.tmm::after,
.tmm .tmm_wrap::before,
.tmm .tmm_wrap::after,
.tmm .tmm_container::before,
.tmm .tmm_container::after {
	content: none;
}

.tmm .tmm_member {
	display: block !important;
	float: none !important;
	clear: none !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 0 16px !important;
	border-top: 0 !important;
	border-bottom: 2px solid var(--acjc-accent);
	text-align: left;
}

/*
 * Portrety jsou na vysku. V nizkem pruhu je "cover" usekaval v pulce
 * obliceje, proto ma dlazdice pomer 4:3 a rez zacina nad hlavou.
 * Selektor musi byt stejne dlouhy jako v tmm_style.css, ktery si polohu
 * vynucuje pres !important.
 */
.tmm .tmm_member .tmm_photo[style] {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 4 / 3;
	margin: 0 0 14px !important;
	padding: 0 !important;
	background-position: center 18% !important;
	background-size: cover !important;
}

.tmm .tmm_textblock {
	padding: 0;
}

.tmm .tmm_textblock .tmm_names {
	margin: 0 0 4px !important;
	color: var(--acjc-dark);
	font-size: 17px !important;
	line-height: 23px !important;
	font-weight: 600;
}

/*
 * Krestni jmeno a prijmeni ma plugin kazde na svem radku. Delsi jmeno
 * se tim zbytecne lame - drzime je na jednom radku.
 */
.tmm .tmm_names .tmm_fname,
.tmm .tmm_names .tmm_lname {
	display: inline !important;
	float: none !important;
}

.tmm .tmm_job {
	margin: 0 0 10px !important;
	color: var(--acjc-accent-ink);
	font-size: 15px;
	line-height: 20px;
}

.tmm .tmm_desc {
	margin: 0 !important;
	font-size: 15px;
	line-height: 24px;
}

.tmm .tmm_desc p {
	margin: 0;
}

.tmm .tmm_desc a {
	color: var(--acjc-accent-ink);
	word-break: break-word;
}

.tmm .tmm_desc i {
	width: 18px;
	color: var(--acjc-muted);
}

/* Na uzkych obrazovkach je karta na stred a jeste kratsi. */
@media only screen and (max-width: 767px) {
	/* Dve vizitky vedle sebe - jedna pod druhou zabrala pul obrazovky. */
	.tmm .tmm_wrap {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px 12px;
	}

	.tmm .tmm_member {
		display: grid;
		justify-items: center;
		text-align: center;
		padding-bottom: 12px !important;
	}

	.tmm .tmm_member .tmm_photo[style] {
		width: 96px !important;
		height: 96px !important;
		aspect-ratio: auto;
		margin: 0 0 10px !important;
		background-position: center 15% !important;
		border-radius: 50% !important;
	}

	/* Dva radky pro jmeno, at kontakty v obou vizitkach zacinaji stejne. */
	.tmm .tmm_names {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 40px;
		font-size: 15px;
		line-height: 20px;
	}

	.tmm .tmm_job {
		font-size: 13px;
	}

	.tmm .tmm_desc,
	.tmm .tmm_desc p,
	.tmm .tmm_desc a {
		font-size: 13px;
		line-height: 19px;
		word-break: break-word;
	}
}

/* -------------------------------------------------------------------------
 * Formularove prvky
 *
 * Hodnoty prebirame z puvodni sablony, aby pole v kontaktnich formularich,
 * ve vyhledavani i razeni v katalogu vypadala presne stejne.
 * ---------------------------------------------------------------------- */

input[type="date"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
select,
textarea {
	display: block;
	box-sizing: border-box;
	width: 230px;
	max-width: 100%;
	margin: 0 0 20px;
	padding: 10px;
	border: 1px solid #ebebeb;
	border-radius: 0;
	outline: none;
	background-color: #fff;
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.02);
	color: var(--acjc-text);
	font-family: var(--acjc-font);
	font-size: 15px;
	-webkit-appearance: none;
	appearance: none;
}

input[type="date"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus {
	border-color: #d5e5ee;
	background-color: #e9f5fc;
	color: #1982c2;
}

/* Sipka v rozbalovacim seznamu - stejny obrazek jako v puvodni sablone. */
select {
	padding-right: 25px;
	background: #fff url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E") right 5px top 55% no-repeat;
}

select[multiple] {
	background-image: none;
}

textarea {
	min-height: 60px;
	line-height: 20px;
}

input[type="checkbox"],
input[type="radio"] {
	display: inline;
	width: auto;
	margin: 0;
	padding: 0;
	box-shadow: none;
	-webkit-appearance: auto;
	appearance: auto;
}

/* Razeni v katalogu je oranzove tlacitko, ne pole. */
.shop-filters .woocommerce-ordering {
	margin-bottom: 0;
}

.shop-filters .woocommerce-ordering select {
	overflow: hidden;
	width: auto;
	margin-bottom: 0;
	padding: 0 30px 0 0;
	border: 0;
	background-color: transparent;
	box-shadow: none;
	color: inherit;
	line-height: 2;
	text-overflow: ellipsis;
	cursor: pointer;
}

/* -------------------------------------------------------------------------
 * Tablet a mobil
 * ---------------------------------------------------------------------- */

/*
 * Fotka s odkazem "Zeptejte se" je posledni v hornim pruhu a jako prvni se
 * prestane vejit - pod 1200 px uz jen prelezala pres obsah.
 */
@media only screen and (max-width: 1199px) {
	.acjc-header .mcb-wrap-c754c53e1 {
		display: none;
	}
}

/*
 * Pod 768 px prepina Max Mega Menu na listu s vlastnim logem (nastaveni
 * pluginu, data-breakpoint="768"). Druhe logo v pruhu nad ni by se jen
 * krcilo, tak ho schovame.
 */
@media only screen and (max-width: 768px) {
	.acjc-header .mcb-wrap-80ab5a8f2 {
		display: none;
	}
}

@media only screen and (max-width: 959px) {
	.acjc-header .mfn-default-section .section_wrapper {
		padding-left: 10px;
		padding-right: 10px;
	}

	/* Radek s menu a ikonami se na tabletu smi zalomit. */
	.acjc-header .mcb-wrap-f12972105 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
}

/* --- Lista s logem a ikonami (Max Mega Menu) --------------------------- */

.acjc-bar {
	position: relative;
}

/* Lista ma pozadi hlavicky, ne vlastni bily obdelnik. */
#mega-menu-wrap-main-menu .mega-menu-toggle {
	background: transparent !important;
}

/*
 * Puvodne mely obe poloviny listy pevne 50 % (flex-basis: 0), takze pribyle
 * ikony pretekaly. Levou necháme podle obsahu, prava si vezme zbytek.
 */
#mega-menu-wrap-main-menu .mega-menu-toggle .mega-toggle-blocks-left {
	flex: 0 1 auto;
	min-width: 0;
}

#mega-menu-wrap-main-menu .mega-menu-toggle .mega-toggle-blocks-right {
	flex: 1 1 auto;
}

/* Logo se smi zmensit, jinak by prelezalo pres ikony. */
#mega-menu-wrap-main-menu .mega-menu-toggle .mega-logo-block {
	flex: 0 1 auto;
	min-width: 0;
}

#mega-menu-wrap-main-menu .mega-menu-toggle img.mega-menu-logo {
	max-width: 100%;
	height: auto;
}

.acjc-bar .mobicos {
	display: flex;
	align-items: center;
	gap: 2px;
	line-height: 0;
}

/* Ikona je 24 px, klikaci plocha ale cela 44 px. */
.acjc-bar .mobicos > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
}

.acjc-bar .mobicos img {
	width: 24px;
	height: 24px;
}

.acjc-msearch__toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	/* Dotykove cile maji mit aspon 44 px. */
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: none;
	color: var(--acjc-accent-ink);
	cursor: pointer;
}

.acjc-msearch__toggle:hover,
.acjc-msearch__toggle:focus-visible {
	background: rgba(254, 121, 18, .12);
}

/*
 * Prepinac menu meval klikaci plochu 24 px sirokou a 40 px vysokou.
 * Sirku i min-width urcuje Max Mega Menu, prostor proto delame odsazenim.
 * Plati pro obe podoby hlavicky (uzka lista i tabletovy radek).
 */
@media only screen and (max-width: 959px) {
	/*
	 * Lista mela pevnych 40 px, takze v ni tlacitko nemohlo byt vyssi.
	 */
	#mega-menu-wrap-main-menu .mega-menu-toggle {
		min-height: 48px !important;
	}

	.mega-menu-toggle-block button.mega-toggle-label {
		min-height: 44px;
		padding: 0 10px !important;
	}
}

.acjc-bar.is-searching .acjc-msearch__toggle {
	background: var(--acjc-accent);
	color: #fff;
}

/* Panel hledani vyjede pres obsah pod listou. */
.acjc-msearch {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 320;
	padding: 10px;
	background: #fff;
	box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

.acjc-msearch__form {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
}

.acjc-msearch .icon_search {
	display: none;
}

.acjc-msearch__form input.field {
	flex: 1 1 auto;
	min-width: 0;
	height: 44px;
	margin: 0;
	padding: 0 12px;
	border: 1px solid var(--acjc-border);
	border-radius: 8px;
	background: #fff;
	font-size: 16px;
}

.acjc-msearch__form input.field:focus {
	border-color: var(--acjc-accent);
	outline: none;
}

.acjc-msearch__submit {
	flex: none;
	width: auto;
	height: 44px;
	margin: 0;
	padding: 0 18px;
	border: 0;
	border-radius: 8px;
	background: var(--acjc-accent);
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

/* Odznak porovnani v liste je uzsi nez v siroke hlavicce. */
.acjc-bar .acjc-compare-badge--bar {
	position: relative;
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	color: var(--acjc-dark);
}

.acjc-bar .acjc-compare-badge--bar:not([hidden]) {
	display: flex;
}

.acjc-bar .acjc-compare-badge--bar .acjc-compare-badge__count {
	position: absolute;
	right: 4px;
	top: 4px;
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	border-radius: 9px;
	background: var(--acjc-accent);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	text-align: center;
}

@media only screen and (max-width: 480px) {
	/*
	 * Sirku loga sazi Max Mega Menu do vlastniho stylu s !important
	 * (max-width: 153px), proto tak dlouhy vyber.
	 */
	/*
	 * Logo smi byt az 150 px; kdyz je v liste i odznak porovnani, samo se
	 * zmensi (blok ho nechava smrstit).
	 */
	body #mega-menu-wrap-main-menu .mega-menu-toggle .mega-toggle-block-1 a.mega-menu-logo img.mega-menu-logo {
		width: 100%;
		max-width: 140px !important;
	}

	/*
	 * Ctyri ikony po 44 px uz se vedle loga nevejdou. E-mail je hned
	 * v menu i v paticce, telefon je na mobilu potrebnejsi.
	 */
	.acjc-bar .mobicos > a[href^="mailto"] {
		display: none;
	}

	/* Ikony k sobe o kousek bliz, at zbyde na logo. */
	.acjc-bar .mobicos {
		gap: 0;
	}
}

/*
 * Razeni schovaval puvodni styl webu pod 769 px (display: none !important),
 * takze na mobilu nesla nabidka vozu seradit vubec.
 */
@media only screen and (max-width: 768px) {
	.acjc-shop .shop-filters .woocommerce-ordering {
		display: block !important;
		width: 100%;
		margin: 10px 0 0;
	}

	.acjc-shop .shop-filters {
		flex-wrap: wrap;
		padding-left: 0;
	}
}

/* --- Karta vozu na uzke obrazovce -------------------------------------- */

/*
 * Puvodni styl webu ma obrazek vlevo a text s odsazenim 320 px. Pod 768 px
 * na text zbyvalo pres 200 px, takze se lamal po slabikach.
 */
/*
 * Detail vozu stoji na dvou plovoucich sloupcich. Puvodni styl webu je
 * sklada pod sebe pravidlem s max-device-width: 450px - to ale neplati
 * ani pri uzkem okne na pocitaci, ani na vetsich telefonech, takze se
 * fotogalerie krcila na polovinu sirky a text pres ni prelezal.
 */
@media only screen and (max-width: 767px) {
	.semtix_dl,
	.semtix_dr {
		float: none;
		width: 100%;
	}

	.semtix_dl_img {
		display: block;
	}

	.prodatts li {
		width: 100%;
	}

	/*
	 * Rada log znacek na titulni strane: v builderu je nastavena na tri
	 * sloupce, na mobilu ale kazde logo dostalo vlastni radek a zabiralo
	 * skoro 300 px. Vedle sebe se vejdou v pohode.
	 */
	.mcb-section-e1f22bd43 > .section_wrapper {
		display: flex;
		align-items: center;
		gap: 12px;
	}

	.mcb-section-e1f22bd43 > .section_wrapper > .wrap {
		flex: 1 1 0;
		width: auto;
		min-width: 0;
	}

	.mcb-section-e1f22bd43 .mcb-column-inner {
		margin-bottom: 0;
	}

	.mcb-section-e1f22bd43 img {
		display: block;
		max-width: 90%;
		height: auto;
		margin: 0 auto;
	}

	.acjc-catalog .ac_c_i {
		float: none;
		width: 100%;
		margin-right: 0;
		text-align: center;
	}

	.acjc-catalog .ac_c_i img {
		width: 100%;
		max-width: 400px;
	}

	/* Stejne odsazeni jako ma puvodni styl webu na telefonu. */
	.acjc-catalog .ac_c_c {
		margin-left: 10px;
	}
}

/* --- Jednotny vzhled tlacitek ----------------------------------------- */

/*
 * Web mel tlacitka ve trech podobach - oblouceny obdelnik, pilulka i
 * kolecko. Logotyp je hranaty, takze hranata jsou i tlacitka: bud plna
 * oranzova, nebo bila s oranzovym rameckem. Vsechna maji stejnou vysku,
 * odsazeni i mezeru mezi ikonou a popiskem.
 */
.acjc-print,
.acjc-compare-add,
.acjc-compare-detail,
.acjc-compare__tool,
.acjc-carnav__button,
.acjc-guide__button,
.acjc-guide__step,
.dt_popbtn,
.semtix_dl a[href="#aoa"],
.acjc-filters__toggle,
.acjc-filters__done,
.acjc-sort__button,
.acjc-sort__list,
.acjc-sort__item,
.acjc-totop,
.callme .wpforms-submit,
.wpforms-submit,
.wpforms-field input[type="text"],
.wpforms-field input[type="tel"],
.wpforms-field input[type="email"],
.wpforms-field textarea,
.woocommerce-pagination .page-numbers,
.dl_v_inpart,
.acjc-catalog .ac_c_i img,
.acjc-chip,
.cmplz-cookiebanner,
.cmplz-cookiebanner .cmplz-btn,
.cmplz-manage-consent {
	border-radius: 0 !important;
}

/* Bila tlacitka s oranzovym ramem. */
.acjc-print,
.acjc-compare-add,
.acjc-compare-detail,
.acjc-compare__tool,
.acjc-carnav__button,
.semtix_dl a[href="#aoa"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 48px;
	padding: 0 20px;
	border: 1px solid var(--acjc-accent, #fe7912);
	background: #fff;
	color: var(--acjc-accent-ink, #c85a00) !important;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color .15s ease, color .15s ease;
}

.acjc-print:hover,
.acjc-print:focus-visible,
.acjc-compare-add:hover,
.acjc-compare-add:focus-visible,
.acjc-compare-detail:hover,
.acjc-compare__tool:hover,
.acjc-carnav__button:hover,
.semtix_dl a[href="#aoa"]:hover {
	background: var(--acjc-accent, #fe7912);
	color: #fff !important;
}

/* Rada tlacitek pod parametry vozu. */
.acjc-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin: 26px 0 0;
}

.acjc-actions .acjc-print,
.acjc-actions .acjc-compare-detail,
.acjc-actions .bigpop,
.acjc-actions .dt_popbtn {
	margin: 0 !important;
}

/* Obal poptavky ma z puvodni sablony vlastni vysku - v rade prekazi. */
.acjc-actions .bigpop {
	display: inline-flex;
	align-items: center;
	height: auto !important;
	min-height: 0 !important;
	padding: 0 !important;
	line-height: 1;
}

/* Zvoleny vuz v porovnani je plne oranzovy. */
.acjc-compare-add.is-active {
	background: var(--acjc-accent, #fe7912);
	color: #fff !important;
}

/* Plna oranzova tlacitka. */
.dt_popbtn,
.acjc-guide__button--main,
.callme .wpforms-submit,
.acjc-sort__button {
	border: 1px solid var(--acjc-accent, #fe7912);
	background: var(--acjc-accent, #fe7912);
	color: #fff !important;
	font-weight: 600;
	text-decoration: none;
}

.dt_popbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 26px;
	font-size: 18px;
}

.dt_popbtn:hover,
.acjc-guide__button--main:hover,
.callme .wpforms-submit:hover,
.acjc-sort__button:hover {
	background: var(--acjc-accent-dark, #c85a00);
	border-color: var(--acjc-accent-ink, #c85a00);
	color: #fff !important;
}

/*
 * Nahoru na stranku - stejny jazyk jako ostatni tlacitka, jen bez popisku.
 */
.acjc-totop {
	width: 48px;
	height: 48px;
	border: 1px solid var(--acjc-accent, #fe7912);
	background: var(--acjc-accent, #fe7912);
	color: #fff;
}

.acjc-totop:hover,
.acjc-totop:focus-visible {
	background: var(--acjc-accent-dark, #c85a00);
	border-color: var(--acjc-accent-ink, #c85a00);
	color: #fff;
}

/* Videa u fotogalerie stoji vedle sebe se stejnou mezerou. */
.semtix_dl div:has(> a[href="#aoa"]) {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}

.semtix_dl a[href="#aoa"] {
	margin: 0 !important;
	background-color: #fff !important;
	font-size: 16px !important;
}

/*
 * Vypln pri najeti musi byt taky `!important`.
 *
 * Spolecne pravidlo pro tlacitka vyse dava pri najeti oranzove pozadi
 * a bily text (`color: #fff !important`), jenze `background-color: #fff
 * !important` o par radku vys prebilo jen tu vypln - ne uz barvu textu.
 * Tlacitka "Prehrat video" a "Spustit 360°prohlidku" tak pod kurzorem
 * mela bily text na bilem pozadi a vypadala jako prazdny ramecek.
 */
.semtix_dl a[href="#aoa"]:hover,
.semtix_dl a[href="#aoa"]:focus-visible {
	background-color: var(--acjc-accent, #fe7912) !important;
	color: #fff !important;
}


/*
 * Mezi poptavkou a Novinkami stalo pres 80 px prazdna - tri osamele <br>
 * primo v <body>, ktere vyrobil editor z prazdnych radku v "Content After".
 * Zadne zalomeni tam nic nedrzi, jen odsouvaji dalsi sekci.
 */
body > br {
	display: none;
}

/* --- Postranni sloupec u clanku ---------------------------------------- */

/*
 * Clanky jsou dlouhe, postranni sloupec kratky - at jde s textem a drzi
 * se pod pevnou hlavickou (70 px plus mezera).
 */
@media only screen and (min-width: 960px) {
	.acjc-aside__side .widget {
		position: sticky;
		top: 86px;
	}
}

/* Dokud se prehravac prohlidky stahuje, tlacitka nereaguji na dalsi kliky. */
.acjc-aos-loading {
	pointer-events: none;
	opacity: .6;
}

.acjc-aos-skeleton {
	margin: 20px 0;
	text-align: center;
}

.acjc-aos-skeleton__stage {
	width: 100%;
	aspect-ratio: 16 / 9;
	background: #eceff3;
	animation: acjc-shimmer 1.2s linear infinite;
}

.acjc-aos-skeleton__text {
	margin: 12px 0 0;
	color: var(--acjc-muted, #888);
	font-size: 16px;
}

/* --- Podobne vozy ------------------------------------------------------ */

.acjc-related {
	margin: 40px 0 10px;
}

.acjc-related__title {
	margin: 0 0 6px;
	font-size: 30px;
	line-height: 1.2;
}

.acjc-related__note {
	margin: 0 0 18px;
	color: var(--acjc-muted, #888);
	font-size: 16px;
}

/*
 * Vizitka ma ve vypisu vlastni odsazeni po stranach, aby se odlisila od
 * filtru. Tady zadny postranni sloupec neni, takze by fotka stala o kus
 * vpravo od nadpisu sekce i od formulare nad ni - odsazeni proto rusime
 * a karty zacinaji na stejne svislici jako zbytek stranky.
 */
.acjc-related .acjc-catalog .ac_c_p {
	position: relative;
	padding-right: 0;
	padding-left: 0;
}

.acjc-related .acjc-catalog .products {
	padding-top: 0;
}

.acjc-related .acjc-match {
	left: 12px;
}

.acjc-match {
	position: absolute;
	left: 18px;
	top: 16px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 30px;
	padding: 0 12px;
	background: var(--acjc-accent, #fe7912);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
}

/* Slabsi shoda uz nema kricet firemni barvou. */
.acjc-match--good {
	background: var(--acjc-dark, #161922);
}

.acjc-match--fair {
	background: #6d7280;
}

@media only screen and (max-width: 767px) {
	.acjc-related__title {
		font-size: 24px;
	}

	.acjc-match {
		left: 14px;
		top: 14px;
	}
}

/* --- Poptavka po ruce na detailu vozu ---------------------------------- */

/*
 * Lista u spodni hrany okna. Ukazuje se, az kdyz puvodni tlacitko odjede
 * nahoru, a mizi, jakmile je videt samotny formular - to resi main.js.
 */
.acjc-stickybuy {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 24px;
	border-top: 1px solid var(--acjc-border, #e2e2e2);
	background: rgba(255, 255, 255, .97);
	box-shadow: 0 -6px 22px rgba(0, 0, 0, .1);
	animation: acjc-stickybuy-in .2s ease both;
}

.acjc-stickybuy[hidden] {
	display: none;
}

@keyframes acjc-stickybuy-in {
	from {
		transform: translateY(100%);
	}
}

.acjc-stickybuy__info {
	display: flex;
	align-items: baseline;
	gap: 14px;
	min-width: 0;
}

.acjc-stickybuy__name {
	overflow: hidden;
	color: var(--acjc-dark, #161922);
	font-size: 17px;
	font-weight: 600;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.acjc-stickybuy__price {
	flex: none;
	color: var(--acjc-accent-ink, #fe7912);
	font-size: 19px;
	font-weight: 700;
	white-space: nowrap;
}

.acjc-stickybuy__btn {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 26px;
	border: 1px solid var(--acjc-accent, #fe7912);
	background: var(--acjc-accent, #fe7912);
	color: #fff !important;
	font-size: 17px;
	font-weight: 600;
	text-decoration: none;
}

.acjc-stickybuy__btn:hover,
.acjc-stickybuy__btn:focus-visible {
	border-color: var(--acjc-accent-dark, #c85a00);
	background: var(--acjc-accent-dark, #c85a00);
}

/* Tlacitko "nahoru" nesmi zustat pod listou. */
body.acjc-has-stickybuy .acjc-totop {
	bottom: 94px;
}

@media only screen and (max-width: 767px) {
	.acjc-stickybuy {
		gap: 10px;
		padding: 10px 14px;
	}

	/* Na uzke obrazovce ma prednost cena a tlacitko, nazev vozu ustoupi. */
	.acjc-stickybuy__name {
		display: none;
	}

	.acjc-stickybuy__btn {
		flex: 1 1 auto;
		padding: 0 16px;
	}
}

/* --- Lista souhlasu s cookies ------------------------------------------ */

/*
 * Complianz si veze vlastni modre tlacitka se zaoblenim - prevlekame je
 * do stejneho jazyka jako zbytek webu.
 */
.cmplz-cookiebanner {
	border: 1px solid var(--acjc-border, #e2e2e2) !important;
	border-top: 3px solid var(--acjc-accent, #fe7912) !important;
	font-family: inherit !important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
	align-self: center;
	min-height: 44px;
	height: auto !important;
	padding: 0 18px !important;
	border: 1px solid var(--acjc-accent, #fe7912) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-accept {
	background-color: var(--acjc-accent, #fe7912) !important;
	color: #fff !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-deny,
.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences,
.cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences {
	background-color: #fff !important;
	color: var(--acjc-accent-ink, #c85a00) !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover,
.cmplz-cookiebanner .cmplz-btn.cmplz-deny:hover,
.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences:hover {
	background-color: var(--acjc-accent-dark, #c85a00) !important;
	border-color: var(--acjc-accent-ink, #c85a00) !important;
	color: #fff !important;
}

.cmplz-cookiebanner .cmplz-categories .cmplz-category {
	border-radius: 0 !important;
}

/*
 * Puvodni pevne tlacitko u kraje okna prekryvalo obsah. Zustava v kodu
 * kvuli vlastni obsluze pluginu, ale mimo dohled - misto nej je odkaz
 * v paticce (viz main.js).
 */
.cmplz-manage-consent.acjc-consent-hidden {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

.acjc-consent-link {
	background: none;
	border: 0;
	font: inherit;
	cursor: pointer;
}

/* --- Paticka: tri provozovny ------------------------------------------ */

/*
 * Tri sloupce provozoven mely ruzne dlouhe nazvy i adresy (prostredni ma
 * navic dve adresy vedle sebe), takze ADRESA, PRODEJ i SERVIS zacinaly v
 * kazdem sloupci jinde. Sloupce proto sdileji jednu mrizku pres subgrid a
 * kazdy blok ma pevne dany radek - fotka, nazev s adresou, oteviraci doba.
 *
 * Pravidla mirí na konkretni bloky sablony (mcb-item-...). Kdyby se paticka
 * v builderu prestavela, zmeni se jim nazvy a rozlozeni se vrati k puvodnimu
 * skladani pod sebe - nic se nerozbije.
 */
.acjc-footer .mcb-wrap-inner-ks5jbbjin {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	/*
	 * Radky: nadpis sekce, fotka, nazev s adresou, druha adresa, treti
	 * adresa, oteviraci doba. Prostredni provozovna ma adresy dve - proto
	 * radky navic, aby stoji pod sebou a doba zacinala u vsech stejne.
	 */
	grid-template-rows: auto auto auto auto auto auto;
	/* Obal je vyssi nez obsah - bez toho by se prazdne misto rozlilo do radku. */
	align-content: start;
	/* Stejna mezera mezi sloupci jako u nahledu clanku nad paticou. */
	gap: 22px 30px;
	/* Stejna mezera i k oranzovemu bloku s kontaktem, ktery stoji vpravo. */
	padding-right: 30px;
}

.acjc-footer .mcb-wrap-inner-ks5jbbjin > .column {
	grid-column: 1 / -1;
	grid-row: 1;
}

.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap {
	display: grid;
	grid-row: 2 / span 5;
	grid-template-rows: subgrid;
	grid-template-columns: minmax(0, 1fr);
	width: auto;
}

/*
 * Radek mame urceny pevne, takze sloupec uz automaticke skladani nedoplni -
 * bez tohoto by vsechny tri provozovny lezely pres sebe v prvnim sloupci.
 */
.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap:nth-child(2) {
	grid-column: 1;
}

.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap:nth-child(3) {
	grid-column: 2;
}

.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap:nth-child(4) {
	grid-column: 3;
}

.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap > .mcb-wrap-inner {
	display: contents;
}

/* Fotka provozovny */
.acjc-footer .mcb-item-f98dfb5c7,
.acjc-footer .mcb-item-a3c13a412,
.acjc-footer .mcb-item-5b8d396eb {
	grid-row: 1;
	grid-column: 1 / -1;
}

/* Nazev a adresa */
.acjc-footer .mcb-item-ad0be62b2,
.acjc-footer .mcb-item-7ceec71b1 {
	grid-row: 2 / span 3;
	grid-column: 1 / -1;
}

.acjc-footer .mcb-item-eec6814a0 {
	grid-row: 2;
	grid-column: 1 / -1;
}

/* Prostredni provozovna ma dve adresy - stoji pod sebou, ne vedle sebe. */
.acjc-footer .mcb-item-caed2ad77 {
	grid-row: 3;
	grid-column: 1 / -1;
}

.acjc-footer .mcb-item-96c8e6eb3 {
	grid-row: 4;
	grid-column: 1 / -1;
}

/* Otevirací doba */
.acjc-footer .mcb-item-0c074165c,
.acjc-footer .mcb-item-71bfda179,
.acjc-footer .mcb-item-3ff6bc379 {
	grid-row: 5;
	grid-column: 1 / -1;
}

/*
 * Oteviraci doba je tabulka - dny vlevo, casy zarovnane na stejnou
 * svislici u vsech tri provozoven.
 */
.acjc-footer .mcb-wrap-inner-ks5jbbjin table {
	width: 100%;
	margin: 0 0 14px;
	border-collapse: collapse;
	table-layout: fixed;
}

.acjc-footer .mcb-wrap-inner-ks5jbbjin td {
	padding: 3px 0;
	border: 0;
	font-size: 16px;
	line-height: 22px;
}

.acjc-footer .mcb-wrap-inner-ks5jbbjin td:first-child {
	width: 42%;
	color: var(--acjc-text, #626262);
}

.acjc-footer .mcb-wrap-inner-ks5jbbjin td + td {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

/* Popisek PRODEJ / SERVIS s puntikem, jestli je zrovna otevreno. */
.acjc-footer .mcb-wrap-inner-ks5jbbjin p strong {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.acjc-hours-dot {
	flex: none;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #c9ccd2;
}

.acjc-hours-dot--open {
	background: #1b7a35;
}

.acjc-hours-dot--closed {
	background: #c8322c;
}

/*
 * Sloupce si z puvodni mrizky nesou sirku v procentech (one-second apod.).
 * V nove mrizce jim sirku urcuje bunka - jinak by se text mackal do
 * poloviny poloviny sloupce.
 */
.acjc-footer .mcb-wrap-inner-ks5jbbjin .column {
	width: auto;
}

/*
 * Vnitrni obal sloupce mel po stranach 12 px, takze fotky i texty
 * zacinaly o kousek vpravo od hrany sloupce a nesedely s mrizkou clanku
 * nad paticou. Mezery mezi sloupci resi mrizka sama.
 */
.acjc-footer .mcb-wrap-inner-ks5jbbjin .column,
.acjc-footer .mcb-wrap-inner-ks5jbbjin .mcb-column-inner {
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}

/*
 * Fotky drzi stejny pomer jako nahledy clanku nad paticou - puvodni uzky
 * pruh 3:1 vedle nich pusobil jako jina stranka. Vyrez je stejny u vsech
 * tri, aby radek nazvu zacinal ve stejne vysce.
 */
.acjc-footer .mcb-wrap-inner-ks5jbbjin img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 0;
}

/*
 * Nazev provozovny ma misto na tri radky - jinak by adresa skakala.
 * Velikost se blizi nadpisum clanku, jen o stupen niz: nazvy provozoven
 * jsou dlouhe a ve 30 px by zabraly ctyri radky.
 */
.acjc-footer .mcb-wrap-inner-ks5jbbjin h4 {
	min-height: 3.6em;
	margin: 4px 0 12px;
	font-size: 24px;
	line-height: 1.2;
}

@media only screen and (max-width: 959px) {
	.acjc-footer .mcb-wrap-inner-ks5jbbjin {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: none;
		gap: 0;
	}

	/*
	 * Pod sebou uz neni co zarovnavat - bloky se vrati do bezneho toku,
	 * jinak by prazdne radky mrizky delaly velke diry.
	 */
	/*
	 * Pevne urcene sloupce z desktopu je nutne zrusit - jinak si drzi
	 * sloupec 2 a 3 a mrizka kolem nich vyrobi dalsi, ktere se do uzke
	 * obrazovky nevejdou (prvni provozovna pak mela nulovou sirku).
	 */
	.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap,
	.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap:nth-child(2),
	.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap:nth-child(3),
	.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap:nth-child(4) {
		display: block;
		grid-row: auto;
		grid-column: auto;
		margin-bottom: 26px;
	}

	.acjc-footer .mcb-wrap-inner-ks5jbbjin > .wrap > .mcb-wrap-inner {
		display: block;
	}

	.acjc-footer .mcb-wrap-inner-ks5jbbjin .column {
		grid-row: auto;
		grid-column: auto;
	}

	.acjc-footer .mcb-item-caed2ad77,
	.acjc-footer .mcb-item-96c8e6eb3 {
		float: left;
		width: 50%;
	}

	.acjc-footer .mcb-wrap-inner-ks5jbbjin h4 {
		min-height: 0;
	}
}

/* --- Vizitka vozu ve vypisu -------------------------------------------- */

/*
 * Puvodni vizitka stala na plovouci fotce a vyska jednotlivych casti se
 * ridila delkou textu - nazvy pres dva radky posunuly cenu i parametry a
 * vizitky pod sebou se nikde netrefily. Ted je vizitka mrizka a kazda cast
 * ma pevnou vysku, takze cena, parametry i popis stoji ve vsech vizitkach
 * na stejne urovni bez ohledu na delku nazvu.
 */
.acjc-catalog .ac_c_p {
	display: grid;
	grid-template-columns: 300px minmax(0, 1fr);
	gap: 0 20px;
	align-items: start;
	padding: 16px 18px;
}

.acjc-catalog .ac_c_i {
	float: none;
	width: auto;
	margin: 0;
}

.acjc-catalog .ac_c_i img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 8px;
	background: var(--acjc-soft, #f8f8f8);
}

.acjc-catalog .ac_c_c {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-content: start;
	/* Stejna mezera mezi nazvem, cenou, parametry i popisem. */
	gap: 14px;
	margin: 0;
}

/*
 * Sloupec vpravo si ukrajuje jen radek s nazvem kvuli tlacitku porovnani -
 * cena, parametry i popis maji celou sirku.
 */
.acjc-catalog .ac_c_c > * {
	grid-column: 1 / -1;
	min-width: 0;
}

/*
 * Puvodni styl webu dava nazvu spodni odsazeni 15 px, takze mezera pod nim
 * byla o polovinu vetsi nez mezi ostatnimi radky - o vsechny se stara mrizka.
 */
.acjc-catalog .ac_c_c h3 {
	display: -webkit-box;
	grid-column: 1;
	grid-row: 1;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	min-height: 68px;
	margin: 0 !important;
	overflow: hidden;
	line-height: 34px;
}

.acjc-catalog .ac_c_c .acjc-compare-add {
	float: none;
	grid-column: 2;
	grid-row: 1;
	align-self: start;
	margin: 0;
}

.acjc-catalog .ac_c_c ins {
	min-height: 27px;
	text-decoration: none;
}

/*
 * Parametry jsou pet stejne sirokych bloku v jedne rade pod cenou. Kazdy
 * ma obsah na stredu sve bunky - pri automatickem skladani si posledni
 * udaj (vykon) skakal sam na druhy radek.
 */
.acjc-catalog .auto-atributy {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	gap: 6px 8px;
	min-height: 30px;
	margin: 0;
}

.acjc-catalog .auto-atributy .atribut {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 0;
	margin: 0;
	padding: 0;
	font-size: 15px;
	white-space: nowrap;
}

/* Mensi ikona, at se pet bloku vejde i v uzsim sloupci vypisu. */
.acjc-catalog .auto-atributy .atribut .ikona {
	flex: none;
	width: 24px;
	height: 24px;
}

.acjc-catalog .auto-atributy .atribut br {
	display: none;
}

/*
 * Pod 1200 px uz sloupec s vozem nema na pet bloku sirku (nejdelsi udaj
 * potrebuje ~100 px). Misto jednoho prebyvajiciho bloku na druhem radku
 * radeji tri a dva - vypada to jako mrizka, ne jako zlom.
 */
@media only screen and (max-width: 1199px) {
	.acjc-catalog .auto-atributy {
		grid-auto-flow: row;
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media only screen and (max-width: 959px) {
	.acjc-catalog .auto-atributy {
		grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
	}
}

/* Popis je serverem zkraceny, ale porad kolisa mezi tremi a ctyrmi radky. */
.acjc-catalog .car_dsc {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	min-height: 75px;
	margin: 0;
	overflow: hidden;
}

/* Prazdne obaly a cistici zlom by v mrizce zabraly vlastni radek. */
.acjc-catalog .ac_c_c br,
.acjc-catalog .ac_am:empty,
.acjc-catalog .ac_fast:empty {
	display: none;
}

@media only screen and (max-width: 959px) {
	.acjc-catalog .ac_c_p {
		grid-template-columns: 220px minmax(0, 1fr);
	}

	.acjc-catalog .ac_c_c h3 {
		min-height: 56px;
		font-size: 24px;
		line-height: 28px;
	}
}

@media only screen and (max-width: 767px) {
	.acjc-catalog .ac_c_p {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
		padding: 14px;
	}

	/*
	 * Oranzovy pruh s nazvem ma na mobilu jit pres celou sirku, tlacitko
	 * porovnani se posadi nad nej doprava.
	 */
	.acjc-catalog .ac_c_c {
		grid-template-columns: minmax(0, 1fr);
	}

	.acjc-catalog .ac_c_c .acjc-compare-add {
		z-index: 2;
		grid-column: 1;
		grid-row: 1;
		align-self: center;
		justify-self: end;
		margin-right: 6px;
	}

	.acjc-catalog .ac_c_c h3 {
		grid-row: 1;
		/* Misto pro tlacitko porovnani, at pod nim nezmizi konec nazvu. */
		padding-right: 58px;
	}

	/*
	 * Na uzke obrazovce uz vizitky nestoji vedle sebe, takze pevne vysky
	 * jen delaji hluche misto - text si radky urci sam.
	 */
	.acjc-catalog .ac_c_c h3,
	.acjc-catalog .ac_c_c ins,
	.acjc-catalog .auto-atributy,
	.acjc-catalog .car_dsc {
		min-height: 0;
	}
}

/* --- Prouzek "Nevite si rady? Zavolame Vam zpet" ----------------------- */

/*
 * Blok pochazi z WPBakery a jeho mrizka (vc_col-sm-4/8) uz na webu neni -
 * sloupce proto stály nalepene vlevo bez odsazeni a tlacitko koukalo z
 * sedeho pruhu ven. Vnorene obaly vyradime z toku a rozlozeni resi grid.
 */
/*
 * WPForms drzi formulari max-width 400 px pres vlastni ID, takze ho
 * neroztahujeme - misto toho stoji vyzva vlevo a formular u prave hrany.
 */
.callme {
	display: grid;
	grid-template-columns: auto max-content;
	justify-content: space-between;
	gap: 10px 26px;
	align-items: center;
	padding: 24px 28px;
	border-left: 4px solid var(--acjc-accent, #fe7912);
	background: #fdf0e5 !important;
}

/* Nadpis stoji nad celym prouzkem, vyzva uz v rade s polem a tlacitkem. */
.callme__title {
	grid-column: 1 / -1;
	margin: 0;
	color: var(--acjc-accent-ink, #c85a00);
	font-size: 26px;
	font-weight: 600;
	line-height: 1.2;
}

.callme__sub {
	margin: 0;
	color: var(--acjc-dark, #161922);
	font-size: 18px;
	line-height: 1.3;
}

/*
 * Radek ma z puvodni sablony "display: flex", proto tu je !important -
 * bez nej se mrizka nedostane az k textu a formulari.
 */
.callme .callme,
.callme .vc_row,
.callme .wpb_column,
.callme .vc_column-inner,
.callme .wpb_wrapper,
.callme .wpb_raw_code,
.callme .callleft {
	display: contents !important;
}

.callme .wpforms-container {
	width: 100%;
	max-width: none;
	margin: 0 !important;
	padding: 0 !important;
}

/* Telefon a tlacitko patri na jeden radek a maji mit dotykovou vysku. */
.callme form.wpforms-form {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: flex-start;
	margin: 0;
}

/*
 * Uzky zaklad, aby se pole s tlacitkem veslo na jeden radek i na tabletu.
 * !important je tu kvuli vlastnimu stylu WPForms, ktery poli davá flex auto
 * a to pak zabere cely radek.
 */
.callme form.wpforms-form .wpforms-field-container {
	flex: 1 1 140px !important;
	min-width: 0;
}

.callme .wpforms-field {
	margin: 0 !important;
	padding: 0 !important;
}

/* Pole na telefon je hlavni prvek prouzku - at ma poradnou velikost. */
.callme .wpforms-field input[type="text"],
.callme .wpforms-field input[type="tel"] {
	width: 100% !important;
	max-width: none !important;
	height: 56px;
	margin: 0 !important;
	padding: 0 16px !important;
	font-size: 17px !important;
}

.callme .wpforms-submit-container {
	flex: 0 0 auto;
	margin: 0 !important;
	padding: 0 !important;
}

.callme .wpforms-submit {
	width: auto !important;
	min-width: 170px;
	min-height: 56px;
	height: 56px !important;
	margin: 0 !important;
	white-space: nowrap;
}

@media only screen and (max-width: 767px) {
	.callme {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
		padding: 20px 18px;
	}

	.callme__title {
		font-size: 22px;
	}

	.callme form.wpforms-form {
		display: block;
	}

	.callme .wpforms-submit {
		width: 100% !important;
		margin-top: 10px !important;
	}
}

/* --- Kontrast oranzoveho textu ---------------------------------------- */

/*
 * Puvodni styly webu (smtx.css, smtx2.css a mistni styl builderu) barvi
 * texty firemni oranzovou pres !important. Ikony, vyplne a ramecky
 * necháváme, ctenym textum davame tmavsi odstin - jinak nesplni WCAG AA.
 */
.breadcrumbs li,
.breadcrumbs li a,
.dl_cena .prc,
.dl_v_part h4,
.top_car .prc,
.ac_c_p ins,
.ac_fast span,
.toprtext,
.xal,
.tmm .tmm_job,
.tmm .tmm_job p,
.refs .tmm_job,
.ac_op_top_od,
.acd_op_top_od,
.acf_form_val,
.subheader-both-center #Subheader .title,
a[href^="tel"],
a[href^="mailto"],
.mfn-header-menu > li.current-menu-item > a.mfn-menu-link,
.mfn-header-menu > li.current-menu-ancestor > a.mfn-menu-link,
.mfn-header-menu > li.current-product_cat-ancestor > a.mfn-menu-link {
	color: var(--acjc-accent-ink, #c85a00) !important;
}

/*
 * Odkazy v obsahu maji mistni styl builderu (0,3,1), takze samotne "a"
 * z tematu na ne nedosahne.
 */
.column_attr a,
.global_content a,
.semtix_dl a,
.tmm_desc a,
.wpforms-field-label-inline a {
	color: var(--acjc-accent-ink, #c85a00);
}

/*
 * Mistni styl builderu cili na konkretni sloupec (.mcb-item-xxx) a stoji
 * v hlavicce az za tematem - prebijeme ho stejnou specificitou plus "body",
 * at nemusime sahat po !important.
 */
body .mcb-section .mcb-wrap [class*="mcb-item-"] .column_attr a {
	color: var(--acjc-accent-ink, #c85a00);
}