* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /*outline: 1px solid red; /* Dočasná pomůcka pro debug */
}

body {
    font-family: Arial, sans-serif !important;
    color: var(--barvatext);
    background-color: var(--barvapozadi);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    overflow-x: auto;
}

/* Hlavička stránky */
.header {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1500;
    background-color: var(--barvapozadi-top);
}

.header-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    color: white;
    padding: 5px 20px;
}

.header-top .logo img {
    display: block;
    width: 200px;
    max-height: 60px;
    margin: 0;
    padding: 0;
    object-fit: contain;
}

.header-top .user-info {
    display: flex;
    justify-content: flex-end; /* Rozdělení prvků vlevo a vpravo */
    align-items: center; /* Vertikální zarovnání */
    flex-wrap: wrap; /* Umožní zalomení pod sebe pro session-info */
    gap: 5px; /* Mezera mezi prvky */
    font-size: 14px;
    text-align: right;
}

.header-top .user-info .user-details {
    display: flex;
    align-items: center; /* Zarovnání textu na střed */
    white-space: nowrap; /* Zabrání zalamování textu */
}



.header-top .user-info .logout-button {
    background-color: white;
    color: #D53034;
    padding: 5px 10px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
    transition: background-color 0.3s;
    margin: 0px;
    flex-shrink: 0; /* Zabrání tlačítku zmenšování */
}

.header-top .user-info button:hover {
    background-color: #5a6268;
    color: white;
}

.header-top .user-info .session-info {
    flex-basis: 100%; /* Zabere celou šířku při zalomení */
    margin-top: 5px;
    font-size: 12px;
    color: #ddd; /* Světlejší text */
    text-align: right; /* Zarovnání doprava */
}

.header-top .session-info-responze{
    display: none;
}


.header-bottom {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;

    background-color: var(--barvapozadi-header);
    color: white;
    padding: 0 0px;
    height: 40px;
    
}

.header-bottom .nav-links {
    display: flex; /* Flexbox pro zarovnání položek */
    justify-content: left; /* Horizontální vycentrování */
    align-items: center; /* Vertikální vycentrování */
    position: relative; /* Nastavení relativní pozice pro absolutní umístění potomků */
    height: 100%; /* Výška odpovídá rodičovskému prvku */
    width: 100%;
}

.header-bottom .nav-links a {
    padding: 10px 20px;
    background-color: var(--barvapozadi-header-button);
    color: white;
    font-size: 16px;
    border: 0px solid transparent;
    border-radius: 1em;
    text-decoration: none;
    font-weight: bold;
    margin-right: 10px;
    cursor: pointer;
}

.header-bottom .nav-links a.active {
    background-color: var(--barvapozadi-header-button-active);
    border: #5a6268 0px solid;
    
}

.header-bottom .nav-links a.active:hover {
    background-color: #434242;
    border-color: #111;
}

.header-bottom .nav-links a:not(.active):hover {
    background-color: #434242;
    border-color: #333;
}

.header-bottom .nav-links .module-link {
    margin-left: 32px;
    margin-right: auto;
}

.header-bottom .nav-links a.info {
    background-color: #4A4A4A;
    border-color: none;
}

.module-header {
    position: absolute; /* Absolutní pozicování uvnitř .nav-links */
    white-space: nowrap; /* Zabrání zalomení textu */
}

.module-header-top {
    padding-left: 4em;
    font-size: 23px;
    font-weight: bold;
    align-items: center;
}

.module-header-info {
    display: none;
    position: absolute; /* Absolutní pozicování uvnitř .nav-links */
    right: 10px;
    white-space: nowrap; /* Zabrání zalomení textu */
}


.hamburger {
    display: none;
}

.mobile-line-break {
    display: none; /* Skrytí <br> na větších zařízeních */
}

/* Kontejner stránky */
.container {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    padding-top: 95px;
    min-height: calc(100vh - 120px); /* Zajištění, že obsah zabere celou výšku stránky */
    max-width: 100%;
}

.resizer {
    width: 5px;
    cursor: ew-resize;
    background-color: var(--barvaresizer);
    position: absolute;
    top: 90px; /* Posunuto dolů - zohledňuje 95px hlavičku a 5px mezery */
    bottom: 0px;
    z-index: 1001;
    display: none;
}

