@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;550;600;650;700;750&display=swap');

/* ==========================================================================
   FlexiLife Houses — firemní design systém
   Ink (grafitová z loga) + jantarová (firemní izometrický vzor) na bílé.
   Zelená/červená/modrá jsou vyhrazené pro sémantické stavy, ne pro branding.
   ========================================================================== */
:root {
    --ink: #1d2731;
    --ink-2: #2a3947;
    --ink-3: #3a4b5c;
    --accent: #e1863b;
    --accent-strong: #b4560c;
    --accent-soft: #f3c48f;
    --accent-tint: #fdf3e7;
    --accent-line: #f0d9bd;
    --ok: #1e9c44;
    --ok-dark: #14753a;
    --ok-tint: #edf9f1;
    --text: #21262c;
    --text-muted: #66707b;
    --surface-subtle: #f5f6f8;
    --surface: #fff;
    --border: #e0e4e9;
    --border-soft: #eceff2;
    --danger: #b42318;
    --warning: #b76e00;
    --blue: #2563eb;
    font-family: Inter, system-ui, "Segoe UI", sans-serif;
    color: var(--text);
    background: var(--surface-subtle);
    font-synthesis: none;
    text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--surface-subtle); }
body { min-height: 100vh; margin: 0; background: var(--surface-subtle); color: var(--text); font-size: 14px; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .55; }
h1:focus { outline: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
::selection { background: var(--accent-soft); color: var(--ink); }
.main-content a:not([class]) { color: var(--accent-strong); text-decoration-color: var(--accent-soft); }
.main-content a:not([class]):hover { text-decoration-color: var(--accent-strong); }

.page-loading { min-height: 55vh; display: grid; place-items: center; align-content: center; gap: 12px; color: var(--text-muted); font-size: 13px; }
.page-loading span { width: 32px; height: 32px; border: 3px solid var(--border); border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* --- Záhlaví stránky --------------------------------------------------- */
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.eyebrow, .section-kicker { display: flex; align-items: center; gap: 7px; color: var(--accent-strong); font-size: 10px; font-weight: 800; letter-spacing: 1.45px; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px rgba(225, 134, 59, .14); }
.page-heading h1 { margin: 9px 0 7px; font-size: clamp(27px, 3vw, 38px); line-height: 1.12; letter-spacing: -1.1px; }
.page-heading h1 span { color: var(--accent-strong); font-weight: 520; }
.page-heading p { margin: 0; color: var(--text-muted); font-size: 13.5px; }
.heading-actions { display: flex; gap: 9px; }
.button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 16px; border: 1px solid transparent; border-radius: 7px; text-decoration: none; font-size: 12.5px; font-weight: 700; }
.button-primary { background: var(--ink); color: #fff; }
.button-primary:hover { background: var(--ink-2); }
.button-primary span { color: var(--accent-soft); font-size: 16px; }
.button-secondary { border-color: var(--border); background: #fff; color: var(--text); }
.button-secondary:hover { border-color: var(--accent); color: var(--accent-strong); }

/* --- KPI karty --------------------------------------------------------- */
.panel, .kpi-card { border: 1px solid var(--border); border-radius: 9px; background: #fff; }
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-bottom: 16px; }
.kpi-card { position: relative; min-height: 160px; padding: 18px 18px 44px; overflow: hidden; }
.kpi-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--kpi-accent, var(--accent)); }
.kpi-card.accent-green { --kpi-accent: var(--ok); }
.kpi-card.accent-danger { --kpi-accent: var(--danger); }
.kpi-card.accent-amber { --kpi-accent: #d38b19; }
.kpi-card.accent-blue { --kpi-accent: var(--blue); }
.kpi-top { display: flex; align-items: center; justify-content: space-between; color: var(--text-muted); font-size: 10px; font-weight: 800; letter-spacing: 1.1px; }
.kpi-top i { min-width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; background: color-mix(in srgb, var(--kpi-accent, var(--accent)) 10%, white); color: var(--kpi-accent, var(--accent-strong)); font: normal 700 10px/1 inherit; }
.kpi-card > strong { display: block; margin: 12px 0 3px; font-size: 31px; letter-spacing: -1.2px; font-variant-numeric: tabular-nums; }
.kpi-card > p { margin: 0; color: var(--text-muted); font-size: 12px; }
.kpi-card > a { position: absolute; bottom: 15px; color: var(--accent-strong); text-decoration: none; font-size: 11px; font-weight: 700; }
.mini-bars { position: absolute; right: 18px; bottom: 17px; height: 32px; display: flex; align-items: end; gap: 3px; }
.mini-bars i { width: 5px; height: var(--h); border-radius: 2px 2px 0 0; background: color-mix(in srgb, var(--accent) 55%, white); }

/* --- Fázová osa 0→100 -------------------------------------------------- */
.phase-panel { padding: 19px 21px 22px; margin-bottom: 16px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.panel-heading h2 { margin: 5px 0 0; font-size: 17px; letter-spacing: -.35px; }
.panel-heading > a, .panel-heading.compact > a { color: var(--accent-strong); text-decoration: none; font-size: 11px; font-weight: 700; }
.panel-heading.compact { margin: 0; padding: 18px 19px 15px; border-bottom: 1px solid #eef1f4; }
.phase-rail { position: relative; display: grid; grid-template-columns: repeat(8, 1fr); }
.phase-rail::before { content: ""; position: absolute; top: 19px; left: 5%; right: 5%; height: 2px; background: #e6eaee; }
.phase-step { position: relative; z-index: 1; min-width: 0; text-align: center; }
.phase-point { width: 40px; height: 40px; margin: 0 auto 10px; display: grid; place-items: center; align-content: center; border: 2px solid #dfe4ea; border-radius: 50%; background: #fff; }
.phase-point strong { font-size: 12px; line-height: 1; }
.phase-point span { margin-top: 2px; color: #8a939c; font-size: 8px; }
.phase-step.occupied .phase-point { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(225, 134, 59, .12); }
.phase-step.occupied .phase-point strong { color: var(--accent-strong); }
.phase-step h3 { margin: 0 0 4px; font-size: 11px; }
.phase-step p { margin: 0; color: #89929c; font-size: 10px; white-space: nowrap; }

/* --- Dashboard --------------------------------------------------------- */
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(300px, .8fr); gap: 16px; margin-bottom: 16px; }
.project-list { padding: 0 10px 7px; }
.project-row { min-height: 82px; display: grid; grid-template-columns: minmax(185px, 1.35fr) minmax(130px, .75fr) minmax(150px, 1fr) auto 14px; align-items: center; gap: 14px; padding: 9px; border-bottom: 1px solid #eef1f4; color: var(--text); text-decoration: none; }
.project-row:last-child { border-bottom: 0; }
.project-row:hover { border-radius: 7px; background: #f8f9fb; }
.project-identity { min-width: 0; display: flex; align-items: center; gap: 10px; }
.model-tile { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 7px; background: var(--ink); color: var(--accent-soft); font-size: 10px; font-weight: 800; }
.project-identity div, .project-next { min-width: 0; display: flex; flex-direction: column; }
.project-identity strong { overflow: hidden; font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.project-identity small, .project-next small { margin-top: 4px; color: #7b8590; font-size: 10.5px; }
.project-next small { margin: 0 0 3px; font-size: 9.5px; letter-spacing: .8px; }
.project-stage > span { font-size: 11.5px; font-weight: 650; }
.project-stage { display: grid; grid-template-columns: 1fr auto; gap: 5px 7px; align-items: center; }
.project-stage .progress { grid-column: 1; height: 4px; overflow: hidden; border-radius: 3px; background: #e7ebef; }
.project-stage .progress i { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.project-stage small { grid-column: 2; grid-row: 1 / span 2; color: #76808b; font-size: 10.5px; }
.project-next strong { overflow: hidden; font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.project-next > span { margin-top: 4px; color: var(--text-muted); font-size: 10.5px; }
.status-pill { height: 24px; display: inline-flex; align-items: center; gap: 5px; padding: 0 8px; border-radius: 12px; font-size: 9.5px; font-weight: 700; white-space: nowrap; }
.status-pill i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.status-pill.success { color: var(--ok-dark); background: var(--ok-tint); }
.status-pill.warning { color: #9a6408; background: #fff6df; }
.status-pill.danger { color: var(--danger); background: #fff0ee; }
.status-pill.neutral { color: #68717b; background: #f0f2f4; }
.row-arrow { color: #9aa3ad; font-size: 18px; }

.task-list { padding: 2px 16px; }
.task-row { display: grid; grid-template-columns: 8px 1fr auto; align-items: center; gap: 10px; min-height: 60px; border-bottom: 1px solid #eef1f4; color: var(--text); text-decoration: none; }
.task-row:last-child { border-bottom: 0; }
.priority-dot { width: 7px; height: 7px; border-radius: 50%; background: #a5aeb8; }
.priority-high { background: #d38b19; }
.priority-critical { background: var(--danger); box-shadow: 0 0 0 3px #fae9e7; }
.priority-normal { background: var(--ok); }
.task-row div { min-width: 0; display: flex; flex-direction: column; }
.task-row strong { overflow: hidden; font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.task-row small { margin-top: 4px; color: var(--text-muted); font-size: 10.5px; }
.task-row time { color: #6e7883; font-size: 10.5px; white-space: nowrap; }
.task-row time.overdue { color: var(--danger); font-weight: 700; }
.panel-footer-link { min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; border-top: 1px solid #eef1f4; color: var(--accent-strong); text-decoration: none; font-size: 11px; font-weight: 700; }

.dashboard-lower-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.capacity-list, .activity-list { padding: 8px 19px 14px; }
.capacity-row { min-height: 52px; display: grid; grid-template-columns: minmax(130px, .8fr) minmax(100px, 1.2fr) 40px; align-items: center; gap: 14px; }
.capacity-row > div:first-child { display: flex; flex-direction: column; }
.capacity-row strong { font-size: 11.5px; }
.capacity-row small { margin-top: 3px; color: var(--text-muted); font-size: 10px; }
.capacity-meter { height: 6px; overflow: hidden; border-radius: 4px; background: #e9edf1; }
.capacity-meter i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent-strong), var(--accent)); }
.capacity-row > span { color: var(--text-muted); font-size: 10.5px; text-align: right; }
.activity-row { min-height: 52px; display: grid; grid-template-columns: 9px 1fr; gap: 10px; align-items: center; }
.activity-mark { width: 7px; height: 7px; border-radius: 50%; background: #8a939d; }
.activity-mark.success { background: var(--ok); }
.activity-mark.warning { background: #d38b19; }
.activity-row p { margin: 0; font-size: 11.5px; }
.activity-row small { display: block; margin-top: 4px; color: var(--text-muted); font-size: 10px; }

/* --- Validace a chybové stavy ------------------------------------------ */
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid #e50000; }
.validation-message { color: #e50000; }
.blazor-error-boundary { padding: 1rem; border-radius: 7px; background: #b32121; color: #fff; }
.blazor-error-boundary::after { content: "Došlo k chybě."; }

@media (max-width: 1240px) {
    .kpi-grid { grid-template-columns: repeat(2, 1fr); }
    .project-row { grid-template-columns: minmax(180px, 1.2fr) minmax(120px, .8fr) auto 14px; }
    .project-next { display: none; }
}
@media (max-width: 900px) {
    .dashboard-grid, .dashboard-lower-grid { grid-template-columns: 1fr; }
    .phase-panel { overflow-x: auto; }
    .phase-rail { min-width: 720px; }
}
@media (max-width: 680px) {
    .page-heading { align-items: flex-start; flex-direction: column; }
    .heading-actions { width: 100%; }
    .heading-actions .button { flex: 1; }
    .kpi-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
    .kpi-card { min-height: 140px; padding: 14px; }
    .kpi-card > strong { font-size: 25px; }
    .project-row { grid-template-columns: 1fr auto 12px; }
    .project-stage { display: none; }
    .status-pill { width: 24px; padding: 0; justify-content: center; font-size: 0; }
}

/* --- Sdílené datové plochy --------------------------------------------- */
.summary-strip { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 16px; overflow: hidden; }
.summary-strip > div { padding: 17px 21px; border-right: 1px solid var(--border); }
.summary-strip > div:last-child { border: 0; }
.summary-strip small, .detail-stat-grid small, .service-stat small { display: block; color: var(--text-muted); font-size: 10px; font-weight: 800; letter-spacing: 1px; }
.summary-strip strong { display: block; margin-top: 7px; font-size: 19px; font-variant-numeric: tabular-nums; }
.text-danger { color: var(--danger) !important; }

.portfolio-panel { overflow: hidden; }
.filter-bar { min-height: 64px; display: flex; align-items: center; gap: 10px; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.table-search { min-width: 240px; height: 38px; display: flex; align-items: center; gap: 8px; padding: 0 10px; border: 1px solid var(--border); border-radius: 7px; background: #fafbfc; color: var(--text-muted); }
.table-search input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 12.5px; }
.filter-bar select, .inline-create select, .inline-create input { height: 38px; padding: 0 30px 0 10px; border: 1px solid var(--border); border-radius: 7px; background: #fff; color: var(--text); font-size: 12.5px; }
.result-count { margin-left: auto; color: var(--text-muted); font-size: 11px; }
.data-table-wrap { width: 100%; overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.data-table th { padding: 11px 13px; border-bottom: 1px solid var(--border); background: #f7f8fa; color: #78828c; font-size: 10px; font-weight: 800; letter-spacing: .8px; text-align: left; white-space: nowrap; }
.data-table td { padding: 13px; border-bottom: 1px solid #eef1f4; color: #46505a; vertical-align: middle; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr:not(.risk-note-row):hover td { background: #fafbfc; }
.table-project { min-width: 190px; display: flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none; }
.table-project > span:last-child, .stacked-cell, .data-table td > a { display: flex; flex-direction: column; color: inherit; text-decoration: none; }
.table-project strong, .stacked-cell strong { font-size: 12px; color: var(--text); }
.table-project small, .stacked-cell small, .data-table td > a small { margin-top: 4px; color: var(--text-muted); font-size: 10px; }
.table-progress { min-width: 130px; }
.table-progress > div { display: flex; justify-content: space-between; gap: 10px; }
.table-progress strong { color: var(--text); font-size: 11px; }
.table-progress span { color: var(--text-muted); font-size: 10px; }
.table-progress > i { display: block; height: 5px; margin-top: 6px; overflow: hidden; border-radius: 3px; background: #e8ecf0; }
.table-progress em { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.table-arrow { display: grid !important; place-items: center; width: 26px; height: 26px; border-radius: 5px; background: #f2f4f6; font-size: 17px; }
.risk-note-row td { padding: 8px 13px 8px 63px; background: #fff9ed; color: #7c5815; font-size: 11px; }
.risk-note-row td span { display: inline-grid; place-items: center; width: 17px; height: 17px; margin-right: 6px; border-radius: 50%; background: #d38b19; color: #fff; font-weight: 800; }
.back-link { display: inline-block; margin-bottom: 13px; color: var(--text-muted); text-decoration: none; font-size: 12px; font-weight: 650; }
.back-link:hover { color: var(--accent-strong); }
.link-button { border: 0; background: transparent; color: var(--accent-strong); font-size: 11.5px; font-weight: 700; }

/* --- Detail projektu 0→100 --------------------------------------------- */
.project-hero { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 20px; padding: 22px 24px 17px; margin-bottom: 11px; overflow: hidden; }
.project-hero::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--accent); }
.project-hero-main { display: flex; align-items: center; gap: 16px; }
.model-badge { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 10px; background: var(--ink); color: var(--accent-soft); font-size: 15px; font-weight: 800; }
.project-hero h1 { margin: 5px 0; font-size: 25px; letter-spacing: -.6px; }
.project-hero p { margin: 0; color: var(--text-muted); font-size: 12.5px; }
.project-hero-meta { display: flex; align-items: center; gap: 18px; }
.project-hero-meta > div { display: flex; flex-direction: column; padding-left: 18px; border-left: 1px solid var(--border); }
.project-hero-meta small { color: var(--text-muted); font-size: 9.5px; letter-spacing: .8px; }
.project-hero-meta strong { margin-top: 5px; font-size: 13px; }
.hero-progress { grid-column: 1 / -1; padding-top: 15px; border-top: 1px solid #eef1f4; }
.hero-progress > div { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 11px; }
.hero-progress > i { display: block; height: 7px; overflow: hidden; border-radius: 4px; background: #e8ecf0; }
.hero-progress em { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent-strong), var(--accent), var(--accent-soft)); }
.context-tabs { display: flex; gap: 4px; padding: 0 5px; margin-bottom: 16px; border-bottom: 1px solid var(--border); }
.context-tabs button { padding: 11px 13px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--text-muted); font-size: 12px; font-weight: 650; }
.context-tabs button.active { border-color: var(--accent); color: var(--accent-strong); }
.context-tabs button span { min-width: 18px; height: 18px; display: inline-grid; place-items: center; margin-left: 5px; border-radius: 9px; background: #eaeef2; font-size: 10px; }
.decision-banner { min-height: 84px; display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: 15px; padding: 15px 18px; margin-bottom: 13px; border: 1px solid var(--accent-line); border-radius: 9px; background: var(--accent-tint); }
.decision-banner.risk { border-color: #f0d5cf; background: #fff6f3; }
.decision-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--accent-strong); color: #fff; font-weight: 800; }
.decision-banner.risk .decision-icon { background: var(--danger); }
.decision-banner small { color: var(--accent-strong); font-size: 9.5px; font-weight: 800; letter-spacing: 1px; }
.decision-banner strong { display: block; margin-top: 4px; font-size: 13px; }
.decision-banner p { margin: 4px 0 0; color: var(--text-muted); font-size: 11px; }
.detail-stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 13px; }
.detail-stat-grid article { padding: 14px 16px; }
.detail-stat-grid strong { display: block; margin: 7px 0 3px; font-size: 17px; }
.detail-stat-grid span { color: var(--text-muted); font-size: 10px; }
.project-detail-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(290px, .65fr); gap: 13px; }
.detail-side { display: flex; flex-direction: column; gap: 13px; }
.milestone-list { padding: 8px 17px 14px; }
.milestone-row { position: relative; min-height: 66px; display: grid; grid-template-columns: 27px 1fr auto; gap: 11px; align-items: center; }
.milestone-row:not(:last-child)::before { content: ""; position: absolute; left: 13px; top: 43px; bottom: -20px; width: 1px; background: #dde3e9; }
.milestone-marker { position: relative; z-index: 1; width: 27px; height: 27px; display: grid; place-items: center; border: 2px solid #dde3e9; border-radius: 50%; background: #fff; color: #7b8590; font-size: 10px; font-weight: 800; }
.milestone-row.completed .milestone-marker { border-color: var(--ok); background: var(--ok-tint); color: var(--ok-dark); }
.milestone-row.blocked .milestone-marker { border-color: var(--danger); background: #fff0ee; color: var(--danger); }
.milestone-row div { display: flex; flex-direction: column; }
.milestone-row small { color: var(--accent-strong); font-size: 9.5px; font-weight: 700; }
.milestone-row strong { margin-top: 3px; font-size: 11.5px; }
.milestone-row p { margin: 3px 0 0; color: var(--text-muted); font-size: 10px; }
.check-list { padding: 8px 16px 15px; }
.check-list > div { display: flex; gap: 10px; align-items: center; min-height: 50px; border-bottom: 1px solid #eef1f4; }
.check-list > div:last-child { border: 0; }
.check-list > div > span { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 6px; background: var(--ok-tint); color: var(--ok-dark); font-size: 11px; font-weight: 800; }
.check-list > div.missing > span { background: #fff0ee; color: var(--danger); }
.check-list > div.warning > span { background: #fff5df; color: #a66d12; }
.check-list p { display: flex; flex-direction: column; margin: 0; }
.check-list strong { font-size: 11.5px; }
.check-list small { margin-top: 3px; color: var(--text-muted); font-size: 10px; }
.section-table { overflow: hidden; }
.doc-state { display: inline-flex; padding: 5px 8px; border-radius: 5px; background: #eff2f4; color: #5e6771; font-size: 9.5px; font-weight: 700; white-space: nowrap; }
.state-approved, .state-issued, .state-signed, .state-resolved, .state-closed { background: #eaf8ef; color: #16763c; }
.state-review, .state-inprogress, .state-triaged, .state-visitplanned { background: #fff4da; color: #97630e; }
.state-draft, .state-new { background: #edf3ff; color: #315fae; }
.empty-module { min-height: 330px; display: grid; place-items: center; align-content: center; gap: 9px; text-align: center; }
.empty-module > span { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 12px; background: var(--ink); color: var(--accent-soft); font-size: 22px; }
.empty-module h2 { margin: 7px 0 0; }
.empty-module p { max-width: 520px; margin: 0 0 8px; color: var(--text-muted); font-size: 12.5px; }

/* --- Obchod ------------------------------------------------------------ */
.sales-kpis, .report-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 15px; }
.sales-kpis article, .report-metrics article { padding: 14px 16px; border-left: 3px solid var(--accent); border-radius: 7px; background: #fff; }
.sales-kpis small, .report-metrics small { color: var(--text-muted); font-size: 10px; font-weight: 800; letter-spacing: .8px; }
.sales-kpis strong, .report-metrics strong { display: block; margin: 7px 0 3px; font-size: 19px; }
.sales-kpis span, .report-metrics span { color: var(--text-muted); font-size: 10px; }
.kanban-board { display: grid; grid-template-columns: repeat(4, minmax(230px, 1fr)); gap: 11px; overflow-x: auto; }
.kanban-column { min-width: 230px; }
.kanban-column > header { display: flex; align-items: center; justify-content: space-between; padding: 0 5px 10px; }
.kanban-column > header > div { display: flex; align-items: center; gap: 7px; }
.kanban-column header strong { font-size: 12.5px; }
.kanban-column header em { min-width: 21px; height: 21px; display: grid; place-items: center; border-radius: 10px; background: #e7ebef; font: normal 10.5px/1 inherit; }
.kanban-dot { width: 7px; height: 7px; border-radius: 50%; background: #8e97a1; }
.kanban-dot.qualified { background: var(--blue); }
.kanban-dot.visit { background: #d38b19; }
.kanban-dot.offer { background: var(--ok); }
.kanban-cards { min-height: 360px; padding: 8px; border-radius: 9px; background: #eceff2; }
.lead-card { padding: 13px; margin-bottom: 8px; }
.lead-top { display: flex; justify-content: space-between; align-items: center; }
.source-tag { display: inline-flex; padding: 4px 7px; border-radius: 4px; background: var(--accent-tint); color: var(--accent-strong); font-size: 9.5px; font-weight: 700; }
.lead-top button, .row-menu { border: 0; background: transparent; color: #89929c; font-size: 11px; }
.lead-card h3 { margin: 11px 0 4px; font-size: 13px; }
.lead-card > p { margin: 0; color: var(--text-muted); font-size: 10px; }
.lead-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; padding: 10px 0; margin: 11px 0; border-block: 1px solid #eef1f4; }
.lead-facts span { display: flex; flex-direction: column; }
.lead-facts small, .next-action small { color: var(--text-muted); font-size: 9px; letter-spacing: .6px; }
.lead-facts strong { margin-top: 4px; font-size: 11px; }
.next-action { display: flex; flex-direction: column; padding: 8px; border-radius: 6px; background: #f7f8fa; }
.next-action strong { margin-top: 4px; font-size: 11px; }
.lead-card footer { display: flex; align-items: center; gap: 6px; margin-top: 10px; color: var(--text-muted); font-size: 10px; }
.avatar.small { width: 26px; height: 26px; font-size: 9px; }
.lead-card footer button { margin-left: auto; border: 0; background: transparent; color: var(--accent-strong); font-size: 10px; font-weight: 700; }
.kanban-empty { display: grid; place-items: center; min-height: 100px; color: #8b949e; font-size: 11px; }

/* --- Plánovač ---------------------------------------------------------- */
.planner-toolbar { min-height: 57px; display: flex; align-items: center; gap: 20px; padding: 9px 13px; margin-bottom: 11px; }
.planner-toolbar > div:first-child { display: flex; align-items: center; gap: 9px; }
.planner-toolbar button { width: 30px; height: 30px; border: 1px solid var(--border); border-radius: 5px; background: #fff; }
.planner-toolbar strong { min-width: 145px; text-align: center; font-size: 12.5px; }
.planner-toolbar .table-search { margin-left: auto; }
.legend { display: flex; gap: 10px; }
.legend span { display: flex; align-items: center; gap: 4px; color: var(--text-muted); font-size: 10px; }
.legend i { width: 6px; height: 6px; border-radius: 50%; background: #a0a9b2; }
.legend i.critical { background: var(--danger); }
.legend i.normal { background: var(--ok); }
.legend i.waiting { background: #d38b19; }
.week-board { display: grid; grid-template-columns: repeat(7, minmax(115px, 1fr)); margin-bottom: 13px; overflow-x: auto; }
.day-column { min-width: 115px; min-height: 335px; border-right: 1px solid var(--border); }
.day-column:last-child { border: 0; }
.day-column.today { background: #fdf8f1; }
.day-column header { height: 52px; display: grid; grid-template-columns: 1fr auto; align-items: center; padding: 8px 10px; border-bottom: 1px solid var(--border); }
.day-column header small { color: var(--text-muted); font-size: 9.5px; }
.day-column header strong { grid-row: 2; font-size: 13px; }
.day-column header span { grid-row: 1 / span 2; min-width: 19px; height: 19px; display: grid; place-items: center; border-radius: 9px; background: #e6eaee; font-size: 10px; }
.day-column.today header span { background: var(--accent-strong); color: #fff; }
.day-column > div { padding: 6px; }
.calendar-task { display: flex; flex-direction: column; min-height: 74px; padding: 8px; margin-bottom: 6px; border-left: 3px solid var(--ok); border-radius: 5px; background: #fff; box-shadow: 0 1px 2px rgba(29, 39, 49, .08); color: var(--text); text-decoration: none; }
.calendar-task.task-critical { border-color: var(--danger); }
.calendar-task.task-high { border-color: #d38b19; }
.calendar-task small { color: var(--text-muted); font-size: 9px; }
.calendar-task strong { margin: 5px 0; font-size: 10.5px; line-height: 1.35; }
.calendar-task span { color: var(--text-muted); font-size: 9px; }
.day-empty { margin: 20px 0; color: #a0a9b2; font-size: 10px; text-align: center; }
.planner-lower-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.capacity-meter.hot i { background: linear-gradient(90deg, #d38b19, var(--danger)); }
.dependency-list { padding: 8px 17px 14px; }
.dependency { min-height: 54px; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; gap: 10px; border-bottom: 1px solid #eef1f4; }
.dependency > span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 5px; background: var(--ok-tint); color: var(--ok-dark); font-size: 10.5px; font-weight: 800; }
.dependency.danger > span { background: #fff0ee; color: var(--danger); }
.dependency.warning > span { background: #fff5df; color: #a66d12; }
.dependency p { display: flex; flex-direction: column; margin: 0; }
.dependency strong { font-size: 11px; }
.dependency small { margin-top: 3px; color: var(--text-muted); font-size: 10px; }
.dependency em { font: normal 700 10px/1 inherit; color: var(--text-muted); }

/* --- Dokumenty --------------------------------------------------------- */
.document-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 13px; }
.document-kpis article { display: flex; gap: 12px; align-items: center; padding: 14px; }
.document-icon { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 8px; background: var(--accent-tint); color: var(--accent-strong); font-size: 13px; font-weight: 800; }
.document-icon.review { background: #fff5df; color: #9a650d; }
.document-icon.signed { background: #edf3ff; color: #315fae; }
.document-icon.package { background: #f0f2f4; color: var(--ink-3); }
.document-kpis small { color: var(--text-muted); font-size: 10px; font-weight: 800; letter-spacing: .7px; }
.document-kpis strong { display: block; margin: 3px 0; font-size: 18px; }
.document-kpis p { margin: 0; color: var(--text-muted); font-size: 10px; }
.file-cell { min-width: 200px; display: flex; align-items: center; gap: 9px; }
.file-cell > span { width: 31px; height: 36px; display: grid; place-items: center; border-radius: 5px; background: #eff2f4; color: #636f7a; font-size: 9px; font-weight: 800; }
.file-cell > div { display: flex; flex-direction: column; }
.file-cell strong { color: var(--text); font-size: 12px; }
.file-cell small { margin-top: 3px; color: var(--text-muted); font-size: 10px; }
.version-badge { padding: 4px 7px; border-radius: 4px; background: #f0f2f4; font-size: 10px; font-weight: 700; }
.document-rule { display: flex; gap: 11px; align-items: center; padding: 13px 16px; margin-top: 11px; border-color: var(--accent-line); }
.document-rule > span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; background: var(--accent-tint); color: var(--accent-strong); font-size: 11px; font-weight: 800; }
.document-rule strong { font-size: 11px; }
.document-rule p { margin: 3px 0 0; color: var(--text-muted); font-size: 10px; }

.document-upload { padding: 20px; margin-bottom: 14px; border-color: var(--accent-line); }
.document-upload-intro h2 { margin: 6px 0; font-size: 18px; }
.document-upload-intro p { margin: 0 0 17px; color: var(--text-muted); font-size: 12px; }
.document-upload-grid { display: grid; grid-template-columns: 1.2fr 1.2fr 1fr .55fr; gap: 12px; align-items: end; }
.document-upload-grid label { display: grid; gap: 6px; color: var(--text-muted); font-size: 11px; font-weight: 750; }
.document-upload-grid input, .document-upload-grid select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 7px; background: #fff; color: var(--text); }
.document-file-picker { grid-column: 1 / 4; }
.document-file-picker input { padding: 7px; }
.document-file-picker small { min-height: 14px; color: #747f8a; font-weight: 500; }
.document-upload-actions { display: flex; gap: 8px; justify-content: flex-end; }
.document-upload-actions .button:disabled { cursor: not-allowed; opacity: .55; }
.upload-feedback { margin-top: 14px; padding: 10px 12px; border-radius: 7px; font-size: 12px; font-weight: 650; }
.upload-feedback.success { background: var(--ok-tint); color: #126934; }
.upload-feedback.error { background: #fff0ee; color: #a92318; }
.document-download { display: inline-flex !important; color: var(--accent-strong) !important; font-size: 11px; font-weight: 750; white-space: nowrap; }
.file-availability { display: inline-flex; padding: 5px 8px; border-radius: 5px; background: #eff2f4; color: #68717b; font-size: 9.5px; font-weight: 700; white-space: nowrap; }
.file-availability.status-quarantined { background: #fff4da; color: #97630e; }

/* --- Šablony a dokumentový strom zakázky -------------------------------- */
.template-group { padding: 4px 16px 10px; }
.template-group:not(:last-child) { border-bottom: 1px solid #eef1f4; }
.template-group-head { display: flex; align-items: center; gap: 8px; padding: 14px 0 6px; }
.template-group-head strong { font-size: 12.5px; letter-spacing: .3px; }
.template-group-head em { min-width: 21px; height: 21px; display: grid; place-items: center; border-radius: 10px; background: var(--accent-tint); color: var(--accent-strong); font: normal 700 10.5px/1 inherit; }
.template-row { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 0; border-top: 1px solid #f2f4f6; }
.template-row.inactive { opacity: .55; }
.template-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.template-main strong { font-size: 12.5px; }
.template-main small { color: var(--text-muted); font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; }
.file-badge { flex: 0 0 auto; min-width: 44px; height: 30px; display: grid; place-items: center; padding: 0 6px; border-radius: 5px; background: var(--ink); color: var(--accent-soft); font-size: 9.5px; font-weight: 800; }
.lang-tag { padding: 4px 7px; border-radius: 4px; background: #edf3ff; color: #315fae; font-size: 9.5px; font-weight: 800; }
.checkbox-inline { display: flex; align-items: center; gap: 7px; color: var(--text-muted); font-size: 12px; }
.checkbox-inline input { width: 15px; height: 15px; accent-color: var(--accent-strong); }
.folder-tree { padding: 6px 16px 14px; }
.folder-node { padding: 4px 0; }
.folder-node:not(:last-child) { border-bottom: 1px solid #f2f4f6; }
.folder-head { display: flex; align-items: center; gap: 9px; min-height: 42px; }
.folder-head > span { color: var(--accent); font-size: 13px; }
.folder-head strong { font-size: 12.5px; }
.folder-head em { min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 10px; background: #eaeef2; color: #5c6672; font: normal 700 10.5px/1 inherit; }
.folder-node.empty .folder-head { opacity: .5; }
.folder-node.empty .folder-head em { background: transparent; }
/* Drop zóna složky: neviditelný input type=file překrývá celý řádek hlavičky,
   takže přetažení souboru na složku (i kliknutí) spustí nahrání právě do ní. */
.folder-drop { position: relative; border-radius: 7px; padding: 0 8px; margin: 0 -8px; border: 1px dashed transparent; }
.folder-drop input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.folder-drop input[type="file"]:disabled { cursor: progress; }
.folder-drop .drop-hint { margin-left: auto; color: var(--text-muted); font-size: 10.5px; font-weight: 650; opacity: .45; white-space: nowrap; }
.folder-drop:hover, .folder-drop:focus-within, .folder-drop.dragover { background: var(--accent-tint); border-color: var(--accent-line); }
.folder-drop:hover .drop-hint, .folder-drop.dragover .drop-hint, .folder-drop.busy .drop-hint { opacity: 1; color: var(--accent-strong); }
.folder-drop.dragover { border-style: solid; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(225, 134, 59, .15); }
.folder-drop.busy { background: var(--accent-tint); }
.folder-node.empty .folder-drop { opacity: .75; }
.tree-message { margin: 12px 16px 0; }
.folder-doc { display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 4px 0 4px 30px; border-top: 1px dashed #eef1f4; }
.folder-doc .stacked-cell { flex: 1; min-width: 0; }
.subfolder-tag { padding: 4px 7px; border-radius: 4px; background: var(--accent-tint); color: var(--accent-strong); font-size: 9.5px; font-weight: 700; white-space: nowrap; }
@media (max-width: 680px) {
    .template-row { flex-wrap: wrap; }
    .folder-doc { flex-wrap: wrap; padding-left: 14px; }
}

/* --- Servis ------------------------------------------------------------ */
.service-summary { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 10px; margin-bottom: 13px; }
.service-focus, .service-stat { padding: 16px; }
.service-focus-top { display: flex; align-items: center; gap: 11px; }
.service-symbol { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 9px; background: var(--ink); color: var(--accent-soft); font-size: 17px; }
.service-focus small, .service-stat small { color: var(--text-muted); font-size: 10px; font-weight: 800; letter-spacing: .7px; }
.service-focus strong { display: block; margin-top: 3px; font-size: 19px; }
.service-focus > p { margin: 10px 0 0; color: var(--text-muted); font-size: 11.5px; line-height: 1.5; }
.service-stat strong { display: block; margin: 10px 0 4px; font-size: 23px; }
.service-stat span { color: var(--text-muted); font-size: 10px; }
.service-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .55fr); gap: 13px; }
.service-side { display: flex; flex-direction: column; gap: 13px; }
.case-list { padding: 5px 14px 12px; }
.case-row { min-height: 82px; display: grid; grid-template-columns: 30px 1fr 120px 90px 15px; gap: 10px; align-items: center; border-bottom: 1px solid #eef1f4; }
.case-row:last-child { border: 0; }
.case-priority { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 6px; background: #eef1f4; color: #636f7a; font-size: 10.5px; font-weight: 800; }
.case-priority.priority-high { background: #fff3da; color: #9a6408; }
.case-main > div { display: flex; align-items: center; gap: 5px; }
.case-number { color: var(--accent-strong); font-size: 9.5px; font-weight: 800; }
.warranty-tag { padding: 4px 6px; border-radius: 4px; background: #f3edfa; color: #7445a3; font-size: 9px; font-weight: 700; }
.case-main h3 { margin: 6px 0 3px; font-size: 12.5px; }
.case-main p { margin: 0; color: var(--text-muted); font-size: 10px; }
.case-owner, .case-sla { display: flex; flex-direction: column; }
.case-owner small, .case-sla small { color: var(--text-muted); font-size: 9px; letter-spacing: .6px; }
.case-owner strong, .case-sla strong { margin-top: 5px; font-size: 11px; }
.case-row > a { color: #87919b; text-decoration: none; font-size: 17px; }
.passport-card { padding: 17px; text-align: center; }
.passport-card h2 { margin: 6px 0 14px; font-size: 16px; }
.passport-ring { position: relative; width: 95px; height: 95px; display: grid; place-items: center; align-content: center; margin: 0 auto 14px; border-radius: 50%; background: conic-gradient(var(--accent) calc(var(--p, 0) * 1%), var(--accent-line) 0); }
.passport-ring::before { content: ""; position: absolute; inset: 8px; border-radius: 50%; background: #fff; }
.passport-ring strong { position: relative; font-size: 20px; }
.passport-ring span { position: relative; color: var(--text-muted); font-size: 9.5px; }
.passport-card ul { padding: 0; margin: 0 0 14px; list-style: none; text-align: left; }
.passport-card li { display: flex; gap: 7px; padding: 8px 0; border-bottom: 1px solid #eef1f4; font-size: 11px; }
.passport-card li span { color: var(--ok); font-weight: 800; }
.passport-card .button { width: 100%; }
.feedback-card { padding: 15px; }
.feedback-card > div { display: flex; align-items: center; gap: 8px; }
.feedback-card > div span { color: var(--accent); font-size: 14px; }
.feedback-card strong { font-size: 11.5px; }
.feedback-card p { color: var(--text-muted); font-size: 11px; line-height: 1.5; }
.feedback-card a { color: var(--accent-strong); text-decoration: none; font-size: 11px; font-weight: 700; }

/* --- Výroba, katalog, reporty, nastavení -------------------------------- */
.factory-banner { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 18px 20px; margin-bottom: 12px; background: var(--brand-pattern), linear-gradient(110deg, var(--ink), var(--ink-2)); color: #fff; }
.factory-banner h2 { margin: 5px 0; }
.factory-banner p { margin: 0; color: #a9b3bd; font-size: 11px; }
.factory-kpis { display: flex; gap: 30px; }
.factory-kpis span { display: flex; flex-direction: column; text-align: right; }
.factory-kpis small { color: #919ca7; font-size: 10px; letter-spacing: .7px; }
.factory-kpis strong { margin-top: 5px; color: var(--accent-soft); font-size: 18px; }
.production-board { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 13px; }
.production-lane { overflow: hidden; }
.production-lane > header { height: 50px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; border-bottom: 1px solid var(--border); }
.production-lane header > div { display: flex; align-items: center; gap: 8px; }
.production-lane header span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 5px; background: var(--ink); color: var(--accent-soft); font-size: 10px; font-weight: 800; }
.production-lane header strong { font-size: 11.5px; }
.production-lane header em { font: normal 11px/1 inherit; }
.production-cards { min-height: 230px; padding: 8px; background: #f3f5f7; }
.production-lane.dragover { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(225, 134, 59, .15); }
.production-lane.dragover .production-cards { background: var(--accent-tint); }
.production-lane.busy { opacity: .7; }
.production-card.draggable { cursor: grab; }
.production-card.draggable:active { cursor: grabbing; }
.production-card { display: block; padding: 11px; margin-bottom: 7px; border: 1px solid var(--border); border-radius: 7px; background: #fff; color: var(--text); text-decoration: none; }
.production-card > div:first-child { display: flex; justify-content: space-between; align-items: center; }
.production-card h3 { margin: 10px 0 4px; font-size: 11.5px; }
.production-card > p { margin: 0 0 10px; color: var(--text-muted); font-size: 10px; }
.production-card .table-progress > div small { color: var(--text-muted); font-size: 10px; }
.lane-empty { margin: 60px 0; color: #909aa4; font-size: 11px; text-align: center; }
.quality-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.quality-checks, .transport-list { padding: 7px 16px 13px; }
.quality-checks > div, .transport-list > div { min-height: 56px; display: grid; grid-template-columns: 25px 1fr auto; gap: 9px; align-items: center; border-bottom: 1px solid #eef1f4; }
.quality-checks > div > span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 5px; background: var(--ok-tint); color: var(--ok-dark); font-size: 11px; font-weight: 800; }
.quality-checks p, .transport-list p { display: flex; flex-direction: column; margin: 0; }
.quality-checks strong, .transport-list strong { font-size: 11px; }
.quality-checks small, .transport-list small { margin-top: 3px; color: var(--text-muted); font-size: 10px; }
.quality-checks em { color: var(--text-muted); font: normal 700 10px/1 inherit; }
.transport-list > div { grid-template-columns: 43px 1fr auto; }
.transport-list time { color: var(--accent-strong); font-size: 11.5px; font-weight: 800; }
.catalog-notice { display: flex; gap: 10px; align-items: center; padding: 11px 14px; margin-bottom: 12px; border: 1px solid var(--accent-line); border-radius: 7px; background: var(--accent-tint); }
.catalog-notice > span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: #f5e0c6; color: var(--accent-strong); font-size: 11px; font-weight: 800; }
.catalog-notice p { margin: 0; color: #6f5a3f; font-size: 11px; }
.catalog-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 13px; }
.catalog-card { overflow: hidden; }
.catalog-visual { position: relative; height: 108px; display: grid; place-items: center; background: linear-gradient(#f4f1ec 65%, #e8e4dd 65%); }
.catalog-visual > span { position: relative; z-index: 2; width: 70px; height: 42px; display: grid; place-items: center; margin-top: 20px; border: 3px solid var(--ink-2); border-radius: 2px; background: #fbfaf8; color: var(--accent-strong); font-weight: 800; }
.catalog-visual i { position: absolute; z-index: 1; width: 55px; height: 55px; top: 16px; border: 3px solid var(--ink-2); border-right: 0; border-bottom: 0; transform: rotate(45deg); }
.catalog-visual i.roof-plocha { width: 76px; height: 8px; top: 50px; transform: none; border-right: 3px solid var(--ink-2); }
.catalog-body { padding: 12px; }
.catalog-body > div { display: flex; justify-content: space-between; align-items: center; }
.catalog-body h2 { margin: 10px 0 5px; font-size: 13px; }
.catalog-body p { min-height: 46px; margin: 0; color: var(--text-muted); font-size: 10px; line-height: 1.5; }
.catalog-body > strong { display: block; margin: 9px 0; color: var(--accent-strong); font-size: 15px; }
.catalog-body footer { display: flex; align-items: center; justify-content: space-between; gap: 5px; padding-top: 9px; border-top: 1px solid #eef1f4; }
.catalog-body footer span { color: var(--text-muted); font-size: 9px; }
.catalog-body footer button { border: 0; background: transparent; color: var(--accent-strong); font-size: 10px; font-weight: 700; }
.cpq-flow { display: flex; justify-content: center; align-items: center; gap: 20px; padding: 18px; }
.cpq-flow > div { display: grid; grid-template-columns: 28px 1fr; column-gap: 8px; align-items: center; }
.cpq-flow > div > span { grid-row: 1 / span 2; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: var(--accent-soft); font-size: 10.5px; font-weight: 800; }
.cpq-flow strong { font-size: 11px; }
.cpq-flow small { color: var(--text-muted); font-size: 9px; }
.cpq-flow > i { color: #9aa3ad; font-style: normal; }
.report-grid { display: grid; grid-template-columns: 1.8fr .7fr; gap: 13px; margin-bottom: 13px; }
.report-main { overflow: hidden; }
.duration-chart { padding: 14px 18px 19px; }
.duration-chart > div { display: grid; grid-template-columns: 130px 1fr 46px; gap: 10px; align-items: center; min-height: 44px; }
.duration-chart span { font-size: 11px; }
.duration-chart i { height: 9px; overflow: hidden; border-radius: 5px; background: #e8ecf0; }
.duration-chart em { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent-strong), var(--accent)); }
.duration-chart strong { font-size: 11px; text-align: right; }
.report-side { padding: 19px; background: var(--brand-pattern), linear-gradient(145deg, var(--ink), var(--ink-2)); color: #fff; }
.report-side > strong { display: block; margin-top: 20px; color: var(--accent-soft); font-size: 42px; }
.report-side h2 { margin: 4px 0 8px; font-size: 16px; }
.report-side p { color: #aab4be; font-size: 11px; }
.report-side a { display: inline-block; margin-top: 17px; color: var(--accent-soft); text-decoration: none; font-size: 11px; font-weight: 700; }
.settings-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }
.settings-grid article { padding: 19px; }
.settings-grid article > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 8px; background: var(--accent-tint); color: var(--accent-strong); font-size: 16px; }
.settings-grid h2 { margin: 12px 0 5px; font-size: 14px; }
.settings-grid p { min-height: 38px; margin: 0; color: var(--text-muted); font-size: 11px; line-height: 1.5; }
.settings-grid button { margin-top: 14px; padding: 0; border: 0; background: transparent; color: var(--accent-strong); font-size: 11px; font-weight: 700; }

/* --- Transakční formuláře a expediční gate ------------------------------ */
.inline-create { display: grid; grid-template-columns: minmax(250px, 1.4fr) repeat(3, minmax(180px, 1fr)); gap: 18px; align-items: end; margin-bottom: 22px; padding: 22px; border-color: var(--accent-line); }
.inline-create > div:first-child { grid-row: span 2; align-self: start; }
.inline-create h2 { margin: 5px 0 7px; font-size: 20px; }
.inline-create p { margin: 0; color: var(--text-muted); line-height: 1.5; font-size: 12px; }
.inline-create label { display: grid; gap: 7px; color: var(--text-muted); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.inline-create input, .inline-create select, .evidence-submit input { width: 100%; min-height: 42px; border: 1px solid var(--border); border-radius: 7px; background: #fff; color: var(--text); padding: 9px 11px; font: inherit; }
.inline-create input:focus, .inline-create select:focus, .evidence-submit input:focus { outline: 2px solid rgba(225, 134, 59, .25); border-color: var(--accent); }
.inline-create .checkbox-label { display: flex; flex-direction: row; align-items: center; gap: 9px; letter-spacing: 0; }
.inline-create .checkbox-label input { width: 18px; min-height: 18px; accent-color: var(--accent-strong); }
.inline-create .validation-message { color: #b42318; font-size: 11px; letter-spacing: 0; }
.operation-message { margin: 0 0 18px; padding: 12px 15px; border-radius: 7px; font-size: 12px; font-weight: 650; }
.operation-message.success { color: #116530; background: #ecf9ef; border: 1px solid #bde5c8; }
.operation-message.error { color: #8e1d16; background: #fff0ee; border: 1px solid #f2c4bf; }

.dispatch-gate-card { margin: 20px 0; padding: 22px; }
.gate-streams { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 18px 0; }
.gate-stream { display: flex; align-items: center; gap: 11px; min-height: 78px; padding: 13px; border: 1px solid var(--border); border-radius: 8px; background: #fafbfc; }
.gate-stream > span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #eef1f4; font-weight: 800; }
.gate-stream > div { display: grid; gap: 3px; flex: 1; }
.gate-stream small { color: var(--text-muted); font-size: 9.5px; letter-spacing: .08em; }
.gate-stream strong { font-size: 11.5px; }
.gate-stream button, .gate-evidence-row button { border: 0; background: transparent; color: var(--accent-strong); font-size: 11px; font-weight: 750; cursor: pointer; }
.gate-stream.ready { border-color: #bde5c8; background: #f2fbf4; }
.gate-stream.ready > span { color: #116530; background: #dff4e4; }
.gate-stream.blocked { border-color: #f2c4bf; background: #fff7f6; }
.gate-stream.blocked > span { color: #b42318; background: #ffe4e0; }
.gate-stream.progress > span { color: #9a5b00; background: #fff1d2; }
.gate-evidence-list { border-top: 1px solid var(--border); }
.gate-evidence-head, .gate-evidence-row { display: flex; align-items: center; gap: 12px; padding: 12px 2px; border-bottom: 1px solid var(--border); }
.gate-evidence-head { justify-content: space-between; color: var(--text-muted); font-size: 11px; }
.gate-evidence-row > div { display: grid; gap: 3px; flex: 1; }
.gate-evidence-row strong { font-size: 11.5px; }
.gate-evidence-row small { color: var(--text-muted); font-size: 11px; }
.evidence-mark { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; font-weight: 800; }
.evidence-mark.verified { color: #116530; background: #dff4e4; }
.evidence-mark.submitted { color: #9a5b00; background: #fff1d2; }
.evidence-mark.missing { color: #b42318; background: #ffe4e0; }
.evidence-submit { display: flex; gap: 10px; margin-top: 14px; }
.gate-actions { display: flex; align-items: center; justify-content: space-between; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.gate-actions > div { display: grid; gap: 3px; }
.gate-actions small { color: var(--text-muted); font-size: 9.5px; letter-spacing: .08em; }

/* --- Identity (Account) stránky ------------------------------------------
   Scaffoldované stránky používají bootstrapové třídy; Bootstrap se neservíruje,
   proto zde žije minimální kompatibilní vrstva ve firemním stylu. */
.form-control { width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 7px; background: #fff; color: var(--text); }
.form-control:focus { outline: 2px solid rgba(225, 134, 59, .25); border-color: var(--accent); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 1px solid transparent; border-radius: 7px; font-size: 13px; font-weight: 700; text-decoration: none; }
.btn-primary { background: var(--ink); color: #fff; }
.btn-primary:hover { background: var(--ink-2); }
.btn-lg { min-height: 46px; font-size: 14px; }
.btn-link { background: transparent; color: var(--accent-strong); }
.btn-danger { background: #fff2f0; border-color: #efc1bc; color: var(--danger); }
.btn-secondary, .btn-outline-primary { background: #fff; border-color: var(--border); color: var(--text); }
.w-100 { width: 100%; }
.row { display: flex; flex-wrap: wrap; gap: 28px; }
.row > [class^="col-"] { flex: 1 1 320px; min-width: 0; max-width: 560px; }
.form-floating { position: relative; display: grid; gap: 6px; }
.form-floating > label { order: -1; color: var(--text-muted); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.form-label { color: var(--text-muted); font-size: 12px; font-weight: 650; }
.mb-3 { margin-bottom: 14px; }
.mt-2 { margin-top: 8px; }
.mx-auto { margin-inline: auto; }
.d-flex { display: flex; }
.flex-column { flex-direction: column; }
.text-secondary { color: var(--text-muted); font-size: 11px; letter-spacing: .08em; }
.form-check-input { width: 16px; height: 16px; accent-color: var(--accent-strong); }
.checkbox label { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.alert { padding: 12px 15px; margin-bottom: 14px; border: 1px solid var(--border); border-radius: 7px; background: #fff; font-size: 12.5px; }
.alert-danger { border-color: #f2c4bf; background: #fff0ee; color: #8e1d16; }
.alert-success { border-color: #bde5c8; background: #ecf9ef; color: #116530; }
.alert-warning, .alert-info { border-color: #f0d9bd; background: var(--accent-tint); color: #6f5a3f; }
.nav.nav-pills { display: flex; padding: 0; margin: 0 0 16px; list-style: none; gap: 4px; }
.nav.nav-pills.flex-column { flex-direction: column; }
.nav-pills .nav-link { display: block; padding: 9px 12px; border-radius: 7px; color: var(--text-muted); text-decoration: none; font-size: 13px; font-weight: 600; }
.nav-pills .nav-link:hover { background: var(--surface-subtle); color: var(--text); }
.nav-pills .nav-link.active { background: var(--accent-tint); color: var(--accent-strong); }
.recovery-code { display: inline-block; padding: 6px 9px; margin: 3px; border: 1px dashed var(--accent-line); border-radius: 5px; background: #fff; font-weight: 700; letter-spacing: .05em; }
article[id] h1, main h1 { letter-spacing: -.8px; }
hr { border: 0; border-top: 1px solid var(--border); margin: 16px 0; }

@media (max-width: 1180px) {
    .inline-create { grid-template-columns: 1fr 1fr 1fr; }
    .inline-create > div { grid-column: 1 / -1; }
    .sales-kpis, .report-metrics, .document-kpis { grid-template-columns: repeat(2, 1fr); }
    .production-board { grid-template-columns: repeat(2, 1fr); }
    .catalog-grid { grid-template-columns: repeat(3, 1fr); }
    .service-summary { grid-template-columns: repeat(2, 1fr); }
    .case-row { grid-template-columns: 30px 1fr 90px 15px; }
    .case-owner { display: none; }
}
@media (max-width: 900px) {
    .summary-strip, .detail-stat-grid { grid-template-columns: repeat(2, 1fr); }
    .project-hero { grid-template-columns: 1fr; }
    .project-hero-meta { justify-content: flex-start; }
    .project-detail-grid, .service-grid, .planner-lower-grid, .quality-grid, .report-grid { grid-template-columns: 1fr; }
    /* week-board a kanban-board mají overflow-x:auto samy na sobě; minimální šířku
       drží minmax() sloupců, takže se posouvá obsah panelu, ne celá stránka. */
    .production-board { grid-template-columns: repeat(4, minmax(220px, 1fr)); overflow-x: auto; }
    .catalog-grid { grid-template-columns: repeat(2, 1fr); }
    .inline-create { grid-template-columns: 1fr 1fr; }
    .inline-create > div { grid-column: 1 / -1; }
    .cpq-flow { overflow-x: auto; justify-content: flex-start; }
    .cpq-flow > div, .cpq-flow > i { flex-shrink: 0; }
    .settings-grid { grid-template-columns: 1fr; }
    .document-upload-grid { grid-template-columns: 1fr 1fr; }
    .document-file-picker { grid-column: 1 / -1; }
    .document-upload-actions { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
    .summary-strip, .detail-stat-grid, .sales-kpis, .report-metrics, .document-kpis, .service-summary, .catalog-grid { grid-template-columns: 1fr; }
    .summary-strip > div { border-right: 0; border-bottom: 1px solid var(--border); }
    .filter-bar { flex-wrap: wrap; }
    .table-search { min-width: 100%; }
    .filter-bar select { flex: 1; }
    .result-count { width: 100%; margin: 0; }
    .project-hero-meta { flex-wrap: wrap; }
    .context-tabs { overflow-x: auto; }
    .context-tabs button { white-space: nowrap; }
    .decision-banner { grid-template-columns: 32px 1fr; }
    .decision-banner .button { grid-column: 1 / -1; }
    .inline-create { grid-template-columns: 1fr; }
    .inline-create > div { grid-column: auto; }
    .factory-banner { align-items: flex-start; flex-direction: column; }
    .factory-kpis { width: 100%; justify-content: space-between; }
    .catalog-grid { grid-template-columns: 1fr; }
    .case-row { grid-template-columns: 28px 1fr 14px; }
    .case-sla { display: none; }
    .planner-toolbar { flex-wrap: wrap; }
    .planner-toolbar .table-search { width: 100%; margin: 0; }
    .legend { display: none; }
    .document-upload-grid { grid-template-columns: 1fr; }
    .document-file-picker, .document-upload-actions { grid-column: auto; }
    .document-upload-actions .button { flex: 1; }
}

/* --- Správa uživatelů --------------------------------------------------- */
.admin-create-form, .user-access-editor { display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); gap: 22px; padding: 22px; margin-bottom: 16px; }
.admin-create-form > label { display: grid; align-content: start; gap: 7px; color: var(--text-muted); font-size: 11px; font-weight: 700; }
.admin-create-form > label input { min-height: 42px; padding: 8px 11px; border: 1px solid var(--border); border-radius: 7px; }
.role-selector { grid-column: 1 / -1; padding: 0; border: 0; }
.role-selector legend { margin-bottom: 9px; color: var(--text-muted); font-size: 10.5px; font-weight: 800; letter-spacing: .08em; }
.role-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.role-options > label { display: flex; align-items: flex-start; gap: 9px; padding: 10px; border: 1px solid var(--border); border-radius: 7px; background: #fafbfc; cursor: pointer; }
.role-options input { width: 16px; height: 16px; flex: 0 0 auto; accent-color: var(--accent-strong); }
.role-options label > span { display: grid; gap: 3px; }
.role-options strong { font-size: 11.5px; }
.role-options small { color: var(--text-muted); font-size: 10px; line-height: 1.4; }
.form-actions, .user-editor-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 9px; }
.temporary-credential { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 18px; padding: 18px 20px; margin-bottom: 16px; border-color: #e1b54e; background: #fffaf0; }
.temporary-credential h2 { margin: 5px 0; font-size: 16px; }
.temporary-credential p { margin: 0; color: var(--text-muted); font-size: 11px; }
.temporary-credential code { padding: 10px 13px; border: 1px dashed #c88b13; border-radius: 6px; background: #fff; color: #5b3a00; font-size: 15px; font-weight: 800; letter-spacing: .06em; user-select: all; }
.role-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.role-chips span { padding: 4px 7px; border-radius: 4px; background: #eef1f4; color: #3b4854; font-size: 9.5px; font-weight: 700; }
.admin-users-table .selected-row td { background: var(--accent-tint) !important; }
.compact-button { min-height: 30px; padding: 0 9px; }
.button-danger { border-color: #efc1bc; background: #fff2f0; color: var(--danger); }
.text-muted { color: var(--text-muted); font-size: 11px; }
.user-access-editor > div:first-child h2 { margin: 5px 0; }
.user-access-editor > div:first-child p { margin: 0; color: var(--text-muted); font-size: 12px; }

@media (max-width: 900px) {
    .admin-create-form, .user-access-editor { grid-template-columns: 1fr; }
    .temporary-credential { grid-template-columns: 1fr; }
    .role-options { grid-template-columns: 1fr; }
}

/* --- Poctivé stavy akcí pro modulové stránky ---------------------------- */
.settings-grid article > a { display: inline-block; margin-top: 14px; color: var(--accent-strong); text-decoration: none; font-size: 11px; font-weight: 700; }
.button:disabled, .settings-grid button:disabled { cursor: not-allowed; opacity: .48; }

/* Firemní izometrický vzor (jantarové krychle) pro tmavé plochy */
:root { --brand-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='64' viewBox='0 0 56 64'%3E%3Cg fill='none' stroke='%23e1863b' stroke-opacity='.16' stroke-width='1.5'%3E%3Cpath d='M28 2 54 17v30L28 62 2 47V17Z'/%3E%3Cpath d='M2 17l26 15 26-15M28 32v30'/%3E%3C/g%3E%3C/svg%3E"); }