/* =========================================================================
   Bran – design vrstva

   Firemní paleta Pro-idea (proidea.digital): zelená #1ab161, grafitový text
   #404040, plochy #f7f7f7. Zelený navigační sloupec, bílé sekce s hlavičkou,
   souhrnná čísla jako karty nad tabulkou.
   Načítá se jako poslední a přebíjí modern.css / themes/*.css / custom.css.
   Tmavý režim je v html[data-theme="dark"].
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Tokeny
   ------------------------------------------------------------------------- */

:root {
	--font-ui: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	--font-num: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace;

	/* plochy */
	--c-bg: #f7f7f7;
	--c-surface: #ffffff;
	--c-surface-2: #f7faf8;
	--c-surface-3: #eef0ef;
	--c-head: #fbfbfb;

	/* linky */
	--c-line: #e3e3e3;
	--c-line-strong: #d2d4d3;

	/* jemné podbarvení bloku uvnitř tabulky */
	--c-tint: rgba(16, 58, 44, 0.022);

	/* text – grafitová z firemního webu */
	--c-text: #404040;
	--c-text-muted: #7c828a;
	--c-text-soft: #9fa5ac;

	/* akcent – firemní zelená */
	--c-accent: #1ab161;
	--c-accent-hover: #158460;
	--c-accent-soft: #e8f6ee;
	--c-accent-line: #a9dfc4;
	/* pruh tabulky nad podbarveným panelem – světlejší než podklad */
	--c-stripe-on-tint: rgba(255, 255, 255, 0.45);

	/* stavy */
	--c-ok: #158460;
	--c-ok-soft: #e8f6ee;
	--c-warn: #b45309;
	--c-warn-soft: #fdf1de;
	--c-danger: #d0342c;
	--c-danger-soft: #fdeceb;
	--c-info: #2563a5;
	--c-info-soft: #e7effa;
	--c-info-line: #b3ccea;
	--c-teal: #0f8a99;
	--c-teal-soft: #e2f4f6;
	--c-teal-line: #a8dbe2;
	--c-purple: #6d4aa8;
	--c-purple-soft: #efe9f9;
	--c-purple-line: #c7b6e6;
	--c-orange: #c2610a;
	--c-orange-soft: #fdeedc;
	--c-orange-line: #f2c99b;
	/* srdíčko u jídla – paprika, aby se nepletlo s chybovou červenou */
	--c-heart: #d9532b;
	--c-heart-soft: #fbe9e3;
	/* avatary bez fotky – osm barev, každý člověk má svou podle jména */
	--c-avatar-1: #1a8f57;
	--c-avatar-2: #2f6f9f;
	--c-avatar-3: #b8862b;
	--c-avatar-4: #7a4fa3;
	--c-avatar-5: #c2482f;
	--c-avatar-6: #2e8f8a;
	--c-avatar-7: #5b6b76;
	--c-avatar-8: #a04a7a;

	/* navigace – hluboká zelená odvozená z firemní #158460 */
	--c-nav-bg: #103a2c;
	--c-nav-bg-2: #17513c;
	--c-nav-line: #1c5a43;
	--c-nav-text: #a3c4b6;
	--c-nav-text-active: #ffffff;

	/* topbar */
	--c-top-bg: #ffffff;
	--c-top-line: #e3e3e3;
	--c-top-text: #545a61;

	--r-sm: 5px;
	--r: 7px;
	--r-lg: 9px;
	--r-pill: 999px;

	--sidebar-w: 206px;
	--sidebar-w-small: 56px;
	--topbar-h: 50px;

	--ring: 0 0 0 3px rgba(37, 99, 235, 0.25);
	--ring-danger: 0 0 0 3px rgba(208, 52, 44, 0.22);
	--shadow-pop: 0 6px 24px rgba(16, 22, 34, 0.10), 0 1px 3px rgba(16, 22, 34, 0.06);
}

html[data-theme="dark"] {
	--c-bg: #121614;
	--c-surface: #191e1b;
	--c-surface-2: #1f2521;
	--c-surface-3: #272e29;
	--c-head: #1f2521;

	--c-line: #2a312d;
	--c-line-strong: #3b443e;

	--c-tint: rgba(255, 255, 255, 0.025);

	--c-text: #e5e8e6;
	--c-text-muted: #98a09b;
	--c-text-soft: #78807b;

	--c-accent: #22c46e;
	--c-accent-hover: #3ad884;
	--c-accent-soft: #17352a;
	--c-accent-line: #2b6b4d;
	--c-stripe-on-tint: rgba(255, 255, 255, 0.04);

	--c-ok: #5fd39a;
	--c-ok-soft: #17352a;
	--c-warn: #d99a44;
	--c-warn-soft: #2e2415;
	--c-danger: #ef6f66;
	--c-danger-soft: #2f1b1a;
	--c-info: #7bb0ec;
	--c-info-soft: #16263a;
	--c-info-line: #2c4a72;
	--c-teal: #56c8d8;
	--c-teal-soft: #12333a;
	--c-teal-line: #23606c;
	--c-purple: #b199e8;
	--c-purple-soft: #241c3b;
	--c-purple-line: #453873;
	--c-orange: #e8994a;
	--c-orange-soft: #33230f;
	--c-orange-line: #6a4a1e;
	--c-heart: #f0714a;
	--c-heart-soft: #3a2119;
	--c-avatar-1: #2aa86b;
	--c-avatar-2: #4a8fc4;
	--c-avatar-3: #cfa04a;
	--c-avatar-4: #9a72c4;
	--c-avatar-5: #d9664c;
	--c-avatar-6: #45aaa4;
	--c-avatar-7: #7d8d98;
	--c-avatar-8: #bf6a9a;

	--c-nav-bg: #0b1f18;
	--c-nav-bg-2: #123024;
	--c-nav-line: #17402f;
	--c-nav-text: #8faea1;

	--c-top-bg: #191e1b;
	--c-top-line: #2a312d;
	--c-top-text: #c2c9c5;

	--shadow-pop: 0 8px 28px rgba(0, 0, 0, 0.5);
}

/* -------------------------------------------------------------------------
   2. Základ a typografie
   ------------------------------------------------------------------------- */

html, body { background: var(--c-bg); }

body {
	font-family: var(--font-ui);
	font-size: 13px;
	line-height: 1.45;
	color: var(--c-text);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: inherit;
	color: var(--c-text);
	font-weight: 600;
	letter-spacing: -0.01em;
}

p { color: inherit; margin: 0 0 8px 0; font-size: 13px; }

a { color: var(--c-accent); transition: color 0.12s ease; }
a:hover, a:focus { color: var(--c-accent-hover); text-decoration: none; }

hr { border-color: var(--c-line); margin: 14px 0; }
small { color: var(--c-text-muted); font-size: 12px; }

::selection { background: var(--c-accent-soft); color: var(--c-text); }

.text-muted, .text-gray { color: var(--c-text-muted) !important; }
.text-dark-gray, .text-normal { color: var(--c-text) !important; }
.text-soft { color: var(--c-text-soft) !important; }
.text-success { color: var(--c-ok) !important; }
.text-danger { color: var(--c-danger) !important; }
.text-warning { color: var(--c-warn) !important; }
.text-info, .text-primary { color: var(--c-accent) !important; }

/* čísla drží sloupec */
.table td,
.table th,
.form-control,
.badge, .label {
	font-variant-numeric: tabular-nums;
	font-feature-settings: 'tnum' 1;
}

/* -------------------------------------------------------------------------
   3. Layout
   ------------------------------------------------------------------------- */

.page-content,
.content-wrap { background: var(--c-nav-bg); }

.page-inner {
	background: var(--c-bg) !important;
	padding-bottom: 0 !important;
	min-height: calc(100vh - var(--topbar-h));
}

body.page-header-fixed .page-inner { padding-top: var(--topbar-h) !important; }

#main-wrapper { padding: 16px 20px 20px 20px; }

.page-title {
	background: transparent;
	border-bottom: none;
	padding: 18px 20px 0 20px;
}

.page-title h3 {
	font-size: 18px;
	font-weight: 600;
	color: var(--c-text);
	margin: 0;
	letter-spacing: -0.02em;
}

/* -------------------------------------------------------------------------
   4. Horní lišta
   ------------------------------------------------------------------------- */

.navbar {
	background: var(--c-top-bg);
	height: var(--topbar-h);
	min-height: var(--topbar-h);
	box-shadow: none;
	border-bottom: 1px solid var(--c-top-line);
	border-radius: 0;
}

.navbar .navbar-inner { height: var(--topbar-h); }

.navbar .logo-box {
	width: var(--sidebar-w);
	height: var(--topbar-h);
	background: var(--c-nav-bg);
	border-bottom: 1px solid var(--c-nav-bg);
}

.navbar .logo-box .logo-text {
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: #fff;
	text-align: left;
	padding: 0 0 0 18px;
	line-height: var(--topbar-h);
}

.navbar .logo-box a,
.navbar .logo-box a:hover,
.navbar .logo-box a:focus { color: #fff; text-decoration: none; }

.topmenu-outer {
	background: var(--c-top-bg);
	height: var(--topbar-h);
	margin-left: var(--sidebar-w);
}

.top-menu .navbar-nav > li { height: var(--topbar-h); }

.top-menu .navbar-nav > li > a {
	color: var(--c-top-text);
	height: var(--topbar-h);
	line-height: 1;
	padding: 17px 12px;
	border: none;
	border-radius: 0;
	font-size: 13px;
	transition: background 0.12s ease, color 0.12s ease;
}

.top-menu .navbar-nav > li > a:hover,
.top-menu .navbar-nav > li > a:focus,
.top-menu .navbar-nav > li.open > a {
	background: var(--c-surface-3);
	color: var(--c-text);
}

.top-menu .navbar-nav > li > a i { font-size: 15px; }
.top-menu .navbar-nav > li > a .user-name { font-weight: 500; color: inherit; }
.top-menu .navbar-nav > li > a.log-out { color: var(--c-text-muted); }

.top-menu .navbar-nav > li > a .badge {
	position: absolute;
	top: 9px;
	right: 4px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	line-height: 16px;
	font-size: 10px;
	font-weight: 600;
	border-radius: var(--r-pill);
	background: var(--c-danger) !important;
	color: #fff !important;
	box-shadow: 0 0 0 2px var(--c-top-bg);
}

.theme-toggle { cursor: pointer; }
.theme-toggle .icon-dark { display: none; }
html[data-theme="dark"] .theme-toggle .icon-dark { display: inline-block; }
html[data-theme="dark"] .theme-toggle .icon-light { display: none; }

/* --- dropdowny ---------------------------------------------------------- */

.dropdown-menu {
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r);
	box-shadow: var(--shadow-pop);
	padding: 5px;
	margin-top: 4px;
	min-width: 200px;
}

.dropdown-menu::before,
.dropdown-menu::after { display: none !important; }

