/* ==========================================================================
   claude.css
   Vlastní styly nad rámec původních šablon (drženy odděleně záměrně).
   ========================================================================== */

/* --------------------------------------------------------------------------
   Crossroad – varianta pro skupiny s vlastní sekcí (groups.section > 0),
   např. "Yokohama USA".
   -------------------------------------------------------------------------- */

/* Hlavní logo Yokohama TWS – pouze obrázek, není proklik. */
.crossroad-custom .crossroad-custom-main {
	cursor: default;
}

/* Jedno klikací logo sekce pod hlavním logem. */
.crossroad-custom .crossroad-custom-section {
	display: inline-block;
	margin-top: 20px;
}

.crossroad-custom .crossroad-custom-section img {
	width: 100%;
	max-width: 500px;
	height: auto;
}

/* --------------------------------------------------------------------------
   Tlačítka – pouze pro skupiny s vlastní sekcí (body.custom-section, např.
   Yokohama USA). Výchozí stav černý, hover a active červený.
   Odstín se mění na jednom místě níže (--claude-btn-active).
   -------------------------------------------------------------------------- */

body.custom-section {
	--claude-btn-default: #000;
	--claude-btn-active: #bb2e31;
}

/* Tlačítka .button (vyhledávání, košík, odeslání formulářů, …) */
body.custom-section .button,
body.custom-section input.button {
	background-color: var(--claude-btn-default);
	background-image: none;
	color: #fff;
}

body.custom-section .button:hover,
body.custom-section .button:focus,
body.custom-section .button:active,
body.custom-section input.button:hover,
body.custom-section input.button:focus,
body.custom-section input.button:active {
	background-color: var(--claude-btn-active);
	background-image: none;
	color: #fff;
}

/* Levé menu kategorií (All / Give-aways / Clothing) */
body.custom-section ul.menuLeft li a {
	background: var(--claude-btn-default);
	color: #fff;
}

body.custom-section ul.menuLeft li a.active,
body.custom-section ul.menuLeft li a:hover {
	background: var(--claude-btn-active);
	color: #fff;
}

/* Horní menu – výchozí stav položek (černé), aktivní / hover červené */
body.custom-section #header nav ul li a {
	background: var(--claude-btn-default);
	color: #fff;
}

body.custom-section #header nav ul a.active,
body.custom-section #header nav ul a:hover {
	background: var(--claude-btn-active);
	color: #fff;
}