/*
Theme Name: KOSLEMA
Theme URI: https://koslema.cz
Author: Jakub Samek
Description: Jednoduchá bloková šablona pro Kosmetické studio KOSLEMA. Bez pluginů, vše se upravuje v editoru bloků (Vzhled → Editor).
Version: 1.2.0-beta
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GPLv2 or later
Text Domain: koslema
*/

/* Barvy, písma a rozměry jsou v theme.json. Tady jsou jen věci, které theme.json neumí. */

:root {
	--k-stin: 0 18px 40px -22px rgb(59 26 51 / .35);
	--k-oblouk: 999px 999px 22px 22px;
	--k-zaobleni: 22px;
}

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:where(.wp-site-blocks) :focus-visible { outline: 3px solid var(--wp--preset--color--ruzova); outline-offset: 2px; }
.wp-site-blocks > * + * { margin-block-start: 0; }
img { height: auto; }

/* ---------- Záhlaví ---------- */
.hlavicka {
	position: sticky;
	top: 0;
	z-index: 50;
	isolation: isolate;
	border-bottom: 1px solid var(--wp--preset--color--okraj);
}
/* rozmazané pozadí přes pseudo-prvek: backdrop-filter přímo na záhlaví by uvěznil
   mobilní menu (position: fixed) do výšky záhlaví */
.hlavicka::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgb(255 255 255 / .94);
	-webkit-backdrop-filter: saturate(1.4) blur(10px);
	backdrop-filter: saturate(1.4) blur(10px);
}
.admin-bar .hlavicka { top: var(--wp-admin--admin-bar--height, 0); }
.hlavicka-obsah { min-height: 82px; gap: 28px; }

.znacka { display: inline-flex; flex-direction: column; text-decoration: none !important; line-height: 1; }
.znacka-slovo {
	font: 800 31px/1 var(--wp--preset--font-family--text);
	letter-spacing: .02em;
	color: var(--wp--preset--color--svestka);
}
.znacka-slovo span { color: var(--wp--preset--color--ruzova); }
.znacka-popis {
	margin-top: 6px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--tlumena);
}

.hlavni-menu { flex: 1; }
.hlavni-menu .wp-block-navigation-item__content { padding: 8px 4px; text-decoration: none; color: var(--wp--preset--color--svestka); }
.hlavni-menu .wp-block-navigation-item__content:hover,
.hlavni-menu .current-menu-item > .wp-block-navigation-item__content,
.hlavni-menu .current-menu-ancestor > .wp-block-navigation-item__content { color: var(--wp--preset--color--malina); }
.hlavni-menu .wp-block-navigation__container { gap: 26px; }
.hlavni-menu .wp-block-navigation__submenu-container {
	min-width: 270px !important;
	padding: 10px !important;
	border: 1px solid var(--wp--preset--color--okraj) !important;
	border-radius: 16px;
	box-shadow: var(--k-stin);
}
.hlavni-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 9px 12px; border-radius: 10px; font-weight: 500; }
.hlavni-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--pudr); }

/* tlačítko s telefonem */
.wp-block-button.is-style-telefon .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	white-space: nowrap;
	padding: .72em 1.25em;
}
.wp-block-button.is-style-telefon .wp-block-button__link::before {
	content: "";
	width: 17px;
	height: 17px;
	flex: none;
	background: currentColor;
	-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 10.8a15.2 15.2 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%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 10.8a15.2 15.2 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wp-block-button.is-style-outline .wp-block-button__link { border: 2px solid currentColor; background: transparent; color: var(--wp--preset--color--malina); }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--malina); color: #fff; border-color: var(--wp--preset--color--malina); }

/* ---------- Záhlaví podstránek ---------- */
.zahlavi-stranky { background: var(--wp--preset--color--pudr); }
.zahlavi-stranky .wp-block-post-title { margin: 0; }
.nadrazena a { color: var(--wp--preset--color--tlumena); text-decoration: none; font-size: 15px; }
.nadrazena a:hover { color: var(--wp--preset--color--malina); text-decoration: underline; }

.stranka-mrizka {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: clamp(32px, 5vw, 72px);
	align-items: start;
}
.stranka-mrizka > * { margin: 0 !important; max-width: none !important; }
.stranka-obsah > .wp-block-post-content > * { max-width: 780px; }
.stranka-obsah > .wp-block-post-content > .alignwide { max-width: none; }

