/*
 * Doplňky k návrhu AI Guru — RUČNĚ PSANÉ.
 *
 * Oddělené od `ai-guru-navrh.css`, který se generuje z návrhu a při každé
 * jeho revizi se přepisuje celý. Kdyby tyhle řádky byly v něm, první
 * přegenerování by je smazalo.
 *
 * Patří sem JEN to, co v návrhu opravdu není. Přepisovat jeho hodnoty tady
 * znamená, že se stránka rozejde s návrhem a nikdo nepozná proč.
 */

/* ── Symboly z Interu návrhu ───────────────────────────────────────────
   Návrh načítá celý Inter (352 kB), my jen latinku. Symboly mimo ni
   (♡ ♥ ★ ↗ → ✓ ⌘ ▲ ▼ …) proto kreslilo systémové písmo — jinak než návrh,
   srdce třeba tence. Tenhle soubor je ten samý Inter 4.001, jen jeho
   symboly (30 kB, všechny řezy); stáhne se, až když stránka nějaký ukáže. */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url('/fonts/inter-symboly-opsz-normal.woff2') format('woff2-variations');
    unicode-range: U+2190, U+2192, U+2194-2199, U+21A9-21AA, U+21B0-21B1, U+21B3-21B5, U+21BA-21BB, U+21D0, U+21D2, U+21D4, U+21DE-21DF, U+21E4-21E5, U+21E7, U+21EA, U+2303-2305, U+2318, U+2325-2327, U+232B, U+2380, U+2387, U+238B, U+23CE-23CF, U+2460-2468, U+24B6-24CF, U+24EA, U+25A0-25A2, U+25AA, U+25B2-25B3, U+25B6-25B7, U+25BA-25BD, U+25C0-25C1, U+25C4-25C7, U+25CA-25CB, U+25CF, U+25E6, U+25EF, U+2600, U+2605-2606, U+263C, U+2661, U+2665, U+266A-266B, U+26A0, U+2713, U+2717, U+2756, U+2764, U+2780-2788, U+2913, U+2B06, U+2B12-2B13, U+2B1C, U+2B24;
}

/* ── Doplňky k návrhu ──────────────────────────────────────────────────
   Návrh je prototyp: pár drobností v něm chybí, protože je neřešil.
   Patří sem jen to, co v něm opravdu není — ne přepisování jeho hodnot. */

/* Volba země je v návrhu `<button>`, u nás odkaz (stav drží adresa). */
.agn .company-country { display: grid; place-items: center; text-decoration: none; cursor: pointer; }
.agn .company-country:last-child { border-right: 0; }

/* Nabídka našeptávače; v návrhu se výsledky kreslí jako karty, u nás jako
   seznam pod polem. Tvar přebírá od `.company-result`. */
.agn .company-suggest { list-style: none; margin: 14px 0 0; padding: 0; }
.agn .company-suggest-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 11px;
    margin-bottom: 8px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}