/* Menu vlevo */
.menu {
    background-color: var(--barvamenu-pozadi);
    padding: 0.3em;
    position: fixed;
    top: 97px;
    bottom: 0;
    overflow-y: auto;
    transition: background-color 0.3s, color 0.3s;
    text-decoration: none;
    z-index: 1000;
}

.menu-header {
    display: flex;
    align-items: center;   /* Vertikální zarovnání na střed */
    justify-content: space-between;
    position: sticky;
    top: 0px;
    background-color: var(--barvamenu-pozadi);  /* Stejné pozadí jako menu */
    padding: 5px;
    z-index: 100;         /* Zabrání překrývání jinými prvky */
    gap: 10px;            /* Mezera mezi prvky */
}

.menu-search-input {
    flex: 1;              /* Zabere zbytek volného prostoru */
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: var(--barvamenu-pozadi-search);
    color: var(--barvamenu-text-search);
    font-size: 16px;
    width: 90%;
    height: auto; 
}

.menu a {
    display: block;
    padding: 0.3em;
    color: var(--barvamenu-text);
    margin-bottom: 2px;
    border-radius: 5px;
    transition: background-color 0.3s;
    text-decoration: none;
    cursor: pointer;
    background-color: var(--barvamenu-pozadi);
}

.menu a:hover {
    background-color: var(--barvamenu-pozadi-hover);
    color: var(--barvamenu-text-hover);
}

.menu a.active {
    background-color: var(--barvapozadi-top);
    color: white; /* Bílý text pro lepší kontrast */
    font-weight: bold; /* Tučné písmo pro zvýraznění */
    border: 0px solid #5a6268; /* Přidání rámečku pro další vizuální oddělení */
    padding: 8px 5px; /* Úprava paddingu pro lepší vzhled s rámečkem */
    
}

.menu-close {
    flex-shrink: 0;       /* Zabrání zmenšení tlačítka */
    background: #5a6268;
    color: #ccc;
    border: none;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    margin-top: -9px;
}

.menu-close:hover {
    background: #c1272d;
    color: #fff;
}



.hamburger-wrapper {
    position: fixed;                /* Zajistí pevnou pozici hamburgeru při scrollování */
    top: 100px;                      /* Odsazení od horního okraje */
    left: 0px;                     /* Odsazení od levého okraje */
    z-index: 1000;                  /* Nad ostatním obsahem */
    width: 35px;                    /* Šířka minimalizovaného menu */
    background-color: var(--barvamenu-pozadi);
    height: 100%;
}

.hamburger-close {
    position: sticky;
    top: 0;
    z-index: 1000;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    padding: 10px;
    color: var(--barvamenu-text);
    background-color: var(--barvamenu-pozadi);
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    
}

.zobrazit-menu {
    position: absolute;
    top: 96px;
    left: 50%;
    transform: translateX(-50%) rotate(-90deg);
    transform-origin: center;
    white-space: nowrap;
    font-size: 16px;
    font-weight: normal;
    cursor: pointer;
    color: var(--barvamenu-text);
    text-align: center;
    letter-spacing: 2px;
}




.main {
    flex-grow: 1;
    background-color: var(--barvapozadi);
    padding: 0px 20px;
}

.main table {
    width: auto;
    max-width: 100%; /* Zabrání roztažení tabulky přes viewport */
    table-layout: fixed; /* Přinutí tabulku zůstat v rámci nastavené šířky */
    word-wrap: break-word; /* Zalomí obsah buněk, aby se vešel do prostoru */
    border-collapse: collapse;
    background-color: var(--barvapozadi);
}

.main table tr[onclick] {
    cursor: pointer !important; /* Kurzoru se nastaví pointer na celý řádek */
}

.main table tr[onclick] td {
    cursor: pointer !important; /* Kurzoru se nastaví pointer na jednotlivé buňky */
}