/* boční panel Objednávky */
.objednavky {
	position: sticky;
	top: 110px;
	padding: 26px 24px !important;
	background: var(--wp--preset--color--pudr);
	border-radius: 24px;
	font-size: 15px;
}
.objednavky h2 { font-size: 26px !important; margin: 0 0 6px; }
.objednavky .wp-block-buttons { margin-top: 18px; }

/* telefony a otevírací doba (synchronizované vzory) */
.telefony p { margin: 0 0 10px; line-height: 1.35; }
.telefony a { font-size: 21px; font-weight: 700; color: var(--wp--preset--color--malina); text-decoration: none; white-space: nowrap; }
.telefony a:hover { text-decoration: underline; }
.telefony span, .telefony small { display: block; font-size: 14px; color: var(--wp--preset--color--tlumena); }

.wp-block-table.is-style-hodiny { margin: 0; font-size: 15px; }
.wp-block-table.is-style-hodiny table { border-collapse: collapse; width: 100%; }
.wp-block-table.is-style-hodiny td { border: 0; border-bottom: 1px solid var(--wp--preset--color--okraj); padding: 7px 0; }
.wp-block-table.is-style-hodiny td:first-child { font-weight: 650; color: var(--wp--preset--color--svestka); }
.wp-block-table.is-style-hodiny td:last-child { text-align: right; }
.pozn { font-size: 14px; color: var(--wp--preset--color--tlumena); }

/* ---------- Obsah stránek ---------- */
.wp-block-post-content h2 { margin-top: 1.6em; }
.wp-block-post-content :where(h3, h4) { margin-top: 1.5em; margin-bottom: .3em; }
.wp-block-post-content :where(ul, ol) { padding-left: 1.2em; }
.wp-block-post-content li::marker { color: var(--wp--preset--color--ruzova); }
.wp-block-post-content .wp-block-image img { border-radius: 14px; }
.wp-block-post-content .wp-block-image.alignleft { margin-right: 1.6em; }
.wp-block-post-content .wp-block-image.alignright { margin-left: 1.6em; }

/* obrázek ve tvaru zrcadla */
.wp-block-image.is-style-oblouk img {
	border-radius: var(--k-oblouk) !important;
	border: 10px solid #fff;
	box-shadow: var(--k-stin);
	aspect-ratio: 4 / 5;
	object-fit: cover;
}

/* ceníky */
.wp-block-table.is-style-cenik { margin-block: 0 2.2em; }
.wp-block-table.is-style-cenik table { border-collapse: collapse; width: 100%; font-size: 16px; }
.wp-block-table.is-style-cenik td { border: 0; border-bottom: 1px solid var(--wp--preset--color--okraj); padding: 13px 4px; vertical-align: top; }
.wp-block-table.is-style-cenik td:last-child { text-align: right; white-space: nowrap; font-weight: 700; color: var(--wp--preset--color--malina); padding-left: 18px; }
.wp-block-table.is-style-cenik td strong { color: var(--wp--preset--color--svestka); }
.wp-block-table.is-style-cenik tr:hover td { background: var(--wp--preset--color--pudr); }
.platnost { font-size: 15px; color: var(--wp--preset--color--tlumena); }

/* katalog – karty produktů (Média a text) */
.wp-block-media-text.is-style-produkt {
	grid-template-columns: 170px minmax(0, 1fr) !important;
	gap: 0;
	margin-block: 0 18px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--okraj);
	border-radius: var(--k-zaobleni);
	overflow: hidden;
}
.wp-block-media-text.is-style-produkt .wp-block-media-text__media {
	align-self: stretch;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 18px;
	background: var(--wp--preset--color--pudr);
}
.wp-block-media-text.is-style-produkt .wp-block-media-text__media img { width: 100%; max-width: 134px; height: auto; mix-blend-mode: multiply; border-radius: 8px; }
.wp-block-media-text.is-style-produkt .wp-block-media-text__content { padding: 20px 24px; }
.wp-block-media-text.is-style-produkt .wp-block-media-text__content > :first-child { margin-top: 0; }
.wp-block-media-text.is-style-produkt :where(h2, h3, h4) { font-family: var(--wp--preset--font-family--text); font-size: 19px; font-weight: 700; margin: 0 0 .4em; }
.wp-block-media-text.is-style-produkt p { margin: 0 0 .5em; }

/* galerie */
.wp-block-gallery.has-nested-images figure.wp-block-image img { border-radius: 18px; aspect-ratio: 4 / 5; object-fit: cover; }