.dropdown-menu > li > a {
	color: var(--c-text);
	padding: 7px 10px;
	border-radius: var(--r-sm);
	font-size: 13px;
	border: none;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > li.active > a {
	background: var(--c-surface-3);
	color: var(--c-text);
}

.dropdown-menu > li > a i { width: 17px; margin-right: 7px; color: var(--c-text-soft); }
.dropdown-menu .divider { background: var(--c-line); margin: 5px 3px; }

.dropdown-lg { min-width: 310px; }

.dropdown-menu-list.tasks li a {
	display: block;
	padding: 9px 10px;
	border-radius: var(--r-sm);
	border-bottom: none;
	color: var(--c-text);
}

.dropdown-menu-list.tasks li a:hover { background: var(--c-surface-3); }
.dropdown-menu-list.tasks .task-details { margin: 0; font-size: 13px; color: var(--c-text); }

.dropdown-menu-list.tasks .task-icon {
	width: 7px;
	height: 7px;
	padding: 0;
	border-radius: 50%;
	display: inline-block;
	margin-right: 8px;
	vertical-align: middle;
}

.drop-title { color: var(--c-text-muted); padding: 12px 10px; margin: 0; font-size: 13px; background: transparent; border: none; }

.drop-all { border-top: 1px solid var(--c-line); margin-top: 4px; padding-top: 4px; background: transparent; }

.drop-all a {
	display: block;
	padding: 7px 10px;
	border-radius: var(--r-sm);
	font-size: 12.5px;
	font-weight: 500;
	color: var(--c-accent);
	background: transparent;
}

.drop-all a:hover { background: var(--c-accent-soft); }
.drop-all a i { margin-right: 6px; }
.drop-all.b-b { border-bottom: none; }

/* -------------------------------------------------------------------------
   5. Sidebar
   ------------------------------------------------------------------------- */

.sidebar, .page-sidebar, .menu,
.menu.accordion-menu, .sidebar-header { background: var(--c-nav-bg); }

.page-sidebar { width: var(--sidebar-w); }
.menu.accordion-menu { width: var(--sidebar-w); padding: 10px 10px 0 10px; }

.small-sidebar .page-sidebar { width: var(--sidebar-w-small); }
.small-sidebar .menu.accordion-menu { width: var(--sidebar-w-small); padding: 10px 6px 0 6px; }
.small-sidebar .navbar .logo-box { width: var(--sidebar-w-small); }
.small-sidebar .navbar .logo-box .logo-text { padding: 0; text-align: center; }
.small-sidebar .topmenu-outer { margin-left: var(--sidebar-w-small); }

.menu.accordion-menu > li { margin-bottom: 1px; }

.menu.accordion-menu > li > a {
	color: var(--c-nav-text);
	border: none !important;
	border-radius: var(--r-sm);
	padding: 7px 10px;
	font-size: 13px;
	font-weight: 500;
	display: flex;
	align-items: center;
	transition: background 0.12s ease, color 0.12s ease;
}

.menu.accordion-menu a span.menu-icon {
	width: 17px;
	margin-right: 10px;
	font-size: 14px;
	text-align: center;
	color: inherit;
	opacity: 0.9;
	flex: 0 0 auto;
}

.menu.accordion-menu > li > a > p {
	margin: 0;
	font-size: 13px;
	line-height: 19px;
	color: inherit;
	flex: 1 1 auto;
}

.menu.accordion-menu > li > a:hover,
.menu.accordion-menu > li > a:focus {
	background: var(--c-nav-bg-2);
	color: var(--c-nav-text-active);
	text-decoration: none;
}

.menu.accordion-menu > li.active > a,
.menu.accordion-menu > li.active.open > a,
.menu.accordion-menu > li.open > a {
	background: var(--c-nav-bg-2);
	color: var(--c-nav-text-active);
}

.menu.accordion-menu > li.active > a span.menu-icon { color: var(--c-accent); opacity: 1; }

.menu.accordion-menu > li > a > span.arrow { display: inline-block !important; margin-left: auto; opacity: 0.5; }

.menu.accordion-menu > li > a > span.arrow:before {
	content: '\f107';
	font-family: 'Font Awesome 5 Pro', 'Font Awesome 5 Free', FontAwesome;
	font-weight: 900;
	font-size: 11px;
}

.menu.accordion-menu > li.open > a > span.arrow:before { content: '\f106'; }

.menu.accordion-menu ul { background: transparent; padding: 1px 0 3px 0; }

.menu.accordion-menu ul li a {
	color: var(--c-nav-text);
	padding: 6px 10px 6px 37px;
	font-size: 12.5px;
	border-radius: var(--r-sm);
	border: none !important;
	position: relative;
}

.menu.accordion-menu ul li a:hover,
.menu.accordion-menu ul li.active a {
	background: var(--c-nav-bg-2);
	color: var(--c-nav-text-active);
	text-decoration: none;
}

.menu.accordion-menu ul li.active a::before {
	content: '';
	position: absolute;
	left: 21px;
	top: 50%;
	width: 4px;
	height: 4px;
	margin-top: -2px;
	border-radius: 50%;
	background: var(--c-accent);
}

.menu.accordion-menu > li.divider { background: transparent; height: 6px; border: none; margin: 0; }

.hover-menu:not(.page-horizontal-bar) .accordion-menu > li > ul {
	left: var(--sidebar-w);
	background: var(--c-nav-bg-2);
	border: 1px solid var(--c-nav-line);
	border-radius: var(--r);
	box-shadow: var(--shadow-pop);
	padding: 5px;
	min-width: 190px;
}

.hover-menu:not(.page-horizontal-bar) .accordion-menu > li > ul li a { padding-left: 10px; }
.hover-menu:not(.page-horizontal-bar) .accordion-menu > li > ul li.active a::before { display: none; }
.hover-menu:not(.page-horizontal-bar) .accordion-menu > li > a > span.arrow:before { content: '\f105'; }

.compact-menu .menu.accordion-menu > li > a { padding: 6px 10px; }
.small-sidebar .accordion-menu li a { padding: 9px 0; justify-content: center; }
.small-sidebar .accordion-menu li a span.menu-icon { margin-right: 0; }

.horizontal-bar,
.horizontal-bar .page-sidebar-inner,
.horizontal-bar .accordion-menu { background: var(--c-nav-bg); }
.horizontal-bar .accordion-menu { width: 100%; padding: 7px 14px; display: flex; }
.horizontal-bar .accordion-menu > li { margin: 0 2px; }

/* -------------------------------------------------------------------------
   6. Sekce (panel)
   ------------------------------------------------------------------------- */

.panel,
.panel-default, .panel-white, .panel-success, .panel-info,
.panel-warning, .panel-danger, .panel-primary, .panel-purple,
.panel-green, .panel-blue, .panel-yellow, .panel-red {
	background: var(--c-surface);
	border: 1px solid var(--c-line) !important;
	border-radius: var(--r-lg);
	box-shadow: none;
	margin-bottom: 14px;
}

.panel .panel-heading,
.panel-group .panel .panel-heading {
	background: transparent !important;
	color: var(--c-text) !important;
	border-bottom: 1px solid var(--c-line);
	border-radius: 0;
	padding: 11px 14px 10px 14px;
	height: auto;
	min-height: 0;
	position: relative;
}

.panel .panel-heading .panel-title {
	font-size: 13px;
	font-weight: 600;
	color: var(--c-text) !important;
	letter-spacing: -0.01em;
	line-height: 18px;
	padding: 0;
	text-transform: none;
}

.panel .panel-heading .panel-title::before { display: none; }
.panel .panel-heading .panel-title small { color: var(--c-text-muted); font-weight: 400; }

.panel .panel-body { background: var(--c-surface); padding: 14px !important; color: var(--c-text); }
.panel .panel-heading + .panel-body { padding-top: 12px !important; }

.panel .panel-heading .panel-control a { color: var(--c-text-soft); background: transparent; }
.panel .panel-heading .panel-control a:hover { color: var(--c-text); }

.panel-footer { background: var(--c-surface-2); border-top: 1px solid var(--c-line); color: var(--c-text-muted); border-radius: 0 0 var(--r-lg) var(--r-lg); }

/* -------------------------------------------------------------------------
   7. Tabulky – jen vodorovné linky, kompaktní řádky
   ------------------------------------------------------------------------- */

.table {
	background: transparent;
	margin-bottom: 0;
	border: none !important;
	color: var(--c-text);
	border-collapse: collapse;
	line-height: 1.4;
}

.table > thead > tr > th {
	background: var(--c-surface);
	border: none !important;
	border-bottom: 1px solid var(--c-line-strong) !important;
	color: var(--c-text-muted);
	font-weight: 500;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 0 10px 7px 10px !important;
	white-space: nowrap;
	vertical-align: bottom;
}

/* Řazení výpisu podle sloupce. Hlavička zůstane hlavičkou – že se na ni dá
   kliknout, prozradí až šipka; u neseřazeného sloupce je jen našeptaná, aby se
   z hlavičky nestala řada ikon. Stejné třídy dostávají i tabulky, které řadí
   JavaScript (reporty), ať to všude vypadá a chová se stejně. */
.sort-header {
	display: inline-flex;
	align-items: baseline;
	cursor: pointer;
	color: inherit !important;
	text-decoration: none !important;
}

.sort-header:hover,
.sort-header:focus { color: var(--c-accent) !important; }
.sort-header.is-sorted { color: var(--c-text) !important; }

.sort-header-icon {
	margin-left: 5px;
	font-size: 10px;
	opacity: 0.3;
}

.sort-header:hover .sort-header-icon { opacity: 0.65; }

.sort-header.is-sorted .sort-header-icon {
	opacity: 1;
	color: var(--c-accent);
}

.table > tbody > tr > td,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table td {
	border: none !important;
	border-bottom: 1px solid var(--c-line) !important;
	padding: 7px 10px !important;
	vertical-align: middle;
	color: var(--c-text);
	background: transparent;
}

/* výpis je uzavřený linkou i zespodu, ne jen mezi řádky */
.table > tbody > tr:last-child > td { border-bottom: 1px solid var(--c-line) !important; }

.table.table-compact > tbody > tr > td,
.table.table-compact > thead > tr > th,
.table.table-compact td { padding: 4px 8px !important; }

.table.table-small > tbody > tr > td,
.table.table-small > thead > tr > th,
.table.table-small td { font-size: 12px; }

.table-striped > tbody > tr:nth-of-type(odd),
.table-striped > tbody > tr:nth-of-type(even) { background: transparent; }

.table-hover > tbody > tr { transition: background 0.1s ease; }
.table-hover > tbody > tr:hover,
.table-hover > tbody > tr:hover > td { background: var(--c-surface-2); }

.table-white td { background: transparent; }
.table tr.selected, .table tr.selected > td { background: var(--c-accent-soft) !important; }
.table tr.b-t td { border-top: 1px solid var(--c-line-strong) !important; }

.table .disabled td,
.table .disabled td a,
.table .disabled td small { color: var(--c-text-soft); }

.table td span.gray, .table td small { color: var(--c-text-muted); }
.table td small.text-danger { color: var(--c-danger); }
.table .gift td { color: var(--c-accent); }

.table tr.row-yellow > td,
.table tr.total td,
.table tfoot tr td,
.table tr.info td,
.table tr.warning td {
	background: var(--c-surface-2) !important;
	font-weight: 600;
	border-top: 1px solid var(--c-line-strong) !important;
	color: var(--c-text);
}

.table tr.row-red td { background: var(--c-danger-soft) !important; }
.table tr.row-green td { background: var(--c-ok-soft) !important; }

/* akce */
.table .actions { text-align: right; white-space: nowrap; }

.table .actions a,
.table .actions span.far,
.table .actions span.fas {
	display: inline-block;
	width: 24px;
	height: 24px;
	line-height: 24px;
	text-align: center;
	border-radius: var(--r-sm);
	color: var(--c-text-soft);
	font-size: 12.5px;
	margin-left: 1px;
	transition: background 0.1s ease, color 0.1s ease;
}

.table .actions a.m-r-sm,
.table .actions span.m-r-sm { margin-right: 0 !important; }

/* tlačítko s popiskem není ikonová akce – čtvercových 24 px výš by z něj text
   vystrčilo ven z buňky */
.table .actions a.btn {
	width: auto;
	height: auto;
	line-height: 1.5;
	margin-left: 0;
	color: inherit;
}

.table .actions a:hover { background: var(--c-surface-3); color: var(--c-text); text-decoration: none; }
.table .actions a.fa-pencil:hover,
.table .actions a.row-as-link-target:hover { background: var(--c-accent-soft); color: var(--c-accent); }
.table .actions a.fa-trash:hover,
.table .actions a.with-confirm:hover { background: var(--c-danger-soft); color: var(--c-danger); }

.table .far, .table .fas { width: auto; }
.table .row-as-link td { cursor: pointer; }

/* řádek filtrů */
.table tr.filters { background: transparent; }

.table tr.filters td {
	border: none !important;
	border-bottom: 1px solid var(--c-line) !important;
	padding: 7px 4px 8px 4px !important;
	background: transparent;
}

.table tr.filters td:first-child { padding-left: 0 !important; }
.table tr.filters td:last-child { padding-right: 0 !important; }

/* dělicí linka až pod celou hlavičkou */
.table > thead > tr > th { border-bottom: 1px solid var(--c-line) !important; }
.table > thead > tr:last-child > th,
.table > thead > tr:last-child > td { border-bottom: 1px solid var(--c-line-strong) !important; }

.table tr.filters .form-control { height: 30px; padding: 4px 8px !important; font-size: 12.5px; }
.table tr.filters .btn { height: 30px; padding: 5px 10px; font-size: 12.5px; }
.table tr.filters .select2-container .select2-selection { height: 30px !important; }
.table tr.filters .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 28px !important; font-size: 12.5px; }
.table tr.filters .select2-container--default .select2-selection--single .select2-selection__arrow { height: 28px; }

.table.inline { background: transparent !important; margin: 4px 0 0 0 !important; }
.table.inline td { padding: 2px 4px !important; background: transparent !important; border: none !important; color: var(--c-text-muted); }
.table .table { border: none !important; background: transparent; }

.table > tbody > tr > td.tr-offset-2 { padding-left: 38px !important; }
.table > tbody > tr > td.tr-offset-3 { padding-left: 66px !important; }
.table > tbody > tr > td.tr-offset-4 { padding-left: 94px !important; }

.row-services td { border-color: var(--c-line) !important; }

.table-responsive { border: none; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.dataTables_wrapper { padding: 0; }

/* pevné šířky ze šablon nesmí tabulku roztáhnout přes okraj */
.table th > div[class*="w-"],
.table td > div[class*="w-"] { width: auto !important; min-width: 0; max-width: 100%; }

.table tr.filters .form-control,
.table tr.filters .select2-container,
.table tr.filters .btn { width: 100% !important; min-width: 0; max-width: 100%; }

/* hlavička a součet drží pozici u dlouhých výpisů */
.table > thead > tr > th { position: sticky; top: var(--topbar-h); z-index: 2; }
.table > tbody > tr.row-yellow > td,
.table > tfoot > tr > td { position: sticky; bottom: 0; z-index: 1; }

.table-responsive .table > thead > tr > th,
.table-responsive .table > tbody > tr.row-yellow > td,
.table-responsive .table > tfoot > tr > td { position: static; }

@media (min-width: 992px) {
	/* Sekce bez tabulky si ponechá ořez – jinak bílá výplň vnořeného
	   .panel-body přeteče přes zaoblený roh a ten vypadá useknutý.
	   U tabulek musí zůstat viditelný kvůli sticky hlavičce. */
	body:not(.page-horizontal-bar) .page-content,
	body:not(.page-horizontal-bar) .page-inner { overflow: visible; }

	body:not(.page-horizontal-bar) .panel { overflow: hidden; }
	body:not(.page-horizontal-bar) .panel:has(table) { overflow: visible; }
	/* panel oběda má u spodní hrany rozbalovací nabídku dnů – ořez by ji uřízl;
	   zaoblený roh drží .lunch-who vlastním rádiusem */
	body:not(.page-horizontal-bar) .panel.lunch-panel { overflow: visible; }

	/* `!important` u přetečení není zdobení: modern.css má na `.page-sidebar`
	   `overflow: visible !important` a bez stejné váhy se rolování neprosadí.
	   Sloupec je přitom fixní přes celou výšku okna, takže menu, které se do ní
	   nevejde, by jinak přetékalo mimo obrazovku a nedalo se k němu dostat. */
	body:not(.page-horizontal-bar) .page-sidebar {
		position: fixed;
		top: var(--topbar-h);
		left: 0;
		bottom: 0;
		padding-top: 0;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		z-index: 998;
	}

	/* Úzký proužek místo systémového posuvníku – ten by na tmavém sloupci
	   vypadal jako cizí těleso a ukrojil by z šířky položek. */
	body:not(.page-horizontal-bar) .page-sidebar::-webkit-scrollbar { width: 6px; }
	body:not(.page-horizontal-bar) .page-sidebar::-webkit-scrollbar-track { background: transparent; }

	body:not(.page-horizontal-bar) .page-sidebar::-webkit-scrollbar-thumb {
		background: rgba(255, 255, 255, 0.16);
		border-radius: 3px;
	}

	body:not(.page-horizontal-bar) .page-sidebar:hover::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.28); }

	body:not(.page-horizontal-bar) .page-sidebar {
		scrollbar-width: thin;
		scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
	}

	/* Účet visí u spodní hrany okna. Sidebar je fixní přes celou výšku, tak se
	   z něj udělá sloupec a poslední položku dolů odtlačí margin-top:auto.
	   Musí to být min-height, ne height: při dlouhém menu by se do boxu pevné
	   výšky obsah nevešel a přetekl by přes připnutou položku – takhle box
	   naroste, účet sjede na konec a scrolluje se k němu. */
	body:not(.page-horizontal-bar) .page-sidebar .page-sidebar-inner {
		height: auto !important;
		min-height: 100%;
		display: flex;
		flex-direction: column;
	}

	body:not(.page-horizontal-bar) .page-sidebar .menu.accordion-menu {
		flex: 1 1 auto;
		display: flex;
		flex-direction: column;
		padding-bottom: 10px;
	}

	body:not(.page-horizontal-bar) .page-sidebar .menu.accordion-menu > li.menu-account { margin-top: auto; }
	body.page-header-fixed:not(.page-horizontal-bar) .page-inner { padding-left: var(--sidebar-w) !important; }
	body.small-sidebar.page-header-fixed:not(.page-horizontal-bar) .page-inner { padding-left: var(--sidebar-w-small) !important; }
}

/* -------------------------------------------------------------------------
   8. Formuláře
   ------------------------------------------------------------------------- */

label, .control-label {
	color: var(--c-text-muted);
	font-weight: 500;
	font-size: 12px;
	margin-bottom: 4px;
	text-transform: none;
	letter-spacing: 0;
}

.form-group { margin-bottom: 12px; }

.form-control {
	background: var(--c-surface);
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r-sm);
	color: var(--c-text);
	font-size: 13px;
	height: 34px;
	padding: 5px 10px !important;
	box-shadow: none !important;
	transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

textarea.form-control { height: auto; min-height: 84px; }

.form-control:focus {
	border-color: var(--c-accent);
	box-shadow: var(--ring) !important;
	background: var(--c-surface);
}

.form-control::placeholder { color: var(--c-text-soft); }
.form-control[disabled], .form-control[readonly] { background: var(--c-surface-3); color: var(--c-text-muted); cursor: not-allowed; }

select.form-control {
	appearance: none;
	-webkit-appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--c-text-muted) 50%), linear-gradient(135deg, var(--c-text-muted) 50%, transparent 50%);
	background-position: calc(100% - 14px) 15px, calc(100% - 10px) 15px;
	background-size: 4px 4px, 4px 4px;
	background-repeat: no-repeat;
	padding-right: 26px !important;
}

.form-control.in-table { height: 26px; padding: 2px 6px !important; margin: -2px 0; }
.form-control-bigger { font-size: 15px; font-weight: 600; height: 40px; padding: 8px 11px !important; }
.date-picker, input[name*="date"]:not([type="hidden"]) { padding-left: 8px !important; padding-right: 8px !important; }

.has-error .form-control,
.form-group.has-error .form-control { border-color: var(--c-danger); }
.has-error .form-control:focus { box-shadow: var(--ring-danger) !important; }
.has-error .control-label, .has-error label { color: var(--c-danger); }

/* Popisek pod polem i samostatný text pod nadpisem sekce – spodní mezera je
   potřeba všude, jinak se lepí na to, co následuje (tabulka, další pole). */
.help-block { color: var(--c-text-muted); font-size: 12px; margin: 4px 0 12px 0; }
.help-block.text-danger, .form-group.has-error .help-block { color: var(--c-danger); }

.input-group-addon {
	background: var(--c-surface-3);
	border: 1px solid var(--c-line-strong);
	color: var(--c-text-muted);
	border-radius: var(--r-sm);
	font-size: 12.5px;
	padding: 5px 10px;
}

.input-group .btn { padding: 6px 12px; }

.form-group-btns { border-top: 1px solid var(--c-line) !important; padding-top: 14px !important; margin-top: 4px; }
.form-group.form-label { padding-top: 22px; }

fieldset legend {
	font-size: 13px;
	font-weight: 600;
	color: var(--c-text);
	border-bottom: 1px solid var(--c-line);
	padding-bottom: 7px;
	margin-bottom: 14px;
	text-transform: none;
	letter-spacing: 0;
}

/* --- select2 ------------------------------------------------------------ */

.form-group .select2-container { display: block; }

.select2-container .select2-selection,
.select2-container--default .select2-selection--single {
	background: var(--c-surface) !important;
	border: 1px solid var(--c-line-strong) !important;
	border-radius: var(--r-sm) !important;
	box-shadow: none !important;
	font-size: 13px !important;
	height: 34px !important;
	padding: 0 !important;
}

/* Prázdný nebo jednořádkový multiselect má být stejně vysoký jako běžný select
   (34 px): 24 px pilulka, 4 px nad a pod ní, rámeček. Roste až druhým řádkem. */
.select2-container--default .select2-selection--multiple {
	height: auto !important;
	min-height: 34px !important;
	padding: 0 6px !important;
	border-radius: var(--r-sm) !important;
}

/* Seznam vybraných je flex, ne inline-block: jako inline-block sedí na účaří
   a pod obsahem mu zbývá místo na poddolní dotahy písmen, takže okénko bylo
   o pár pixelů vyšší než běžný select. */
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	padding: 4px 0 !important;
	margin: 0 !important;
	line-height: 0;
}

.select2-container--default.select2-container--focus .select2-selection,
.select2-container--default.select2-container--open .select2-selection {
	border-color: var(--c-accent) !important;
	box-shadow: var(--ring) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 32px !important;
	padding: 0 24px 0 10px !important;
	color: var(--c-text);
}

.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--c-text-soft); }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 32px; right: 5px; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: var(--c-text-muted) transparent transparent transparent; }

.select2-dropdown {
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r);
	box-shadow: var(--shadow-pop);
	overflow: hidden;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
	background: var(--c-surface);
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r-sm);
	color: var(--c-text);
	padding: 5px 8px;
	outline-color: var(--c-accent);
}

.select2-results__options,
.select2-container--default .select2-results > .select2-results__options { max-height: 320px; padding: 4px; }
.select2-dropdown { min-width: 100%; }

.select2-container--default .select2-results__option {
	color: var(--c-text);
	padding: 6px 9px;
	font-size: 13px;
	border-radius: var(--r-sm);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--c-accent); color: #fff; }
.select2-container--default .select2-results__option[aria-selected="true"] { background: var(--c-surface-3); color: var(--c-text); }

/* Vybrané položky jako pilulky – u štítků jich vedle sebe stojí víc a hranaté
   obdélníky nalepené na sebe splývaly v jeden pruh. Select2 jim dává `float: left`,
   který by z inline-flexu udělal blok a pořadí křížku by přestalo platit. */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
	float: none !important;
	display: inline-flex !important;
	align-items: center;
	background: var(--c-accent-soft);
	border: 1px solid var(--c-accent-line);
	border-radius: var(--r-pill);
	color: var(--c-accent);
	height: 24px;
	padding: 0 10px 0 7px;
	margin: 0 !important;
	font-size: 12px;
	font-weight: 500;
	line-height: 1;
}

