btSendhtml, body {
    height: 100vh;
    width: 100%;
    margin: 0;
    -ms-overflow-style: none;
    overflow: auto;
    overflow: initial;
}

/* NEW Web Design */
/* 18.7.2018 */
/* Martin Brož */

/* styl pro master page */

/* styl pro horni menu */

.trMainMenu {
    text-align: center;
    top: 0;
    position: fixed;
    width: 100%;
    height: 60px;
    background-color: #002558;
    z-index: 15;
    transition: .5s all linear;
    -webkit-transition: .5s all linear;
}

.mainMenu {
    height: 60px;
    width: 100%;
    background-color: #002558;
}

/* styl pro staticke položky v menu (nevybrane) */
.mainMenu ul li a {
    background-image: url(../Images/divider1.png);
    background-repeat: no-repeat;
    background-position: right;
    font-family: Tahoma;
    color: white;
    font-size: 14px;
    line-height: 60px;
    width: 142px;
    transition: .5s all linear;
    -webkit-transition: .5s all linear;
}

.mainMenu ul li a:hover {
    background-color: rgba(0,37, 88, .5);
    color: white;
}

.mainMenu ul li a:hover,
.mainMenu_scroll ul li a:hover {
    background-color: #5ea443 !important;
    color: #ffed00 !important;
}

/* pro nezobrazení oddělovače (mezi položkami v menu) na konci menu */
.mainMenu ul li:last-child a {
    background-image: none;
}

/* styl pro staticke polozky v menu (vybrane) */
.mainMenu ul li .selected {
    font-family: Tahoma;
    color: #ffed00;
    background-color: #5ea443;
}

.mainMenu_scroll {
    height: 40px;
}

/* styl pro staticke položky v menu (nevybrane) */
.mainMenu_scroll ul li a {
    background-image: url(../Images/divider1.png);
    background-repeat: no-repeat;
    background-position: right;
    font-family: Tahoma;
    color: white;
    font-size: 12px;
    line-height: 40px;
    width: 142px;
    transition: .5s all linear;
    -webkit-transition: .5s all linear;
}

/* pro nezobrazení oddělovače (mezi položkami v menu) na konci menu */
.mainMenu_scroll ul li:last-child a {
    background-image: none;
}

/* styl pro staticke polozky v menu (vybrane) */
    .mainMenu_scroll ul li .selected {
        font-family: Tahoma;
        color: #ffed00;
        background-color: #5ea443;
        transition: .5s all linear;
        -webkit-transition: .5s all linear;
    }

/* styl pro dynamické fotky nad pozadim travy */
.cellGrass {
    background-image: url(../Images/podklad_trava.jpg);
    background-repeat: no-repeat;
    background-position: center;
}

/* styl pro tlačítka v horním menu na stránce kalendáře */
.mainMenuButton {
    font-family: Tahoma;
    color: #ffed00;
    background-color: #5ea443;
    height: 30px;
    width: 142px;
    border: none;
    font-size: 15px;
}
/* zachovat oddělovač i u položek s podmenu */
.mainMenu ul li a.popout,
.mainMenu_scroll ul li a.popout {
    background-image: url(../Images/divider1.png) !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
    padding-right: 25px !important;
}

/* schovat původní ASP.NET šipku */
.mainMenu ul li a.popout span,
.mainMenu_scroll ul li a.popout span {
    display: none !important;
}

/* vlastní bílá šipka dolů */
.mainMenu ul li a.popout:after,
.mainMenu_scroll ul li a.popout:after {
    content: "▼";
    color: white;
    font-size: 9px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    line-height: 1;
}

/* umožní správné umístění šipky */
.mainMenu ul li a.popout,
.mainMenu_scroll ul li a.popout {
    position: relative;
}

/* aby submenu nebylo průhledné a bylo vždy nad obsahem stránky */
.mainMenu ul li ul,
.mainMenu_scroll ul li ul {
    background-color: #002558 !important;
    z-index: 99999 !important;
    white-space: nowrap !important;
    min-width: max-content;
}

/* položky submenu podle nejdelšího textu, bez zalamování */
.mainMenu ul li ul li,
.mainMenu_scroll ul li ul li {
    width: auto !important;
    white-space: nowrap !important;
}

/* vzhled odkazů v submenu */
.mainMenu ul li ul li a,
.mainMenu_scroll ul li ul li a {
    display: block !important;
    width: auto !important;
    min-width: 170px;
    line-height: 40px !important;
    padding: 0 18px 0 14px !important;
    box-sizing: border-box;
    background-color: #002558 !important;
    background-image: none !important;
    color: white !important;
    text-align: left !important;
    white-space: nowrap !important;
}

/* hover submenu */
.mainMenu ul li ul li a:hover,
.mainMenu_scroll ul li ul li a:hover {
    background-color: #5ea443 !important;
    color: #ffed00 !important;
}

/* jistota, že rodičovské menu a jeho wrappery nepřekryje obsah stránky */
.mainMenu,
.mainMenu_scroll {
    position: relative;
    z-index: 99998;
}

/* pokud ASP.NET generuje submenu přes tabulku */
.mainMenu table,
.mainMenu_scroll table {
    z-index: 99999 !important;
}

.mainMenu table td,
.mainMenu_scroll table td {
    white-space: nowrap !important;
    background-color: #002558 !important;
}

/* větší výška řádků submenu */
.mainMenu ul li ul li a,
.mainMenu_scroll ul li ul li a {
    line-height: 48px !important; /* původně 40 */
    min-height: 48px !important;
}

/* vodorovné oddělovače mezi položkami submenu */
.mainMenu ul li ul li:not(:last-child) a,
.mainMenu_scroll ul li ul li:not(:last-child) a {
    border-bottom: 1px solid rgba(255,255,255,0.25);
}

/* výraznější oddělovač při hoveru */
.mainMenu ul li ul li:hover + li a,
.mainMenu_scroll ul li ul li:hover + li a {
    border-top-color: transparent;
}

/* konec stylu pro master page */

/* styl pro kalendář */

/* styl pro horni lištu titulku */
.Calendar tr:first-child {
    border-left: 10px solid #002558;
    border-right: 10px solid #002558;
}

.Calendar tr:first-child td {
    padding: 0px;
    margin: 0px;
    border: none;
}

/* styl pro aktuální měsíc v titulku kalendáře */
.Calendar tr:first-child {
    font-family: Tahoma;
    font-size: 22px;
    color: White;
    background-color: #002558;
    text-transform: uppercase;
    height: 40px;
}

/* styl předchozí a následující měsíc v titulku kalendáře */
.Calendar tr:first-child td a {
    font-family: Tahoma;
    font-size: 22px;
    color: white !important;
    text-decoration: none !important;
    padding-left: 25px;
    padding-right: 25px;
    text-transform: uppercase;
}

/* styl pro buňky v kalendáři -> buňka */
.Calendar tr:not(:first-child) td {
    vertical-align: top;
    text-align: left;
    border: 10px solid White;
    text-decoration: none;
    background-color: #ececec;
    width: 100px;
    height: 130px;
    margin-left: 15px;
}

.Calendar tr:not(:first-child) td:hover {
    background-color: #c5c5c5;
}

/* styl pro druhý řádek -> dny v týdnu */
.Calendar tr:nth-child(2) { 
    background-color: #002558;
    width: 100px;
    height: 30px;
}

/* styl pro druhý řádek -> dny v týdnu */
.DayHeaderStyle {
    font-family: Tahoma;
    font-size: 18px;
    font-weight: 100;
    color: White;
    border: 10px solid White;
    border-top: 25px solid White;
    font-weight: 100;
}

.OtherMonthDayStyle {
    pointer-events: none;
    cursor: default;
    text-align: left;
    background-color: white !important;
}

.OtherMonthDayStyle a {
    font-family: Tahoma;
    font-size: 22px;
    color: #c8c8c8 !important;
    text-decoration: none;
    padding-top: 5px;
    padding-left: 5px;
    display: none;
}

.lbCalendarEvent {
    font-family: Tahoma;
    text-decoration: none;
    border: none;
    text-align: center;
    text-anchor: middle;
    padding-top: 5px;
    margin-top: 5px;
    opacity: 0.7;
    color: black !important;
    -webkit-transform: translate3d(0,0,0);

}

.lbCalendarEvent:hover {
    position: relative;
    opacity: 1.0 !important;
    z-index: 10 !important;
}

.DayStyle {
    z-index: 1 !important;
}

.DayStyle a {
    font-family: Tahoma;
    font-size: 22px;
    color: #404040;
    text-decoration: none;
    cursor: default;
    padding-top: 5px;
    padding-left: 5px;
}

.SelectedDay a {
    font-family: Tahoma;
    font-size: 22px;
    color: White;
    text-decoration: none;
    cursor: default;
    padding-top: 5px;
    padding-left: 5px;
}

.WeekendDay a {
    font-family: Tahoma;
    font-size: 22px;
    color: #404040;
    text-decoration: none;
    cursor: default;
    padding-top: 5px;
    padding-left: 5px;
}

.TodayDay {
    text-align: center !important;
    color: white;
    font-weight: 400 !important;
    background-color: #002558 !important;
    font-family: Tahoma;
    font-size: 22px;
    cursor: default;
    vertical-align: middle !important;
    padding-bottom: 10px !important;
}

.TodayDay a {
    font-family: Tahoma;
    font-size: 20px;
    text-decoration: none;
    cursor: default;
}

.SelectedDay {
    background-color: #646464 !important;
}

/* konec stylu pro kalendář */

/* styl pro stránku bazárku */

/* styl pro horni menu */
.bazaarMenu {
    width: 100%;
    height: 100%;
    background-color: #002558;
}

/* styl pro staticke položky v menu (nevybrane) */
.bazaarMenu ul li a {
    background-image: url(../Images/divider1.png);
    background-repeat: no-repeat;
    background-position: right;
    font-family: Tahoma;
    color: white;
    font-size: 15px;
    line-height: 50px;
    width: 100px;
}

/* pro nezobrazení oddělovače (mezi položkami v menu) na konci menu */
.bazaarMenu ul li:last-child a {
    background-image: none;
    width: 150px;
}

/* styl pro staticke polozky v menu (vybrane) */
.bazaarMenu ul li .selected {
    font-family: Tahoma;
    color: #ffed00;
    background-color: #5ea443;
}

/* styl pro tlačítka v horním menu na stránce kalendáře */
.bazaarMenuButton {
    font-family: Tahoma;
    color: #002558;
    background-color: White;
    height: 30px;
    width: 250px;
    border: none;
    font-size: 15px;
}

.gridviewBazaarHeader {
    background-color: #002558;
    height: 40px;
    font-family: Tahoma;
    font-size: 17px;
    color: White;
}

.gridviewBazaarHeader th {
    border: 10px solid White;
    font-weight: 100;
    text-align: center;
}

.gridviewBazaarHeader a {
    text-decoration: none;
    color: White;
    font-weight: 100 !important;
        
}

.gridviewBazaarRow td {
    background-color: #ececec;
    text-align: center;
    border: 10px solid White;
    vertical-align: middle !important;
}

.itemBazaar {
    font-family: Tahoma;
    font-size: 17px;
    color: #585857;
}

.gridviewShopHeader {
    background-color: #002558;
    height: 40px;
    font-family: Tahoma;
    font-size: 17px;
    color: White;
}

.gridviewShopHeader th {
    border: 10px solid White;
    font-weight: 100;
    text-align: center;
}

.gridviewShopHeader a {
    text-decoration: none;
    color: White;
    font-weight: 100 !important;
}

.gridviewShopRow td {
    background-color: #ececec;
    text-align: center;
    border: 10px solid White;
    vertical-align: middle !important;
}

.itemShop {
    font-family: Tahoma;
    font-size: 17px;
    color: #585857;
}

.imageShopCart {
    width: 100%;
    
}

.imageShopDetail {
    border: none;
    max-width: 150px;
    max-height: 150px;
    min-width: 150px;
    min-height: 150px;
    background-size: auto;
}

.imageShopDetail:active {
    position: absolute;
    left: 0;
    top: -75px;
    max-width: 1050px;
    max-height: 1050px;
    min-width: 300px;
    min-height: 300px;
    z-index: 10;
}

.imageDetail {
    border: none;
    max-width: 150px;
    max-height: 150px;
    min-width: 150px;
    min-height: 150px;
    background-size: auto;
}

.imageDetail:active {
    position: absolute;
    left: 0;
    top: 0;
    max-width: 1050px;
    max-height: 1050px;
    min-width: 300px;
    min-height: 300px;
    z-index: 10;
}

/* styl pro popis pole při vkládání nového předmětu */
.insertBazaarTitleItem {
    font-size: 15px;
    font-family: Tahoma;
    color: White;
    padding-left: 40px;
}

/* styl pro editovatelné pole při vkládání nového předmětu */
.insertBazaarTitleItemTXT {
    font-size: 15px;
    font-family: Tahoma;
    color: Black;
    width: 100% !important;
    height: 100% !important;
    padding-left: 40px;
}

.insertBazaarTitleItemTXT_2 {
    font-size: 15px;
    font-family: Tahoma;
    color: Black;
    width: 200px;
    height: 40px;
    padding-left: 40px;
}
/* styl pro filtr kalendaře */

.cblFilter {
    font-size: 15px;
    font-family: Tahoma;
    color: dimgray;
    padding-top: 7px;
    padding-bottom: 4px;
    min-height: 30px;
    width: 200px;
}

.cblFilter label{
    margin-left: 6px;
}

.cbRemember {
    font-size: 15px;
    font-family: Tahoma;
    color: black;
}

.cbRemember label {
    margin-left: 6px;
}

/* konec stylu pro filtru kalendaře */

/* styl pro editovatelné pole při vkládání nového předmětu */
.insertBazaarTitleItemDDL {
    font-size: 15px;
    font-family: Tahoma;
    color: Black;
    width: 442px;
    height: 40px;
    padding-left: 40px;
}

.insertFirstTableCell {
    background-color: #002558;
    text-align: left;
    width: 250px;
    height: 40px;
}

.insertSecondTableCell {
    background-color: White;
    text-align: center;
    width: 400px;
    height: 40px;
    vertical-align: middle;
}

.insertThirdTableCell {
    background-color: #ececec;
    text-align: left;
    margin-left: 30px;
    padding-left: 3px;
    width: 400px;
    height: 40px;
    vertical-align: top;
}

.wmeInsertBazaarDesc {
    color: #ececec;
    font-family: Tahoma;
    font-size: 12px;
    font-style: italic;
}

.wmeInsertBazaar {
    color: #707070;
    font-family: Tahoma;
    font-size: 12px;
    font-style: italic;
}

/* konec stylu pro stránku bazárku */

/* styl pro vyskakovací okno upozornění/chyby/hlášky */

.modalBackground {
    background-color: Black;
    filter: alpha(opacity=60);
    opacity: 0.6;
}

.modalPopup {
    background-color: #FFFFFF;
    width: 300px;
    max-width: 300px;
    height: 220px;
    max-height: 250px;
    border: 2px solid #c5c5c5;
}

.modalPopupShop {
    background-color: #FFFFFF;
    width: 350px;
    max-width: 350px;
    height: 220px;
    max-height: 250px;
    border: 2px solid #c5c5c5;
}

.modalPopupFilter {
    background-color: #FFFFFF;
    width: 460px;
    max-width: 500px;
    height: 400px;
    max-height: 400px;
    border: 2px solid #c5c5c5;
}

.alertHeader {
    background-color: #002558;
    height: 30px;
    text-align: center;
}

.alertLabelHeader {
    font-family: Tahoma;
    font-size: 17px;
    color: White;
    font-weight:300;
}

.alertImage
{
    width:65px;
    height: 65px;
}

.alertMessage {
    font-family: Tahoma;
    font-size: 16px;
    color: Black;
}

.alertButton {
    background-color: #002558;
    border: none;
    font-family: Tahoma;
    font-size: 15px;
    color: White;
    width: 120px;
    height: 35px;
}

.printButton {
    background-color: #5ea443;
    border: 1px solid white;
    font-family: Tahoma;
    font-size: 15px;
    color: White;
    width: 130px;
    height: 35px;
}

/* konec stylu pro vyskakovací okno upozornění/chyby/hlášky */

/* styl pro stránku Nastavení */

/* styl pro horni menu */
.settingsMenu {
    width: 100%;
    height: 100%;
    background-color: #002558;
}

/* styl pro staticke položky v menu (nevybrane) */
.settingsMenu ul li a {
    background-image: url(../Images/divider1.png);
    background-repeat: no-repeat;
    background-position: right;
    font-family: Tahoma;
    color: white;
    font-size: 15px;
    line-height: 50px;
    width: 133px;
}

/* pro nezobrazení oddělovače (mezi položkami v menu) na konci menu */
.settingsMenu ul li:last-child a {
    background-image: none;
}

/* styl pro staticke polozky v menu (vybrane) */
.settingsMenu ul li .selected {
    font-family: Tahoma;
    color: #ffed00;
    background-color: #5ea443;
}

/* styl pro tlačítka v horním menu na stránce kalendáře */
.settingsMenuButton {
    font-family: Tahoma;
    color: #002558;
    background-color: White;
    height: 30px;
    width: 250px;
    border: none;
    font-size: 15px;
}

.settingsFilterButtons {
    font-family: Tahoma;
    color: White;
    background-color: #002558;
    font-size: 14px;
    width: 140px;
    height: 35px;
    border: none;
    margin: 7px;
}

.settingsSelectedFilterButtons {
    font-family: Tahoma;
    color: #ffed00;
    background-color: #5ea443;
    font-size: 14px;
    width: 140px;
    height: 35px;
    border: none;
    margin: 7px;
}

.settingsFilterSummary {
    font-family: Tahoma;
    color: Black;
    font-size: 15px;
    font-weight: 500 !important;
}

.settingsFilterLabel {
    font-family: Tahoma;
    color: #002558;
    font-size: 18px;
    font-weight: 600 !important;
    margin-left: 10px;
}

.settingsGridView {
    border: 15px solid White;
    background-color: white;
    font-family: Tahoma;
    color: Black;
}

.settingsGridViewAttendance {
    border: none;
    background-color: white;
    font-family: Tahoma;
    color: Black;
}

.imagePlayerDetail {
    border: none;
    max-width: 100px;
    max-height: 100px;
    min-width: 100px;
    min-height: 100px;
    background-size: auto;
}

.imagePlayerDetail:active {
    position: absolute;
    left: 0;
    top: 0;
    max-width: 300px;
    max-height: 300px;
    min-width: 300px;
    min-height: 300px;
    z-index: 10;
}

.imageExerciseDetail {
    border: none;
    max-width: 100px;
    max-height: 100px;
    min-width: 100px;
    min-height: 100px;
    background-size: auto;
}

.imageExerciseDetail:active {
    position: absolute;
    left: 0;
    top: 0;
    max-width: 300px;
    max-height: 300px;
    min-width: 300px;
    min-height: 300px;
    z-index: 10;
}

.imageCoachDetail {
    border: none;
    width: 100%;
    height: 100%;
    background-size: auto;
}

/*
.imageCoachDetail:hover {
    position: absolute;
    left: 0;
    top: 0;
    max-width: 300px;
    max-height: 300px;
    min-width: 300px;
    min-height: 300px;
    z-index: 10;
}
*/

.coach-item .img-responsive {
    display: block;
    width: 100%;
    height: auto;
    min-width: 320px;
    min-height: 320px;
    max-width: 400px;
    max-height: 400px;
}

.coach-item .img-shop-responsive {
    display: block;
    text-align: center;
    width: 320px;
    height: 320px;
}

.section.coach {
    padding-bottom: 60px;
}

.bg-coach {
    background: #E7E7E7;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.coach-item {
    margin: 10px -5px;
    padding: 10px 0px;
}

.coach-item .gambar {
    position: relative;
    z-index: 1;
    overflow: hidden;
    background-color: White;
}

.coach-item .gambar img {
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transition: 0.4s all linear;
    transition: 0.4s all linear;
}

.coach-item:hover .gambar img {
    filter: alpha(opacity=80);
    opacity: .8;
    -webkit-transform: scale(1.05,1.05);
    -ms-transform: scale(1.05,1.05);
    transform: scale(1.05,1.05);
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-duration: 250ms;
    transition-duration: 250ms;
 }

.coach-item .item-body {
    background-color: White;
    border-top: 3px solid #002558;
    position: relative;
    display: block;
    text-align: center;
}

.coach-item:hover .item-body {
    background-color: #DDD;
}

.coach-item .item-body:after {
    content: '';
    clear: both;
    width: 100%;
    display: table;
}

    .coach-item .item-body .name {
        font-size: 19px;
        font-family: Tahoma;
        background-color: #585857;
        color: White;
        line-height: 40px;
        margin-bottom: 10px;
    }

.coach-item .item-body .position {
    font-size: 17px;
    font-family: Tahoma;
    font-weight: 600;
    color: #002558;
    line-height: 30px;
}

.coach-item .item-body .qualification {
    font-size: 15px;
    font-family: Tahoma;
    color: #585857;
    line-height: 25px;
}

.coach-item .item-body .contact {
    font-size: 15px;
    font-family: Tahoma;
    font-weight: 600;
    color: #585857;
    line-height: 30px;
}

.coach-item .item-body .c-sosmed {
    font-size: 14px;
    color: #fff;
    font-style: italic;
    margin-top: -36px;
    margin-right: 3px; 
}

.item-body .c-sosmed {
    float: right;
    border: 1px solid #fff;
    border-radius: 50%;
}

.item-body .c-sosmed .item {
    width: 30px;
    height: 30px;
    text-align: center;
    border: none;
    color: #fff;
    display: inline-table;
    padding-top: 5px;
    border-radius: 50%;
}

.item-body .c-sosmed .item:hover {
    background-color: #fff;
    color: #252525;
}

.item-body .c-sosmed .item .fa {
    padding-top: 7px;
    font-size: 16px;
}

.gridviewSettingHeader {
    background-color: #002558;
    height: 40px;
    font-family: Tahoma;
    font-size: 15px;
    color: White;
}

.gridviewSettingHeader th {
    border: 10px solid White;
    font-weight: 100;
    text-align: center !important;
    padding: 0px 5px;
}

.gridviewSettingHeader a {
    text-decoration: none;
    color: White;
    font-weight: 100 !important;
}

.gridviewSettingRow td {
    background-color: #ececec;
    text-align: center;
    border: 10px solid White;
    vertical-align: middle !important;
    min-height: 100px;
}

.gridviewSettingRowAttendance td {
    background-color: white;
    text-align: center;
    border: none;
    vertical-align: middle !important;
    min-height: 100px;
}

.gridviewSettingFooter {
    background-color: #c5c5c5;
    height: 50px;
    font-family: Tahoma;
    font-size: 15px;
}

.gridviewSettingFooter td {
    border: 10px solid White;
}

.itemSetting {
    font-family: Tahoma;
    font-size: 17px;
    color: #585857;
    padding: 0px;
}

.itemSettingEdit {
    width: 90%;
    height: 30px;
    font-family: Tahoma;
    font-size: 16px;
    color: #585857;
}

.itemSettingWatermark {
    font-family: Tahoma;
    font-size: 12px;
    width: 90%;
    color: #707070;
    font-style: italic;
}

.gridviewSettingEdit {
    text-align: center !important;
}

.otherButtons {
    font-family: Tahoma;
    font-size: 16px;
    width: 310px;
    height: 50px;
    background-color: #585857;
    color: white;
}

.labelPlayerDetails {
    font-family: Tahoma;
    font-size: 23px;
    background-color: White;
    color: #585857;
}

.playerFirstTableCell {
    background-color: #002558;
    text-align: left;
    width: 300px;
    height: 40px;
}

.playerFinanceTitleFirstTableCell {
    background-color: #002558;
    text-align: center;
}

.playerFinanceFirstTableCell {
    text-align: Left;
    padding-left: 3px;
}

.playerFinanceTableCell {
    text-align: center;
}

.playerSecondTableCell {
    background-color: White;
    text-align: left;
    width: 350px;
    height: 40px;
    vertical-align: middle;
    padding-left: 70px;
}

.playerThirdTableCell {
    background-color: #ececec;
    text-align: left;
    margin-left: 30px;
    padding-left: 3px;
    width: 400px;
    height: 300px;
    vertical-align: top;
}

.playerFinanceTitleItem {
    font-size: 20px;
    font-family: Tahoma;
    color: White;
    vertical-align: middle;
    height: 25px;
    line-height: 25px;
}

.playerFinanceFirstItem {
    font-size: 16px;
    font-family: Tahoma;
    color: #002558;
    vertical-align: middle;
    text-align: center;
    height: 20px;
    line-height: 20px;
    font-weight: 600;
}

.playerFinanceItem {
    font-size: 17px;
    font-family: Tahoma;
    color: Black;
    vertical-align: middle;
    text-align: center;
    height: 20px;
    line-height: 20px;
}

.playerBazaarTitleItem {
    font-size: 22px;
    font-family: Tahoma;
    color: White;
    padding-left: 40px;
    vertical-align: middle;
    height: 60px;
    line-height: 60px;
}

.lContactRelation {
    font-size: 20px;
    font-family: Tahoma;
    background-color: #002558;
    color: White;
    vertical-align: middle;
}

.lContactFullname {
    font-size: 23px;
    font-family: Tahoma;
    color: #002558;
    vertical-align: middle;
    font-weight: 300;
}

.trContactRelation {
    background-color: #002558; 
    height: 50px;
    width: 100%;
}

.trContactFullname {
    width: 1100%;
    height: 70px;
    border-bottom: 15px solid White;
}

.contactFirstTableCell {
    background-color: #002558;
    text-align: left;
    width: 200px;
    height: 40px;
}

.contactSecondTableCell {
    background-color: White;
    text-align: left;
    width: 300px;
    height: 40px;
    vertical-align: middle;
    padding-left: 70px;
}

.contactSettingTitleItem {
    font-size: 20px;
    font-family: Tahoma;
    color: White;
    padding-left: 40px;
    vertical-align: middle;
    height: 40px;
    line-height: 40px;
}

.labelContactDetails {
    font-family: Tahoma;
    font-size: 20px;
    background-color: White;
    color: #585857;
}

/* styl pro color picker v nastavení kategorie */

.ajax__colorPicker_container {
    width: auto !important;
    height: auto !important;
}

.ajax__colorPicker_container table td {
    border: 3px solid White !important
}

.ajax__colorPicker_container table td div {
    width: 15px !important;
    height: 15px !important;
}

/* konec stylu pro color picker v nastavení kategorie */

/* styl pro calendar extender v nastavení */

.MyCalendar {
    width: 400px !important;
    height: auto !important;
    
}

.MyCalendar .ajax__calendar_container {
    width: 200px;
    height: 200px;
}

.MyCalendar .ajax__calendar_body {
    width: 195px;
    height: 195px;
}

.labelHeaderMatches {
    font-size: 25px;
    font-family: Tahoma;
    color: white;
    background-color: #002558;
}

.labelMatches {
    font-size: 18px;
    font-family: Tahoma;
    color: #002558;
    background-color: #ececec;
}

/* konec stylu pro calendar extender v nastavení */

/* konec stylu pro stránku Nastavení */

.labelButtons {
    font-size: 26px;
    font-family: Tahoma;
    color: White;
    font-weight: 600;
}

.font12 {
    font-size: 12px;
    font-family: Tahoma;
    color: #585857;
}

.font13 {
    font-size: 13px;
    font-family: Tahoma;
    color: #585857;
}

.font14 {
    font-size: 14px;
    font-family: Tahoma;
    color: #585857;
}

.font15 {
    font-size: 15px;
    font-family: Tahoma;
    color: #585857;
}

.font15B {
    font-size: 15px;
    font-family: Tahoma;
    color: #002558;
    font-weight: 600;
}

.font15BG {
    font-size: 15px;
    font-family: Tahoma;
    color: #585857;
    font-weight: 600;
    display: block;
}

.font14LB {
    font-size: 14px;
    font-family: Tahoma;
    color: #002558;
    font-weight: 600;
    display: block;
    margin: -5px;
}

.font15LB {
    font-size: 15px;
    font-family: Tahoma;
    color: #002558;
    font-weight: 600;
    display: block;
    margin: -5px;
}

.font15LBD {
    font-size: 15px;
    font-family: Tahoma;
    color: #585857;
    display: block;
    font-weight: 600;
    margin: -5px;
}

.font15LBD:hover {
    text-decoration:none;
}

.font16 {
    font-size: 16px;
    font-family: Tahoma;
    color: #002558;
}

.font16B {
    font-size: 16px;
    font-family: Tahoma;
    color: #002558;
    font-weight: 600;
}

.font17 {
    font-size: 17px;
    font-family: Tahoma;
    color: #585857;
}

.font17BG {
    font-size: 17px;
    font-family: Tahoma;
    color: #585857;
    font-weight: 600;
}

.font17B {
    font-size: 17px;
    font-family: Tahoma;
    color: #002558;
    font-weight: 600;
}

.font18B {
    font-size: 18px;
    font-family: Tahoma;
    color: #002558;
    font-weight: 600;
}

.font19B {
    font-size: 19px;
    font-family: Tahoma;
    color: #002558;
    font-weight: 600;
}

.font20B {
    font-size: 20px;
    font-family: Tahoma;
    color: #002558;
    font-weight: 600;
}

/* ==========================
7. Gallery
============================= */

.section.gallery {
    padding-bottom: 60px;
}

.popup-gallery {
    margin-right: -5px;
    margin-left: -5px;
}

.popup-gallery .col-tjf-3,
.popup-gallery .col-md-3,
.popup-gallery .col-sm-3,
.popup-gallery .col-xs-4 {
    padding-right: 5px;
    padding-left: 5px;
}

.popup-gallery .col-tjf-6,
.popup-gallery .col-md-6,
.popup-gallery .col-sm-6,
.popup-gallery .col-xs-12 {
    padding-right: 5px;
    padding-left: 5px;
}

.historyTitle {
    background-color: #002558;
    color: #ffffff;
    font-size: 30px;
    font-weight: 600;
    margin-top: 20px;
    margin-bottom: 10px;
    width: 100%;
    line-height: 60px;
    vertical-align: middle !important;
}

.albumTitleYear {
    background-color: #5ea443;
    color: #ffed00;
    font-size: 30px;
    font-weight: 600;
    margin-top: 20px;
    margin-bottom: 10px;
    width: 100%;
    line-height: 60px;
    vertical-align:middle !important;
}

.albumTitle {
    background-color: #002558;
    color: White;
    font-size: 18px;
    font-weight: 500;
    width: 100%;
    line-height: 35px;
}

/* test album */
.album-border-style {
    border-top: 1px solid rgba(0,0,0,0.5);
    text-align: left;
    width: 100%;
    margin: 0 auto;
    padding-top: 8px;
}

.w-item input {
    display: block;
    max-width: 100%;
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    -webkit-transition-duration: 250ms;
    transition-duration: 250ms;
    cursor: pointer;
    -webkit-transition: 0.4s all linear;
    transition: 0.4s all linear;
    opacity: 0.6;
}

.w-item:hover input {
    -webkit-transform: scale(1.05,1.07);
    -ms-transform: scale(1.05,1.07);
    transform: scale(1.05,1.07);
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-duration: 250ms;
    transition-duration: 250ms;
    opacity: 1;
}

.w-item:hover input, .w-item:hover p {
    -webkit-transform: scale(1.05,1.07);
    -ms-transform: scale(1.05,1.07);
    transform: scale(1.05,1.07);
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-duration: 250ms;
    transition-duration: 250ms;
    font-weight: 500;
    z-index: 5;
    font-size: 22px;
}

/*konec testu album */

.w-item {
    position: relative;
    overflow: hidden;
    width: 100%;
    margin-bottom: 10px;
}

.w-item a, .w-item a img {
    display: block;
    max-width: 100%;
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    -webkit-transition-duration: 250ms;
    transition-duration: 250ms;
    cursor: pointer;
    -webkit-transition: 0.4s all linear;
    transition: 0.4s all linear;
}

.w-item a:hover img {
    -webkit-transform: scale(1.05,1.07);
    -ms-transform: scale(1.05,1.07);
    transform: scale(1.05,1.07);
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-duration: 250ms;
    transition-duration: 250ms;
}

.w-item a .project-info {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    background: rgba(0,0,0,0.5);
    padding-top: 50%;
    text-align: center;
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: all ease .25s;
    transition: all ease .25s;
}

.w-item a .project-info .project-icon {
    position: relative;
    top: -120px;
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: all ease .25s;
    transition: all ease .25s;
    width: 100%;
    color: #002558;
}

.w-item a .project-info .project-icon .fa {
    font-size: 40px;
    filter: alpha(opacity=90);
    opacity: .9;
}

.w-item a:hover .project-info {
    filter: alpha(opacity=100);
    opacity: 1;
}

.w-item a:hover .project-icon {
    filter: alpha(opacity=100);
    opacity: 1;
    top: -60px;
}

.w-item a:hover .project-icon .fa:hover {
    filter: alpha(opacity=100);
    opacity: 1;
}

.w-item a:hover .details {
    filter: alpha(opacity=100);
    opacity: 1;
    bottom: 0;
}

/********************************/

.btSend {
    clear: both;
    text-align: center;
    margin-top: 20px;

    color: #fff;
    font-size: 18px;
    
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    background: #219FDA;
    background: -moz-linear-gradient(top, #002558 0%, #1e3c6e 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #002558), color-stop(100%, #1e3c6e));
    background: -webkit-linear-gradient(top, #002558 0%, #1e3c6e 100%);
    background: -o-linear-gradient(top, #002558 0%, #1e3c6e 100%);
    background: -ms-linear-gradient(top, #002558 0%, #1e3c6e 100%);
    background: linear-gradient(to bottom, #002558 0%, #1e3c6e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002558', endColorstr='#1e3c6e', GradientType=0 );
}

.btSend:hover {
    background: #5ea443;
    color: #fff;
}

.btDeleteAll {
    clear: both;
    text-align: center;
    margin-top: 20px;
    color: #fff;
    font-size: 18px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    background: Orange;
    background: -moz-linear-gradient(top, Orange 0%, DarkOrange 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, Orange), color-stop(100%, DarkOrange));
    background: -webkit-linear-gradient(top, Orange 0%, DarkOrange 100%);
    background: -o-linear-gradient(top, Orange 0%, DarkOrange 100%);
    background: -ms-linear-gradient(top, Orange 0%, DarkOrange 100%);
    background: linear-gradient(to bottom, Orange 0%, DarkOrange 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002558', endColorstr='#1e3c6e', GradientType=0 );
}

.btDeleteAll:hover {
    background: red;
    color: #fff;
}


.loadmoreback {
    clear: both;
    text-align: center;
    margin-top: 20px;
    padding: 15px 30px;
    color: #fff;
    font-size: 18px;
    display:block;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    background: #219FDA;
    background: -moz-linear-gradient(top, #002558 0%, #1e3c6e 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #002558), color-stop(100%, #1e3c6e));
    background: -webkit-linear-gradient(top, #002558 0%, #1e3c6e 100%);
    background: -o-linear-gradient(top, #002558 0%, #1e3c6e 100%);
    background: -ms-linear-gradient(top, #002558 0%, #1e3c6e 100%);
    background: linear-gradient(to bottom, #002558 0%, #1e3c6e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002558', endColorstr='#1e3c6e', GradientType=0 );
}

.loadmoreback:hover {
    background: #5ea443;
    color: #fff;
}

.ajax__tab_xp2 .ajax__tab_header {
    background-color: white;
    width: 100%;
}

.ajax__tab_xp2 .ajax__tab_outer {
    height: 60px;
    background-color: #5ea443;
    color: #ffed00;
    vertical-align: middle;
    text-align: center;
}

.ajax__tab_xp2 .ajax__tab_inner {
    background-color: #c5c5c5;
    color: #585858;
    vertical-align: middle;
}

.ajax__tab_xp2 .ajax__tab_tab {
    height: 60px;
    font-size: 17px;
    color: #585858;
    font-weight: bold;
    width: 183.33333px;
}

.ajax__tab_xp2 .ajax__tab_tab span {
    vertical-align: middle;
    line-height: 60px;
}

.ajax__tab_xp2 .ajax__tab_header .ajax__tab_disabled .ajax__tab_outer .ajax__tab_inner .ajax__tab_tab {
    cursor: default;
    font-family: Tahoma;
    font-weight: bold;
    vertical-align: middle;
}

.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_outer {
    background-color: #002558;
    color: #FFFFFF;
}

.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_inner {
    background-color: #002558;
    color: #FFFFFF;
}

.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_tab {
    background-color: #002558;
    color: #FFFFFF;
}

.ajax__tab_xp2 .ajax__tab_active .ajax__tab_outer {
    background-color: #5ea443;
    color: #ffed00;
}

.ajax__tab_xp2 .ajax__tab_active .ajax__tab_inner {
    background-color: #5ea443;
    color: #ffed00;
}

.ajax__tab_xp2 .ajax__tab_active .ajax__tab_tab {
    background-color: #5ea443;
    color: #ffed00;
}

.ajax__tab_xp2 .ajax__tab_body {
    border: none;
    padding: 10px 5px;
    background-color: #ffffff;
}

.ajax__tab_xp2 {
    padding-bottom: 20px;
}

/* HISTORY */

.nav-history {
    text-align: center;
    position: relative;
}

.nav-history:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 6px;
    background-color: #002558;
    left: 0;
    top: 32px;
}

.nav-history .owl-controls .owl-page {
    cursor: pointer;
    display: inline-table;
}

.nav-history a {
    width: 70px;
    height: 70px;
    display: inline-block;
    background-color: #000;
    color: #fff;
    padding-top: 25px;
    font-weight: bold;
    margin: 0px 40px;
    position: relative;
    z-index: 2;
    cursor: pointer;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

.nav-history a:hover {
    background-color: #002558;
    color: white;
    text-decoration: none;
}

.nav-history .active a {
    background-color: #002558;
}

.history-caro {
    padding: 30px 30px;
    border: 1px solid #e0e0e0;
    margin: 40px 0 80px 0;
    background-color: #c5c5c5;
}

.history-caro:hover {
    background-color: #fff;
}

.history-caro:after {
    content: '';
    clear: both;
    width: 100%;
    display: table;
}

.history-item {
    width: 100%;
    position: relative;
}

.history-item .gambar {
    width: 30%;
    float: left;
}

.history-item .item-body {
    width: 70%;
    float: left;
    padding: 20px 0 20px 60px;
}

.history-item .item-body .title {
    font-size: 20px;
    color: #002558;
    margin-bottom: 20px;
    font-weight: 700;
}

.ddlMessage {
    font-family: Tahoma;
    font-size: 20px;
    height: 35px;
    border: 1px solid #c5c5c5;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

.tbMessage {
    font-family: Tahoma;
    font-size: 18px;
    height: 35px;
    border: 1px solid #c5c5c5;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

.animationload {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999;
    background-color: #fff;
}

.loader {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -100px 0 0 -100px;
    width: 200px;
    height: 200px;
    background-image: url("/images/loading.gif");
    background-position: center;
    background-repeat: no-repeat;
}

.form-question {
    padding-right: 40px;
}

.control-label {
    text-align: left;
    padding-top: 8px;
    font-weight: 700;
}

.has-error .control-label {
    text-align: left;
    font-weight: 700;
}

/* styl pro editace galerie */

.w-delete {
    position: relative;
    overflow: hidden;
    width: 100%;
    margin-bottom: 10px;
}

.w-delete, .w-delete img {
    display: block;
    max-width: 100%;
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    -webkit-transition-duration: 250ms;
    transition-duration: 250ms;
    cursor: pointer;
    -webkit-transition: 0.4s all linear;
    transition: 0.4s all linear;
}

.w-delete:hover img {
    -webkit-transform: scale(1.05,1.07);
    -ms-transform: scale(1.05,1.07);
    transform: scale(1.05,1.07);
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-duration: 250ms;
    transition-duration: 250ms;
}

.w-delete .project-info {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    background: rgba(0,0,0,0.5);
    padding-top: 50%;
    text-align: center;
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: all ease .25s;
    transition: all ease .25s;
}

.w-delete .project-info .project-icon {
    position: relative;
    top: -100px;
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: all ease .25s;
    transition: all ease .25s;
    width: 100%;
    color: #f00;
}

.w-delete .project-info .project-icon .fa {
    font-size: 20px;
    filter: alpha(opacity=90);
    opacity: .9;
}

.w-delete:hover .project-info {
    filter: alpha(opacity=100);
    opacity: 1;
}

.w-delete:hover .project-icon {
    filter: alpha(opacity=100);
    opacity: 1;
    top: -60px;
}

.w-delete:hover .project-icon .fa:hover {
    filter: alpha(opacity=100);
    opacity: 1;
}

.w-delete:hover .details {
    filter: alpha(opacity=100);
    opacity: 1;
    bottom: 0;
}

/* konec stylu pro editaci galerie */

/* styl pro komentaře */

.comments-box {
    padding-bottom: 30px;
}

.comments-box .media {
    padding: 20px 0;
    border-bottom: 1px solid #dedede;
}

.comments-box .media.reply-comment {
    padding-left: 40px;
}

.comments-box .media-heading {
}

.comments-box .media-heading span {
    color: #f00;
}

.comments-box .media-body {
    padding-left: 20px;
    vertical-align: middle;
}

.comments-box .media-left img {
    width: 100px;
    height: 100px;
}

.comments-box .date {
    margin-left: 10px;
    border-left: 1px solid #000;
    padding-left: 10px;
}

.comments-box .title-heading,
.leave-comment-box .title-heading {
    font-size: 18px;
    line-height: 25px;
    font-weight: 700;
    margin-top: 10px;
    margin-bottom: 20px;
    margin-left: 10px;
}

.form-comment {
}

.form-comment .form-control {
    padding: 24px 12px;
    border-radius: 0;
    border: 1px solid #E9E9E9;
    box-shadow: none;
}

.form-comment .btn-default {
    padding: 15px 60px;
    letter-spacing: 2px;
}

.comment-hover:hover {
    background-image: url("../images/dialog.png");
    border-radius: 50%;
}

.re-reply-comment {
    padding-left: 40px;
}

.form-group {
    margin-bottom: 15px;
}

/* konec stylu pro komentaře */


.fontCheckBoxPenalties label {
    padding-left: 5px;
    color: #585857;
    vertical-align: middle;
    font-size: 15px;
}

.fontCheckBoxPenalties input[type='checkbox'] {
    width: 16px;
}

.fontCheckBox label {
    padding-left: 15px;
    color: #585857;
    vertical-align: middle;
    font-size: 15px;
    padding-bottom: 10px;
}

.fontCheckBox input[type='checkbox'] {
    width: 20px;
    height: 20px;
}

.fontCheckBoxAttendance input[type='checkbox'] {
    margin-left: 20px;
    width: 35px;
    height: 35px;
}

.fontCheckBoxList {
    font-family: Tahoma;
    color: #002558;
    font-size: 13px;
    border: none;
    height: 50px;
    resize: none;
    padding-left: 15px;
    background-color: white;
    padding-bottom: 8px;
}

.fontCheckBoxList td {
    height: 40px;
}

.fontCheckBoxList label {
    padding-left: 15px;
    color: #999999;
    vertical-align: bottom;
}

.fontCheckBoxList input[type='checkbox'] {
    width: 25px;
    height: 25px;
}

.wmeInsertMatch {
    color: #707070;
    font-family: Tahoma;
    font-size: 12px;
    font-style: italic;
}

.tournamentGridView {
    border: 15px solid White;
    background-color: white;
    font-family: Tahoma;
    color: Black;
}

.gridviewTournamentHeader {
    background-color: #002558;
    height: 40px;
    font-family: Tahoma;
    font-size: 15px;
    color: White;
}

.gridviewTournamentHeader th {
    border: 1px solid White;
    font-weight: 100;
    text-align: center !important;
    padding: 0px 5px;
    border-right: none;
}

.gridviewTournamentHeader a {
    text-decoration: none;
    color: White;
    font-weight: 100 !important;
}

.gridviewTournamentRow td {
    background-color: #ececec;
    border: 1px solid #777777;
    vertical-align: middle !important;
    min-height: 100px;
    padding: 5px;
    border-right: none;
    min-width: 20px;

    font-family: Tahoma;
    font-size: 17px;
}

.gridviewTournamentAlterRow td {
    background-color: #bbbbbb;
    border: 1px solid #777777;
    vertical-align: middle !important;
    min-height: 100px;
    padding: 5px;
    border-right: none;
    min-width: 20px;

    font-family: Tahoma;
    font-size: 17px;
}

.gridviewTournamentFooter {
    background-color: #c5c5c5;
    height: 50px;
    font-family: Tahoma;
    font-size: 15px;
}

.gridviewTournamentFooter td {
    border: 1px solid White;
    text-align: center;
}

.gridviewTournamentScheduleRow td {
    background-color: #fafafa;
    border: 1px solid #777777;
    vertical-align: middle !important;
    height: 10px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-right: none;
    min-width: 40px;
}

.gridviewTournamentTableRow td {
    background-color: #fafafa;
    border: 1px solid #777777;
    vertical-align: middle !important;
    height: 10px;
    padding: 5px;
    border-right: none;
    min-width: 30px;
}

.tableWordFont {
    font-family: Tahoma;
    color: Blue;
    font-size: 13px;
    border: none;
    padding-left: 5px;
}

.footer {
    position: fixed;
    bottom: 0;
    width: 100%;
}

/* playoff */

.thd {
    background-color: #002558;
    color: White;
    font-weight: 500;
    font-size: 20px;
    font-family: Tahoma;
    text-align: center;
    vertical-align: middle !important;
    padding: 8px 0px;
}

.team {
    color: black;
    background: #dddddd;
    font-weight: 200;
    font-size: 18px;
    font-family: Tahoma;
    border-right: solid 2px black !important;
    vertical-align: middle;
}

.winner {
    color: #002558;
    background: gold;
    font-weight: bold;
    font-size: 23px;
    font-family: Tahoma;
}

.second {
    color: #002558 !important;
    background-color: silver;
    font-weight: bold;
    font-size: 23px;
    font-family: Tahoma;
    border-right: solid 2px black !important;
    vertical-align: middle;
}

.third {
    color: #002558;
    background-color: #cd7f32;
    font-weight: bold;
    font-size: 23px;
    font-family: Tahoma;
}

.other {
    color: #002558;
    background-color: #dddddd;
    font-weight: bold;
    font-size: 23px;
    font-family: Tahoma;
}

.vs {  
    border-right: solid 2px black !important;
}

.vs td {
    font-size: 15px;
    font-family: Tahoma;
    border: none !important;
    color: #585857;
}

.tbl {
    padding-top: 15px;
    padding-bottom: 15px;
}

.tbl td, th {
    padding: 3px 15px; 
    border-right: dotted 2px rgb(200,200,200); 
    text-align: right;
    vertical-align: middle !important;
}

.tblThird {
    width: 35%;
    padding-top: 15px;
    padding-bottom: 15px;
}

.tblThird td, th {
    padding: 3px 15px;
    border-right: dotted 2px rgb(200,200,200);
    text-align: right;
    vertical-align: middle !important;
}

.tblPlacement {
    width: 99%;
    padding-top: 15px;
    padding-bottom: 15px;
}

.tblPlacement td, th {
    padding: 3px 15px;
    border-right: dotted 2px rgb(200,200,200);
    text-align: right;
    vertical-align: middle !important;
}

.title-playoff {
    color: #002558;
    font-weight: bold;
    font-size: 25px;
    font-family: Tahoma;
}

.tbl * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
}

.tdTables * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
}

.tdSchedules * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
}

.tblThird * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
}

/* konec playoff */

.tournamentViewDDL {
    font-size: 13px;
    font-family: Tahoma;
    color: Black;
    width: 80px;
    border: 1px solid Black;
    background-color: white;
}

/* test title on mobile */

@media (pointer: coarse), (hover: none) {
    [title] {
        position: relative;
        display: inline-flex;
        justify-content: center;
    }

    [title]:focus::after {
        content: attr(title);
        position: absolute;
        top: 90%;
        color: #000;
        background-color: #fff;
        border: 1px solid;
        width: fit-content;
        padding: 3px;
    }
}

/* ===== HERO banner varianta B ===== */

.cellGrassHero {
    background-image: url(../Images/ke_kramu.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 350px;
    padding: 0;
    overflow: hidden;
}

.homeHero {
    background-image: url(../Images/podklad_trava.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
    background-color: #002558;
}

.homeHeroPhotoCarousel {
    position: absolute;
    left: 40%;
    top: 20px;
    width: 60%;
    height: 100%;
    z-index: 3;
    overflow: visible;
}

.heroPhotoSource {
    display: none;
}

.heroPhotoTrack {
    position: relative;
    width: 100%;
    height: 100%;
    writing-mode: vertical-lr;
}

.heroPhotoItem {
    position: absolute;
    height: 80%;
    overflow: hidden;
    background: transparent;
    opacity: 0;
    pointer-events: none;
    justify-items: center;
    justify-content: center;
    vertical-align: middle;

}

.heroPhotoItem img {
    width: 80%;
    height: auto;
    object-fit: cover;
    display: block;
    animation: heroPhotoBreath 7s ease-in-out infinite;
    -webkit-mask-image: radial-gradient(ellipse at center, #000 58%, transparent 100%);
    mask-image: radial-gradient(ellipse at center, #000 58%, transparent 100%);
}

/* vlevo – menší */
.heroPhotoItem.posLeft {
    width: 31%;
    left: 5%;
    top: 20px;
    opacity: .68;
    transform: rotate(-4deg) scale(.85);
    z-index: 1;
}

/* střed – hlavní */
.heroPhotoItem.posCenter {
    width: 43%;
    left: 25%;
    top: 5%;
    opacity: 1;
    transform: rotate(1deg) scale(1);
    z-index: 3;
}

/* vpravo – menší */
.heroPhotoItem.posRight {
    width: 31%;
    left: 53%;
    top: 20px;
    opacity: .72;
    transform: rotate(4deg) scale(.85);
    z-index: 2;
}

.heroPhotoItem.posHiddenLeft {
    width: 31%;
    left: -38%;
    top: 20px;
    opacity: 0;
    transform: rotate(-6deg) scale(.75);
    z-index: 0;
}

.heroPhotoItem.posHiddenRight {
    width: 31%;
    left: 105%;
    top: 20px;
    opacity: 0;
    transform: rotate(6deg) scale(.75);
    z-index: 0;
}

.homeHeroPhotoCarousel {
    cursor: grab;
    user-select: none;
}

.homeHeroPhotoCarousel:active {
    cursor: grabbing;
}

.heroPhotoItem img {
    user-select: none;
    -webkit-user-drag: none;
}

@keyframes heroPhotoBreath {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.035);
    }

    100% {
        transform: scale(1);
    }
}

/* drobný pohyb, aby to působilo živě */
.homeHeroPhotoCard {
    animation-duration: 7s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.photoCardLeft {
    animation-name: photoFloatLeft;
}

.photoCardRight {
    animation-name: photoFloatRight;
}

@keyframes photoFloatLeft {
    0% {
        transform: rotate(-3deg) translateY(0);
    }

    50% {
        transform: rotate(-1.5deg) translateY(-5px);
    }

    100% {
        transform: rotate(-3deg) translateY(0);
    }
}

@keyframes photoFloatRight {
    0% {
        transform: rotate(3deg) translateY(0);
    }

    50% {
        transform: rotate(1.5deg) translateY(5px);
    }

    100% {
        transform: rotate(3deg) translateY(0);
    }
}

.homeHeroOverlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 900px;
    height: 100%;
    z-index: 2;
    display: flex;
    align-items: center;
    padding-left: 42px;
    box-sizing: border-box;
    background: linear-gradient( 90deg, rgba(0,10,18,.98) 0%, rgba(3,20,34,.97) 18%, rgba(8,33,48,.92) 42%, rgba(12,50,58,.78) 65%, rgba(18,67,70,.42) 82%, rgba(0,0,0,.12) 92%, rgba(0,0,0,0) 100% );
    
}

.homeHeroLogo {
    width: 24%;
    height: auto;
    object-fit: contain;
    margin-right: 28px;
    flex-shrink: 0;
}

.homeHeroText {
    font-family: Tahoma;
    color: white;
    text-align: left;
    text-shadow: 0 2px 4px rgba(0,0,0,0.45);
}

.homeHeroTitle {
    font-size: 36px;
    font-weight: bold;
    line-height: 40px;
    color: white;
}

.homeHeroLine {
    width: 100%;
    height: 3px;
    background-color: #5ea443;
    margin: 12px 0 12px 0;
}

.homeHeroClub {
    font-size: 18px;
    font-weight: bold;
    color: #91cf45;
}

.homeHeroSince {
    font-size: 16px;
    color: white;
    margin-top: 5px;
}

.homeHeroDots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 118px;
    text-align: center;
    z-index: 5;
}

.homeHeroDots span {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin: 0 4px;
    border-radius: 50%;
    background-color: rgba(255,255,255,0.55);
}

.homeHeroDots span.active {
    background-color: white;
}

.homeHeroButtons {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 1100px;
    transform: translateX(-50%);
    z-index: 6;
}

/* css pro menu tlačítka */

.heroButton {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 65px;
    background: #002558;
    border: 1px solid white;
    text-decoration: none;
}

.heroButton:hover {
    text-decoration: none;
    background-color: #5ea443 !important;
    color: #ffed00 !important;
}

.heroButtonIcon {
    text-align: center;
    flex-shrink: 0;
}

.heroButtonIcon img {
    max-width: 75px;
    max-height: 50px;
}

.heroButtonText {
    text-align: center;
    color: white;
    font-size: 23px;
    font-family: Tahoma;
    font-weight: 500;
    margin-left: 20px;
}

/* =========================================================
   RESPONSIVE - MASTER MENU + HERO
   ========================================================= */

.mainMenuWrap {
    width: 1300px;
    margin: 0 auto;
    text-align: center;
}

.mobileTopNav {
    display: none;
}

/* TABLET - zůstává klasické menu, jen menší */
@media (max-width: 1300px) and (min-width: 851px) {
    .mainMenuWrap {
        width: 100% !important;
    }

    .trMainMenu,
    .mainMenu,
    .mainMenu_scroll {
        height: 54px !important;
    }

    .mainMenu,
    .mainMenu_scroll {
        width: 100% !important;
    }

        .mainMenu > ul,
        .mainMenu_scroll > ul {
            display: flex !important;
            width: 100% !important;
        }

            .mainMenu > ul > li,
            .mainMenu_scroll > ul > li {
                flex: 1 1 0 !important;
                width: auto !important;
                min-width: 0 !important;
            }

                .mainMenu > ul > li > a,
                .mainMenu_scroll > ul > li > a {
                    display: block !important;
                    width: 100% !important;
                    min-width: 0 !important;
                    height: 54px !important;
                    line-height: 54px !important;
                    padding: 0 6px !important;
                    box-sizing: border-box !important;
                    font-size: 12px !important;
                    white-space: nowrap !important;
                    overflow: hidden;
                    text-overflow: ellipsis;
                }

                    .mainMenu > ul > li > a.popout,
                    .mainMenu_scroll > ul > li > a.popout {
                        padding-right: 18px !important;
                    }

                        .mainMenu > ul > li > a.popout:after,
                        .mainMenu_scroll > ul > li > a.popout:after {
                            right: 5px !important;
                        }

    .homeHeroPhotoCarousel {
        left: 42%;
        top: 22px !important;
        width: 56%;
        height: 90%;
        overflow: hidden;
    }

    .heroPhotoTrack {
        height: 90%;
        top: inherit;
    }

    .heroPhotoItem.posLeft,
    .heroPhotoItem.posRight,
    .heroPhotoItem.posHiddenLeft,
    .heroPhotoItem.posHiddenRight {
        display: none !important;
    }

    .heroPhotoItem.posCenter {
        width: 100%;
        height: 90%;
        left: 0;
        top: 0;
        transform: none !important;
        opacity: 1;
    }

        .heroPhotoItem.posCenter img {
            width: 100%;
            height: 100%;
            object-fit: contain !important;
            object-position: center center !important;
        }

    .homeHeroButtons {
        left: 0;
        width: 100%;
        transform: none;
    }

        .homeHeroButtons table {
            width: 100% !important;
            table-layout: fixed;
        }

        .homeHeroButtons td {
            width: 20% !important;
        }

    .heroButtonText {
        font-size: 17px;
        margin-left: 8px;
    }

    .heroButtonIcon img {
        max-width: 48px;
        max-height: 34px;
    }

    .cellGrassHero {
        height: 305px;
    }

    .homeHeroOverlay {
        width: 470px;
        padding-left: 24px;
    }

    .homeHeroLogo {
        width: 105px;
        margin-right: 18px;
    }

    .homeHeroTitle {
        font-size: 27px;
        line-height: 31px;
    }

    .homeHeroClub {
        font-size: 15px;
    }

    .homeHeroSince {
        font-size: 14px;
    }

    .homeHeroLine {
        margin: 9px 0;
    }

    .homeHeroPhotoCarousel {
        left: 42%;
        width: 58%;
        top: 15px;
    }
}

/* TABLET HERO FOTO - do 1000px ještě koláž */
@media (max-width: 1300px) and (min-width: 1001px) {
    .homeHeroPhotoCarousel {
        left: 42%;
        top: 16px;
        width: 58%;
        height: 285px;
        overflow: visible;
    }

    .heroPhotoTrack {
        height: 285px;
    }

    .heroPhotoItem {
        height: 270px;
    }

        .heroPhotoItem.posLeft {
            display: block !important;
            width: 31%;
            left: 0;
            top: 10px !important;
            opacity: .68;
            transform: rotate(-4deg) scale(.85);
            z-index: 1;
        }

        .heroPhotoItem.posCenter {
            display: block !important;
            width: 43%;
            left: 25%;
            top: -4px;
            opacity: 1;
            transform: rotate(1deg) scale(1);
            z-index: 3;
        }

        .heroPhotoItem.posRight {
            display: block !important;
            width: 31%;
            left: 62%;
            top: 10px !important;
            opacity: .72;
            transform: rotate(4deg) scale(.85);
            z-index: 2;
        }

        .heroPhotoItem.posHiddenLeft {
            display: block !important;
            width: 31%;
            left: -38%;
            top: 6px;
            opacity: 0;
            transform: rotate(-6deg) scale(.75);
            z-index: 0;
        }

        .heroPhotoItem.posHiddenRight {
            display: block !important;
            width: 31%;
            left: 105%;
            top: 6px;
            opacity: 0;
            transform: rotate(6deg) scale(.75);
            z-index: 0;
        }

        .heroPhotoItem img {
            width: 100%;
            height: auto;
            object-fit: cover;
            top: -4px;
        }
}

/* MOBIL */
@media (max-width: 850px) {
    .mainMenuWrap {
        width: 100%;
        height: 40px;
        position: relative;
        background: #002558;
    }

    .mainMenu {
        display: none !important;
    }

    .mobileTopNav {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        height: 56px;
        position: relative;
        background: #002558;
        z-index: 100000;
        padding: 0 12px;
        box-sizing: border-box;
    }

    .trMainMenu,
    .mainMenuWrap, 
    .mobileTopNav {
        height: 40px;
    }

    .mobileNavLogo {
        position: absolute;
        top: 50%;
        width: 34px;
        height: 34px;
        left: 8px;
    }

        .mobileNavLogo img {
            max-width: 34px;
            max-height: 34px;
        }

    .mobileTeamsToggle,
    .mobileMoreToggle {
        height: 34px;
        line-height: 34px;
        border: none;
        background: transparent;
        color: white;
        font-family: Tahoma;
        font-size: 14px;
        font-weight: bold;
        margin-left: 10px;
        padding: 0 10px;
        cursor: pointer;
    }

    .mobileMoreToggle {
        width: 42px;
        font-size: 27px;
        line-height: 36px;
        padding: 0;
    }

    .mobileTeamsPanel,
    .mobileMorePanel {
        display: none;
        position: absolute;
        top: 40px;
        right: 0;
        width: 260px;
        background: #002558;
        z-index: 100001;
        box-shadow: 0 8px 20px rgba(0,0,0,.35);
    }

        .mobileTeamsPanel.open,
        .mobileMorePanel.open {
            display: block;
        }

    .mobileMenuList,
    .mobileMenuList ul,
    .mobileMenuList li {
        display: block !important;
        width: 100% !important;
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

        .mobileMenuList a {
            display: block !important;
            width: 100% !important;
            box-sizing: border-box;
            padding: 0 18px !important;
            line-height: 44px !important;
            height: 44px !important;
            background: #002558 !important;
            background-image: none !important;
            color: white !important;
            font-family: Tahoma;
            font-size: 14px;
            text-align: left !important;
            border-bottom: 1px solid rgba(255,255,255,.18);
            text-decoration: none !important;
        }

        .mobileMenuList ul a {
            padding-left: 34px !important;
            font-size: 13px;
            background: #073069 !important;
        }

        .mobileMenuList a:hover {
            background: #5ea443 !important;
            color: #ffed00 !important;
        }

    /* HERO MOBILE */
    .cellGrassHero {
        height: 350px;
        background-image: url(../Images/podklad_trava.jpg);
        background-size: cover;
        background-position: center;
    }

    .homeHero {
        height: 100%;
        background-image: url(../Images/podklad_trava.jpg);
        background-size: cover;
        background-position: center;
    }

    /* fotka jen v pravé části a až dolů k tlačítkům */
    .homeHeroPhotoCarousel {
        left: 38%;
        top: 20px;
        width: 62%;
        height: 296px;
        z-index: 2;
        overflow: hidden;
        opacity: 1;
        cursor: grab;
        pointer-events: auto;

    }

    .heroPhotoTrack {
        height: 296px;
    }

    .heroPhotoItem.posLeft,
    .heroPhotoItem.posRight,
    .heroPhotoItem.posHiddenLeft,
    .heroPhotoItem.posHiddenRight {
        display: none !important;
    }

    .heroPhotoItem.posCenter {
        width: 100%;
        height: 296px;
        left: 0;
        top: 0;
        opacity: 1;
        transform: none !important;
        z-index: 3;
        pointer-events: none;
    }

        .heroPhotoItem.posCenter img {
            width: 100%;
            height: 100%;
            object-fit: contain; /* neořezávat */
            object-position: center center;
        }

    .homeHeroOverlay {
        width: 70%;
        height: 296px;
        padding: 56px 0 0 14px;
        align-items: flex-start;
        justify-content: flex-start;
        background: linear-gradient( 90deg, rgba(0,20,45,.96) 0%, rgba(0,20,45,.86) 45%, rgba(0,20,45,.45) 75%, rgba(0,20,45,0) 100% );
        z-index: 4;
        pointer-events: none;
    }

    .homeHeroText {
        margin-top: 0;
        widt
    }

    .homeHeroTitle {
        font-size: 22px;
        line-height: 25px;
    }

    .homeHeroClub {
        font-size: 13px;
    }

    .homeHeroSince {
        font-size: 12px;
    }

    .homeHeroLine {
        width: 205px;
        margin: 7px 0;
    }

    .homeHeroDots {
        bottom: 88px;
    }

    .homeHeroButtons {
        left: 0;
        bottom: 0;
        width: 100%;
        transform: none;
    }

        .homeHeroButtons table {
            width: 100% !important;
            table-layout: fixed;
        }

        .homeHeroButtons td {
            width: 20% !important;
        }

    .heroButton {
        height: 54px;
        flex-direction: row;
        gap: 8px;
    }

    .heroButtonIcon img {
        max-width: 30px;
        max-height: 30px;
    }

    .heroButtonText {
        margin-left: 0;
        font-size: 13px;
        line-height: 13px;
    }

    .homeHeroLogo {
        display: none;
    }
}

/* úzký mobil */
@media (max-width: 430px) {
    .homeHeroPhotoCarousel {
        left: 32%;
        width: 68%;
    }

    .homeHeroOverlay {
        width: 62%;
    }

    .homeHeroTitle {
        font-size: 21px;
        line-height: 24px;
    }

    .homeHeroClub {
        font-size: 13px;
    }

    .homeHeroSince {
        font-size: 12px;
    }

    .heroButtonText {
        font-size: 9px;
    }

    .heroButtonIcon img {
        max-width: 28px;
        max-height: 22px;
    }
}

/* NEW Default page */

.homePageTable {
    background-color: #f2f2f2;
}

.homeSectionCell {
    padding: 0;
}

.homeContentWrap {
    width: 100%;
    padding: 2.5% 10%;
    margin: 0 auto;
    box-sizing: border-box;
}

.homeClubLife {
    background: #ffffff;
}

.clubLifeLeft,
.clubLifeRight {
    display: flex;
    flex-direction: column;
}

.clubLifeLeft {
    width: 35%;
}

.clubLifeRight {
    width: 65%;
}

.lifeGrid,
.eventMiniTimeline {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-content: center; /* toto je hlavní změna */
}

.homeClubLife h2,
.homeTrainingTimeline h2,
.homeHistorySection h2,
.homeGallerySection h2,
.homeJoinSection h2,
.homeNewsSection h2,
.homeSponsorsSection h2,
.homeDocumentsSection h2,
.homeStatsSection h2 {
    font-family: Tahoma;
    font-size: 26px;
    color: #073069;
    margin: 0;
}

.sectionLine {
    width: 42px;
    height: 4px;
    background: #5ea443;
    margin: 12px 0 24px 0;
}

.lifeGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-row-gap: 15%;
    grid-column-gap: 20%;
    margin-bottom: 24px;
}

.lifeItem {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.lifeIcon {
    font-size: 30px;
    width: 40px;
    text-align: center;
}

.lifeItem strong {
    display: block;
    color: #073069;
    font-size: 15px;
    text-transform: uppercase;
}

.lifeItem span {
    display: block;
    color: #333;
    font-size: 13px;
    line-height: 18px;
}

.sectionHeader {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 0px;
}

.sectionButton {
    margin-top: 26px;
    text-align: center;
}

.sectionButton .homeBtn {
    min-width: 270px;
}

.clubLifeLeft .sectionHeader,
.clubLifeRight .sectionHeader {
    align-items: flex-start;
}

.homeBtn {
    display: inline-block;
    width: 210px;
    box-sizing: border-box;
    text-align: center;
    background: transparent;
    color: #073069 !important;
    border: 1px solid #073069;
    padding: 10px 18px;
    text-decoration: none;
    font-weight: bold;
    font-size: 13px;
    border-radius: 2px;
    transition: all .25s ease;
}

.homeBtn:hover {
    background: #073069;
    color: white !important;
}

.homeTrainingTimeline .homeBtn,
.homeJoinSection .homeBtn {
    color: white !important;
    border-color: white;
}

.homeTrainingTimeline .homeBtn:hover,
.homeJoinSection .homeBtn:hover {
    background: white;
    color: #073069 !important;
}

.homeBtn.secondary {
    background: white;
    color: #073069 !important;
    border: 1px solid #073069;
}

/* training section */

/* =========================================================
   HOMEPAGE - JAK TRÉNUJEME
   ========================================================= */

.homeTrainingTimeline {
    background: #062653;
    color: white;
    overflow-x: hidden;
}

    .homeTrainingTimeline,
    .homeTrainingTimeline * {
        box-sizing: border-box;
    }

        .homeTrainingTimeline h2 {
            color: white;
        }

/* karta dne */
.trainingWeekDay {
    display: flex !important;
    flex-direction: column;
    min-height: 240px;
    background: white !important;
    color: #073069 !important;
    text-decoration: none !important;
    border-top: 5px solid #5ea443;
    box-shadow: 0 8px 18px rgba(0,0,0,.22);
    transition: transform .25s ease, box-shadow .25s ease;
    overflow: hidden;
}

    .trainingWeekDay:hover {
        transform: translateY(-4px);
        box-shadow: 0 14px 28px rgba(0,0,0,.32);
        text-decoration: none !important;
    }

/* hlavička dne */
.trainingWeekHeader {
    position: relative;
    min-height: 54px;
    padding: 12px 14px;
    border-bottom: 1px solid #e5e5e5;
    align-content: center;
}

.trainingCalendarIcon {
    position: absolute;
    left: 14px;
    top: 11px;
    font-size: 25px;
}

.trainingDayTitle {
    text-align: center;
    color: #073069;
    font-weight: bold;
}

    .trainingDayTitle strong {
        color: #073069;
    }

/* tělo */
.trainingWeekBody {
    flex: 1;
    padding-top: 6px;
}

    .trainingWeekBody.empty {
        position: relative;
        min-height: 240px;
    }

        .trainingWeekBody.empty:before {
            content: "O víkendu není naplánovaný žádný pravidelný trénink";
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 80%;
            text-align: center;
            color: #999;
            font-size: 14px;
            line-height: 20px;
        }

/* řádek tréninku */
.trainingWeekLine {
    display: flex;
    gap: 10px;
    margin: 8px 12px;
    padding: 8px 10px;
    border-left: 4px solid var(--catColor, #5ea443);
    background: linear-gradient(90deg, color-mix(in srgb, var(--catColor, #5ea443) 18%, white) 0%, white 72%);
}

.trainingTime {
    width: 58px;
    flex: 0 0 58px;
    color: #5ea443;
    font-weight: bold;
    line-height: 15px;
}

    .trainingTime strong {
        display: block;
        font-size: 16px;
        font-weight: 600;
    }

    .trainingTime span {
        display: block;
        font-size: 14px;
        opacity: .85;
    }

.trainingInfo {
    min-width: 0;
}

    .trainingInfo span {
        display: block;
        color: #073069;
        font-size: 16px;
        line-height: 18px;
        font-weight: 600;
    }

    .trainingInfo small {
        display: block;
        color: #555;
        font-size: 14px;
    }

/* patička karty */
.trainingWeekFooter,
.trainingWeekGrayFooter {
    margin: 0 14px 14px 14px;
    padding-top: 9px;
    border-top: 1px solid #e5e5e5;
    color: #5ea443;
    font-weight: bold;
    font-size: 13px;
    height: 30px;
}

.trainingWeekGrayFooter {
    border-top-color: #c5c5c5;
    color: #c5c5c5;
}

.trainingCheck,
.trainingGrayCheck {
    display: inline-block;
    margin-right: 6px;
    width: 20px;
    height: 20px;
    line-height: 14px;
    text-align: center;
    border-radius: 50%;
    border: 2px solid #5ea443;
    font-size: 11px;
}

.trainingGrayCheck {
    border-color: #c5c5c5;
}

/* poznámka */
.trainingNotice {
    margin-top: 22px;
    text-align: center;
    color: white;
    font-size: 14px;
    font-weight: bold;
    white-space: normal;
}

    .trainingNotice span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 19px;
        height: 19px;
        margin-right: 8px;
        border-radius: 50%;
        background: white;
        color: #073069;
    }

/* JAK TRÉNUJEME - slider + desktop */

.homeTrainingTimeline {
    overflow-x: hidden;
}

    .homeTrainingTimeline .homeContentWrap {
        max-width: 100%;
        overflow: hidden;
    }

/* výchozí stav = slider */
.trainingWeekArea {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
    padding: 0;
}

.trainingWeekScroller {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    padding: 0 10px 18px 10px;
    cursor: grab;
    scrollbar-width: none;
    -ms-overflow-style: none;
    contain: inline-size;
}

    .trainingWeekScroller::-webkit-scrollbar {
        height: 0;
    }

    .trainingWeekScroller.dragging {
        cursor: grabbing;
    }

.trainingWeekGrid {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 16px;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
}

.trainingWeekDay {
    flex: 0 0 250px !important;
    width: 250px !important;
    min-width: 250px !important;
    max-width: 250px !important;
}

/* šipky jen pokud JS zjistí, že je kam scrollovat */
.trainingArrow {
    display: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 52px;
    border: none;
    background: transparent;
    color: white !important;
    font-size: 48px;
    line-height: 48px;
    cursor: pointer;
    z-index: 5;
}

.trainingWeekArea.hasTrainingScroll .trainingArrow {
    display: block;
}

.trainingArrowLeft {
    left: -34px;
}

.trainingArrowRight {
    right: -34px;
}

.trainingArrow:hover {
    color: #9ee01b;
}

/* desktop: až když se vejde všech 6 dní, roztáhnout přes celou šířku */
@media (min-width: 1651px) {
    .trainingWeekArea {
        padding: 0;
    }

    .trainingWeekScroller {
        overflow: hidden;
        padding: 0;
        cursor: default;
        contain: none;
    }

    .trainingWeekGrid {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        gap: 16px;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .trainingWeekDay {
        flex: none !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .trainingArrow {
        display: none !important;
    }
}

/* konec training section */

.homeGallerySection {
    background: #ffffff;
    overflow-x: hidden;
}

.homeGalleryStrip {
    display: grid;
    gap: 0;
    margin-bottom: 20px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.homeGallerySection,
.homeGallerySection * {
    box-sizing: border-box;
}

.galleryThumb {
    width: 100%;
    height: 150px;
    overflow: hidden;
    display: block;
}

    .galleryThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .35s ease;
    }

.galleryThumb:hover img {
    transform: scale(1.08);
}

    /* desktop: zobrazit max 10 */
    .galleryThumb:nth-child(n+11) {
        display: none;
    }

/* 4 + 4 */
@media (max-width: 1300px) {
    .homeGalleryStrip {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .galleryThumb:nth-child(n+9) {
        display: none;
    }
}

/* 3 + 3 */
@media (max-width: 850px) {
    .homeGalleryStrip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .galleryThumb:nth-child(n+7) {
        display: none;
    }
}

/* 2 + 2 */
@media (max-width: 520px) {
    .homeGalleryStrip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .galleryThumb:nth-child(n+5) {
        display: none;
    }

    .galleryThumb {
        height: 135px;
    }
}

/* css sekce pro Přidej se k nám */

.homeJoinSectionV2 {
    min-height: 470px;
    color: white;
    background: linear-gradient(90deg, rgba(3,24,58,.90) 0%, rgba(3,24,58,.75) 38%, rgba(3,24,58,.35) 90%), url('../Images/nabor/ke_kramu.jpg');
    background-size: cover;
    background-position: center;
    overflow: hidden;
    position: relative;
}
    
.joinV2Wrap {
    position: relative;
    z-index: 2;
    min-height: 470px;
    padding-top: 34px;
    padding-bottom: 24px;
}

.joinV2Text {
    width: 40%;
    position: relative;
    z-index: 4;
}

.joinV2Text h2 {
    font-family: 'Luckiest Guy', 'Impact', 'Arial Black', sans-serif;
    letter-spacing: 2px;
    font-size: 58px;
    line-height: 60px;
    margin: 0;
    color: white;
    font-weight: 900;
    font-style: italic;
    letter-spacing: 1px;
    text-shadow: 0 5px 16px rgba(0,0,0,.35);
}

.joinV2Text h2 span {
    color: #9ee01b;
}

.joinBenefit {
    margin-bottom: 12px;
    padding-left: 54px;
    position: relative;
}

.joinV2Benefits {
    margin-top: 18px;
}

.joinV2Benefits div {
    margin-bottom: 10px;
    padding-left: 54px;
    position: relative;
}

.joinBenefitIcon {
    position: absolute;
    left: 0px;
    top: -2px;
    width: 38px;
    height: 38px;
    border: 2px solid #9ee01b;
    border-radius: 50%;
    color: #9ee01b !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 26px !important;
}

.joinV2Benefits b {
    display: block;
    color: #9ee01b;
    font-size: 16px;
    font-weight: 300;
    font-family: 'Luckiest Guy', 'Impact', 'Arial Black', sans-serif;
}

.joinV2Benefits span {
    color: white;
    font-size: 15px;
    margin-top: 3px;
}

.joinV2Claim,
.joinV2Ribbon {
    position: relative;
    overflow: visible;
}

.joinV2Claim:before,
.joinV2Ribbon:before {
    content: "";
    position: absolute;
    left: -18px;
    right: -18px;
    top: -6px;
    bottom: -6px;
    background: inherit;
    z-index: -1;
    transform: skewX(-8deg) rotate(-1deg);
    filter: blur(.2px);
}

.joinV2Claim:after,
.joinV2Ribbon:after {
    content: "";
    position: absolute;
    left: -28px;
    right: -26px;
    bottom: -8px;
    height: 14px;
    background: inherit;
    z-index: -2;
    transform: skewX(18deg) rotate(1deg);
    opacity: .75;
}

.joinV2Ribbon {
    background: #9ee01b;
    color: #073069;
    font-family: 'Luckiest Guy', 'Impact', 'Arial Black', sans-serif;
    letter-spacing: 2px;
    font-weight: 300;
    font-style: italic;
    box-shadow: 0 8px 20px rgba(0,0,0,.28);
    position: absolute;
    left: 70%;
    top: 200px;
    z-index: 8;
    margin-top: 0;
    padding: 14px 14px;
    font-size: 21px;
    transform: rotate(6deg);
    width: 400px;
    text-align: center;
}

.joinV2Claim {
    background: white;
    color: #073069;
    font-family: 'Luckiest Guy', 'Impact', 'Arial Black', sans-serif;
    font-weight:300;
    font-style: italic;
    font-size: 19px;
    line-height: 25px;
    box-shadow: 0 8px 18px rgba(0,0,0,.25);
    text-align: center;
    position: absolute;
    left: 60%;
    top: 80px;
    z-index: 8;
    margin-top: 0;
    padding: 14px 14px;
    width: 350px;
    transform: rotate(-6deg);
}

.joinV2Posters {
    position: absolute;
    right: 6%;
    top: 55px;
    width: 720px;
    height: 360px;
    z-index: 5;
}

.joinV2Poster {
    position: absolute;
    display: block;
    width: 185px;
    height: 270px;
    background: white;
    box-shadow: 0 18px 40px rgba(0,0,0,.48);
    transition: all .25s ease;
}

    .joinV2Poster img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .joinV2Poster:hover {
        transform: translateY(-10px) scale(1.05) !important;
        z-index: 20;
    }

.joinPosterA {
    left: 85px;
    top: 60px;
    transform: rotate(-8deg);
    z-index: 2;
}

.joinPosterB {
    left: 265px;
    top: 0px;
    transform: rotate(2deg);
    z-index: 4;
}

.joinPosterC {
    left: 435px;
    top: 60px;
    transform: rotate(8deg);
    z-index: 3;
}

.joinV2Bottom {
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: 35px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    z-index: 6;
}

.joinV2Bottom div {
    color: white;
    font-size: 15px;
}

    .joinV2Bottom b {
        display: block;
        color: #9ee01b;
        font-size: 16px;
        font-weight: 300;
        font-family: 'Luckiest Guy', 'Impact', 'Arial Black', sans-serif;
    }

.joinV2Bottom span {
    display: block;
    margin-top: 4px;
}

.joinLightbox {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    background: rgba(0,0,0,.82);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    box-sizing: border-box;
}

.joinLightbox img {
    max-width: 92%;
    max-height: 92%;
    box-shadow: 0 18px 45px rgba(0,0,0,.55);
}

.joinLightboxClose {
    position: fixed;
    right: 32px;
    top: 18px;
    color: white;
    font-size: 44px;
    cursor: pointer;
    z-index: 100000;
}

/* =========================================================
   RESPONSIVE - PŘIDEJ SE K NÁM
   ========================================================= */

/* tablet / menší desktop */
@media (max-width: 1599px) and (min-width: 850px) {
    .homeJoinSectionV2 {
        min-height: 0;
    }

    .joinV2Wrap {
        min-height: 0;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 34px;
        padding-top: 38px;
        padding-bottom: 34px;
    }

    .joinV2Text {
        width: auto;
    }

        .joinV2Text h2 {
            font-size: 48px;
            line-height: 50px;
        }

    .joinV2Claim,
    .joinV2Ribbon {
        position: relative;
        left: auto;
        top: auto;
        width: auto;
        margin-top: 22px;
        transform: rotate(-2deg);
    }

    .joinV2Ribbon {
        transform: rotate(2deg);
        font-size: 18px;
    }

    .joinV2Posters {
        position: relative;
        right: auto;
        top: auto;
        width: 100%;
        height: 350px;
        align-self: center;
    }

    .joinV2Poster {
        width: 165px;
        height: 242px;
    }

    .joinPosterA {
        left: 4%;
        top: 75px;
    }

    .joinPosterB {
        left: 31%;
        top: 28px;
    }

    .joinPosterC {
        left: 58%;
        top: 75px;
    }

    .joinV2Bottom {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        grid-column: 1 / -1;
        margin-top: 10px;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 18px;
    }
}

/* mobil */
@media (max-width: 849px) {
    .homeJoinSectionV2 {
        min-height: 0;
        background: linear-gradient(180deg, rgba(3,24,58,.94) 0%, rgba(3,24,58,.82) 58%, rgba(3,24,58,.70) 100%), url('../Images/nabor/ke_kramu.jpg');
        background-size: cover;
        background-position: center;
    }

    .joinV2Wrap {
        min-height: 0;
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .joinV2Text {
        width: 100%;
    }

        .joinV2Text h2 {
            font-size: 42px;
            line-height: 44px;
        }

    .joinV2Claim {
        position: relative;
        left: auto;
        top: auto;
        width: auto;
        margin-top: 18px;
        font-size: 17px;
        line-height: 23px;
        transform: rotate(-2deg);
    }

    .joinV2Benefits {
        margin-top: 26px;
    }

        .joinBenefit,
        .joinV2Benefits div {
            padding-left: 46px;
        }

    .joinBenefitIcon {
        width: 34px;
        height: 34px;
        font-size: 22px !important;
    }

    .joinV2Benefits b {
        font-size: 14px;
    }

    .joinV2Benefits span {
        font-size: 14px;
    }

    .joinV2Ribbon {
        position: relative;
        left: auto;
        top: auto;
        width: auto;
        margin-top: 22px;
        font-size: 17px;
        line-height: 23px;
        transform: rotate(2deg);
    }

    /* plakáty jako řádek pod textem */
    .joinV2Posters {
        position: relative;
        right: auto;
        top: auto;
        width: 100%;
        height: 260px;
        margin-top: 28px;
        overflow: hidden;
        padding: 0;
    }

        .joinV2Posters::-webkit-scrollbar {
            display: none;
        }

    .joinV2Poster {
        position: absolute;
        width: 145px;
        height: 212px;
        flex: none;
    }

    .joinPosterA,
    .joinPosterB,
    .joinPosterC {
        left: auto;
        top: auto;
    }

    .joinPosterA {
        left: calc(50% - 185px);
        top: 26px;
        transform: rotate(-7deg);
        z-index: 2;
    }

    .joinPosterB {
        left: calc(50% - 72px);
        top: 8px;
        transform: rotate(2deg);
        z-index: 4;
    }

    .joinPosterC {
        left: calc(50% + 40px);
        top: 26px;
        transform: rotate(7deg);
        z-index: 3;
    }

    .joinV2Bottom {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin-top: 8px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 14px;
    }

        .joinV2Bottom div,
        .joinV2Bottom span {
            font-size: 13px;
        }

        .joinV2Bottom b {
            font-size: 14px;
        }
}

/* úzký mobil */
@media (max-width: 430px) {
    .joinV2Text h2 {
        font-size: 36px;
        line-height: 38px;
    }

    .joinV2Posters {
        height: 232px;
    }

    .joinV2Poster {
        width: 128px;
        height: 188px;
    }

    .joinPosterA {
        left: calc(50% - 160px);
    }

    .joinPosterB {
        left: calc(50% - 64px);
    }

    .joinPosterC {
        left: calc(50% + 32px);
    }

    .joinV2Bottom {
        grid-template-columns: 1fr;
    }
}

/* konec stylu pro Přidej se k nám */

.noEventsBox {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 150px;
    padding: 22px 26px;
    background: linear-gradient(135deg, rgba(94,164,67,.14), rgba(7,48,105,.08));
    border-left: 5px solid #5ea443;
    box-shadow: 0 8px 18px rgba(0,0,0,.10);
}

.noEventsIcon {
    font-size: 48px;
}

.noEventsBox h3 {
    margin: 0 0 6px 0;
    color: #073069;
    font-size: 24px;
}

.noEventsBox p {
    margin: 0 0 6px 0;
    font-weight: bold;
}

.noEventsBox span {
    color: #555;
    font-size: 13px;
}

.homeSponsorsSection {
    background: #ffffff;
}

.sponsorGrid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 18px;
    margin-top: 40px;
}

.sponsorItem {
    align-content: center;
    text-align:center;
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .45s ease, transform .45s ease, box-shadow .25s ease;
}

.sponsorGrid.sponsorsVisible .sponsorItem {
    opacity: 1;
    transform: translateY(0);
}

.sponsorGrid.sponsorsVisible .sponsorItem:nth-child(1) {
    transition-delay: .10s;
}

.sponsorGrid.sponsorsVisible .sponsorItem:nth-child(2) {
    transition-delay: .20s;
}

.sponsorGrid.sponsorsVisible .sponsorItem:nth-child(3) {
    transition-delay: .30s;
}

.sponsorGrid.sponsorsVisible .sponsorItem:nth-child(4) {
    transition-delay: .40s;
}

.sponsorGrid.sponsorsVisible .sponsorItem:nth-child(5) {
    transition-delay: .50s;
}

.sponsorGrid.sponsorsVisible .sponsorItem:nth-child(6) {
    transition-delay: .60s;
}

.sponsorGrid.sponsorsVisible .sponsorItem:nth-child(7) {
    transition-delay: .70s;
}

.sponsorGrid.sponsorsVisible .sponsorItem:nth-child(8) {
    transition-delay: .80s;
}

.sponsorItem img {
    max-width: 92%;
    max-height: 82%;
    object-fit: contain;
    opacity: .72;
    filter: saturate(.70) contrast(.88) brightness(1.08);
    transition: all .25s;
}

.sponsorItem:hover img{

    opacity:1;

    filter:
        saturate(1)
        contrast(1)
        brightness(1);

    transform:scale(1.06);
}

@media (max-width:1400px) {

    .sponsorGrid {
        grid-template-columns: repeat(6,1fr);
    }
}

@media (max-width:1000px) {

    .sponsorGrid {
        grid-template-columns: repeat(4,1fr);
        margin-top: 30px;
    }
}

@media (max-width:700px) {

    .sponsorGrid {
        grid-template-columns: repeat(2,1fr);
        margin-top: 20px;
    }
}

.homeDocumentsSection {
    background: #062653;
    color: white;
}

    .homeDocumentsSection h2 {
        color: white;
        font-family: Tahoma;
        font-size: 26px;
    }

.documentGrid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.documentSectionsGrid {
    display: grid;
    grid-template-columns: repeat(var(--documentColumns, 4), 1fr);
    gap: 22px;
}

.documentColumn {
    min-width: 0;
}

.documentColumnTitle {
    color: white;
    font-size: 18px;
    margin: 0 0 14px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid #5ea443;
    text-transform: uppercase;
}

.documentColumn .documentCard {
    margin-bottom: 12px;
}

.documentCard {
    display: flex;
    gap: 14px;
    align-items: center;
    min-height: 82px;
    background: white;
    color: #073069 !important;
    text-decoration: none !important;
    padding: 16px;
    box-sizing: border-box;
    border-left: 5px solid #5ea443;
    box-shadow: 0 8px 18px rgba(0,0,0,.22);
    transition: all .25s ease;
}

    .documentCard:hover {
        transform: translateY(-4px);
        box-shadow: 0 14px 28px rgba(0,0,0,.32);
        text-decoration: none !important;
    }

.documentIcon {
    font-size: 30px;
    min-width: 34px;
    text-align: center;
}

.documentCard strong {
    display: block;
    font-size: 15px;
    line-height: 19px;
}

@media (max-width: 1000px) {
    .documentSectionsGrid,
    .documentGrid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 650px) {
    .documentSectionsGrid,
    .documentGrid {
        grid-template-columns: 1fr;
    }
}

.homeStatsSection {
    background: #ffffff;
    padding: 1.5% 10%;
}

.homeStatsWrap {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 24px;
    align-items: center;
}

.homeStatItem {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    min-height: 78px;
}

.homeStatIcon {
    width: 56px; /* pevná šířka pro všechny ikony */
    flex: 0 0 56px;

    color: #5ea443;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    flex-shrink: 0;
}

.homeStatValue {
    font-size: 30px;
    font-weight: 900;
    color: #073069;
    line-height: 1;
}

.homeStatText {
    margin-top: 5px;
    font-size: 11px;
    font-weight: bold;
    color: #555;
    letter-spacing: .6px;
    text-transform: uppercase;
}

/* RESPONSIVE - DATA O KLUBU */

.homeStatsSection {
    box-sizing: border-box;
}

    .homeStatsSection,
    .homeStatsSection * {
        box-sizing: border-box;
    }

.homeStatsWrap {
    max-width: 100%;
}

/* menší PC / tablet */
@media (max-width: 1200px) {
    .homeStatsSection {
        padding-left: 6%;
        padding-right: 6%;
        padding: 3% 10%;
    }

    .homeStatsWrap {
        grid-template-columns: repeat(3, 1fr);
        gap: 22px 18px;
    }
}

/* mobil / tablet na výšku */
@media (max-width: 760px) {
    .homeStatsSection {
        padding: 4% 10%;
    }

    .homeStatsWrap {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px 14px;
    }

    .homeStatItem {
        min-height: 70px;
        gap: 10px;
    }

    .homeStatIcon {
        font-size: 34px;
    }

    .homeStatValue {
        font-size: 26px;
    }

    .homeStatText {
        font-size: 10px;
    }
}

/* úzký mobil */
@media (max-width: 420px) {
    .homeStatsWrap {
        grid-template-columns: 1fr;
    }

    .homeStatItem {
        justify-content: flex-start;
        max-width: 230px;
        width: 100%;
        margin: 0 auto;
    }
}

.homeNewsSection 
{
    background: #062653;
    color: white;
}

    .homeNewsSection h2 {
        color: white;
    }

.homeNewsSection
.homeNewsSection * {
    box-sizing: border-box;
}

.homeNewsWrap {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 34px;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
}

/* při menší šířce: hlavní zpráva nahoře, timeline pod ní */
@media (max-width: 991px) {
    .homeNewsWrap {
        display: grid;
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .featuredNewsCard {
        width: 100%;
        min-height: 280px;
    }

    .newsTimelineArea,
    .newsTimelineScroller {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
}

/* hlavní aktualita */

.featuredNewsCard {
    position: relative;
    min-height: 330px;
    color: white !important;
    text-decoration: none !important;
    background-size: cover;
    background-position: center;
    border: 1px solid rgba(255,255,255,.35);
    box-shadow: 0 10px 26px rgba(0,0,0,.32);
    overflow: hidden;
    transition: all .25s ease;
    display: flex;
    flex-direction: column;
    clip-path: polygon( 0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px) );
}

.featuredNewsCard:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 34px rgba(0,0,0,.45);
}

.featuredTag {
    position: absolute;
    left: 0;
    top: 0;
    background: #5ea443;
    color: white;
    font-weight: bold;
    font-size: 12px;
    padding: 9px 16px;
    z-index: 2;
}

.featuredContent {
    position: absolute;
    left: 24px;
    right: 24px;
    top: 60px;
    bottom: 24px;
    display: flex;
    flex-direction: column;
}

    .featuredContent h3 {
        margin: 0 0 10px 0;
        color: white;
        font-size: 25px;
        line-height: 30px;
    }

.featuredMeta {
    color: rgba(255,255,255,.78);
    font-size: 13px;
    margin-bottom: 14px;
}

.featuredContent p {
    color: white;
    font-size: 14px;
    line-height: 21px;
    margin: 0 0 18px 0;
    margin-bottom: 18px;
}

.featuredBtn {
    display: inline-block;
    border: 1px solid white;
    padding: 9px 16px;
    color: white;
    font-weight: bold;
    font-size: 12px;
    margin-top: auto;
    align-self: flex-start;
}

/* timeline */

.newsTimelineArea {
    position: relative;
    min-width: 0;
}

.newsTimelineScroller {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    padding: 12px 10px 18px 10px;
    cursor: grab;
}

.newsTimelineScroller.dragging {
    cursor: grabbing;
}

.newsTimelineScroller::-webkit-scrollbar {
    height: 0;
}

.newsTimelineTrack {
    position: relative;
    display: flex;
    gap: 18px;
    min-width: max-content;
    padding-top: 52px;
}

.newsTimelineTrack:before {
    content: "";
    position: absolute;
    left: 58px;
    right: 58px;
    top: 34px;
    height: 3px;
    background: rgba(255,255,255,.75);
}

.newsTimelineCard {
    position: relative;
    width: 158px;
    color: #073069 !important;
    text-decoration: none !important;
    transition: all .25s ease;
}

.newsTimelineCard:hover {
    transform: translateY(-6px);
    text-decoration: none !important;
}

.newsTimelineDate {
    position: absolute;
    top: -48px;
    left: 0;
    right: 0;
    text-align: center;
    color: white;
    font-weight: bold;
    font-size: 13px;
}

.newsTimelinePoint {
    position: absolute;
    top: -25px;
    left: 50%;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    border-radius: 50%;
    background: #5ea443;
    border: 3px solid white;
    box-sizing: border-box;
    z-index: 2;
}

.newsTimelineBox {
    background: white;
    min-height: 220px;
    box-shadow: 0 8px 20px rgba(0,0,0,.28);
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
}

    /* lehce zkosené rohy */
    .newsTimelineBox:before {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        border-top: 12px solid #062653;
        border-left: 12px solid transparent;
        z-index: 3;
    }

    .newsTimelineBox:after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        border-bottom: 12px solid #062653;
        border-right: 12px solid transparent;
        z-index: 3;
    }

.newsTimelineBox .newsTimelineTint {
    position: absolute;
    inset: 0;
    background: linear-gradient( 180deg, var(--newsColor, #5EA443) 0%, color-mix(in srgb, var(--newsColor, #5EA443) 40%, transparent) 35%, transparent 100% );
    opacity: .3;
    pointer-events: none;
    z-index: 0;
}

.newsTimelineCategory {
    padding: 12px 10px 4px 10px;
    color: #777;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
}

.newsTimelineTitle {
    padding: 0 10px 10px 10px;
    color: #073069;
    font-size: 14px;
    line-height: 18px;
    font-weight: bold;
    min-height: 58px;
}

.newsTimelinePhoto {
    height: 92px;
    background: #e8e8e8;
    margin-top: auto;
}

.newsTimelinePhoto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.newsTimelineCategory,
.newsTimelineTitle,
.newsTimelineAuthor,
.newsTimelinePhoto {
    position: relative;
    z-index: 2;
}

.newsTimelineAuthor {
    margin-top: auto;
    padding: 0 10px 6px 10px;
    color: #555;
    font-size: 11px;
    font-style: italic;
}

/* šipky */

.newsArrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 52px;
    border: none;
    background: transparent;
    color: white;
    font-size: 48px;
    line-height: 48px;
    cursor: pointer;
    z-index: 5;
}

.newsArrowLeft {
    left: -34px;
}

.newsArrowRight {
    right: -34px;
}

.newsArrow:hover {
    color: #9ee01b;
}

.newsBtn {
    border-color: white !important;
    color: white !important;
}

.newsBtn:hover {
    background: white !important;
    color: #073069 !important;
}

.footerModern {
    background: #062653;
    padding: 0;
    position: relative;
}

    /* zelená linka nahoře */
    .footerModern:before {
        content: "";
        display: block;
        height: 4px;
        background: #69b342;
    }

/* fotbalová lajna */
.footerPitchLine {
    position: relative;
    height: 40px;
}

    .footerPitchLine:before {
        content: "";
        position: absolute;
        left: 8%;
        right: 8%;
        top: 50%;
        height: 2px;
        background: rgba(255,255,255,.20);
    }

.footerBall {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    background: #062653;
    color: white;
    font-size: 24px;
}

/* obsah */
.footerContent {
    max-width: 1200px;
    margin: 0 auto;
    padding: 10px 5% 20px 5%;
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 30px;
}

.footerBlock {
    text-align: center;
    min-width: 220px;
}

.footerTitle {
    color: white;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 12px;
}

.footerText {
    color: rgba(255,255,255,.85);
    line-height: 24px;
}

/* social */
.footerSocials {
    display: flex;
    justify-content: center;
    gap: 12px;
}

    .footerSocials a {
        transition: all .25s ease;
    }

        .footerSocials a:hover {
            transform: translateY(-3px);
        }

    .footerSocials img {
        width: 42px;
        height: 42px;
    }

/* copyright */
.footerCopyright {
    text-align: center;
    padding: 12px 0 18px 0;
    color: rgba(255,255,255,.55);
    font-size: 12px;
    border-top: 1px solid rgba(255,255,255,.08);
}

/* sekce tak šel čas */

.homeHistorySection {
    background: #ffffff;
    color: #073069;
}

    .homeHistorySection h2 {
        color: #073069;
    }

.historyBox {
    margin-top: 28px;
    background: #ffffff;
    position: relative;
    overflow: hidden;
}

.historyTimeline {
    position: relative;
    display: flex;
    justify-content: space-between;
    margin: 12px 0 34px 0;
    padding: 0 34px;
}

    .historyTimeline:before {
        content: "";
        position: absolute;
        left: 72px;
        right: 72px;
        top: 47px;
        height: 3px;
        background: #2f5597;
    }

.historyNode {
    position: relative;
    z-index: 3;
    width: 76px;
    height: 62px;
    border: none;
    background: transparent;
    cursor: pointer;
    color: white;
    padding: 0;
}

    .historyNode.active span {
        color: #5ea443;
        transform: scale(1.28);
    }

    .historyNode span {
        display: block;
        font-weight: 900;
        font-size: 20px;
        transition: all .35s ease;
        color: #073069;
    }

    .historyNode i {
        display: block;
        width: 18px;
        height: 18px;
        margin: 12px auto 0 auto;
        border-radius: 50%;
        background: #5ea443;
        border: 3px solid white;
        box-sizing: border-box;
        box-shadow: 0 0 0 2px rgba(255,255,255,.35);
        transition: all .35s ease;
        color: #073069;
    }

    .historyNode.active i {
        transform: scale(1.55);
    }

.historyBall {
    position: absolute;
    left: 0;
    top: 29px;
    z-index: 8;
    font-size: 24px;
    width: 28px;
    height: 28px;
    text-align: center;
    line-height: 28px;
    transition: left 5s linear;
    pointer-events: none;
}

    .historyBall.bounce {
        animation: historyBallBounce .45s ease;
    }

@keyframes historyBallBounce {
    0% {
        transform: translateY(0) rotate(0deg);
    }

    45% {
        transform: translateY(-8px) rotate(18deg);
    }

    100% {
        transform: translateY(0) rotate(0deg);
    }
}

.historySlides {
    position: relative;
    background: linear-gradient(90deg, rgba(6,38,83,.98) 0%, rgba(6,38,83,.92) 45%, rgba(6,38,83,.68) 100%), url('../Images/ke_kramu.jpg');
    background-size: cover;
    background-position: right center;
    padding: 28px;
    box-sizing: border-box;
    box-shadow: 0 14px 34px rgba(0,0,0,.18);
    overflow: hidden;
    height: 315px;
    min-height: 315px;
}

.historySlide {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 34px;
    align-items: stretch;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    left: 28px;
    right: 28px;
    top: 28px;
    bottom: 28px;
    transition: opacity .9s ease, visibility .9s ease;
}

    .historySlide.active {
        opacity: 1;
        visibility: visible;
        position: absolute;
    }

.historyPhoto {
    display: inline-block;
    width: fit-content;
    height: fit-content;
    max-width: 360px;
    padding: 10px;
    background: rgba(255,255,255,.08);
    overflow: hidden;
    clip-path: polygon( 0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px) );
}

    .historyPhoto img {
        display: block;
        width: auto;
        height: auto;
        width: 100%;
        max-width: 340px;
        max-height: 240px;
        object-fit: initial;
        filter: grayscale(100%);
        transition: filter 1s ease;
    }

.historyText {
    background: linear-gradient(135deg, rgba(255,255,255,.13), rgba(255,255,255,.04));
    padding: 34px 38px;
    color: white;
    box-sizing: border-box;
    height: 100%;
    position: relative;
    overflow: hidden;
    clip-path: polygon( 0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px) );
}

    .historyText:before {
        content: "";
        position: absolute;
        left: 0;
        top: -20px;
        width: 7px;
        height: calc(100% + 40px);
        background: #5ea443;
        transform: skewY(-18deg);
        transform-origin: top left;
    }

    .historyText span,
    .historyText h3,
    .historyText p {
        position: relative;
        z-index: 2;
    }

    .historyText span {
        display: inline-block;
        color: #9ee01b;
        font-weight: 900;
        margin-bottom: 8px;
        font-size: 15px;
    }

    .historyText h3 {
        margin: 0 0 16px 0;
        color: white;
        font-size: 30px;
        line-height: 35px;
    }

    .historyText p {
        margin: 0;
        color: rgba(255,255,255,.92);
        font-size: 17px;
        line-height: 28px;
    }

/* RESPONSIVE - TAK ŠEL ČAS */

/* tablet / menší šířka, ale stále vedle sebe */
@media (max-width: 1100px) {
    .historySlides {
        height: 300px;
        min-height: 300px;
        padding: 22px;
    }

    .historySlide {
        grid-template-columns: 300px 1fr;
        gap: 24px;
        left: 22px;
        right: 22px;
        top: 22px;
        bottom: 22px;
    }

    .historyPhoto {
        width: 300px;
        height: 256px;
        align-self: center;
    }

        .historyPhoto img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            background: rgba(255,255,255,.08);
        }

    .historyText {
        height: 256px;
        padding: 24px 28px;
    }

        .historyText h3 {
            font-size: 24px;
            line-height: 29px;
        }

        .historyText p {
            font-size: 15px;
            line-height: 24px;
        }
}

/* menší tablet - pořád stejný princip, jen menší pevný box */
@media (max-width: 850px) {

    .historySlides {
        height: auto;
        min-height: 0;
    }

    .historySlide,
    .historySlide.active {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        display: none;
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .historyPhoto {
        margin: 0 auto;
    }
}

/* až když se fotka + text nevejdou, dát pod sebe */
@media (max-width: 700px) {
    .historySlides {
        height: auto;
        min-height: 0;
        padding: 16px;
    }

    .historySlide,
    .historySlide.active {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        display: none;
        grid-template-columns: 1fr;
        gap: 16px;
    }

        .historySlide.active {
            display: grid;
            opacity: 1;
            visibility: visible;
        }

    .historyPhoto {
        width: 100%;
        max-width: 300px;
        height: 220px;
        justify-self: center;
    }

        .historyPhoto img {
            object-fit: contain;
        }

    .historyText {
        width: 100%;
        height: auto;
        padding: 22px 22px 22px 26px;
    }

    .historyBall {
        width: 18px;
        height: 18px;
    }
}

@media (max-width: 520px) {
    .historySlides {
        padding: 12px;
    }

    .historyPhoto {
        max-width: 300px;
        width: 100%;
        padding: 8px;
    }

        .historyPhoto img {
            width: 100%;
            max-width: 300px;
            height: auto;
        }

    .historyText {
        padding: 20px 18px 20px 22px;
    }

    .historyTimeline {
        padding: 0;
    }

    .historyNode {
        width: 34px;
    }

        .historyNode span {
            font-size: 11px;
        }

        .historyNode.active span {
            transform: none;
            font-size: 15px;
        }

    .historyTimeline:before {
        left: 14px;
        right: 14px;
    }
}

/* konec css čast tak šel čas */

.homeEventsArea {
    position: relative;
    min-width: 0;
}

.eventsScroller {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    padding: 12px 8px 18px 8px;
    cursor: grab;
}

    .eventsScroller.dragging {
        cursor: grabbing;
    }

    .eventsScroller::-webkit-scrollbar {
        height: 0;
    }

.eventsTrack {
    position: relative;
    display: flex;
    gap: 18px;
    min-width: max-content;
    padding-top: 52px;
}

    .eventsTrack:before {
        content: "";
        position: absolute;
        left: 58px;
        right: 58px;
        top: 34px;
        height: 3px;
        background: #073069;
    }

.eventMiniItem {
    position: relative;
    width: 180px;
    color: #073069 !important;
    text-decoration: none !important;
    transition: all .25s ease;
}

    .eventMiniItem:hover {
        transform: translateY(-6px);
        text-decoration: none !important;
    }

.eventTimelineLabel {
    position: absolute;
    top: -48px;
    left: 0;
    right: 0;
    text-align: center;
    color: #073069;
    font-weight: bold;
    font-size: 13px;
}

.eventTimelinePoint {
    position: absolute;
    top: -25px;
    left: 50%;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    border-radius: 50%;
    background: #5ea443;
    border: 3px solid white;
    box-shadow: 0 0 0 2px #073069;
    box-sizing: border-box;
    z-index: 2;
}

.eventCard {
    height: stretch; /* případně 200px */
    display: flex;
    flex-direction: column;
    position: relative;
    min-height: 185px;
    background: white;
    box-shadow: 0 8px 20px rgba(0,0,0,.16);
    border-left: 4px solid var(--eventColor, #5ea443);
    padding: 16px;
    box-sizing: border-box;
    overflow: hidden;
}

.eventCardTint {
    position: absolute;
    inset: 0;
    background: linear-gradient( to bottom, var(--eventColor, transparent) 0%, rgba(255,255,255,0) 58% );
    opacity: .16;
    pointer-events: none;
    z-index: 0;
}

.eventCardIcon,
.eventCardContent {
    position: relative;
    z-index: 2;
}

.eventCardIcon {
    position: absolute;
    right: 12px;
    top: 12px;
    font-size: 20px;
    opacity: .75;
}

.eventCardIcon .eventCardLogo {
    display: block;
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.eventCardType {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 12px;
    padding-right: 28px;
    font-family: Arial, sans-serif;
}

.eventCardCategory {
    font-weight: bold;
    margin-bottom: 8px;
}

.eventCardTime,
.eventCardDescription {
    font-size: 13px;
    line-height: 18px;
    color: #333;
}

.eventCardDescription {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.eventsArrow {
    position: absolute;
    top: 135px;
    width: 34px;
    height: 52px;
    border: none;
    background: transparent;
    color: #073069;
    font-size: 48px;
    line-height: 48px;
    cursor: pointer;
    z-index: 5;
}

.eventsArrowLeft {
    left: -46px !important;
}

.eventsArrowRight {
    right: -46px;
}

.eventsArrow:hover {
    color: #5ea443;
}

/* === FIX: ŽIVOT V KLUBU + NEJBLIŽŠÍ AKCE === */

.homeClubLife,
.homeClubLife * {
    box-sizing: border-box;
}

.homeClubLife {
    overflow-x: hidden;
}

    /* základní desktop */
    .homeClubLife .homeContentWrap {
        display: flex;
        align-items: stretch;
        gap: 34px;
        width: 100%;
        max-width: 100%;
    }

.clubLifeLeft {
    width: 35%;
    min-width: 0;
}

.clubLifeRight {
    width: 65%;
    min-width: 0;
    margin-left: 2%;
}

.lifeGrid,
.eventMiniTimeline {
    flex: 1 1 auto;
}

.sectionButton {
    margin-top: auto;
    padding-top: 26px;
}

/* viditelné okno akcí */
.homeClubLife .homeEventsArea,
.homeClubLife .eventMiniTimeline,
.homeClubLife .eventsScroller {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.homeClubLife .eventsScroller {
    position: relative;
    background-image: linear-gradient(#073069, #073069) !important;
    background-repeat: no-repeat !important;
    background-size: 100% 4px !important;
    background-position: left 46px !important;
}

/* track už čáru nedělá */
.homeClubLife .eventsTrack:before {
    display: none;
}

/* track se neposouvá šířkou všech karet mimo obrazovku */
.homeClubLife .eventsTrack {
    position: relative;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 72px) / 5);
    gap: 18px;
    width: 100%;
    min-width: 0;
    padding-top: 52px;
    z-index: 1;
}

/* karta vyplní svůj vypočtený sloupec */
.homeClubLife .eventMiniItem {
    width: 100%;
    min-width: 0;
    max-width: none;
}

/* šipky uvnitř */
.homeClubLife .eventsArrowLeft {
    left: -36px;
}

.homeClubLife .eventsArrowRight {
    right: -36px;
}

/* když jsou sekce ještě vedle sebe, ubíráme karty podle reálné šířky */
@media (max-width: 1550px) {
    .homeClubLife .eventsTrack {
        grid-auto-columns: calc((100% - 54px) / 4);
    }

    .lifeGrid {
        grid-column-gap: 15%;
    }
}

@media (max-width: 1250px) {
    .homeClubLife .eventsTrack {
        grid-auto-columns: calc((100% - 36px) / 3);
    }

    .clubLifeRight {
        margin-left: 3%;
    }

    .lifeGrid {
        grid-column-gap: 10%;
    }
}

/* tady už sekce pod sebe */
@media (max-width: 991px) {
    .homeClubLife .homeContentWrap {
        display: block;
        padding: 5% 10%;
    }

    .homeContentWrap {
        padding: 5% 10%;
    }

    .clubLifeLeft,
    .clubLifeRight {
        width: 100%;
        max-width: 100%;
    }

    .clubLifeLeft {
        margin-bottom: 24px;
    }

    .clubLifeRight {
        margin-left: 0;
    }

    .lifeGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-row-gap: 15%;
        grid-column-gap: 10%;
    }

    .homeClubLife .eventsTrack {
        grid-auto-columns: calc((100% - 36px) / 3);
    }

    .sectionButton {
        margin-top: 0px;
    }

    .eventsArrowLeft {
        left: -26px;
    }

    .eventsArrowRight {
        right: -26px;
    }
}

@media (max-width: 700px) {
    .homeClubLife .eventsTrack {
        grid-auto-columns: calc((100% - 14px) / 2);
        gap: 14px;
    }

    .homeClubLife .homeContentWrap {
        display: block;
        padding: 8% 10%;
    }

    .homeContentWrap {
        padding: 8% 10%;
    }
}

@media (max-width: 480px) {
    .homeClubLife .homeContentWrap {
        padding-left: 14px;
        padding-right: 14px;
    }

    .homeClubLife .eventsTrack {
        grid-auto-columns: 100%;
    }

    .lifeItem span {
        display: none;
    }

    .eventsArrow {
        display: none;
    }

    .homeClubLife .homeContentWrap {
        display: block;
        padding: 10% 10%;
    }

    .homeContentWrap {
        padding: 10% 10%;
    }
}

/* style pro novou Category page */

/* =========================================================
   CATEGORY PAGE - 01 BASE
   ========================================================= */

.categoryPage {
    font-family: Tahoma, Arial, sans-serif;
    background: #f3f4f6;
    color: #002558;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
}

    .categoryPage * {
        box-sizing: border-box;
    }

.categoryContentWrap,
.categoryHeroInner {
    width: min(1500px, calc(100vw - 40px));
    max-width: calc(100vw - 40px);
    margin: 0 auto;
}

.categoryCard {
    background: #fff;
    border: 1px solid #dfe4ea;
    box-shadow: 0 8px 24px rgba(0,0,0,.06);
    border-radius: 4px;
    padding: 24px;
    box-sizing: border-box;
}

    .categoryCard h2,
    .categorySectionHeader h2 {
        margin: 0 0 18px 0;
        font-size: 24px;
        font-weight: 800;
        color: #002558;
    }

.categorySectionHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 18px;
}


/* =========================================================
   CATEGORY PAGE - 02 HERO
   ========================================================= */

.categoryHero {
    --heroCutTop: 54%; /* rozhraní nahoře */
    --heroCutSkew: 36px; /* posun rozhraní doleva směrem dolů */
    --heroBoltWidth: 66px; /* šířka blesku */

    --heroGrassLeft: .80; /* tmavost vlevo - menší = víc trávy */
    --heroGrassMid: .42; /* tmavost uprostřed */
    --heroGrassEnd: .15; /* tmavost u rozhraní */

    position: relative;
    height: 350px;
    min-height: 350px;
    background-color: #002558;
    background-image: linear-gradient(90deg, rgba(0,18,45,var(--heroGrassLeft)) 0%, rgba(0,24,58,var(--heroGrassMid)) 34%, rgba(0,37,88,var(--heroGrassEnd)) 54%, rgba(0,37,88,0) 66%), url("../Images/podklad_trava.jpg");
    background-size: cover;
    background-position: center center;
    color: white;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    border-top: 3px solid rgba(255,255,255,.55);
}

    .categoryHero:before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( 90deg, rgba(0,10,30,.44) 0%, rgba(0,20,50,.28) 28%, rgba(0,37,88,.10) 46%, rgba(0,37,88,0) 58% );
        z-index: 2;
        pointer-events: none;
    }

    .categoryHero:after {
        content: "";
        position: absolute;
        top: -30px;
        bottom: -30px;
        left: calc(var(--heroCutTop) - var(--heroCutSkew) - 28px);
        width: calc(var(--heroCutSkew) + var(--heroBoltWidth) + 36px);
        background: linear-gradient(180deg, #002558 0%, #fff 90%);
        clip-path: polygon( calc(var(--heroCutSkew) + 22px) 0, calc(var(--heroCutSkew) + var(--heroBoltWidth)) 0, calc(var(--heroCutSkew) + 22px) 44%, calc(var(--heroCutSkew) + 48px) 44%, 16px 100%, 42px 57%, 18px 57% );
        z-index: 5;
        filter: drop-shadow(8px 0 0 rgba(0,37,88,.95));
    }

.categoryHeroPhoto {
    position: absolute;
    top: 0;
    right: 0;
    left: calc(var(--heroCutTop) - var(--heroCutSkew));
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 1;
    clip-path: polygon( var(--heroCutSkew) 0, 100% 0, 100% 100%, 0 100% );
}

    .categoryHeroPhoto:after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, rgba(0,37,88,.55) 0%, rgba(0,37,88,.22) 24%, rgba(0,37,88,0) 52%);
    }

.categoryHeroInner {
    position: relative;
    z-index: 6;
    padding: 70px 0 104px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 40px;
}

.categoryHeroTitleRow {
    display: flex;
    align-items: center;
    gap: 22px;
}

.categoryHeroLogo {
    width: 118px;
    height: 118px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,.35));
}

.categoryHeroTextBlock {
    min-width: 0;
}

.categoryHero h1 {
    margin: 0;
    font-size: 44px;
    line-height: 1.05;
    font-weight: 800;
    color: white;
}

.categoryMotto {
    color: #91cf45;
    font-size: 22px;
    margin-top: 14px;
    font-weight: 500;
}

.categoryStats {
    display: flex;
    flex-wrap: wrap;
    gap: 36px;
    margin-top: 32px;
}

.categoryStat {
    display: flex;
    align-items: center;
    gap: 10px;
    color: white;
    font-size: 16px;
    font-weight: 700;
}

.categoryStatIcon {
    color: #91cf45;
    font-size: 25px;
}

.categoryHeroQuickLinks {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 900px;
    max-width: calc(100vw - 40px);
    transform: translateX(-50%);
    z-index: 8;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.categoryHeroQuickLink {
    height: 52px;
    background: #002558;
    border: 1px solid rgba(255,255,255,.85);
    border-bottom: none;
    color: white;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

    .categoryHeroQuickLink:hover {
        background: #5ea443;
        color: #ffed00;
        text-decoration: none;
    }

.categoryHeroQuickIcon img {
    max-width: 42px;
    max-height: 34px;
    display: block;
}

.categoryHeroQuickText {
    color: inherit;
    font-size: 17px;
    font-family: Tahoma;
    font-weight: 700;
}

/* =========================================================
   CATEGORY PAGE - 03 INFO + PAYMENTS
   ========================================================= */

.categoryTopSection {
    padding: 30px 0;
    background: #fff;
    overflow: hidden;
}

.categoryInfoGrid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 26px;
    align-items: stretch;
}

.categoryImportantCard,
.categoryPaymentCard {
    min-width: 0;
    width: 100%;
    min-height: 100%;
}

.categoryImportantList {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 26px;
}

.categoryInfoItem {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding: 14px 0;
    border-bottom: 1px solid #eef1f4;
    min-width: 0;
}

.categoryInfoIcon {
    width: 42px;
    height: 42px;
    border: 1px solid #dfe4ea;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
    border-radius: 4px;
    color: #002558;
    background: #f8fafc;
}

.categoryInfoText {
    min-width: 0;
}

    .categoryInfoText strong {
        display: block;
        font-size: 15px;
        color: #002558;
    }

    .categoryInfoText span,
    .categoryInfoText small {
        display: block;
        font-size: 13px;
        color: #2b2b2b;
        line-height: 1.4;
    }

.paymentTotalBox {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    gap: 16px;
    background: linear-gradient(135deg, #002558 0%, #123b78 100%);
    color: white;
    padding: 18px 20px;
    border-radius: 4px;
    margin-bottom: 18px;
}

    .paymentTotalBox span {
        display: block;
        font-size: 13px;
        opacity: .85;
        text-align: left;
    }

    .paymentTotalBox strong {
        display: block;
        font-size: 30px;
        margin-top: 0;
        color: white;
        text-align: right;
        white-space: nowrap;
        justify-self: end;
    }

.paymentRow {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) auto auto;
    gap: 12px;
    align-items: center;
    border-bottom: 1px solid #e3e6eb;
    padding: 13px 0;
    font-size: 14px;
}

    .paymentRow span {
        color: #002558;
        font-weight: 700;
        white-space: nowrap;
    }

    .paymentRow strong {
        color: #111;
        white-space: nowrap;
        font-size: 15px;
        text-align: right;
    }

    .paymentRow em {
        color: #666;
        font-style: normal;
        font-size: 11px;
        white-space: nowrap;
        text-align: right;
    }

.paymentBankBox {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    background: #e8ecf2;
    margin-top: 18px;
    padding: 15px 16px;
    color: #002558;
    font-weight: 700;
    border-left: 5px solid #5ea443;
}

    .paymentBankBox strong {
        font-size: 19px;
        text-align: right;
    }

.paymentNote {
    margin-top: 14px;
    font-size: 13px;
    color: #333;
    line-height: 1.45;
}

/* Tablet a menší notebook: karty pod sebe, informace stále 2 vedle sebe */
@media (max-width: 1199px) {
    .categoryInfoGrid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .categoryImportantList {
        grid-template-columns: 1fr 1fr;
    }
}

/* Mobil: karty pod sebe, informace stále 2 vedle sebe */
@media (max-width: 767px) {
    .categoryTopSection {
        padding: 18px 0;
    }

    .categoryInfoGrid {
        grid-template-columns: 1fr !important;
        gap: 18px;
    }

    .categoryImportantList {
        grid-template-columns: 1fr 1fr !important;
        gap: 0 18px;
    }

    .paymentTotalBox {
        grid-template-columns: 1fr auto !important;
    }

    .paymentBankBox {
        grid-template-columns: 1fr auto !important;
    }

    .paymentRow {
        grid-template-columns: minmax(135px, 1fr) auto auto !important;
        gap: 10px;
    }

        .paymentRow span {
            white-space: nowrap;
        }

        .paymentRow strong,
        .paymentRow em {
            text-align: right;
            white-space: nowrap;
        }
}

/* Jen opravdu úzké mobily */
@media (max-width: 360px) {
    .categoryImportantList {
        grid-template-columns: 1fr !important;
    }

    .paymentRow {
        grid-template-columns: 1fr !important;
        gap: 3px;
    }

        .paymentRow strong,
        .paymentRow em {
            text-align: left;
        }

    .paymentTotalBox,
    .paymentBankBox {
        grid-template-columns: 1fr !important;
    }

        .paymentTotalBox strong,
        .paymentBankBox strong {
            justify-self: start;
            text-align: left;
        }
}

.paymentQrBox {
    margin-top: 14px;
    padding: 14px;
    border: 1px dashed rgba(0,37,88,.24);
    border-radius: 10px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

    .paymentQrBox span {
        color: #002558;
        font-size: 13px;
        font-weight: 900;
        text-transform: uppercase;
    }

.paymentQrImage {
    width: 116px;
    max-width: 34vw;
    height: auto;
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid #dfe6ef;
    padding: 6px;
}

@media (max-width: 767px) {
    .paymentQrBox {
        align-items: flex-start;
        flex-direction: column;
    }

    .paymentQrImage {
        width: 150px;
        max-width: 100%;
    }
}

/* ===== CATEGORY - PAYMENT CARD WITH QR ===== */

.paymentTopLayout {
    display: flex;
    gap: 24px;
    align-items: stretch;
    margin-bottom: 18px;
}

.paymentMainColumn {
    flex: 1 1 auto;
    min-width: 0;
}

.paymentQrAside {
    flex: 0 0 220px;
    display: flex;
    align-items: stretch;
    justify-content: center;
}

.paymentQrCard {
    width: 220px;
    min-height: 220px;
    background: #f8fafc;
    border: 1px solid #d7dfeb;
    border-radius: 18px;
    box-shadow: 0 8px 24px rgba(6, 38, 83, 0.08);
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.paymentQrImage {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
    margin-bottom: 10px;
}

.paymentQrCaption {
    font-size: 14px;
    font-weight: 700;
    color: #062653;
    text-align: center;
}

.paymentBankBox {
    margin-top: 8px;
}

.paymentRow {
    display: grid;
    grid-template-columns: 1.4fr auto auto;
    gap: 14px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid #dfe5ee;
}

    .paymentRow span {
        color: #062653;
        font-weight: 700;
    }

    .paymentRow strong {
        color: #062653;
        font-size: 18px;
        font-weight: 800;
        white-space: nowrap;
    }

    .paymentRow em {
        color: #6d7788;
        font-style: normal;
        font-size: 13px;
        white-space: nowrap;
    }

@media (max-width: 991px) {
    .paymentTopLayout {
        flex-direction: column;
    }

    .paymentQrAside {
        flex: 0 0 auto;
        justify-content: flex-start;
    }

    .paymentQrCard {
        width: 220px;
    }
}

@media (max-width: 640px) {
    .paymentRow {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .paymentQrCard {
        width: 100%;
        max-width: 260px;
    }
}

/* ===== CATEGORY - QR platba: dřívější zalomení a centrování ===== */

/* Dříve zalomit QR pod řádky příspěvků.
   Hodnotu 1400px můžeš případně snížit/zvýšit podle pocitu. */
@media (max-width: 1400px) {
    .categoryPaymentCard .paymentTopLayout {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 18px !important;
    }

    .categoryPaymentCard .paymentMainColumn {
        width: 100% !important;
    }

    .categoryPaymentCard .paymentQrAside {
        width: 100% !important;
        flex: 0 0 auto !important;
        justify-content: center !important;
        align-items: center !important;
    }

    .categoryPaymentCard .paymentQrCard {
        width: 260px !important;
        min-height: 220px !important;
        margin: 4px auto 0 auto !important;
    }

    .categoryPaymentCard .paymentQrImage {
        max-width: 190px !important;
        max-height: 160px !important;
    }
}

/* Menší displeje – QR hezky doprostřed a nepřetékat */
@media (max-width: 767px) {
    .categoryPaymentCard .paymentQrAside {
        justify-content: center !important;
    }

    .categoryPaymentCard .paymentQrCard {
        width: min(100%, 260px) !important;
        min-height: 220px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* =========================================================
   CATEGORY PAGE - 04 NEWS OVERRIDE
   ========================================================= */

.categoryNewsSection {
    margin-top: 0;
}

.categoryNewsEmpty {
    position: relative;
    width: 100%;
    min-height: 260px;
    background-image: linear-gradient(90deg, rgba(3,24,58,.94) 0%, rgba(3,24,58,.76) 46%, rgba(3,24,58,.22) 100%), url("../Images/ke_kramu.jpg");
    background-size: cover;
    background-position: center;
    border: 1px solid rgba(255,255,255,.25);
    overflow: hidden;
    box-sizing: border-box;
}

.categoryNewsEmptyFull {
    min-height: 300px;
    margin-top: 22px;
}

.categoryNewsEmptySide {
    min-width: 640px;
    height: 300px;
}

.categoryNewsEmptyInner {
    height: 100%;
    min-height: inherit;
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 34px 42px;
    box-sizing: border-box;
}

.categoryNewsEmptyLogo {
    width: 108px;
    height: 108px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 5px 12px rgba(0,0,0,.35));
}

.categoryNewsEmptyText span {
    display: inline-block;
    color: #91cf45;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    margin-bottom: 8px;
}

.categoryNewsEmptyText h3 {
    margin: 0;
    color: white;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.15;
}

.categoryNewsEmptyText p {
    margin: 12px 0 0;
    color: rgba(255,255,255,.88);
    font-size: 15px;
    line-height: 1.45;
    max-width: 520px;
}

.categoryTimelineAreaEmpty .newsArrow {
    display: none;
}

.categoryTimelineAreaEmpty .newsTimelineScroller {
    overflow: hidden;
}

@media (max-width: 767px) {
    .categoryNewsEmptyFull,
    .categoryNewsEmptySide {
        min-width: 0;
        min-height: 260px;
        height: auto;
    }

    .categoryNewsEmptyInner {
        padding: 28px 22px;
        gap: 16px;
    }

    .categoryNewsEmptyLogo {
        width: 76px;
        height: 76px;
    }

    .categoryNewsEmptyText h3 {
        font-size: 21px;
    }

    .categoryNewsEmptyText p {
        font-size: 13px;
    }
}

/* =========================================================
   CATEGORY PAGE - 05 TEAM
   ========================================================= */

.categoryTeamSection {
    background: #fff;
    padding: 32px 0 36px;
}

.categorySectionHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 18px;
}

.categoryPlayerFilters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.playerYearBtn {
    border: 1px solid #dfe4ea;
    background: white;
    color: #002558;
    height: 32px;
    padding: 0 16px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

    .playerYearBtn:hover,
    .playerYearBtn.active {
        background: #002558;
        color: white;
    }

.categoryTeamGrid {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.categoryTeamCoaches,
.categoryTeamPlayers {
    min-width: 0;
}

.categoryTeamCoaches {
    width: max-content;
    max-width: 610px;
}

    .categoryTeamCoaches h3 {
        margin: 0 0 14px;
        color: #002558;
        font-size: 19px;
        font-weight: 800;
    }

.teamCoachGrid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 180px;
    gap: 14px;
    width: max-content;
}

.teamCoachCard {
    border: 1px solid #e3e6eb;
    background: #fafafa;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 4px;
    min-height: 250px;
}

    .teamCoachCard img {
        width: 100%;
        height: 132px;
        object-fit: cover;
        object-position: center top;
        display: block;
        border-radius: 3px;
        margin-bottom: 10px;
    }

    .teamCoachCard strong {
        display: block;
        font-size: 15px;
        color: #002558;
        line-height: 1.2;
        margin-bottom: 3px;
    }

    .teamCoachCard span {
        display: block;
        font-size: 12px;
        color: #5ea443;
        font-weight: 700;
        margin-top: 3px;
    }

    .teamCoachCard small {
        display: block;
        font-size: 12px;
        color: #333;
        margin-top: 3px;
        line-height: 1.3;
        overflow-wrap: anywhere;
    }

.categoryTeamPlayers {
    position: relative;
    overflow: hidden;
    min-height: 326px;
}

.categoryPlayersViewport {
    overflow-x: auto;
    overflow-y: hidden;
    cursor: grab;
    user-select: none;
    padding: 8px 46px 18px;
    scroll-behavior: smooth;
}

    .categoryPlayersViewport.dragging {
        cursor: grabbing;
    }

.categoryPlayersGridTrack {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(3, 92px);
    grid-auto-columns: 118px;
    gap: 14px 18px;
    width: max-content;
    min-height: 304px;
}

.categoryPlayerCard {
    text-align: center;
    color: #002558;
}

    .categoryPlayerCard img {
        width: 54px;
        height: 54px;
        object-fit: contain;
        display: block;
        margin: 0 auto 6px;
    }

    .categoryPlayerCard strong {
        display: block;
        font-size: 13px;
        color: #002558;
        line-height: 1.15;
    }

    .categoryPlayerCard span {
        display: block;
        font-size: 12px;
        color: #555;
        margin-top: 1px;
    }

.playersArrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 48px;
    border: none;
    background: white;
    color: #002558;
    font-size: 34px;
    cursor: pointer;
    z-index: 5;
    box-shadow: 0 4px 14px rgba(0,0,0,.12);
}

.playersArrowLeft {
    left: 8px;
}

.playersArrowRight {
    right: 8px;
}

@media (max-width: 1199px) {
    .categoryTeamGrid {
        display: block !important;
        grid-template-columns: none !important;
    }

    .categoryTeamCoaches,
    .categoryTeamPlayers {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    .categoryTeamPlayers {
        margin-top: 18px;
        min-height: 318px;
        overflow: hidden;
    }

    .teamCoachGrid {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
        grid-auto-flow: row !important;
        grid-auto-columns: auto !important;
        gap: 14px;
        width: 100% !important;
    }

    .teamCoachCard {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 350px;
    }

        .teamCoachCard img {
            height: 300px;
            object-position: center top;
        }

    .categoryPlayersViewport {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto;
        overflow-y: hidden;
        box-sizing: border-box;
    }

    .categoryPlayersGridTrack {
        grid-template-rows: repeat(3, 90px);
        grid-auto-columns: 108px;
        min-height: 292px;
    }
}

@media (max-width: 520px) {
    .teamCoachGrid {
        grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)) !important;
        gap: 12px;
    }

    .teamCoachCard {
        min-height: 210px;
        padding: 9px;
    }

        .teamCoachCard img {
            height: 112px;
        }

        .teamCoachCard strong {
            font-size: 14px;
        }

        .teamCoachCard span,
        .teamCoachCard small {
            font-size: 11px;
        }

    .categoryPlayersGridTrack {
        grid-template-rows: repeat(3, 86px);
        grid-auto-columns: 96px;
        gap: 13px 14px;
        min-height: 282px;
    }

    .categoryPlayerCard img {
        width: 50px;
        height: 50px;
    }

    .categoryPlayerCard strong {
        font-size: 12px;
    }

    .categoryPlayerCard span {
        font-size: 11px;
    }
}

@media (max-width: 380px) {
    .teamCoachGrid {
        grid-template-columns: 1fr !important;
    }
}

/* menší počet hráčů: plníme řádky zleva doprava */
.playersModeFew {
    min-height: 210px;
}

    .playersModeFew .categoryPlayersViewport {
        overflow-x: hidden;
        padding: 8px 34px 14px;
    }

    .playersModeFew .categoryPlayersGridTrack {
        display: grid;
        grid-auto-flow: row;
        grid-template-rows: none;
        grid-auto-columns: initial;
        grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
        gap: 16px 18px;
        width: 100%;
        min-height: 0;
        justify-items: center;
    }

    .playersModeFew .playersArrow {
        display: none;
    }


/* střední počet hráčů: také řádkově, většinou 2–3 řady */
.playersModeMedium {
    min-height: 300px;
}

    .playersModeMedium .categoryPlayersViewport {
        overflow-x: hidden;
        padding: 8px 34px 16px;
    }

    .playersModeMedium .categoryPlayersGridTrack {
        display: grid;
        grid-auto-flow: row;
        grid-template-rows: none;
        grid-auto-columns: initial;
        grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
        gap: 16px 18px;
        width: 100%;
        min-height: 0;
        justify-items: center;
    }

    .playersModeMedium .playersArrow {
        display: none;
    }


/* velký počet hráčů: ponechat horizontální posun ve 3 řadách */
.playersModeMany .categoryPlayersGridTrack {
    grid-auto-flow: column;
    grid-template-rows: repeat(3, 92px);
    grid-auto-columns: 118px;
}


/* na menším mobilu vždy max 3 řady a posun do strany */
@media (max-width: 520px) {
    .playersModeFew,
    .playersModeMedium {
        min-height: 314px;
    }

        .playersModeFew .categoryPlayersViewport,
        .playersModeMedium .categoryPlayersViewport {
            overflow-x: auto;
            padding-left: 38px;
            padding-right: 38px;
        }

        .playersModeFew .categoryPlayersGridTrack,
        .playersModeMedium .categoryPlayersGridTrack {
            grid-auto-flow: column;
            grid-template-rows: repeat(3, 88px);
            grid-auto-columns: 98px;
            gap: 13px 14px;
            width: max-content;
            min-height: 292px;
        }

        .playersModeFew .playersArrow,
        .playersModeMedium .playersArrow {
            display: block;
        }
}

/* =========================================================
   CATEGORY PAGE - 06 MATCHES + TRAININGS
   ========================================================= */

.categoryBottomSection {
    padding: 44px 0 58px;
    background: linear-gradient(135deg, rgba(0,20,50,.98) 0%, rgba(0,37,88,.96) 55%, rgba(0,28,65,.98) 100%);
    color: white;
}

.categoryBottomGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 26px;
}

.categoryBottomSection .categoryCard {
    background: rgba(255,255,255,.97);
    border: 1px solid rgba(255,255,255,.22);
    box-shadow: 0 14px 34px rgba(0,0,0,.18);
}

    .categoryBottomSection .categoryCard h2 {
        color: #002558;
        font-size: 24px;
        line-height: 1.1;
    }

.categoryEventRow {
    display: grid;
    grid-template-columns: 72px 70px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    min-height: 42px;
    border-bottom: 1px solid #dfe4ea;
    font-size: 13px;
    color: #002558;
}

    .categoryEventRow span {
        color: #002558;
        white-space: nowrap;
    }

    .categoryEventRow strong {
        color: #002558;
        min-width: 0;
        line-height: 1.2;
    }

.categoryEventTeams {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    width: fit-content;
    max-width: 100%;
    margin-left: 6px;
}

.categoryEventTeam {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.categoryEventTeamHome {
    justify-content: flex-start;
}

.categoryEventTeamAway {
    justify-content: flex-start;
}

.categoryEventLogo {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    padding: 2px;
    object-fit: contain;
    background: #fff;
    border: 1px solid #d8e0e9;
    border-radius: 50%;
}

.categoryEventRow .categoryEventTeamName {
    min-width: 0;
    white-space: normal;
}

.categoryEventSeparator {
    color: #7990aa !important;
    font-weight: 800;
}

    .categoryEventRow em {
        font-style: normal;
        font-size: 11px;
        font-weight: 800;
        border-radius: 12px;
        padding: 4px 9px;
        white-space: nowrap;
    }

.eventStateFuture {
    background: #dff3cf;
    color: #3d7a23;
}

.eventStateDone {
    background: #e8ecf2;
    color: #002558;
}

.categoryCardLink {
    display: inline-block;
    margin-top: 16px;
    color: #002558;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

    .categoryCardLink:hover {
        color: #5ea443;
        text-decoration: none;
    }

.categoryEventEmpty {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    min-height: 118px;
    margin-top: 10px;
    padding: 18px;
    background: linear-gradient(135deg, rgba(0,37,88,.08) 0%, rgba(94,164,67,.10) 100%);
    border: 1px dashed rgba(0,37,88,.28);
    border-radius: 4px;
    color: #002558;
}

.categoryEventEmptyIcon {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: #002558;
    color: #91cf45;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 800;
}

.categoryEventEmpty strong {
    display: block;
    font-size: 16px;
    color: #002558;
    margin-bottom: 5px;
}

.categoryEventEmpty span {
    display: block;
    font-size: 13px;
    color: #333;
    line-height: 1.4;
}

/* pod cca 1000px pod sebe */
@media (max-width: 1000px) {
    .categoryBottomGrid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .categoryBottomSection {
        padding: 34px 0 44px;
    }
}

@media (max-width: 767px) {
    .categoryBottomSection {
        padding: 26px 0 34px;
    }

        .categoryBottomSection .categoryCard h2 {
            font-size: 22px;
        }

    .categoryEventRow {
        grid-template-columns: 54px 52px minmax(0, 1fr);
        gap: 8px;
        font-size: 12px;
        padding: 7px 0;
    }

    .categoryEventLogo {
        flex-basis: 28px;
        width: 28px;
        height: 28px;
    }

    .categoryEventTeams {
        grid-column: 1 / -1;
        grid-row: 2;
        gap: 6px;
        width: auto;
        margin-left: 0;
        margin-top: 3px;
    }

    .categoryEventTeam {
        gap: 5px;
    }

        .categoryEventRow em {
            grid-column: 3;
            grid-row: 1;
            justify-self: end;
            width: fit-content;
            margin-top: 0;
        }

    .categoryEventEmpty {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 12px;
        padding: 15px;
    }

    .categoryEventEmptyIcon {
        width: 38px;
        height: 38px;
        font-size: 18px;
    }

    .categoryEventEmpty strong {
        font-size: 14px;
    }

    .categoryEventEmpty span {
        font-size: 12px;
    }
}

/* =========================================================
   CATEGORY PAGE - 10 COUNTERS
   ========================================================= */

.categoryCountersSection {
    background: #fff;
    padding: 34px 0;
    border-bottom: 4px solid #5ea443;
}

.categoryCountersGrid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
    align-items: center;
}

.categoryCounterItem {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
}

.categoryCounterIcon {
    font-size: 36px;
    line-height: 1;
}

.categoryCounterText strong {
    display: block;
    color: #002558;
    font-size: 30px;
    font-weight: 800;
    line-height: 1;
}

.categoryCounterText span {
    display: block;
    color: #002558;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .03em;
    margin-top: 6px;
}

@media (max-width: 1000px) {
    .categoryCountersGrid {
        grid-template-columns: repeat(2, 1fr);
        gap: 26px 20px;
    }
}

@media (max-width: 520px) {
    .categoryCountersGrid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .categoryCounterItem {
        justify-content: flex-start;
        padding-left: 18px;
    }
}

/* =========================================================
   CATEGORY PAGE - 07 RESPONSIVE TABLET
   ========================================================= */

@media (max-width: 1199px) {
    .categoryHero {
        min-height: 250px;
    }

        .categoryHero h1 {
            font-size: 34px;
        }


    .categoryCard {
        padding: 20px;
    }

    .categoryTeamGrid {
        grid-template-columns: 34% 66%;
        gap: 18px;
    }

    .categoryPlayersGridTrack {
        grid-template-rows: repeat(3, 124px);
        grid-auto-columns: 116px;
        gap: 16px 18px;
    }
}


/* =========================================================
   CATEGORY PAGE - 08 RESPONSIVE MOBILE
   ========================================================= */

/* TABLET HERO FOTO - do 1000px ještě koláž */
@media (max-width: 1540px) and (min-width: 1200px) {
    .categoryHeroInner {
        left: 5%;
    }
}

@media (max-width: 1199px) {
    .categoryHeroQuickLinks {
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100%;
        transform: none;
    }

    .categoryHeroQuickLink {
        height: 60px;
    }
}

@media (max-width: 950px) {
    .categoryHeroInner {
        margin-top: 0px;
    }

    .categoryHeroLogo {
        width: 98px;
        height: 98px;
    }

    .categoryHero h1 {
        font-size: 32px;
    }

    .categoryMotto {
        font-size: 16px;
    }

    .categoryStat {
        font-size: 12px;
    }

    .categoryStatIcon {
        font-size: 23px;
    }
}

@media (max-width: 767px) {
    .categoryHero {
        min-height: 350px;
        height: 350px;
        background-image: none;
        background-color: #002558;
        --heroCutTop: 0;
        --heroCutSkew: 0;
        --heroBoltWidth: 0;
    }

        .categoryHero:after {
            display: none;
        }

        .categoryHero:before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient( 135deg, rgba(0,18,45,.98) 0%, rgba(0,24,58,.92) 30%, rgba(0,37,88,.62) 48%, rgba(0,37,88,.18) 66%, rgba(0,37,88,0) 82% );
            z-index: 2;
            pointer-events: none;
        }

    .categoryHeroPhoto {
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 100%;
        clip-path: none;
        background-size: cover;
        background-position: center right;
        background-repeat: no-repeat;
        z-index: 1;
    }

        .categoryHeroPhoto:after {
            display: none;
        }

    .categoryHeroInner {
        position: relative;
        z-index: 6;
        padding: 48px 12px 72px;
        justify-content: flex-start;
        margin-top: 12px
    }

    .categoryHeroTitleRow {
        gap: 0;
        align-items: center;
    }

    .categoryHeroLogo {
        display: none;
    }

    .categoryHero h1 {
        font-size: 32px;
        line-height: 1.05;
    }

    .categoryMotto {
        font-size: 17px;
        margin-top: 8px;
        max-width: 310px;
    }

    .categoryStats {
        margin-left: 0;
        margin-top: 22px;
        flex-direction: column;
        gap: 9px;
    }

    .categoryStat {
        font-size: 13px;
        gap: 8px;
    }

    .categoryStatIcon {
        font-size: 21px;
    }

    .categoryHeroQuickLinks {
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        max-width: 100%;
        transform: none;
        grid-template-columns: repeat(3, 1fr);
    }

    .categoryHeroQuickLink {
        height: 58px;
        gap: 7px;
        padding: 0 5px;
    }

    .categoryHeroQuickIcon img {
        max-width: 28px;
        max-height: 24px;
    }

    .categoryHeroQuickText {
        font-size: 13px;
    }
}

/* =========================================================
   CATEGORY PAGE - 11 INTERNÍ KARTA HRÁČE
   ========================================================= */

.categoryPlayerCardCanOpen {
    border-radius: 7px;
    cursor: pointer;
    transition: transform .16s ease, background-color .16s ease, box-shadow .16s ease;
}

    .categoryPlayerCardCanOpen:hover {
        background: #f3f8ed;
        box-shadow: 0 5px 14px rgba(0, 37, 88, .12);
        transform: translateY(-2px);
    }

    .categoryPlayerCardCanOpen:focus-visible {
        outline: 3px solid #5ea443;
        outline-offset: 3px;
    }

body.categoryPlayerModalOpen {
    overflow: hidden !important;
}

.categoryPlayerModal {
    position: fixed;
    inset: 0;
    z-index: 300000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    box-sizing: border-box;
    font-family: Tahoma, Arial, sans-serif;
}

    .categoryPlayerModal.isOpen {
        display: flex;
    }

.categoryPlayerModalOverlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 18, 45, .78);
    backdrop-filter: blur(2px);
}

.categoryPlayerModalDialog {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: 560px;
    max-width: calc(100vw - 36px);
    max-height: calc(100vh - 36px);
    overflow: hidden;
    background: #f4f6f9;
    border-radius: 12px;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .38);
}

.categoryPlayerModalHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 70px;
    padding: 12px 14px 12px 20px;
    box-sizing: border-box;
    background: #002558;
    color: #fff;
}

    .categoryPlayerModalHeader > div {
        min-width: 0;
    }

    .categoryPlayerModalHeader span {
        display: block;
        margin-bottom: 3px;
        color: #a8d96d;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: .08em;
    }

    .categoryPlayerModalHeader strong {
        display: block;
        font-size: 20px;
        line-height: 1.15;
    }

.categoryPlayerModalClose {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    margin-left: 14px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 7px;
    background: transparent;
    color: #fff;
    font-size: 30px;
    line-height: 36px;
    cursor: pointer;
}

    .categoryPlayerModalClose:hover,
    .categoryPlayerModalClose:focus-visible {
        background: rgba(255, 255, 255, .12);
        outline: none;
    }

.categoryPlayerModalBody {
    min-height: 0;
    overflow-y: auto;
    padding: 18px;
    box-sizing: border-box;
    overscroll-behavior: contain;
}

.categoryPlayerDetail[hidden] {
    display: none !important;
}

.categoryPlayerDetailIntro {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    padding: 16px;
    background: #fff;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
}

    .categoryPlayerDetailIntro img {
        width: 92px;
        height: 92px;
        object-fit: contain;
        display: block;
    }

    .categoryPlayerDetailIntro span {
        display: block;
        margin-bottom: 4px;
        color: #5ea443;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: .08em;
    }

    .categoryPlayerDetailIntro h3 {
        margin: 0;
        color: #002558;
        font-size: 24px;
        line-height: 1.12;
    }

    .categoryPlayerDetailIntro small {
        display: block;
        margin-top: 6px;
        color: #657386;
        font-size: 12px;
        font-weight: 700;
    }

.categoryPlayerFacts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.categoryPlayerFact {
    padding: 12px 14px;
    background: #fff;
    border: 1px solid #dfe5ec;
    border-radius: 8px;
}

    .categoryPlayerFact span {
        display: block;
        color: #68778a;
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
    }

    .categoryPlayerFact strong {
        display: block;
        margin-top: 4px;
        color: #002558;
        font-size: 15px;
        overflow-wrap: anywhere;
    }

.categoryPlayerContacts {
    margin-top: 18px;
}

    .categoryPlayerContacts h4 {
        margin: 0 0 10px;
        color: #002558;
        font-size: 16px;
        font-weight: 900;
        text-transform: uppercase;
    }

.categoryPlayerContactCard {
    margin-top: 10px;
    padding: 14px;
    background: #fff;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
}

.categoryPlayerContactHeading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

    .categoryPlayerContactHeading strong {
        color: #002558;
        font-size: 16px;
        line-height: 1.2;
    }

    .categoryPlayerContactHeading span {
        color: #5ea443;
        font-size: 11px;
        font-weight: 900;
        text-align: right;
    }

.categoryPlayerContactAction {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    min-height: 54px;
    margin-top: 8px;
    padding: 8px 10px;
    box-sizing: border-box;
    border: 1px solid #d9e1e9;
    border-radius: 7px;
    color: #002558 !important;
    text-decoration: none !important;
}

    .categoryPlayerContactAction:hover {
        border-color: #5ea443;
        background: #f5faef;
    }

    .categoryPlayerContactAction > span:nth-child(2) {
        min-width: 0;
    }

    .categoryPlayerContactAction small,
    .categoryPlayerContactAction strong {
        display: block;
    }

    .categoryPlayerContactAction small {
        color: #6d7887;
        font-size: 10px;
        font-weight: 700;
    }

    .categoryPlayerContactAction strong {
        margin-top: 2px;
        color: #002558;
        font-size: 14px;
        line-height: 1.25;
        overflow-wrap: anywhere;
    }

    .categoryPlayerContactAction b {
        color: #4f9238;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: .04em;
    }

.categoryPlayerContactIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #edf5e5;
    color: #4f9238;
    font-size: 17px;
}

.categoryPlayerContactEmpty,
.categoryPlayerContactMissing {
    padding: 14px;
    border: 1px dashed #c9d4df;
    border-radius: 7px;
    color: #68778a;
    font-size: 12px;
    line-height: 1.4;
}

.categoryPlayerContactMissing {
    margin-top: 8px;
}

@media (max-width: 600px) {
    .categoryPlayerModal {
        padding: 8px;
        align-items: center;
    }

    .categoryPlayerModalDialog {
        width: 100%;
        max-width: none;
        max-height: calc(100vh - 16px);
        border-radius: 10px;
    }

    .categoryPlayerModalHeader {
        min-height: 62px;
        padding: 10px 10px 10px 15px;
    }

        .categoryPlayerModalHeader strong {
            font-size: 18px;
        }

    .categoryPlayerModalClose {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
        margin-left: 8px;
    }

    .categoryPlayerModalBody {
        padding: 12px;
    }

    .categoryPlayerDetailIntro {
        grid-template-columns: 76px minmax(0, 1fr);
        gap: 12px;
        padding: 12px;
    }

        .categoryPlayerDetailIntro img {
            width: 76px;
            height: 76px;
        }

        .categoryPlayerDetailIntro h3 {
            font-size: 20px;
        }

    .categoryPlayerFacts {
        gap: 8px;
        margin-top: 8px;
    }

    .categoryPlayerFact {
        padding: 10px;
    }

    .categoryPlayerContacts {
        margin-top: 14px;
    }

    .categoryPlayerContactCard {
        padding: 11px;
    }

    .categoryPlayerContactHeading {
        display: block;
    }

        .categoryPlayerContactHeading span {
            display: block;
            margin-top: 3px;
            text-align: left;
        }

    .categoryPlayerContactAction {
        grid-template-columns: 34px minmax(0, 1fr) auto;
        padding: 8px;
    }
}

/* konec stylu pro category page */

/* začátek stylu pro trenéry */

/* =========================================================
   COACHES PAGE - 01 BASE
   ========================================================= */

.coachesPage {
    font-family: Tahoma, Arial, sans-serif;
    background: #f4f6f9;
    color: #002558;
    overflow-x: hidden;
}

    .coachesPage * {
        box-sizing: border-box;
    }

.coachesContentWrap {
    width: 1680px;
    max-width: calc(100vw - 48px);
    margin: 0 auto;
}


/* =========================================================
   COACHES PAGE - 02 HERO
   ========================================================= */

.coachesHeroClub {
    min-height: 315px;
    position: relative;
    overflow: hidden;
    color: white;
    border-top: 3px solid #91cf45;
    border-bottom: 3px solid #91cf45;
    background-image: linear-gradient(90deg, rgba(0,18,45,.96) 0%, rgba(0,37,88,.78) 36%, rgba(0,37,88,.28) 68%, rgba(0,37,88,.04) 100%), var(--coachesHeroDesktop);
    background-size: cover;
    background-position: center center;
}

    .coachesHeroClub:before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 42% 50%, rgba(145,207,69,.13) 0%, rgba(145,207,69,0) 34%), linear-gradient(90deg, rgba(0,18,45,.82) 0%, rgba(0,37,88,.38) 52%, rgba(0,37,88,0) 100%);
        z-index: 1;
        pointer-events: none;
    }

.coachesHeroInner {
    width: 1680px;
    max-width: calc(100vw - 48px);
    min-height: 315px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    left: 3%;
}

.coachesHeroBrand {
    display: flex;
    align-items: center;
    gap: 30px;
    max-width: 760px;
}

.coachesHeroLogo {
    width: 170px;
    height: 170px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,.32));
}

.coachesHeroText h1 {
    margin: 0;
    color: white;
    font-size: 48px;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-shadow: 0 4px 14px rgba(0,0,0,.35);
}

.coachesHeroLine {
    width: 230px;
    height: 3px;
    background: #91cf45;
    margin: 18px 0 14px;
}

.coachesHeroText p {
    margin: 0;
    max-width: 520px;
    color: rgba(255,255,255,.95);
    font-size: 18px;
    line-height: 1.45;
    font-weight: 500;
    text-shadow: 0 2px 10px rgba(0,0,0,.34);
}


/* tablet */
@media (max-width: 1199px) {
    .coachesHeroClub {
        min-height: 280px;
    }

    .coachesHeroInner {
        min-height: 280px;
        max-width: calc(100vw - 32px);
    }

    .coachesHeroRightVisual {
        width: 58%;
        opacity: .75;
    }

        .coachesHeroRightVisual:after {
            right: 20px;
            width: 250px;
            height: 250px;
            opacity: .14;
        }

    .coachesHeroLogo {
        width: 135px;
        height: 135px;
    }

    .coachesHeroBrand {
        gap: 22px;
    }

    .coachesHeroText h1 {
        font-size: 48px;
    }

    .coachesHeroLine {
        width: 190px;
    }

    .coachesHeroText p {
        font-size: 16px;
    }
}

/* stejné jako breakpoint hamburger menu */
@media (max-width: 850px) {
    .coachesHeroClub {
        background-image: linear-gradient(90deg, rgba(0,18,45,.90) 0%, rgba(0,37,88,.68) 58%, rgba(0,37,88,.22) 100%), var(--coachesHeroMobile);
        background-size: cover;
        background-position: center right;
    }

    .coachesHeroRightVisual {
        display: none;
    }

    coachesHeroBrand img{
        display: none;   
    }
}

/* mobil */
@media (max-width: 767px) {
    .coachesHeroClub {
        min-height: 245px;
        background-color: #002558 !important;
        background-image: linear-gradient(90deg, rgba(0,18,45,.88) 0%, rgba(0,37,88,.62) 52%, rgba(0,37,88,.18) 100%), var(--coachesHeroMobile) !important;
        background-size: cover !important;
        background-position: center right !important;
        background-repeat: no-repeat !important;
    }

        .coachesHeroClub:before {
            background: linear-gradient(90deg, rgba(0,18,45,.90) 0%, rgba(0,37,88,.55) 60%, rgba(0,37,88,.18) 100%);
        }

    .coachesHeroRightVisual {
        display: none;
    }

    .coachesHeroInner {
        min-height: 245px;
        max-width: calc(100vw - 24px);
        top: -25px;
    }

    .coachesHeroBrand {
        gap: 16px;
        max-width: 100%;
    }

    .coachesHeroLogo {
       display: none;
    }

    .coachesHeroText h1 {
        font-size: 32px;
    }

    .coachesHeroLine {
        width: 120px;
        height: 3px;
        margin: 12px 0 10px;
    }

    .coachesHeroText p {
        font-size: 14px;
        line-height: 1.35;
        max-width: 300px;
    }
}


/* úzký mobil */
@media (max-width: 430px) {
    .coachesHeroClub {
        min-height: 220px;
    }

    .coachesHeroInner {
        min-height: 220px;
    }

    .coachesHeroLogo {
        width: 70px;
        height: 70px;
    }

    .coachesHeroBrand {
        gap: 12px;
    }

    .coachesHeroText h1 {
        font-size: 34px;
    }

    .coachesHeroText p {
        font-size: 13px;
    }
}


/* =========================================================
   COACHES PAGE - 03 TOP STRUCTURE
   ========================================================= */

.coachesOrgSection {
    background: radial-gradient(circle at top center, rgba(255,255,255,1) 0%, rgba(244,246,249,1) 70%);
    padding: 0 0 42px;
}

.coachTopBlock {
    width: 560px;
    max-width: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 3;
}

.coachTopLeadership {
    margin-top: 16px;
}

    .coachTopLeadership:after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -34px;
        width: 2px;
        height: 34px;
        background: #91cf45;
    }

.coachTopSpecial {
    width: 880px;
    max-width: 100%;
    margin-top: 52px;
}

    .coachTopSpecial:before {
        content: "";
        position: absolute;
        left: 50%;
        top: -34px;
        width: 2px;
        height: 34px;
        background: #91cf45;
    }

    .coachTopSpecial:after {
        content: "";
        position: absolute;
        left: calc(50% - 2px);
        bottom: -38px;
        width: 2px;
        height: 38px;
        background: #91cf45;
    }

.coachBlockHeader {
    min-height: 38px;
    border-radius: 8px 8px 0 0;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .02em;
    padding: 8px 12px;
}

.coachBlockHeaderBlue {
    background: linear-gradient(135deg, #002558 0%, #074699 100%);
}

.coachBlockHeaderGreen {
    background: linear-gradient(135deg, #91cf45 0%, #5ea443 100%);
}

.coachTopBlock > .coachCard {
    border-radius: 0 0 8px 8px;
}

    .coachTopBlock > .coachCard + .coachCard {
        border-radius: 8px;
        margin-top: 10px;
    }

.coachSpecialGrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

/* =========================================================
   COACHES PAGE - 04 TREE + RESPONSIVE LAYOUT
   ========================================================= */

/* ---------- DESKTOP STROM ---------- */

.coachTreeMain {
    position: relative;
    margin-top: 74px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 24px;
    align-items: start;
}

    .coachTreeMain:before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -36px;
        height: 2px;
        background: #91cf45;
    }

.coachGroup {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,.06);
    position: relative;
    min-width: 0;
    width: 100%;
}

    .coachGroup:before {
        content: "";
        position: absolute;
        left: 50%;
        top: -36px;
        width: 2px;
        height: 36px;
        background: #91cf45;
    }

.coachGroupHeader,
.coachChildHeader {
    min-height: 34px;
    background: linear-gradient(135deg, #002558 0%, #074699 100%);
    color: white;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    text-align: center;
    line-height: 1.15;
}

.coachGroupHeader {
    border-radius: 8px 8px 0 0;
    font-size: 14px;
    padding: 8px 10px;
}

    .coachGroupHeader span {
        font-size: 17px;
    }

.coachChildGroup {
    position: relative;
    margin: 18px 14px 14px;
    border: 1px solid #e5e9ef;
    border-radius: 7px;
    background: #fff;
}

.coachChildHeader {
    border-radius: 7px 7px 0 0;
    font-size: 13px;
    padding: 7px 10px;
}

/* vidličky uvnitř žáků / přípravek */
.coachGroup-lead-juniors,
.coachGroup-lead-prep {
    padding-bottom: 2px;
}

    .coachGroup-lead-juniors .coachChildGroup:before,
    .coachGroup-lead-prep .coachChildGroup:before {
        content: "";
        position: absolute;
        left: -18px;
        top: 17px;
        width: 18px;
        height: 2px;
        background: #91cf45;
    }

    .coachGroup-lead-juniors .coachChildGroup:after,
    .coachGroup-lead-prep .coachChildGroup:after {
        content: "";
        position: absolute;
        left: -19px;
        top: -18px;
        width: 2px;
        height: calc(100% + 18px);
        background: #91cf45;
    }

    .coachGroup-lead-juniors .coachChildGroup:first-of-type:after,
    .coachGroup-lead-prep .coachChildGroup:first-of-type:after {
        top: 17px;
        height: calc(100% - 17px);
    }

/* =========================================================
   COACHES PAGE - 05 CARDS
   ========================================================= */

.coachCardsGrid {
    padding: 12px;
}

.coachCard {
    background: white;
    border: 1px solid #e4e8ee;
    border-radius: 7px;
    box-shadow: 0 5px 15px rgba(0,0,0,.05);
    min-width: 0;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

    .coachCard:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 26px rgba(0,0,0,.12);
        filter: brightness(1.04);
    }

.coachCardTop {
    display: grid;
    grid-template-columns: 142px minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    min-height: 126px;
    padding: 14px 18px;
}

.coachSpecialGrid .coachCardTop {
    min-height: 118px;
}

.coachCard img {
    object-fit: cover;
    object-position: center top;
    display: block;
    border-radius: 5px;
    background: #edf1f5;
}

.coachCardTop img {
    width: 142px;
    height: 104px;
}

.coachCardText {
    min-width: 0;
}

    .coachCardText strong {
        display: block;
        color: #002558;
        font-size: 16px;
        font-weight: 800;
        line-height: 1.15;
    }

.coachCardSmall .coachCardText strong {
    font-size: 14px;
}

.coachCardText span {
    display: block;
    color: #5ea443;
    font-size: 13px;
    font-weight: 700;
    margin-top: 3px;
}

.coachCardSmall .coachCardText span {
    font-size: 12px;
}

.coachCardText small {
    display: block;
    color: #002558;
    font-size: 12px;
    line-height: 1.3;
    margin-top: 5px;
    overflow-wrap: anywhere;
}

.coachCardSmall .coachCardText small {
    font-size: 11px;
}

.coachCardText .coachQualification {
    color: #002558;
    font-weight: 700;
}

.coachQualification .fa {
    margin-right: 2px;
}

.coachHidden {
    display: none !important;
}

.coachEmptyRole {
    margin: 14px;
    padding: 22px 12px;
    min-height: 170px;
    border: 1px dashed rgba(145,207,69,.7);
    border-radius: 7px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #002558;
    text-align: center;
}

.coachEmptyRoleChild {
    min-height: 120px;
}

.coachEmptyIcon {
    color: #91cf45;
    font-size: 48px;
    line-height: 1;
    margin-bottom: 14px;
}

.coachEmptyRole strong {
    font-size: 14px;
    margin-bottom: 6px;
}

.coachEmptyRole span {
    font-size: 12px;
    line-height: 1.35;
}


/* =========================================================
   COACHES PAGE - 06 MOTTO
   ========================================================= */

.coachesMotto {
    margin: 34px auto 0;
    padding: 18px 20px;
    text-align: center;
    color: #002558;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .22em;
    white-space: nowrap;
}

    .coachesMotto span {
        color: #91cf45;
        font-size: 25px;
        vertical-align: middle;
        margin-right: 12px;
    }

    .coachesMotto b {
        color: #91cf45;
        margin: 0 12px;
    }

/* =========================================================
   COACHES PAGE - 08 RESPONSIVE MOBILE
   ========================================================= */

@media (max-width: 767px) {
    .coachesContentWrap,
    .coachesHeroInner {
        max-width: calc(100vw - 24px);
    }

    .coachesHero {
        min-height: 240px;
    }

        .coachesHero:after {
            right: -70px;
            top: -20px;
            width: 260px;
            height: 260px;
        }

    .coachesHeroInner {
        padding: 36px 0 44px;
    }

    .coachesHero h1 {
        font-size: 32px;
    }

    .coachesHero p {
        font-size: 15px;
        max-width: 340px;
    }

    .coachTopLeadership {
        margin-top: 18px;
    }

        .coachTopLeadership:after,
        .coachTopSpecial:before,
        .coachTopSpecial:after {
            display: none;
        }

    .coachTopSpecial {
        width: 100%;
        margin-top: 18px;
    }

    .coachSpecialGrid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .coachCardTop {
        grid-template-columns: 110px minmax(0, 1fr);
        gap: 14px;
        min-height: 122px;
        padding: 13px 14px;
    }

        .coachCardTop img {
            width: 110px;
            height: 96px;
        }

    .coachCardText strong {
        font-size: 17px;
    }

    .coachCardText span {
        font-size: 14px;
    }

    .coachCardText small {
        font-size: 13px;
    }

    .coachGroupHeader {
        justify-content: flex-start;
        padding: 12px 16px;
        font-size: 18px;
    }

    .coachChildHeader {
        justify-content: flex-start;
        padding: 11px 14px;
        font-size: 16px;
    }

    .coachesMotto {
        font-size: 11px;
        letter-spacing: .12em;
        padding: 14px 4px;
    }

        .coachesMotto span {
            font-size: 18px;
            margin-right: 6px;
        }

        .coachesMotto b {
            margin: 0 6px;
        }
}


/* =========================================================
   COACHES PAGE - 09 EXTRA SMALL MOBILE
   ========================================================= */

@media (max-width: 430px) {
    .coachCardTop {
        grid-template-columns: 92px minmax(0, 1fr);
    }

        .coachCardTop img {
            width: 92px;
            height: 86px;
        }

    .coachesMotto {
        font-size: 9px;
        letter-spacing: .08em;
    }

        .coachesMotto b {
            margin: 0 4px;
        }
}

/* =========================================================
   COACHES PAGE - 10 MODAL
   ========================================================= */

.coachCard {
    cursor: pointer;
}

.coachModal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
}

    .coachModal.isOpen {
        display: block;
    }

.coachModalOverlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 18, 45, .72);
    opacity: 0;
    transition: opacity .22s ease;
}

.coachModal.isOpen .coachModalOverlay {
    opacity: 1;
}

.coachModalBox {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 760px;
    max-width: calc(100vw - 36px);
    max-height: calc(100vh - 36px);
    transform: translate(-50%, -46%) scale(.96);
    opacity: 0;
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 26px 70px rgba(0,0,0,.35);
    display: grid;
    grid-template-columns: 46% 54%;
    transition: transform .24s ease, opacity .24s ease;
}

.coachModal.isOpen .coachModalBox {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}

.coachModalClose {
    position: absolute;
    right: 12px;
    top: 10px;
    z-index: 3;
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 50%;
    background: #002558;
    color: white;
    font-size: 25px;
    line-height: 30px;
    cursor: pointer;
}

.coachModalPhotoWrap {
    background: linear-gradient(135deg, rgba(0,37,88,.10), rgba(145,207,69,.08));
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
}

    .coachModalPhotoWrap img {
        max-width: 100%;
        max-height: 70vh;
        object-fit: contain;
        border-radius: 8px;
        box-shadow: 0 10px 30px rgba(0,0,0,.18);
    }

.coachModalInfo {
    padding: 46px 34px 34px;
    color: #002558;
}

    .coachModalInfo span {
        display: block;
        color: #5ea443;
        font-size: 16px;
        font-weight: 800;
        margin-bottom: 8px;
    }

    .coachModalInfo h3 {
        margin: 0 0 20px;
        color: #002558;
        font-size: 30px;
        line-height: 1.15;
        font-weight: 800;
    }

.coachModalContact {
    border-top: 1px solid #e3e6eb;
    padding-top: 16px;
}

    .coachModalContact div {
        font-size: 15px;
        line-height: 1.55;
        margin-bottom: 8px;
        overflow-wrap: anywhere;
    }

@media (max-width: 767px) {
    .coachModalBox {
        grid-template-columns: 1fr;
        width: 520px;
        max-height: calc(100vh - 24px);
        overflow-y: auto;
    }

    .coachModalPhotoWrap {
        padding: 18px;
    }

        .coachModalPhotoWrap img {
            max-height: 52vh;
        }

    .coachModalInfo {
        padding: 24px 22px 26px;
    }

        .coachModalInfo h3 {
            font-size: 25px;
        }
}

/* =========================================================
   COACHES PAGE - 12 CARD LAYOUT FINAL
   ========================================================= */

/* velké zobrazení: 5 stejných sloupců */
@media (min-width: 1251px) {
    .coachTreeMain {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 26px !important;
        align-items: start !important;
    }

    .coachGroup {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .coachGroup-muzi,
    .coachGroup-dorost,
    .coachGroup-lead-juniors,
    .coachGroup-lead-prep,
    .coachGroup-zeny {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        grid-column: auto !important;
    }
}

/* základní grid karet */
.coachCardsGrid,
.coachChildGroup .coachCardsGrid {
    display: grid !important;
    gap: 14px !important;
}

/* default v úzkém desktopovém sloupci: text pod fotkou */
@media (min-width: 1200px) and (max-width: 1640px) {
    .coachCardsGrid,
    .coachChildGroup .coachCardsGrid {
        grid-template-columns: 1fr !important;
    }

    .coachCardSmall {
        display: block !important;
        min-height: 0 !important;
        padding: 12px !important;
    }

        .coachCardSmall img {
            width: 100% !important;
            height: 190px !important;
            object-fit: cover !important;
            object-position: center top !important;
            margin-bottom: 10px !important;
        }

        .coachCardSmall .coachCardText strong {
            font-size: 15px !important;
            line-height: 1.15 !important;
        }

        .coachCardSmall .coachCardText span {
            font-size: 13px !important;
            line-height: 1.3 !important;
        }

        .coachCardSmall .coachCardText small {
            font-size: 12px !important;
            line-height: 1.35 !important;
            overflow-wrap: anywhere !important;
        }
}

/* opravdu široký desktop: může být text vedle fotky */
@media (min-width: 1641px) {
    .coachCardsGrid,
    .coachChildGroup .coachCardsGrid {
        grid-template-columns: 1fr !important;
    }

    .coachCardSmall {
        display: grid !important;
        grid-template-columns: 108px minmax(0, 1fr) !important;
        gap: 14px !important;
        align-items: center !important;
        min-height: 118px !important;
        padding: 12px 14px !important;
    }

        .coachCardSmall img {
            width: 108px !important;
            height: 100px !important;
            object-fit: cover !important;
            object-position: center top !important;
            margin-bottom: 0 !important;
        }
}

/* tablet / menší desktop: skupiny pod sebe, trenéři 3 / 2 / 1 podle místa */
@media (max-width: 1199px) {
    .coachTreeMain {
        display: block !important;
        margin-top: 54px !important;
    }

        .coachTreeMain:before,
        .coachGroup:before {
            display: none !important;
        }

    .coachGroup {
        width: 100% !important;
        margin-bottom: 22px !important;
    }

    .coachCardsGrid,
    .coachChildGroup .coachCardsGrid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
        gap: 14px !important;
    }

    .coachCardSmall {
        display: grid !important;
        grid-template-columns: 108px minmax(0, 1fr) !important;
        gap: 14px !important;
        min-height: 118px !important;
        padding: 12px 14px !important;
        align-items: center !important;
    }

        .coachCardSmall img {
            width: 108px !important;
            height: 90px !important;
            margin-bottom: 0 !important;
        }
}

/* mobil: jeden trenér na řádku, větší text */
@media (max-width: 767px) {
    .coachCardsGrid,
    .coachChildGroup .coachCardsGrid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .coachCardSmall {
        display: grid !important;
        grid-template-columns: 112px minmax(0, 1fr) !important;
        gap: 14px !important;
        min-height: 126px !important;
        padding: 13px 14px !important;
    }

        .coachCardSmall img {
            width: 112px !important;
            height: 94px !important;
        }

        .coachCardSmall .coachCardText strong {
            font-size: 18px !important;
        }

        .coachCardSmall .coachCardText span {
            font-size: 15px !important;
        }

        .coachCardSmall .coachCardText small {
            font-size: 13px !important;
        }
}

/* extra úzký mobil */
@media (max-width: 430px) {
    .coachCardSmall {
        grid-template-columns: 94px minmax(0, 1fr) !important;
        padding: 12px !important;
    }

        .coachCardSmall img {
            width: 94px !important;
            height: 84px !important;
        }

        .coachCardSmall .coachCardText strong {
            font-size: 16px !important;
        }

        .coachCardSmall .coachCardText span {
            font-size: 13px !important;
        }

        .coachCardSmall .coachCardText small {
            font-size: 12px !important;
        }
}

/* =========================================================
   COACHES PAGE - 11 TREE LINES FIX
   ========================================================= */

/* Čáry jen ve velkém stromovém zobrazení */
@media (min-width: 1200px) {

    /* horní čára - vrácená na předchozí funkční stav */
    .coachTreeMain:before {
        content: "";
        position: absolute;
        left: calc(10% - 10px) !important;
        right: calc(10% - 10px) !important;
        top: -36px !important;
        height: 2px !important;
        background: #91cf45 !important;
        display: block !important;
    }

    /* svislé spojky z horní čáry do hlavních skupin */
    .coachGroup:before {
        content: "" !important;
        position: absolute !important;
        left: 50% !important;
        top: -36px !important;
        width: 2px !important;
        height: 36px !important;
        background: #91cf45 !important;
        transform: translateX(-50%) !important;
        display: block !important;
    }

    /* zrušit staré/nepovedené napojování podkategorií */
    .coachGroup-lead-juniors .coachChildGroup:before,
    .coachGroup-lead-prep .coachChildGroup:before,
    .coachGroup-lead-juniors .coachChildGroup:after,
    .coachGroup-lead-prep .coachChildGroup:after,
    .coachGroup-lead-juniors > .coachCardsGrid:after,
    .coachGroup-lead-prep > .coachCardsGrid:after {
        display: none !important;
        content: none !important;
    }

/* prostor pod kartou vedoucího trenéra */
/* =========================================================
   NAPOJENÍ VEDOUCÍHO NA PODKATEGORIE - FIALOVÁ VARIANTA
   nechává horní i spodní čáry beze změny
   ========================================================= */

        .coachGroup-lead-juniors > .coachCardsGrid,
        .coachGroup-lead-prep > .coachCardsGrid {
            position: relative !important;
            margin-bottom: 24px !important;
        }

            /* vodorovné napojení od levé svislice ke středu pod kartou vedoucího */
            .coachGroup-lead-juniors > .coachCardsGrid:before,
            .coachGroup-lead-prep > .coachCardsGrid:before {
                content: "" !important;
                position: absolute !important;
                left: 1 !important;
                bottom: -1px !important;
                width: 50% !important;
                height: 2px !important;
                background: #91cf45 !important;
                display: block !important;
            }

            /* krátká svislá čára od karty vedoucího dolů k vodorovnému napojení */
            .coachGroup-lead-juniors > .coachCardsGrid:after,
            .coachGroup-lead-prep > .coachCardsGrid:after {
                content: "" !important;
                position: absolute !important;
                left: 50% !important;
                bottom: -1px !important;
                width: 2px !important;
                height: 12px !important;
                background: #91cf45 !important;
                transform: translateX(-50%) !important;
                display: block !important;
            }

        /* podkategorie posuneme doprava, aby vznikl prostor pro "vidličku" */
        .coachGroup-lead-juniors .coachChildGroup,
        .coachGroup-lead-prep .coachChildGroup {
            position: relative !important;
            margin-left: 42px !important;
            margin-right: 14px !important;
            margin-top: 12px !important;
        }

            /* vodorovná čára do každé podkategorie */
            .coachGroup-lead-juniors .coachChildGroup:before,
            .coachGroup-lead-prep .coachChildGroup:before {
                content: "" !important;
                position: absolute !important;
                left: -42px !important;
                top: 17px !important;
                width: 42px !important;
                height: 2px !important;
                background: #91cf45 !important;
                display: block !important;
            }

            /* svislá čára mezi podkategoriemi */
            .coachGroup-lead-juniors .coachChildGroup:after,
            .coachGroup-lead-prep .coachChildGroup:after {
                content: "" !important;
                position: absolute !important;
                left: -42px !important;
                top: -24px !important;
                width: 2px !important;
                height: calc(100% + 48px) !important;
                background: #91cf45 !important;
                display: block !important;
            }

            /* poslední podkategorie už nesmí čáru táhnout dál dolů */
            .coachGroup-lead-juniors .coachChildGroup:last-of-type:after,
            .coachGroup-lead-prep .coachChildGroup:last-of-type:after {
                height: 41px !important;
            }
}

/* V tablet/mobile režimu čáry vypnout */
@media (max-width: 1199px) {
    .coachTreeMain:before,
    .coachGroup:before,
    .coachGroup-lead-juniors > .coachCardsGrid:after,
    .coachGroup-lead-prep > .coachCardsGrid:after,
    .coachGroup-lead-juniors .coachChildGroup:before,
    .coachGroup-lead-prep .coachChildGroup:before,
    .coachGroup-lead-juniors .coachChildGroup:after,
    .coachGroup-lead-prep .coachChildGroup:after {
        display: none !important;
        content: none !important;
    }

    .coachGroup-lead-juniors .coachChildGroup,
    .coachGroup-lead-prep .coachChildGroup {
        margin-left: 14px !important;
        margin-right: 14px !important;
        margin-top: 18px !important;
    }
}

/* Úzké karty podkategorií: identita vedle fotografie, kontakty přes celou šířku. */
.coachChildGroup .coachCardChild {
    display: block !important;
    min-height: 0 !important;
    padding: 12px 14px !important;
}

.coachCardChildTop {
    display: grid;
    grid-template-columns: 108px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

    .coachCardChildTop img {
        width: 108px !important;
        height: 100px !important;
        margin: 0 !important;
        object-fit: cover !important;
        object-position: center top !important;
    }

.coachCardChildIdentity {
    align-self: start;
}

.coachCardChildDetails {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid #edf0f5;
}

    .coachCardChildDetails small {
        line-height: 1.35 !important;
        overflow-wrap: anywhere !important;
    }

/* Ve stejném úzkém desktopovém režimu jako u vedoucích je fotka nahoře
   a všechny údaje pokračují pod ní. */
@media (min-width: 1200px) and (max-width: 1640px) {
    .coachCardChildTop {
        display: block;
    }

        .coachCardChildTop img {
            width: 100% !important;
            height: 190px !important;
            margin: 0 0 10px !important;
        }

    .coachCardChildDetails {
        margin-top: 0;
        padding-top: 0;
        border-top: 0;
    }
}

@media (max-width: 767px) {
    .coachCardChildTop {
        grid-template-columns: 112px minmax(0, 1fr);
    }

    .coachCardChildTop img {
        width: 112px !important;
        height: 94px !important;
    }
}

@media (max-width: 430px) {
    .coachCardChildTop {
        grid-template-columns: 94px minmax(0, 1fr);
        gap: 12px;
    }

    .coachCardChildTop img {
        width: 94px !important;
        height: 84px !important;
    }
}

/* konec stylu pro trenery */

/* =========================================================
   CONTACT PAGE - 01 BASE
   ========================================================= */

.contactPage {
    font-family: Tahoma, Arial, sans-serif;
    background: #f4f6f9;
    color: #002558;
    overflow-x: hidden;
}

    .contactPage * {
        box-sizing: border-box;
    }

.contactContentWrap {
    width: 1500px;
    max-width: calc(100vw - 48px);
    margin: 0 auto;
}


/* =========================================================
   CONTACT PAGE - 02 HERO
   ========================================================= */

.contactHero {
    min-height: 320px;
    position: relative;
    color: white;
    overflow: hidden;
    border-top: 3px solid #91cf45;
    background-color: #002558;
    background-image: linear-gradient(90deg, rgba(0,18,45,.94) 0%, rgba(0,37,88,.76) 42%, rgba(0,37,88,.32) 70%, rgba(0,37,88,.08) 100%), var(--contactHeroBg);
    background-size: cover;
    background-position: center center;
}

    .contactHero:after {
        content: "";
        position: absolute;
        right: 80px;
        top: 50%;
        width: 360px;
        height: 360px;
        transform: translateY(-50%);
        background: var(--contactLogo) center center / contain no-repeat;
        opacity: .10;
        pointer-events: none;
    }

.contactHeroInner {
    width: 1500px;
    max-width: calc(100vw - 48px);
    min-height: 320px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 2;
}

.contactHero h1 {
    margin: 0;
    color: white;
    font-size: 62px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-shadow: 0 4px 16px rgba(0,0,0,.35);
}

.contactHeroLine {
    width: 76px;
    height: 4px;
    background: #91cf45;
    margin: 20px 0 16px;
}

.contactHero p {
    margin: 0;
    color: rgba(255,255,255,.96);
    font-size: 21px;
    line-height: 1.4;
    font-weight: 500;
}


/* =========================================================
   CONTACT PAGE - 03 MAIN PANEL
   ========================================================= */

.contactMainSection {
    padding: 0 0 44px;
    background: radial-gradient(circle at top center, rgba(255,255,255,1) 0%, rgba(244,246,249,1) 72%);
}

.contactMainPanel {
    margin-top: 16px;
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: minmax(0, .72fr) minmax(420px, 1.28fr);
    gap: 30px;
    align-items: stretch;
    background: #002558;
    border: 1px solid rgba(255,255,255,.30);
    border-radius: 10px;
    box-shadow: 0 16px 42px rgba(0,0,0,.18);
    padding: 18px;
}

.contactMainInfo {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 26px;
    padding: 18px 22px;
    color: white;
}

.contactMainItem {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 18px;
    align-items: center;
}

.contactMainIcon {
    width: 54px;
    height: 54px;
    border: 2px solid #91cf45;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #91cf45;
    font-size: 25px;
}

.contactMainItem span {
    display: block;
    color: rgba(255,255,255,.80);
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 5px;
}

.contactMainItem strong,
.contactMainItem a {
    display: block;
    color: white;
    font-size: 20px;
    line-height: 1.3;
    font-weight: 800;
    text-decoration: none;
}

    .contactMainItem a:hover {
        color: #91cf45;
        text-decoration: none;
    }

.contactMapBox {
    position: relative;
    min-height: 250px;
    background: white;
    border-radius: 7px;
    overflow: hidden;
}

.contactMap {
    width: 100%;
    height: 100%;
    min-height: 250px;
    z-index: 1;
}

.contactMapLink {
    position: absolute;
    right: 16px;
    bottom: 14px;
    z-index: 2;
    background: #002558;
    color: white;
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
    padding: 10px 14px;
    border-radius: 4px;
    box-shadow: 0 8px 22px rgba(0,0,0,.20);
}

    .contactMapLink:hover {
        color: #91cf45;
        text-decoration: none;
    }


/* =========================================================
   CONTACT PAGE - 04 INFO CARDS
   ========================================================= */

.contactCardsGrid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.contactCard {
    position: relative;
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    box-shadow: 0 9px 26px rgba(0,0,0,.07);
}

.contactCardIcon {
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
}

.contactCard h2 {
    color: #002558;
    line-height: 1.2;
    font-weight: 800;
}

.contactPersonRow {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    border-bottom: 1px solid #e5e9ef;
}

    .contactPersonRow:last-child {
        border-bottom: none;
    }

    .contactPersonRow span {
        grid-column: 1 / -1;
        color: #333;
    }

    .contactPersonRow strong {
        color: #002558;
        font-weight: 800;
    }

    .contactPersonRow a {
        color: #002558;
        text-decoration: none;
        white-space: nowrap;
    }

        .contactPersonRow a:hover {
            color: #5ea443;
            text-decoration: none;
        }

.contactBankCard p {
    margin: 0;
    color: #333;
}

.contactSimpleLine {
    display: grid;
    gap: 8px;
}

    .contactSimpleLine span {
        color: #333;
        font-size: 13px;
    }

    .contactSimpleLine a {
        color: #002558;
        font-size: 17px;
        font-weight: 700;
        text-decoration: none;
        overflow-wrap: anywhere;
    }

        .contactSimpleLine a:hover {
            color: #5ea443;
            text-decoration: none;
        }


/* =========================================================
   CONTACT PAGE - 05 FORM
   ========================================================= */

.contactFormCard {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    box-shadow: 0 9px 26px rgba(0,0,0,.07);
    display: grid;
}

.contactFormIntro {
    display: grid;
    align-items: start;
    border-right: 1px solid #e5e9ef;
}

.contactFormIcon {
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.contactFormIntro h2 {
    color: #002558;
    font-weight: 800;
}

.contactFormIntro p {
    margin: 0;
    color: #333;
}

.contactField {
    min-width: 0;
}

    .contactField label {
        display: block;
        color: #002558;
        font-weight: 800;
    }

.contactInput {
    width: 100%;
    border: 1px solid #cfd6df;
    border-radius: 4px;
    background: white;
    color: #002558;
    padding: 0 12px;
    font-family: Tahoma, Arial, sans-serif;
    outline: none;
}

    .contactInput:focus {
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145,207,69,.18);
    }

.contactFieldMessage {
    grid-column: 1 / -1;
}

.contactTextarea {
    resize: vertical;
}

.contactSubmitBtn {
    border: none;
    border-radius: 4px;
    background: #002558;
    color: white;
    font-family: Tahoma, Arial, sans-serif;
    font-weight: 800;
    cursor: pointer;
    box-shadow: inset 0 -4px 0 rgba(145,207,69,.95);
}

    .contactSubmitBtn:hover {
        background: #073b85;
    }

.contactMotto {
    margin: 32px auto 0;
    padding: 18px 20px;
    text-align: center;
    color: #002558;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: .18em;
    white-space: nowrap;
}

    .contactMotto span {
        color: #91cf45;
        font-size: 24px;
        vertical-align: middle;
        margin-right: 12px;
    }

    .contactMotto b {
        color: #91cf45;
        margin: 0 12px;
    }


/* =========================================================
   CONTACT PAGE - 06 MODAL
   ========================================================= */

.contactHiddenButton {
    display: none;
}

.contactModalBg {
    background: rgba(0,18,45,.70);
}

.contactAlertPanel {
    width: 420px;
    max-width: calc(100vw - 32px);
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(0,0,0,.35);
}

.contactAlertHeader {
    background: #002558;
    color: white;
    font-size: 18px;
    font-weight: 800;
    text-align: center;
    padding: 16px 20px;
}

.contactAlertBody {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    padding: 24px;
    color: #002558;
    font-size: 16px;
    font-weight: 700;
}

.contactAlertIcon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    font-weight: 800;
}

.contactAlertYes .contactAlertIcon {
    background: #5ea443;
}

.contactAlertMaybe .contactAlertIcon {
    background: #e2a700;
}

.contactAlertNo .contactAlertIcon {
    background: #b00020;
}

.contactAlertFooter {
    padding: 0 24px 24px;
    text-align: right;
}

.contactAlertButton {
    width: 130px;
    height: 38px;
    border: none;
    border-radius: 4px;
    background: #002558;
    color: white;
    font-weight: 800;
    cursor: pointer;
}


/* =========================================================
   CONTACT PAGE - 07 RESPONSIVE
   ========================================================= */

@media (max-width: 1199px) {
    .contactContentWrap,
    .contactHeroInner {
        max-width: calc(100vw - 32px);
    }

    .contactMainPanel {
        grid-template-columns: 1fr;
    }

    .contactMapBox,
    .contactMap {
        min-height: 320px;
    }

    .contactFormIntro {
        border-right: none;
        border-bottom: 1px solid #e5e9ef;
        padding-right: 0;
        padding-bottom: 20px;
    }
}

@media (max-width: 767px) {
    .contactContentWrap,
    .contactHeroInner {
        max-width: calc(100vw - 24px);
    }

    .contactHero {
        min-height: 230px;
        background-position: center right;
    }

    .contactHeroInner {
        min-height: 230px;
    }

    .contactHero:after {
        right: -70px;
        width: 240px;
        height: 240px;
    }

    .contactHero h1 {
        font-size: 42px;
    }

    .contactHeroLine {
        width: 58px;
        margin: 14px 0 12px;
    }

    .contactHero p {
        font-size: 16px;
    }

    .contactMainPanel {
        margin-top: 16px;
        padding: 12px;
        gap: 14px;
    }

    .contactMainInfo {
        padding: 14px;
        gap: 18px;
    }

    .contactMainItem {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 14px;
    }

    .contactMainIcon {
        width: 46px;
        height: 46px;
        font-size: 21px;
    }

    .contactMainItem strong,
    .contactMainItem a {
        font-size: 16px;
    }

    .contactMapBox,
    .contactMap {
        min-height: 260px;
    }

    .contactPersonRow {
        grid-template-columns: 1fr;
    }

    .contactMotto {
        font-size: 12px;
        letter-spacing: .07em;
        padding-left: 0;
        padding-right: 0;
    }

        .contactMotto span {
            font-size: 17px;
            margin-right: 5px;
        }

        .contactMotto b {
            margin: 0 5px;
        }
}

@media (max-width: 430px) {
    .contactHero h1 {
        font-size: 36px;
    }

    .contactHero p {
        font-size: 14px;
    }

    .contactMainItem strong,
    .contactMainItem a {
        font-size: 14px;
    }

    .contactMotto {
        white-space: normal;
        line-height: 1.7;
    }
}

/* =========================================================
   CONTACT PAGE - COMPACT DESIGN FINAL
   ========================================================= */

/* čistší zelené kruhové ikony */
.contactMainIcon,
.contactCardIcon,
.contactFormIcon {
    position: relative;
    background: #91cf45 !important;
    color: #002558 !important;
    border: none !important;
    box-shadow: 0 8px 18px rgba(145,207,69,.22);
}

    .contactMainIcon:before,
    .contactCardIcon:before,
    .contactFormIcon:before {
        content: "";
        display: block;
        width: 52%;
        height: 52%;
        background: #002558;
        mask-position: center;
        mask-repeat: no-repeat;
        mask-size: contain;
        -webkit-mask-position: center;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
    }

.contactIconMail:before,
.contactIconMessage:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M3 5h18v14H3V5zm2.1 2 6.9 5.1L18.9 7H5.1zM5 17h14V8.9l-7 5.2-7-5.2V17z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M3 5h18v14H3V5zm2.1 2 6.9 5.1L18.9 7H5.1zM5 17h14V8.9l-7 5.2-7-5.2V17z'/%3E%3C/svg%3E");
}

.contactIconPin:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z'/%3E%3C/svg%3E");
}

.contactIconPeople:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M8 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm8 0a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM2 20c0-4 2.7-7 6-7s6 3 6 7H2zm12.5 0c-.2-2-.9-3.8-2-5.2 1-.9 2.2-1.4 3.5-1.4 3 0 5.5 2.7 5.5 6.6h-7z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M8 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm8 0a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM2 20c0-4 2.7-7 6-7s6 3 6 7H2zm12.5 0c-.2-2-.9-3.8-2-5.2 1-.9 2.2-1.4 3.5-1.4 3 0 5.5 2.7 5.5 6.6h-7z'/%3E%3C/svg%3E");
}

.contactIconBank:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 3 3 8v2h18V8l-9-5zM5 11h2v7H5v-7zm4 0h2v7H9v-7zm4 0h2v7h-2v-7zm4 0h2v7h-2v-7zM4 19h16v2H4v-2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 3 3 8v2h18V8l-9-5zM5 11h2v7H5v-7zm4 0h2v7H9v-7zm4 0h2v7h-2v-7zm4 0h2v7h-2v-7zM4 19h16v2H4v-2z'/%3E%3C/svg%3E");
}

.contactIconWeb:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm6.9 6h-3a15 15 0 0 0-1.1-3 8.1 8.1 0 0 1 4.1 3zM12 4c.7 1 1.3 2.3 1.7 4h-3.4C10.7 6.3 11.3 5 12 4zM4.3 14a8.3 8.3 0 0 1 0-4h3.4a17 17 0 0 0 0 4H4.3zm.8 2h3a15 15 0 0 0 1.1 3 8.1 8.1 0 0 1-4.1-3zm3-8h-3a8.1 8.1 0 0 1 4.1-3 15 15 0 0 0-1.1 3zM12 20c-.7-1-1.3-2.3-1.7-4h3.4C13.3 17.7 12.7 19 12 20zm2.1-6H9.9a14.5 14.5 0 0 1 0-4h4.2a14.5 14.5 0 0 1 0 4zm.7 5a15 15 0 0 0 1.1-3h3a8.1 8.1 0 0 1-4.1 3zm1.5-5a17 17 0 0 0 0-4h3.4a8.3 8.3 0 0 1 0 4h-3.4z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm6.9 6h-3a15 15 0 0 0-1.1-3 8.1 8.1 0 0 1 4.1 3zM12 4c.7 1 1.3 2.3 1.7 4h-3.4C10.7 6.3 11.3 5 12 4zM4.3 14a8.3 8.3 0 0 1 0-4h3.4a17 17 0 0 0 0 4H4.3zm.8 2h3a15 15 0 0 0 1.1 3 8.1 8.1 0 0 1-4.1-3zm3-8h-3a8.1 8.1 0 0 1 4.1-3 15 15 0 0 0-1.1 3zM12 20c-.7-1-1.3-2.3-1.7-4h3.4C13.3 17.7 12.7 19 12 20zm2.1-6H9.9a14.5 14.5 0 0 1 0-4h4.2a14.5 14.5 0 0 1 0 4zm.7 5a15 15 0 0 0 1.1-3h3a8.1 8.1 0 0 1-4.1 3zm1.5-5a17 17 0 0 0 0-4h3.4a8.3 8.3 0 0 1 0 4h-3.4z'/%3E%3C/svg%3E");
}

/* kompaktnější tři karty - vycentrovaná ikona vůči obsahu */
.contactCardsGrid {
    margin-top: 22px !important;
    gap: 20px !important;
}

.contactCard {
    min-height: 145px !important;
    padding: 22px 26px !important;
}

.contactCard h2 {
    font-size: 20px !important;
}

.contactPersonRow {
    padding: 7px 0 !important;
    gap: 5px 12px !important;
}

    .contactPersonRow span {
        font-size: 12px !important;
    }

    .contactPersonRow strong,
    .contactPersonRow a {
        font-size: 13px !important;
    }

.contactBankNumber {
    color: #002558;
    font-weight: 800;
    font-size: 24px !important;
    margin-bottom: 9px !important;
    line-height: 1.15 !important;
}

.contactBankCard p {
    font-size: 13px !important;
    line-height: 1.35 !important;
}

.contactWebmasterBox strong {
    display: block;
    color: #002558;
    font-size: 15px;
    font-weight: 800;
    margin-bottom: 3px;
}

.contactWebmasterBox > span {
    display: block;
    color: #5ea443;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 12px;
}

.contactWebmasterLine {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    margin-top: 6px;
}

    .contactWebmasterLine small {
        color: #333;
        font-size: 12px;
    }

    .contactWebmasterLine a {
        color: #002558;
        font-size: 13px;
        font-weight: 700;
        text-decoration: none;
        overflow-wrap: anywhere;
    }

        .contactWebmasterLine a:hover {
            color: #5ea443;
            text-decoration: none;
        }

/* nižší formulář - 50/50, potom 1/3 + 2/3, tlačítko vpravo */
.contactFormCard {
    margin-top: 22px !important;
    padding: 18px 20px !important;
    grid-template-columns: 235px minmax(0, 1fr) !important;
    gap: 22px !important;
}

.contactFormIntro {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 14px !important;
    padding-right: 20px !important;
}

.contactFormIcon {
    width: 46px !important;
    height: 46px !important;
}

.contactFormIntro h2 {
    font-size: 19px !important;
}

.contactFormIntro p {
    font-size: 12px !important;
    line-height: 1.35 !important;
}

.contactFormGrid {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 12px 18px !important;
}

.contactFieldWhom {
    grid-column: 1 / span 6 !important;
}

.contactFieldEmail {
    grid-column: 7 / span 6 !important;
}

.contactFieldSubject {
    grid-column: 1 / span 4 !important;
}

.contactFieldMessage {
    grid-column: 5 / span 8 !important;
}

.contactSubmitWrap {
    grid-column: 1 / -1 !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    height: auto !important;
    padding-top: 0 !important;
}

.contactField label {
    font-size: 12px !important;
    margin-bottom: 5px !important;
}

.contactInput {
    height: 36px !important;
    font-size: 13px !important;
}

.contactTextarea {
    height: 72px !important;
    min-height: 72px !important;
    padding: 8px 10px !important;
}

.contactSubmitBtn {
    width: 185px !important;
    height: 42px !important;
    font-size: 14px !important;
}

/* responsive */
@media (max-width: 1199px) {
    .contactCardsGrid {
        grid-template-columns: 1fr 1fr !important;
    }

    .contactFormCard {
        grid-template-columns: 1fr !important;
    }

    .contactFormGrid {
        grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    }

    .contactFieldWhom {
        grid-column: 1 / span 6 !important;
    }

    .contactFieldEmail {
        grid-column: 7 / span 6 !important;
    }

    .contactFieldSubject {
        grid-column: 1 / span 4 !important;
    }

    .contactFieldMessage {
        grid-column: 5 / span 8 !important;
    }

    .contactSubmitWrap {
        grid-column: 1 / -1 !important;
        justify-content: flex-end !important;
    }
}

@media (max-width: 767px) {
    .contactCardsGrid {
        grid-template-columns: 1fr !important;
    }

    .contactCard {
        grid-template-columns: 42px minmax(0, 1fr) !important;
        gap: 16px !important;
    }

    .contactCardIcon {
        width: 42px !important;
        height: 42px !important;
    }

    .contactCard h2 {
        font-size: 18px !important;
    }

    .contactFormGrid {
        grid-template-columns: 1fr !important;
    }

    .contactFieldWhom,
    .contactFieldEmail,
    .contactFieldSubject,
    .contactFieldMessage,
    .contactSubmitWrap {
        grid-column: 1 !important;
    }

    .contactSubmitWrap {
        justify-content: stretch !important;
    }

    .contactSubmitBtn {
        width: 100% !important;
    }
}

@media (max-width: 430px) {
    .contactCard {
        grid-template-columns: 1fr !important;
    }

    .contactCardIcon {
        margin-bottom: 4px !important;
    }
}

/* =========================================================
   CONTACT PAGE - FINAL ALIGNMENT FIX
   ikony/nadpisy + předmět nahoře
   ========================================================= */

/* 1) Horní informační karty - ikona a nadpis na stejné výšce */
.contactCard {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    gap: 20px !important;
    align-items: start !important;
}

.contactCardIcon {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 46px !important;
    height: 46px !important;
    margin-top: 0 !important;
    align-self: start !important;
}

.contactCardContent {
    padding-left: 0 !important;
    min-width: 0 !important;
}

.contactCard h2 {
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.15 !important;
}

/* 2) Formulář - ikona a nadpis "NAPIŠTE NÁM" také zarovnané */
.contactFormIntro {
    align-items: start !important;
}

.contactFormIcon {
    margin-top: 0 !important;
    align-self: start !important;
}

.contactFormIntro h2 {
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.15 !important;
}

/* 3) Předmět zarovnat nahoru k poli Zpráva */
.contactFormGrid {
    align-items: start !important;
}

.contactFieldSubject,
.contactFieldMessage {
    align-self: start !important;
}

.contactSubmitWrap {
    align-self: end !important;
}

/* konec stylu pro Contact page */

/* =========================================================
   GALLERY PAGE - 01 BASE
   ========================================================= */

.galleryPage {
    font-family: Tahoma, Arial, sans-serif;
    background: #f4f6f9;
    color: #002558;
    overflow-x: hidden;
}

    .galleryPage * {
        box-sizing: border-box;
    }

.galleryContentWrap {
    width: 1500px;
    max-width: calc(100vw - 48px);
    margin: 0 auto;
}


/* =========================================================
   GALLERY PAGE - 02 INTRO STRIP
   ========================================================= */

.galleryIntroStrip {
    background: white;
    border-bottom: 1px solid rgba(145,207,69,.55);
    box-shadow: 0 8px 24px rgba(0,0,0,.04);
}

.galleryIntroGrid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
}

.galleryIntroItem {
    min-height: 86px;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    padding: 18px 24px;
    border-right: 1px solid #dde4ee;
}

    .galleryIntroItem:last-child {
        border-right: none;
    }

.galleryIntroIcon {
    width: 46px;
    height: 46px;
    border: 2px solid #91cf45;
    border-radius: 50%;
    position: relative;
}

    .galleryIntroIcon:before {
        content: "";
        position: absolute;
        inset: 12px;
        background: #5ea443;
        mask-position: center;
        mask-repeat: no-repeat;
        mask-size: contain;
        -webkit-mask-position: center;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
    }

.galleryIntroIconPhoto:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M9 3 7.2 5H4a2 2 0 0 0-2 2v11a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-3.2L15 3H9zm3 5a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M9 3 7.2 5H4a2 2 0 0 0-2 2v11a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-3.2L15 3H9zm3 5a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6z'/%3E%3C/svg%3E");
}

.galleryIntroIconVideo:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 5h11a2 2 0 0 1 2 2v2.5l4-2.5v10l-4-2.5V17a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 5h11a2 2 0 0 1 2 2v2.5l4-2.5v10l-4-2.5V17a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2z'/%3E%3C/svg%3E");
}

.galleryIntroIconPeople:before,
.galleryIntroIconArchive:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M8 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm8 0a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM2 20c0-4 2.7-7 6-7s6 3 6 7H2zm12.5 0c-.2-2-.9-3.8-2-5.2 1-.9 2.2-1.4 3.5-1.4 3 0 5.5 2.7 5.5 6.6h-7z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M8 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm8 0a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM2 20c0-4 2.7-7 6-7s6 3 6 7H2zm12.5 0c-.2-2-.9-3.8-2-5.2 1-.9 2.2-1.4 3.5-1.4 3 0 5.5 2.7 5.5 6.6h-7z'/%3E%3C/svg%3E");
}

.galleryIntroItem strong {
    display: block;
    color: #002558;
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 4px;
}

.galleryIntroItem small {
    display: block;
    color: #333;
    font-size: 12px;
    line-height: 1.35;
}


/* =========================================================
   GALLERY PAGE - 03 RECOMMENDED
   ========================================================= */

.galleryRecommendedSection {
    padding: 20px 0 14px;
    background: white;
}

.gallerySmallTitle,
.gallerySectionHeader h2 {
    margin: 0 0 14px;
    color: #002558;
    font-size: 24px;
    line-height: 1.1;
    font-weight: 800;
}

    .gallerySmallTitle span {
        color: #91cf45;
        margin-right: 8px;
    }

.galleryRecommendedScroller {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    padding-right: 58px;
}

.galleryRecommendedCard {
    position: relative;
    min-height: 126px;
    border-radius: 6px;
    overflow: hidden;
    display: block;
    color: white;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(0,0,0,.12);
}

    .galleryRecommendedCard img {
        width: 100%;
        height: 126px;
        display: block;
        object-fit: cover;
        transition: transform .25s ease;
    }

    .galleryRecommendedCard:hover img {
        transform: scale(1.04);
    }

.galleryRecommendedOverlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,18,45,.82) 100%);
}

.galleryRecommendedText {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 13px;
    z-index: 2;
}

    .galleryRecommendedText strong {
        display: block;
        color: white;
        font-size: 15px;
        font-weight: 800;
    }

    .galleryRecommendedText small {
        display: block;
        color: rgba(255,255,255,.92);
        font-size: 12px;
        margin-top: 4px;
    }

.galleryRecommendedCount {
    position: absolute;
    right: 12px;
    bottom: 13px;
    z-index: 3;
    color: white;
    font-size: 12px;
    font-weight: 700;
}

.galleryRecommendedBadge {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
    background: #91cf45;
    color: #002558;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 800;
    padding: 4px 7px;
}

.galleryRecommendedArrow {
    position: absolute;
    right: 0;
    top: 50%;
    width: 42px;
    height: 42px;
    margin-top: -21px;
    border: none;
    border-radius: 50%;
    background: white;
    color: #002558;
    font-size: 34px;
    line-height: 1;
    box-shadow: 0 8px 22px rgba(0,0,0,.18);
    cursor: pointer;
}


/* =========================================================
   GALLERY PAGE - 04 TOOLBAR
   ========================================================= */

.galleryToolbarSection {
    padding: 18px 0 0;
    background: #f4f6f9;
}

.galleryToolbar {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 7px;
    box-shadow: 0 8px 22px rgba(0,0,0,.06);
    padding: 12px;
    display: grid;
    grid-template-columns: 1.25fr .9fr .9fr 1.8fr;
    gap: 14px;
    align-items: center;
}

.gallerySearchBox {
    height: 42px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    border: 1px solid #cfd7e2;
    border-radius: 4px;
    overflow: hidden;
}

    .gallerySearchBox input {
        border: none;
        outline: none;
        padding: 0 14px;
        color: #002558;
        font-size: 13px;
        font-family: Tahoma, Arial, sans-serif;
    }

    .gallerySearchBox span {
        display: flex;
        align-items: center;
        justify-content: center;
        color: #002558;
        font-size: 23px;
    }

.galleryToolbar select {
    height: 42px;
    border: 1px solid #cfd7e2;
    border-radius: 4px;
    color: #002558;
    background: white;
    padding: 0 14px;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    font-weight: 700;
}

.gallerySortButtons {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    border: 1px solid #cfd7e2;
    border-radius: 4px;
    overflow: hidden;
}

.gallerySortBtn {
    height: 42px;
    border: none;
    border-right: 1px solid #cfd7e2;
    background: white;
    color: #002558;
    font-size: 12px;
    font-weight: 800;
    font-family: Tahoma, Arial, sans-serif;
    cursor: pointer;
}

    .gallerySortBtn:last-child {
        border-right: none;
    }

    .gallerySortBtn.active {
        background: #002558;
        color: white;
    }


/* =========================================================
   GALLERY PAGE - 05 MAIN GRID
   ========================================================= */

.galleryMainSection {
    padding: 16px 0 44px;
    background: #f4f6f9;
}

.galleryMainGrid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 560px;
    gap: 28px;
    align-items: start;
}

.galleryLeftColumn {
    min-width: 0;
}

.galleryBlock {
    margin-bottom: 28px;
}

.gallerySectionHeader {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
    border-bottom: 1px solid rgba(145,207,69,.65);
}

    .gallerySectionHeader h2 {
        background: #f4f6f9;
        padding-right: 12px;
        margin-bottom: -1px;
    }

.galleryTitleIcon {
    display: inline-block;
    width: 28px;
    height: 22px;
    vertical-align: -4px;
    margin-right: 8px;
    position: relative;
}

    .galleryTitleIcon:before {
        content: "";
        position: absolute;
        inset: 0;
        background: #91cf45;
        mask-position: center;
        mask-repeat: no-repeat;
        mask-size: contain;
        -webkit-mask-position: center;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
    }

.galleryTitleIconAlbum:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 28 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M2 4h8l2 2h14v14H2V4zm2 4v10h20V8H4zM0 1h8l2 2H0V1z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 28 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M2 4h8l2 2h14v14H2V4zm2 4v10h20V8H4zM0 1h8l2 2H0V1z'/%3E%3C/svg%3E");
}

.galleryTitleIconVideo:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 28 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M2 4h16a2 2 0 0 1 2 2v2l6-3v12l-6-3v2a2 2 0 0 1-2 2H2V4z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 28 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M2 4h16a2 2 0 0 1 2 2v2l6-3v12l-6-3v2a2 2 0 0 1-2 2H2V4z'/%3E%3C/svg%3E");
}


/* =========================================================
   GALLERY PAGE - 06 ALBUM CARDS
   ========================================================= */

.galleryAlbumGrid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.galleryAlbumCard {
    position: relative;
    display: block;
    min-height: 160px;
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 6px;
    overflow: hidden;
    color: #002558;
    text-decoration: none;
    box-shadow: 0 7px 18px rgba(0,0,0,.08);
    transition: transform .2s ease, box-shadow .2s ease;
}

    .galleryAlbumCard:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 26px rgba(0,0,0,.12);
        text-decoration: none;
    }

.galleryAlbumPhoto {
    display: block;
    height: 96px;
    overflow: hidden;
}

    .galleryAlbumPhoto img {
        width: 100%;
        height: 96px;
        object-fit: cover;
        display: block;
        transition: transform .25s ease;
    }

.galleryAlbumCard:hover .galleryAlbumPhoto img {
    transform: scale(1.04);
}

.galleryAlbumInfo {
    display: block;
    padding: 10px 12px 12px;
}

    .galleryAlbumInfo strong {
        display: block;
        color: #002558;
        font-size: 13px;
        line-height: 1.2;
        font-weight: 800;
        min-height: 32px;
    }

    .galleryAlbumInfo small {
        display: block;
        margin-top: 4px;
        color: #333;
        font-size: 12px;
    }

.galleryAlbumCount {
    position: absolute;
    right: 10px;
    bottom: 12px;
    color: #002558;
    font-size: 11px;
    font-weight: 700;
}

.galleryMoreWrap {
    margin-top: 16px;
    text-align: center;
}

.galleryMoreBtn {
    width: 260px;
    max-width: 100%;
    height: 40px;
    border: 1px solid #002558;
    border-radius: 5px;
    background: white;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

    .galleryMoreBtn span {
        margin-left: 14px;
        font-size: 18px;
    }


/* =========================================================
   GALLERY PAGE - 07 PREVIEW PANEL
   ========================================================= */

.galleryPreviewPanel {
    position: sticky;
    top: 20px;
    background: #002558;
    border-radius: 8px;
    padding: 18px;
    box-shadow: 0 12px 34px rgba(0,0,0,.20);
    color: white;
    overflow: hidden;
}

.galleryPreviewTop {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: start;
    margin-bottom: 16px;
}

    .galleryPreviewTop strong {
        display: block;
        color: white;
        font-size: 17px;
        font-weight: 800;
    }

    .galleryPreviewTop span {
        display: block;
        color: rgba(255,255,255,.88);
        font-size: 13px;
        margin-top: 5px;
    }

.galleryPreviewActions {
    display: flex;
    gap: 16px;
}

    .galleryPreviewActions button {
        border: none;
        background: transparent;
        color: white;
        cursor: pointer;
        font-size: 22px;
        text-align: center;
    }

    .galleryPreviewActions small {
        display: block;
        font-size: 10px;
        margin-top: 3px;
    }

.galleryPreviewImageWrap {
    position: relative;
    height: 335px;
    border-radius: 6px;
    overflow: hidden;
    background: #001b41;
}

    .galleryPreviewImageWrap img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.galleryPreviewArrow {
    position: absolute;
    top: 50%;
    width: 42px;
    height: 54px;
    margin-top: -27px;
    border: none;
    border-radius: 50%;
    background: rgba(0,0,0,.45);
    color: white;
    font-size: 40px;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
}

.galleryPreviewArrowLeft {
    left: 14px;
}

.galleryPreviewArrowRight {
    right: 14px;
}

.galleryPreviewThumbs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    margin-top: 14px;
}

    .galleryPreviewThumbs button {
        height: 62px;
        padding: 0;
        border: 3px solid transparent;
        background: transparent;
        cursor: pointer;
        overflow: hidden;
        border-radius: 3px;
    }

        .galleryPreviewThumbs button.active {
            border-color: #91cf45;
        }

    .galleryPreviewThumbs img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }


/* =========================================================
   GALLERY PAGE - 08 VIDEO LEGACY WRAP
   ========================================================= */

.galleryVideoLegacy {
    min-height: 120px;
}


/* =========================================================
   GALLERY PAGE - 09 DETAIL
   ========================================================= */

.galleryDetailPage {
    padding: 28px 0 44px;
    background: #f4f6f9;
}

.galleryDetailHeader {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 22px;
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: end;
    box-shadow: 0 8px 22px rgba(0,0,0,.06);
}

.galleryBackLink {
    display: inline-block;
    color: #002558;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    margin-bottom: 14px;
}

    .galleryBackLink:hover {
        color: #5ea443;
        text-decoration: none;
    }

.galleryDetailHeader h1 {
    margin: 0;
    color: #002558;
    font-size: 34px;
    font-weight: 800;
}

.galleryDetailHeader p {
    margin: 8px 0 0;
    color: #333;
    font-size: 14px;
    line-height: 1.45;
}

.galleryDetailMeta {
    min-width: 160px;
    text-align: right;
}

    .galleryDetailMeta strong {
        display: block;
        color: #002558;
        font-size: 15px;
    }

    .galleryDetailMeta span {
        display: block;
        color: #5ea443;
        font-size: 14px;
        font-weight: 800;
        margin-top: 5px;
    }

.galleryDetailGrid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.galleryPhotoCard {
    position: relative;
    display: block;
    min-height: 160px;
    border-radius: 6px;
    overflow: hidden;
    background: white;
    box-shadow: 0 8px 20px rgba(0,0,0,.08);
}

    .galleryPhotoCard img {
        width: 100%;
        height: 190px;
        object-fit: cover;
        display: block;
        transition: transform .25s ease;
    }

    .galleryPhotoCard span {
        position: absolute;
        inset: 0;
        background: rgba(0,37,88,.55);
        color: white;
        font-size: 34px;
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        transition: opacity .2s ease;
    }

    .galleryPhotoCard:hover img {
        transform: scale(1.04);
    }

    .galleryPhotoCard:hover span {
        opacity: 1;
    }


/* =========================================================
   GALLERY PAGE - 10 LIGHTBOX
   ========================================================= */

.galleryLightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(0,0,0,.82);
    display: none;
    align-items: center;
    justify-content: center;
}

    .galleryLightbox.open {
        display: flex;
    }

.galleryLightboxOpen {
    overflow: hidden;
}

.galleryLightboxImageWrap {
    position: relative;
    max-width: calc(100vw - 160px);
    max-height: calc(100vh - 90px);
}

    .galleryLightboxImageWrap img {
        max-width: 100%;
        max-height: calc(100vh - 90px);
        display: block;
        box-shadow: 0 18px 60px rgba(0,0,0,.45);
    }

.galleryLightboxClose {
    position: fixed;
    right: 28px;
    top: 18px;
    border: none;
    background: transparent;
    color: white;
    font-size: 38px;
    cursor: pointer;
}

.galleryLightboxNav {
    position: fixed;
    top: 50%;
    width: 60px;
    height: 80px;
    margin-top: -40px;
    border: none;
    background: transparent;
    color: white;
    font-size: 64px;
    line-height: 1;
    cursor: pointer;
}

.galleryLightboxPrev {
    left: 28px;
}

.galleryLightboxNext {
    right: 28px;
}

.galleryLightboxCaption {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    color: white;
    font-size: 12px;
    padding-top: 8px;
}


/* =========================================================
   GALLERY PAGE - 11 RESPONSIVE
   ========================================================= */

@media (max-width: 1299px) {
    .galleryMainGrid {
        grid-template-columns: 1fr;
    }

    .galleryPreviewPanel {
        position: relative;
        top: auto;
    }

    .galleryAlbumGrid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 1199px) {
    .galleryContentWrap {
        max-width: calc(100vw - 32px);
    }

    .galleryIntroGrid {
        grid-template-columns: 1fr 1fr;
    }

    .galleryIntroItem:nth-child(2) {
        border-right: none;
    }

    .galleryRecommendedScroller {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding-right: 0;
    }

    .galleryRecommendedArrow {
        display: none;
    }

    .galleryToolbar {
        grid-template-columns: 1fr 1fr;
    }

    .gallerySortButtons {
        grid-column: 1 / -1;
    }

    .galleryDetailGrid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .galleryContentWrap {
        max-width: calc(100vw - 24px);
    }

    .galleryIntroGrid {
        grid-template-columns: 1fr;
    }

    .galleryIntroItem {
        border-right: none;
        border-bottom: 1px solid #dde4ee;
    }

        .galleryIntroItem:last-child {
            border-bottom: none;
        }

    .galleryRecommendedScroller {
        grid-template-columns: 1fr;
    }

    .galleryToolbar {
        grid-template-columns: 1fr;
    }

    .gallerySortButtons {
        grid-template-columns: 1fr;
    }

    .gallerySortBtn {
        border-right: none;
        border-bottom: 1px solid #cfd7e2;
    }

        .gallerySortBtn:last-child {
            border-bottom: none;
        }

    .galleryAlbumGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .galleryPreviewImageWrap {
        height: 240px;
    }

    .galleryPreviewThumbs {
        grid-template-columns: repeat(3, 1fr);
    }

    .galleryDetailHeader {
        display: block;
    }

    .galleryDetailMeta {
        text-align: left;
        margin-top: 16px;
    }

    .galleryDetailGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .galleryPhotoCard img {
        height: 140px;
    }

    .galleryLightboxImageWrap {
        max-width: calc(100vw - 32px);
    }

    .galleryLightboxNav {
        width: 44px;
        font-size: 48px;
    }

    .galleryLightboxPrev {
        left: 4px;
    }

    .galleryLightboxNext {
        right: 4px;
    }
}

@media (max-width: 430px) {
    .galleryAlbumGrid {
        grid-template-columns: 1fr;
    }

    .galleryPreviewImageWrap {
        height: 205px;
    }

    .galleryDetailGrid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   GALLERY PAGE - FIXES / VIDEOS / ALL ALBUMS
   ========================================================= */

.galleryMoreLink {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

    .galleryMoreLink:hover {
        text-decoration: none;
        color: #5ea443;
    }

.galleryAllAlbumsPage {
    padding: 28px 0 44px;
    background: #f4f6f9;
}

.galleryAllAlbumsGrid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
}

.galleryPreviewVideoHost {
    position: absolute;
    inset: 0;
    background: #001b41;
    z-index: 1;
}

    .galleryPreviewVideoHost video,
    .galleryPreviewVideoHost iframe {
        width: 100%;
        height: 100%;
        display: block;
        border: none;
    }

.galleryVideoGrid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.galleryVideoCard {
    display: block;
    color: #002558;
    text-decoration: none;
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 7px 18px rgba(0,0,0,.08);
    transition: transform .2s ease, box-shadow .2s ease;
}

    .galleryVideoCard:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 26px rgba(0,0,0,.12);
        text-decoration: none;
    }

.galleryVideoThumb {
    position: relative;
    display: block;
    height: 96px;
    overflow: hidden;
    background: #002558;
}

    .galleryVideoThumb video,
    .galleryVideoThumb iframe {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border: none;
        display: block;
    }

.galleryVideoPlaceholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(0,37,88,.92), rgba(0,18,45,.96));
    color: rgba(255,255,255,.82);
    font-weight: 800;
    letter-spacing: .08em;
}

.galleryVideoPlay {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 46px;
    height: 46px;
    margin-left: -23px;
    margin-top: -23px;
    border-radius: 50%;
    background: rgba(255,255,255,.88);
    color: #002558;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 800;
    box-shadow: 0 8px 22px rgba(0,0,0,.22);
}

.galleryVideoInfo {
    display: block;
    padding: 10px 12px 12px;
}

    .galleryVideoInfo strong {
        display: block;
        color: #002558;
        font-size: 13px;
        line-height: 1.2;
        font-weight: 800;
        min-height: 32px;
    }

    .galleryVideoInfo small {
        display: block;
        color: #5ea443;
        font-size: 12px;
        font-weight: 800;
        margin-top: 4px;
    }

@media (max-width: 1199px) {
    .galleryAllAlbumsGrid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .galleryVideoGrid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .galleryAllAlbumsGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .galleryVideoGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 430px) {
    .galleryAllAlbumsGrid,
    .galleryVideoGrid {
        grid-template-columns: 1fr;
    }
}

/* konec stylu pro Gallery page */

/* =========================================================
   BAZAAR PAGE - 01 BASE
   ========================================================= */

.bazaarPage {
    font-family: Tahoma, Arial, sans-serif;
    background: #f4f6f9;
    color: #002558;
    overflow-x: hidden;
}

    .bazaarPage * {
        box-sizing: border-box;
    }

.bazaarContentWrap {
    width: 1680px;
    max-width: calc(100vw - 48px);
    margin: 0 auto;
}


/* =========================================================
   BAZAAR PAGE - 02 HERO
   ========================================================= */

.bazaarHero {
    min-height: 215px;
    position: relative;
    color: white;
    overflow: hidden;
    background-color: #002558;
    background-image: linear-gradient(90deg, rgba(0,18,45,.96) 0%, rgba(0,37,88,.82) 40%, rgba(0,37,88,.28) 72%, rgba(0,37,88,.06) 100%), var(--bazaarHeroBg);
    background-size: cover;
    background-position: center center;
    border-top: 3px solid #91cf45;
}

    .bazaarHero:after {
        content: "";
        position: absolute;
        right: 6%;
        top: 50%;
        width: 360px;
        height: 360px;
        transform: translateY(-50%);
        background: var(--bazaarLogo) center center / contain no-repeat;
        opacity: .10;
        pointer-events: none;
    }

.bazaarHeroInner {
    width: 1680px;
    max-width: calc(100vw - 48px);
    min-height: 215px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 34px;
    position: relative;
    z-index: 2;
}

.bazaarHeroLogo {
    width: 136px;
    height: 136px;
    object-fit: contain;
    flex: 0 0 auto;
    filter: drop-shadow(0 10px 20px rgba(0,0,0,.30));
}

.bazaarHeroText h1 {
    margin: 0;
    color: white;
    font-size: 58px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    text-shadow: 0 4px 16px rgba(0,0,0,.35);
}

.bazaarHeroLine {
    width: 210px;
    height: 4px;
    background: #91cf45;
    margin: 18px 0 14px;
}

.bazaarHeroText p {
    margin: 0;
    color: rgba(255,255,255,.96);
    font-size: 20px;
    line-height: 1.4;
    font-weight: 500;
}


/* =========================================================
   BAZAAR PAGE - 03 TOOLBAR
   ========================================================= */

.bazaarListPage {
    padding-bottom: 44px;
}

.bazaarToolbarSection {
    margin-top: 16px;
    position: relative;
    z-index: 4;
}

.bazaarToolbar {
    background: rgba(255,255,255,.97);
    border: 1px solid #dfe4ea;
    border-radius: 10px;
    box-shadow: 0 12px 34px rgba(0,0,0,.14);
    padding: 18px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 22px;
    align-items: stretch;
}

.bazaarToolbarFilters {
    min-width: 0;
}

.bazaarToolbarTop {
    display: grid;
    grid-template-columns: minmax(320px, 2.1fr) minmax(185px, .9fr) minmax(150px, .7fr) minmax(150px, .7fr);
    gap: 14px;
    margin-bottom: 14px;
}

.bazaarSearchBox,
.bazaarSelect,
.bazaarPriceBox {
    height: 46px;
    border: 1px solid #cfd7e2;
    border-radius: 6px;
    background: white;
    color: #002558;
}

.bazaarSearchBox {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
}

    .bazaarSearchBox input,
    .bazaarPriceBox input,
    .bazaarSelect {
        width: 100%;
        height: 44px;
        border: none;
        background: transparent;
        outline: none;
        color: #002558;
        font-family: Tahoma, Arial, sans-serif;
        font-size: 14px;
        padding: 0 14px;
    }

.bazaarSelect {
    font-weight: 700;
    border: 1px solid #cfd7e2;
}

.bazaarPriceBox {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    align-items: center;
}

    .bazaarPriceBox span {
        color: #333;
        font-size: 13px;
        font-weight: 800;
        text-align: center;
    }

.bazaarSearchIcon,
.bazaarCategoryIcon,
.bazaarSellerIcon,
.bazaarHowIcon {
    display: inline-block;
    position: relative;
}

    .bazaarSearchIcon:before,
    .bazaarCategoryIcon:before,
    .bazaarSellerIcon:before,
    .bazaarHowIcon:before {
        content: "";
        position: absolute;
        inset: 0;
        background: currentColor;
        mask-position: center;
        mask-repeat: no-repeat;
        mask-size: contain;
        -webkit-mask-position: center;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
    }

.bazaarSearchIcon {
    width: 22px;
    height: 22px;
    color: #7d8da5;
    margin-left: 15px;
}

    .bazaarSearchIcon:before,
    .bazaarIconSearch:before {
        mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M10 2a8 8 0 0 1 6.32 12.9l5.39 5.39-1.42 1.42-5.39-5.39A8 8 0 1 1 10 2zm0 2a6 6 0 1 0 0 12 6 6 0 0 0 0-12z'/%3E%3C/svg%3E");
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M10 2a8 8 0 0 1 6.32 12.9l5.39 5.39-1.42 1.42-5.39-5.39A8 8 0 1 1 10 2zm0 2a6 6 0 1 0 0 12 6 6 0 0 0 0-12z'/%3E%3C/svg%3E");
    }

.bazaarCategoryFilters {
    display: grid;
    grid-template-columns: repeat(6, minmax(110px, 1fr));
    gap: 14px;
}

.bazaarCategoryButton {
    height: 44px;
    border: 1px solid #cfd7e2;
    border-radius: 7px;
    background: white;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: background .18s ease, color .18s ease, transform .18s ease;
}

    .bazaarCategoryButton:hover,
    .bazaarCategoryButton.active {
        background: #002558;
        color: white;
    }

    .bazaarCategoryButton:hover {
        transform: translateY(-1px);
    }

.bazaarCategoryIcon {
    width: 22px;
    height: 22px;
    color: currentColor;
}

.bazaarIconAll:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 4h7v7H4V4zm9 0h7v7h-7V4zM4 13h7v7H4v-7zm9 0h7v7h-7v-7z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 4h7v7H4V4zm9 0h7v7h-7V4zM4 13h7v7H4v-7zm9 0h7v7h-7v-7z'/%3E%3C/svg%3E");
}

.bazaarIconShirt:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m8 3 2 2h4l2-2 5 3-2 5-2-1v11H7V10l-2 1-2-5 5-3z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m8 3 2 2h4l2-2 5 3-2 5-2-1v11H7V10l-2 1-2-5 5-3z'/%3E%3C/svg%3E");
}

.bazaarIconBoot:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 15c4 0 6-2 6-7h4c0 4 2 6 6 7 1.4.3 2 1.2 2 2.5V20H3v-3c0-1.2.3-2 1-2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 15c4 0 6-2 6-7h4c0 4 2 6 6 7 1.4.3 2 1.2 2 2.5V20H3v-3c0-1.2.3-2 1-2z'/%3E%3C/svg%3E");
}

.bazaarIconBag:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M7 7V5a5 5 0 0 1 10 0v2h3v14H4V7h3zm2 0h6V5a3 3 0 0 0-6 0v2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M7 7V5a5 5 0 0 1 10 0v2h3v14H4V7h3zm2 0h6V5a3 3 0 0 0-6 0v2z'/%3E%3C/svg%3E");
}

.bazaarIconBox:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m12 2 9 4v12l-9 4-9-4V6l9-4zm0 2.2L5.7 7 12 9.8 18.3 7 12 4.2zM5 8.7v8l6 2.7v-8L5 8.7zm14 0-6 2.7v8l6-2.7v-8z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m12 2 9 4v12l-9 4-9-4V6l9-4zm0 2.2L5.7 7 12 9.8 18.3 7 12 4.2zM5 8.7v8l6 2.7v-8L5 8.7zm14 0-6 2.7v8l6-2.7v-8z'/%3E%3C/svg%3E");
}

.bazaarToolbarAction {
    border-left: 1px solid #dfe4ea;
    padding-left: 22px;
    display: flex;
}

.bazaarAddButton {
    width: 100%;
    min-height: 104px;
    border-radius: 7px;
    background: linear-gradient(180deg, #5eb33d 0%, #4da230 100%);
    color: white;
    text-decoration: none;
    font-weight: 800;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    justify-content: center;
    padding: 20px 26px;
    box-shadow: 0 10px 22px rgba(74,160,47,.35);
}

    .bazaarAddButton:hover {
        color: white;
        text-decoration: none;
        background: linear-gradient(180deg, #69bf47 0%, #55aa34 100%);
    }

.bazaarAddIcon {
    color: white;
    font-size: 54px;
    line-height: 1;
    font-weight: 300;
}

.bazaarAddButton strong {
    color: white;
    font-size: 17px;
    line-height: 1.25;
}


/* =========================================================
   BAZAAR PAGE - 04 HOW IT WORKS
   ========================================================= */

.bazaarHowSection {
    padding: 16px 0 12px;
}

.bazaarHowBox {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    padding: 14px 20px;
    display: grid;
    grid-template-columns: 150px repeat(5, minmax(0, 1fr));
    gap: 18px;
    align-items: center;
    box-shadow: 0 7px 20px rgba(0,0,0,.06);
}

.bazaarHowTitle strong {
    display: block;
    color: #5ea443;
    font-size: 25px;
    line-height: 1.05;
    font-weight: 800;
}

.bazaarHowStep {
    min-height: 74px;
    display: grid;
    grid-template-columns: 52px 24px minmax(0,1fr);
    gap: 10px;
    align-items: center;
    border-left: 1px dashed #b8d7a6;
    padding-left: 18px;
}

    .bazaarHowStep:first-of-type {
        border-left: none;
    }

.bazaarHowIcon {
    width: 42px;
    height: 42px;
    color: #002558;
}

.bazaarHowStep b {
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: #5ea443;
    color: white;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bazaarHowStep p {
    margin: 0;
    color: #333;
    font-size: 13px;
    line-height: 1.25;
}

.bazaarHowIconEdit:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 4h10v2H6v12h12v-8h2v10H4V4zm14.7-.3 1.6 1.6-9.4 9.4H9.3v-1.6l9.4-9.4z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 4h10v2H6v12h12v-8h2v10H4V4zm14.7-.3 1.6 1.6-9.4 9.4H9.3v-1.6l9.4-9.4z'/%3E%3C/svg%3E");
}

.bazaarHowIconTag:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m21 11-9 9-9-9V3h8l10 8zm-14-6a2 2 0 1 0 0 4 2 2 0 0 0 0-4z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m21 11-9 9-9-9V3h8l10 8zm-14-6a2 2 0 1 0 0 4 2 2 0 0 0 0-4z'/%3E%3C/svg%3E");
}

.bazaarHowIconMail:before,
.bazaarSellerIconMail:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M3 5h18v14H3V5zm2.1 2 6.9 5.1L18.9 7H5.1zM5 17h14V8.9l-7 5.2-7-5.2V17z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M3 5h18v14H3V5zm2.1 2 6.9 5.1L18.9 7H5.1zM5 17h14V8.9l-7 5.2-7-5.2V17z'/%3E%3C/svg%3E");
}

.bazaarHowIconHandshake:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M8 11 5 8l4-4 3 3h4l5 5-4 4-2-2-5 5-6-6 4-2z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M8 11 5 8l4-4 3 3h4l5 5-4 4-2-2-5 5-6-6 4-2z'/%3E%3C/svg%3E");
}

.bazaarHowIconCheck:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1.2 14.2-4-4 1.4-1.4 2.6 2.6 5-5 1.4 1.4-6.4 6.4z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1.2 14.2-4-4 1.4-1.4 2.6 2.6 5-5 1.4 1.4-6.4 6.4z'/%3E%3C/svg%3E");
}


/* =========================================================
   BAZAAR PAGE - 05 ITEMS + PREVIEW
   ========================================================= */

.bazaarItemsSection {
    padding: 0 0 36px;
}

.bazaarMainGrid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 650px;
    gap: 22px;
    align-items: start;
}

.bazaarCardsGrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    min-width: 0;
}

.bazaarItemCard {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(0,0,0,.08);
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

    .bazaarItemCard:hover,
    .bazaarItemCard.active {
        transform: translateY(-3px);
        box-shadow: 0 14px 30px rgba(0,0,0,.13);
        border-color: rgba(145,207,69,.90);
    }

.bazaarCardPhoto {
    height: 185px;
    position: relative;
    overflow: hidden;
    background: #002558;
}

    .bazaarCardPhoto img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        transition: transform .25s ease;
    }

.bazaarItemCard:hover .bazaarCardPhoto img {
    transform: scale(1.04);
}

.bazaarCardNew {
    position: absolute;
    left: 10px;
    top: 10px;
    background: #5ea443;
    color: white;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 800;
    padding: 5px 9px;
    z-index: 2;
}

.bazaarCardHeart {
    display: none !important;
}

.bazaarCardBody {
    padding: 12px 13px 13px;
}

.bazaarCardTitleLine {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

    .bazaarCardTitleLine h2 {
        margin: 0;
        color: #002558;
        font-size: 15px;
        line-height: 1.25;
        font-weight: 800;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.bazaarBadge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    border-radius: 5px;
    padding: 3px 8px;
    color: white;
    background: #3178c6;
    font-size: 11px;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

    .bazaarBadge.cat-clothes {
        background: #5ea443;
    }

    .bazaarBadge.cat-shoes {
        background: #3178c6;
    }

    .bazaarBadge.cat-accessories {
        background: #4d93d9;
    }

    .bazaarBadge.cat-other {
        background: #7d8da5;
    }

    .bazaarBadge.cat-lost {
        background: #d69a00;
    }

.bazaarCardMeta {
    color: #333;
    font-size: 12px;
    line-height: 1.35;
    margin-top: 8px;
    min-height: 32px;
}

.bazaarOwnerButton {
    margin-top: 9px;
    padding: 0;
    border: none;
    background: transparent;
    color: #1f73c9;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 800;
    cursor: pointer;
}

    .bazaarOwnerButton span {
        display: inline-block;
        width: 13px;
        height: 13px;
        margin-right: 5px;
        vertical-align: -2px;
        color: #1f73c9;
        position: relative;
    }

        .bazaarOwnerButton span:before,
        .bazaarSellerIconUser:before {
            mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 12a5 5 0 1 0-5-5 5 5 0 0 0 5 5zm0 2c-4.4 0-8 2.3-8 5v1h16v-1c0-2.7-3.6-5-8-5z'/%3E%3C/svg%3E");
            -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 12a5 5 0 1 0-5-5 5 5 0 0 0 5 5zm0 2c-4.4 0-8 2.3-8 5v1h16v-1c0-2.7-3.6-5-8-5z'/%3E%3C/svg%3E");
        }

        .bazaarOwnerButton span:before {
            content: "";
            position: absolute;
            inset: 0;
            background: currentColor;
            mask-position: center;
            mask-repeat: no-repeat;
            mask-size: contain;
            -webkit-mask-position: center;
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-size: contain;
        }

.bazaarCardFooter {
    margin-top: 7px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
}

    .bazaarCardFooter time {
        color: #333;
        font-size: 12px;
    }

    .bazaarCardFooter strong {
        color: #002558;
        font-size: 20px;
        font-weight: 800;
        white-space: nowrap;
    }

.bazaarPreviewPanel {
    position: sticky;
    top: 60px;
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 12px 34px rgba(0,0,0,.12);
}

.bazaarPreviewPhoto {
    height: 410px;
    position: relative;
    background: #002558;
    overflow: hidden;
}

    .bazaarPreviewPhoto img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.bazaarPreviewHeart {
    display: none !important;
}

.bazaarPreviewContent {
    padding: 22px 24px 24px;
}

.bazaarPreviewHeader {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: start;
}

    .bazaarPreviewHeader h2 {
        margin: 0;
        color: #002558;
        font-size: 25px;
        line-height: 1.2;
        font-weight: 800;
    }

    .bazaarPreviewHeader strong {
        color: #002558;
        font-size: 25px;
        line-height: 1.2;
        font-weight: 800;
        white-space: nowrap;
    }

.bazaarPreviewMeta {
    margin-top: 13px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e1e6ee;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #333;
    font-size: 13px;
}

.bazaarPreviewSeller {
    padding: 16px 0 14px;
    border-bottom: 1px solid #e1e6ee;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 18px;
}

    .bazaarPreviewSeller div:first-child {
        grid-column: 1 / -1;
    }

    .bazaarPreviewSeller div {
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr);
        gap: 9px;
        align-items: center;
    }

.bazaarSellerIcon {
    width: 18px;
    height: 18px;
    color: #1f73c9;
}

.bazaarSellerIconPhone:before {
    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.58 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.4 11.4 0 0 0 .58 3.6 1 1 0 0 1-.25 1L6.6 10.8z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.58 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.4 11.4 0 0 0 .58 3.6 1 1 0 0 1-.25 1L6.6 10.8z'/%3E%3C/svg%3E");
}

.bazaarPreviewSeller a,
.bazaarPreviewSeller button {
    border: none;
    background: transparent;
    padding: 0;
    color: #002558;
    text-decoration: none;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.25;
    font-weight: 700;
    text-align: left;
    overflow-wrap: anywhere;
    cursor: pointer;
}

    .bazaarPreviewSeller a:hover,
    .bazaarPreviewSeller button:hover {
        color: #5ea443;
        text-decoration: none;
    }

.bazaarPreviewDescription {
    margin: 17px 0 20px;
    color: #333;
    font-size: 14px;
    line-height: 1.5;
}

.bazaarContactButton {
    width: 100%;
    min-height: 54px;
    border-radius: 7px;
    background: linear-gradient(180deg, #5eb33d 0%, #4da230 100%);
    color: white;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 14px 18px;
    font-size: 16px;
    font-weight: 800;
    box-shadow: 0 10px 22px rgba(74,160,47,.24);
}

    .bazaarContactButton:hover {
        color: white;
        text-decoration: none;
        background: linear-gradient(180deg, #69bf47 0%, #55aa34 100%);
    }

.bazaarPreviewEditButton {
    display: block;
    margin-top: 12px;
    color: #002558;
    text-align: center;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

    .bazaarPreviewEditButton:hover {
        color: #5ea443;
        text-decoration: none;
    }

.bazaarEmptyBox {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    padding: 28px;
    margin-bottom: 18px;
    text-align: center;
    box-shadow: 0 7px 20px rgba(0,0,0,.06);
}

    .bazaarEmptyBox strong {
        display: block;
        color: #002558;
        font-size: 20px;
        margin-bottom: 6px;
    }

    .bazaarEmptyBox span {
        color: #333;
        font-size: 14px;
    }


/* =========================================================
   BAZAAR PAGE - 06 FORM
   ========================================================= */

.bazaarFormPage {
    padding: 34px 0 48px;
}

.bazaarFormHeader {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 22px;
    box-shadow: 0 8px 22px rgba(0,0,0,.06);
}

.bazaarBackLink {
    color: #002558;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
}

    .bazaarBackLink:hover {
        color: #5ea443;
        text-decoration: none;
    }

.bazaarFormHeader h2 {
    margin: 16px 0 6px;
    color: #002558;
    font-size: 32px;
    font-weight: 800;
}

.bazaarFormHeader p {
    margin: 0;
    color: #333;
    font-size: 14px;
    line-height: 1.45;
}

.bazaarFormGrid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 440px;
    gap: 24px;
    align-items: start;
}

.bazaarFormFields,
.bazaarUploadBox {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 8px 22px rgba(0,0,0,.06);
}

.bazaarFormRow {
    margin-bottom: 18px;
}

    .bazaarFormRow.two {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
    }

    .bazaarFormRow label,
    .bazaarUploadBox label {
        display: block;
        margin-bottom: 7px;
        color: #002558;
        font-size: 13px;
        font-weight: 800;
    }

.bazaarInput {
    width: 100%;
    height: 40px;
    border: 1px solid #cfd7e2;
    border-radius: 5px;
    background: white;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 14px;
    padding: 0 12px;
    outline: none;
}

    .bazaarInput:focus {
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145,207,69,.18);
    }

.bazaarTextarea {
    height: 150px;
    padding: 10px 12px;
    resize: vertical;
}

.bazaarDropZone {
    position: relative;
    border: 2px dashed #b8d7a6;
    border-radius: 9px;
    background: #f8fbf5;
    min-height: 330px;
    overflow: hidden;
    cursor: pointer;
}

    .bazaarDropZone.drag {
        border-color: #5ea443;
        background: #eef8e8;
    }

.bazaarFileInput {
    position: absolute;
    inset: 0;
    opacity: 0;
    z-index: 3;
    cursor: pointer;
}

.bazaarDropInner {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto auto;
    align-items: center;
    justify-items: center;
    padding: 18px;
    text-align: center;
    pointer-events: none;
}

    .bazaarDropInner img {
        width: 100%;
        height: 210px;
        object-fit: cover;
        border-radius: 6px;
        background: white;
    }

    .bazaarDropInner strong {
        display: block;
        color: #002558;
        font-size: 17px;
        margin-top: 14px;
    }

    .bazaarDropInner span {
        display: block;
        color: #333;
        font-size: 12px;
        margin-top: 5px;
    }

.bazaarPhotoHint {
    display: block;
    color: #333;
    font-size: 12px;
    line-height: 1.35;
    margin-top: 10px;
}

.bazaarFormActions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 18px;
}

.bazaarSaveButton,
.bazaarDeleteButton {
    min-height: 48px;
    border: none;
    border-radius: 6px;
    color: white;
    font-family: Tahoma, Arial, sans-serif;
    font-weight: 800;
    cursor: pointer;
}

.bazaarSaveButton {
    background: #5ea443;
    box-shadow: inset 0 -4px 0 rgba(0,37,88,.25);
}

.bazaarDeleteButton {
    background: #c73535;
}

.bazaarSaveButton:hover {
    background: #4f9635;
}

.bazaarDeleteButton:hover {
    background: #aa2727;
}


/* =========================================================
   BAZAAR PAGE - 07 MODALS
   ========================================================= */

.bazaarHiddenButton {
    display: none;
}

.bazaarModalBg {
    background: rgba(0,18,45,.72);
}

.bazaarPasswordModal,
.bazaarMessageModal {
    width: 420px;
    max-width: calc(100vw - 32px);
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(0,0,0,.35);
}

.bazaarModalHeader {
    background: #002558;
    color: white;
    text-align: center;
    padding: 15px 20px;
    font-size: 18px;
    font-weight: 800;
}

.bazaarPasswordBody,
.bazaarMessageBody {
    padding: 24px;
}

.bazaarPasswordIcon {
    width: 76px;
    height: 76px;
    border: 5px solid #5ea443;
    color: #5ea443;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
    font-size: 42px;
    line-height: 1;
}

.bazaarPasswordBody label {
    display: block;
    text-align: center;
    color: #002558;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 14px;
}

.bazaarModalMessage {
    display: block;
    margin-top: 10px;
    color: #c73535;
    font-size: 13px;
    font-weight: 800;
    text-align: center;
}

.bazaarModalActions {
    padding: 0 24px 24px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.bazaarMessageModal .bazaarModalActions {
    grid-template-columns: 1fr;
}

.bazaarModalButton {
    height: 42px;
    border: none;
    border-radius: 4px;
    background: #002558;
    color: white;
    font-family: Tahoma, Arial, sans-serif;
    font-weight: 800;
    cursor: pointer;
}

    .bazaarModalButton.primary {
        background: #5ea443;
    }


/* =========================================================
   BAZAAR PAGE - 08 RESPONSIVE
   ========================================================= */

@media (max-width: 1199px) {
    .bazaarContentWrap,
    .bazaarHeroInner {
        max-width: calc(100vw - 32px);
    }

    .bazaarToolbar {
        grid-template-columns: 1fr;
    }

    .bazaarToolbarAction {
        border-left: none;
        border-top: 1px solid #dfe4ea;
        padding-left: 0;
        padding-top: 16px;
    }

    .bazaarAddButton {
        min-height: 74px;
    }

    .bazaarToolbarTop {
        grid-template-columns: 1fr 1fr;
    }

    .bazaarCategoryFilters {
        grid-template-columns: repeat(3, 1fr);
    }

    .bazaarHowBox {
        grid-template-columns: 1fr 1fr;
    }

    .bazaarHowTitle {
        grid-column: 1 / -1;
    }

    .bazaarHowStep {
        border-left: none;
        border-top: 1px dashed #b8d7a6;
        padding-left: 0;
        padding-top: 14px;
    }

    .bazaarFormGrid {
        grid-template-columns: 1fr;
    }

    .bazaarDropZone {
        min-height: 300px;
    }
}

@media (max-width: 850px) {
    .bazaarFormRow.two {
        grid-template-columns: 1fr;
    }
}



/* =========================================================
   BAZAAR PAGE - FINAL TUNING v3
   3 karty vlevo + větší sticky detail vpravo + mobilní rozbalení
   ========================================================= */

/* sticky občas nefunguje kvůli overflow na rodičích */
.bazaarPage,
.bazaarListPage,
.bazaarItemsSection,
.bazaarContentWrap,
.bazaarMainGrid {
    overflow: visible !important;
}

/* srdíčka pryč */
.bazaarCardHeart,
.bazaarPreviewHeart {
    display: none !important;
}


/* =========================================================
   ŠIROKÉ ZOBRAZENÍ: 3 karty vlevo + velký náhled vpravo
   ========================================================= */

@media (min-width: 1400px) {
    .bazaarMainGrid {
        grid-template-columns: minmax(0, 1fr) 560px !important;
        gap: 24px !important;
        align-items: start !important;
    }

    .bazaarCardsGrid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 18px !important;
    }

    .bazaarCardPhoto {
        height: 215px !important;
    }

    .bazaarPreviewPanel {
        position: sticky !important;
        top: 60px !important;
        align-self: start !important;
        z-index: 3 !important;
    }

    .bazaarPreviewPhoto {
        height: 450px !important;
    }
}


/* =========================================================
   MENŠÍ DESKTOP: 2 karty vlevo + stále náhled vpravo
   ========================================================= */

@media (min-width: 1200px) and (max-width: 1399px) {
    .bazaarMainGrid {
        grid-template-columns: minmax(0, 1fr) 500px !important;
        gap: 22px !important;
        align-items: start !important;
    }

    .bazaarCardsGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important;
    }

    .bazaarCardPhoto {
        height: 210px !important;
    }

    .bazaarPreviewPanel {
        position: sticky !important;
        top: 60px !important;
        align-self: start !important;
        z-index: 3 !important;
    }

    .bazaarPreviewPhoto {
        height: 410px !important;
    }
}


/* =========================================================
   TABLET NA ŠÍŘKU: ještě necháme detail vpravo, ale kompaktněji
   ========================================================= */

@media (min-width: 1000px) and (max-width: 1199px) {
    .bazaarMainGrid {
        grid-template-columns: minmax(0, 1fr) 430px !important;
        gap: 20px !important;
        align-items: start !important;
    }

    .bazaarCardsGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .bazaarCardPhoto {
        height: 200px !important;
    }

    .bazaarPreviewPanel {
        display: block !important;
        position: sticky !important;
        top: 60px !important;
        order: initial !important;
        align-self: start !important;
        z-index: 3 !important;
    }

    .bazaarPreviewPhoto {
        height: 330px !important;
    }

    .bazaarPreviewContent {
        padding: 18px !important;
    }

    .bazaarPreviewHeader h2,
    .bazaarPreviewHeader strong {
        font-size: 22px !important;
    }
}


/* =========================================================
   TABLET / MOBIL: náhled vpravo pryč, karta se rozbalí po kliknutí
   ========================================================= */

@media (max-width: 999px) {
    .bazaarMainGrid {
        grid-template-columns: 1fr !important;
    }

    .bazaarPreviewPanel {
        display: none !important;
    }

    .bazaarCardsGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .bazaarCardPhoto {
        height: 210px !important;
    }

    .bazaarItemCard.mobileExpanded {
        grid-column: 1 / -1 !important;
        transform: none !important;
        border-color: #91cf45 !important;
        box-shadow: 0 14px 32px rgba(0,0,0,.14) !important;
    }

        .bazaarItemCard.mobileExpanded .bazaarCardPhoto {
            height: 360px !important;
        }

    .bazaarMobileDetail {
        display: none;
        border-top: 1px solid #e1e7ef;
        padding: 0 16px 18px;
        background: white;
    }

    .bazaarItemCard.mobileExpanded .bazaarMobileDetail {
        display: block;
    }

    .bazaarMobileDescription {
        color: #333;
        font-size: 14px;
        line-height: 1.5;
        padding: 14px 0;
    }

    .bazaarMobileSeller {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        margin-bottom: 14px;
    }

        .bazaarMobileSeller div {
            background: #f4f6f9;
            border-radius: 6px;
            padding: 10px 11px;
            min-width: 0;
        }

        .bazaarMobileSeller b {
            display: block;
            color: #002558;
            font-size: 12px;
            margin-bottom: 4px;
        }

        .bazaarMobileSeller span {
            display: block;
            color: #333;
            font-size: 13px;
            overflow-wrap: anywhere;
        }

    .bazaarMobileContactButton {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
        border-radius: 6px;
        background: #5ea443;
        color: white;
        text-decoration: none;
        font-size: 13px;
        font-weight: 800;
        padding: 10px 14px;
        text-align: center;
    }

        .bazaarMobileContactButton:hover {
            color: white;
            text-decoration: none;
            background: #4b8f36;
        }
}


/* =========================================================
   HAMBURGER / MOBIL: schovat Jak to funguje
   ========================================================= */

@media (max-width: 850px) {
    .bazaarHowSection {
        display: none !important;
    }

    .bazaarHero {
        min-height: 230px;
    }

    .bazaarHeroInner {
        min-height: 230px;
        gap: 18px;
    }

    .bazaarHeroLogo {
        width: 95px;
        height: 95px;
    }

    .bazaarHeroText h1 {
        font-size: 42px;
    }

    .bazaarHeroLine {
        width: 160px;
        margin: 13px 0 10px;
    }

    .bazaarHeroText p {
        font-size: 15px;
    }

    .bazaarToolbarTop {
        grid-template-columns: 1fr;
    }

    .bazaarCategoryFilters {
        grid-template-columns: 1fr 1fr;
    }

    .bazaarToolbarAction {
        border-left: none !important;
        border-top: 1px solid #dfe4ea !important;
        padding-left: 0 !important;
        padding-top: 16px !important;
    }

    .bazaarAddButton {
        min-height: 76px !important;
    }
}


/* =========================================================
   ÚZKÝ MOBIL
   ========================================================= */

@media (max-width: 560px) {
    .bazaarContentWrap,
    .bazaarHeroInner {
        max-width: calc(100vw - 24px);
    }

    .bazaarHeroInner {
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
        padding: 22px 0;
    }

    .bazaarToolbar {
        padding: 12px;
    }

    .bazaarCategoryFilters,
    .bazaarCardsGrid {
        grid-template-columns: 1fr !important;
    }

    .bazaarAddButton {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .bazaarCardPhoto {
        height: 235px !important;
    }

    .bazaarItemCard.mobileExpanded .bazaarCardPhoto {
        height: 330px !important;
    }

    .bazaarMobileSeller {
        grid-template-columns: 1fr;
    }

    .bazaarPreviewHeader {
        grid-template-columns: 1fr;
    }

        .bazaarPreviewHeader strong {
            font-size: 24px;
        }

    .bazaarFormHeader h2 {
        font-size: 25px;
    }
}

/* =========================================================
   BAZAAR PAGE - PHOTO LIGHTBOX
   ========================================================= */

.bazaarPhotoLightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 28px;
    background: rgba(0, 0, 0, .84);
    cursor: zoom-out;
}

    .bazaarPhotoLightbox.open {
        display: flex;
    }

    .bazaarPhotoLightbox img {
        max-width: calc(100vw - 56px);
        max-height: calc(100vh - 56px);
        display: block;
        object-fit: contain;
        border-radius: 4px;
        box-shadow: 0 20px 70px rgba(0, 0, 0, .55);
    }

.bazaarLightboxOpen {
    overflow: hidden;
}

.bazaarPreviewImage {
    cursor: zoom-in;
}

/* pro informační box */
.bazaarContactInfoBox {
    margin-top: 18px;
    padding: 16px 18px;
    border-radius: 7px;
    background: #f4f9ef;
    border: 1px solid rgba(145, 207, 69, .55);
    color: #002558;
}

    .bazaarContactInfoBox strong {
        display: block;
        font-size: 15px;
        font-weight: 800;
        margin-bottom: 6px;
    }

    .bazaarContactInfoBox span {
        display: block;
        color: #333;
        font-size: 13px;
        line-height: 1.45;
    }

/* konec stylu pro Bazaar page */

/* =========================================================
   NEWS PAGE - DARK SPORT DESIGN
   ========================================================= */

.newsPage,
.newsDetailPage {
    font-family: Tahoma, Arial, sans-serif;
    background: #061a36;
    color: #ffffff;
    overflow-x: hidden;
}

    .newsPage *,
    .newsDetailPage * {
        box-sizing: border-box;
    }

.newsContentWrap {
    width: 1420px;
    max-width: calc(100vw - 48px);
    margin: 0 auto;
}


/* HERO */

.newsHero {
    position: relative;
    min-height: 310px;
    background: linear-gradient(90deg, rgba(0,20,48,.96) 0%, rgba(0,20,48,.78) 52%, rgba(0,20,48,.35) 100%), url("Images/coaches-hero-bg.jpg") center center / cover no-repeat;
}

.newsHeroOverlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 70% 20%, rgba(145,207,69,.12), transparent 28%), linear-gradient(180deg, rgba(0,37,88,.12), rgba(0,15,35,.72));
}

.newsHeroInner {
    position: relative;
    z-index: 2;
    width: 1420px;
    max-width: calc(100vw - 48px);
    min-height: 310px;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.newsHeroText h1 {
    margin: 0;
    color: white;
    font-size: 58px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-shadow: 0 6px 18px rgba(0,0,0,.45);
}

.newsHeroText span {
    display: block;
    width: 92px;
    height: 4px;
    background: #91cf45;
    margin: 18px 0;
}

.newsHeroText p {
    margin: 0;
    max-width: 560px;
    color: white;
    font-size: 18px;
    line-height: 1.5;
}


/* FILTER */

.newsFilterSection {
    position: relative;
    z-index: 3;
    margin-top: 16px;
}

.newsFilterBar {
    background: white;
    border-radius: 8px;
    box-shadow: 0 12px 34px rgba(0,0,0,.22);
    padding: 16px;
    display: grid;
    grid-template-columns: minmax(260px, 1.4fr) minmax(180px, .8fr) 160px 160px 170px 140px 110px;
    gap: 12px;
    align-items: center;
}

.newsInput {
    width: 100%;
    height: 42px;
    border: 1px solid #d4dce7;
    border-radius: 4px;
    background: white;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    padding: 0 12px;
    outline: none;
}

    .newsInput:focus {
        border-color: #91cf45;
    }

.newsFilterBtn,
.newsClearBtn {
    height: 42px;
    border: none;
    border-radius: 4px;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.newsFilterBtn {
    background: #002558;
    color: white;
}

.newsClearBtn {
    background: #edf2f7;
    color: #002558;
}

.newsFilterBtn:hover {
    background: #073b7a;
}

.newsClearBtn:hover {
    background: #dfe7ef;
}


/* LIST */

.newsListSection {
    padding: 42px 0 60px;
    background: #061a36;
}

.newsFeaturedCard {
    min-height: 430px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 28px;
    background-position: center center;
    background-size: cover;
    box-shadow: 0 18px 48px rgba(0,0,0,.30);
    display: flex;
    align-items: flex-end;
}

.newsFeaturedContent {
    width: 610px;
    max-width: 100%;
    padding: 42px;
}

.newsTag {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 9px;
    border-radius: 3px;
    color: #002558;
    font-size: 11px;
    line-height: 1;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.newsFeaturedContent small,
.newsCardBody small {
    display: block;
    color: rgba(255,255,255,.82);
    font-size: 13px;
    margin: 15px 0 12px;
}

.newsFeaturedContent h2 {
    margin: 0;
    color: white;
    font-size: 38px;
    line-height: 1.15;
    font-weight: 900;
}

.newsFeaturedContent p {
    color: rgba(255,255,255,.94);
    font-size: 15px;
    line-height: 1.55;
    margin: 18px 0 24px;
}

.newsReadMore,
.newsCardLink,
.newsBackBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 22px;
    border-radius: 3px;
    background: #91cf45;
    color: #002558;
    font-size: 12px;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: .04em;
}

    .newsReadMore:hover,
    .newsCardLink:hover,
    .newsBackBtn:hover {
        background: white;
        color: #002558;
        text-decoration: none;
    }

.newsGrid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.newsCard {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 12px 34px rgba(0,0,0,.20);
    transition: transform .2s ease, box-shadow .2s ease;
}

    .newsCard:hover {
        transform: translateY(-4px);
        box-shadow: 0 18px 44px rgba(0,0,0,.30);
    }

.newsCardImage {
    position: relative;
    display: block;
    height: 205px;
    overflow: hidden;
}

    .newsCardImage img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        opacity: .86;
        transition: transform .25s ease, opacity .25s ease;
    }

.newsCard:hover .newsCardImage img {
    transform: scale(1.05);
    opacity: 1;
}

.newsCardImage .newsTag {
    position: absolute;
    left: 14px;
    top: 14px;
}

.newsCardBody {
    padding: 20px;
}

    .newsCardBody small {
        margin: 0 0 10px;
        color: rgba(255,255,255,.66);
    }

    .newsCardBody h3 {
        margin: 0;
        min-height: 58px;
        font-size: 20px;
        line-height: 1.25;
    }

        .newsCardBody h3 a {
            color: white;
            text-decoration: none;
        }

            .newsCardBody h3 a:hover {
                color: #91cf45;
                text-decoration: none;
            }

    .newsCardBody p {
        min-height: 66px;
        margin: 12px 0 18px;
        color: rgba(255,255,255,.82);
        font-size: 14px;
        line-height: 1.45;
    }

.newsCardLink {
    min-height: 34px;
    padding: 0;
    background: transparent;
    color: #91cf45;
}

    .newsCardLink:hover {
        background: transparent;
        color: white;
    }

.newsEmptyBox {
    background: white;
    border-radius: 8px;
    color: #002558;
    padding: 34px;
    text-align: center;
    box-shadow: 0 12px 34px rgba(0,0,0,.14);
}

    .newsEmptyBox strong {
        display: block;
        font-size: 22px;
        font-weight: 900;
    }

    .newsEmptyBox span {
        display: block;
        margin-top: 8px;
        font-size: 14px;
    }


/* =========================================================
   NEWS DETAIL
   ========================================================= */

.newsDetailHero {
    position: relative;
    min-height: 620px;
    background-position: center center;
    background-size: cover;
}

.newsDetailHeroOverlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 75% 18%, rgba(145,207,69,.10), transparent 30%), linear-gradient(90deg, rgba(0,20,48,.98) 0%, rgba(0,20,48,.83) 48%, rgba(0,20,48,.28) 100%);
}

.newsDetailHeroInner {
    position: relative;
    z-index: 2;
    width: 1420px;
    max-width: calc(100vw - 48px);
    min-height: 620px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.newsBreadcrumb {
    display: flex;
    gap: 9px;
    align-items: center;
    margin-bottom: 28px;
    color: rgba(255,255,255,.78);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

    .newsBreadcrumb a {
        color: rgba(255,255,255,.78);
        text-decoration: none;
    }

        .newsBreadcrumb a:hover {
            color: #91cf45;
        }

.newsDetailTags {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 22px;
}

.newsDetailDate {
    color: white;
    font-size: 14px;
    font-weight: 800;
}

.newsDetailHero h1 {
    max-width: 900px;
    margin: 0;
    color: white;
    font-size: 58px;
    line-height: 1.08;
    font-weight: 900;
    text-shadow: 0 8px 24px rgba(0,0,0,.45);
}

.newsDetailMeta {
    display: flex;
    gap: 18px;
    margin-top: 24px;
    color: rgba(255,255,255,.85);
    font-size: 14px;
}

.newsDetailContentSection {
    padding: 48px 0 70px;
    background: #061a36;
}

.newsDetailGrid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 46px;
    align-items: start;
}

.newsArticleBox {
    color: white;
}

.newsArticleLead {
    border-left: 5px solid #91cf45;
    padding-left: 22px;
    margin-bottom: 30px;
    color: white;
    font-size: 22px;
    line-height: 1.55;
    font-weight: 700;
}

.newsArticleText {
    color: rgba(255,255,255,.88);
    font-size: 16px;
    line-height: 1.75;
}

    .newsArticleText p {
        margin: 0 0 20px;
    }

    .newsArticleText a {
        color: #91cf45;
    }

.newsArticleFooter {
    margin-top: 34px;
    padding: 18px 20px;
    background: rgba(255,255,255,.06);
    border-left: 4px solid #91cf45;
}

    .newsArticleFooter strong {
        display: block;
        color: #91cf45;
        font-size: 12px;
        text-transform: uppercase;
        margin-bottom: 5px;
    }

    .newsArticleFooter span {
        color: white;
        font-size: 15px;
        font-weight: 700;
    }

.newsDetailButtons {
    margin-top: 36px;
}

.newsSidePanel {
    position: sticky;
    top: 40px;
}

.newsShareBox,
.newsRelatedBox {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
}

    .newsShareBox h3,
    .newsRelatedBox h3 {
        margin: 0 0 16px;
        color: white;
        font-size: 16px;
        font-weight: 900;
        text-transform: uppercase;
    }

.newsShareButtons {
    display: flex;
    gap: 12px;
}

    .newsShareButtons a,
    .newsShareButtons button {
        width: 42px;
        height: 42px;
        border: 1px solid rgba(255,255,255,.20);
        border-radius: 50%;
        background: transparent;
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        font-weight: 900;
        cursor: pointer;
    }

        .newsShareButtons a:hover,
        .newsShareButtons button:hover {
            background: #91cf45;
            color: #002558;
        }

.newsRelatedItem {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid rgba(255,255,255,.12);
    text-decoration: none;
}

    .newsRelatedItem:first-of-type {
        border-top: none;
    }

    .newsRelatedItem img {
        width: 82px;
        height: 58px;
        object-fit: cover;
        border-radius: 4px;
    }

    .newsRelatedItem strong {
        display: block;
        color: white;
        font-size: 13px;
        line-height: 1.3;
    }

    .newsRelatedItem small {
        display: block;
        color: #91cf45;
        font-size: 12px;
        margin-top: 4px;
    }

    .newsRelatedItem:hover strong {
        color: #91cf45;
    }

.newsDetailNotFound {
    padding: 80px 0;
    background: #061a36;
}

    .newsDetailNotFound .newsContentWrap {
        background: white;
        color: #002558;
        border-radius: 8px;
        padding: 34px;
        text-align: center;
    }

    .newsDetailNotFound strong {
        display: block;
        font-size: 24px;
        font-weight: 900;
    }

    .newsDetailNotFound span {
        display: block;
        margin: 8px 0 20px;
    }

    .newsDetailNotFound a {
        color: #5ea443;
        font-weight: 800;
    }


/* RESPONSIVE */

@media (max-width: 1199px) {
    .newsFilterBar {
        grid-template-columns: 1fr 1fr;
    }

    .newsGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .newsDetailGrid {
        grid-template-columns: 1fr;
    }

    .newsSidePanel {
        position: static;
    }
}

@media (max-width: 767px) {
    .newsContentWrap,
    .newsHeroInner,
    .newsDetailHeroInner {
        max-width: calc(100vw - 24px);
    }

    .newsHero,
    .newsHeroInner {
        min-height: 260px;
    }

    .newsHeroText h1 {
        font-size: 40px;
    }

    .newsHeroText p {
        font-size: 15px;
    }

    .newsFilterSection {
        margin-top: -10px;
    }

    .newsFilterBar {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    .newsListSection {
        padding-top: 30px;
    }

    .newsFeaturedCard {
        min-height: 360px;
    }

    .newsFeaturedContent {
        padding: 24px;
    }

        .newsFeaturedContent h2 {
            font-size: 27px;
        }

    .newsGrid {
        grid-template-columns: 1fr;
    }

    .newsCardImage {
        height: 220px;
    }

    .newsDetailHero,
    .newsDetailHeroInner {
        min-height: 500px;
    }

        .newsDetailHero h1 {
            font-size: 34px;
        }

    .newsArticleLead {
        font-size: 18px;
    }

    .newsArticleText {
        font-size: 15px;
    }
}

@media (max-width: 430px) {
    .newsHeroText h1 {
        font-size: 34px;
    }

    .newsFeaturedContent h2 {
        font-size: 24px;
    }

    .newsCardImage {
        height: 190px;
    }

    .newsDetailHero h1 {
        font-size: 29px;
    }
}

/* =========================================================
   NEWS LIST PAGE - WHITE BACKGROUND, DARK ARTICLE CARDS
   pouze News.aspx
   ========================================================= */

.newsPage {
    background: #ffffff !important;
    color: #002558 !important;
}

.newsListSection {
    background: #ffffff !important;
}

/* zvýrazněná hlavní aktualita zůstává tmavá přes fotku */
.newsFeaturedCard {
    box-shadow: 0 18px 48px rgba(0,0,0,.18) !important;
}

/* ostatní karty zpět do tmavého sportovního vzhledu */
.newsCard {
    background: rgba(0, 37, 88, .96) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 12px 34px rgba(0,0,0,.18) !important;
}

.newsCardBody small {
    color: rgba(255,255,255,.68) !important;
}

.newsCardBody h3 a {
    color: #ffffff !important;
}

    .newsCardBody h3 a:hover {
        color: #91cf45 !important;
    }

.newsCardBody p {
    color: rgba(255,255,255,.86) !important;
}

.newsCardLink {
    color: #91cf45 !important;
}

    .newsCardLink:hover {
        color: #ffffff !important;
    }

.newsCardImage img {
    opacity: .88 !important;
}

.newsCard:hover .newsCardImage img {
    opacity: 1 !important;
}

/* konec stylu pro News page */

/* =========================================================
   MONTH / KALENDÁŘ AKCÍ - nový vzhled
   ========================================================= */

.calendarPage,
.calendarPage * {
    box-sizing: border-box;
}

.calendarPage {
    background: #eef2f6;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    min-height: 100vh;
}

.calendarHero {
    position: relative;
    min-height: 230px;
    background: linear-gradient(90deg, rgba(0,37,88,.92) 0%, rgba(0,37,88,.72) 45%, rgba(0,37,88,.22) 100%), url("Images/podklad_trava.jpg") center center / cover no-repeat;
    border-bottom: 4px solid #91cf45;
}

.calendarHeroOverlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 86% 0%, rgba(255,255,255,.18), transparent 28%), linear-gradient(180deg, rgba(0,37,88,.18), rgba(0,20,48,.68));
}

.calendarHeroInner {
    position: relative;
    z-index: 2;
    width: 1500px;
    max-width: calc(100vw - 48px);
    min-height: 230px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 30px;
}

.calendarHeroLogo {
    width: 126px;
    height: 126px;
    object-fit: contain;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,.32));
}

.calendarHeroText h1 {
    margin: 0;
    color: #fff;
    font-size: 48px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-shadow: 0 5px 16px rgba(0,0,0,.42);
}

.calendarHeroText span {
    display: block;
    width: 150px;
    height: 4px;
    background: #91cf45;
    margin: 14px 0 12px;
}

.calendarHeroText p {
    margin: 0;
    color: rgba(255,255,255,.94);
    font-size: 16px;
    line-height: 1.45;
}

.calendarBoardSection {
    padding: 0 0 60px;
    background: #eef2f6;
}

.calendarBoardWrap {
    width: 1500px;
    max-width: calc(100vw - 48px);
    margin: 16px auto 0;
    position: relative;
    z-index: 4;
    background: #fff;
    border: 1px solid #dfe5ed;
    border-radius: 10px;
    box-shadow: 0 18px 48px rgba(0,0,0,.16);
    overflow: hidden;
}

.calendarToolbar {
    padding: 18px;
    background: rgba(255,255,255,.98);
    display: grid;
    grid-template-columns: auto minmax(260px, 1.2fr) 170px 170px 150px 130px auto;
    gap: 12px;
    align-items: center;
    border-bottom: 1px solid #dfe5ed;
}

.calendarMonthNav {
    display: grid;
    grid-template-columns: 48px minmax(160px, auto) 48px;
    gap: 10px;
    align-items: center;
}

.calendarNavBtn {
    width: 48px;
    height: 44px;
    border: 1px solid #e1e6ee;
    border-radius: 5px;
    background: #fff;
    color: #002558;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 32px;
    line-height: 1;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(0,0,0,.07);
}

    .calendarNavBtn:hover {
        background: #002558;
        color: #fff;
        text-decoration: none;
    }

.calendarMonthTitle {
    height: 44px;
    padding: 0 16px;
    border: 1px solid #e1e6ee;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #fff;
    color: #002558;
    font-size: 15px;
    font-weight: 900;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(0,0,0,.06);
}

.calendarIcon {
    color: #91cf45;
    font-size: 15px;
}

.calendarInput {
    width: 100%;
    height: 44px;
    border: 1px solid #d4dce7;
    border-radius: 5px;
    background: #fff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    padding: 0 12px;
    outline: none;
}

    .calendarInput:focus {
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145,207,69,.18);
    }

.calendarSearchWrap {
    position: relative;
}

.calendarSearch {
    padding-left: 16px;
}

.calendarHiddenButton,
.calendarLegacyHidden {
    display: none !important;
}

.calendarRememberBox {
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #002558;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

    .calendarRememberBox input {
        margin-right: 6px;
    }

.calendarToolbarActions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.calendarActionBtn {
    min-width: 130px;
    height: 44px;
    border: 1px solid #d8e0ea;
    border-radius: 5px;
    background: #fff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .03em;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,.06);
}

    .calendarActionBtn:hover {
        background: #002558;
        color: #fff;
    }

.calendarActionBtnSave {
    background: #f8fbff;
}

.calendarActiveFilters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 18px;
    background: #f5f8fb;
    border-bottom: 1px solid #e1e6ee;
    color: #5b6675;
    font-size: 12px;
}

    .calendarActiveFilters span {
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

        .calendarActiveFilters span span,
        .calendarActiveFilters label {
            color: #002558;
            font-weight: 800;
        }

.calendarControlWrap {
    padding: 0;
    overflow-x: auto;
    background: #fff;
}

.tjcCalendar {
    width: 100% !important;
    min-width: 1060px;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    table-layout: fixed;
    background: #fff;
}

.tjcCalendarDayHeader {
    height: 34px;
    background: #002558 !important;
    color: #fff !important;
    border-right: 1px solid rgba(255,255,255,.25);
    font-size: 13px;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.tjcCalendarDayStyle,
.tjcCalendarDay {
    height: 152px;
    vertical-align: top !important;
    background: #fff !important;
    border-right: 1px solid #e3e8ef !important;
    border-bottom: 1px solid #e3e8ef !important;
    padding: 8px !important;
    color: #18253a !important;
    font-size: 13px;
}

    .tjcCalendarDayStyle > a,
    .tjcCalendarDay > a {
        display: inline-flex;
        min-width: 24px;
        height: 24px;
        align-items: center;
        justify-content: center;
        color: #18253a !important;
        text-decoration: none !important;
        font-weight: 900;
        border-radius: 50%;
        margin-bottom: 5px;
    }

        .tjcCalendarDayStyle > a:hover,
        .tjcCalendarDay > a:hover {
            background: #91cf45;
            color: #002558 !important;
        }

.tjcCalendarWeekend,
.tjcCalendarWeekendStyle {
    background: #fbfcfe !important;
}

.tjcCalendarToday,
.tjcCalendarTodayStyle {
    background: #f6fbef !important;
    box-shadow: inset 0 0 0 2px rgba(145,207,69,.60);
}

    .tjcCalendarToday > a,
    .tjcCalendarTodayStyle > a {
        background: #91cf45 !important;
        color: #002558 !important;
    }

.tjcCalendarOtherMonth,
.tjcCalendarOtherMonthStyle {
    background: #f2f5f8 !important;
    color: transparent !important;
}

.tjcEventWrap {
    margin-top: 4px;
}

.tjcCalendarEvent,
.lbCalendarEvent {
    position: relative;
    display: block;
    width: 100% !important;
    min-height: 44px;
    padding: 6px 8px 6px 10px;
    border-radius: 4px;
    background: color-mix(in srgb, var(--event-color) 23%, white 77%);
    border: 1px solid color-mix(in srgb, var(--event-color) 70%, #dbe2eb 30%);
    border-left: 4px solid var(--event-color);
    color: #002558 !important;
    text-align: left;
    text-decoration: none !important;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0,0,0,.06);
    transform: translateY(0);
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

    .tjcCalendarEvent:hover,
    .lbCalendarEvent:hover {
        z-index: 25;
        transform: translateY(-3px) scale(1.025);
        box-shadow: 0 9px 22px rgba(0,0,0,.16);
        filter: saturate(1.05);
    }

.tjcEventTime {
    display: inline-block;
    margin-right: 5px;
    color: #002558;
    font-size: 11px;
    font-weight: 900;
}

.tjcEventTitle {
    display: inline;
    color: #002558;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.2;
}

.tjcEventPlace,
.tjcEventCategory {
    display: block;
    color: rgba(0,37,88,.78);
    font-size: 11px;
    line-height: 1.2;
    margin-top: 2px;
}

.tjcCalendarEvent.status2,
.tjcCalendarEvent.status3,
.tjcCalendarEvent.status4 {
    background: #f7f7f7 !important;
    border-color: #c6c6c6 !important;
    border-left-color: #8f8f8f !important;
    color: #5b6675 !important;
}

/* =========================================================
   CALENDAR - výraznější stav události
   status2 = přeloženo, status3 = zrušeno, status4 = zastaveno
   ========================================================= */

.tjcCalendarEvent.status2,
.tjcCalendarEvent.status3,
.tjcCalendarEvent.status4 {
    background-color: #fafafa !important;
    border-left-color: var(--status-color) !important;
    border-color: rgba(0,0,0,.16) !important;
    color: #5b6675 !important;
}

.tjcCalendarEvent.status2 {
    --status-color: #ff8a00;
}

.tjcCalendarEvent.status3 {
    --status-color: #e53935;
}

.tjcCalendarEvent.status4 {
    --status-color: #1e88e5;
}

    .tjcCalendarEvent.status2:after,
    .tjcCalendarEvent.status3:after,
    .tjcCalendarEvent.status4:after {
        position: absolute;
        right: -26px;
        top: 18px;
        width: 132px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        transform: rotate(-13deg);
        border: 2px solid var(--status-color);
        color: var(--status-color);
        background: rgba(255,255,255,.88);
        font-size: 12px;
        line-height: 1;
        font-weight: 900;
        letter-spacing: .05em;
        box-shadow: 0 2px 7px rgba(0,0,0,.12);
        pointer-events: none;
    }

.tjcCalendarEvent.status2:after {
    content: "PŘELOŽENO";
}

.tjcCalendarEvent.status3:after {
    content: "ZRUŠENO";
}

.tjcCalendarEvent.status4:after {
    content: "ZASTAVENO";
}

/* u vyšších mobilních bloků může být razítko větší a čitelnější */
@media (max-width: 767px) {
    .tjcCalendarEvent.status2:after,
    .tjcCalendarEvent.status3:after,
    .tjcCalendarEvent.status4:after {
        right: -18px;
        top: 16px;
        width: 150px;
        height: 28px;
        font-size: 13px;
    }
}

.calendarMessagePopup,
.calendarOldFilterBox {
    background: #fff;
    color: #002558;
    padding: 24px;
    min-width: 340px;
    border-radius: 6px;
    text-align: center;
    box-shadow: 0 18px 48px rgba(0,0,0,.26);
}

    .calendarMessagePopup h3 {
        margin: 0 0 12px;
        color: #002558;
        font-size: 20px;
        font-weight: 900;
    }

    .calendarMessagePopup p {
        margin: 0 0 20px;
        color: #333;
        font-size: 14px;
    }

.modalBackground {
    background: rgba(0,0,0,.58);
}

/* fallback pro starší prohlížeče bez color-mix */
@supports not (background: color-mix(in srgb, red, white)) {
    .tjcCalendarEvent,
    .lbCalendarEvent {
        background: #eef6e9;
        border-color: #c5dfb6;
    }
}

@media (max-width: 1350px) {
    .calendarToolbar {
        grid-template-columns: 1fr 1fr 160px 160px;
    }

    .calendarMonthNav,
    .calendarSearchWrap {
        grid-column: span 2;
    }

    .calendarToolbarActions {
        grid-column: span 2;
        justify-content: stretch;
    }

        .calendarToolbarActions .calendarActionBtn {
            flex: 1;
        }
}

@media (max-width: 850px) {
    .calendarHero {
        min-height: 215px;
    }

    .calendarHeroInner {
        min-height: 215px;
        max-width: calc(100vw - 24px);
        gap: 18px;
    }

    .calendarHeroLogo {
        width: 88px;
        height: 88px;
    }

    .calendarHeroText h1 {
        font-size: 34px;
    }

    .calendarHeroText p {
        font-size: 14px;
    }

    .calendarBoardWrap {
        max-width: calc(100vw - 16px);
        margin-top: 16px;
        border-radius: 8px;
    }

    .calendarToolbar {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    .calendarMonthNav,
    .calendarSearchWrap,
    .calendarToolbarActions {
        grid-column: auto;
    }

    .calendarToolbarActions {
        flex-direction: column;
    }

    .calendarActionBtn {
        width: 100%;
    }

    .calendarActiveFilters {
        padding: 10px 12px;
    }

    .tjcCalendar {
        min-width: 980px;
    }
}

/* =========================================================
   MONTH / KALENDÁŘ AKCÍ - úpravy v2
   multi-filtry, checkbox, mobilní denní zobrazení
   ========================================================= */

.calendarBoardWrap {
    overflow: visible !important;
}

.calendarControlWrap {
    overflow-x: auto;
    overflow-y: visible;
}

.calendarFilterLabelsHidden {
    display: none !important;
}

.calendarMobileDateTitle {
    display: none;
}

.calendarToolbar {
    grid-template-columns: auto minmax(220px, 1.15fr) minmax(150px, .75fr) minmax(150px, .75fr) minmax(140px, .65fr) 140px auto !important;
    align-items: center;
}

.calendarToolbarActions {
    display: grid !important;
    grid-template-columns: 128px 128px;
    gap: 10px;
    min-width: 0;
}

    .calendarToolbarActions .calendarActionBtn {
        min-width: 0 !important;
        width: 100% !important;
        padding: 0 10px;
    }

.calendarMultiSelect {
    position: relative;
    min-width: 0;
}

.calendarMultiButton {
    width: 100%;
    height: 44px;
    border: 1px solid #d4dce7;
    border-radius: 5px;
    background: #fff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    font-weight: 800;
    padding: 0 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,.045);
}

    .calendarMultiButton > span:first-child,
    .calendarMultiButton label {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .calendarMultiButton:hover,
    .calendarMultiSelect.open .calendarMultiButton {
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145,207,69,.16);
    }

.calendarMultiPanel {
    display: none;
    position: absolute;
    z-index: 50;
    left: 0;
    top: calc(100% + 8px);
    min-width: 260px;
    max-width: 360px;
    max-height: 330px;
    overflow-y: auto;
    padding: 10px;
    background: #fff;
    border: 1px solid #dce4ee;
    border-radius: 7px;
    box-shadow: 0 18px 42px rgba(0,0,0,.20);
}

.calendarMultiSelect.open .calendarMultiPanel {
    display: block;
}

.calendarCheckList,
.calendarCheckList ul,
.calendarCheckList li {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .calendarCheckList li {
        display: flex;
        align-items: center;
        min-height: 32px;
        padding: 6px 6px;
        border-radius: 5px;
        color: #002558;
        font-size: 13px;
        font-weight: 700;
    }

        .calendarCheckList li:hover {
            background: #f1f6eb;
        }

    .calendarCheckList input[type="checkbox"] {
        width: 16px;
        height: 16px;
        margin: 0 8px 0 0;
        accent-color: #5ea443;
    }

    .calendarCheckList label {
        cursor: pointer;
        line-height: 1.25;
    }

.calendarRememberBox {
    justify-content: center !important;
}

.calendarRememberCheck {
    display: inline-flex;
    align-items: center;
}

    .calendarRememberCheck input[type="checkbox"] {
        width: 18px;
        height: 18px;
        margin: 0 7px 0 0;
        accent-color: #5ea443;
    }

    .calendarRememberCheck label {
        color: #002558;
        font-size: 12px;
        font-weight: 900;
        cursor: pointer;
    }

@media (max-width: 1500px) {
    .calendarToolbar {
        grid-template-columns: auto minmax(210px, 1fr) minmax(140px, .75fr) minmax(140px, .75fr) minmax(130px, .65fr) 132px auto !important;
        gap: 10px;
    }

    .calendarToolbarActions {
        grid-template-columns: 118px 118px;
    }
}

@media (max-width: 1199px) {
    .calendarToolbar {
        grid-template-columns: 1fr 1fr !important;
    }

    .calendarMonthNav,
    .calendarSearchWrap,
    .calendarToolbarActions {
        grid-column: span 2;
    }

    .calendarToolbarActions {
        grid-template-columns: 1fr 1fr;
    }

    .calendarRememberBox {
        justify-content: flex-start !important;
    }
}

@media (max-width: 850px) {
    .calendarToolbar {
        grid-template-columns: 1fr !important;
        gap: 10px;
        padding: 12px !important;
    }

    .calendarMonthNav,
    .calendarSearchWrap,
    .calendarToolbarActions {
        grid-column: auto !important;
    }

    .calendarToolbarActions {
        grid-template-columns: 1fr 1fr !important;
        gap: 9px !important;
    }

    .calendarActionBtn {
        height: 44px !important;
        min-width: 0 !important;
        font-size: 11px !important;
        border-radius: 5px !important;
    }

    .calendarRememberBox {
        justify-content: center !important;
        min-height: 42px;
        border: 1px solid #d4dce7;
        border-radius: 5px;
        background: #fff;
    }

    .calendarMultiPanel {
        position: static;
        display: none;
        min-width: 0;
        max-width: none;
        margin-top: 8px;
        box-shadow: none;
        border-color: #d4dce7;
    }

    .calendarMultiSelect.open .calendarMultiPanel {
        display: block;
    }
}

@media (max-width: 767px) {
    .calendarBoardWrap {
        max-width: calc(100vw - 12px) !important;
    }

    .calendarMonthNav {
        grid-template-columns: 44px minmax(0, 1fr) 44px !important;
        gap: 8px !important;
    }

    .calendarNavBtn {
        width: 44px !important;
        height: 42px !important;
        font-size: 30px !important;
    }

    .calendarMonthTitle {
        height: 42px !important;
        min-width: 0 !important;
        padding: 0 9px !important;
        font-size: 12px !important;
    }

    .calendarDesktopDateTitle {
        display: none !important;
    }

    .calendarMobileDateTitle {
        display: inline !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .calendarControlWrap {
        overflow-x: hidden !important;
    }

    .tjcCalendar {
        min-width: 0 !important;
        width: 100% !important;
        table-layout: fixed !important;
    }

        .tjcCalendarDayHeader,
        .tjcCalendar th {
            display: none !important;
        }

    .tjcCalendarDay,
    .tjcCalendarDayStyle,
    .tjcCalendarWeekend,
    .tjcCalendarWeekendStyle,
    .tjcCalendarToday,
    .tjcCalendarTodayStyle,
    .tjcCalendarOtherMonth,
    .tjcCalendarOtherMonthStyle {
        display: none !important;
    }

    .tjcCalendarMobileDay {
        display: table-cell !important;
        width: 100% !important;
        min-height: 460px !important;
        height: auto !important;
        padding: 14px !important;
        vertical-align: top !important;
        border-right: none !important;
    }

        .tjcCalendar tr:has(.tjcCalendarMobileDay) {
            display: table-row !important;
        }

    .tjcCalendarEvent,
    .lbCalendarEvent {
        min-height: 64px !important;
        padding: 10px 10px 10px 13px !important;
        margin-bottom: 10px !important;
    }

    .tjcEventTime,
    .tjcEventTitle {
        font-size: 13px !important;
    }

    .tjcEventPlace,
    .tjcEventCategory {
        font-size: 12px !important;
    }
}

@media (max-width: 430px) {
    .calendarToolbarActions {
        grid-template-columns: 1fr !important;
    }

    .calendarActionBtn {
        height: 42px !important;
    }
}

/* =========================================================
   MONTH / KALENDÁŘ AKCÍ - v3 úpravy
   mobilní týden, filtry bez okamžitého postbacku
   ========================================================= */

.tjcDesktopDayNumber {
    display: block;
    color: #002558;
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 8px;
}

.tjcMobileDayHeading,
.tjcCalendarEmptyDay {
    display: none;
}

@media (max-width: 767px) {
    .calendarToolbar {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .calendarSearchWrap {
        order: 1 !important;
        width: 100% !important;
    }

    .calendarToolbar .calendarMultiSelect {
        width: 100% !important;
    }

    .calendarCategoryMulti {
        order: 2 !important;
    }

    .calendarEventMulti {
        order: 3 !important;
    }

    .calendarGroundMulti {
        order: 4 !important;
    }

    .calendarRememberBox {
        order: 5 !important;
        width: 100% !important;
    }

    .calendarToolbarActions {
        order: 6 !important;
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
    }

    .calendarMonthNav {
        order: 7 !important;
        width: 100% !important;
        margin-top: 2px;
        padding-top: 10px;
        border-top: 1px solid #e1e6ee;
    }

    .calendarControlWrap {
        border-top: 1px solid #e1e6ee;
    }

    .tjcCalendar,
    .tjcCalendar tbody,
    .tjcCalendar tr {
        display: block !important;
        width: 100% !important;
    }

        .tjcCalendar tr {
            height: auto !important;
        }

    .tjcCalendarDay,
    .tjcCalendarDayStyle,
    .tjcCalendarWeekend,
    .tjcCalendarWeekendStyle,
    .tjcCalendarToday,
    .tjcCalendarTodayStyle,
    .tjcCalendarOtherMonth,
    .tjcCalendarOtherMonthStyle,
    .tjcCalendarMobileDay {
        display: none !important;
    }

    .tjcCalendarMobileWeekDay {
        display: block !important;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 14px !important;
        vertical-align: top !important;
        border-right: none !important;
        border-bottom: 1px solid #e1e6ee !important;
        background: #fff !important;
    }

    .tjcCalendarMobileSelectedDay {
        background: #fbfff6 !important;
    }

    .tjcDesktopDayNumber {
        display: none !important;
    }

    .tjcMobileDayHeading {
        display: flex !important;
        align-items: center;
        justify-content: center;
        min-height: 38px;
        margin: 0 0 12px;
        border-radius: 5px;
        background: #002558;
        color: #fff;
        font-size: 13px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: .03em;
    }

    .tjcCalendarEmptyDay {
        display: flex !important;
        align-items: center;
        justify-content: center;
        min-height: 62px;
        padding: 13px 14px;
        border: 1px dashed #c9d3df;
        border-radius: 6px;
        background: #f6f8fb;
        color: #647084;
        font-size: 13px;
        font-weight: 700;
        text-align: center;
    }
}

@media (max-width: 430px) {
    .calendarToolbarActions {
        grid-template-columns: 1fr 1fr !important;
    }

    .calendarActionBtn {
        min-height: 44px !important;
        white-space: normal !important;
    }
}

/* =========================================================
   CALENDAR - desktop nav arrows visual fix
   ========================================================= */

@media (min-width: 768px) {
    .calendarMonthNav {
        align-self: start;
    }

    .calendarNavBtn {
        width: 44px !important;
        height: 42px !important;
        font-size: 30px !important;
        line-height: .8 !important;
        padding-bottom: 5px !important;
        margin-top: -1px !important;
    }

    .calendarMonthTitle {
        height: 42px !important;
    }
}

/* =========================================================
   CALENDAR - zarovnání šipek ve filtrech
   ========================================================= */

.calendarMultiButton > span:last-child {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 18px !important;
    height: 18px !important;
    line-height: 18px !important;
    font-size: 14px !important;
    transform: translateY(-3px);
}

/* =========================================================
   CALENDAR - výběr měsíce / týdne
   ========================================================= */

.calendarMonthTitleButton {
    cursor: pointer;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

    .calendarMonthTitleButton:hover {
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145,207,69,.16);
    }

.calendarJumpOverlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(0, 20, 48, .58);
}

    .calendarJumpOverlay.open {
        display: flex;
    }

.calendarJumpDialog {
    width: 420px;
    max-width: calc(100vw - 28px);
    background: #fff;
    border-radius: 9px;
    box-shadow: 0 22px 70px rgba(0,0,0,.32);
    overflow: hidden;
    color: #002558;
}

.calendarJumpHeader {
    min-height: 54px;
    padding: 0 18px;
    background: #002558;
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .calendarJumpHeader strong {
        font-size: 16px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: .04em;
    }

    .calendarJumpHeader button {
        width: 34px;
        height: 34px;
        border: none;
        background: transparent;
        color: white;
        font-size: 28px;
        line-height: 1;
        cursor: pointer;
    }

.calendarJumpBody {
    padding: 20px;
}

.calendarJumpField {
    margin-bottom: 16px;
}

    .calendarJumpField label {
        display: block;
        margin-bottom: 7px;
        color: #002558;
        font-size: 13px;
        font-weight: 900;
    }

.calendarJumpInput {
    width: 100%;
    height: 44px;
    border: 1px solid #d4dce7;
    border-radius: 5px;
    padding: 0 12px;
    font-size: 15px;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
}

    .calendarJumpInput:focus {
        outline: none;
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145,207,69,.16);
    }

.calendarJumpField small {
    display: block;
    margin-top: 6px;
    color: #6b7280;
    font-size: 12px;
}

.calendarJumpFooter {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 20px 20px;
}

.calendarJumpBackBtn,
.calendarJumpApplyBtn {
    height: 44px;
    border-radius: 5px;
    border: 1px solid #d4dce7;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

.calendarJumpBackBtn {
    background: white;
    color: #002558;
}

.calendarJumpApplyBtn {
    background: #5ea443;
    color: white;
    border-color: #5ea443;
}

.calendarJumpBackBtn:hover {
    background: #f4f6f9;
}

.calendarJumpApplyBtn:hover {
    background: #4f9238;
}

/* Desktop řeší měsíc, mobil řeší týden podle data */
.calendarJumpOverlay.mode-month .calendarJumpDateField {
    display: none;
}

.calendarJumpOverlay.mode-week .calendarJumpMonthField {
    display: none;
}

/* =========================================================
   CALENDAR - clickable day for adding event
   ========================================================= */

.tjcCalendarDayCanAdd {
    cursor: pointer;
    transition: box-shadow .15s ease, background .15s ease;
}

    .tjcCalendarDayCanAdd:hover {
        box-shadow: inset 0 0 0 2px rgba(145, 207, 69, .45);
    }

.tjcCalendarEvent {
    position: relative;
    z-index: 2;
}

.tjcCalendarMobileDayTitleAdd {
    display: block;
    color: #ffffff !important;
    text-decoration: none !important;
    cursor: pointer;
}

    .tjcCalendarMobileDayTitleAdd:hover {
        background: #5ea443 !important;
        color: #ffffff !important;
    }

/* =========================================================
   CALENDAR - desktop nahoře, tablet/mobil nad kalendářem
   ========================================================= */

.calendarTabletMobileNav {
    display: none;
}

@media (max-width: 1199px) {
    .calendarDesktopNav {
        display: none !important;
    }

    .calendarTabletMobileNav {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) 44px;
        gap: 8px;
        align-items: center;
        padding: 12px 14px;
        border-top: 1px solid #dfe4ea;
        background: #ffffff;
    }

        .calendarTabletMobileNav .calendarNavBtn {
            width: 44px !important;
            height: 42px !important;
        }

        .calendarTabletMobileNav .calendarMonthTitle {
            height: 42px !important;
            min-width: 0 !important;
        }
}

@media (min-width: 1200px) {
    .calendarDesktopNav {
        display: grid !important;
    }

    .calendarTabletMobileNav {
        display: none !important;
    }
}

/* =========================================================
   CALENDAR EVENT MODALS - detail + editace události
   Vložit za Month_calendar_v3.css nebo na konec StyleSheet.css
   ========================================================= */

.calendarEventModalBackground {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99980 !important;
    background: rgba(0, 20, 48, .58) !important;
    backdrop-filter: blur(3px);
}

.calendarEventDetailModal,
.calendarEventEditorModal {
    z-index: 99990 !important;
    font-family: Tahoma, Arial, sans-serif;
    color: #002558;
    box-sizing: border-box;
}

    .calendarEventDetailModal *,
    .calendarEventEditorModal * {
        box-sizing: border-box;
    }

/* DETAIL PRO NÁVŠTĚVNÍKY */
.calendarEventDetailModal {
    width: 420px;
    max-width: calc(100vw - 28px);
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 24px 80px rgba(0, 0, 0, .32);
}

.eventDetailHead {
    min-height: 72px;
    padding: 18px 20px;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid #dfe4ea;
}

.eventDetailDot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 10px;
    border-radius: 50%;
    background: #0054b8;
    vertical-align: 2px;
}

.eventDetailTitle {
    display: inline-block;
    color: #002558;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.2;
}

.eventDetailSubtitle {
    display: block;
    margin: 5px 0 0 22px;
    color: #6b7280;
    font-size: 12px;
    font-weight: 700;
}

.eventModalCloseBtn {
    width: 34px;
    height: 34px;
    border: none;
    background: transparent;
    color: #002558;
    font-size: 28px;
    line-height: 30px;
    cursor: pointer;
}

.eventDetailBody {
    padding: 18px 20px 20px;
}

.eventDetailRows {
    border-top: 1px solid #edf1f5;
}

.eventDetailRow {
    min-height: 44px;
    display: grid;
    grid-template-columns: 28px 95px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    border-bottom: 1px solid #edf1f5;
    font-size: 13px;
}

    .eventDetailRow span:first-child {
        color: #5ea443;
        font-size: 17px;
        text-align: center;
    }

    .eventDetailRow strong {
        color: #6b7280;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .04em;
    }

    .eventDetailRow > span:last-child,
    .eventDetailRow > label,
    .eventDetailRow > .aspNetDisabled {
        color: #002558;
        font-weight: 700;
    }

.eventDetailDescription {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #dfe4ea;
    color: #2c3440;
    font-size: 13px;
    line-height: 1.55;
}

    .eventDetailDescription strong,
    .eventDetailMatches > strong {
        display: block;
        margin-bottom: 8px;
        color: #002558;
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
    }

    .eventDetailDescription p {
        margin: 0;
    }

.eventDetailMatches {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #dfe4ea;
}

.eventDetailMatchRow {
    display: grid;
    grid-template-columns: 52px 1fr auto 1fr;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid #edf1f5;
    font-size: 12px;
    align-items: center;
}

    .eventDetailMatchRow em {
        min-width: 38px;
        font-style: normal;
        text-align: center;
        font-weight: 900;
    }

.eventDetailFoot {
    padding: 0 20px 20px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

/* EDITOR */
.calendarEventEditorModal {
    width: 1220px;
    max-width: calc(100vw - 36px);
    max-height: calc(100vh - 36px);
    overflow: auto;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 24px 80px rgba(0, 0, 0, .34);
}

.eventEditorTop {
    position: sticky;
    top: 0;
    z-index: 3;
    min-height: 68px;
    display: grid;
    grid-template-columns: 54px 160px minmax(0, 1fr) 46px;
    gap: 12px;
    align-items: center;
    padding: 12px 18px;
    background: #fff;
    border-bottom: 1px solid #dfe4ea;
}

.eventEditorBack {
    width: 44px;
    height: 42px;
    border: 1px solid #d4dce7;
    border-radius: 5px;
    background: #fff;
    color: #002558;
    font-size: 24px;
    cursor: pointer;
}

.eventEditorDate {
    display: flex;
    gap: 9px;
    align-items: center;
    color: #002558;
    font-size: 15px;
    font-weight: 800;
}

    .eventEditorDate span {
        color: #5ea443;
    }

.eventEditorTitle {
    min-width: 0;
    color: #002558;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 900;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.eventEditorMessage {
    display: block;
    margin: 14px 18px 0;
    padding: 12px 14px;
    background: #fff3cd;
    border: 1px solid #ffe08a;
    color: #664d03;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
}

.eventEditorGrid {
    padding: 18px;
    display: grid;
    grid-template-columns: 1.15fr 1fr 1fr;
    gap: 18px;
    align-items: start;
}

.eventEditorCard {
    background: #fff;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    padding: 18px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .06);
}

.eventEditorDescriptionCard,
.eventEditorRepeatCard {
    grid-column: span 3;
}

.eventEditorSectionTitle {
    display: flex;
    gap: 9px;
    align-items: center;
    margin-bottom: 0px;
    color: #002558;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}

    .eventEditorSectionTitle span {
        color: #5ea443;
        font-size: 16px;
    }

.calendarEventEditorModal label {
    display: block;
    margin: 11px 0 6px;
    color: #002558;
    font-size: 12px;
    font-weight: 800;
}

.eventInput,
.eventTextarea {
    width: 100%;
    min-height: 42px;
    border: 1px solid #d4dce7;
    border-radius: 5px;
    background: #fff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    padding: 0 12px;
    outline: none;
}

    .eventInput:focus,
    .eventTextarea:focus {
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145, 207, 69, .16);
    }

.eventTextarea {
    min-height: 128px;
    padding: 12px;
    resize: vertical;
    line-height: 1.5;
}

.eventDateTimeGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 12px;
}

.eventSwitchLine {
    display: flex !important;
    gap: 10px;
    align-items: center;
    min-height: 36px;
    margin: 8px 0 !important;
    color: #2c3440 !important;
}

    .eventSwitchLine input {
        width: 18px;
        height: 18px;
        accent-color: #5ea443;
    }

.eventRepeatOptions {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    padding: 8px 0 10px;
}

    .eventRepeatOptions label,
    .eventWeekDays label {
        display: inline-flex !important;
        align-items: center;
        gap: 7px;
        margin: 0 !important;
        color: #2c3440 !important;
        font-weight: 700 !important;
    }

.eventWeekDays {
    margin-top: 12px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

    .eventWeekDays label {
        min-width: 48px;
        min-height: 34px;
        justify-content: center;
        padding: 0 9px;
        border: 1px solid #d4dce7;
        border-radius: 5px;
        background: #f7f9fb;
    }

.eventSpecificDates,
.eventImportBox {
    margin-top: 14px;
}

.eventMoveDateBox {
    margin: 8px 0 12px;
    padding: 12px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 6px;
}

.eventCounterInfo {
    margin-top: 8px;
    color: #6b7280;
    font-size: 12px;
}

.eventEditorFooter {
    position: sticky;
    bottom: 0;
    z-index: 3;
    display: grid;
    grid-template-columns: auto auto 180px 150px 220px;
    gap: 12px;
    align-items: center;
    padding: 14px 18px;
    background: #fff;
    border-top: 1px solid #dfe4ea;
    box-shadow: 0 -10px 25px rgba(0,0,0,.05);
}

.eventSeriesCheck {
    color: #002558;
    font-size: 12px;
    font-weight: 800;
}

.eventBtn {
    min-height: 42px;
    border-radius: 5px;
    border: 1px solid transparent;
    padding: 0 16px;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.eventBtnGreen {
    background: #5ea443;
    border-color: #5ea443;
    color: #fff;
}

    .eventBtnGreen:hover {
        background: #4f9238;
    }

.eventBtnBlue {
    background: #002558;
    border-color: #002558;
    color: #fff;
}

    .eventBtnBlue:hover {
        background: #073b7a;
    }

.eventBtnDanger {
    background: #fff;
    border-color: #ef4444;
    color: #ef4444;
}

    .eventBtnDanger:hover {
        background: #ef4444;
        color: #fff;
    }

.eventBtnOutline {
    background: #fff;
    border-color: #d4dce7;
    color: #002558;
}

    .eventBtnOutline:hover {
        background: #f4f6f9;
    }

/* Kalendářové události by měly otevírat modal a působit klikací. */
.tjcCalendarEvent {
    cursor: pointer;
}

/* RESPONSIVE */
@media (max-width: 1199px) {
    .calendarEventEditorModal {
        max-width: calc(100vw - 24px);
    }

    .eventEditorGrid {
        grid-template-columns: 1fr 1fr;
    }

    .eventEditorDescriptionCard,
    .eventEditorRepeatCard {
        grid-column: span 2;
    }

    .eventEditorFooter {
        grid-template-columns: 1fr 1fr;
    }

    .eventSeriesCheck,
    .eventBtnDanger {
        grid-column: span 1;
    }
}

@media (max-width: 767px) {
    .calendarEventEditorModal,
    .calendarEventDetailModal {
        width: calc(100vw - 18px);
        max-width: calc(100vw - 18px);
        max-height: calc(100vh - 18px);
    }

    .eventEditorTop {
        grid-template-columns: 44px minmax(0, 1fr) 36px;
        gap: 8px;
    }

    .eventEditorDate {
        display: none;
    }

    .eventEditorTitle {
        font-size: 16px;
    }

    .eventEditorGrid {
        grid-template-columns: 1fr;
        padding: 12px;
        gap: 12px;
    }

    .eventEditorDescriptionCard,
    .eventEditorRepeatCard {
        grid-column: span 1;
    }

    .eventDateTimeGrid {
        grid-template-columns: 1fr 1fr;
    }

    .eventEditorFooter {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    .eventDetailRow {
        grid-template-columns: 24px 86px minmax(0, 1fr);
        font-size: 12px;
    }

    .eventDetailFoot {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   EVENT MODAL - layout polishing v2
   ========================================================= */

.eventEditorTopV2 {
    grid-template-columns: 56px auto minmax(220px, 1fr) auto !important;
    min-height: 70px !important;
    gap: 16px !important;
}

.eventIconBtn,
.eventEditorBack {
    width: 46px !important;
    height: 42px !important;
    border: 1px solid #d4dce7 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #002558 !important;
    font-size: 25px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    box-shadow: 0 3px 10px rgba(0,0,0,.05);
}

    .eventIconBtn:hover,
    .eventEditorBack:hover {
        border-color: #91cf45 !important;
        box-shadow: 0 0 0 3px rgba(145,207,69,.16);
    }

.eventEditorDateBig {
    min-height: 42px;
    padding: 0 12px;
    border-radius: 6px;
    background: #f7fafc;
    border: 1px solid #e1e7ef;
    font-size: 18px !important;
    font-weight: 900 !important;
    color: #5ea443 !important;
    white-space: nowrap;
}

    .eventEditorDateBig .eventTopDateIcon {
        font-size: 18px;
        color: #5ea443;
    }

.eventEditorTitle {
    font-size: 22px !important;
    letter-spacing: .02em;
}

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

.eventBtnPreview {
    background: #ffffff;
    border-color: #d4dce7;
    color: #002558;
}

    .eventBtnPreview:hover {
        background: #f4f6f9;
    }

.eventBtnTopSave {
    min-width: 120px;
}

.eventModalCloseBox {
    width: 42px !important;
    height: 42px !important;
    border: 1px solid #d4dce7 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #002558 !important;
    font-size: 28px !important;
    line-height: 36px !important;
}

    .eventModalCloseBox:hover {
        border-color: #ef4444 !important;
        color: #ef4444 !important;
        background: #fff5f5 !important;
    }


/* Switch / přepínače */

.eventSwitchLine {
    position: relative;
}

    .eventSwitchLine input[type="checkbox"] {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .eventSwitchLine span {
        position: relative;
        display: inline-flex;
        align-items: center;
        min-height: 28px;
        padding-left: 56px;
        color: #002558;
        font-weight: 800;
    }

        .eventSwitchLine span:before {
            content: "";
            position: absolute;
            left: 0;
            top: 50%;
            width: 44px;
            height: 24px;
            border-radius: 99px;
            background: #d7dee8;
            transform: translateY(-50%);
            transition: background .16s ease;
        }

        .eventSwitchLine span:after {
            content: "";
            position: absolute;
            left: 3px;
            top: 50%;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: #ffffff;
            transform: translateY(-50%);
            transition: left .16s ease;
            box-shadow: 0 2px 5px rgba(0,0,0,.22);
        }

    .eventSwitchLine input[type="checkbox"]:checked + span:before {
        background: #5ea443;
    }

    .eventSwitchLine input[type="checkbox"]:checked + span:after {
        left: 23px;
    }

.eventSwitchLineBig {
    margin-bottom: 14px !important;
}

.eventSwitchLineCompact span {
    font-size: 12px;
}


/* Opakování */

.eventRepeatUi.disabled {
    opacity: .45;
    pointer-events: none;
}

.eventRepeatTypeRow {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 8px 0 14px;
}

.eventRadioPill {
    position: relative;
    margin: 0 !important;
}

    .eventRadioPill input[type="radio"] {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .eventRadioPill span {
        display: inline-flex;
        align-items: center;
        min-height: 36px;
        padding: 0 15px;
        border: 1px solid #d4dce7;
        border-radius: 999px;
        background: #ffffff;
        color: #002558;
        font-size: 12px;
        font-weight: 900;
        cursor: pointer;
    }

    .eventRadioPill input[type="radio"]:checked + span {
        background: #002558;
        color: #ffffff;
        border-color: #002558;
    }

.eventRepeatPanel {
    display: none;
    padding: 14px;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    background: #f8fafc;
}

.eventRepeatInlineGrid {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 18px;
    align-items: end;
}

.eventWeekDays {
    margin-top: 0 !important;
}

    .eventWeekDays label {
        position: relative;
        min-width: 48px;
        min-height: 36px;
        border: 1px solid #d4dce7;
        border-radius: 6px;
        background: #ffffff;
        padding: 0 !important;
        overflow: hidden;
    }

    .eventWeekDays input[type="checkbox"] {
        position: absolute;
        opacity: 0;
    }

    .eventWeekDays span {
        display: flex;
        width: 100%;
        height: 100%;
        min-height: 36px;
        align-items: center;
        justify-content: center;
        color: #002558;
        font-weight: 900;
        cursor: pointer;
    }

    .eventWeekDays input[type="checkbox"]:checked + span {
        background: #5ea443;
        color: #ffffff;
    }

.eventSpecificDatePickerRow {
    display: grid;
    grid-template-columns: 220px 150px;
    gap: 10px;
    margin-bottom: 10px;
}

.eventSmallBtn {
    min-height: 42px;
    border: 1px solid #002558;
    border-radius: 5px;
    background: #002558;
    color: #ffffff;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

    .eventSmallBtn:hover {
        background: #073b7a;
    }

.eventHelpText {
    display: block;
    margin-top: 8px;
    color: #6b7280;
    font-size: 12px;
}


/* Popis trochu výškově úspornější */

.eventTextarea {
    min-height: 106px !important;
}


/* Footer / série */

.eventEditorFooter {
    grid-template-columns: minmax(260px, 1fr) 180px 150px 220px !important;
}

.eventSeriesOptions {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
}

    .eventSeriesOptions .eventSwitchLine {
        margin: 0 !important;
    }


/* Zbytečný loader u ModalPopupExtenderu - pokud se ti zobrazuje jen přes CSS překryv */
.calendarEventModalBackground:before,
.calendarEventModalBackground:after {
    display: none !important;
}


/* Responsive */

@media (max-width: 1199px) {
    .eventEditorTopV2 {
        grid-template-columns: 46px minmax(0, 1fr) auto !important;
    }

    .eventEditorDateBig {
        display: none !important;
    }

    .eventEditorTopActions {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 1fr 1fr 42px;
        width: 100%;
    }

    .eventEditorFooter {
        grid-template-columns: 1fr 1fr !important;
    }

    .eventSeriesOptions {
        grid-column: 1 / -1;
    }

    .eventRepeatInlineGrid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .eventEditorTopActions {
        grid-template-columns: 1fr 1fr 42px;
    }

    .eventBtnPreview,
    .eventBtnTopSave {
        min-width: 0;
        padding: 0 8px;
        font-size: 11px;
    }

    .eventSpecificDatePickerRow {
        grid-template-columns: 1fr;
    }

    .eventRepeatTypeRow {
        display: grid;
        grid-template-columns: 1fr;
    }

    .eventEditorFooter {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   EVENT MODAL - compact repeat + footer alignment
   ========================================================= */

.eventRepeatCardCompact {
    padding: 18px 18px 16px !important;
}

.eventRepeatHeaderCompact {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 12px;
}

.eventEditorSectionTitleInline {
    margin: 0 !important;
    min-width: auto;
}


/* samotný switch bez textu */

.eventSwitchOnly {
    position: relative;
    display: inline-flex;
    width: 52px;
    height: 28px;
    margin: 0 !important;
    cursor: pointer;
}

    .eventSwitchOnly input[type="checkbox"] {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .eventSwitchOnly span {
        display: block;
        width: 52px;
        height: 28px;
        border-radius: 999px;
        background: #d8e0ea;
        transition: background .16s ease;
    }

        .eventSwitchOnly span:after {
            content: "";
            position: absolute;
            left: 4px;
            top: 4px;
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background: #ffffff;
            box-shadow: 0 2px 6px rgba(0,0,0,.22);
            transition: left .16s ease;
        }

    .eventSwitchOnly input[type="checkbox"]:checked + span {
        background: #5ea443;
    }

        .eventSwitchOnly input[type="checkbox"]:checked + span:after {
            left: 28px;
        }


/* kompaktní rozložení opakování */

.eventRepeatUiCompact {
    display: none;
    grid-template-columns: 390px minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
}

.eventRepeatChoiceColumn {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    flex-wrap: wrap;
    padding-right: 18px;
    border-right: 1px solid #dfe4ea;
}

.eventRepeatDetailColumn {
    min-width: 0;
}

.eventRepeatPanel {
    min-height: 82px;
    padding: 14px !important;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    background: #f8fafc;
}

.eventRepeatInterval {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    gap: 18px;
    align-items: end;
}

.eventWeekDaysCompact {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

    .eventWeekDaysCompact label {
        position: relative;
        width: 48px;
        height: 38px;
        margin: 0 !important;
        border: 1px solid #d4dce7;
        border-radius: 6px;
        background: #ffffff;
        overflow: hidden;
    }

    .eventWeekDaysCompact input[type="checkbox"] {
        position: absolute;
        opacity: 0;
    }

    .eventWeekDaysCompact span {
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
        color: #002558;
        font-size: 12px;
        font-weight: 900;
        cursor: pointer;
    }

    .eventWeekDaysCompact input[type="checkbox"]:checked + span {
        background: #5ea443;
        color: #ffffff;
    }

.eventRepeatEndDateCompact label,
.eventSpecificDates label,
.eventImportBox label {
    display: block;
    margin-bottom: 7px;
    color: #002558;
    font-size: 12px;
    font-weight: 900;
}


/* FileUpload - lepší vzhled tlačítka */

.eventFileInput {
    width: 100%;
    min-height: 42px;
    padding: 7px;
    border: 1px solid #d4dce7;
    border-radius: 5px;
    background: #ffffff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
}

    .eventFileInput::file-selector-button {
        height: 30px;
        margin-right: 12px;
        padding: 0 14px;
        border: none;
        border-radius: 4px;
        background: #002558;
        color: #ffffff;
        font-family: Tahoma, Arial, sans-serif;
        font-size: 12px;
        font-weight: 900;
        cursor: pointer;
    }

        .eventFileInput::file-selector-button:hover {
            background: #073b7a;
        }


/* spodní footer */

.eventEditorFooterCompact {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 14px 18px !important;
}

.eventSeriesOptions {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    min-width: 260px;
}

.eventFooterActions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-left: auto;
}

    .eventFooterActions .eventBtn {
        min-width: 150px;
    }

    .eventFooterActions .eventBtnGreen {
        min-width: 170px;
    }


/* Náhled - zavření */

.eventBtnPreviewClose {
    background: #ffffff;
    border-color: #91cf45;
    color: #5ea443;
}

    .eventBtnPreviewClose:hover {
        background: #f5fbf0;
    }


/* responsive */

@media (max-width: 1199px) {
    .eventRepeatUiCompact {
        grid-template-columns: 1fr;
    }

    .eventRepeatChoiceColumn {
        border-right: none;
        border-bottom: 1px solid #dfe4ea;
        padding-right: 0;
        padding-bottom: 12px;
    }

    .eventRepeatInterval {
        grid-template-columns: 1fr;
    }

    .eventEditorFooterCompact {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .eventSeriesOptions {
        width: 100%;
    }

    .eventFooterActions {
        width: 100%;
        margin-left: 0;
        justify-content: flex-end;
    }
}

@media (max-width: 767px) {
    .eventRepeatChoiceColumn {
        display: grid;
        grid-template-columns: 1fr;
    }

    .eventFooterActions {
        display: grid;
        grid-template-columns: 1fr;
    }

        .eventFooterActions .eventBtn {
            width: 100%;
            min-width: 0;
        }
}

/* =========================================================
   EVENT MODAL - oprava rozbitého kompaktního opakování
   ========================================================= */

.eventRepeatCardCompact {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.eventRepeatUiCompact {
    width: 100% !important;
    display: none;
    grid-template-columns: 380px minmax(0, 1fr) !important;
    gap: 20px !important;
    align-items: stretch !important;
}

.eventRepeatChoiceColumn {
    display: flex !important;
    flex-wrap: wrap !important;
    align-content: flex-start !important;
    align-items: flex-start !important;
    gap: 10px !important;
    padding-right: 18px !important;
    border-right: 1px solid #dfe4ea !important;
    min-height: 92px !important;
}

.eventRepeatDetailColumn {
    min-width: 0 !important;
    width: 100% !important;
}

    .eventRepeatDetailColumn .eventRepeatPanel {
        width: 100% !important;
        min-height: 92px !important;
        box-sizing: border-box !important;
    }

.eventRepeatInterval {
    display: none;
}

    .eventRepeatInterval.is-visible {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 260px !important;
        gap: 18px !important;
        align-items: end !important;
    }

.eventSpecificDates.is-visible,
.eventImportBox.is-visible {
    display: block !important;
}

@media (max-width: 1199px) {
    .eventRepeatUiCompact {
        grid-template-columns: 1fr !important;
    }

    .eventRepeatChoiceColumn {
        border-right: none !important;
        border-bottom: 1px solid #dfe4ea !important;
        padding-right: 0 !important;
        padding-bottom: 12px !important;
    }

    .eventRepeatInterval.is-visible {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   EVENT MODAL - form alignment fixes
   ========================================================= */

.eventEditorCard .eventFormGroup {
    min-height: 76px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

    .eventEditorCard .eventFormGroup label {
        min-height: 18px;
        margin-bottom: 7px;
    }

.eventInput,
.eventEditorCard select,
.eventEditorCard input[type="text"],
.eventEditorCard input[type="date"] {
    height: 42px !important;
    min-height: 42px !important;
    line-height: 42px !important;
}

.eventFieldFull {
    grid-column: 1 / -1;
}

.eventResultRow {
    display: flex;
}

.eventEditorCard .eventOpponentLogoRow {
    min-height: 0;
    margin-top: 18px;
}

.eventOptionalLabel {
    color: #6d7887;
    font-size: 11px;
    font-weight: 500;
}

.eventLogoDropZone {
    position: relative;
    display: block;
    width: 100%;
    min-height: 170px !important;
    margin: 0 !important;
    overflow: hidden;
    background: linear-gradient(145deg, #f7fafc, #e8eef4);
    border: 2px dashed #b8c9dc;
    border-radius: 8px;
    cursor: pointer;
    outline: 0;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.eventLogoDropZone:hover,
.eventLogoDropZone:focus-within,
.eventLogoDropZone.is-dragover {
    background: #f3faef;
    border-color: #5ea443;
    box-shadow: 0 0 0 3px rgba(94, 164, 67, .14);
}

.eventLogoPreview {
    display: block;
    width: 100%;
    height: 170px;
    padding: 18px 18px 46px;
    object-fit: contain;
    background: #fff;
}

.eventLogoPreviewPlaceholder {
    opacity: .74;
}

.eventLogoDropHint {
    position: absolute;
    z-index: 2;
    right: 9px;
    bottom: 9px;
    left: 9px;
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 10px;
    color: #fff;
    background: rgba(0, 37, 88, .9);
    border-radius: 5px;
    font-size: 10px;
    line-height: 1.25;
}

.eventLogoDropHint strong {
    flex: 0 0 auto;
    font-size: 11px;
    text-transform: uppercase;
}

.eventLogoDropHint > span {
    color: #dce8f7;
}

.eventLogoDropHint small {
    min-width: 0;
    margin-left: auto;
    overflow: hidden;
    color: #fff;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.eventLogoHiddenFile {
    position: absolute;
    z-index: 3;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    opacity: 0;
    cursor: pointer;
}

.eventLogoCurrent {
    margin-top: 7px;
}

.eventEditorCard .eventLogoRemove {
    min-height: 30px;
    margin: 0 !important;
}

.eventLogoHelp {
    display: block;
    margin-top: 7px;
    color: #6d7887;
    font-size: 11px;
    line-height: 1.4;
}

.eventInputInvalid {
    border-color: #e53935 !important;
    box-shadow: 0 0 0 3px rgba(229, 57, 53, .14) !important;
    background: #fff8f8 !important;
}

/* =========================================================
   LOGIN MODAL
   ========================================================= */

.coachLoginModal {
    width: 360px;
    max-width: calc(100vw - 28px);
    background: #ffffff;
    border-radius: 9px;
    overflow: hidden;
    box-shadow: 0 22px 70px rgba(0,0,0,.34);
    font-family: Tahoma, Arial, sans-serif;
}

.coachLoginHeader {
    min-height: 52px;
    background: #002558;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 14px 0 18px;
}

    .coachLoginHeader span {
        font-size: 15px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: .04em;
    }

.coachLoginClose {
    width: 34px;
    height: 34px;
    border: none;
    background: transparent;
    color: #ffffff;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
}

.coachLoginBody {
    padding: 20px 22px 18px;
}

.coachLoginLabel {
    display: block;
    margin-bottom: 7px;
    color: #002558;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.coachLoginInput {
    width: 100%;
    height: 42px;
    border: 1px solid #ccd6e2;
    border-radius: 5px;
    padding: 0 12px;
    color: #002558;
    font-size: 15px;
    box-sizing: border-box;
}

    .coachLoginInput:focus {
        outline: none;
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145,207,69,.16);
    }

.coachLoginRemember {
    margin-top: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #002558;
    font-size: 13px;
    font-weight: 700;
}

.coachLoginMessage {
    padding: 10px 12px;
    border-radius: 5px;
    margin-bottom: 14px;
    font-size: 13px;
    font-weight: 800;
}

.coachLoginWarning {
    background: #fff8e1;
    color: #8a5a00;
    border: 1px solid #ffe2a6;
}

.coachLoginError {
    background: #fff0f0;
    color: #b91c1c;
    border: 1px solid #ffc9c9;
}

.coachLoginFooter {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 22px 22px;
}

.coachLoginButton {
    height: 42px;
    border-radius: 5px;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

.coachLoginButtonCancel {
    border: 1px solid #ccd6e2;
    background: #ffffff;
    color: #002558;
}

.coachLoginButtonSubmit {
    border: 1px solid #5ea443;
    background: #5ea443;
    color: #ffffff;
}

.coachLoginButtonCancel:hover {
    background: #f4f6f9;
}

.coachLoginButtonSubmit:hover {
    background: #4f9238;
}

/* =========================================================
   TOP MENU - login vpravo, menu zůstává centrované
   ========================================================= */

.mainMenuWrap {
    width: 1300px !important;
    max-width: 1300px !important;
    margin: 0 auto !important;
    text-align: center;
}

/* zrušení předchozího odsazení menu */
.mainMenu,
.mainMenu_scroll {
    padding-right: 0 !important;
    box-sizing: border-box;
}

/* login je mimo tok menu, takže ho neposouvá doleva */
.topCoachAuth {
    transition: height .25s ease;
}

.topCoachLoginButton {
    font-family: Tahoma, Arial, sans-serif;
    transition: height .25s ease, background .16s ease, border-color .16s ease, color .16s ease;
}

.topCoachUserButton {
    font-family: Tahoma, Arial, sans-serif;
    transition: height .25s ease, background .16s ease;
}

    .topCoachLogout:hover {
        background: #fff5f5;
    }

.modalBackground {
    z-index: 200000 !important;
}

.coachLoginModal {
    z-index: 200001 !important;
}

/* konec stylu pro nový kalendář */

/* nový styl pro horní menu */

/* =========================================================
   TOP MENU - login/trenér vpravo, bez překrývání menu
   ========================================================= */

.mainMenuWrap {
    position: relative !important;
}

/* široké zobrazení: celý blok s fotkou, jménem a oprávněním */
.topCoachAuth {
    position: fixed !important;
    right: 24px !important;
    left: auto !important;
    top: 0 !important;
    height: 60px !important;
    z-index: 100050 !important;
    display: flex !important;
    align-items: center !important;
    font-family: Tahoma, Arial, sans-serif;
}

.topCoachLoginPanel,
.topCoachLoggedPanel {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

.topCoachLoginButton {
    height: 38px !important;
    padding: 0 17px !important;
    border-radius: 20px !important;
    border: 1px solid rgba(255,255,255,.32) !important;
    background: rgba(255,255,255,.08) !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: .03em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

    .topCoachLoginButton:before {
        content: "👤";
        margin-right: 8px;
        font-size: 14px;
    }

    .topCoachLoginButton:hover {
        background: #5ea443 !important;
        border-color: #5ea443 !important;
        color: #ffed00 !important;
    }

.topCoachUserButton {
    height: 46px !important;
    min-width: 225px !important;
    max-width: 245px !important;
    border: none !important;
    background: transparent !important;
    color: #ffffff !important;
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) 16px !important;
    gap: 8px !important;
    align-items: center !important;
    padding: 0 8px !important;
    cursor: pointer !important;
    text-align: left !important;
}

    .topCoachUserButton:hover {
        background: rgba(255,255,255,.08) !important;
    }

.topCoachPhotoWrap {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    background: rgba(255,255,255,.18) !important;
    border: 1px solid rgba(255,255,255,.28) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.topCoachPhoto {
    width: 32px !important;
    height: 32px !important;
    object-fit: cover !important;
    display: block !important;
}

.topCoachText {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    line-height: 1.1 !important;
}

.topCoachName {
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.topCoachRights {
    margin-top: 3px !important;
    color: rgba(255,255,255,.72) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.topCoachArrow {
    color: #ffffff !important;
    font-size: 13px !important;
}

.topCoachDropdown {
    position: absolute !important;
    top: 58px !important;
    right: 0 !important;
    width: 210px !important;
    display: none;
    background: #ffffff !important;
    border: 1px solid #dfe4ea !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.24) !important;
    z-index: 100060 !important;
}

    .topCoachDropdown.open {
        display: block !important;
    }

.topCoachDropdownItem {
    width: 100% !important;
    min-height: 42px !important;
    border: none !important;
    border-bottom: 1px solid #edf0f5 !important;
    background: #ffffff !important;
    color: #002558 !important;
    font-family: Tahoma, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-align: left !important;
    padding: 0 16px !important;
    cursor: pointer !important;
}

    .topCoachDropdownItem:hover {
        background: #f4f8ef !important;
        color: #5ea443 !important;
    }

.topCoachLogout {
    color: #c62828 !important;
}


/* scroll menu má 40px, proto se trenér zmenší */
.topCoachAuth.menuScrolled {
    height: 40px !important;
}

    .topCoachAuth.menuScrolled .topCoachUserButton {
        height: 36px !important;
    }

    .topCoachAuth.menuScrolled .topCoachLoginButton {
        height: 30px !important;
        padding: 0 14px !important;
        font-size: 11px !important;
    }

    .topCoachAuth.menuScrolled .topCoachPhotoWrap,
    .topCoachAuth.menuScrolled .topCoachPhoto {
        width: 28px !important;
        height: 28px !important;
    }

    .topCoachAuth.menuScrolled .topCoachRights {
        display: none !important;
    }

    .topCoachAuth.menuScrolled .topCoachDropdown {
        top: 39px !important;
    }


/* =========================================================
   STŘEDNÍ ŠÍŘKA - menu má přednost, trenér jen jako fotka/ikona
   ========================================================= */

@media (max-width: 1800px) and (min-width: 851px) {

    /* necháme místo jen pro malou fotku vpravo */
    .mainMenu,
    .mainMenu_scroll {
        padding-right: 52px !important;
        box-sizing: border-box !important;
    }

    .topCoachAuth {
        right: 8px !important;
        left: auto !important;
        top: 0 !important;
        width: 40px !important;
        height: 60px !important;
    }

        .topCoachAuth.menuScrolled {
            height: 40px !important;
        }

    .topCoachLoginButton {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        font-size: 0 !important;
    }

        .topCoachLoginButton:before {
            margin: 0 !important;
            font-size: 16px !important;
        }

    .topCoachUserButton {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .topCoachText,
    .topCoachArrow {
        display: none !important;
    }

    .topCoachPhotoWrap,
    .topCoachPhoto {
        width: 30px !important;
        height: 30px !important;
    }

    .topCoachAuth.menuScrolled .topCoachPhotoWrap,
    .topCoachAuth.menuScrolled .topCoachPhoto {
        width: 28px !important;
        height: 28px !important;
    }

    .topCoachDropdown {
        top: 58px !important;
        right: 0 !important;
        width: 190px !important;
    }

    .topCoachAuth.menuScrolled .topCoachDropdown {
        top: 39px !important;
    }
}


/* =========================================================
   MOBIL - trenér vlevo vedle loga, nepřekrývá TÝMY ani hamburger
   ========================================================= */

@media (max-width: 850px) {

    .topCoachAuth {
        display: flex !important;
        position: fixed !important;
        left: 54px !important;
        right: auto !important;
        top: 4px !important;
        width: 34px !important;
        height: 34px !important;
        z-index: 100070 !important;
        align-items: center !important;
        justify-content: center !important;
    }

        .topCoachAuth.menuScrolled {
            height: 34px !important;
        }

    .topCoachLoginPanel,
    .topCoachLoggedPanel {
        height: 34px !important;
        display: flex !important;
        align-items: center !important;
    }

    .topCoachLoginButton {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        font-size: 0 !important;
        background: rgba(255,255,255,.12) !important;
    }

        .topCoachLoginButton:before {
            margin: 0 !important;
            font-size: 15px !important;
        }

    .topCoachUserButton {
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
    }

    .topCoachText,
    .topCoachArrow {
        display: none !important;
    }

    .topCoachPhotoWrap,
    .topCoachPhoto {
        width: 30px !important;
        height: 30px !important;
    }

    .topCoachDropdown {
        position: fixed !important;
        top: 42px !important;
        left: 8px !important;
        right: auto !important;
        width: 190px !important;
        z-index: 100080 !important;
    }
}

/* =========================================================
   MOBILE MENU - oprava existujících TÝMY + hamburger tlačítek
   ========================================================= */

.mobileTeamsTrigger,
.mobileHamburgerTrigger {
    display: none !important;
}

@media (max-width: 850px) {

    .mainMenuWrap {
        position: fixed !important;
        left: 0 !important;
        top: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 40px !important;
        background: #002558 !important;
        z-index: 100000 !important;
        overflow: visible !important;
    }

    .mainMenu,
    .mainMenu_scroll {
        height: 40px !important;
        background: #002558 !important;
        overflow: visible !important;
    }

    .mobileTopNav {
        display: flex !important;
        position: fixed !important;
        left: 0 !important;
        top: 0 !important;
        right: 0 !important;
        height: 40px !important;
        background: #002558 !important;
        z-index: 100200 !important;
        align-items: center !important;
        pointer-events: none !important;
    }

        .mobileTopNav > * {
            pointer-events: auto !important;
        }

    .mobileNavLogo {
        display: block !important;
        position: fixed !important;
        left: 8px !important;
        top: 4px !important;
        width: 32px !important;
        height: 32px !important;
        z-index: 100230 !important;
    }

        .mobileNavLogo img {
            width: 32px !important;
            height: 32px !important;
            display: block !important;
        }

    .topCoachAuth {
        display: flex !important;
        position: fixed !important;
        left: 50px !important;
        right: auto !important;
        top: 3px !important;
        width: 34px !important;
        height: 34px !important;
        z-index: 100240 !important;
    }

    .mobileTeamsToggle {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: fixed !important;
        top: 0 !important;
        right: 72px !important;
        height: 40px !important;
        min-width: 62px !important;
        padding: 0 8px !important;
        border: none !important;
        background: transparent !important;
        color: #ffffff !important;
        font-family: Tahoma, Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: 900 !important;
        line-height: 40px !important;
        text-align: center !important;
        z-index: 100260 !important;
        cursor: pointer !important;
        overflow: visible !important;
    }

    .mobileMoreToggle {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: fixed !important;
        top: 0 !important;
        right: 10px !important;
        width: 44px !important;
        height: 40px !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
        color: #ffffff !important;
        font-family: Tahoma, Arial, sans-serif !important;
        font-size: 34px !important;
        font-weight: 900 !important;
        line-height: 36px !important;
        text-align: center !important;
        z-index: 100270 !important;
        cursor: pointer !important;
        overflow: visible !important;
    }

    .mobileTeamsPanel,
    .mobileMorePanel {
        z-index: 100300 !important;
    }
}
/* =========================================================
   MOBILE MENU - logo + trenér zarovnané v horní liště
   ========================================================= */

@media (max-width: 850px) {

    .mobileTopNav {
        height: 42px !important;
        background: #002558 !important;
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        z-index: 100200 !important;
        display: flex !important;
        align-items: center !important;
    }

    /* logo zpět do horní lišty */
    .mobileNavLogo {
        display: flex !important;
        position: fixed !important;
        left: 8px !important;
        top: 5px !important;
        width: 32px !important;
        height: 32px !important;
        z-index: 100230 !important;
        align-items: center !important;
        justify-content: center !important;
    }

        .mobileNavLogo img {
            display: block !important;
            width: 32px !important;
            height: 32px !important;
            object-fit: contain !important;
        }

    /* trenérská fotka hned vedle loga */
    .topCoachAuth {
        display: flex !important;
        position: fixed !important;
        left: 48px !important;
        top: 4px !important;
        right: auto !important;
        width: 34px !important;
        height: 34px !important;
        z-index: 100240 !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .topCoachLoginPanel,
    .topCoachLoggedPanel {
        height: 34px !important;
        display: flex !important;
        align-items: center !important;
    }

    .topCoachUserButton,
    .topCoachLoginButton {
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .topCoachPhotoWrap,
    .topCoachPhoto {
        width: 30px !important;
        height: 30px !important;
    }

    .topCoachText,
    .topCoachArrow {
        display: none !important;
    }

    /* TÝMY + hamburger vpravo */
    .mobileTeamsToggle {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        right: 72px !important;
        height: 42px !important;
        line-height: 42px !important;
        z-index: 100260 !important;
    }

        .mobileTeamsToggle:after {
            content: none !important;
            display: none !important;
        }

    .mobileMoreToggle {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        right: 10px !important;
        height: 42px !important;
        line-height: 38px !important;
        z-index: 100270 !important;
    }

    .topCoachDropdown {
        position: fixed !important;
        top: 42px !important;
        left: 8px !important;
        right: auto !important;
        width: 190px !important;
        z-index: 100300 !important;
    }
}

/* =========================================================
   TABLET / MENŠÍ DESKTOP - celé menu včetně prostoru pro trenéra
   ========================================================= */

@media (min-width: 851px) and (max-width: 1800px) {

    .mainMenuWrap {
        width: 100% !important;
        max-width: 1300px !important;
    }

    /* Pravý okraj je vyhrazený pouze profilové fotce, menu do něj nevstupuje. */
    .mainMenu,
    .mainMenu_scroll {
        width: 100% !important;
        padding-right: 56px !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

        .mainMenu > ul,
        .mainMenu_scroll > ul {
            display: flex !important;
            width: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            box-sizing: border-box !important;
        }

            .mainMenu > ul > li,
            .mainMenu_scroll > ul > li {
                flex: 1 1 0 !important;
                width: auto !important;
                min-width: 0 !important;
            }

                .mainMenu > ul > li > a,
                .mainMenu_scroll > ul > li > a {
                    display: block !important;
                    width: 100% !important;
                    min-width: 0 !important;
                    padding: 0 3px !important;
                    box-sizing: border-box !important;
                    font-size: clamp(9px, .92vw, 12px) !important;
                    white-space: nowrap !important;
                    overflow: hidden !important;
                    text-overflow: ellipsis !important;
                }

                    .mainMenu > ul > li > a.popout,
                    .mainMenu_scroll > ul > li > a.popout {
                        padding-right: 15px !important;
                    }

                        .mainMenu > ul > li > a.popout:after,
                        .mainMenu_scroll > ul > li > a.popout:after {
                            right: 3px !important;
                            font-size: 7px !important;
                        }

    .topCoachAuth {
        right: 8px !important;
    }
}


/* konec stylu pro nové horní menu */

/* =========================================================
   EVIDENCE - TJF Čechie Čejetice
   Nová evidence hráčů, rodičů, trenérů a souborů
   ========================================================= */

.ev-page {
    background: #eef2f5;
    font-family: Tahoma, Arial, sans-serif;
    color: #002558;
    min-height: 100vh;
}

.ev-hero {
    min-height: 230px;
    background: linear-gradient(90deg, rgba(0,37,88,.96) 0%, rgba(0,37,88,.72) 42%, rgba(0,37,88,.22) 100%), url('../Images/news-hero-bg.jpg') center center / cover no-repeat;
    border-bottom: 4px solid #91cf45;
    display: flex;
    align-items: center;
}

.ev-hero-inner {
    width: min(1320px, calc(100% - 40px));
    margin: 0 auto;
    color: white;
}

.ev-hero-mark {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 14px;
    background: #5ea443;
    color: #ffed00;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    border-radius: 999px;
}

.ev-hero h1 {
    margin: 18px 0 10px;
    color: white;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.ev-hero p {
    margin: 0;
    max-width: 720px;
    color: rgba(255,255,255,.92);
    font-size: 17px;
    line-height: 1.45;
}

.ev-shell {
    width: min(1320px, calc(100% - 40px));
    margin: 16px auto 60px;
    background: white;
    border-radius: 10px;
    box-shadow: 0 18px 42px rgba(0,0,0,.14);
    overflow: hidden;
}

.ev-message {
    width: min(1320px, calc(100% - 40px));
    margin: 18px auto 0;
    padding: 13px 18px;
    border-radius: 8px;
    background: #f4fbef;
    border: 1px solid #91cf45;
    color: #2e6b1f;
    font-weight: 800;
}

.ev-tabs {
    display: flex;
    align-items: center;
    gap: 0;
    background: #002558;
    min-height: 58px;
    overflow-x: auto;
}

.ev-tab {
    min-height: 58px;
    padding: 0 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: white !important;
    border-right: 1px solid rgba(255,255,255,.22);
    text-decoration: none !important;
    font-weight: 900;
    font-size: 13px;
    text-transform: uppercase;
    white-space: nowrap;
}

    .ev-tab:hover,
    .ev-tab.is-active {
        background: #5ea443;
        color: #ffed00 !important;
    }

.ev-tab-disabled {
    opacity: .35;
    cursor: not-allowed;
}

    .ev-tab-disabled:hover {
        background: transparent;
        color: white !important;
    }

.ev-toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 1.3fr) minmax(180px, .55fr) minmax(160px, .45fr) minmax(160px, .45fr) auto;
    gap: 12px;
    padding: 18px;
    background: #f8fafc;
    border-bottom: 1px solid #dfe4ea;
}

.ev-input {
    width: 100%;
    min-height: 42px;
    box-sizing: border-box;
    border: 1px solid #cad5e2;
    border-radius: 6px;
    background: white;
    color: #002558;
    padding: 0 12px;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    font-weight: 700;
}

    .ev-input:focus {
        outline: none;
        border-color: #91cf45;
        box-shadow: 0 0 0 3px rgba(145,207,69,.16);
    }

.ev-textarea {
    min-height: 105px;
    padding: 11px 12px;
    line-height: 1.4;
    resize: vertical;
}

.ev-textarea-small {
    min-height: 68px;
    padding: 11px 12px;
    line-height: 1.35;
}

.ev-btn {
    min-height: 42px;
    border-radius: 6px;
    border: 1px solid #cad5e2;
    padding: 0 18px;
    background: white;
    color: #002558 !important;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .02em;
    cursor: pointer;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

    .ev-btn:hover {
        background: #f4f6f9;
    }

.ev-btn-green {
    background: #5ea443 !important;
    color: white !important;
    border-color: #5ea443 !important;
}

    .ev-btn-green:hover {
        background: #4f9238 !important;
    }

.ev-btn-light {
    background: #ffffff !important;
    color: #002558 !important;
}

.ev-btn-danger {
    background: white !important;
    border-color: #ef4444 !important;
    color: #ef4444 !important;
}

.ev-view {
    padding: 22px;
}

.ev-view-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

    .ev-view-head h2 {
        margin: 0 0 5px;
        font-size: 25px;
        color: #002558;
        text-transform: uppercase;
        letter-spacing: .04em;
    }

    .ev-view-head p {
        margin: 0;
        color: #5b6674;
        font-size: 14px;
    }

.ev-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.ev-card-grid {
    display: grid;
    gap: 18px;
}

.ev-player-grid {
    grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
}

.ev-coach-grid {
    grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
}

.ev-card {
    position: relative;
    border: 1px solid #dfe4ea;
    border-radius: 10px;
    background: white;
    padding: 17px;
    box-shadow: 0 8px 22px rgba(0,0,0,.06);
    transition: transform .16s ease, box-shadow .16s ease;
}

    .ev-card:hover,
    .ev-row-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 30px rgba(0,0,0,.12);
    }

.ev-card-top {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 13px;
}

.ev-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #eaf6df;
    color: #002558;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex: 0 0 auto;
}

.ev-avatar-ball {
    background: #002558;
    color: white;
}

.ev-card h3,
.ev-row-card h3 {
    margin: 0;
    color: #002558;
    font-size: 16px;
    font-weight: 900;
}

.ev-card p,
.ev-row-card p {
    margin: 4px 0 0;
    color: #5ea443;
    font-size: 13px;
    font-weight: 800;
}

.ev-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-top: 1px solid #edf0f5;
    padding: 9px 0;
    font-size: 12px;
}

    .ev-meta span {
        color: #6b7280;
    }

    .ev-meta b {
        color: #002558;
        text-align: right;
    }

.ev-meta-email {
    display: block;
    padding-top: 7px;
}

    .ev-meta-email span,
    .ev-meta-email b {
        display: block;
    }

    .ev-meta-email span {
        margin-bottom: 2px;
        line-height: 1.1;
    }

    .ev-meta-email b {
        overflow-wrap: anywhere;
    }

.ev-card-link {
    margin-top: 8px;
    min-height: 38px;
    border-radius: 6px;
    background: #002558;
    color: white !important;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

    .ev-card-link:hover {
        background: #5ea443;
    }

.ev-list {
    display: grid;
    gap: 12px;
}

.ev-row-card {
    display: grid;
    grid-template-columns: 48px minmax(240px, 1fr) minmax(220px, auto) auto auto;
    gap: 14px;
    align-items: center;
    border: 1px solid #dfe4ea;
    border-radius: 10px;
    padding: 13px 15px;
    background: white;
    box-shadow: 0 8px 22px rgba(0,0,0,.05);
    transition: transform .16s ease, box-shadow .16s ease;
}

.ev-row-main {
    min-width: 0;
}

.ev-row-contact {
    display: flex;
    flex-direction: column;
    gap: 3px;
    color: #002558;
    font-size: 13px;
}

    .ev-row-contact span {
        color: #6b7280;
    }

.ev-coach-photo {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 14px;
    background: #edf0f5;
}

.ev-coach-details {
    min-width: 0;
}

.ev-role-groups {
    display: grid;
    gap: 10px;
    margin: 8px 0 12px;
}

.ev-coach-single-title {
    margin-top: 20px !important;
    padding-top: 16px;
    border-top: 1px solid #dfe4ea;
}

.ev-role-group {
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    padding: 9px 11px;
    background: #f8fafc;
}

    .ev-role-group h4 {
        margin: 0 0 7px;
        color: #002558;
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
    }

.ev-role-group .ev-role-options.set-switch-list {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

    .ev-role-group .ev-role-options.set-switch-list > span {
        display: grid;
        grid-template-columns: 1fr;
        gap: 7px;
        min-height: 0;
        flex-wrap: nowrap;
    }

    .ev-role-group .ev-role-options.set-switch-list br {
        display: none;
    }

    .ev-role-group .ev-role-options.set-switch-list input[type="checkbox"] + label {
        display: inline-flex;
        align-items: center;
        width: 100%;
        min-height: 30px;
        box-sizing: border-box;
        margin: 0;
        font-size: 12px;
        font-weight: 800;
        line-height: 1.25;
    }

.ev-modal-bg {
    background: rgba(0,20,48,.55);
    backdrop-filter: blur(2px);
    z-index: 200000 !important;
}

.ev-editor-modal {
    width: min(1180px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 28px 90px rgba(0,0,0,.32);
    z-index: 200001 !important;
}

.ev-editor-layout {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: calc(100vh - 28px);
    overflow: hidden;
}

.ev-editor-head {
    flex: 0 0 auto;
    min-height: 68px;
    padding: 0 18px 0 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #002558;
    color: white;
}

.ev-editor-title {
    display: block;
    color: white;
    font-size: 20px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.ev-editor-head p {
    margin: 4px 0 0;
    color: rgba(255,255,255,.75);
    font-size: 12px;
}

.ev-editor-close {
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 6px;
    background: transparent;
    color: white;
    font-size: 28px;
    cursor: pointer;
}

.ev-editor-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: calc(100vh - 180px);
    overflow: auto;
    padding: 18px;
    background: #f5f7fa;
}

.ev-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.ev-editor-card {
    background: white;
    border: 1px solid #dfe4ea;
    border-radius: 10px;
    padding: 17px;
    box-shadow: 0 8px 22px rgba(0,0,0,.04);
}

.ev-editor-wide {
    grid-column: 1 / -1;
}

.ev-editor-card h3 {
    margin: 0 0 16px;
    color: #002558;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.ev-editor-card h4 {
    margin: 0 0 10px;
    color: #002558;
    font-size: 13px;
    font-weight: 900;
}

.ev-editor-card label {
    display: block;
    margin: 12px 0 6px;
    color: #002558;
    font-size: 12px;
    font-weight: 900;
}

.ev-check {
    display: flex !important;
    align-items: center;
    gap: 8px;
    margin-top: 16px !important;
}

.ev-inline {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

    .ev-inline label {
        margin: 0;
    }

.ev-season {
    max-width: 180px;
}

.ev-finance-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
}

    .ev-finance-grid label {
        margin: 0 !important;
    }

    .ev-finance-grid span {
        display: block;
        margin-bottom: 6px;
        color: #002558;
        font-size: 12px;
        font-weight: 900;
    }

    .ev-finance-grid input {
        width: 100%;
        min-height: 40px;
        box-sizing: border-box;
        border: 1px solid #cad5e2;
        border-radius: 6px;
        padding: 0 10px;
        color: #002558;
        font-weight: 800;
    }

.ev-link-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
}

.ev-link-drop,
.ev-link-pool {
    min-height: 135px;
    max-height: 235px;
    overflow: auto;
    display: flex;
    align-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
    border: 1px dashed #bfd0e2;
    border-radius: 9px;
    background: #f8fafc;
}

    .ev-link-drop.is-dragover {
        border-color: #91cf45;
        box-shadow: inset 0 0 0 3px rgba(145,207,69,.14);
        background: #f4fbef;
    }

.ev-link-chip {
    display: inline-flex;
    flex-direction: column;
    gap: 3px;
    max-width: 205px;
    padding: 9px 11px;
    border-radius: 7px;
    border: 1px solid #dfe4ea;
    background: white;
    cursor: grab;
    user-select: none;
}

    .ev-link-chip b {
        color: #002558;
        font-size: 12px;
    }

    .ev-link-chip small {
        color: #6b7280;
        font-size: 11px;
    }

.ev-link-chip-selected {
    background: #eaf6df;
    border-color: #91cf45;
}

.ev-empty-drop {
    color: #6b7280;
    align-self: center;
}

.ev-quick-create {
    margin-top: 16px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    padding-top: 14px;
    border-top: 1px solid #edf0f5;
}

    .ev-quick-create h4 {
        grid-column: 1 / -1;
    }

.ev-dropzone {
    min-height: 210px;
    border: 2px dashed #bfd0e2;
    border-radius: 10px;
    background: #f8fafc;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 14px;
    text-align: center;
    cursor: pointer;
    color: #002558;
}

    .ev-dropzone.is-dragover {
        border-color: #91cf45;
        background: #f4fbef;
    }

    .ev-dropzone strong {
        font-size: 14px;
        text-transform: uppercase;
    }

    .ev-dropzone span,
    .ev-dropzone small {
        color: #6b7280;
    }

.ev-dropzone-file {
    min-height: 140px;
}

.ev-photo-preview {
    width: 180px;
    height: 180px;
    object-fit: contain;
    border-radius: 8px;
    border: 1px solid #dfe4ea;
    background: #ffffff;
    margin-bottom: 8px;
}

.ev-coach-rights-group {
    margin-top: 18px;
}

.ev-hidden-file {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.ev-editor-footer {
    flex: 0 0 auto;
    min-height: 66px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 18px;
    background: white;
    border-top: 1px solid #dfe4ea;
}

.ev-footer-spacer {
    flex: 1 1 auto;
}

@media (max-width: 1100px) {
    .ev-toolbar {
        grid-template-columns: 1fr 1fr;
    }

    .ev-form-grid {
        grid-template-columns: 1fr 1fr;
    }

    .ev-row-card {
        grid-template-columns: 48px minmax(0, 1fr) auto;
    }

    .ev-row-contact {
        grid-column: 2 / -1;
    }

    .ev-quick-create {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 760px) {
    .ev-editor-modal {
        width: calc(100vw - 12px);
        height: calc(100vh - 12px);
        height: calc(100dvh - 12px);
        max-height: calc(100vh - 12px);
        max-height: calc(100dvh - 12px);
        border-radius: 8px;
    }

    .ev-editor-layout {
        height: 100%;
        max-height: 100%;
    }

    .ev-hero {
        min-height: 190px;
    }

    .ev-shell,
    .ev-message {
        width: calc(100% - 18px);
    }

    .ev-shell {
        margin-top: 12px;
        border-radius: 8px;
    }

    .ev-tabs {
        min-height: 50px;
    }

    .ev-tab {
        min-height: 50px;
        padding: 0 16px;
        font-size: 12px;
    }

    .ev-toolbar,
    .ev-form-grid,
    .ev-link-layout,
    .ev-quick-create {
        grid-template-columns: 1fr;
    }

    .ev-view {
        padding: 14px;
    }

    .ev-view-head {
        flex-direction: column;
    }

    .ev-actions,
    .ev-actions .ev-btn {
        width: 100%;
    }

    .ev-coach-summary {
        display: grid;
        grid-template-columns: 112px minmax(0, 1fr);
        gap: 14px;
        align-items: start;
    }

    .ev-coach-summary .ev-coach-photo {
        width: 112px;
        height: 94px;
        margin: 0;
        object-fit: cover;
        object-position: center top;
    }

    .ev-row-card {
        grid-template-columns: 42px minmax(0, 1fr);
    }

        .ev-row-card .ev-btn,
        .ev-row-card a.ev-btn {
            grid-column: 1 / -1;
            width: 100%;
        }

    .ev-editor-body {
        flex: 1 1 auto;
        min-height: 0;
        max-height: none;
        padding: 12px;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .ev-editor-footer {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px;
        min-height: 0;
        padding: 10px 12px max(10px, env(safe-area-inset-bottom));
    }

    .ev-editor-footer .ev-btn {
        width: 100%;
        min-width: 0;
    }

    .ev-editor-footer .ev-btn-danger {
        grid-column: 1 / -1;
    }

    .ev-footer-spacer {
        display: none;
    }
}

@media (max-width: 430px) {
    .ev-coach-summary {
        grid-template-columns: 94px minmax(0, 1fr);
        gap: 12px;
    }

    .ev-coach-summary .ev-coach-photo {
        width: 94px;
        height: 84px;
    }
}


/* =========================================================
   EVIDENCE - dodatečné úpravy hráči/trenéři/filtry
   ========================================================= */

.ev-toolbar {
    grid-template-columns: minmax(260px, 1.25fr) minmax(175px, .55fr) minmax(155px, .45fr) minmax(155px, .45fr) minmax(155px, .45fr) minmax(180px, .55fr);
}

.ev-coach-photo {
    height: 138px;
    object-position: center top;
}

.ev-player-row-card {
    grid-template-columns: 58px minmax(230px, 1fr) minmax(180px, auto) minmax(180px, auto) auto;
}

.ev-player-row-photo {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    object-fit: contain;
    background: #f4f8ef;
    border: 1px solid #dfe4ea;
    padding: 3px;
    box-sizing: border-box;
}

.ev-player-form-grid > .ev-editor-card:not(.ev-editor-wide) {
    min-height: 0;
}

.ev-player-note {
    min-height: 236px;
}

.ev-link-chip {
    cursor: pointer;
}

    .ev-link-chip:active {
        cursor: grabbing;
    }

.ev-link-chip-selected small:after {
    content: " · odebrat kliknutím";
}

@media (max-width: 1100px) {
    .ev-toolbar {
        grid-template-columns: 1fr 1fr;
    }

    .ev-player-row-card {
        grid-template-columns: 48px minmax(0, 1fr) auto;
    }

        .ev-player-row-card .ev-row-contact {
            grid-column: 2 / -1;
        }
}

@media (max-width: 760px) {
    .ev-player-row-card {
        grid-template-columns: 48px minmax(0, 1fr);
    }

        .ev-player-row-card .ev-btn,
        .ev-player-row-card a.ev-btn {
            grid-column: 1 / -1;
            width: 100%;
        }

    .ev-player-note {
        min-height: 120px;
    }
}

/* =========================================================
   EVIDENCE - exporty, řazení a čitelnější vazby rodič/dítě
   ========================================================= */

.ev-row-label {
    display: inline-block;
    min-width: 74px;
    color: #6b7280;
    font-weight: 900;
}

.ev-row-main p + p {
    margin-top: 3px;
}

.ev-row-parents {
    max-width: 360px;
}

    .ev-row-parents span {
        color: #002558;
        line-height: 1.35;
    }

.ev-link-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

    .ev-link-section-head h4 {
        margin: 0 !important;
        white-space: nowrap;
    }

.ev-link-tools {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}

.ev-link-filter {
    min-height: 25px;
    padding: 0 9px;
    border: 1px solid #cad5e2;
    border-radius: 999px;
    background: #ffffff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 11px;
    font-weight: 900;
    cursor: pointer;
}

    .ev-link-filter:hover,
    .ev-link-filter.is-active {
        border-color: #5ea443;
        background: #5ea443;
        color: #ffffff;
    }

.ev-toolbar .ev-input {
    min-width: 0;
}

@media (max-width: 1100px) {
    .ev-link-section-head {
        flex-direction: column;
        align-items: stretch;
    }

    .ev-link-tools {
        justify-content: flex-start;
    }

    .ev-row-parents {
        max-width: none;
    }
}

/* =========================================================
   EVIDENCE - drobné kosmetické úpravy update 4
   ========================================================= */

.ev-player-row-card {
    grid-template-columns: 58px minmax(280px, 1fr) minmax(170px, auto) auto !important;
}

.ev-row-muted-line {
    color: #002558 !important;
    line-height: 1.35;
    margin-top: 4px !important;
}

    .ev-row-muted-line .ev-row-label {
        min-width: auto;
        margin-right: 4px;
    }

.ev-player-row-card .ev-row-parents {
    display: none !important;
}

.ev-pool-filterbar {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) 150px;
    gap: 8px;
    align-items: center;
    width: 100%;
}

.ev-pool-search,
.ev-pool-select {
    height: 32px;
    border: 1px solid #cad5e2;
    border-radius: 16px;
    background: #ffffff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: 800;
    box-sizing: border-box;
}

.ev-pool-search {
    padding: 0 13px;
}

.ev-pool-select {
    padding: 0 11px;
    cursor: pointer;
}

    .ev-pool-search:focus,
    .ev-pool-select:focus {
        outline: none;
        border-color: #5ea443;
        box-shadow: 0 0 0 3px rgba(94,164,67,.14);
    }

.ev-link-tools {
    min-width: 330px;
}

@media (max-width: 1100px) {
    .ev-player-row-card {
        grid-template-columns: 48px minmax(0, 1fr) auto !important;
    }

    .ev-pool-filterbar {
        grid-template-columns: 1fr;
    }

    .ev-link-tools {
        min-width: 0;
        width: 100%;
    }
}

@media (max-width: 760px) {
    .ev-player-row-card {
        grid-template-columns: 48px minmax(0, 1fr) !important;
    }
}

/* =========================================================
   EVIDENCE - dostupní hráči/rodiče: search + dropdown
   ========================================================= */

.ev-link-section-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    margin-bottom: 10px !important;
}

    .ev-link-section-head h4 {
        margin: 0 !important;
        color: #002558 !important;
        font-size: 14px !important;
        font-weight: 900 !important;
        white-space: nowrap !important;
    }

.ev-link-tools {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 430px !important;
}

.ev-pool-filterbar {
    display: grid !important;
    grid-template-columns: minmax(170px, 1fr) 142px !important;
    gap: 8px !important;
    align-items: center !important;
    width: 100% !important;
}

.ev-pool-search,
.ev-pool-select {
    width: 100% !important;
    height: 34px !important;
    min-height: 34px !important;
    border: 1px solid #cbd6e2 !important;
    border-radius: 17px !important;
    background-color: #ffffff !important;
    color: #002558 !important;
    font-family: Tahoma, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 34px !important;
    box-sizing: border-box !important;
    box-shadow: 0 2px 8px rgba(0, 37, 88, .04) !important;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease !important;
}

.ev-pool-search {
    padding: 0 14px 0 34px !important;
    background-image: linear-gradient(transparent, transparent) !important;
    position: relative !important;
}

    .ev-pool-search::placeholder {
        color: #7a8796 !important;
        font-weight: 700 !important;
    }

.ev-pool-select {
    padding: 0 31px 0 13px !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: linear-gradient(45deg, transparent 50%, #002558 50%), linear-gradient(135deg, #002558 50%, transparent 50%) !important;
    background-position: calc(100% - 17px) 14px, calc(100% - 12px) 14px !important;
    background-size: 5px 5px, 5px 5px !important;
    background-repeat: no-repeat !important;
}

    .ev-pool-search:focus,
    .ev-pool-select:focus {
        outline: none !important;
        border-color: #5ea443 !important;
        box-shadow: 0 0 0 3px rgba(94, 164, 67, .16) !important;
        background-color: #ffffff !important;
    }

    .ev-pool-search:hover,
    .ev-pool-select:hover {
        border-color: #9bb8d2 !important;
    }

/* malá lupa před inputem bez zásahu do HTML */
.ev-pool-filterbar {
    position: relative !important;
}

    .ev-pool-filterbar:before {
        content: "⌕";
        position: absolute;
        left: 13px;
        top: 50%;
        transform: translateY(-50%);
        color: #5ea443;
        font-size: 17px;
        font-weight: 900;
        z-index: 1;
        pointer-events: none;
    }

@media (max-width: 900px) {
    .ev-link-section-head {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .ev-link-tools {
        max-width: none !important;
        width: 100% !important;
    }

    .ev-pool-filterbar {
        grid-template-columns: 1fr !important;
    }

        .ev-pool-filterbar:before {
            display: none
        }

    .ev-pool-search {
        padding: 0 14px !important;
    }
}

/* konec stylu pro evidenci */

/* =========================================================
   SETTINGS - TJF Čechie Čejetice
   Moderní administrace obsahu webu
   ========================================================= */

.set-page {
    min-height: 100vh;
    background: #eef2f5;
    font-family: Tahoma, Arial, sans-serif;
    color: #002558;
}

.set-hero {
    min-height: 230px;
    background: linear-gradient(90deg, rgba(0,37,88,.96) 0%, rgba(0,37,88,.72) 42%, rgba(0,37,88,.22) 100%), url('../Images/news-hero-bg.jpg') center center / cover no-repeat;
    border-bottom: 4px solid #91cf45;
    display: flex;
    align-items: center;
}

.set-hero-inner {
    width: min(1320px, calc(100% - 40px));
    margin: 0 auto;
    color: white;
}

.set-hero-mark {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 14px;
    background: #5ea443;
    color: #ffed00;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    border-radius: 999px;
}

.set-hero h1 {
    margin: 18px 0 10px;
    color: #ffffff;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.set-hero p {
    margin: 0;
    max-width: 740px;
    color: rgba(255,255,255,.92);
    font-size: 17px;
    line-height: 1.45;
}

.set-shell {
    width: min(1320px, calc(100% - 40px));
    margin: 16px auto 60px;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 18px 42px rgba(0,0,0,.14);
    overflow: hidden;
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
}

.set-sidebar {
    background: #002558;
    padding: 18px 12px;
}

.set-nav-item {
    min-height: 46px;
    padding: 0 14px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .02em;
    text-transform: uppercase;
    transition: background .16s ease, color .16s ease;
}

    .set-nav-item:hover {
        background: rgba(255,255,255,.10);
        color: #ffed00 !important;
    }

    .set-nav-item.selected {
        background: #5ea443;
        color: #ffed00 !important;
    }

.set-nav-icon {
    width: 23px;
    min-width: 23px;
    text-align: center;
    opacity: .95;
}

.set-content {
    min-width: 0;
    padding: 24px;
}

.set-section {
    animation: setFadeIn .16s ease;
}

@keyframes setFadeIn {
    from {
        opacity: 0;
        transform: translateY(4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.set-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

    .set-section-head h2 {
        margin: 0 0 6px;
        color: #002558;
        font-size: 26px;
        line-height: 1.1;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

    .set-section-head p {
        margin: 0;
        color: #5b6470;
        font-size: 14px;
        line-height: 1.4;
    }

.set-head-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.set-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 190px 170px 120px;
    gap: 10px;
    padding: 12px;
    margin-bottom: 18px;
    border: 1px solid #dfe6ef;
    border-radius: 8px;
    background: #f8fafc;
}

.set-input {
    width: 100%;
    min-height: 42px;
    border: 1px solid #cbd6e2;
    border-radius: 5px;
    background: #ffffff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    font-weight: 700;
    box-sizing: border-box;
    padding: 0 12px;
}

select.set-input {
    padding-right: 32px;
    cursor: pointer;
}

.set-input:focus {
    outline: none;
    border-color: #91cf45;
    box-shadow: 0 0 0 3px rgba(145,207,69,.18);
}

.set-textarea {
    padding-top: 10px;
    min-height: 120px;
    line-height: 1.45;
    resize: vertical;
}

.set-mt8 {
    margin-top: 8px;
}

.set-btn {
    min-height: 42px;
    border-radius: 5px;
    border: 1px solid #cbd6e2;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .03em;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: none !important;
    white-space: nowrap;
}

.set-btn-green {
    background: #5ea443;
    border-color: #5ea443;
    color: #ffffff;
}

    .set-btn-green:hover {
        background: #4f9238;
        color: #ffffff;
    }

.set-btn-blue {
    background: #002558;
    border-color: #002558;
    color: #ffffff;
}

    .set-btn-blue:hover {
        background: #073b7a;
        color: #ffffff;
    }

.set-btn-light {
    background: #ffffff;
    border-color: #cbd6e2;
    color: #002558;
}

    .set-btn-light:hover {
        background: #f4f7fb;
    }

.set-btn-danger {
    background: #c62828;
    border-color: #c62828;
    color: #ffffff;
}

.set-message {
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid #cce3bf;
    border-left: 5px solid #5ea443;
    border-radius: 6px;
    background: #f6fbf2;
    color: #002558;
    font-size: 13px;
    font-weight: 800;
}

.set-subsection {
    margin-top: 24px;
}

    .set-subsection h3 {
        margin: 0 0 10px;
        color: #002558;
        font-size: 17px;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

.set-info-strip {
    margin-bottom: 12px;
    padding: 11px 13px;
    border: 1px dashed #b7c9df;
    border-radius: 6px;
    background: #f7fafc;
    color: #5b6470;
    font-size: 13px;
    line-height: 1.35;
}

.set-photo-grid,
.set-card-grid,
.set-news-grid {
    display: grid;
    gap: 14px;
}

.set-photo-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.set-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.set-news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.set-photo-card,
.set-entity-card,
.set-news-card,
.set-list-row {
    border: 1px solid #dfe6ef;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 5px 16px rgba(0,37,88,.06);
    overflow: hidden;
}

.set-photo-card {
    display: grid;
    grid-template-rows: 142px auto auto;
}

.set-photo-thumb {
    background: #eef2f5;
}

    .set-photo-thumb img {
        width: 100%;
        height: 142px;
        object-fit: cover;
        display: block;
    }

.set-photo-body {
    padding: 12px;
}

    .set-photo-body strong,
    .set-entity-head strong,
    .set-news-card strong,
    .set-list-row strong {
        display: block;
        color: #002558;
        font-size: 15px;
        font-weight: 900;
        line-height: 1.25;
    }

    .set-photo-body span,
    .set-entity-head span,
    .set-news-date,
    .set-list-row span {
        display: block;
        margin-top: 4px;
        color: #5ea443;
        font-size: 12px;
        font-weight: 900;
    }

    .set-photo-body em {
        display: block;
        margin-top: 6px;
        color: #6b7280;
        font-size: 12px;
        font-style: normal;
    }

.set-card-actions {
    display: flex;
    gap: 8px;
    padding: 10px 12px 12px;
    align-items: center;
    justify-content: flex-end;
}

.set-mini-btn {
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid #cbd6e2;
    border-radius: 5px;
    background: #ffffff;
    color: #002558 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 900;
    text-decoration: none !important;
    text-transform: uppercase;
}

    .set-mini-btn:hover {
        background: #f4f8ef;
        border-color: #91cf45;
    }

.set-mini-danger {
    color: #c62828 !important;
}

.set-list {
    display: grid;
    gap: 10px;
}

.set-list-row {
    min-height: 76px;
    padding: 13px 14px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 16px;
    align-items: center;
}

    .set-list-row p,
    .set-entity-card p,
    .set-news-card p {
        margin: 6px 0 0;
        color: #394657;
        font-size: 13px;
        line-height: 1.4;
    }

.set-list-row-category {
    grid-template-columns: 22px minmax(0, 1fr) auto;
}

.set-color-dot {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(0,37,88,.08);
}

.set-entity-card {
    padding: 14px;
}

.set-entity-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.set-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 11px;
}

    .set-tags span {
        min-height: 24px;
        padding: 0 9px;
        border-radius: 999px;
        background: #edf6e8;
        color: #397828;
        display: inline-flex;
        align-items: center;
        font-size: 11px;
        font-weight: 900;
    }

.set-news-card {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
}

    .set-news-card img {
        width: 180px;
        height: 150px;
        object-fit: cover;
        display: block;
        background: #eef2f5;
    }

    .set-news-card > div {
        padding: 13px;
    }

    .set-news-card .set-card-actions {
        grid-column: 1 / -1;
    }

.set-amount {
    color: #002558;
    font-size: 18px;
    font-weight: 900;
    white-space: nowrap;
}

/* Modal */

.set-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 200000;
    background: rgba(0,18,42,.60);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 26px;
    box-sizing: border-box;
}

.set-modal {
    width: min(980px, calc(100vw - 40px));
    max-height: calc(100vh - 52px);
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 24px 80px rgba(0,0,0,.35);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.set-modal-head {
    min-height: 58px;
    padding: 0 14px 0 22px;
    background: #002558;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .set-modal-head span,
    .set-modal-head label {
        color: #ffffff;
        font-size: 16px;
        font-weight: 900;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

.set-close {
    width: 40px;
    height: 40px;
    border: none;
    background: transparent;
    color: #ffffff;
    font-size: 30px;
    line-height: 36px;
    cursor: pointer;
}

.set-modal-body {
    padding: 22px;
    overflow-y: auto;
}

.set-editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.set-field {
    min-width: 0;
}

    .set-field label {
        display: block;
        margin-bottom: 7px;
        color: #002558;
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
    }

.set-field-wide {
    grid-column: 1 / -1;
}

.set-two-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.set-checkbox {
    color: #002558;
    font-weight: 800;
}

.set-check-list {
    border: 1px solid #dfe6ef;
    border-radius: 7px;
    background: #f8fafc;
    padding: 12px;
}

    .set-check-list label {
        display: inline-flex !important;
        align-items: center;
        min-height: 32px;
        margin: 0 12px 8px 0 !important;
        color: #002558 !important;
        font-size: 13px !important;
        font-weight: 800 !important;
        text-transform: none !important;
    }

    .set-check-list input {
        margin-right: 7px;
    }

.set-check-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px 10px;
}

.set-drop-zone {
    min-height: 150px;
    border: 2px dashed #b7c9df;
    border-radius: 9px;
    background: #f8fafc;
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    padding: 14px;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease;
}

    .set-drop-zone:hover,
    .set-drop-zone.is-dragover {
        border-color: #91cf45;
        background: #f6fbf2;
    }

.set-preview-img {
    width: 210px;
    height: 120px;
    object-fit: cover;
    border-radius: 6px;
    background: #edf2f7;
    display: block;
}

.set-drop-zone strong {
    display: block;
    color: #002558;
    font-size: 16px;
    font-weight: 900;
}

.set-drop-zone span {
    display: block;
    margin-top: 5px;
    color: #6b7280;
    font-size: 13px;
}

.set-hidden-file {
    position: absolute;
    left: -9999px;
    opacity: 0;
    width: 1px;
    height: 1px;
}

.set-modal-foot {
    min-height: 68px;
    padding: 14px 22px;
    border-top: 1px solid #e4ebf3;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.set-confirm {
    width: 380px;
    max-width: calc(100vw - 40px);
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 24px 80px rgba(0,0,0,.35);
    padding: 24px;
}

    .set-confirm h3 {
        margin: 0 0 10px;
        color: #002558;
        font-size: 22px;
        text-transform: uppercase;
    }

    .set-confirm p {
        margin: 0 0 20px;
        color: #394657;
        line-height: 1.45;
    }

.set-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

/* Responsive */

@media (max-width: 1100px) {
    .set-shell {
        grid-template-columns: 1fr;
    }

    .set-sidebar {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        padding: 12px;
    }

    .set-nav-item {
        white-space: nowrap;
        min-height: 40px;
    }

    .set-content {
        padding: 18px;
    }

    .set-photo-grid,
    .set-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .set-news-grid {
        grid-template-columns: 1fr;
    }

    .set-toolbar {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 767px) {
    .set-hero {
        min-height: 190px;
    }

    .set-hero-inner,
    .set-shell {
        width: calc(100% - 20px);
    }

    .set-shell {
        margin-top: 14px;
    }

    .set-section-head {
        flex-direction: column;
        align-items: stretch;
    }

    .set-head-actions {
        justify-content: stretch;
    }

        .set-head-actions .set-btn,
        .set-btn {
            width: 100%;
        }

    .set-toolbar {
        grid-template-columns: 1fr;
    }

    .set-photo-grid,
    .set-card-grid,
    .set-news-grid {
        grid-template-columns: 1fr;
    }

    .set-news-card {
        grid-template-columns: 1fr;
    }

        .set-news-card img {
            width: 100%;
            height: 180px;
        }

    .set-list-row,
    .set-list-row-category {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .set-card-actions {
        justify-content: stretch;
    }

    .set-mini-btn {
        flex: 1 1 auto;
    }

    .set-modal-backdrop {
        align-items: stretch;
        padding: 8px;
    }

    .set-modal {
        width: 100%;
        max-height: calc(100vh - 16px);
    }

    .set-editor-grid {
        grid-template-columns: 1fr;
    }

    .set-two-cols {
        grid-template-columns: 1fr;
    }

    .set-check-grid {
        grid-template-columns: 1fr;
    }

    .set-drop-zone {
        grid-template-columns: 1fr;
    }

    .set-preview-img {
        width: 100%;
        height: 170px;
    }

    .set-modal-foot {
        display: grid;
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   SETTINGS - úpravy fotoalb, typů událostí, přepínačů a barev
   ========================================================= */

.set-eventtype-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.set-eventtype-row {
    grid-template-columns: minmax(0, 1fr) 110px auto !important;
    align-items: center !important;
}

.set-eventtype-main strong {
    display: block;
    margin-bottom: 4px;
}

.set-eventtype-main span {
    display: block;
    color: #4d5967;
    font-size: 13px;
}

.set-eventtype-main .set-tags {
    margin-top: 8px;
}

.set-eventtype-surface {
    justify-self: center;
    min-width: 76px;
    min-height: 28px;
    border-radius: 999px;
    background: #edf7e9;
    color: #4f9238;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 900;
}

.set-switch-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 12px 22px;
    padding: 16px;
    border: 1px solid #dfe6ef;
    border-radius: 8px;
    background: #f8fafc;
}

.set-switch-row {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-height: 36px;
    color: #002558;
}

    .set-switch-row strong {
        font-size: 13px;
        font-weight: 900;
    }

.set-switch {
    position: relative;
    display: inline-flex;
    width: 50px;
    height: 28px;
    margin: 0 !important;
    cursor: pointer;
}

    .set-switch input[type="checkbox"] {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .set-switch span {
        display: block;
        width: 50px;
        height: 28px;
        border-radius: 999px;
        background: #d7e0ea;
        transition: background .16s ease;
    }

        .set-switch span:after {
            content: "";
            position: absolute;
            left: 4px;
            top: 4px;
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background: #ffffff;
            box-shadow: 0 2px 6px rgba(0,0,0,.22);
            transition: left .16s ease;
        }

    .set-switch input[type="checkbox"]:checked + span {
        background: #5ea443;
    }

        .set-switch input[type="checkbox"]:checked + span:after {
            left: 26px;
        }

.set-hidden-control {
    display: none !important;
}

.set-color-editor {
    display: grid;
    grid-template-columns: minmax(180px, 260px) 54px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.set-color-picker {
    width: 54px;
    height: 42px;
    border: 1px solid #cbd6e2;
    border-radius: 7px;
    background: #ffffff;
    padding: 4px;
    cursor: pointer;
}

.set-color-palette {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

    .set-color-palette button {
        width: 30px;
        height: 30px;
        border: 2px solid #ffffff;
        border-radius: 50%;
        box-shadow: 0 0 0 1px #cbd6e2, 0 2px 6px rgba(0,0,0,.12);
        cursor: pointer;
    }

.set-file-input {
    width: 100%;
    min-height: 42px;
    border: 1px solid #cbd6e2;
    border-radius: 6px;
    background: #ffffff;
    color: #002558;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    font-weight: 800;
    padding: 6px;
    box-sizing: border-box;
}

    .set-file-input::file-selector-button {
        height: 30px;
        margin-right: 12px;
        padding: 0 14px;
        border: none;
        border-radius: 4px;
        background: #002558;
        color: #ffffff;
        font-family: Tahoma, Arial, sans-serif;
        font-size: 12px;
        font-weight: 900;
        cursor: pointer;
    }

        .set-file-input::file-selector-button:hover {
            background: #073b7a;
        }

.set-album-existing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 12px;
    padding: 14px;
    border: 1px dashed #b9cbe0;
    border-radius: 8px;
    background: #f8fafc;
}

.set-album-existing-photo {
    border: 1px solid #dfe6ef;
    border-radius: 7px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0,37,88,.06);
}

    .set-album-existing-photo img {
        width: 100%;
        height: 82px;
        object-fit: cover;
        display: block;
    }

.set-album-existing-delete {
    min-height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #c62828 !important;
    text-decoration: none !important;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    border-top: 1px solid #edf0f5;
}

    .set-album-existing-delete:hover {
        background: #fff5f5;
    }

@media (max-width: 900px) {
    .set-eventtype-row {
        grid-template-columns: 1fr !important;
    }

    .set-eventtype-surface {
        justify-self: start;
    }

    .set-switch-grid,
    .set-color-editor {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   SETTINGS - CheckBoxList jako přepínače
   ========================================================= */

.set-switch-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px 18px;
    padding: 14px;
    border: 1px solid #d7dfeb;
    border-radius: 8px;
    background: #f8fafc;
}

    .set-switch-list > span {
        display: flex;
        align-items: center;
        min-height: 34px;
        flex-wrap: wrap
    }

    .set-switch-list input[type="checkbox"] {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

        .set-switch-list input[type="checkbox"] + label {
            position: relative;
            display: inline-flex;
            align-items: center;
            min-height: 30px;
            padding-left: 58px;
            color: #002558;
            font-size: 13px;
            font-weight: 900;
            cursor: pointer;
            user-select: none;
        }

            .set-switch-list input[type="checkbox"] + label:before {
                content: "";
                position: absolute;
                left: 0;
                top: 50%;
                width: 46px;
                height: 24px;
                border-radius: 999px;
                background: #d8e0ea;
                transform: translateY(-50%);
                box-shadow: inset 0 0 0 1px rgba(0, 37, 88, .08);
                transition: background .16s ease;
            }

            .set-switch-list input[type="checkbox"] + label:after {
                content: "";
                position: absolute;
                left: 4px;
                top: 50%;
                width: 18px;
                height: 18px;
                border-radius: 50%;
                background: #ffffff;
                transform: translateY(-50%);
                box-shadow: 0 2px 5px rgba(0,0,0,.24);
                transition: left .16s ease;
            }

        .set-switch-list input[type="checkbox"]:checked + label:before {
            background: #5ea443;
        }

        .set-switch-list input[type="checkbox"]:checked + label:after {
            left: 24px;
        }

@media (max-width: 640px) {
    .set-switch-list {
        grid-template-columns: 1fr;
    }
}
/* konec stylu pro Settings */

/* =========================================================
   HOMEPAGE GALLERY LIGHTBOX
   ========================================================= */

.homeGalleryNoScroll {
    overflow: hidden;
}

.homeGalleryLightbox {
    position: fixed;
    inset: 0;
    z-index: 300000;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0, 10, 24, .88);
}

    .homeGalleryLightbox.is-open {
        display: flex;
    }

.homeGalleryImageWrap {
    position: relative;
    max-width: calc(100vw - 140px);
    max-height: calc(100vh - 90px);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .homeGalleryImageWrap img {
        max-width: 100%;
        max-height: calc(100vh - 90px);
        display: block;
        object-fit: contain;
        box-shadow: 0 24px 80px rgba(0,0,0,.55);
    }

.homeGalleryClose {
    position: fixed;
    top: 18px;
    right: 26px;
    width: 46px;
    height: 46px;
    border: none;
    background: transparent;
    color: #ffffff;
    font-size: 46px;
    line-height: 42px;
    cursor: pointer;
    z-index: 300010;
}

.homeGalleryArrow {
    position: fixed;
    top: 50%;
    width: 58px;
    height: 86px;
    border: none;
    background: rgba(255,255,255,.08);
    color: #ffffff;
    font-size: 70px;
    line-height: 70px;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 300010;
    transition: background .16s ease;
}

    .homeGalleryArrow:hover {
        background: rgba(94,164,67,.72);
    }

.homeGalleryArrowLeft {
    left: 18px;
}

.homeGalleryArrowRight {
    right: 18px;
}

.homeGalleryInfo {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 42px;
    padding: 10px 14px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: linear-gradient(0deg, rgba(0,0,0,.72), rgba(0,0,0,0));
    color: #ffffff;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
}

    .homeGalleryInfo strong {
        white-space: nowrap;
    }

@media (max-width: 767px) {
    .homeGalleryImageWrap {
        max-width: calc(100vw - 24px);
        max-height: calc(100vh - 90px);
    }

    .homeGalleryArrow {
        width: 44px;
        height: 64px;
        font-size: 52px;
        background: rgba(0,37,88,.55);
    }

    .homeGalleryArrowLeft {
        left: 4px;
    }

    .homeGalleryArrowRight {
        right: 4px;
    }

    .homeGalleryClose {
        top: 8px;
        right: 12px;
    }
}

/* konec homepage gallery lightbox */

/* =========================================================
   CONTACT - bankovní účet s QR platbou
   ========================================================= */

.contactBankCardWithQr {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 116px;
    gap: 20px;
    align-items: center;
}

    .contactBankCardWithQr .contactCardIcon {
        align-self: start;
    }

.contactBankContent {
    min-width: 0;
}

.contactBankQrBox {
    width: 108px;
    height: 108px;
    border: 1px solid #d7dfeb;
    border-radius: 14px;
    background: #f8fafc;
    box-shadow: 0 8px 22px rgba(6, 38, 83, 0.08);
    padding: 8px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.contactBankQrImage {
    width: 72px;
    height: 72px;
    object-fit: contain;
    display: block;
    margin-bottom: 5px;
}

.contactBankQrBox span {
    color: #002558;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 1.1;
    text-align: center;
}

@media (max-width: 1199px) {
    .contactBankCardWithQr {
        grid-template-columns: 58px minmax(0, 1fr);
    }

    .contactBankQrBox {
        grid-column: 2;
        width: 112px;
        height: 112px;
        margin-top: 6px;
    }

    .contactBankQrImage {
        width: 76px;
        height: 76px;
    }
}

@media (max-width: 640px) {
    .contactBankCardWithQr {
        grid-template-columns: 1fr;
        text-align: left;
    }

        .contactBankCardWithQr .contactCardIcon {
            margin-bottom: 0;
        }

    .contactBankQrBox {
        grid-column: auto;
        margin: 8px auto 0 auto;
    }
}
/* SETTINGS - zprávy v editoru */

.set-editor-message {
    margin: 14px 14px 0 14px;
    padding: 12px 14px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 900;
}

    .set-editor-message.is-error {
        background: #fff1f1;
        border: 1px solid #ffc7c7;
        color: #b91c1c;
    }

    .set-editor-message.is-success {
        background: #f1f8ed;
        border: 1px solid #b7dfa6;
        color: #2f6e1f;
    }

/* SETTINGS - horní stránková hláška */

.set-page-message {
    margin: 16px 0;
    padding: 13px 16px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 900;
}

    .set-page-message.is-success {
        background: #f1f8ed;
        border: 1px solid #b7dfa6;
        color: #2f6e1f;
    }

    .set-page-message.is-error {
        background: #fff1f1;
        border: 1px solid #ffc7c7;
        color: #b91c1c;
    }

/* =========================================================
   CALENDAR - drag & drop přesun událostí
   ========================================================= */

.tjcCalendarEventDraggable {
    cursor: grab !important;
}

    .tjcCalendarEventDraggable:active {
        cursor: grabbing !important;
    }

.tjcEventDragging {
    opacity: .42 !important;
    transform: scale(.96) !important;
}

.tjcCalendarDayDropTarget {
    transition: background .14s ease, box-shadow .14s ease;
}

body.tjcCalendarDragging .tjcCalendarDayDropTarget {
    outline: 1px dashed rgba(94, 164, 67, .45);
    outline-offset: -4px;
}

.tjcCalendarDropHover {
    background: rgba(94, 164, 67, .13) !important;
    box-shadow: inset 0 0 0 3px rgba(94, 164, 67, .55) !important;
}

/* =========================================================
   CALENDAR - zvýraznění právě uložené události
   ========================================================= */

.tjcCalendarEventJustSaved {
    position: relative !important;
    z-index: 20 !important;
    animation: tjcSavedEventPulse 2.2s ease-in-out 0s 2;
    box-shadow: 0 0 0 3px rgba(94, 164, 67, .55), 0 10px 26px rgba(0, 37, 88, .25) !important;
}

@keyframes tjcSavedEventPulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(94, 164, 67, .75), 0 8px 20px rgba(0, 37, 88, .18);
    }

    45% {
        transform: scale(1.045);
        box-shadow: 0 0 0 7px rgba(94, 164, 67, .18), 0 14px 30px rgba(0, 37, 88, .28);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(94, 164, 67, 0), 0 8px 20px rgba(0, 37, 88, .18);
    }
}

/* mobil */
@media (max-width: 400px) {
    .newsTextShort {
        overflow: hidden !important;
    }
}

/* =========================================================
   EVIDENCE - kontakt hráče / zákonného zástupce
   ========================================================= */

.ev-contact-mode-check {
    align-items: flex-start;
    line-height: 1.35;
    cursor: pointer;
    user-select: none;
}

.ev-field-help,
.ev-contact-mode-intro {
    display: block;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.45;
}

.ev-field-help {
    margin: 5px 0 0 25px;
}

.ev-contact-mode-intro {
    margin: -6px 0 14px;
}

.ev-direct-contact-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.ev-direct-contact-grid label {
    margin-top: 0;
}

@media (max-width: 760px) {
    .ev-direct-contact-grid {
        grid-template-columns: 1fr;
    }

    .ev-field-help {
        margin-left: 0;
    }
}