.main table .in_form{
    width: auto;
    max-width: 100%; /* Zabrání roztažení tabulky přes viewport */
    table-layout: fixed; /* Přinutí tabulku zůstat v rámci nastavené šířky */
    word-wrap: break-word; /* Zalomí obsah buněk, aby se vešel do prostoru */
    border-collapse: collapse;
}

.main table .in_form td, .main table .in_form th {
    border-right: 1px solid var(--hrana-td) !important;
    text-align: left;
}

.main table .in_form tbody tr:nth-child(even) {
    background-color: var(--barvapozadi-tr-even);
}

.main table .in_form tbody tr:hover {
    background-color: var(--barvapozadi-tr-hover) !important;
}

.main table .in_form tr[onclick] {
    cursor: pointer !important; /* Kurzoru se nastaví pointer na celý řádek */
}

.main table .in_form tr[onclick] td {
    cursor: pointer !important; /* Kurzoru se nastaví pointer na jednotlivé buňky */
}





/* Fixní sekce s buttony a filtračními pravidly */
.main-buttons {
    position: sticky;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 8px;
    top: 95px;
    background-color: var(--barvapozadi-main-buttons);
    padding-top: 11px;
    white-space: nowrap;
    z-index: 500;
}

.main-buttons .left-section {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.main-buttons button {
    padding: 10px 20px;
    background-color: var(--barvapozadi-top);
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
}

.main-buttons button:hover {
    background-color: #c1272d;
}




.filter-summary-container {
    position: relative;
    margin-bottom: 0px;
}

#filter-summary {
    display: flex;
    flex-wrap: wrap; /* umožní řádkům se zalomit, pokud není dostatek místa */
    gap: 10px; /* mezera mezi boxy */
}

#filter-summary div {
    border: 1px solid var(--barvahrana-filter-buttons);
    padding: 8px; /* odsazení uvnitř boxu */
    background-color: var(--barvapozadi-filter-buttons);
    border-radius: 5px; /* zaoblení rohů */
    white-space: nowrap; /* zabrání zalomení textu uvnitř boxu */
    font-size: 14px;
}

#show-filter-summary-btn {
    background-color: var(--barvapozadi-top);
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
    display: block;
    margin-top: 0px;
}

#show-filter-summary-btn:hover {
    background-color: #c1272d;
}

#reset-filter-button {
    padding: 10px 10px;
    background-color: transparent;
    color: var(--barvatext-filter-reset);
    font-weight: bold;
}

#reset-filter-button:hover {
    background-color: var(--barvapozadi-filter-reset);
}






/* Filtrovací okno */
.filter-window {
display: none;
position: relative;
margin-top: 10px;
background-color: var(--barvapozadi-filter-window);
border: 1px solid #ddd;
padding: 20px;
border-radius: 5px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
width: 100%;
z-index: 500;
}

.filter-row {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #ccc; /* Přidá spodní okraj */
}

.filter-row label {
font-weight: normal;
min-width: 100px;
/*align-self: flex-start;  Zajistí zarovnání popisku nahoru */
white-space: nowrap; /* Zabrání zalomení textu v popisku */
flex-shrink: 0;
}


/* Styl pro text input */
.filter-row .text {
display: flex;
align-items: center;
gap: 10px; /* Mezera mezi label a input */
width: 100%;
}

.filter-row .text-item {
display: flex;
align-items: center;
width: 100%; /*Zajistí, že input bude na plnou šířku */
flex-grow: 1; /* Textové pole se roztáhne do zbytku volného místa */
}

.filter-row .text-item input[type="text"] {
flex-grow: 1;
padding: 10px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 5px;
}




/* Pro radio prvky v řádku */
.filter-row .radio-in-row {
display: flex;
gap: 15px; /* Zajistí mezery mezi radio buttony v řádku */
}

/* Pro radio prvky pod sebou */
.filter-row .radio-in-column {
display: flex;
flex-direction: column; /* Zajistí, že radio prvky budou pod sebou */
gap: 5px; /* Vzdálenost mezi radio prvky ve sloupci */
}

/* Pro checkbox */
.filter-row .checkbox-item {
display: flex;
align-items: center;
gap: 5px;
}

.filter-row .checkbox-item label {
margin-right: 0px;
}

