/* Import Material Icons */
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');        


/*------------------------RESET---------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ul,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; text-decoration:none; list-style-type: none;}
article, aside, details, figcaption, figure, hgroup, menu, nav, section { display: block; }
/*------------------------------------------------------*/

:root { --barva-pozadi: #eef2f7; --barva-pozadi-panel: #ffffff; --barva-pozadi-nabidka: #3b526b; --barva-pozadi-hlavicka: #5a80a9; --barva-pozadi-paticka: #2c3e50; --barva-text: #495057; --barva-text-kontrast: #ffffff; --barva-hrana: #dee2e6; --barva-primarni: #5a80a9; --barva-primarni-tmava: #4a6a8e; --barva-sekundarni: #9da7b3; --barva-sekundarni-tmava: #8c96a2; --barva-uspech: #28a745; --barva-uspech-tmava: #218838; --barva-chyba: #dc3545; --barva-chyba-tmava: #c82333; --barva-varovani: #ffc107; --barva-varovani-tmava: #d39e00; --barva-info: #17a2b8; --barva-info-tmava: #138496; --barva-odkaz: #5a80a9; --barva-odkaz-hover: #4a6a8e; --zakladni-velikost: 16px; --zakladni-velikost-textu: 1rem; --velikost-nadpisu: 1.75rem; --velikost-nadpisu-2: 1.375rem; --velikost-textu-mensi: 0.875rem; --mezera-xs: 0.25rem; --mezera-sm: 0.5rem; --mezera-md: 1rem; --mezera-lg: 1.5rem; --mezera-xl: 2rem; --zaobl-sm: 0.25rem; --zaobl-md: 0.5rem; --zaobl-lg: 0.75rem; --stin-lehky: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); --stin-stredni: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); }
        *, *::before, *::after { box-sizing: border-box; }
        html, body { margin: 0; padding: 0; height: 100%; }
        body { font-family: 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: var(--zakladni-velikost-textu); line-height: 1.6; color: var(--barva-text); background-color: var(--barva-pozadi); }
        a, .link { text-decoration: none; color: var(--barva-odkaz); transition: color 0.2s ease-in-out; cursor:pointer; }
        a:hover, .link:hover { color: var(--barva-odkaz-hover); text-decoration: underline; }
        ul, ol { padding: 0; margin: 0; list-style: none; }
        h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: var(--mezera-md); font-weight: bold; color: var(--barva-text); }
        h1 { font-size: var(--velikost-nadpisu); }
        h2 { font-size: var(--velikost-nadpisu-2); }
        p { margin-top: 0; margin-bottom: var(--mezera-md); }
        img { max-width: 100%; height: auto; display: block; }
        .obal { display: flex; flex-direction: column; min-height: 100vh; }
        header { background-color: var(--barva-pozadi-hlavicka); color: var(--barva-text-kontrast); padding: var(--mezera-md); display: flex; align-items: center; justify-content: space-between; box-shadow: var(--stin-lehky); }
        header .logo { display: block; max-width: 150px; height: auto; }
        .nadpis-aplikace { margin: 0; font-size: var(--velikost-nadpisu); color: var(--barva-text-kontrast); text-align:center; vertical-align:central; }
        nav.hlavni-nabidka ul { display: flex; }
        nav.hlavni-nabidka li { margin-left: var(--mezera-md); }
        nav.hlavni-nabidka a { color: var(--barva-text-kontrast); padding: var(--mezera-sm) var(--mezera-md); border-radius: var(--zaobl-sm); transition: background-color 0.2s ease-in-out; }
        nav.hlavni-nabidka a:hover { background-color: rgba(255, 255, 255, 0.1); text-decoration: none; }
        nav.hlavni-nabidka a i { margin-right:5px; } 
        .obsah { flex: 1; display: flex; padding: var(--mezera-md); gap: var(--mezera-md); }
        .sloupec-layout { display: flex; gap: var(--mezera-md); flex-wrap: wrap; }
        .sloupec-layout.smer-sloupec { flex-direction: column; }
        .sloupec-layout.smer-radek { flex-direction: row; }
        .sloupec-layout > * { flex: 1; min-width: 0; }
        .sloupec-layout .stredni-obsah { flex: 4; }
        .sloupec-layout .postranni-menu, .sloupec-layout .prava-nabidka { flex: 1; }
        .panel, .karta { background-color: var(--barva-pozadi-panel); border: 1px solid var(--barva-hrana); border-radius: var(--zaobl-md); padding: var(--mezera-md); box-shadow: var(--stin-lehky); margin-bottom: var(--mezera-md); }
        .panel > a > i { margin-right:10px; }
        .panel > span { cursor:pointer; }
        .panel > span > i { margin-right:10px; }
        .panel .nadpis-panelu, 
        .karta .nadpis-karty { margin-bottom: var(--mezera-md); font-size: var(--velikost-nadpisu-2); }
        .panel .nadpis-panelu i { margin-right:1rem; }
        .seznam-polozek li { margin-bottom: var(--mezera-sm); }
        .seznam-polozek a { color: var(--barva-text); transition: color 0.2s ease-in-out; }
        .seznam-polozek a:hover { color: var(--barva-primarni); text-decoration: underline; }
        .seznam-polozek input[type="submit"],
        .seznam-polozek button { width:100%; }
        .formular .pole { margin-bottom: var(--mezera-md); }
        .formular .pole label { display: block; margin-bottom: var(--mezera-sm); font-size: var(--velikost-textu-mensi); color: var(--barva-text); }
        .formular input:not([type="checkbox"]):not([type="radio"]), .formular select, .formular textarea { display: block; width: 100%; padding: var(--mezera-sm); border: 1px solid var(--barva-hrana); border-radius: var(--zaobl-sm); font-size: var(--zakladni-velikost-textu); transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; }
        .formular input:not([type="checkbox"]):not([type="radio"]):focus, .formular select:focus, .formular textarea:focus { outline: none; border-color: var(--barva-primarni); box-shadow: 0 0 0 0.2rem rgba(90, 128, 169, 0.25); }
        .formular textarea { min-height: 100px; resize: vertical; }
        .formular input[type="checkbox"], .formular input[type="radio"] { margin-right: var(--mezera-sm); }
        .formular input[type="checkbox"]+label { display:inline; position:relative; top:-2px; }
        .formular .radek { display: flex; gap: var(--mezera-md); }
        .formular .radek > div { flex: 1; }
        
        
        .tlacitko { display: inline-block; font-weight: 400; text-align: center; vertical-align: middle; user-select: none; border: 1px solid transparent; padding: var(--mezera-sm) var(--mezera-md); font-size: var(--zakladni-velikost-textu); line-height: 1.5; border-radius: var(--zaobl-sm); transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; cursor: pointer; }
        .tlacitko-primarni { color: var(--barva-text-kontrast); background-color: var(--barva-primarni); border-color: var(--barva-primarni); }
        .tlacitko-primarni:hover { color: var(--barva-text-kontrast); background-color: var(--barva-primarni-tmava); border-color: var(--barva-primarni-tmava); text-decoration: none; }
        .tlacitko-sekundarni { color: var(--barva-text); background-color: var(--barva-sekundarni); border-color: var(--barva-sekundarni); }
        .tlacitko-sekundarni:hover { color: var(--barva-text); background-color: var(--barva-sekundarni-tmava); border-color: var(--barva-sekundarni-tmava); text-decoration: none; }
        .tlacitko-uspech { color: var(--barva-text-kontrast); background-color: var(--barva-uspech); border-color: var(--barva-uspech); }
        .tlacitko-uspech:hover { color: var(--barva-text-kontrast); background-color: var(--barva-uspech-tmava); border-color: var(--barva-uspech-tmava); text-decoration: none; }
        .tlacitko-chyba { color: var(--barva-text-kontrast); background-color: var(--barva-chyba); border-color: var(--barva-chyba); }
        .tlacitko-chyba:hover { color: var(--barva-text-kontrast); background-color: var(--barva-chyba-tmava); border-color: var(--barva-chyba-tmava); text-decoration: none; }
        .tlacitko-varovani { color: var(--barva-text-kontrast); background-color: var(--barva-varovani); border-color: var(--barva-varovani); }
        .tlacitko-varovani:hover { color: var(--barva-text-kontrast); background-color: var(--barva-varovani-tmava); border-color: var(--barva-varovani-tmava); text-decoration: none; }
        .tlacitko-info { color: var(--barva-text-kontrast); background-color: var(--barva-info); border-color: var(--barva-info); }
        .tlacitko-info:hover { color: var(--barva-text-kontrast); background-color: var(--barva-info-tmava); border-color: var(--barva-info-tmava); text-decoration: none; }
        .tlacitko-outline-primarni { color: var(--barva-primarni); border-color: var(--barva-primarni); background-color: transparent; }
        .tlacitko-outline-primarni:hover { color: var(--barva-text-kontrast); background-color: var(--barva-primarni); border-color: var(--barva-primarni); text-decoration: none; }
        .tlacitko-maly { padding: var(--mezera-xs) var(--mezera-sm); font-size: var(--velikost-textu-mensi); border-radius: var(--zaobl-sm); }
        .tlacitko-velky { padding: var(--mezera-md) var(--mezera-lg); font-size: var(--velikost-nadpisu-2); border-radius: var(--zaobl-md); }
        .tabulka { width: 100%; border-collapse: collapse; margin-bottom: var(--mezera-md); }
        .tabulka thead th { background-color: #e9ecef; text-align: left; padding: var(--mezera-sm) var(--mezera-md); border-bottom: 2px solid var(--barva-hrana); font-weight: bold; color: var(--barva-text); }
        .tabulka tbody td { padding: var(--mezera-sm) var(--mezera-md); border-bottom: 1px solid var(--barva-hrana); }
        .tabulka tbody tr:hover { background-color: #f8f9fa; }
        .tabulka-prouzky tbody tr:nth-of-type(odd) { background-color: #f8f9fa; }
        .tabulka-ohranicena { border: 1px solid var(--barva-hrana); }
        .tabulka-ohranicena thead th, .tabulka-ohranicena tbody td { border: 1px solid var(--barva-hrana); }
        .paticka { background-color: var(--barva-pozadi-paticka); color: var(--barva-text-kontrast); text-align: center; padding: var(--mezera-md); margin-top: auto; }
        .alert { position: relative; padding: var(--mezera-md); margin-bottom: var(--mezera-md); border: 1px solid transparent; border-radius: var(--zaobl-md); }
        .alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
        .alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
        .alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba; }
        .alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb; }
        .alert .zavrit { position: absolute; top: var(--mezera-sm); right: var(--mezera-sm); padding: var(--mezera-xs); color: inherit; opacity: .5; cursor: pointer; background: none; border: none; font-size: var(--zakladni-velikost-textu); }
        .alert .zavrit:hover { opacity: .75; }
        .notifikace { position: fixed; top: var(--mezera-lg); right: var(--mezera-lg); padding: var(--mezera-md); border-radius: var(--zaobl-md); box-shadow: var(--stin-stredni); opacity: 0; pointer-events: none; transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; transform: translateY(-20px); z-index: 9999; color: var(--barva-text-kontrast); }
        .notifikace.zobrazena { opacity: 1; pointer-events: auto; transform: translateY(0); }
        .notifikace.uspech { background-color: var(--barva-uspech); }
        .notifikace.chyba { background-color: var(--barva-chyba); }
        .notifikace.varovani { background-color: var(--barva-varovani); color: var(--barva-text); }
        .notifikace.info { background-color: var(--barva-info); }
        .modal { display: none; position: fixed; z-index: 10000; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4); justify-content: center; align-items: center; }
        .modal.zobrazeny { display: flex; }
        .modal-obsah { background-color: var(--barva-pozadi-panel); margin: auto; padding: var(--mezera-lg); border-radius: var(--zaobl-md); box-shadow: var(--stin-stredni); max-width: 500px; width: 90%; position: relative; }
        .modal-zavrit { color: #aaa; float: right; font-size: 28px; font-weight: bold; cursor: pointer; position: absolute; top: var(--mezera-sm); right: var(--mezera-sm); }
        .modal-zavrit:hover, .modal-zavrit:focus { color: #000; text-decoration: none; cursor: pointer; }
        .zalozky-nav { display: flex; border-bottom: 1px solid var(--barva-hrana); margin-bottom: var(--mezera-md); }
        .zalozky-nav .zalozka { padding: var(--mezera-sm) var(--mezera-md); cursor: pointer; border: 1px solid transparent; border-bottom: none; margin-bottom: -1px; background-color: transparent; transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out; }
        .zalozky-nav .zalozka:hover { background-color: #f8f9fa; border-color: var(--barva-hrana); }
        .zalozky-nav .zalozka.aktivni { color: var(--barva-primarni); border-color: var(--barva-hrana); border-bottom-color: var(--barva-pozadi-panel); font-weight: bold; background-color: var(--barva-pozadi-panel); }
        .zalozka-obsah .zalozka-panel { display: none; padding-top: var(--mezera-md); }
        .zalozka-obsah .zalozka-panel.aktivni { display: block; }
        .badge { display: inline-block; padding: var(--mezera-xs) var(--mezera-sm); font-size: 75%; font-weight: 700; line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: var(--zaobl-sm); color: var(--barva-text-kontrast); }
        .badge-primarni { background-color: var(--barva-primarni); }
        .badge-sekundarni { background-color: var(--barva-sekundarni); }
        .badge-uspech { background-color: var(--barva-uspech); }
        .badge-chyba { background-color: var(--barva-chyba); }
        .badge-varovani { background-color: var(--barva-varovani); color: var(--barva-text); }
        .badge-info { background-color: var(--barva-info); }
        .util-mt-sm { margin-top: var(--mezera-sm); } .util-mb-sm { margin-bottom: var(--mezera-sm); } .util-ml-sm { margin-left: var(--mezera-sm); } .util-mr-sm { margin-right: var(--mezera-sm); } .util-pt-sm { padding-top: var(--mezera-sm); } .util-pb-sm { padding-bottom: var(--mezera-sm); } .util-pl-sm { padding-left: var(--mezera-sm); } .util-pr-sm { padding-right: var(--mezera-sm); }
        .util-mt-md { margin-top: var(--mezera-md); } .util-mb-md { margin-bottom: var(--mezera-md); } .util-ml-md { margin-left: var(--mezera-md); } .util-mr-md { margin-right: var(--mezera-md); } .util-pt-md { padding-top: var(--mezera-md); } .util-pb-md { padding-bottom: var(--mezera-md); } .util-pl-md { padding-left: var(--mezera-md); } .util-pr-md { padding-right: var(--mezera-md); }
        .util-text-stred { text-align: center; }
        .util-text-vlevo { text-align: left; }
        .util-text-vpravo { text-align: right; }
        .util-skryt { display: none !important; }
        .util-zobrazit { display: block !important; }
        .prihlaseni-stranka { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: var(--barva-pozadi); padding: var(--mezera-md); }
        .prihlaseni-panel { background: var(--barva-pozadi-panel); border: 1px solid var(--barva-hrana); border-radius: var(--zaobl-md); padding: var(--mezera-lg); box-shadow: var(--stin-stredni); width: 100%; max-width: 400px; text-align: center; }
        .prihlaseni-panel h1 { margin-bottom: var(--mezera-lg); font-size: var(--velikost-nadpisu); }
        .prihlaseni-panel .logo { display: block; max-width: 200px; height: auto; margin: 0 auto var(--mezera-lg); }
        .tlacitko-ikona { display: flex; align-items: center; padding: var(--mezera-sm); border-radius: var(--zaobl-md); background-color: var(--barva-pozadi-panel); box-shadow: var(--stin-lehky); transition: background-color 0.2s ease-in-out; cursor: pointer; border: 1px solid var(--barva-hrana); margin-bottom: var(--mezera-md); }
        .tlacitko-ikona:hover { background-color: #f8f9fa; }
        .tlacitko-ikona i { font-size: 1.5rem; margin-right: var(--mezera-md); color: var(--barva-primarni); }
        .tlacitko-ikona span { font-size: var(--zakladni-velikost-textu); color: var(--barva-text); flex-grow: 1; }
        .tlacitko-blok { display: block; width: 100%; }
        .karta-header { padding: var(--mezera-md); margin-bottom: 0; background-color: rgba(0,0,0,.03); border-bottom: 1px solid var(--barva-hrana); }
        .karta-footer { padding: var(--mezera-md); margin-top: 0; background-color: rgba(0,0,0,.03); border-top: 1px solid var(--barva-hrana); }
        .formular-skupina { margin-bottom: var(--mezera-md); }
        .formular-skupina label { display: inline-block; margin-bottom: var(--mezera-sm); }
        .formular-skupina .ovladani { display: inline-block; float:right; }
        .formular-skupina .ovladani > * { padding:0 3px; }
        .formular-ovladani { display: block; width: 100%; padding: var(--mezera-sm); font-size: var(--zakladni-velikost-textu); line-height: 1.5; color: var(--barva-text); background-color: #fff; background-clip: padding-box; border: 1px solid var(--barva-hrana); border-radius: var(--zaobl-sm); transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; }
        .formular-ovladani:focus { color: var(--barva-text); background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: 0 0 0 .2rem rgba(0,123,255,.25); }
        .nav-odkazy .nav-polozka { display: inline-block; } .nav-odkazy .nav-odkaz { display: block; padding: var(--mezera-sm) var(--mezera-md); text-decoration: none; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out; } .nav-odkazy .nav-odkaz:hover { color: var(--barva-primarni-tmava); } .nav-odkazy .nav-polozka.aktivni .nav-odkaz { color: var(--barva-text); font-weight: bold; }
        @media (max-width: 858px) { 
            .sloupec-layout.smer-radek { flex-direction: column; } 
            header { flex-direction: column; align-items: flex-start; } 
            header nav.hlavni-nabidka ul { flex-direction: column; width: 100%; margin-top: var(--mezera-md); }
            header nav.hlavni-nabidka li { margin: var(--mezera-sm) 0; }
            header nav.hlavni-nabidka a { display: block; text-align: center; } 
            header nav.hlavni-nabidka a i { margin-right:5px; } 
            .obsah { flex-direction: column; } 
            .sloupec-layout > * { flex-basis: auto !important; width: 100%; } 
            .notifikace { top: var(--mezera-sm); right: var(--mezera-sm); left: var(--mezera-sm); width: auto; transform: translateY(-10px); } 

            .formular .radek { flex-direction: column; gap: 0; }
        }


        #pn_prihlasovaciBlok { margin:50px auto 0 auto; background-color: var(--bila, #FFFFFF); color: var(--cerna1, #272626); padding: 2rem 3rem; border-radius: var(--zaobleniPrvku, 25px); box-shadow: 0 10px 25px rgba(0,0,0,0.1); width: 100%; max-width: 450px; }
        #pn_prihlasovaciBlok h1 { font-size: 2.2rem; color: var(--modra, #020923); text-align: center; margin-top: 0; margin-bottom: 1.5rem; font-weight: 600; }
        #pn_prihlasovaciBlok .formularSkupina { margin-bottom: 1.5rem; }
        #pn_prihlasovaciBlok .formularSkupina label { display: block; color: var(--modra2, #10152E); margin-bottom: .7rem; font-size: 0.95rem; font-weight: 500; }
        #pn_prihlasovaciBlok .formularSkupina input[type="text"],
        #pn_prihlasovaciBlok .formularSkupina input[type="password"] { border: 1px solid var(--sediva2, #484A59); width: 100%; display: block; color: var(--cerna1, #272626); padding: 0.8rem 1rem; border-radius: 5px; background-color: var(--sediva, #EFEFEF); font-size: 1rem; box-sizing: border-box; transition: border-color 0.3s ease, background-color 0.3s ease; }
        #pn_prihlasovaciBlok .formularSkupina input[type="text"]:focus,
        #pn_prihlasovaciBlok .formularSkupina input[type="password"]:focus { border-color: var(--oranzova, #D97807); outline: none; background-color: var(--bila, #FFFFFF); }
        #pn_prihlasovaciBlok #bt_prihlasit { margin:0 auto; width:100%; display:block; }
    

.custom-table-wrapper { font-family: 'Arial', sans-serif; margin: 20px 0; overflow-x: auto; }
.custom-table { width: 100%; border-collapse: collapse; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); background-color: #fff; border-radius: 8px; overflow: hidden; }
.custom-table .table-header { background-color: #f8f9fa; color: #333; font-weight: bold; border-bottom: 2px solid #dee2e6; }
.custom-table .table-header .header-cell { padding: 12px 15px; text-align: left; position: relative; white-space: nowrap; }

.custom-table .header-cell .header-content { display: flex; align-items: center; justify-content: space-between; }
.custom-table .header-cell .title-text { margin-right: 5px; flex-grow: 1;cursor: not-allowed; }
.custom-table .header-cell .title-text.hand { cursor:pointer; }
.custom-table .header-cell .actions { display: flex; align-items: center; }
.custom-table .header-cell .icon { font-family: 'Material Icons'; font-size: 16px; cursor: pointer; margin-left: 1px; color: #555; transition: color 0.2s ease-in-out; }
.custom-table .header-cell .icon:hover { color: #007bff; }
.custom-table .header-cell .icon.sort-icon.active { color: #007bff; }
.custom-table .header-cell .icon.filter-icon { position:relative; top:-3px; }
.custom-table .header-cell .icon.filter-icon.active { color: #007bff; }

.custom-table .search-input-container { display: none; margin-top: 8px; /*padding: 8px; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);*/ }
.custom-table .search-input-container.active { display: block; }
.custom-table .search-input-container input[type="text"], 
.custom-table .search-input-container input[type="date"], 
.custom-table .search-input-container select {  width:100%; padding: 2px; margin-bottom: 2px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; font-size: 14px; }
.custom-table .search-input-container input[type="date"] { appearance: none; display:block; width:100%; }
.custom-table .search-input-container input[type="text"]:focus, 
.custom-table .search-input-container input[type="date"]:focus, 
.custom-table .search-input-container select:focus { outline: none; border-color: #007bff; box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25); }

.custom-table .table-row { border-bottom: 1px solid #eee; display: flex; }
.custom-table .table-row:last-child { border-bottom: none; }
.custom-table .table-row:hover { background-color: #f1f1f1; }
.custom-table .table-cell {  padding: 12px 15px; color: #555; font-size: 14px; cursor:pointer; }
.custom-table .table-cell .responsive-title { display: none; font-weight: bold; margin-bottom: 5px; color: #333; }

.custom-table-footer { display: flex; justify-content: space-between; align-items: center; padding: 10px 15px; background-color: #f8f9fa; border-top: 1px solid #dee2e6; font-size: 14px; }
.custom-table-footer .pagination a, .custom-table-footer .rows-per-page a { color: #007bff; text-decoration: none; padding: 5px 8px; margin: 0 2px; border-radius: 4px; transition: background-color 0.2s ease-in-out; }
.custom-table-footer .pagination a:hover, .custom-table-footer .rows-per-page a:hover { background-color: #e9ecef; }
.custom-table-footer .pagination a.active, .custom-table-footer .rows-per-page a.active { background-color: #007bff; color: white; font-weight: bold; }

@media (max-width: 768px) { 
    .custom-table .table-header { display: none; }
    .custom-table .table-row, .custom-table .table-cell { display: block; width: 100%; box-sizing: border-box; }
    .custom-table .table-row { border-bottom: 2px solid #007bff; margin-bottom: 10px; border-radius: 0; }
    .custom-table .table-row:last-child { margin-bottom: 0; }
    .custom-table .table-cell { text-align: right; padding-left: 50%; position: relative; border-bottom: 1px solid #eee; }
    .custom-table .table-cell:last-child { border-bottom: none; }
    .custom-table .table-cell .responsive-title { display: block; position: absolute; left: 15px; top: 12px; width: calc(50% - 30px); text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .custom-table-footer { flex-direction: column; }
    .custom-table-footer .pagination, .custom-table-footer .rows-per-page { margin-bottom: 10px; text-align: center; }
    .custom-table-footer .rows-per-page { margin-bottom: 0; }
}


.hidden { display: none !important; }