/* křížek je akce, ne součást názvu – potichu, dokud na něj nemíříš */
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
	order: 2;
	margin: 0 0 0 7px !important;
	color: var(--c-accent);
	opacity: 0.5;
	font-size: 13px;
	font-weight: 600;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
	opacity: 1;
	color: var(--c-danger);
}

/* pole pro psaní nového štítku je stejně vysoké jako pilulky vedle, aby se
   výška okénka neměnila podle toho, jestli je prázdné */
.select2-container--default .select2-selection--multiple .select2-search--inline { float: none !important; display: flex; }

.select2-container--default .select2-selection--multiple .select2-search--inline .select2-search__field {
	height: 24px;
	margin: 0 !important;
	padding: 0;
	font-size: 12.5px;
	line-height: 24px;
	color: var(--c-text);
}

.form-group.has-error .select2-selection { border-color: var(--c-danger) !important; }

/* --- datepicker / timepicker ------------------------------------------- */

.datepicker,
.bootstrap-datetimepicker-widget.dropdown-menu,
.ui-timepicker-wrapper {
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r);
	box-shadow: var(--shadow-pop);
	padding: 7px !important;
	color: var(--c-text);
}

.datepicker table tr td,
.datepicker table tr th { border-radius: var(--r-sm); color: var(--c-text); width: 30px; height: 28px; }
.datepicker table tr td.day:hover,
.datepicker table tr td.focused { background: var(--c-surface-3); }

.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.active {
	background: var(--c-accent) !important;
	background-image: none !important;
	color: #fff !important;
	text-shadow: none;
}

.datepicker table tr td.today,
.datepicker table tr td.today:hover {
	background: var(--c-accent-soft) !important;
	background-image: none !important;
	color: var(--c-accent) !important;
	font-weight: 600;
}

.datepicker table tr td.old, .datepicker table tr td.new { color: var(--c-text-soft); }
.datepicker .datepicker-switch, .datepicker .prev, .datepicker .next, .datepicker tfoot tr th { color: var(--c-text); border-radius: var(--r-sm); }
.datepicker .datepicker-switch:hover, .datepicker .prev:hover, .datepicker .next:hover, .datepicker tfoot tr th:hover { background: var(--c-surface-3); }
.datepicker table tr th.dow { color: var(--c-text-soft); font-size: 11px; text-transform: uppercase; }
.datepicker .day.disabled { color: var(--c-text-soft); }

.ui-timepicker-list li { color: var(--c-text); }
.ui-timepicker-list li:hover, .ui-timepicker-list li.ui-timepicker-selected { background: var(--c-accent); color: #fff; }

/* --- checkbox / radio (uniform) ---------------------------------------- */

.checkbox label, .radio label { color: var(--c-text); font-size: 13px; font-weight: 400; }

.checker, .checker span { width: 17px; height: 17px; }

.checker span {
	position: relative;
	display: inline-block;
	border: 1px solid var(--c-line-strong);
	border-radius: 4px;
	background: var(--c-surface) !important;
	background-image: none !important;
	transition: background 0.12s ease, border-color 0.12s ease;
}

.checker span.checked,
.checker span.is-indeterminate { background: var(--c-accent) !important; border-color: var(--c-accent); }

.checker span.checked::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 4px;
	height: 8px;
	margin: -5.5px 0 0 -2px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.checker span.is-indeterminate::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 8px;
	height: 2px;
	margin: -1px 0 0 -4px;
	background: #fff;
	border: none;
	transform: none;
	border-radius: 1px;
}

.checker span.focus { box-shadow: var(--ring); }

.radio span, .uniform-radio span {
	position: relative;
	border: 1px solid var(--c-line-strong);
	border-radius: 50%;
	background: var(--c-surface) !important;
	background-image: none !important;
}

.radio span.checked, .uniform-radio span.checked { border-color: var(--c-accent); }

.radio span.checked::after,
.uniform-radio span.checked::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 8px;
	height: 8px;
	margin: -4px 0 0 -4px;
	border-radius: 50%;
	background: var(--c-accent);
}

.selector, .selector span, .uploader, .uploader .filename {
	background: var(--c-surface) !important;
	border-color: var(--c-line-strong) !important;
	color: var(--c-text) !important;
	border-radius: var(--r-sm);
}

.switchery { border-radius: var(--r-pill) !important; }

/* -------------------------------------------------------------------------
   9. Tlačítka
   ------------------------------------------------------------------------- */

.btn {
	font-size: 13px;
	font-weight: 500;
	border-radius: var(--r-sm);
	border: 1px solid transparent;
	padding: 6px 13px;
	line-height: 1.45;
	transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
	box-shadow: none;
}

.btn:focus, .btn:active:focus { outline: none !important; box-shadow: var(--ring) !important; }

.btn-addon i {
	position: static;
	float: none;
	display: inline-block;
	width: auto;
	height: auto;
	margin: 0 6px 0 0;
	line-height: inherit;
	background: transparent !important;
	border-radius: 0;
	font-size: 12px;
	opacity: 0.9;
}

.btn-lg { padding: 9px 18px; font-size: 14px; border-radius: var(--r); }
.btn-sm { padding: 4px 10px; font-size: 12.5px; }
.btn-xs { padding: 2px 8px; font-size: 12px; line-height: 1.5 !important; }
.btn-lg.btn-addon i, .btn-sm.btn-addon i, .btn-xs.btn-addon i { width: auto; height: auto; margin: 0 5px 0 0; line-height: inherit; }

.btn-default {
	background: var(--c-surface);
	border-color: var(--c-line-strong);
	color: var(--c-text);
}

.btn-default:hover, .btn-default:focus, .btn-default:active,
.btn.btn-default.active, .btn-group.open .btn-default.dropdown-toggle {
	background: var(--c-surface-3);
	border-color: var(--c-line-strong);
	color: var(--c-text);
}

.btn-success, .btn-primary { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }

.btn-success:hover, .btn-success:focus, .btn-success:active, .btn.btn-success.active,
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn.btn-primary.active,
.btn-group.open .btn-success.dropdown-toggle,
.btn-group.open .btn-primary.dropdown-toggle {
	background: var(--c-accent-hover);
	border-color: var(--c-accent-hover);
	color: #fff;
}

.btn-info { background: var(--c-surface); border-color: var(--c-line-strong); color: var(--c-text); }
.btn-info:hover, .btn-info:focus, .btn-info:active { background: var(--c-surface-3); border-color: var(--c-line-strong); color: var(--c-text); }

.btn-warning { background: var(--c-warn); border-color: var(--c-warn); color: #fff; }
.btn-warning:hover, .btn-warning:focus, .btn-warning:active { background: #92400e; border-color: #92400e; color: #fff; }

.btn-danger { background: var(--c-danger); border-color: var(--c-danger); color: #fff; }
.btn-danger:hover, .btn-danger:focus, .btn-danger:active { background: #b02821; border-color: #b02821; color: #fff; }

.btn-link { color: var(--c-accent); }
.btn[disabled], .btn.disabled { opacity: 0.5; box-shadow: none !important; }

.btn-group > .btn { border-radius: 0; }
.btn-group > .btn:first-child { border-top-left-radius: var(--r-sm); border-bottom-left-radius: var(--r-sm); }
.btn-group > .btn:last-child { border-top-right-radius: var(--r-sm); border-bottom-right-radius: var(--r-sm); }
.btn-group > .btn + .btn { margin-left: -1px; }
.btn-group > .btn-default + .btn-default { border-left-color: var(--c-line-strong); }
.btn-group > .btn.btn-success { position: relative; z-index: 2; }

.btn-group .btn.no-btn {
	cursor: default;
	background: var(--c-surface);
	border-color: var(--c-line-strong);
	color: var(--c-text);
	font-weight: 600;
	min-width: 126px;
}

.btn-group .btn.no-btn:hover { background: var(--c-surface); }

/* -------------------------------------------------------------------------
   10. Zprávy, štítky, ukazatele
   ------------------------------------------------------------------------- */

.alert {
	border: 1px solid transparent;
	border-radius: var(--r);
	padding: 11px 14px;
	font-size: 13px;
	margin-bottom: 14px;
	box-shadow: none;
	display: flex;
	align-items: flex-start;
}

.alert::before {
	font-family: 'Font Awesome 5 Pro', 'Font Awesome 5 Free', FontAwesome;
	font-weight: 900;
	margin-right: 9px;
	font-size: 13px;
	line-height: 19px;
	flex: 0 0 auto;
}

.alert-success { background: var(--c-ok-soft); border-color: transparent; color: var(--c-ok); }
.alert-success::before { content: '\f058'; }
.alert-info { background: var(--c-accent-soft); border-color: transparent; color: var(--c-accent); }
.alert-info::before { content: '\f05a'; }
.alert-warning { background: var(--c-warn-soft); border-color: transparent; color: var(--c-warn); }
.alert-warning::before { content: '\f071'; }
.alert-danger { background: var(--c-danger-soft); border-color: transparent; color: var(--c-danger); }
.alert-danger::before { content: '\f06a'; }

/* Zavírací křížek stojí v šabloně před textem; ve flexu ho `margin-left:auto`
   odsunulo doprava i s textem za ním, proto `order`. Bootstrap ho navíc
   vysouvá 21px za pravý okraj (`position: relative; right: -21px`), což
   v původním layoutu vyrovnával padding – tady musí zůstat uvnitř. */
.alert-dismissible .close,
.alert-dismissable .close {
	color: inherit;
	opacity: 0.5;
	text-shadow: none;
	font-size: 17px;
	order: 1;
	margin-left: auto;
	padding-left: 11px;
	float: none;
	position: static;
	top: auto;
	right: auto;
	align-self: flex-start;
	line-height: 19px;
}
.alert-dismissible .close:hover { opacity: 1; }

.badge, .label {
	font-size: 11px;
	font-weight: 500;
	border-radius: var(--r-pill);
	padding: 2px 8px;
	line-height: 1.5;
	text-transform: none;
	letter-spacing: 0;
	border: none;
}

.badge.badge-roundless, .label.label-roundless { border-radius: var(--r-sm); }

.badge.badge-default, .label-default { background: var(--c-surface-3); color: var(--c-text-muted); }
.badge.badge-success { background: var(--c-ok-soft); color: var(--c-ok); }

/* Štítky ve světlé výplni se ztrácely – --c-ok-soft je tatáž barva jako
   --c-accent-soft a text v akcentu na ní má sotva 3:1, což je při 11 px málo.
   Stavové štítky mají proto plnou výplň.

   Text bere barvu plochy, ne natvrdo bílou: ve světlém režimu je to bílá na
   sytém podkladu, v tmavém tmavá na světlém, takže kontrast drží v obou. */
.label-success {
	background: var(--c-accent);
	color: var(--c-surface);
}

.label-info,
.label-primary {
	background: var(--c-info);
	color: var(--c-surface);
}

.badge.badge-info, .badge.badge-primary { background: var(--c-accent-soft); color: var(--c-accent); }
.badge.badge-warning { background: var(--c-warn-soft); color: var(--c-warn); }
.badge.badge-danger { background: var(--c-danger-soft); color: var(--c-danger); }

/* Ze stejného důvodu jako u .label-success: barva na vlastní bledé výplni je při
   11 px nečitelná. Plné výplně mají i proto, že v jednom semaforu stojí vedle sebe
   a půlka bledá, půlka sytá by vypadala rozbitě.

   Barvu textu si berou z plochy, takže je ve světlém režimu bílá na syté barvě
   a v tmavém tmavá na světlé. */
.label-warning {
	background: var(--c-warn);
	color: var(--c-surface);
}

.label-danger {
	background: var(--c-danger);
	color: var(--c-surface);
}

.table.table-small .badge { font-size: 10.5px !important; padding: 1px 6px; }

.progress {
	height: 6px;
	background: var(--c-surface-3);
	border-radius: var(--r-pill);
	box-shadow: none;
	overflow: hidden;
	margin-bottom: 12px;
}

.progress-bar { box-shadow: none; line-height: 6px; font-size: 0; transition: width 0.35s ease; }
.progress-bar-success { background: var(--c-ok); }
.progress-bar-danger { background: var(--c-danger); }
.progress-bar-warning { background: var(--c-warn); }
.progress-bar-info { background: var(--c-accent); }

/* Naplánovaná část čerpání (dovolená vykázaná dopředu) – stejná barva jako
   vybraná, jen průsvitná, ať je poznat, co je už pryč a co teprve přijde. */
.progress-bar-planned { background: var(--c-accent); opacity: 0.35; }

/* Report Nefakturované projekty – poměr fakturované a nefakturované práce
   jedním pruhem, pod ním legenda s hodinami. */
.nonbillable-share .progress { height: 10px; margin: 0; }

.nonbillable-share-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 22px;
	margin-top: 10px;
	font-size: 12px;
	color: var(--c-text-muted);
}

.nonbillable-share-legend i { font-size: 8px; vertical-align: 1px; margin-right: 4px; }

/* Report Dovolená – pruh čerpání s procentem vedle, v řádku tabulky */
.holiday-bar { display: flex; align-items: center; gap: 10px; }
.holiday-bar .progress { flex: 1 1 auto; margin: 0; }
.holiday-bar-value {
	flex: 0 0 auto;
	min-width: 42px;
	text-align: right;
	font-size: 12px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--c-text-muted);
}

/* -------------------------------------------------------------------------
   11. Stránkování
   ------------------------------------------------------------------------- */

.dataTables_paginate { padding-top: 14px; }

.dataTables_paginate .paginate_button,
.paginate_button,
.dataTables_wrapper .dataTables_paginate .paginate_button,
.dataTables_wrapper .dataTables_paginate .paginate_button:active,
.dataTables_wrapper .dataTables_paginate .paginate_button:focus {
	display: inline-block;
	min-width: 30px;
	height: 30px;
	line-height: 28px;
	padding: 0 9px;
	margin-right: 3px;
	text-align: center;
	border: 1px solid var(--c-line);
	border-radius: var(--r-sm);
	background: var(--c-surface) !important;
	color: var(--c-text-muted) !important;
	font-size: 12.5px;
	font-weight: 500;
	box-shadow: none;
	transition: background 0.12s ease, color 0.12s ease;
}

.paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
	background: var(--c-surface-3) !important;
	border-color: var(--c-line-strong);
	color: var(--c-text) !important;
	text-decoration: none;
}

.paginate_button.current,
.paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	background: var(--c-accent) !important;
	border-color: var(--c-accent);
	color: #fff !important;
}

.paginate_button.disabled,
.paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
	background: transparent !important;
	border-color: transparent;
	color: var(--c-text-soft) !important;
	cursor: default;
}

/* -------------------------------------------------------------------------
   12. Modaly, záložky, tooltipy
   ------------------------------------------------------------------------- */

.modal-content {
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	box-shadow: 0 20px 60px rgba(16, 22, 34, 0.22);
	overflow: hidden;
}

.modal-dialog { margin-top: 8vh; }

.modal-header { border-bottom: 1px solid var(--c-line); padding: 14px 18px; background: var(--c-surface); }
.modal-header .modal-title { font-size: 14px; font-weight: 600; color: var(--c-text); letter-spacing: -0.01em; }
.modal-header .close { color: var(--c-text-soft); opacity: 1; text-shadow: none; font-size: 20px; font-weight: 400; margin-top: -2px; }
.modal-header .close:hover { color: var(--c-text); }

.modal-body { padding: 18px; color: var(--c-text); background: var(--c-surface); }
.modal-body > h5 { font-size: 12px; font-weight: 600; color: var(--c-text-muted); padding: 0 0 0 10px; margin: 0 0 6px 0; text-transform: none; letter-spacing: 0; }
.modal-body > h5 + table { margin-bottom: 18px; }
.modal-body .table:last-child { margin-bottom: 0; }

/* modern.css u .modal-body + .modal-footer nuluje horní odsazení, čímž se tlačítka
   nalepí na linku – vlastní pravidlo musí být stejně konkrétní */
.modal-footer,
.modal-body + .modal-footer { border-top: 1px solid var(--c-line); padding: 12px 18px; background: var(--c-surface-2); }
.modal-backdrop.in { opacity: 0.4; }

.nav-tabs { border-bottom: 1px solid var(--c-line); margin-bottom: 16px; }

.nav-tabs > li > a {
	border: none !important;
	border-bottom: 2px solid transparent !important;
	border-radius: 0;
	color: var(--c-text-muted);
	font-weight: 500;
	font-size: 13px;
	padding: 8px 12px;
	margin-right: 2px;
	background: transparent !important;
	text-transform: none;
	letter-spacing: 0;
}

.nav-tabs > li > a:hover { color: var(--c-text); border-bottom-color: var(--c-line-strong) !important; }

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
	color: var(--c-accent);
	border-bottom-color: var(--c-accent) !important;
	background: transparent !important;
}

.nav-tabs a.has-error { color: var(--c-danger) !important; }
.nav-tabs:has(> li:only-child) { display: none; }
.nav-tabs:has(> li:only-child) + .tab-content { padding-top: 0; }

.tab-content { background: var(--c-surface); padding: 0; color: var(--c-text); }
.tab-content > .tab-pane { background: transparent; }