/* Pro select a text input na jednom řádku */
.filter-row .select-text {
display: flex;
align-items: center;
gap: 10px; /* Mezera mezi select a text input */
width: 100%;
}

.filter-row .select-text-item {
display: flex;
align-items: center;
gap: 10px;
flex-grow: 1; /* Zajistí, že textové pole vyplní zbývající šířku */
}

.filter-row .select-text-item select {
font-size: 16px;
padding: 10px; /* Zajišťuje stejný padding jako text input */
border: 1px solid #ccc;
border-radius: 5px;
height: 42px; /* Stejná výška jako text input */
width: auto; /* Zajišťuje, že select není příliš široký */
}

.filter-row .select-text-item input[type="text"] {
flex-grow: 1;
padding: 10px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 5px;
width: 100%;
height: 42px; /* Stejná výška jako select */
}



.filter-window.hidden {
    top: -100px;
    opacity: 0;
}

.filter-window button {
    padding: 10px 20px;
    background-color: var(--barvapozadi-top);
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.filter-window button:hover {
    background-color: #c1272d;
}

/* Pagination */
.pagination-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    background-color: var(--barvapozadi-pagination);
    position: sticky;
    top: 149px;
    z-index: 900;
}

.pagination {
    display: flex;
    gap: 10px;
}

.pagination a {
    font-size: 14px;
    padding: 10px 20px;
    background-color: var(--barvapozadi-top);
    color: white;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s;
    cursor: pointer;
}

.pagination a:hover {
    background-color: #c1272d;
}

.pagination-dropdown {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pagination-dropdown select {
    padding: 10px;
    background-color: var(--barvapozadi-top);
    color: white;
    border: none;
    border-radius: 5px;
    font-weight: bold;
    cursor: pointer;
}


/* Tabulka */
table {
    width: 100%;
    border-collapse: collapse;
    border: none;
    margin-top: 0px;
}

table td, table th {
    border-right: 1px solid var(--hrana-td);
    text-align: left;
}

th {
    position: sticky;
    top: 0;
    padding: 8px;
    background-color: var(--barvamenu-pozadi);
    z-index: 800;
    padding-right: 20px; /* Místo pro šipky na pravé straně */
    height: 42px;
}

td {
    padding: 8px;
}

tbody tr {
    cursor: pointer;
}

tbody tr:nth-child(even) {
    background-color: var(--barvapozadi-tr-even);
}

tbody tr:hover {
    background-color: var(--barvapozadi-tr-hover) !important;
}





/* zkracování a rozšiřování obsahu buněk v přehldu */
.truncate-cell {
    max-width: 100%;
}

.show-more {
    display: inline;
    vertical-align: baseline;
    margin-left: 5px;
    color: var(--barvatext-td-vice-mene);
    cursor: pointer;
    text-decoration: underline;
}




/* Layout dashboardu */
.dashboard {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); /* Flexibilní layout dlaždic */
gap: 20px;
padding: 20px;
}




/* Styl dlaždic */
.tile {
display: block;
background-color: var(--barvamenu-pozadi);
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
text-align: center;
text-decoration: none;
transition: transform 0.3s ease, box-shadow 0.3s ease;
width: 100%; /* Dlaždice bude mít vždy 100% šířky */
max-height: 300px; /* Nastavení maximální výšky dlaždice */
overflow-y: auto; /* Vertikální posuvník, pokud obsah přesáhne výšku */
}

/* Styl posuvníku (volitelné) */
.tile::-webkit-scrollbar {
    width: 8px;
}

.tile::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.tile::-webkit-scrollbar-track {
    background-color: #f0f0f0;
}

.tile i {
font-size: 40px;
color: #D53034;
margin-bottom: 10px;
}

.tile h3 {
margin-bottom: 10px;
font-size: 18px;
color: #333;
}

.tile p {
font-size: 16px;
color: #555;
}

