/**
 * Printchart – design tokeny.
 *
 * Zdrojem pravdy je theme.json (generuje --wp--preset--* a --wp--custom--*).
 * Tento soubor přidává jen krátké aliasy --pc-*, které mohou používat
 * vlastní bloky pluginu printchart-custom-blocks bez závislosti na
 * dlouhých názvech WP proměnných.
 *
 * Vytaženo z Figma exportů (styleguide.svg, header.svg, login.svg,
 * layout-obecne.svg, tables.svg) – viz README.md.
 */

:root {
	/* --- Barvy značky --- */
	--pc-color-dark-teal: var( --wp--preset--color--dark-teal, #037e62 );
	--pc-color-teal: var( --wp--preset--color--teal, #06ab86 );
	--pc-color-teal-light: var( --wp--preset--color--teal-light, #cbf3ea );
	--pc-color-dark-orange: var( --wp--preset--color--dark-orange, #b24a00 );
	--pc-color-orange: var( --wp--preset--color--orange, #ff7817 );
	--pc-color-light-orange: var( --wp--preset--color--light-orange, #f7e2d3 );
	--pc-color-orange-contrast: var( --pc-color-orange );

	/* --- Barvy: obsah --- */
	--pc-color-font-dark: var( --wp--preset--color--font-dark, #131718 );
	--pc-color-font-body: var( --wp--preset--color--font-body, #3c4446 );
	--pc-color-icons: var( --wp--preset--color--icons, #757d87 );
	--pc-color-white: var( --wp--preset--color--white, #ffffff );

	/* --- Barvy: linky a plochy --- */
	--pc-color-grey-medium: var( --wp--preset--color--grey-medium, #c3ced9 );
	--pc-color-grey-light: var( --wp--preset--color--grey-light, #e1e6ea );
	--pc-color-grey-faint: var( --wp--preset--color--grey-faint, #f1f2f3 );
	--pc-color-grey-zebra: var( --wp--preset--color--grey-zebra, #f7f7f8 );

	/* --- Barvy: stavy --- */
	--pc-color-error: var( --wp--preset--color--error, #ed1c24 );
	--pc-color-error-bg: var( --wp--preset--color--error-light, #ffe6e6 );
	--pc-color-success: var( --pc-color-teal );

	/* --- Sémantické role --- */
	--pc-bg-page: var( --pc-color-grey-faint );
	--pc-bg-surface: var( --pc-color-white );
	--pc-bg-control: var( --pc-color-grey-faint );
	--pc-border-color: var( --pc-color-grey-medium );
	--pc-border-color-subtle: var( --pc-color-grey-light );
	--pc-divider-color: #d9d9d9;

	/* --- Typografie --- */
	--pc-font-family: var(
		--wp--preset--font-family--inter,
		Inter,
		-apple-system,
		BlinkMacSystemFont,
		'Segoe UI',
		Roboto,
		'Helvetica Neue',
		Arial,
		sans-serif
	);
	--pc-font-size-xxs: var( --wp--preset--font-size--xx-small, 10px );
	--pc-font-size-xs: var( --wp--preset--font-size--x-small, 11px );
	--pc-font-size-sm: var( --wp--preset--font-size--small, 12px );
	--pc-font-size-base: var( --wp--preset--font-size--medium, 13px );
	--pc-font-size-lg: var( --wp--preset--font-size--large, 15px );
	--pc-font-size-xl: var( --wp--preset--font-size--x-large, 21px );

	--pc-line-height-base: 21px;
	--pc-line-height-tight: 1.25;
	--pc-paragraph-gap: 10px;

	--pc-font-weight-regular: 400;
	--pc-font-weight-medium: 500;
	--pc-font-weight-semibold: 600;
	--pc-font-weight-bold: 700;

	/* --- Odstupy --- */
	--pc-space-1: 4px;
	--pc-space-2: 8px;
	--pc-space-3: 10px;
	--pc-space-4: 12px;
	--pc-space-5: 16px;
	--pc-space-6: 20px;
	--pc-space-7: 32px;
	--pc-space-8: 40px;

	/* --- Rámečky a zaoblení --- */
	--pc-radius-sm: 2px;
	--pc-radius: 4px;
	--pc-radius-pill: 999px;
	--pc-border-width: 1px;
	--pc-border: var( --pc-border-width ) solid var( --pc-border-color );
	--pc-border-subtle: var( --pc-border-width ) solid var( --pc-border-color-subtle );

	/* --- Stíny --- */
	--pc-shadow-control: 0 3px 3px rgba( 219, 233, 255, 0.16 );

	/* --- Rozměry ovládacích prvků --- */
	--pc-control-height: 46px;
	--pc-control-height-lg: 58px;
	--pc-control-height-md: 38px;
	--pc-control-height-sm: 36px;
	--pc-control-height-xs: 29px;
	--pc-control-padding-inline: 12px;
	--pc-icon-button-size: 36px;
	--pc-radio-size: 23px;
	--pc-checkbox-size: 20px;
	--pc-toggle-width: 62px;
	--pc-toggle-height: 36px;
	--pc-clear-size: 24px;

	/* --- Rozvržení formulářů --- */
	--pc-field-label-width: 205px;
	--pc-field-input-width: 261px;
	--pc-field-select-width: 295px;
	--pc-field-row-gap: 20px;
	--pc-field-row-pitch: 66px;

	/* --- Rozvržení --- */
	--pc-header-height: 60px;
	--pc-header-bg: var( --pc-color-white );
	--pc-header-bg-brand: var( --pc-color-dark-teal );
	--pc-header-text-brand: var( --pc-color-white );
	--pc-tab-indicator-height: 2px;
	--pc-overlay-bg: rgba( 0, 0, 0, 0.8 );
	--pc-layout-gutter: 20px;
	--pc-layout-width: 1280px;
	--pc-card-padding: 20px;
	--pc-card-radius: var( --pc-radius );

	/* --- Tabulky --- */
	--pc-table-row-height: 33px;
	--pc-table-head-height: 32px;
	--pc-table-cell-padding-inline: 8px;
	--pc-table-zebra: var( --pc-color-grey-zebra );
}

body {
	background-color: var( --pc-bg-page );
	color: var( --pc-color-font-body );
	font-family: var( --pc-font-family );
	font-size: var( --pc-font-size-base );
	line-height: var( --pc-line-height-base );
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/**
 * Základní layout stránky.
 *
 * WordPress dává blokům nejvyšší úrovně (header / main / footer) horní mezeru
 * podle `blockGap`. U celoplošných sekcí tím prosvítá pozadí stránky jako světlý
 * pruh — proto ji na této úrovni rušíme; uvnitř obsahu blockGap funguje dál.
 */
.wp-site-blocks > * {
	margin-block-start: 0;
}

/* Patička drží u spodního okraje i na krátkých stránkách. */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.wp-site-blocks > main {
	flex: 1 0 auto;
}