.tooltip-inner { background: #14171c; color: #fff; border-radius: var(--r-sm); padding: 5px 9px; font-size: 12px; box-shadow: none; }
.tooltip.top .tooltip-arrow { border-top-color: #14171c; }
.tooltip.bottom .tooltip-arrow { border-bottom-color: #14171c; }
.tooltip.left .tooltip-arrow { border-left-color: #14171c; }
.tooltip.right .tooltip-arrow { border-right-color: #14171c; }
.tooltip.in { opacity: 1; }

.alertify,
.alertify-log { font-family: var(--font-ui); }

.alertify {
	border-radius: var(--r-lg);
	border: 1px solid var(--c-line);
	background: var(--c-surface);
	box-shadow: 0 20px 60px rgba(16, 22, 34, 0.22);
	color: var(--c-text);
	padding: 4px;
}

.alertify-message { color: var(--c-text); font-size: 13.5px; padding: 16px 16px 6px 16px; }
.alertify-buttons { background: transparent; border: none; padding: 6px 16px 14px 16px; }

.alertify-button {
	border-radius: var(--r-sm) !important;
	border: 1px solid transparent !important;
	background-image: none !important;
	text-shadow: none !important;
	box-shadow: none !important;
	padding: 6px 13px !important;
	font-size: 13px;
	font-weight: 500;
}

.alertify-button-ok { background: var(--c-danger) !important; color: #fff !important; }
.alertify-button-cancel { background: var(--c-surface) !important; border-color: var(--c-line-strong) !important; color: var(--c-text) !important; }
.alertify-cover { background: #0b0e12; opacity: 0.4 !important; }

/* -------------------------------------------------------------------------
   13. Přihlašovací obrazovka
   ------------------------------------------------------------------------- */

body.page-login { background: var(--c-bg); display: block; }
body.page-login .page-content { background: transparent; }
body.page-login .page-inner { background: transparent !important; padding: 0 !important; }
body.page-login #main-wrapper { padding: 0; }

body.page-login .login-box {
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	box-shadow: var(--shadow-pop);
	padding: 30px 28px 24px 28px;
	margin-top: 13vh;
	max-width: 372px;
	width: 100%;
}

body.page-login .login-box .logo-name {
	display: block;
	font-size: 21px;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--c-text);
	margin: 0 0 4px 0;
	text-align: center;
}

body.page-login .login-box .logo-name::before {
	content: '';
	display: block;
	width: 34px;
	height: 34px;
	margin: 0 auto 12px auto;
	border-radius: 9px;
	background: var(--c-accent);
}

body.page-login .login-box .btn { width: 100%; padding: 9px; font-size: 13.5px; }
body.page-login .login-box .form-group { margin-bottom: 12px; }
body.page-login .login-box .form-control { height: 38px; }
body.page-login .col-md-3.center { max-width: 372px; margin: 0 auto; float: none; width: 100%; }

/* -------------------------------------------------------------------------
   14. Doplňky
   ------------------------------------------------------------------------- */

.b-t { border-top-color: var(--c-line) !important; }
.b-b { border-bottom-color: var(--c-line) !important; }
.b-l { border-left-color: var(--c-line) !important; }
.b-r { border-right-color: var(--c-line) !important; }

.well { background: var(--c-surface-2); border: 1px solid var(--c-line); border-radius: var(--r); box-shadow: none; }
.overlay, .cd-overlay { background: rgba(11, 14, 18, 0.45); }

* { scrollbar-color: var(--c-line-strong) transparent; scrollbar-width: thin; }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--c-line-strong); border-radius: var(--r-pill); border: 3px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: var(--c-text-soft); background-clip: content-box; }

.blockUI.blockOverlay { background: var(--c-bg) !important; opacity: 0.55 !important; }

.cke.cke_chrome { border: 1px solid var(--c-line-strong) !important; border-radius: var(--r-sm) !important; box-shadow: none !important; overflow: hidden; }
html[data-theme="dark"] .cke.cke_chrome,
html[data-theme="dark"] .cke_top,
html[data-theme="dark"] .cke_bottom { background: var(--c-surface-2) !important; border-color: var(--c-line) !important; }

.dropzone {
	background: var(--c-surface-2);
	border: 1px dashed var(--c-line-strong);
	border-radius: var(--r);
	color: var(--c-text-muted);
	min-height: 130px;
}

.dropzone:hover { border-color: var(--c-accent); background: var(--c-accent-soft); }

/* fullcalendar */
.fc-toolbar h2 { font-size: 16px; font-weight: 600; color: var(--c-text); letter-spacing: -0.01em; }
.fc-unthemed th, .fc-unthemed td, .fc-unthemed .fc-divider, .fc-unthemed .fc-row { border-color: var(--c-line); }
.fc-unthemed .fc-today { background: var(--c-accent-soft); }
.fc-day-header { color: var(--c-text-muted); font-weight: 500; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; }
.fc-day-header.fc-sat, .fc-day-header.fc-sun { color: var(--c-text-soft); }
.fc-day.fc-sat, .fc-day.fc-sun { background: var(--c-surface-2); }
.fc-day-number { padding: 3px 6px !important; font-size: 12px; }
.fc-event { border: none; border-radius: var(--r-sm); background: var(--c-accent); padding: 1px 5px; font-size: 12px; }

.fc-button {
	background: var(--c-surface) !important;
	background-image: none !important;
	border: 1px solid var(--c-line-strong) !important;
	border-radius: var(--r-sm) !important;
	box-shadow: none !important;
	color: var(--c-text) !important;
	text-shadow: none !important;
	height: 30px;
	padding: 0 11px !important;
	font-size: 12.5px;
	font-weight: 500;
}

.fc-button:hover { background: var(--c-surface-3) !important; }
.fc-state-active, .fc-state-down { background: var(--c-accent) !important; border-color: var(--c-accent) !important; color: #fff !important; }
.fc-state-disabled { opacity: 0.5; }
.fc-button-group .fc-button { border-radius: 0 !important; margin: 0 0 0 -1px !important; }
.fc-button-group .fc-button:first-child { border-top-left-radius: var(--r-sm) !important; border-bottom-left-radius: var(--r-sm) !important; margin-left: 0 !important; }
.fc-button-group .fc-button:last-child { border-top-right-radius: var(--r-sm) !important; border-bottom-right-radius: var(--r-sm) !important; }

/* prázdný stav výpisu */
.list-empty { text-align: center; padding: 40px 14px 36px 14px; color: var(--c-text-muted); }
.list-empty .list-empty-icon { display: block; font-size: 24px; color: var(--c-text-soft); margin-bottom: 10px; }
.list-empty p { font-size: 13.5px; color: var(--c-text); margin: 0 0 12px 0; }

/* rozbalovací sekce (nastavení) */
.panel-group { margin-bottom: 0; }
.panel-group .panel-collapse { border: none !important; background: transparent; }

.panel-group .panel {
	border: none !important;
	border-top: 1px solid var(--c-line) !important;
	box-shadow: none;
	border-radius: 0;
	margin-bottom: 0;
	background: transparent;
}

.panel-group .panel:first-child { border-top: none !important; }
.panel-group .panel .panel-heading { border-bottom: none; background: transparent !important; padding: 14px 0; }
.panel-group .panel .panel-heading .panel-title { padding-left: 0; font-size: 13px; }
.panel-group .panel .panel-heading .panel-title > a { color: var(--c-text); display: block; cursor: pointer; }
.panel-group .panel .panel-heading .panel-title > a:after { color: var(--c-text-soft); font-size: 12px; content: '\f068'; }
.panel-group .panel .panel-heading .panel-title > a.collapsed:after { content: '\f067'; }

.panel-group .panel-collapse .panel-body,
.panel > .panel-heading + .panel-collapse > .panel-body { border: none !important; background: transparent; padding: 0 0 18px 0 !important; }

/* filtry nad tabulkou nejsou formulářová sekce */
.panel-body > form > .clearfix .form-group,
.panel-body > .clearfix .form-group { margin-bottom: 0; }

/* --- viditelný focus pro klávesnici ------------------------------------- */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.paginate_button:focus-visible,
.table .actions a:focus-visible,
.menu.accordion-menu a:focus-visible,
.top-menu .navbar-nav > li > a:focus-visible,
.close:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--c-accent) !important;
	outline-offset: 2px;
	border-radius: var(--r-sm);
}

.form-control:focus-visible,
.select2-search__field:focus { outline: 2px solid var(--c-accent) !important; outline-offset: 1px; }

/* -------------------------------------------------------------------------
   15. Responzivita
   ------------------------------------------------------------------------- */

@media (max-width: 991px) {
	#main-wrapper { padding: 12px 12px 14px 12px; }
	.page-title { padding: 14px 12px 0 12px; }
	.page-title h3 { font-size: 17px; }
}

@media (max-width: 767px) {
	.navbar .navbar-inner { display: flex; align-items: center; height: var(--topbar-h); padding: 0 6px 0 4px; }

	.sidebar-pusher {
		position: static !important;
		transform: none !important;
		top: auto !important;
		margin: 0 !important;
		float: none;
		flex: 0 0 auto;
	}

	.sidebar-pusher .push-sidebar { color: var(--c-text-muted); display: block; padding: 0 10px; line-height: var(--topbar-h); font-size: 17px; }

	.navbar .logo-box {
		width: auto;
		background: transparent;
		flex: 1 1 auto;
		float: none;
		display: flex;
		align-items: center;
		height: var(--topbar-h);
		border: none;
	}

	.navbar .logo-box .logo-text { color: var(--c-text); padding: 0 0 0 4px; font-size: 15px; line-height: normal; }
	.topmenu-outer { margin-left: 0; flex: 0 0 auto; float: none; height: var(--topbar-h); }

	.top-menu { display: block; }
	.top-menu .navbar-nav { margin: 0; float: right; display: flex; }
	.top-menu .navbar-nav > li { float: left; }
	.top-menu .navbar-nav > li > a { padding: 17px 8px; }
	.top-menu .navbar-nav > li > a .user-name,
	.top-menu .navbar-nav > li > a.log-out span { font-size: 0; }
	.top-menu .navbar-nav > li > a .user-name i,
	.top-menu .navbar-nav > li > a.log-out span i { font-size: 15px; margin: 0 !important; }

	.navbar-nav > li > .dropdown-menu {
		position: absolute;
		right: 0;
		left: auto;
		background: var(--c-surface);
		border: 1px solid var(--c-line);
		box-shadow: var(--shadow-pop);
	}

	.dropdown-lg { min-width: 260px; }
}

/* =========================================================================
   16. Firemní kompozice – zelená navigace, podbarvená hlavička, souhrny
   ========================================================================= */

/* aktivní modul v navigaci nese firemní zelenou */
.menu.accordion-menu > li.active > a,
.menu.accordion-menu > li.active.open > a {
	background: var(--c-accent);
	color: #fff;
}

.menu.accordion-menu > li.active > a span.menu-icon,
.menu.accordion-menu > li.active > a > p { color: #fff; opacity: 1; }

html[data-theme="dark"] .menu.accordion-menu > li.active > a,
html[data-theme="dark"] .menu.accordion-menu > li.active.open > a { color: #04150e; }

html[data-theme="dark"] .menu.accordion-menu > li.active > a span.menu-icon,
html[data-theme="dark"] .menu.accordion-menu > li.active > a > p { color: #04150e; }

.menu.accordion-menu > li.open:not(.active) > a { background: var(--c-nav-bg-2); }

/* hlavička tabulky je podbarvená – oddělí data od filtrů */
.table > thead > tr > th {
	background: var(--c-head);
	padding: 7px 10px !important;
	vertical-align: middle;
	border-bottom: 1px solid var(--c-line) !important;
}

.table > thead > tr.filters td { background: var(--c-head); }

.table > thead > tr:last-child > th,
.table > thead > tr:last-child > td { border-bottom: 1px solid var(--c-line-strong) !important; }

/* sekce: hlavička nese nadpis a vpravo souhrn */
.panel .panel-heading { display: flex; align-items: center; gap: 12px; }
.panel .panel-heading .panel-title { flex: 0 0 auto; }

.panel .panel-heading .heading-note {
	margin-left: auto;
	font-size: 12px;
	color: var(--c-text-muted);
	font-weight: 400;
}

.panel .panel-heading .heading-note strong { color: var(--c-text); font-weight: 600; }

/* -------------------------------------------------------------------------
   Souhrnné karty nad tabulkou
   ------------------------------------------------------------------------- */

.stat-cards {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 14px;
}

.stat-card {
	flex: 1 1 150px;
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	padding: 9px 13px;
	min-width: 0;
}

.stat-card .stat-key {
	display: block;
	font-size: 10.5px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--c-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.stat-card .stat-value {
	display: block;
	font-size: 19px;
	font-weight: 600;
	letter-spacing: -0.02em;
	margin-top: 2px;
	color: var(--c-text);
	font-variant-numeric: tabular-nums;
}

.stat-card .stat-value.is-accent { color: var(--c-accent); }
.stat-card .stat-value.is-danger { color: var(--c-danger); }
.stat-card .stat-value.is-soft { color: var(--c-text-soft); }

.stat-card .stat-note {
	display: block;
	font-size: 11.5px;
	color: var(--c-text-soft);
	margin-top: 1px;
}

.stat-card .progress { margin: 7px 0 0 0; height: 4px; }

@media (max-width: 767px) {
	.stat-card { flex: 1 1 calc(50% - 5px); }
}

/* Sekce nemůže mít overflow:hidden (ořízlo by sticky hlavičku tabulky),
   takže zaoblení musí nést samotný obsah – jinak bílá výplň přeteče
   přes zakulacený rám a rohy vypadají useknuté. */
.panel > *:first-child {
	border-top-left-radius: var(--r-lg);
	border-top-right-radius: var(--r-lg);
}

.panel > *:last-child {
	border-bottom-left-radius: var(--r-lg);
	border-bottom-right-radius: var(--r-lg);
}

.panel > .panel-body:only-child { border-radius: var(--r-lg); }

/* Editační sekce má mezi rámem a obsahem ještě <form>. Ten je průhledný, takže
   zaoblení z pravidel výše nese prvek, který žádnou výplň nemá – bílý .panel-body
   uvnitř pak přeteče přes zakulacený rám a rohy vypadají useknuté. Formulář navíc
   končí skrytými inputy, takže na poslední výplň se nedá mířit přes :last-child. */
.panel > form:first-child > .panel-heading:first-child,
.panel > form:first-child > .panel-body:first-child {
	border-top-left-radius: var(--r-lg);
	border-top-right-radius: var(--r-lg);
}

.panel > form:last-child > .panel-body:last-of-type,
.panel > form:last-child > .panel-footer:last-of-type {
	border-bottom-left-radius: var(--r-lg);
	border-bottom-right-radius: var(--r-lg);
}

/* uvnitř rozbalovacích sekcí by zaoblení potomků naopak překáželo */
.panel-group .panel > *:first-child,
.panel-group .panel > *:last-child,
.panel-group .panel > .panel-body:only-child { border-radius: 0; }

/* -------------------------------------------------------------------------
   Menu: všechno viditelné, druhá úroveň odsazená pod první
   Skryté podmenu (accordion i hover) znamenalo, že reporty a nastavení
   byly schované za kliknutím nebo najetím. Sekce má teď nadpis a položky
   pod ním jsou vidět pořád.
   ------------------------------------------------------------------------- */

.menu.accordion-menu li .sub-menu,
.menu.accordion-menu > li > ul {
	display: block !important;
	position: static !important;
	height: auto !important;
	opacity: 1 !important;
	visibility: visible !important;
	left: auto !important;
	width: auto !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 0 2px 0 !important;
	margin: 0 !important;
	min-width: 0 !important;
}

/* nadpis sekce – nekliká se na něj, jen uvozuje položky pod sebou */
.menu.accordion-menu > li.menu-section { margin-top: 1px; margin-bottom: 1px; }
.menu.accordion-menu > li.menu-section:first-child { margin-top: 0; }

.menu.accordion-menu > li.menu-section > .menu-section-title {
	display: flex;
	align-items: center;
	padding: 7px 10px;
	color: var(--c-nav-text);
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	opacity: 0.75;
	cursor: default;
}

.menu.accordion-menu > li.menu-section > .menu-section-title .menu-icon {
	width: 17px;
	margin-right: 10px;
	font-size: 12px;
	text-align: center;
	flex: 0 0 auto;
}

.menu.accordion-menu > li.menu-section > .menu-section-title p {
	margin: 0;
	font-size: 11px;
	line-height: 19px;
	color: inherit;
	flex: 1 1 auto;
}

/* Položky druhé úrovně: text první úrovně začíná za ikonou na 37 px, takže
   stejně odsazená druhá úroveň s ní splývala. Odsazení nese svislé vodítko
   a položky jsou menší a tlumenější. */
/* Pozor na specificitu: pravidlo výš cílí přes `li .sub-menu` (tři třídy),
   takže odsazení musí být zapsané aspoň stejně silně, jinak se neprosadí. */
/* Vodítko sedí přesně pod středem ikon první úrovně: menu má 10px padding,
   odkaz dalších 10px, ikona je široká 17px – střed tedy vychází na 28px.
   Odsazení zprava drží podbarvení položek odlepené od linky. */
.menu.accordion-menu li.menu-section > ul.sub-menu {
	margin: 1px 0 0 17.5px !important;
	padding: 0 0 0 6px !important;
	border: none !important;
	border-left: 1px solid rgba(255, 255, 255, 0.14) !important;
}

/* text první úrovně začíná za ikonou na 46 px – druhá úroveň jde o kus dál.
   Svisle je druhá úroveň sevřenější než první: položek je jí víc a se čtyřmi
   sekcemi se celé menu na notebooku s výškou 768 px jinak nevejde do okna. */
.menu.accordion-menu li.menu-section > ul.sub-menu > li > a {
	padding: 5px 10px 5px 26px !important;
	font-size: 12px;
	border-radius: var(--r-sm);
	color: var(--c-nav-text);
	opacity: 0.8;
}

.menu.accordion-menu ul li a:hover { opacity: 1; }
.menu.accordion-menu li.menu-section > ul.sub-menu > li { margin-bottom: 1px; }
.menu.accordion-menu li.menu-section > ul.sub-menu > li:last-child { margin-bottom: 0; }

/* Zapsáno přes stejnou cestu jako pravidlo pro odsazení výš – to má čtyři
   třídy a jinak přebije barvu i průhlednost, takže aktivní položka zůstala
   tlumená a na zeleném podkladu nečitelná. */
.menu.accordion-menu li.menu-section > ul.sub-menu > li.active > a,
.menu.accordion-menu ul li.active a {
	background: var(--c-accent);
	color: #fff !important;
	opacity: 1 !important;
	font-weight: 500;
}

.menu.accordion-menu ul li.active a::before { display: none; }

html[data-theme="dark"] .menu.accordion-menu li.menu-section > ul.sub-menu > li.active > a,
html[data-theme="dark"] .menu.accordion-menu ul li.active a { color: #04150e !important; }

/* Účet stojí na konci menu a nepatří k sekcím nad ním – odděluje ho linka,
   ne mezera, aby seznam nevypadal useknutě. Je to avatar se jménem pod ním;
   v horní liště už uživatel není. */
.menu.accordion-menu > li.menu-account {
	margin-top: 10px;
	padding-top: 12px;
	border-top: 1px solid var(--c-nav-line);
}

.menu.accordion-menu > li.menu-account > a.menu-account-link {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	padding: 8px 6px 10px !important;
	text-align: center;
	line-height: 1.3;
}

.menu-account-avatar { box-shadow: 0 0 0 2px var(--c-nav-bg), 0 0 0 4px var(--c-nav-line); }
.menu.accordion-menu > li.menu-account.active .menu-account-avatar { box-shadow: 0 0 0 2px var(--c-nav-bg), 0 0 0 4px var(--c-accent); }
.menu-account-name { font-size: 12.5px; color: var(--c-nav-text); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.menu.accordion-menu > li.menu-account.active .menu-account-name,
.menu.accordion-menu > li.menu-account > a:hover .menu-account-name { color: var(--c-nav-text-active); }
.small-sidebar .menu-account-name { display: none; }
.small-sidebar .menu-account-avatar { --avatar-size: 34px; }

/* šipky u rozbalování už nemají co ovládat */
.menu.accordion-menu > li > a > span.arrow { display: none !important; }

/* buňka, která se nesmí zalomit (datum s varovnou ikonou) */
.table td.nowrap,
.table th.nowrap,
.table td.nowrap { white-space: nowrap; }

/* Rozbalený select nemá vodorovně scrollovat – dlouhý název projektu se
   zalomí na víc řádků místo posuvníku přes celou nabídku. */
.select2-results__options,
.select2-container--default .select2-results > .select2-results__options {
	overflow-x: hidden !important;
	max-width: 100%;
}

.select2-container--default .select2-results__option {
	white-space: normal;
	overflow-wrap: anywhere;
	width: auto !important;
	max-width: 100%;
	box-sizing: border-box;
}

/* svislý posuvník ukrajoval šířku, takže položky přetékaly do stran */
.select2-results__options { scrollbar-gutter: stable; }
.select2-results { max-width: 100%; overflow-x: hidden; }

.select2-dropdown { max-width: 100vw; overflow: hidden; }
.select2-container--default .select2-selection--single .select2-selection__rendered { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Výběr období s pracovníkem patří k souhrnným kartám pod sebou, ne
   k formuláři nad sebou – proto těsně k nim a s odstupem od panelu výš. */
.period-block { margin-top: 14px; }
.period-block .period-toolbar { margin-bottom: 8px; }
.period-block .stat-cards { margin-bottom: 0; }
.period-block + .col-md-12 { margin-top: 20px; }

/* Tabulka nekončí natvrdo na hraně sekce – pod poslední řádek patří mezera.
   Stránkování si ji nese samo, takže jeho horní odsazení odpadá. */
.table { margin-bottom: 16px; }
.table .table,
.table.inline,
.modal-body .table:last-child { margin-bottom: 0; }
.dataTables_paginate { padding-top: 0; }

/* custom.css kreslí svislé linky mezi buňkami a rám kolem tabulky
   (`td:last-child { border-right }`); v tomhle vzhledu drží tabulku jen
   vodorovné linky. */
.table,
.table > tbody > tr > td,
.table > tbody > tr > td:last-child,
.table > tfoot > tr > td,
.table > tfoot > tr > td:last-child,
.table > thead > tr > td,
.table > thead > tr > td:last-child,
.table > thead > tr > th,
.table > thead > tr > th:last-child,
.table td,
.table td:last-child {
	border-left: none !important;
	border-right: none !important;
}

/* Tabulky vnořené do formuláře (úvazky, náklady u pracovníka) jsou doplňkem
   formuláře, ne hlavním výpisem – drží se těsněji u toho, co po nich následuje. */
.tab-content .table-responsive .table,
.panel-body .row-links + .table,
.tab-content .table { margin-bottom: 8px; }

.row-links { margin-bottom: 4px; }

/* Položky horní lišty mají různou stavbu (samotná ikona, ikona s textem
   v obalu), takže se zarovnávaly na účaří a nesedělo to na jednu osu.
   Flex je srovná bez ohledu na to, co je uvnitř. */
.top-menu .navbar-nav > li > a {
	display: flex;
	align-items: center;
	gap: 7px;
	height: var(--topbar-h);
	padding: 0 12px;
	line-height: 1;
}

.top-menu .navbar-nav > li > a .user-name,
.top-menu .navbar-nav > li > a.log-out > span {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	line-height: 1;
}

.top-menu .navbar-nav > li > a i {
	margin: 0 !important;
	line-height: 1;
	display: block;
}

/* pravidlo výš je specifičtější než .theme-toggle .icon-*, takže by se
   jinak ukázaly obě ikony přepínače najednou */
.top-menu .navbar-nav > li > a.theme-toggle .icon-dark { display: none; }
html[data-theme="dark"] .top-menu .navbar-nav > li > a.theme-toggle .icon-dark { display: block; }
html[data-theme="dark"] .top-menu .navbar-nav > li > a.theme-toggle .icon-light { display: none; }

/* Kopírování popisu do schránky – ikona se ukáže až nad řádkem, aby výpis
   nezhoustl. Klik na ni nesmí spustit otevření záznamu (row-as-link). */
.copy-btn,
.move-btn {
	border: none;
	background: transparent;
	padding: 0 4px;
	margin-left: 4px;
	color: var(--c-text-soft);
	font-size: 11.5px;
	line-height: 1;
	opacity: 0;
	transition: opacity 0.12s ease, color 0.12s ease;
	vertical-align: baseline;
}

tr:hover .copy-btn,
tr:hover .move-btn,
.copy-btn:focus-visible,
.move-btn:focus-visible,
.copy-btn.is-copied { opacity: 1; }

.copy-btn:hover,
.move-btn:hover { color: var(--c-accent); }

/* odkaz, ne tlačítko – barvu si jinak vezme z odkazů administrace */
.move-btn,
.move-btn:focus { color: var(--c-text-soft); text-decoration: none; }

.summary-move-work { line-height: 1.6; }

/* štítek odloženého se dá rozkliknout na rozpis výkazů – ať to je poznat */
a.summary-origin { cursor: pointer; text-decoration: none; }
a.summary-origin:hover { filter: brightness(0.94); }

/* volba rozpisu faktury; pod ní se přepíná tabulka řádků a souhrn */
.summary-invoice-mode { max-width: 420px; margin-bottom: 18px; }

/* název souhrnného řádku se píše rovnou do tabulky, na místo, kde bude */
input.summary-invoice-name { height: 30px; padding: 4px 8px; font-size: 12.5px; }

/* nadpis nad podtabulkou (náklady/tržby v jednom panelu) */
.summary-items-head { font-size: 12px; font-weight: 600; color: var(--c-text-muted); margin: 0 0 8px; text-transform: uppercase; letter-spacing: 0.02em; }

/* dopočet pod nefakturovanými projekty: sečti, co kde zůstalo, a vyjde výsledek firmy */
.summary-reconcile { margin-top: 14px; margin-bottom: 0; max-width: 520px; }
.summary-reconcile > tbody > tr > td { border-top: 1px solid var(--c-line); padding: 7px 10px; }
.summary-reconcile > tbody > tr:first-child > td { border-top: none; }
.summary-reconcile .help-block { margin: 2px 0 0; font-size: 11.5px; }

/* volba rozpisu u projektu v podkladu – vejde se do řádku s hromadnými akcemi */
.summary-invoice-layout { display: inline-flex; align-items: center; gap: 6px; margin-left: 14px; }
.summary-invoice-layout label { margin: 0; font-weight: normal; color: var(--c-text-muted); font-size: 12px; white-space: nowrap; }
.summary-invoice-layout select { width: auto; }
.summary-invoice-layout input { width: 260px; }

.copy-btn.is-copied { color: var(--c-accent); }
.copy-btn.is-copied i::before { content: '\f00c'; }

/* =========================================================================
   Docházkový report – podbarvení buněk podle odpracovaných hodin
   Šablona rozdává třídy td-*; obecné pravidlo pro buňky je přebíjelo,
   takže se barvy ztratily. Tady jsou znovu, ve firemní paletě.
   ========================================================================= */

/* Odpracované hodiny jako štítek – barva nese, jestli je den plný, krátký,
   přesčasový nebo dovolená. */
.hours-badge {
	display: inline-block;
	min-width: 44px;
	padding: 2px 7px;
	border-radius: var(--r-pill);
	font-size: 11.5px;
	font-weight: 600;
	line-height: 17px;
	font-variant-numeric: tabular-nums;
}

.hours-badge.is-over { background: var(--c-accent); color: #fff; }
.hours-badge.is-full { background: var(--c-accent-soft); color: var(--c-accent-hover); }
.hours-badge.is-partial { background: var(--c-warn-soft); color: var(--c-warn); }
.hours-badge.is-low { background: var(--c-danger-soft); color: var(--c-danger); }
.hours-badge.is-holiday { background: rgba(59, 130, 246, 0.16); color: #1d4ed8; }

html[data-theme="dark"] .hours-badge.is-over { color: #04150e; }
html[data-theme="dark"] .hours-badge.is-full { color: var(--c-accent); }
html[data-theme="dark"] .hours-badge.is-holiday { background: rgba(98, 155, 255, 0.2); color: #9dc0ff; }

/* víkend jen naznačený, svátek žlutě – ať je poznat, proč se ten den nedělalo */
.table > tbody > tr > td.td-weekend { background: rgba(20, 30, 25, 0.028); }
.table > thead > tr > th.th-weekend { background: rgba(20, 30, 25, 0.028); color: var(--c-text-soft); }

.table > tbody > tr > td.td-holiday { background: rgba(99, 102, 241, 0.09); }
.table > thead > tr > th.th-holiday { background: rgba(99, 102, 241, 0.12); color: #4f46e5; }

html[data-theme="dark"] .table > tbody > tr > td.td-weekend,
html[data-theme="dark"] .table > thead > tr > th.th-weekend { background: rgba(255, 255, 255, 0.035); }

html[data-theme="dark"] .table > tbody > tr > td.td-holiday { background: rgba(129, 132, 255, 0.13); }
html[data-theme="dark"] .table > thead > tr > th.th-holiday { background: rgba(129, 132, 255, 0.16); color: #a5a8ff; }


/* značka home office v rohu buňky */
td .home-office {
	position: absolute;
	top: 3px;
	right: 3px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--c-danger);
}

.table > tbody > tr > td.no-h-p { position: relative; }

/* tooltip nad buňkou docházky – jeden výkaz na blok */
.tooltip-inner { max-width: 320px; text-align: left; }
.tooltip-task { display: block; }
.tooltip-task + .tooltip-task { margin-top: 6px; padding-top: 6px; border-top: 1px solid rgba(255, 255, 255, 0.18); }
.tooltip-task b { font-weight: 600; }

/* Docházkový report – každý den stejně široký, ať se sloupce nehýbou podle
   toho, kolik hodin v nich stojí. */
.attendance-table { table-layout: fixed; width: 100%; }
.attendance-table .day-col { width: 52px; min-width: 52px; }
.attendance-table > thead > tr > th:first-child,
.attendance-table > tbody > tr > td:first-child { width: 190px; }
.attendance-table > thead > tr > th:not(.day-col):not(:first-child),
.attendance-table > tbody > tr > td:not(.day-col):not(:first-child) { width: 74px; }
.attendance-table .hours-badge { min-width: 0; width: 100%; padding: 2px 2px; }

/* Pevné šířky znamenají, že se dlouhý měsíc nevejde na šířku a tabulka se
   posouvá – jméno pracovníka proto zůstává ukotvené vlevo. */
.attendance-table > thead > tr > th:first-child,
.attendance-table > tbody > tr > td:first-child {
	position: sticky;
	left: 0;
	z-index: 3;
	background: var(--c-surface);
}

/* Uvnitř vodorovně posuvné oblasti se `top` počítá vůči ní, ne vůči stránce –
   bez tohohle by hlavička sloupce ujela doprostřed tabulky. */
.attendance-table > thead > tr > th:first-child {
	z-index: 4;
	background: var(--c-head);
	top: auto;
}

.table-responsive:has(.attendance-table) { overflow-x: auto; }

/* Nástěnka – nevykázané dny jako dlaždice, na které se dá rovnou kliknout */
.missing-days {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 4px;
}

.missing-day {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 58px;
	padding: 7px 10px;
	border: 1px solid var(--c-line);
	border-radius: var(--r);
	background: var(--c-surface);
	color: var(--c-text);
	line-height: 1.25;
	transition: border-color 0.12s ease, background 0.12s ease;
}

.missing-day:hover {
	background: var(--c-accent-soft);
	border-color: var(--c-accent-line);
	color: var(--c-accent-hover);
	text-decoration: none;
}

.missing-day strong { font-size: 13.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.missing-day span { font-size: 11px; color: var(--c-text-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.missing-day:hover span { color: inherit; }

/* Docházka: den bez jediného výkazu je označený vykřičníkem, ne plochou. */
.day-missing { color: var(--c-danger); font-size: 12px; opacity: 0.65; }

/* Nástěnka – roční přehled pracovníků. Čtrnáct sloupců vedle sebe, a všechny
   nezalomitelné – bez užších buněk a menšího písma by se tabulka nevešla do
   panelu a jezdila by vodorovně. */
.year-table > tbody > tr > td,
.year-table > thead > tr > th,
.year-table > tfoot > tr > th {
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	padding-left: 7px !important;
	padding-right: 7px !important;
}

/* menší písmo patří číslům, hlavičky mají svých 11 px jako všude jinde */
.year-table > tbody > tr > td,
.year-table > tfoot > tr > th { font-size: 12.5px; }

.year-table > tbody > tr > td { padding-top: 7px; padding-bottom: 7px; }

.year-table > tfoot > tr > th {
	border-top: 1px solid var(--c-line);
	background: var(--c-head);
	font-weight: 600;
}

.year-table .hours-badge { min-width: 44px; padding-left: 5px; padding-right: 5px; }

/* bloky se poznají podle podbarvení každého druhého z nich, linky nejsou */
.year-table > thead > tr > th.group-tint,
.year-table > tbody > tr > td.group-tint,
.year-table > tfoot > tr > th.group-tint { background: var(--c-tint); }

/* první sloupec bloku dýchá, ať se čísla dvou sousedních bloků nepletou */
.year-table > thead > tr > th.group-sep,
.year-table > tbody > tr > td.group-sep,
.year-table > tfoot > tr > th.group-sep { padding-left: 12px !important; }

.year-table > thead > tr.group-row > th {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--c-text-muted);
	padding-bottom: 4px;
}

.year-table > thead > tr.group-row > th[rowspan] { vertical-align: bottom; }

.cell-note {
	display: block;
	font-size: 11px;
	color: var(--c-text-muted);
	line-height: 1.3;
	margin-top: 1px;
}

/* Nástěnka – měsíc den po dni. Každý výkaz dne na vlastním řádku buňky,
   hodiny za ním tlumeně, ať v prvním pohledu vede zákazník a projekt. */
.day-table .day-name {
	margin-left: 6px;
	font-size: 11px;
	color: var(--c-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.day-table .day-entry { display: block; }
.day-table .day-entry + .day-entry { margin-top: 2px; }
.day-table .day-entry-hours { color: var(--c-text-muted); font-variant-numeric: tabular-nums; }

.day-table > tbody > tr.is-today > td { box-shadow: inset 0 1px 0 var(--c-accent-line), inset 0 -1px 0 var(--c-accent-line); }
.day-table > tbody > tr > td { font-variant-numeric: tabular-nums; }

.day-table .day-entry-icon { margin-right: 4px; color: var(--c-text-muted); font-size: 12px; }
.day-table a:hover .day-name { color: inherit; }

/* Nástěnka – podíl zákazníků na odpracovaném čase: prstenec a vedle něj čísla */
.customers-chart,
.share-chart { position: relative; height: 260px; }

.customers-chart-total,
.share-chart-total {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	transform: translateY(-50%);
	text-align: center;
	pointer-events: none;
	line-height: 1.2;
}

.customers-chart-total strong,
.share-chart-total strong { display: block; font-size: 20px; font-weight: 600; color: var(--c-text); }
.customers-chart-total span,
.share-chart-total span { font-size: 11px; color: var(--c-text-muted); text-transform: uppercase; letter-spacing: 0.06em; }

.customers-dot {
	display: inline-block;
	width: 9px;
	height: 9px;
	border-radius: 2px;
	margin-right: 7px;
	vertical-align: baseline;
}

.customers-table > tbody > tr > td { font-variant-numeric: tabular-nums; }

@media (max-width: 991px) {
	.customers-share .col-md-7 { margin-top: 12px; }
}

.months-chart { position: relative; height: 260px; }


/* ------------------------------------------------------------------ *
 * Našeptávač popisu práce ve výkazu (jQuery UI autocomplete)
 * ------------------------------------------------------------------ */

.ui-autocomplete.ui-menu {
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r);
	box-shadow: var(--shadow-pop);
	padding: 4px;
	max-height: 320px;
	overflow-y: auto;
	overflow-x: hidden;
	z-index: 1060;
}

.ui-autocomplete.ui-menu .ui-menu-item {
	background: none;
	border: none;
	border-radius: var(--r-sm);
	color: var(--c-text);
	cursor: pointer;
	font-size: 13px;
	line-height: 1.35;
	margin: 0;
	padding: 6px 9px;
}

.ui-autocomplete.ui-menu .ui-menu-item.ui-state-focus,
.ui-autocomplete.ui-menu .ui-menu-item.ui-state-active {
	background: var(--c-accent);
	border: none;
	color: #fff;
	font-weight: 400;
	margin: 0;
}

.autocomplete-work-meta {
	display: block;
	font-size: 11px;
	color: var(--c-text-muted);
	margin-top: 1px;
}

.ui-menu-item.ui-state-focus .autocomplete-work-meta,
.ui-menu-item.ui-state-active .autocomplete-work-meta { color: rgba(255, 255, 255, 0.75); }

/* ------------------------------------------------------------------ *
 * Podklad k fakturaci klientovi
 * ------------------------------------------------------------------ */

/* Nadpis vlevo, celkové číslo vpravo. Dřív bylo číslo pozicované absolutně, což
   ho pouštělo přes obsah pod hlavičkou – třeba přes proužek s párováním. */
.summary-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 6px 24px;
	border-bottom: 2px solid var(--c-line-strong);
	padding-bottom: 10px;
	margin-bottom: 18px;
}

.summary-head-main { flex: 1 1 auto; min-width: 0; }

.summary-head h3 { margin: 0 0 2px 0; font-size: 19px; font-weight: 600; color: var(--c-text); }
.summary-period { font-size: 12.5px; color: var(--c-text-muted); }

.summary-total {
	flex: 0 0 auto;
	/* text pod číslem je delší než samo číslo, takže se zarovnává doprava k němu */
	text-align: right;
	font-size: 20px;
	font-weight: 600;
	color: var(--c-accent);
	font-variant-numeric: tabular-nums;
}

.summary-table { margin-bottom: 26px; }
.summary-table > thead > tr > th { font-size: 13px; }
.summary-table > thead > tr > th:first-child { color: var(--c-text); font-weight: 600; }
.summary-table > tbody > tr > td { font-variant-numeric: tabular-nums; }
.summary-table > tbody > tr.summary-subtotal > td { background: var(--c-surface-2); border-top: 1px solid var(--c-line-strong); }

.summary-grand {
	border-top: 2px solid var(--c-line-strong);
	padding-top: 12px;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 15px;
}

.summary-grand strong { font-size: 20px; color: var(--c-accent); font-variant-numeric: tabular-nums; }
.summary-grand-worked { color: var(--c-text-muted); font-size: 13px; margin-right: 12px; }
/* rozpis pod celkovým číslem: na jednom řádku, ať se „z 62,50 h odpracovaných,
   212,50 h fakturovatelných" netrhá na dvě půlky */
.summary-total-worked {
	display: block;
	margin-top: 3px;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.5;
	white-space: nowrap;
	color: var(--c-text-muted);
}

.summary-input { height: 30px; padding: 4px 8px; font-size: 13px; }
.summary-table > tbody > tr.summary-corrected > td { background: var(--c-warn-soft); }
.summary-table > tbody > tr.summary-corrected > td:first-child::before {
	content: '\f303';
	font-family: 'Font Awesome 5 Pro', 'Font Awesome 5 Free';
	font-weight: 900;
	font-size: 10px;
	color: var(--c-warn);
	margin-right: 7px;
}

.summary-actions {
	display: flex;
	align-items: center;
	gap: 14px;
	border-top: 1px solid var(--c-line);
	padding-top: 14px;
	margin-top: 4px;
}

.summary-actions-note,
.summary-period-note { font-size: 12.5px; color: var(--c-text-muted); }

/* Stavy řádků podkladu. Odložený řádek z dřívějška se musí poznat na první
   pohled – proto nejen barva, ale i svislý pruh a popisek s původním měsícem. */
/* Select2 v hustém řádku podkladu – stejná výška jako pole s hodinami vedle,
   jinak by widget v 34px výchozí velikosti řádky roztahoval. Stejný důvod,
   proč má vlastní pravidla i řádek filtrů nad tabulkou. */
.summary-table .select2-container { max-width: 100%; }
.summary-table .select2-container .select2-selection { height: 30px !important; }
.summary-table .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 28px !important; font-size: 12.5px; }
.summary-table .select2-container--default .select2-selection--single .select2-selection__arrow { height: 28px; }

.summary-origin {
	display: inline-block;
	margin-left: 8px;
	padding: 1px 7px;
	border-radius: var(--r-sm);
	background: var(--c-orange-soft);
	border: 1px solid var(--c-orange-line);
	color: var(--c-orange);
	font-size: 11px;
	white-space: nowrap;
}

/* odložený řádek vyřízený v zobrazeném měsíci – fakturuje se teď, ne že čeká */
.summary-origin.is-resolved {
	background: var(--c-accent-soft);
	border-color: var(--c-accent-line);
	color: var(--c-ok);
}

.summary-table > tbody > tr.summary-deferred-row > td { background: var(--c-orange-soft); }
.summary-table > tbody > tr.summary-deferred-row.is-resolved > td { background: var(--c-accent-soft); }
.summary-table > tbody > tr.summary-deferred-row > td:first-child { box-shadow: inset 3px 0 0 var(--c-orange); }
.summary-table > tbody > tr.summary-deferred-row.is-resolved > td:first-child { box-shadow: inset 3px 0 0 var(--c-accent); }

.summary-table > tbody > tr.summary-skipped > td { color: var(--c-text-soft); }
.summary-table > tbody > tr.summary-skipped > td:first-child { text-decoration: line-through; }

/* Každý projekt vlastní panel – hlavička nese název a stav, spodní lišta hromadné
   akce. Vyřízený projekt je znát zeleným pruhem, ať se pozná i po rozkliknutí. */
.summary-project { margin-bottom: 14px; }
.summary-project > .panel-heading { padding: 10px 16px; }
.summary-project > .panel-heading .panel-title { font-size: 15px; font-weight: 600; }
.summary-project > .panel-body { padding-top: 6px; }
.summary-project .summary-table { margin-bottom: 0; }

/* tabulka položek stojí pod tabulkou hodin – bez odsazení by na sebe navazovaly
   dvě hlavičky a vypadaly by jako jedna tabulka */
.summary-items-table { margin-top: 22px !important; }

/* kdo na řádku dělal – pod popisem práce, ať nesoupeří o pozornost s ním */
.summary-workers { display: block; font-size: 11.5px; color: var(--c-text-soft); margin-top: 1px; }

/* cenové nastavení projektu v hlavičce podkladu – tiché, je to kontext, ne stav */
.summary-price {
	margin-left: 8px;
	padding: 1px 8px;
	border-radius: var(--r-pill);
	background: var(--c-surface-3);
	color: var(--c-text-muted);
	font-size: 11px;
	font-weight: 400;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.summary-project-edit { margin-left: 6px; font-size: 12px; color: var(--c-text-soft); }
.summary-project-edit:hover, .summary-project-edit:focus { color: var(--c-accent); }

/* výběr projektů na fakturu – checkbox stojí před názvem projektu v hlavičce
   panelu, takže musí sedět na účaří nadpisu, ne plavat pod ním */
/* název řádku faktury v náhledu drží zalomení – poznámka k fakturaci je na
   vlastním řádku pod názvem, stejně jako pak na faktuře */
.summary-line-name { white-space: pre-line; }

/* Odkazy do Fakturoidu vypadají všude stejně: štítek jako každý jiný, jen tmavě
   šedý. Odlišuje je to od akcí administrace – kliknutím se odchází jinam.
   Tvar (velikost, rádius, odsazení) dědí z .label, tady jsou jen barvy. */
.fakturoid-link { background: var(--c-text); color: #fff !important; }
.fakturoid-link:hover, .fakturoid-link:focus { background: #000; color: #fff !important; text-decoration: none; }
/* IČO uvnitř štítku – pořád součást odkazu, jen potišeji */
.fakturoid-link-note { opacity: 0.7; }

/* ve sloupci akcí v tabulce nesmí štítek dostat čtvercovou velikost ikony */
.table .actions a.fakturoid-link { width: auto; height: auto; margin-left: 0; color: #fff !important; }

/* proužek s párováním klienta na subjekt ve Fakturoidu: popisek vlevo, výběr
   uprostřed, tlačítka vpravo. Na úzké obrazovce se to zalomí pod sebe. */
.summary-pairing { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
/* popisek se nemá zalamovat, dokud je na řádku místo */
.summary-pairing-text { flex: 0 1 auto; margin: 0; }
/* Select2 si šířku píše inline, jinak by se roztáhl přes celý proužek */
.summary-pairing-select,
.summary-pairing .select2-container { flex: 1 1 240px; max-width: 420px; width: auto !important; }
.summary-pairing-actions { display: flex; flex-wrap: wrap; gap: 6px; }

.summary-project-pick { display: inline-block; margin: 0 6px 0 0; vertical-align: middle; cursor: pointer; }
.summary-project-pick.is-blocked { cursor: help; opacity: 0.45; }
.summary-project-pick.is-blocked input { cursor: help; }
.summary-project-pick input { width: 15px; height: 15px; margin: 0; vertical-align: middle; accent-color: var(--c-accent); cursor: pointer; }

/* obal kolem tlačítek fakturace: na zamčeném tlačítku bublina nefunguje, drží ji
   tedy obal kolem něj */
.summary-project-invoice { display: inline-flex; gap: 6px; }

/* Stav projektu se pozná podle jemného podbarvení celého panelu – při procházení
   seznamu je tak na první pohled vidět, co je hotové a co ještě čeká. */
.summary-project { border-left: 3px solid var(--c-danger); background: var(--c-danger-soft); }
.summary-project.is-done { border-left-color: var(--c-accent); background: var(--c-accent-soft); }
.summary-project > .panel-heading { background: transparent; }

/* pruhování tabulky je vidět i na podbarvení, jen slabší – bílé pruhy by
   podbarvení proděravěly */
.summary-project .table-striped > tbody > tr:nth-of-type(odd) { background: var(--c-stripe-on-tint); }

.summary-project-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	border-top: 1px solid var(--c-line);
	margin-top: 10px;
	padding-top: 10px;
}

.summary-project-actions-spacer { flex: 1 1 auto; }
.summary-done-note { margin-left: 8px; font-size: 11.5px; font-weight: 400; color: var(--c-warn); }

/* Peníze na projektu, které nevznikly z hodin. Do hodinových součtů nepatří,
   proto stojí pod tabulkou jako samostatný pruh: tržba zeleně (jde na fakturu),
   náklad červeně (jen pro kontext). */
.summary-items {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	border-top: 1px solid var(--c-line);
	margin-top: 10px;
	padding-top: 10px;
}

.summary-items-label { font-size: 12.5px; color: var(--c-text-muted); }

.summary-item {
	padding: 2px 9px;
	border-radius: var(--r-pill);
	font-size: 12px;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.summary-item.is-sale { background: var(--c-accent-soft); color: var(--c-ok); }
.summary-item.is-cost { background: var(--c-danger-soft); color: var(--c-danger); }

/* fakturovaný čas zadaný už u výkazu – odlišuje se od korekce v podkladu */
.summary-estimate {
	display: inline-block;
	margin-left: 8px;
	padding: 1px 7px;
	border-radius: var(--r-sm);
	background: var(--c-info-soft);
	border: 1px solid var(--c-info-line);
	color: var(--c-info);
	font-size: 11px;
	white-space: nowrap;
}
.summary-bulk-label { font-size: 12.5px; color: var(--c-text-muted); }

/* ------------------------------------------------------------------ *
 * Týmový kalendář
 * ------------------------------------------------------------------ */

/* žádný clearfix – ve flexu by se z jeho ::before a ::after staly flex položky
   a gap by udělal mezeru i na krajích */
.calendar-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 18px;
	margin-bottom: 16px;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--c-line);
}

.calendar-toolbar::before,
.calendar-toolbar::after { content: none; }

.calendar-worker { width: 220px; }
.calendar-layers { display: flex; gap: 14px; }

.calendar-layer {
	font-weight: 400;
	font-size: 13px;
	color: var(--c-text);
	margin: 0;
	cursor: pointer;
}

.calendar-legend { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }

.calendar-legend-item {
	font-size: 11.5px;
	line-height: 1;
	padding: 5px 9px;
	border-radius: var(--r-sm);
	border: 1px solid transparent;
}

/* události – barvy drží stejná pravidla jako zbytek administrace, ať funguje tmavý režim */
.fc-event.cal-holiday,
.today-chip.cal-holiday,
.calendar-legend-item.cal-holiday { background: var(--c-info-soft); border-color: var(--c-info-line); color: var(--c-info); }

.fc-event.cal-home-office,
.today-chip.cal-home-office,
.calendar-legend-item.cal-home-office { background: var(--c-orange-soft); border-color: var(--c-orange-line); color: var(--c-orange); }

.fc-event.cal-sick,
.today-chip.cal-sick,
.calendar-legend-item.cal-sick { background: var(--c-danger-soft); border-color: transparent; color: var(--c-danger); }

.fc-event.cal-doctor,
.today-chip.cal-doctor,
.calendar-legend-item.cal-doctor { background: var(--c-danger-soft); border-color: transparent; color: var(--c-danger); }

.fc-event.cal-unpaid,
.today-chip.cal-unpaid,
.calendar-legend-item.cal-unpaid { background: var(--c-surface-2); border-color: var(--c-line-strong); color: var(--c-text-soft); }

.fc-event.cal-plan,
.today-chip.cal-plan,
.calendar-legend-item.cal-plan { background: var(--c-teal-soft); border-color: var(--c-teal-line); color: var(--c-teal); }

.fc-event.cal-meeting,
.today-chip.cal-meeting,
.calendar-legend-item.cal-meeting { background: var(--c-purple-soft); border-color: var(--c-purple-line); color: var(--c-purple); }

.fc-event.cal-reminder { background: var(--c-warn-soft); border-color: transparent; color: var(--c-warn); }
.fc-event.cal-reminder.is-late { background: var(--c-danger-soft); color: var(--c-danger); }

.fc-event {
	border-radius: var(--r-sm);
	font-size: 12px;
	padding: 2px 5px;
	border-width: 1px;
	border-style: solid;
}

.fc-event:hover { color: inherit; opacity: 0.85; }
.cal-event-note { opacity: 0.75; margin-left: 6px; font-size: 11px; }

/* mřížka kalendáře do firemní palety */
.fc-unthemed .fc-content,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-list-heading td,
.fc-unthemed .fc-popover,
.fc-unthemed .fc-row,
.fc-unthemed tbody,
.fc-unthemed td,
.fc-unthemed th,
.fc-unthemed thead { border-color: var(--c-line); }

.fc-unthemed .fc-today { background: var(--c-accent-soft); }
.fc-toolbar h2 { font-size: 19px; font-weight: 600; color: var(--c-text); }
.fc-day-header { font-size: 12px; font-weight: 600; color: var(--c-text-muted); padding: 6px 0; }
.fc-day-number { font-size: 12.5px; color: var(--c-text-soft); }
.fc-unthemed .fc-other-month .fc-day-number { opacity: 0.45; }
.fc-day-grid-event { margin: 1px 3px 0; }

.calendar-hint {
	font-size: 12.5px;
	color: var(--c-text-muted);
	margin: -6px 0 12px;
}

/* výběr dnů tažením */
.fc-unthemed .fc-highlight { background: var(--c-accent-soft); opacity: 1; }
.fc-event.cal-plan.fc-draggable,
.fc-event.cal-meeting.fc-draggable { cursor: pointer; }

/* plán, ke kterému už existuje výkaz – ztlumený, ať je vidět, co ještě zbývá */
.fc-event.is-reported { opacity: 0.5; }
.fc-event.is-reported .cal-event-note { font-style: italic; }

#modal-eventForm .form-group { margin-bottom: 12px; }
.calendar-form-hint { font-size: 12px; color: var(--c-text-muted); margin: -4px 0 12px; }
#modal-eventForm textarea { resize: vertical; }

/* ------------------------------------------------------------------ *
 * Plán na dnešek nad formulářem výkazu
 * ------------------------------------------------------------------ */

.plan-today {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	background: var(--c-teal-soft);
	border: 1px solid var(--c-teal-line);
	border-radius: var(--r);
	padding: 9px 12px;
	margin-bottom: 16px;
}

.plan-today-label {
	font-size: 11.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--c-teal);
}

.plan-today-item { display: inline-flex; align-items: center; gap: 8px; }
.plan-today-name { font-size: 13px; color: var(--c-text); }
.plan-today-meta { color: var(--c-text-muted); font-size: 12px; margin-left: 6px; }

.today-plans { display: flex; flex-wrap: wrap; gap: 8px 18px; }

.today-plan,
.today-chip {
	background: var(--c-teal-soft);
	border: 1px solid var(--c-teal-line);
	border-radius: var(--r-sm);
	padding: 6px 10px;
	font-size: 13px;
	color: var(--c-text);
}

.today-plan-meta,
.today-chip-meta { color: currentColor; opacity: 0.75; font-size: 12px; margin-left: 7px; }

.today-chip strong { font-weight: 600; }

.company-plan-separated { border-top: 1px solid var(--c-line); padding-top: 10px; margin-top: 2px; }

.company-plans { display: flex; flex-direction: column; gap: 10px; }

.company-plan {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 12px;
}

.company-plan-worker {
	width: 160px;
	flex: none;
	font-size: 13px;
	font-weight: 600;
	color: var(--c-text);
}

.company-plan-items { display: flex; flex-wrap: wrap; gap: 6px 10px; }

@media (max-width: 767px) {
	.company-plan-worker { width: auto; }
}

/* ---------------------------------------------------------------------------
   Rychlé zadávání výkazu

   Tag nese projekt i popis dohromady – jedno kliknutí vyplní obojí a zbývá
   dopsat hodiny. Barvy jsou z proměnných, ať drží i tmavý režim.
   --------------------------------------------------------------------------- */

.quick-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 16px;
}

/* Ve výchozím stavu tiché – je jich šest a stojí nad formulářem, takže barvou
   soupeřily s tlačítkem Uložit. Zelená se ukáže až pod myší. */
.quick-tag {
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	max-width: 100%;
	background: var(--c-surface-2);
	border: 1px solid var(--c-line);
	border-radius: var(--r-sm);
	padding: 4px 9px;
	font-size: 12.5px;
	line-height: 1.3;
	color: var(--c-text);
	cursor: pointer;
	text-align: left;
}

.quick-tag:hover,
.quick-tag:focus {
	background: var(--c-accent-soft);
	border-color: var(--c-accent-line);
	color: var(--c-accent);
	outline: none;
}

.quick-tag-name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 260px;
}

.quick-tag-project,
.quick-tag-uses {
	font-size: 11px;
	color: var(--c-text-muted);
	white-space: nowrap;
}

.quick-tag-project {
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 180px;
}

/* hvězdička sedí na tagu vpravo, ale je to vlastní odkaz – tlačítko v tlačítku
   by nebylo platné HTML */
.quick-tag-wrap { display: inline-flex; align-items: stretch; }

.quick-tag-wrap .quick-tag {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-right: 0;
}

.quick-tag-star {
	display: inline-flex;
	align-items: center;
	padding: 0 7px;
	background: var(--c-surface-2);
	border: 1px solid var(--c-line);
	border-top-right-radius: var(--r-sm);
	border-bottom-right-radius: var(--r-sm);
	color: var(--c-warn);
	font-size: 11px;
	line-height: 1;
}

.quick-tag-star:hover,
.quick-tag-star:focus {
	background: var(--c-danger-soft);
	border-color: var(--c-danger-soft);
	color: var(--c-danger);
	text-decoration: none;
}

.quick-tags-empty {
	font-size: 12.5px;
	color: var(--c-text-muted);
	line-height: 1.5;
}

.quick-tags-empty .fa-star { color: var(--c-warn); }

/* hvězdička u řádku výpisu – vedle kopírování a zopakování */
.favourite-btn { color: var(--c-text-soft); }
.favourite-btn:hover, .favourite-btn:focus { color: var(--c-warn); text-decoration: none; }
.favourite-btn.is-on { color: var(--c-warn); }

/* rychlé délky pod polem Hodiny */
.hours-quick { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }

.hours-quick-btn {
	background: var(--c-surface-2);
	border: 1px solid var(--c-line);
	border-radius: var(--r-sm);
	padding: 2px 7px;
	font-size: 11.5px;
	color: var(--c-text-muted);
	cursor: pointer;
}

.hours-quick-btn:hover,
.hours-quick-btn:focus {
	background: var(--c-accent-soft);
	border-color: var(--c-accent-line);
	color: var(--c-accent);
	outline: none;
}

.hours-quick-rest { font-weight: 600; }

/* zopakování řádku z výpisu do formuláře */
.repeat-btn { margin-left: 2px; }

.form-hint {
	margin-left: 12px;
	font-size: 12px;
	color: var(--c-text-muted);
}

/* ---------------------------------------------------------------------------
   Token API

   Ukazuje se jedinkrát, takže musí jít snadno vybrat a zkopírovat. Není to
   .alert – ten je ve flexu a popisek s tokenem by skončily na jednom řádku.
   --------------------------------------------------------------------------- */

.api-token-new {
	background: var(--c-ok-soft);
	border-radius: var(--r);
	padding: 12px 14px;
	margin-bottom: 16px;
}

.api-token-new-head {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	font-size: 13px;
	color: var(--c-ok);
	margin-bottom: 9px;
}

.api-token-value {
	display: flex;
	align-items: stretch;
	gap: 8px;
}

.api-token-value code {
	flex: 1 1 auto;
	min-width: 0;
	overflow-x: auto;
	white-space: nowrap;
	font-size: 13px;
	letter-spacing: 0.02em;
	padding: 8px 11px;
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r-sm);
	color: var(--c-text);
}

/* .copy-btn je jinde skrytá do najetí myší; tady musí být vidět pořád */
.copy-btn.api-token-copy {
	opacity: 1;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-left: 0;
	padding: 0 13px;
	font-size: 12.5px;
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r-sm);
	color: var(--c-text-muted);
	white-space: nowrap;
}

.copy-btn.api-token-copy:hover,
.copy-btn.api-token-copy:focus {
	border-color: var(--c-accent-line);
	background: var(--c-accent-soft);
	color: var(--c-accent);
}

.copy-btn.api-token-copy.is-copied {
	border-color: var(--c-accent);
	background: var(--c-accent-soft);
	color: var(--c-accent);
}

/* rozbalené podrobnosti požadavku v logu API */
.log-detail { margin-top: 4px; font-size: 12px; }

.log-detail summary {
	cursor: pointer;
	color: var(--c-text-muted);
	list-style: none;
}

.log-detail summary::-webkit-details-marker { display: none; }
.log-detail summary::before { content: '▸ '; }
.log-detail[open] summary::before { content: '▾ '; }
.log-detail summary:hover { color: var(--c-accent); }

.log-detail dl {
	display: grid;
	grid-template-columns: 68px 1fr;
	gap: 3px 10px;
	margin: 7px 0 4px;
	padding: 9px 11px;
	background: var(--c-surface-2);
	border: 1px solid var(--c-line);
	border-radius: var(--r-sm);
}

.log-detail dl > div { display: contents; }
.log-detail dt { color: var(--c-text-muted); font-weight: 400; }
.log-detail dd { margin: 0; color: var(--c-text); min-width: 0; }

.log-detail pre {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-size: 11.5px;
	white-space: pre-wrap;
	word-break: break-word;
	color: var(--c-text);
}

.log-detail-inline { margin-top: 3px; font-size: 12px; }

.log-detail-field {
	display: block;
	color: var(--c-danger);
}

.log-detail-field code { margin-right: 4px; }

/* -------------------------------------------------------------------------
   Nápověda k modulu

   Věta pod nadpisem říká, k čemu modul je; otazník za nadpisem otevírá modal
   s podrobnostmi. Obojí je kontext, ne obsah stránky – proto tiché barvy
   a žádné orámování, které by soupeřilo s panely pod tím.
   ------------------------------------------------------------------------- */

.page-help {
	margin-left: 8px;
	font-size: 15px;
	color: var(--c-text-soft);
	vertical-align: 1px;
}

.page-help:hover,
.page-help:focus { color: var(--c-accent); }

.page-lead {
	margin: 5px 0 0 0;
	max-width: 900px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--c-text-muted);
}

/* obsah modalu – čte se to jako text, ne jako tabulka administrace */
.module-help { font-size: 13.5px; line-height: 1.65; }

.module-help h5 {
	margin: 18px 0 6px 0;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--c-text-muted);
}

.module-help h5:first-child { margin-top: 0; }

.module-help p { margin: 0 0 10px 0; }

.module-help ul {
	margin: 0 0 12px 0;
	padding-left: 18px;
}

.module-help li { margin-bottom: 5px; }

.module-help code {
	padding: 1px 5px;
	border-radius: var(--r-sm);
	background: var(--c-surface-2);
	border: 1px solid var(--c-line);
	color: var(--c-text);
	font-size: 12px;
}

/* poznámka na konci – to, co se nejčastěji plete */
.module-help .help-note {
	margin-top: 16px;
	padding: 10px 12px;
	border-left: 3px solid var(--c-accent);
	background: var(--c-surface-2);
	border-radius: 0 var(--r-sm) var(--r-sm) 0;
	color: var(--c-text-muted);
}

.module-help .help-note p:last-child { margin-bottom: 0; }

/* -------------------------------------------------------------------------
   Denní pruh nad formulářem výkazu

   Kolik z dnešního fondu je zapsané. Barvy jdou z proměnných, aby to sedělo
   i v tmavém režimu: rozpracovaný den akcentem, splněný zeleně, přesčas
   oranžově a den, kdy se nic nečeká (víkend, svátek), jen v šedé.
   ------------------------------------------------------------------------- */

.day-bar {
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	padding: 10px 14px 12px;
	margin-bottom: 14px;
}

.day-bar-head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
	margin-bottom: 8px;
}

.day-bar-label {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--c-text-muted);
}

.day-bar-date {
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
	color: var(--c-text-soft);
	margin-left: 4px;
}

/* číslo je to hlavní, co se na pruhu čte – ať drží šířku při přepočtu */
.day-bar-numbers {
	font-size: 15px;
	color: var(--c-text-muted);
	font-variant-numeric: tabular-nums;
}

.day-bar-numbers strong {
	font-size: 19px;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--c-text);
}

.day-bar-state {
	margin-left: auto;
	font-size: 12.5px;
	color: var(--c-accent);
	font-weight: 600;
}

.day-bar-track {
	height: 8px;
	background: var(--c-surface-3);
	border-radius: 999px;
	overflow: hidden;
}

.day-bar-fill {
	height: 100%;
	background: var(--c-accent);
	border-radius: 999px;
	transition: width 0.35s ease;
}

.day-bar.is-done .day-bar-fill,
.day-bar.is-done .day-bar-state { color: var(--c-ok); }
.day-bar.is-done .day-bar-fill { background: var(--c-ok); }

.day-bar.is-over .day-bar-fill { background: var(--c-warn); }
.day-bar.is-over .day-bar-state { color: var(--c-warn); }

.day-bar.is-off .day-bar-fill { background: var(--c-text-soft); }
.day-bar.is-off .day-bar-state { color: var(--c-text-soft); font-weight: 400; }

@media (max-width: 767px) {
	.day-bar-state { margin-left: 0; width: 100%; }
}

/* Ohňostroj za splněný denní úvazek (`celebrateDayGoal()` v custom.js). Leží přes
   celou obrazovku nad vším včetně modalů, ale nic nechytá – pod ním se dá dál psát.
   Canvas se po dohrání sám odstraní z DOMu. */
.day-cheer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 2000;
}

/* Hláška uprostřed obrazovky. Doskočí, chvíli drží a odejde nahoru – zmizí dřív,
   než ohňostroj dohoří, aby nepřekážela v dalším řádku výkazu. */
.day-cheer-badge {
	position: fixed;
	top: 34%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2001;
	pointer-events: none;
	text-align: center;
	padding: 16px 34px;
	border-radius: var(--r-lg);
	background: var(--c-surface);
	border: 1px solid var(--c-accent-line);
	box-shadow: var(--shadow-pop);
	animation: dayCheerIn 0.5s cubic-bezier(0.18, 1.5, 0.5, 1) both;
}

.day-cheer-badge strong {
	display: block;
	font-size: 27px;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--c-accent);
}

.day-cheer-badge span {
	display: block;
	margin-top: 2px;
	font-size: 13px;
	color: var(--c-text-muted);
}

.day-cheer-badge.is-leaving {
	animation: dayCheerOut 0.6s ease forwards;
}

@keyframes dayCheerIn {
	from { opacity: 0; transform: translate(-50%, -50%) scale(0.6); }
	to   { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

@keyframes dayCheerOut {
	from { opacity: 1; transform: translate(-50%, -50%) scale(1); }
	to   { opacity: 0; transform: translate(-50%, -90%) scale(0.95); }
}


/* =========================================================================
   Avatary (`avatar()` v Latte, `AvatarsService`)
   Kolečko s fotkou, bez fotky iniciály na barvě odvozené ze jména. Velikost
   se předává proměnnou --avatar-size, aby jedna třída sloužila všude.
   ========================================================================= */

/* modern.css má vlastní .avatar (záporné okraje, float); tady se nuluje */
.avatar {
	--avatar-size: 24px;
	position: static;
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--avatar-size);
	height: var(--avatar-size);
	border-radius: 50%;
	overflow: hidden;
	flex: none;
	vertical-align: middle;
	background: var(--c-avatar-7);
	color: #fff;
	font-size: calc(var(--avatar-size) * 0.4);
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1;
	user-select: none;
}

.avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

.avatar-c1 { background: var(--c-avatar-1); }
.avatar-c2 { background: var(--c-avatar-2); }
.avatar-c3 { background: var(--c-avatar-3); }
.avatar-c4 { background: var(--c-avatar-4); }
.avatar-c5 { background: var(--c-avatar-5); }
.avatar-c6 { background: var(--c-avatar-6); }
.avatar-c7 { background: var(--c-avatar-7); }
.avatar-c8 { background: var(--c-avatar-8); }

/* jméno s kolečkem před sebou */
.avatar-name { display: inline-flex; align-items: center; gap: 7px; }

/* horní lišta: kolečko místo ikony uživatele */
.top-menu .navbar-nav > li > a .user-name .avatar { margin-right: 6px; }

/* stránka účtu */
.avatar-card { display: flex; align-items: center; gap: 18px; margin-bottom: 22px; }
.avatar-card .avatar { --avatar-size: 96px; }
.avatar-card-note { font-size: 12.5px; color: var(--c-text-muted); }
.avatar-card .avatar-card-note { margin: 4px 0 8px; }
.worker-card-name { font-size: 16px; font-weight: 600; }
/* Bootstrap odsazuje inline checkbox pro nativní zaškrtávátko, které tu nahrazuje plugin */
/* Bootstrap odsazuje inline radio/checkbox pro nativní prvek posunutý absolutně;
   tady ho nahrazuje plugin uniform, takže odsazení jen dělá díru vlevo */
.radio-inline, .checkbox-inline { padding-left: 0; display: inline-flex; align-items: center; gap: 6px; }
.radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline { margin-left: 0; }


/* =========================================================================
   Svátky a narozeniny (`CelebrationsControl`)
   Panel „Dnes slaví": oslavenec s čepičkou, kdo už popřál, a formulář na přání.
   ========================================================================= */

.celebrations .celebrations-icon { color: var(--c-heart); margin-right: 4px; }
.celebrations.has-today { border-color: var(--c-accent-line) !important; }
.celebrations-today { display: flex; flex-direction: column; gap: 14px; }

.celebration {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
	padding: 12px 14px;
	border-radius: var(--r);
	background: var(--c-surface-2);
	border: 1px solid var(--c-line);
}

.celebration.is-me { background: var(--c-accent-soft); border-color: var(--c-accent-line); }
.celebration-who { display: flex; align-items: center; gap: 14px; min-width: 260px; }
.celebration-avatar { position: relative; display: inline-block; flex: none; }

.celebration-hat {
	position: absolute;
	top: -8px;
	right: -8px;
	font-size: 20px;
	line-height: 1;
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.2));
	animation: celebrationBounce 1.6s ease-in-out infinite;
}

@keyframes celebrationBounce {
	0%, 100% { transform: translateY(0) rotate(-8deg); }
	50%      { transform: translateY(-3px) rotate(8deg); }
}

.celebration-text { display: flex; flex-direction: column; gap: 2px; }
.celebration-text strong { font-size: 15px; }
.celebration-sub { font-size: 12.5px; color: var(--c-text-muted); }

.celebration-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-left: auto; }
.celebration-wishers { display: inline-flex; }
.celebration-wishers .avatar { margin-left: -6px; box-shadow: 0 0 0 2px var(--c-surface-2); }
.celebration-wishers .avatar:first-child { margin-left: 0; }
.celebration-form { display: flex; gap: 6px; align-items: center; }
.celebration-form .form-control { width: 260px; max-width: 100%; }
.celebration-done { font-size: 13px; color: var(--c-ok); font-weight: 600; }
.celebration-done em { font-weight: 400; color: var(--c-text-muted); }

.celebration-wishes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; flex: 1 1 320px; }
.celebration-wishes li { display: flex; align-items: center; gap: 8px; font-size: 13px; }

.celebrations-upcoming { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: 12.5px; color: var(--c-text-muted); }
.celebrations-today + .celebrations-upcoming { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--c-line-strong); }
.celebrations-upcoming-label { font-weight: 600; }
.celebrations-upcoming-item { display: inline-flex; align-items: center; gap: 6px; }

@media (prefers-reduced-motion: reduce) { .celebration-hat { animation: none; } }
@media (max-width: 767px) { .celebration-actions { margin-left: 0; width: 100%; } .celebration-form .form-control { width: 100%; } }


/* =========================================================================
   Kdo je dnes kde (`WhereaboutsService`, nástěnka)
   Řada avatarů po skupinách: kancelář, oběd, home office, lékař, volno.
   ========================================================================= */

.whereabouts-groups { display: flex; flex-wrap: wrap; gap: 14px 28px; }
.whereabouts-group { display: flex; flex-direction: column; gap: 8px; }

.whereabouts-label {
	font-size: 10.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--c-text-muted);
}

.whereabouts-n { color: var(--c-text); margin-left: 2px; font-variant-numeric: tabular-nums; }
.whereabouts-people { display: flex; flex-wrap: wrap; gap: 8px 2px; }
.whereabouts-person { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; width: 68px; padding-top: 4px; }
.whereabouts-person .avatar { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-line); }
.whereabouts-name { font-size: 12px; color: var(--c-text-muted); max-width: 68px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* barva kroužku říká stav, stejně jako štítky v kalendáři */
.whereabouts-group.is-office .avatar { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-accent-line); }
.whereabouts-group.is-lunch .avatar { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-heart); }
.whereabouts-group.is-home_office .avatar { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-orange-line); }
.whereabouts-group.is-doctor .avatar,
.whereabouts-group.is-sick .avatar { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-danger); opacity: 0.85; }
.whereabouts-group.is-holiday .avatar { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-info-line); opacity: 0.85; }
.whereabouts-group.is-unpaid .avatar { opacity: 0.6; }