/* Hover efekt */
.tile:hover {
transform: translateY(-10px);
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

/* Specifické barvy pro jednotlivé dlaždice */
.tile.theme1 {
background-color: #e3f2fd;
}

.tile.theme2 {
background-color: #f0f4c3;
}

.tile.theme3 {
background-color: #ffebee;
}

.tile.theme4 {
background-color: #e8f5e9;
}

.tile.theme5 {
background-color: #fce4ec;
}

.tile.theme6 {
background-color: #fff9c4;
}

.tile.theme7 {
background-color: #e0f7fa;
}

.tile.theme8 {
background-color: #d1e7ff;
}

/* Speciální styl pro širší dlaždici */
.tile.large {
grid-column: span 2;
}

/* Styl pro odkazy uvnitř dlaždic */
.tile a {
color: inherit; /* Zachování barev dlaždice pro odkazy */
text-decoration: underline !important; /* Odkazy budou podtržené */
cursor: pointer;
border-radius: 4px; /* Mírné zaoblení rohů */
padding: 2px 4px; /* Mírné odsazení pro efekt podbarvení */
}

/* Hover efekt pro odkazy uvnitř dlaždic */
.tile a:hover {
text-decoration: none !important; /* Zachování podtržení */
background-color: rgba(0, 0, 0, 0.1); /* Světlé podbarvení při hoveru */
border-radius: 4px; /* Mírné zaoblení rohů */
padding: 2px 4px; /* Mírné odsazení pro efekt podbarvení */
}






/* Tabulka uvnitř dlaždice 'Dotační projekty' - zajištění nezalamování textu a horizontálního posuvníku */
.table-container {
overflow-x: auto; /* Zajišťuje horizontální posuvník na menších obrazovkách */
margin-top: 10px;
max-width: 100%; /* Zajistí, že kontejner nebude širší než dlaždice */
}

.grant-table {
width: 100%; /* Tabulka zabírá maximální šířku dlaždice */
border-collapse: collapse;
font-size: 12px;
color: var(--barvatextu-grant-table);
}

.grant-table th, .grant-table td {
padding: 5px;
border-bottom: 0px solid #ddd;
text-align: left;
white-space: nowrap; /* Zabraňuje zalamování textu v buňkách */
}

.grant-table th, .grant-table td, .grant-table .bar, .grant-table strong{
    cursor: pointer;
}

.grant-table th {
background-color: var(--barvapozadi-grant-table-zahlavi);
font-weight: bold;
text-align: center;
}

.grant-table .bar {
display: inline-block;
height: 14px;
background-color: #d42e30;
margin-right: 5px;
}


/* Animace blikání */
@keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0.1;
}
100% {
opacity: 1;
}
}

/* Styl pro highlight dlaždice s blikající ikonou */
.tile.highlight i {
animation: blink 1s infinite; /* Aplikace animace na ikonu */
}

/* Zvýraznění pro důležité dlaždice */
.highlight {
border: 5px solid #D53034; /* Silný červený rámeček */
border-bottom: 15px solid #D53034;
background-color: #ffcccb; /* Výraznější červené pozadí */
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5); /* Silnější stín */
transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

.highlight:hover {
background-color: #ffb3b3; /* Ještě světlejší červené pozadí při hoveru */
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6); /* Silnější stín při hoveru */
}





/* Přidání obalovacího prvku pro text sloupce */
.column-title {
display: inline-block;
padding-right: 10px; /* Zvýšený odstup mezi textem a šipkami */
}

/* Kontejner pro šipky, umístěný na pravé straně buňky */
.sort-buttons {
display: flex;
flex-direction: column; /* Šipky budou nad sebou */
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%); /* Vertikální vycentrování */
}

/* Výchozí styl pro šipky */
.sort-button {
background-color: transparent;
color: var(--barvapozadi-top);
padding: 2px 4px;
border-radius: 3px;
text-decoration: none;
font-size: 0.8em; /* Upravená velikost textu */
border: 1px solid transparent;
}

/* Hover efekt pro šipky */
.sort-button:hover {
color: white;
background-color: #c1272d;
cursor: pointer;
}

/* Aktivní styl pro vybranou šipku */
.sort-button.active {
background-color: var(--barvapozadi-top);
color: white;
border: 0px solid #D53034;
}

.sort-button.active:hover {
background-color: #c1272d;
}







