/* =============================================================================
 * !!! POZOR - PRECTI SI TOHLE NEZ ZACNES EDITOVAT !!!
 * =============================================================================
 *
 * Tohle je Mountfield Custom CSS - MASTER COPY pro Helios Web Portal.
 * Veskere zakaznicke styly delame JEN ZDE. Soubor Project/project.styles.css
 * je legacy snapshot (pre-BS5), ktery aplikace regeneruje pri vycisteni cache -
 * tam needituj, prijdes o to a navic je obsahove zastaraly.
 *
 * BS5 MIGRACE: Vsechny BS5 fixy (BS3 -> BS5 upgrade web. portalu) jsou tady -
 * navbar-brand container, dark mode pravidla, #RightMenu flex, BS5 nahrada
 * .jumbotron, card BS5 styling, .btn-default replacement atd. Project CSS
 * tyto fixy nema (jen 24 pravidel oproti 158 zde).
 *
 * SOUVISEJICI SOUBORY
 * -------------------
 *   ~/Custom/mountfield/mountfield.script.js  - parner JS (master) +
 *                                                detaily k Project / _Layout
 *   ~/Web.config                               - CustomCssPathClient miri sem
 *
 * POZN.: Project CSS se sam nenahrava (na rozdil od Project JS), takze zadnou
 * upravu _Layout.cshtml pro CSS nepotrebujeme. Asymetrie je popsana v hlavicce
 * partnerskeho JS souboru.
 * ============================================================================= */

body {
    padding-top: 1px;
}

/* BS5 + Helios upgrade: navbar-brand obsahuje vnořený <div class="container">,
   který má max-width breakpointy a omezený gutter padding - ten kombinovaný
   s default stylováním <a> ořezával logo na pár pixelů. Pozadí proto aplikujeme
   přímo na #main-logo div s explicitními rozměry a vnořený <a> jen vyplní celou
   oblast jako klikatelný obal. .container constraints přepíšeme na auto. */
#main-logo-container {
    max-width: none !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
}
#main-logo {
    width: 150px;
    height: 40px;
    background: url(mountfield-logo.png) no-repeat left center;
    background-size: contain;
}
#main-logo a {
    display: block;
    width: 100%;
    height: 100%;
    font-size: 0;
    color: transparent;
    text-decoration: none;
    margin: 0;
    /* Helios Site.css nastavuje na #main-logo a background-image s logem
       Nephrite (a tmavou variantu pro data-bs-theme="dark"). Náš loga je
       na #main-logo divě, takže Nephrite se kreslil PŘES Mountfield logo.
       Vyřazujeme background na <a> i obě theme varianty. */
    background: none !important;
}
[data-bs-theme="dark"] #main-logo a,
[data-bs-theme="light"] #main-logo a {
    background: none !important;
}


.bg {
    background: url(Welcome.jpg) no-repeat center;
    background-size: cover;
    height: 400px;
}

/* BS5: třída .jumbotron byla v Bootstrapu 5 odstraněna a Helios v Index.cshtml
   renderuje hero box jako <div class="bg-light mb-4 rounded-2 py-5 px-3">.
   Skrýváme ho jen vizuálně (visibility:hidden), místo aby zmizel z layoutu.
   Důvod: .bg (trávník) má height:400px a hero box pod ním tlačí .cards níž.
   Při display:none by se karty vykreslily přes obrázek trávníku.
   .jumbotron necháváme pro starší markup, pokud by se někde objevil. */
.jumbotron,
.bg-light.rounded-2.py-5,
.bg-dark.rounded-2.py-5 {
    visibility: hidden !important;
}

.basicCard {
    display:none;
}


/* BS5: .navbar-nav má v BS5 výchozí flex-direction:column, takže #UserInfo
   prepended do #RightMenu se zobrazoval NAD tlačítkem Odhlásit. Forsujeme
   display:flex + horizontální směr a UserInfo barvíme načerno.
   (JS addUserInfoToMenu() prependuje UserInfo do RightMenu, order:-1 pro
   jistotu zajistí, že se v row layoutu vykreslí jako první - vlevo.) */
#RightMenu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: auto !important;
}
#RightMenu > #UserInfo {
    order: -1;
}
#InnerMenu {
    display: flex !important;
    align-items: center !important;
}
#UserInfo {
    display: flex !important;
    align-items: center !important;
    margin-right: 12px;
    white-space: nowrap;
}
#UserInfo,
#UserInfo a,
#UserInfo span,
#UserInfo strong,
#UserInfo div,
#UserInfo b {
    color: #000 !important;
}
/* Dark mode: navbar má tmavé pozadí (data-bs-theme="dark" na <body>),
   tam musí být UserInfo světlý, jinak je nečitelný. */