/* =========================================================================
   Ankety (`PollsControl`)
   Karta s otázkou; možnosti jsou řádky s pruhem podle podílu hlasů, kliknutím
   se hlasuje. Vedoucí možnost má zelený pruh, moje volba zaškrtnutí.
   ========================================================================= */

.polls { display: flex; flex-direction: column; gap: 0; }
.poll .poll-icon { color: var(--c-purple); margin-right: 4px; }
.poll.is-closed .panel-title { color: var(--c-text-muted); }
.poll .panel-heading { flex-wrap: wrap; gap: 6px 14px; }
.poll .panel-heading .poll-meta { margin-left: auto; }
.poll-tools { display: inline-flex; gap: 6px; }
.poll-description { color: var(--c-text-muted); font-size: 13px; margin: 0 0 12px; max-width: 72ch; }
.poll-options { display: flex; flex-direction: column; gap: 6px; }

.poll-option {
	position: relative;
	display: block;
	overflow: hidden;
	border: 1px solid var(--c-line);
	border-radius: var(--r);
	background: var(--c-surface);
	color: var(--c-text);
	text-decoration: none !important;
	transition: border-color 0.15s ease, transform 0.12s ease;
}

a.poll-option:hover, a.poll-option:focus { border-color: var(--c-accent); color: var(--c-text); }
a.poll-option:active { transform: scale(0.995); }
.poll-option.is-mine { border-color: var(--c-accent-line); }