/* Patička */
.footer {
    background-color: #4A4A4A;
    color: white;
    text-align: center;
    font-size: 14px;
    padding: 10px 1em;
    width: 100%;
    position: relative;
    bottom: 0;
    clear: both; /* Zajistí, že patička bude pod obsahem */
    z-index: 1501;
}








a {
    color: #333;
    text-decoration: none !important;
}

a:hover {
    text-decoration: underline;
}




/* Styl pro modální okno */
.modal {
    display: none; /* Skryté ve výchozím stavu */
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Poloprůhledné pozadí */
    justify-content: center;
    align-items: center;
}

.modal-content {
    background-color: #fff;
    padding: 20px;
    border-radius: 5px;
    width: 300px;
    text-align: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.modal-content h2 {
    margin-bottom: 20px;
    color: #D53034;
}

.modal-content input {
    width: 100%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.modal-content button {
    background-color: #D53034;
    color: white;
    padding: 10px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    width: 100%;
    font-weight: bold;
}

.modal-content button:hover {
    background-color: #c1272d;
}


.modal-content .reason {
    background-color: #fff177; /* Žluté pozadí */
    color: #333; /* Tmavá barva textu */
    font-size: 1.2em; /* Zvýraznění velikosti textu */
    font-weight: bold; /* Tučný text */
    padding: 10px; /* Vnitřní odsazení */
    border: 0px solid #ff9800; /* Oranžový obrys */
    border-radius: 5px; /* Zaoblení rohu */
    display: inline-block; /* Oddělené od okolního textu */
    margin-bottom: 15px; /* Odstup od ostatního obsahu */
}


.close {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #aaa;
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}







.upozorneni {
background-color: #4A4A4A; /* Jemné žluté pozadí pro upozornění */
border: 8px solid #ffeeba; /* Světlejší žlutý okraj */
border-radius: 20px;
padding: 20px;
margin: 20px 0;
color: #FFF;
box-shadow: 0 0 10px rgba(133, 100, 4, 0.2); /* Jemný stín pro vystoupení */
font-family: Arial, sans-serif;
text-align: center; /* Zarovnání textu na střed */
display: flex;
flex-direction: column; /* Vertikální uspořádání obsahu */
align-items: center; /* Vycentrování obsahu */
}

.upozorneni .icon {
font-size: 30px; /* Zvýšení velikosti ikony */
color: #f8d7da; /* Barva ikony */
margin-bottom: 10px; /* Odstup ikony od textu */
}

.upozorneni h2 {
color: #f8d7da; /* Tmavší žlutohnědá pro nadpis */
font-size: 24px;
font-weight: bold;
margin: 0 0 10px 0;
}

.upozorneni h3 {
color: #f8d7da;
font-size: 20px;
margin: 10px 0;
}

.upozorneni p {
font-size: 16px;
color: #FFF; 
margin: 10px 0;
}

.upozorneni ul {
list-style-type: disc;
padding-left: 20px;
margin: 10px 0;
font-size: 16px;
color: #856404;
}

.upozorneni .icon {
font-size: 2em; /* Zvětší ikonu */
vertical-align: middle;
margin-right: 10px;
}

.upozorneni .zprava {
font-size: 1.5em; /* Zvětší hlavní text */
font-weight: bold;
color: #ddd; 
display: block; /* Zobrazí hlavní text na samostatném řádku */
margin-top: 10px;
margin-bottom: 1em;
}


.upozorneni a {
color: #F0F0F0;
text-decoration: underline !important;
padding: 0.2em;
}

.upozorneni a:hover {
color: #4A4A4A;
text-decoration: none !important;
background-color: #ccc;
}







/* Media query pro mobilní zobrazení */
@media (max-width: 768px) {

    body {
    overflow-x: hidden !important; /* Zabrání horizontálnímu posouvání */
    width: 100%;
    }

    .menu {
    width: 100% !important; /* Menu zabere celou šířku */
    }

    .menu.active {
    display: block !important;
    position: fixed;
    top: 125px !important;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5000;
    background-color: var(--barvamenu-pozadi);
    }   

    .main {
    margin-left: 0 !important; /* Hlavní obsah nebude odsazen */
    width: 100% !important; /* Hlavní obsah bude na celou šířku */
    }

    .resizer {
    display: none; /* Skryje dělítko */
    }


    .header-bottom .nav-links a.info {
    display: none; 
    }

    .module-header {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    transform: none !important;
    width: 100% !important;
    margin-top: 0px !important;
    margin-bottom: 8px;
    }

    .module-header-top {
        padding-left: 0px !important;
    }

    /* Přinutíme, aby prvky byly na novém řádku */
    .filter-row {
    flex-direction: column; /* Všechny prvky pod sebou na mobilu */
    }

    .filter-row .text {
    width: 100%;
    display: block; /* Zrušíme flexbox chování, aby se zarovnaly pod sebe */
    }

    .filter-row .text-item {
    width: 100%;
    display: block; /* Textový input bude na novém řádku */
    margin-top: 5px;
    }


    #filter-summary {
    display: none; /* Skryje `filter-summary` na mobilní verzi */
    }

    #mobile-filter-indicator {
    display: block !important; /* Zobrazí indikátor na mobilní verzi */
    border: 1px solid #ddd;
    padding: 10px;
    background-color: var(--barvapozadi-filter-reset);
    border-radius: 5px;
    font-size: 14px;
    color: var(--barvatext-filter-reset);
    text-align: center;
    }

    #reset-filter-button {
        margin-top: 10px;
        background-color: var(--barvapozadi-filter-reset-768);
        color: var(--barvatext-filter-reset-768);
    }


    .main-buttons {
        position: sticky;
        top: 95px; /* Nastavení top hodnoty tak, aby odpovídala výšce header-bottom */
        z-index: 2000; /* Vyšší hodnota než z-index header-bottom */
    }

    .pagination-container {
    position: sticky; /* Sticky pozice */
    top: 149px; /* Umístěna pod main-buttons */
    z-index: 2000; /* Stejné z-index jako main-buttons */
    background-color: var(--barvapozadi-pagination);

    }

    .filter-window{
    margin-top: 50px;
    }

    .dashboard {
        padding-top: 80px !important;
        margin-left: -10px; 
    }

    .tile, .tile.large {
        grid-column: span 1 !important; /* Na mobilu zabere dlaždice celou šířku */
    }

    .header-bottom .nav-links .module-link {
        margin-left: -2px;
        margin-right: auto;
        width: 100%;
    }

    /* Odstranění pravidel, která by způsobovala, že buňky se zobrazují pod sebou */
    .grant-table {
        width: auto; /* Tabulka si zachová svou šířku i na menších zařízeních */
        display: table; /* Ujistíme se, že tabulka si zachová klasický tabulkový layout */
    }

    .grant-table th, .grant-table td {
        display: table-cell; /* Každá buňka zůstane vedle sebe, ne pod sebou */
        white-space: nowrap; /* Buňky se nezalamují a zůstávají vedle sebe */
    }

    .container {
        flex-direction: column;
        padding-top: 120px;
        max-width: 100%;
    }
    
    .menu, .menu-close, .hamburger-wrapper {
        display: none;
    }

    .filter-summary {
        padding: 0em 1em 1em 1em;
    }
    
    #show-filter-summary-btn{
        display: none;
    }
    
    .header-top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px 20px;
        height: 75px;
    }
    
    .header-top .logo img {
        display: inline;
        top: 0px;
        width: 200px;
        max-height: 60px;
        margin: 0;
        padding: 0;
        object-fit: contain;
    }

    .header-top .user-info {
        flex-direction: column;
        align-items: flex-end;
    }
    
    .header-top .user-info .user-label {
        display: none;
    }
    
    .header-top .user-info .user-name {
        white-space: normal;
        margin-right: 0;
    }
    
    .header-top .user-info .logout-button {
        margin-top: 0px;
        margin-bottom: -5px;
    }
    .header-top .session-info{
        display: none;
    }
    .header-top .session-info-responze{
        display: inline;
        position: absolute;
        margin-top: 60px;
        margin-left: 47px;
        font-size: 12px;
        color: #ddd; /* Světlejší text */
    }

    .hamburger {
        display: block;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        margin-right: 20px;
        background-color: var(--barvapozadi-top);
        color: white;
        padding: 8px;
        white-space: nowrap;
        text-align: center;
        border-radius: 5px;
        border: 1px solid transparent;
        border-color: white;
    }
    
    .nav-links {
        display: flex;
        flex-wrap: wrap;
        margin-top: 0;
    }
    
    .nav-links a {
        font-size: 14px;
        padding: 10px;
        margin-bottom: 0;
    }
    
    .nav-links a:last-child {
        flex-basis: 100%;
        margin-top: 5px;
        text-align: left;
    }
    
    .header-bottom {
        min-height: 88px;
        padding: 0 20px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }
    
    .menu.active {
        display: block;
        position: fixed;
        top: 170px;
        left: 0;
        width: 100%;
        background-color: var(--barvamenu-pozadi);
        z-index: 5000;
        padding: 10px;
    }
    
    .main {
        margin-left: 0;
        width: 103%;
    }
    
    .prehled_dat {
        padding-top: 50px;
    }

    .filter-row {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .filter-row label,
    .filter-row input {
        width: 100%; /* V mobilní verzi zabere každý prvek celou šířku */
    }
    





    
    table, thead, tbody, th, td, tr {
        display: block;
    }
    
    thead {
        display: none; /* Skryjeme záhlaví tabulky */
    }
    
    th {
        display: none;
        border-right: 0px solid var(--hrana-td);
    }
    
    tr {
        margin-bottom: 10px;
        border-bottom: 0px solid #4A4A4A;
        padding: 0.5em;
        background-color: transparent;
    }
    
    td {
        display: flex;
        justify-content: space-between;
        padding: 0.5em;
        border-bottom: none;
        position: relative;
        padding-left: 40%; /* Zajištění místa pro názvy sloupců */
        text-align: left;
        border-right: 0px solid var(--hrana-td) !important;
        word-wrap: break-word; /* Povolení zalamování slov */
        overflow-wrap: break-word; /* Alternativa pro podporu v různých prohlížečích */
        white-space: normal; /* Povolení zalamování textu */
        min-height: 2em; /* Nastavení minimální výšky buňky */
    }
    
    td:before {
        content: attr(data-label); /* Získáme obsah z atributu data-label */
        position: absolute;
        left: 0; /* Zajistí správnou pozici názvu sloupce */
        top: 0.5em;
        font-weight: bold;
        color: #BABDC2;
        white-space: normal; /* Povolení zalamování textu */
        word-wrap: break-word; /* Zalamování slov */
        overflow-wrap: break-word; /* Podpora pro různé prohlížeče */
        max-width: calc(40% - 1em); /* Omezíme šířku názvu sloupce na dostupný prostor */
        line-height: 1.2; /* Vylepší vzhled při zalomení textu */
    }
    
    td:empty:before {
        content: attr(data-label); /* Zajistíme, že název sloupce je viditelný i v prázdných buňkách */
        color: #BABDC2; /* Barva pro vizuální konzistenci */
    }
    
/* Styl pro buňky se zkráceným textem */
.truncate-cell {
    max-width: 100%;
    display: block; /* Zajistíme blokové chování buňky */
    white-space: normal; /* Povolení zalomení textu */
}

.truncate-cell .show-more {
    display: block; /* Zajistíme, aby tlačítko "Více" bylo na nové řádce */
    margin-top: 5px; /* Přidáme mezeru mezi textem a tlačítkem */
    cursor: pointer;
    text-decoration: underline;
}
    





    
    
    /* Zabráníme konfliktu mezi tlačítky pro řazení a mobilním zobrazením */
    th .sort-button {
        display: none; /* Skryjeme tlačítka pro řazení na mobilech */
    }
    
    
    
    
    .pagination {
        display: none;
    }
    
    .pagination-info {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-info {
        margin-top: 5px;
    }
    
    .separator {
        display: none;
    }
    
    .mobile-line-break {
        display: inline; /* Zobrazit <br> v mobilním režimu */
    }
    
    .pagination-dropdown {
        display: flex;
        justify-content: center;
    }
    
    
    .upozorneni{
        margin-top: 75px !important;
    }


    /* Patička */
    .footer {
        font-size: 12px;
    }    


}