/* karty služeb na úvodu */
.wp-block-group.is-style-karta {
	height: 100%;
	padding: 0 0 22px !important;
	background: #fff;
	border: 1px solid var(--wp--preset--color--okraj);
	border-radius: var(--k-zaobleni);
	overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease;
}
.wp-block-group.is-style-karta:hover { transform: translateY(-3px); box-shadow: var(--k-stin); }
.wp-block-group.is-style-karta > :not(.wp-block-image) { padding-inline: 22px; }
.wp-block-group.is-style-karta .wp-block-image { margin: 0 0 16px; }
.wp-block-group.is-style-karta .wp-block-image img { border-radius: 0; aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.wp-block-group.is-style-karta h3 { margin: 0 0 6px; }
.wp-block-group.is-style-karta h3 a { color: var(--wp--preset--color--svestka); text-decoration: none; }
.wp-block-group.is-style-karta h3 a::after { content: ""; position: absolute; inset: 0; }
.wp-block-group.is-style-karta { position: relative; }
.wp-block-group.is-style-karta p { margin: 0; font-size: 15.5px; color: var(--wp--preset--color--tlumena); }
.sluzby .wp-block-columns { gap: 22px; }

/* úvodní blok */
.uvodni h1 strong { display: block; color: var(--wp--preset--color--malina); font-weight: 600; }
.uvodni-popis { font-size: var(--wp--preset--font-size--large); max-width: 34em; }
.oceneni { list-style: none; padding: 0 !important; margin: 0; display: grid; gap: 8px; font-size: 15px; color: var(--wp--preset--color--tlumena); }
.oceneni li { position: relative; padding-left: 26px; }
.oceneni li::before { content: ""; position: absolute; left: 0; top: .38em; width: 14px; height: 14px; border-radius: 50%; border: 3px solid var(--wp--preset--color--ruzova); }
.oceneni li::marker { content: ""; }

/* aktuality (výpis) */
.aktuality-mrizka .wp-block-post { background: #fff; border: 1px solid var(--wp--preset--color--okraj); border-radius: var(--k-zaobleni); overflow: hidden; }
.aktuality-mrizka .wp-block-post > :not(.wp-block-post-featured-image) { padding-inline: 20px; }
.aktuality-mrizka .wp-block-post > :last-child { padding-bottom: 20px; }
.aktuality-mrizka .wp-block-post-featured-image { margin: 0 0 14px; }
.aktuality-mrizka .wp-block-post-featured-image img { aspect-ratio: 4 / 3; object-fit: cover; }
.aktuality-mrizka .wp-block-post-title { font-family: var(--wp--preset--font-family--text); font-size: 19px; font-weight: 700; margin: 0 0 6px; }
.aktuality-mrizka .wp-block-post-title a { color: var(--wp--preset--color--svestka); text-decoration: none; }
.aktuality-mrizka .wp-block-post-date { font-size: 14px; color: var(--wp--preset--color--tlumena); }
.aktuality-mrizka .wp-block-post-excerpt { font-size: 15.5px; }
.aktuality-mrizka .wp-block-post-excerpt__more-text { margin-top: .4em; }

/* ---------- Zápatí ---------- */
.paticka { color: #ecd8e7; font-size: 15px; }
.paticka a { color: #fff; }
.paticka a:hover { color: var(--wp--preset--color--pudr-tmavsi); }
.paticka h2 { color: #fff; font-size: 22px !important; margin: 0 0 14px; }
.paticka .znacka-slovo { color: #fff; }
.paticka .znacka-slovo span { color: #e07cc6; }
.paticka .znacka-popis { color: #c9a9c0; }
.paticka .telefony a { color: #fff; font-size: 18px; }
.paticka .telefony span { color: #c9a9c0; }
.paticka .wp-block-table.is-style-hodiny td { border-bottom-color: rgb(255 255 255 / .14); }
.paticka .wp-block-table.is-style-hodiny td:first-child { color: #fff; }
.paticka .pozn, .paticka-spodek { color: #c9a9c0; }
.paticka-odkazy .wp-block-navigation-item__content { padding: 3px 0; text-decoration: none; }
.paticka-spodek { border-top: 1px solid rgb(255 255 255 / .14); font-size: 13px; }

/* ---------- Tablety a mobily ---------- */
@media (max-width: 1100px) {
	.hlavni-menu .wp-block-navigation__container { gap: 18px; }
}
@media (max-width: 960px) {
	.stranka-mrizka { grid-template-columns: 1fr; }
	.objednavky { position: static; }
}
@media (max-width: 781px) {
	.hlavicka-obsah { min-height: 66px; gap: 12px; }
	.znacka-slovo { font-size: 26px; }
	.znacka-popis { font-size: 10.5px; }
	.hlavni-menu { flex: 0 0 auto; order: 3; }
	.hlavicka .wp-block-button.is-style-telefon .wp-block-button__link { padding: 11px; font-size: 0; gap: 0; }
	.hlavicka .wp-block-button.is-style-telefon .wp-block-button__link::before { width: 19px; height: 19px; }
	.wp-block-media-text.is-style-produkt { grid-template-columns: 1fr !important; }
	.wp-block-media-text.is-style-produkt .wp-block-media-text__media { padding: 14px; }
	.wp-block-media-text.is-style-produkt .wp-block-media-text__media img { max-width: 120px; }
	.uvodni .wp-block-column:last-child { order: -1; }
	.wp-block-image.is-style-oblouk { max-width: 300px; margin-inline: auto; }
	.wp-block-post-content .wp-block-image.alignleft, .wp-block-post-content .wp-block-image.alignright { max-width: 42%; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

/* logo jako odstavec s odkazem */
.znacka-blok { margin: 0 !important; line-height: 1; }
.uvodni .wp-block-buttons { margin-block: 26px 22px; }
.stranka-obsah > .wp-block-post-content > .wp-block-media-text.is-style-produkt,
.stranka-obsah > .wp-block-post-content > .wp-block-gallery { max-width: none; }

/* mobilní menu přes celou obrazovku */
.hlavni-menu .wp-block-navigation__responsive-container.is-menu-open { padding: 22px 24px 40px; }
.hlavni-menu .is-menu-open .wp-block-navigation__responsive-container-content,
.hlavni-menu .is-menu-open .wp-block-navigation__container { align-items: flex-start !important; gap: 0 !important; width: 100%; }
.hlavni-menu .is-menu-open .wp-block-navigation-item { width: 100%; align-items: flex-start !important; border-bottom: 1px solid var(--wp--preset--color--pudr-tmavsi); }
.hlavni-menu .is-menu-open .wp-block-navigation-item__content { font-size: 19px; padding: 13px 0 !important; }
.hlavni-menu .is-menu-open .wp-block-navigation__submenu-container { border: 0 !important; box-shadow: none; padding: 0 0 8px 16px !important; min-width: 0 !important; }
.hlavni-menu .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { border-bottom: 0; }
.hlavni-menu .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-size: 16px; padding: 8px 0 !important; font-weight: 500; }
@media (max-width: 781px) {
	.hlavicka-obsah { justify-content: flex-start !important; }
	.hlavicka-obsah > .wp-block-buttons { margin-left: auto; }
}
/* galerie: i jediná fotka v řadě zůstane ve velikosti sloupce */
.wp-block-gallery.has-nested-images figure.wp-block-image { flex-grow: 0; }

/* mimořádné oznámení (vzor) */
.oznameni p { margin: 0; color: #fff; }
.oznameni a { color: #fff; }
.oznameni .wp-block-button.is-style-outline .wp-block-button__link { color: #fff; border-color: rgb(255 255 255 / .7); padding: .5em 1.2em; }
.oznameni .wp-block-button.is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--svestka); }

/* kontakt */
.wp-block-separator.is-style-wide { margin-block: 2.6em; border-top-width: 1px; }
.paticka-spodek a { margin-left: 14px; }

/* rozcestníky – přehled podstránek jako dlaždice */
.wp-block-page-list.dlazdice { list-style: none; padding: 0 !important; margin: 2em 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.wp-block-page-list.dlazdice li { margin: 0; }
.wp-block-page-list.dlazdice li::marker { content: ""; }
.wp-block-page-list.dlazdice a {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 100%; min-height: 62px;
	padding: 14px 20px; background: var(--wp--preset--color--pudr); border: 1px solid transparent; border-radius: 16px;
	color: var(--wp--preset--color--svestka); font-weight: 650; text-decoration: none;
}
.wp-block-page-list.dlazdice a::after { content: "›"; color: var(--wp--preset--color--ruzova); font-size: 24px; line-height: 1; }
.wp-block-page-list.dlazdice a:hover { border-color: var(--wp--preset--color--ruzova); background: #fff; color: var(--wp--preset--color--malina); }

/* karty služeb v mřížce 3 × 2 */
.sluzby-mrizka > .wp-block-group.is-style-karta { margin: 0 !important; }
.wp-block-group.is-style-karta .wp-block-image { margin: 0 0 16px !important; }