.poll-option-bar {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	background: var(--c-surface-3);
	transition: width 0.4s ease;
}

.poll-option.is-leading .poll-option-bar { background: var(--c-accent-soft); }
.poll-option-row { position: relative; display: flex; align-items: center; gap: 10px; padding: 9px 12px; }
.poll-option-check { color: var(--c-text-soft); font-size: 15px; width: 18px; text-align: center; flex: none; }
.poll-option.is-mine .poll-option-check { color: var(--c-accent); }
.poll-option-title { font-weight: 600; font-size: 13.5px; flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.poll-option-people { display: inline-flex; }
.poll-option-people .avatar { margin-left: -6px; box-shadow: 0 0 0 2px var(--c-surface); }
.poll-option-people .avatar:first-child { margin-left: 0; }
.poll-option-count { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; min-width: 64px; text-align: right; }
.poll-option-percent { color: var(--c-text-muted); font-weight: 400; font-size: 12px; }
.poll-hint { margin: 10px 0 0; font-size: 12px; color: var(--c-text-soft); }
.poll.is-closed .poll-option { opacity: 0.9; }
.polls-section-title { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--c-text-muted); margin: 8px 0 10px; }
.poll-type { display: flex; gap: 18px; }
/* checkbox si z Nette nese vlastní <label> s popiskem; Bootstrap ho odsazuje kvůli nativnímu prvku */
.poll-check label { padding-left: 0; display: inline-flex; align-items: center; gap: 6px; font-weight: 400; }