.agn .company-suggest-item:hover { border-color: #aebde4; }
.agn .company-suggest-item strong { font-size: 14px; }
.agn .company-suggest-item span { font-size: 12px; color: var(--muted); }
.agn .company-suggest-empty { padding: 12px 14px; font-size: 12px; color: var(--muted); }

/* Jen pro čtečky. */
.agn .company-sr-only {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px; padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* Návrh nuluje okraj pravidlem na `body`; zapouzdření ho ale přesunulo
   na <html>, takže <body> si drží výchozích 8 px od prohlížeče. */
.agn body { margin: 0; }

/* Návrh dává bloku novinek odsazení inline (`style="margin-top:22px"`).
   Statický styl patří do CSS, ne do šablony. */
.agn .reference-news { margin-top: 22px; }

/* `[hidden]` schovává prohlížeč pravidlem `display:none` ze své vlastní
   tabulky, jenže kterékoli autorské pravidlo ho přebije bez ohledu na
   specificitu — a návrh dává `display:flex` nebo `grid` desítkám tříd.
   Skrytý prvek pak zůstane vidět. Musí se to říct znovu, jako autor. */
.agn [hidden] { display: none; }

/* Odznaky stavu otázky. Návrh počítal jen se dvěma (nová / zodpovězená);
   stavy jsou ale tři — přiřazení na akci ještě není odpověď. Barvy vychází
   z `question-new` a `done` z návrhu, prostřední je modrá značky. */
.agn .badge.question-prirazena {
    background: var(--soft);
    color: var(--blue);
}

/* Poznámka pod kontakty v profilu. Návrh na jejím místě má odkaz „Požádat
   o opravu", který je u nás zrušený — není tedy co opsat. Odsazení kopíruje
   ostatní obsah karty (`.pf-questionnaire-body`), aby text nelepil na okraj. */
.agn .pf-contacts-note { padding: 0 25px 25px; }

/* Pole dotazníku. Návrh počítá jen s `textarea`, jenže naše otázky jsou
   typované podle `TypOtazky` (číslo, procenta, výběr) — typ si zaslouží
   zachovat kvůli klávesnici na mobilu i kontrole hodnoty. Vzhled proto
   přebírají od `.qn-field textarea` z návrhu; `min-height` nemají,
   jednořádková hodnota nepotřebuje sto pixelů. */
.agn .qn-field input,
.agn .qn-field select {
    display: block;
    width: 100%;
    margin-top: 11px;
    padding: 12px 14px;
    border: 1px solid #bac2cf;
    border-radius: 11px;
    line-height: 1.8;
    font-size: 13px;
    color: var(--dark);
    background: #fff;
}
.agn .qn-field input::placeholder { color: #939baa; }

/* Rámeček vloženého videa v lekci Akademie. Návrh video neřešil — má tam
   jen tlačítko „Přehrát video"; zadavatel chce embed jako v EverFLOW
   (13. 10. 2026). Poměr 16:9 drží `aspect-ratio`, aby se iframe nemusel
   dopočítávat skriptem. */
.agn .aka-video-ramec {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    margin-top: 12px;
    border-radius: 14px;
    overflow: hidden;
    background: var(--dark);
}
.agn .aka-video-ramec iframe,
.agn .aka-video-ramec video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

/* Plocha pro vložený Prospector. Návrh tu má jen prázdný rámeček s popiskou,
   že obsah načítá aplikace — rozměr tedy není co opsat.

   VÝŠKA PODLE OKNA, ne pevných 20 000 px jako v CRM. Cizí rám svou výšku
   neohlásí, takže se dá volit mezi rolováním uvnitř rámu a stránkou, která
   má pod obsahem kilometr prázdna. Tady vyhrálo první; přepnout je to jeden
   řádek. */
.agn .company-prospector-body {
    margin: 0 25px 25px;
    border: 1px dashed var(--line);
    border-radius: 14px;
    overflow: hidden;
    min-height: 640px;
}
.agn .company-prospector-body iframe {
    display: block;
    width: 100%;
    height: calc(100vh - 210px);
    min-height: 640px;
    border: 0;
}
.agn .company-prospector-placeholder {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: 60px 25px;
    text-align: center;
}
.agn .company-prospector-placeholder .icon { width: 28px; height: 28px; color: var(--blue); }
.agn .company-prospector-placeholder p { max-width: 460px; }

/* ── Tabulky na telefonu ──────────────────────────────────────────────────
   Návrh tabulky na úzkém okně jen POSOUVÁ DO STRANY: `data-table` má přes
   900 px, takže z osmi sloupců jsou vidět dva a na zbytek se musí rolovat.
   Projekt má pro tohle vlastní pravidlo (CLAUDE.md): tabulky se na mobilu
   rozpadají na karty, kromě srovnávacích, které se čtou po sloupcích.

   Portál to uměl pro své `agp-tab` a převodem na `data-table` o to přišel.
   Tohle to vrací. Popisek sloupce nese `data-popisek`, který dopisují
   šablony a `ai-guru-portal-ukoly.js`.

   Breakpoint 760 px = tentýž, na kterém návrh přepíná do mobilního režimu. */
@media (max-width: 760px) {
    .agn .data-table thead { display: none; }
    .agn .data-table,
    .agn .data-table tbody,
    .agn .data-table tr,
    .agn .data-table td { display: block; width: 100%; }
    /* Šířky sloupců z návrhu (`.question-table td:first-child { width: 29% }`…) jsou specifičtější —
       v kartě by první buňku nechaly úzkou a nadpis otázky se rozpadl po písmenech. */
    .agn .data-table td:nth-child(n) { width: 100%; }

    /* Návrh dává tabulkám `min-width` (925 px u úkolů, 850 u otázek…), aby
       se daly posouvat do strany. V kartách by to tabulku drželo širokou
       než okno, takže se to tu ruší. */
    .agn .task-table,
    .agn .question-table,
    .agn .company-history-table,
    .agn .pf-contact-table { min-width: 0; }

    .agn .data-table tr {
        padding: 12px 0;
        border-bottom: 1px solid var(--line);
    }
    .agn .data-table tr:last-child { border-bottom: 0; }

    .agn .data-table td {
        display: flex;
        justify-content: space-between;
        gap: 16px;
        padding: 4px 25px;
        border: 0;
        text-align: right;
    }
    .agn .data-table td::before {
        content: attr(data-popisek);
        color: var(--muted);
        font-size: 12px;
        text-align: left;
        flex: 0 0 auto;
    }
    /* Prázdný popisek = sloupec s ikonou nebo tlačítkem; ten se roztáhne. */
    .agn .data-table td[data-popisek='']::before { content: none; }
    .agn .data-table td[data-popisek=''] { justify-content: flex-end; }

    /* Rámeček pak nemá co posouvat. */
    .agn .table-scroll { overflow-x: visible; }
}

/* ── Odkazy v psaném textu portálu ─────────────────────────────────────
   `ai-guru-navrh.css` má plošné `.agn a { color: inherit; text-decoration:
   none }`. Má stejnou specificitu jako `.agp-obsah a` z portálové CSS, ale
   načítá se po ní — odkaz v textu proto splynul s okolím a čtenář nepoznal,
   že na něj jde kliknout.

   Platí VŠUDE, kde se zobrazuje text od autora: obsah lekce i program
   schůzky. Jen tyhle dvě místa `.agp-obsah` používají a v obou jde o psaný
   text, ne o tlačítka.

   Nesahá se tím na `.agp-drobecek`, na tlačítka v hlavičce článku ani na
   plochu videa — ty jsou taky odkazy, ale leží mimo `.agp-obsah` a modré
   podtržení by z nich udělalo text.

   Stejný přístup, jaký návrh používá u `.rich-content` — tam je to řádek 295. */
.agn .agp-obsah a,
.agn .aka-clanek-perex a {
    color: var(--blue);
    text-decoration: underline;
    text-underline-offset: 2px;
    overflow-wrap: anywhere;
}
.agn .agp-obsah a:hover,
.agn .aka-clanek-perex a:hover {
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

/* ── Výběr firmy (zadání 22.2) ─────────────────────────────────────────
   Návrh členské sekce počítá s jednou firmou; kdo má přístup do víc, vybírá.
   Karty firem v mřížce, tlačítko vpravo — prvky `card` a `btn` jsou z návrhu. */
.agn .agp-firmy-vyber { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.agn .agp-firma-karta { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0; }
.agn .agp-firma-karta h2 { font-size: 17px; margin: 0; }
.agn .agp-firma-karta p { margin: 4px 0 0; font-size: 14px; }
@media (max-width: 600px) { .agn .agp-firmy-vyber { grid-template-columns: 1fr; } }

/* Hover tlačítek podle aktuální vrstvy návrhu (`--hover-primary`, `--hover-neutral`) pro celý portál
   (kontrola-portal-2, body 1–2). Vygenerované soubory jednotlivých stránek je nemají všechny:
   výběr pravidel podle tříd zahodil `:is()` přes mnoho tříd. */
.agn { --hover-neutral: #f2f4f7; --hover-primary: #2446e8; }
@media (hover: hover) {
    .agn #main .btn.btn-primary:not(:disabled):not([aria-disabled="true"]):not(.reviews-danger-solid):hover { background: var(--hover-primary); border-color: var(--hover-primary); color: rgb(255, 255, 255); box-shadow: none; transform: none; }
    .agn #main :is(.btn, .btn-secondary, .docs-icon-button, .company-icon-button, .close-btn, .member-comment-action):not(:disabled):not([aria-disabled="true"]):not(.btn-primary):not(.active):not([aria-pressed="true"]):hover { background-color: var(--hover-neutral); border-color: rgb(220, 225, 236); box-shadow: none; transform: none; }
    .agn .menu-btn:hover { background-color: var(--hover-neutral); border-color: rgb(220, 225, 236); box-shadow: none; transform: none; }
}
@media (hover: hover) {
    .agn .nav-link.active:hover { background: var(--hover-primary); border-color: var(--hover-primary); color: rgb(255, 255, 255); }
}

/* Rozbalovací nabídka vlastního výběru (`ai-guru-select.js`) se vkládá do <body>, mimo #main — pravidla z návrhu
   proto platí pod `.agn` (na <html>). Bez toho zůstane nabídka mimo dialog bez stylu (kontrola otázky-2, bod 1). */
.agn .guru-select-menu {position: fixed; z-index: 100000; padding: 6px; border: 1px solid rgb(223, 227, 238); border-radius: 14px; background: rgb(255, 255, 255); box-shadow: rgba(22, 33, 66, 0.1) 0px 12px 30px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; font-family: Inter, sans-serif; box-sizing: border-box;}
.agn .guru-select-menu > button {display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding: 12px; border: 0px; border-radius: 9px; text-align: left; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; line-height: 1.5; background: white; color: rgb(11, 13, 16); cursor: pointer;}
.agn .guru-select-menu > button:hover, .agn .guru-select-menu > button:focus {background: rgb(243, 245, 250); outline: none;}
.agn .guru-select-menu > button[aria-selected="true"] {background: rgb(237, 241, 255); color: var(--blue,#3457ff);}
.agn .guru-select-menu > button:disabled {opacity: 0.4; cursor: default;}
.agn .guru-select-group {padding: 14px 12px 6px; color: rgb(101, 112, 137); font-size: 11px; font-weight: 700; letter-spacing: 0.04em;}
.agn .guru-select-menu > button span:last-child:not(:first-child) {flex: 0 0 auto;}

/* ── Skořápka podle aktuálního prototypu (krok 6g-2): skupiny menu, Můj profil dole, účet s fotkou a jménem ── */
.agn .sidebar .nav-group-start { margin-top: 20px; position: relative; }
.agn .sidebar .nav-group-start::before { content: ""; position: absolute; top: -11px; left: 16px; right: 16px; height: 1px; background: rgb(230, 233, 241); }
.agn .sidebar .nav-profile-footer { flex: 0 0 auto; margin-top: auto; }
.agn #gp-sidebar + .nav-profile-footer { margin-top: 0; }
.agn .sidebar .nav-help { margin-top: 4px; flex: 0 0 auto; }
.agn .root-account-button { display: flex; align-items: center; gap: 10px; min-width: 0; text-align: left; max-width: 290px; padding: 4px; white-space: nowrap; }
.agn .header-profile-photo { display: block; flex: 0 0 auto; }
.agn .root-account-button .cm-avatar { width: 38px; height: 38px; border-radius: 50%; background: rgb(237, 241, 255); color: rgb(47, 91, 255); display: grid; place-items: center; flex: 0 0 auto; font-weight: 650; font-size: 13px; overflow: hidden; }
.agn .root-account-button .cm-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.agn .header-profile-copy { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.agn .header-profile-copy strong { font-size: 13px; font-weight: 600; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agn .header-profile-copy small { font-size: 12px; line-height: 1.4; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agn .root-account-button > .icon { width: 16px; height: 16px; flex: 0 0 auto; color: var(--muted); transform: rotate(90deg); }
@media (max-width: 1000px) {
    .agn .header-profile-copy { max-width: 150px; }
}
@media (max-width: 760px) {
    .agn .root-account-button .header-profile-copy, .agn .root-account-button > .icon { display: none; }
    .agn .root-account-button { gap: 0; }
}
@media (max-width: 440px) {
    .agn .root-account-button { padding: 0; }
    .agn .root-account-button .cm-avatar { width: 32px; height: 32px; }
}

/* Míry skořápky z aktuálního návrhu (kontrola-skorapka-1): starší ai-guru-navrh.css má jiné. */
.agn .sidebar, .agn .topbar { --muted: #5d667b; }
.agn .sidebar .brand { margin-bottom: 20px; }
.agn .sidebar nav { flex: 1 1 0%; min-height: 0; overflow-y: auto; padding-bottom: 16px; }
.agn .sidebar .nav-link { min-height: 42px; padding: 10px 13px; margin-bottom: 3px; gap: 13px; font-size: 14px; line-height: 22px; }
.agn .sidebar .nav-link .icon { width: 20px; height: 20px; flex: 0 0 auto; }
@media (pointer: coarse) {
    .agn .sidebar .nav-link { min-height: 44px; }
}
.agn .topbar { padding: 0 28px; min-height: 78px; }
.agn .root-header-search { flex: 1 1 0%; min-width: 0; max-width: 720px; }
.agn .root-header-search button { min-height: 44px; font-size: 14px; }
.agn .top-account { gap: 18px; flex: 0 0 auto; }
@media (max-width: 1000px) {
    .agn .topbar { gap: 12px; }
    .agn .root-header-search { max-width: 720px; }
    .agn .top-account { gap: 10px; }
}
@media (max-width: 760px) {
    .agn .root-header-search button { padding: 10px 12px; }
}
@media (max-width: 600px) {
    .agn .menu-btn { min-height: 44px; min-width: 44px; }
}
@media (max-width: 440px) {
    .agn .topbar { gap: 6px; padding: 0 10px; }
    .agn .top-account { gap: 2px; }
}

/* Dialogy skořápky (hledání ⌘K, nabídka účtu) leží mimo #main — míry z aktuálního návrhu (kontrola-skorapka-2). */
.agn :is(#agpHledani, #agpUcetMenu) { --muted: #5d667b; }
.agn :is(#agpHledani, #agpUcetMenu) .dialog-head { padding: 20px 24px; gap: 16px; background: #fff; }
.agn :is(#agpHledani, #agpUcetMenu) .dialog-head h2 { font-size: 20px; font-weight: 700; line-height: 1.35; letter-spacing: -0.45px; }
.agn :is(#agpHledani, #agpUcetMenu) .dialog-head p { font-size: 13px; line-height: 1.65; margin-top: 8px; color: var(--muted); }
.agn :is(#agpHledani, #agpUcetMenu) .dialog-body { padding: 24px; }
.agn #agpHledani .field { font-size: 13px; font-weight: 600; }
.agn #agpHledani .field input { font-size: 14px; font-weight: 600; line-height: 1.5; padding: 10px 12px; border-radius: 12px; border-color: rgb(220, 225, 235); min-height: 44px; }
.agn .root-search-result > span { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.agn .root-search-result small { font-size: 11px; font-weight: 400; color: var(--muted); }
.agn .root-search-result strong { font-size: 14px; font-weight: 700; }
.agn .root-search-result > .icon { width: 21px; height: 21px; flex: 0 0 auto; }
.agn .root-search-result[hidden], .agn .ux-empty[hidden] { display: none; }
.agn .ux-empty { padding: 24px 12px; text-align: center; color: var(--muted); }
.agn .ux-empty h3 { font-size: 16px; font-weight: 650; line-height: 1.4; margin: 24px 0 10px; color: #0b0d10; }
.agn .ux-empty p { font-size: 14px; }
@media (max-width: 760px) {
    .agn :is(#agpHledani, #agpUcetMenu) :is(.dialog-head, .dialog-body) { padding: 18px; }
    .agn #agpHledani .field input { font-size: 16px; }
}
/* Hover tlačítek v liště jako obecné `button:hover` návrhu (platí jen v #main). */
@media (hover: hover) {
    .agn .topbar :is(.root-bell, .root-account-button):not(:disabled):hover { background-color: #f2f4f7; }
}

/* Hledání v datech (22.3b): výstřižek pod názvem výsledku. */
.agn .root-search-result em { display: block; margin-top: 3px; font-style: normal; font-size: 12px; line-height: 1.5; color: var(--muted); }