[data-bs-theme="dark"] #UserInfo,
[data-bs-theme="dark"] #UserInfo a,
[data-bs-theme="dark"] #UserInfo span,
[data-bs-theme="dark"] #UserInfo strong,
[data-bs-theme="dark"] #UserInfo div,
[data-bs-theme="dark"] #UserInfo b {
    color: #fff !important;
}

/* Settings dropdown (vpravo kolečko) - Helios _Layout.cshtml dává na <ul>
   třídu "text-dark", což v dark mode dělá tmavý text na tmavém pozadí =
   nečitelné (profily, dark mode toggle apod.). V dark mode přepisujeme
   na světlou barvu. Light mode necháváme být - tam je text-dark správně. */
[data-bs-theme="dark"] .dropdown-menu.text-dark,
[data-bs-theme="dark"] .dropdown-menu.text-dark a,
[data-bs-theme="dark"] .dropdown-menu.text-dark label,
[data-bs-theme="dark"] .dropdown-menu.text-dark span,
[data-bs-theme="dark"] .dropdown-menu.text-dark div,
[data-bs-theme="dark"] .dropdown-menu.text-dark li,
[data-bs-theme="dark"] .dropdown-menu.text-dark .dropdown-item {
    color: #fff !important;
}


.Cards{
    font-family: Calibri;
}

.generateCard{
-webkit-box-shadow: inset 0px 0px 21px -4px rgba(0,0,0,0.75);
-moz-box-shadow: inset 0px 0px 21px -4px rgba(0,0,0,0.75);
box-shadow: inset 0px 0px 21px -4px rgba(0,0,0,0.75);
border:solid;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
height:420px;
/* Vnitřní odsazení textu a ikon od krajů karty */
padding: 18px 16px;
/* Overflow hidden, aby ikony při úzké šířce karty nevylézaly ven */
overflow: hidden;
}

/* Karty posunout níž pod obrázek trávníku tak, aby nezasahovaly do textu
   "Informace – vždy na dosah ruky", který je zapečen do Welcome.jpg.
   .bg je v Helios Site.css position:absolute z-index:-1 height:350px, ale
   prakticky bere ~400px (override v naší CSS). margin-top doladěn empiricky. */
.cards {
    margin-top: 140px;
}

/* BS5 gutter: výchozí --bs-gutter-y je 0, takže po zalomení mezi řádky nebyla
   žádná mezera. Nastavujeme vertikální gutter na 1.25rem, BS5 to aplikuje jako
   padding-top na sloupce. Karty zarovnáme horizontálně na střed - .row je flex
   container, takže stačí justify-content:center. */
.cards .row {
    --bs-gutter-y: 1.25rem;
    justify-content: center;
}

/* Karty mají pevnou šířku 250 px, nezužují se s viewportem.
   BS5 .row má flex-wrap:wrap - když se karta nevejde, automaticky se zalomí. */
.cards .row > .col-md-2 {
    width: 250px !important;
    max-width: 250px !important;
}

/* Ikony v kartách - zmenšení cca o 30 % z původní velikosti (~100px -> 70px).
   !important přebíjí inline styl, který JS responsive větev nastavuje pro malé
   viewporty (width/height 75px). */
.generateCard img {
    max-width: 70px !important;
    max-height: 70px !important;
    width: auto;
    height: auto;
    display: block;
    margin: 0 auto 10px;
}

/* Karty mají vždy SVĚTLÉ pozadí (každá svou barvu definovanou v JS addCard),
   takže text uvnitř musí být tmavý nezávisle na theme. V dark mode Helios
   globálně přepíná text na bílý a uvnitř karet by byl nečitelný.
   Cílíme i na :is selektory pro vnořené texty popisků. */
.generateCard,
.generateCard h2,
.generateCard p,
.generateCard label,
.generateCard span,
.generateCard div,
[data-bs-theme="dark"] .generateCard,
[data-bs-theme="dark"] .generateCard h2,
[data-bs-theme="dark"] .generateCard p,
[data-bs-theme="dark"] .generateCard label,
[data-bs-theme="dark"] .generateCard span,
[data-bs-theme="dark"] .generateCard div {
    color: #000 !important;
}

/* "Více..." odkaz na kartě - stylujeme jako tlačítko.
   .btn-default v BS5 neexistuje, takže odkaz by jinak vypadal jako čistý text.
   Přidáváme bílé pozadí, černý rámeček, padding a hover efekt. */
.generateCard .more-btn,
.generateCard a.btn,
.generateCard .btn,
.generateCard .btn-default {
    color: #000 !important;
    background-color: #fff !important;
    border: 1px solid #333 !important;
    border-radius: 4px !important;
    padding: 6px 18px !important;
    text-decoration: none !important;
    display: inline-block;
    font-size: 13px;
    line-height: 1.4;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.generateCard .more-btn:hover,
.generateCard a.btn:hover,
.generateCard .btn:hover {
    background-color: #333 !important;
    color: #fff !important;
}

#questionary-success-message{
    font-size: 16px;
}