/* =========================================================================
   Společný oběd (`LunchControl`)
   Panel na nástěnce: vlevo jídelníček se srdíčky, vpravo jdu / nejdu, židle,
   které se plní, a skupiny jmen. Štítek s počtem sedí v horní liště.
   ========================================================================= */

.lunch-panel .panel-heading { flex-wrap: wrap; gap: 6px 14px; }
.lunch-panel .panel-title { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; }
.lunch-panel .lunch-pot { font-size: 15px; color: var(--c-accent); }
.lunch-heading-day { font-size: 13px; color: var(--c-text-muted); }
.lunch-heading-day strong { color: var(--c-text); font-weight: 600; }
.lunch-panel .panel-heading .lunch-heading-state { display: inline-flex; align-items: center; gap: 5px; }
.lunch-panel.is-reserved .lunch-heading-state { color: var(--c-ok); font-weight: 600; }
.lunch-panel.is-cancelled .lunch-heading-state,
.lunch-panel.is-closed .lunch-heading-state { color: var(--c-text-soft); }
.lunch-heading-tools { display: inline-flex; gap: 6px; }
.lunch-tool { color: var(--c-text-soft); padding: 0 3px; }
.lunch-tool:hover, .lunch-tool:focus { color: var(--c-accent); text-decoration: none; }

.lunch-panel .panel-body.lunch-body {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr);
	padding: 0 !important;
}

/* clearfix Bootstrapu (::before/::after) by se v gridu stal buňkou a rozhodil sloupce */
.lunch-panel .panel-body.lunch-body::before,
.lunch-panel .panel-body.lunch-body::after { display: none; }

.lunch-menu { padding: 14px 16px 16px; border-right: 1px solid var(--c-line); min-width: 0; }
.lunch-who { padding: 14px 16px 16px; background: var(--c-surface-2); display: flex; flex-direction: column; gap: 14px; border-radius: 0 var(--r-lg) var(--r-lg) 0; }

@media (max-width: 991px) {
	.lunch-panel .panel-body.lunch-body { grid-template-columns: 1fr; }
	.lunch-menu { border-right: 0; border-bottom: 1px solid var(--c-line); }
	.lunch-who { border-radius: 0 0 var(--r-lg) var(--r-lg); }
}

.lunch-label {
	display: block;
	font-size: 10.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--c-text-muted);
}

.lunch-label-n { color: var(--c-text); font-variant-numeric: tabular-nums; margin-left: 2px; }

.lunch-menu-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.lunch-menu-source { margin-left: auto; font-size: 11.5px; color: var(--c-text-soft); display: inline-flex; gap: 6px; align-items: center; }
.lunch-menu-source a { color: inherit; text-decoration: underline; }
.lunch-menu-source a.lunch-tool { text-decoration: none; }

/* jídlo: vlevo váha (u polévky pára), uprostřed název, vpravo cena a srdíčko */
.lunch-dish {
	display: grid;
	grid-template-columns: 46px minmax(0, 1fr) auto;
	gap: 4px 12px;
	align-items: center;
	padding: 9px 0;
	border-top: 1px solid var(--c-line);
}

.lunch-dish:first-child { border-top: 0; }

.lunch-dish.is-soup {
	margin: 0 -16px 2px;
	padding: 10px 16px;
	border-top: 0;
	background: linear-gradient(90deg, var(--c-accent-soft), transparent 75%);
}

.lunch-dish-side { text-align: left; }
.lunch-dish-weight { font-size: 11.5px; color: var(--c-text-soft); font-variant-numeric: tabular-nums; }
.lunch-dish-main { min-width: 0; }
.lunch-dish-kind { display: block; font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-accent); }
.lunch-dish-name { display: block; font-size: 13.5px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.lunch-dish-actions { display: inline-flex; align-items: center; gap: 8px; justify-self: end; }
.lunch-dish-price { font-size: 12.5px; color: var(--c-text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }

.lunch-favourite {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 3px;
	padding: 1px 8px;
	border-radius: var(--r-pill);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--c-heart);
	background: var(--c-heart-soft);
}

/* pára nad polévkou – tři proužky, které stoupají a mizí */
.lunch-steam { position: relative; display: block; width: 46px; height: 22px; }

.lunch-steam span {
	position: absolute;
	bottom: 0;
	width: 3px;
	height: 12px;
	border-radius: 3px;
	background: var(--c-accent);
	opacity: 0.35;
	animation: lunchSteam 2.4s ease-in-out infinite;
}

.lunch-steam span:nth-child(1) { left: 10px; }
.lunch-steam span:nth-child(2) { left: 19px; animation-delay: 0.6s; }
.lunch-steam span:nth-child(3) { left: 28px; animation-delay: 1.2s; }

@keyframes lunchSteam {
	0%   { transform: translateY(5px) scaleY(0.6); opacity: 0; }
	40%  { opacity: 0.5; }
	100% { transform: translateY(-7px) scaleY(1.1); opacity: 0; }
}

/* srdíčko: obrys, po kliknutí plné v paprikové */
.lunch-like {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 10px 4px 8px;
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r-pill);
	background: var(--c-surface);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--c-text-muted);
	font-variant-numeric: tabular-nums;
	text-decoration: none !important;
	transition: transform 0.12s ease, background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

a.lunch-like:hover, a.lunch-like:focus { color: var(--c-heart); border-color: var(--c-heart); }
a.lunch-like:active { transform: scale(0.94); }
.lunch-like.is-on { background: var(--c-heart); border-color: var(--c-heart); color: #fff; }
.lunch-like.is-on i { animation: lunchPop 0.35s ease; }
.lunch-like.is-static { cursor: default; }
.lunch-like.is-static.is-empty { opacity: 0.5; }

@keyframes lunchPop {
	0%   { transform: scale(1); }
	40%  { transform: scale(1.5) rotate(-12deg); }
	100% { transform: scale(1); }
}

/* kolečka jsou obecné avatary (.avatar), tady jen doplňky */
.lunch-avatar.is-me { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-accent); }
.avatar.is-more { background: var(--c-surface-3); color: var(--c-text-muted); }
.lunch-likers { display: inline-flex; }
.lunch-likers .lunch-avatar { margin-left: -6px; box-shadow: 0 0 0 2px var(--c-surface); }
.lunch-likers .lunch-avatar.is-me { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 4px var(--c-accent); }
.lunch-likers .lunch-avatar:first-child { margin-left: 0; }

.lunch-menu-empty {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 18px 6px;
	color: var(--c-text-muted);
	font-size: 13px;
}

.lunch-menu-empty-icon,
.lunch-none .lunch-menu-empty-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--c-surface-3);
	color: var(--c-text-soft);
	font-size: 15px;
	flex: none;
}

.lunch-none { display: flex; align-items: center; gap: 12px; color: var(--c-text-muted); }

/* jdu / nejdu – dvě velká tlačítka */
.lunch-rsvp { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

.lunch-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1px;
	padding: 10px 12px;
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r);
	background: var(--c-surface);
	color: var(--c-text);
	text-align: center;
	text-decoration: none !important;
	transition: transform 0.12s ease, background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

a.lunch-btn:hover, a.lunch-btn:focus { border-color: var(--c-accent); color: var(--c-text); }
a.lunch-btn.is-no:hover, a.lunch-btn.is-no:focus { border-color: var(--c-text-muted); }
a.lunch-btn:active { transform: scale(0.97); }
.lunch-btn-title { font-size: 14px; font-weight: 700; }
.lunch-btn-note { font-size: 11px; color: var(--c-text-muted); }
.lunch-btn.is-go.is-on { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }
.lunch-btn.is-go.is-on .lunch-btn-note { color: rgba(255, 255, 255, 0.85); }
.lunch-btn.is-no.is-on { background: var(--c-text); border-color: var(--c-text); color: var(--c-surface); }
.lunch-btn.is-no.is-on .lunch-btn-note { color: var(--c-surface); opacity: 0.75; }

/* po uzávěrce místo tlačítek jen stav – tlačítka, na která se nedá kliknout, tu nemají co dělat */
.lunch-locked {
	padding: 10px 12px;
	border: 1px solid var(--c-line);
	border-radius: var(--r);
	background: var(--c-surface);
	text-align: center;
}

.lunch-locked-title { display: block; font-size: 14px; font-weight: 700; }
.lunch-locked-note { display: block; font-size: 11px; color: var(--c-text-muted); }
.lunch-locked.is-go { border-color: var(--c-accent-line); background: var(--c-accent-soft); }
.lunch-locked.is-go .lunch-locked-title { color: var(--c-ok); }

/* počet a židle */
.lunch-table { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--r); padding: 10px 12px; }
.lunch-count { display: flex; align-items: baseline; gap: 8px; }
.lunch-count-n { font-size: 30px; font-weight: 700; line-height: 1; letter-spacing: -0.02em; color: var(--c-accent); font-variant-numeric: tabular-nums; }
.lunch-count-label { font-size: 12.5px; color: var(--c-text-muted); }
.lunch-count-label strong { color: var(--c-text); font-weight: 600; }
.lunch-seats { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }

.lunch-seat {
	width: 16px;
	height: 16px;
	border-radius: 5px 5px 3px 3px;
	border: 1.5px solid var(--c-line-strong);
	transition: background 0.25s ease, border-color 0.25s ease;
}

.lunch-seat.is-on { background: var(--c-accent); border-color: var(--c-accent); animation: lunchSeat 0.4s ease; }

@keyframes lunchSeat {
	0%   { transform: translateY(-5px); }
	60%  { transform: translateY(2px); }
	100% { transform: none; }
}

/* skupiny jmen */
.lunch-group .lunch-label { margin-bottom: 6px; }
.lunch-people { display: flex; flex-wrap: wrap; gap: 5px; }

.lunch-person {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 2px 9px 2px 2px;
	border: 1px solid var(--c-line);
	border-radius: var(--r-pill);
	background: var(--c-surface);
	font-size: 12px;
	color: var(--c-text);
}

.lunch-person.is-me { border-color: var(--c-accent-line); }
.lunch-person.is-off { opacity: 0.6; }
.lunch-person.is-pending { border-style: dashed; color: var(--c-text-muted); }
.lunch-person.is-pending .avatar { opacity: 0.55; }
.lunch-person-meta { font-size: 11px; color: var(--c-text-soft); }

/* řádek pro organizátorku */
.lunch-manage {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	padding-top: 10px;
	border-top: 1px dashed var(--c-line-strong);
	font-size: 12px;
}

.lunch-manage-label { color: var(--c-text-muted); margin-right: 4px; }
.lunch-manage-state { color: var(--c-ok); font-weight: 600; margin-right: 4px; }
.lunch-move .dropdown-menu { min-width: 150px; }
.lunch-move.open .dropdown-menu { display: block; }

.lunch-cancelled { display: flex; align-items: center; gap: 12px; color: var(--c-text-muted); }

/* položka v horní liště: ikona jako v menu, počet v kolečku jako u ostatních
   položek – jen zelené, protože to není upozornění, ale dobrá zpráva */
.top-menu .navbar-nav > li > a.lunch-badge .badge { background: var(--c-accent) !important; }
.top-menu .navbar-nav > li > a.lunch-badge.is-reserved .badge { background: var(--c-ok) !important; }

/* kopírování jmen jede přes obecný .copy-btn, který je jinde schovaný do najetí
   a zmenšený; tady má vypadat jako ostatní .btn-xs vedle něj */
.lunch-manage .btn.copy-btn.lunch-copy {
	opacity: 1;
	margin-left: 0;
	padding: 2px 8px;
	border: 1px solid var(--c-line-strong);
	background: var(--c-surface);
	color: var(--c-text);
	font-size: 12px;
	vertical-align: middle;
}
.lunch-manage .btn.copy-btn.lunch-copy i { font-size: 11px; margin-right: 2px; }
.lunch-manage .btn.copy-btn.lunch-copy:hover { color: var(--c-accent); border-color: var(--c-accent); }
.lunch-manage .btn.copy-btn.lunch-copy.is-copied { color: var(--c-accent); }

/* stránka modulu */
.lunch-history td { vertical-align: middle; }
.lunch-top { margin: 0; padding-left: 22px; }
.lunch-top li { padding: 5px 0; border-top: 1px solid var(--c-line); }
.lunch-top li:first-child { border-top: 0; padding-top: 0; }
.lunch-top-title { display: block; font-weight: 600; }
.lunch-top-meta { font-size: 11.5px; color: var(--c-text-soft); }
.lunch-top-meta i { color: var(--c-heart); }

@media (prefers-reduced-motion: reduce) {
	.lunch-steam span, .lunch-like.is-on i, .lunch-seat.is-on { animation: none; }
}