p {
	line-height: 1.9;
}

#tm-section-1 p a {
    color: #FF0;
}

section p a {
    color: #FF0;
}

.media.center-images img {
    margin: auto;
}


header h2.tm-text-shadow {
    margin-top: 40px;
}

.tm-text-shadow { text-shadow: 0px 1px 1px rgba(50, 50, 50, 1); }

/* ------- pozadi pod texty ---------- */

.blur-background {
    background: rgb(200 200 200 / 60%);
    box-shadow: 0 0 50px 100px rgb(200 200 200 / 60%);
}

.blur-background-blue {
    background: rgb(3 74 185 / 40%); /* alternativne rgb(3 74 185 / 40%) - pozadi ktere ma tmavsi odstin a vetsi pruhlednost, vyzkouset primo na miste */
	/* background: rgb(102 151 194 / 60%);  alternativne rgb(3 74 185 / 40%) - pozadi ktere ma tmavsi odstin a vetsi pruhlednost, vyzkouset primo na miste */
    box-shadow: 0 0 130px 130px rgb(3 74 185 / 40%) ;
}

.blur-background-blue-30 {
    background: rgb(102 151 194 / 60%);
    box-shadow: 0 0 30px 30px rgb(102 151 194 / 60%);
}

.blur-background-blue-40 {
    background: rgb(102 151 194 / 60%);
    box-shadow: 0 0 40px 40px rgb(102 151 194 / 60%);
}

.tm-btn {
	background: rgba(255, 255, 200, 0.1);
}


/* ------------- citace --------------- */
blockquote {
    font-size: 1.3em; /* Větší písmo pro vyniknutí */
    line-height: 1.7;
    margin: 40px auto; /* Vertikální odsazení pro oddělení */
    padding: 25px 30px; /* Vnitřní odsazení */
    border-left: 5px solid #ffed00ad; /* Výrazná levá linka ve žluté barvě */
    background-color: rgba(255, 255, 200, 0.4); /* Velmi jemné, průhledné žluté pozadí */
    color: #333; /* Mírně tmavší text, ale ne černý */
    font-style: normal; /* Zajistí, že nebude kurzíva, pokud by ji prohlížeč přidal defaultně */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); /* Jemný stín pro hloubku */
    border-radius: 0 5px 5px 0; /* Zaoblení jen na pravé straně pro moderní vzhled */
    position: relative; /* Pro pseudo-element uvozovek */
}

/* Styl pro samotný text citátu uvnitř blockquote */
blockquote p {
    margin-bottom: 10px;
    font-size: 1em; /* Relativní velikost k blockquote */
    color: inherit; /* Zdědí barvu z blockquote */
}

/* Styl pro patičku citátu (autor) */
blockquote footer {
    text-align: right; /* Autor vpravo */
    font-size: 0.9em;
    color: #645400; /* Jemnější barva pro autora */
    margin-top: 10px;
}

/* Velké, dekorativní uvozovky (volitelné, ale efektní) */
blockquote::before {
    content: "„"; /* Levá uvozovka */
    font-family: 'Merriweather', serif; /* Použij Merriweather pro uvozovky */
    font-size: 4em; /* Velikost uvozovky */
    color: rgba(0, 123, 255, 0.3); /* Průhledná modrá barva uvozovky */
    position: absolute;
    top: 10px;
    left: 10px;
    line-height: 1;
    opacity: 0.7;
}

blockquote::after {
    content: "“"; /* Pravá uvozovka */
    font-family: 'Merriweather', serif;
    font-size: 4em;
    color: rgba(0, 123, 255, 0.3);
    position: absolute;
    bottom: 10px;
    right: 10px;
    line-height: 1;
    opacity: 0.7;
}

/* ---------- kalendar akci ------------------- */

.section-calendar {
    width: 120%;
    margin-left: -5%;
}

/* Základní styly pro tabulku */
.events-table {
    width: 120%; /* Rozprostře se na celou šířku kontejneru */
    margin-left: -5%;
    border-collapse: separate; /* Umožní border-spacing a zaoblené rohy */
    border-spacing: 0 5px; /* Mezery mezi řádky pro jemnější vzhled (ale malé mezery at neni tabulka moc dlouha) */
    font-family: 'Open Sans', sans-serif; /* Používáme Open Sans pro lepší čitelnost tabulkových dat */
    background-color: rgba(255, 255, 255, 0.75); /* Jemné bílé pozadí pro čitelnost na fotce */
    border-radius: 12px; /* Zaoblené rohy */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); /* Jemný stín */
    padding: 15px; /* Vnitřní odsazení tabulky */
}

.events-table col.event-col-date, .events-table col.event-col-time { width: 50px; }
.events-table col.event-col-place { width: 100px; }
.events-table col.event-col-price { width: 80px; }

/* Hlavička tabulky */
.events-table thead th {
    font-weight: bold;
    color: #007bff; /* Světle modrá, tvoje primární barva */
    padding: 10px 10px; /* snizeni vysky */
    text-align: left; /* Zarovnání záhlaví */
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 1.1em;
}

.events-table a {
    color: #4260ff;
    text-decoration: underline;
}

/* Buňky tabulky */
.events-table tbody td {
    padding: 3px 10px; /* snizeni vysky */
    color: #333;
    vertical-align: middle; /* Vertikální zarovnání obsahu buněk */
    border-bottom: 1px solid rgba(0, 0, 0, 0.05); /* Velmi jemná oddělovací linka */
}

.events-table tbody tr:last-child td {
    border-bottom: none; /* Poslední řádek nemá spodní linku */
}

/* Hover efekt pro řádky */
.events-table tbody tr:hover {
    background-color: rgba(255, 255, 200, 0.6); /* Velmi světlá žlutá s průhledností při najetí */
}

/* Odsazení pro první a poslední buňku (datum a vstupné) */
.events-table tbody td:first-child { text-align: center; }
.events-table tbody td:last-child { text-align: center; font-weight: 400; /*color: #ffc107;*/ }

.events-table td.vstupne span {font-size: 1rem;}


.events-table tbody td[data-label="Název"] { /* Specifické úpravy pro buňku Název */
    text-align: left;
    font-weight: 400;
}

/* Styly pro ikonky a text názvu */
.events-table .event-title {
    display: flex;
    align-items: center;
    gap: 8px; /* Mezera mezi ikonkou a textem */
    text-align: left; /* Text názvu zarovnán vlevo */
}

.events-table .event-icon {
    flex-shrink: 0; /* Zabrání ikoně zmenšit se */
    /*font-size: 1.2em; /* Velikost ikonky */
    padding-right: 2px;
}

/* --- Styly pro jednotlivé typy akcí (řádky) --- */

/* Zpívání */
.events-table tr.event-singing {
    background-color: rgba(173, 216, 230, 0.45); /* Velmi světlá modrá s nízkou průhledností */
    border-left: 4px solid #007bff; /* Středně modrá linka */
    border-radius: 5px; /* Jemné zaoblení řádku */
}
.events-table tr.event-singing .icon-singing::before {
    content: "🎵";
    color: #007bff;
}

/* Tance */
.events-table tr.event-dancing {
    background-color: rgba(255, 255, 153, 0.25); /* Velmi světlá žlutá s nízkou průhledností */
    border-left: 4px solid rgb(255, 235, 0); /* Tvá žlutá z menu */
    border-radius: 5px;
}
.events-table tr.event-dancing .icon-dancing::before {
    content: "🌀";
    color: rgb(255, 235, 0);
}

/* Ostatní akce */
.events-table tr.event-other {
    /*background-color: rgba(200, 200, 200, 0.15); /* Velmi světlá šedá s nízkou průhledností */
    border-left: 4px solid #888; /* Neutrální šedá linka */
    border-radius: 5px;
}
.events-table tr.event-other .icon-other::before {
    content: "⭐";
    color: #888;
}

/* --- Responzivní design pro tabulku (velmi důležité pro dlouhé tabulky!) --- */
@media screen and (max-width: 768px) {
    .events-table {
        border: 0; /* Skryje hlavní rámeček tabulky */
        padding: 0;
        box-shadow: none; /* Odstraní stín pro "karty" */
        width: 100%;
        margin-left: 0;
    }


    .events-table col.event-col-date,
    .events-table col.event-col-time,
    .events-table col.event-col-place,
    .events-table col.event-col-price {
        width: auto;
    }

    .events-table thead {
        display: none; /* Skryje záhlaví tabulky na mobilu */
    }

    .events-table tr {
        display: block; /* Každý řádek se stane blokovým elementem (kartou) */
        margin-bottom: 20px;
        background-color: rgba(255, 255, 255, 0.95); /* Neprůhlednější bílá pro karty */
        border: 1px solid rgba(0, 0, 0, 0.1); /* Jemný rámeček pro každou kartu */
        border-left: none; /* Odstraníme linku, pokud budeme chtít jiný styl */
        border-radius: 8px; /* Zaoblené rohy karty */
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); /* Jemný stín pro každou kartu */
        padding: 15px;
        position: relative; /* Pro pseudo-element s linkou */
    }
    /* Přenese border-left na pseudo-element na mobilu */
    .events-table tr::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 6px; /* Šířka barevné linky */
        border-radius: 8px 0 0 8px; /* Zaoblení jen levé strany */
    }
    .events-table tr.event-singing::before { background-color: #007bff; }
    .events-table tr.event-dancing::before { background-color: rgb(255, 235, 0); }
    .events-table tr.event-other::before { background-color: #888; }


    .events-table tbody td {
        display: block; /* Každá buňka se stane blokovým elementem */
        text-align: right; /* Text obsahu zarovnán vpravo */
        border-bottom: 1px dotted rgba(0, 0, 0, 0.1); /* Jemné oddělení položek uvnitř karty */
        padding-left: 50%; /* Odsazení pro pseudo-element labelu */
        position: relative;
    }

    .events-table tbody td:last-child {
        border-bottom: 0; /* Poslední buňka v kartě nemá spodní linku */
    }

    /* Zobrazí labels (záhlaví sloupce) pomocí data-label atributu */
    .events-table tbody td::before {
        content: attr(data-label);
        position: absolute;
        left: 0;
        width: 45%; /* Šířka labelu */
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
        color: #007bff; /* Barva labelu */
    }

    /* Úpravy pro ikonu a název na mobilu */
    .events-table .event-title {
        flex-direction: column; /* Ikonka nad textem */
        align-items: flex-start;
        text-align: left;
    }
    .events-table .event-icon {
        margin-bottom: 5px; /* Mezera pod ikonou */
    }
    .events-table .event-title .event-icon::before {
        font-size: 1.5em; /* Větší ikonka na mobilu */
    }
    .events-table tbody td[data-label="Název"] { /* Specifické úpravy pro buňku Název */
        text-align: left;
    }
}


/* Slick slider, Magnific Popup - obrazky */

.slick-dotted.slick-slider {
    margin-bottom: 80px;
}

a.tm-slider-img:hover {
    color: white;
    text-decoration: none;

}

.slide-caption {
    margin-top: 5px;
    text-align: center;
}

/* tlacitko Nahoru */

#moveTopBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 60px; /* Place the button at the bottom of the page */
    right: 30px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    outline: none; /* Remove outline */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 6px 12px;
    font-size: inherit;
    background: rgb(151 174 192 / 70%);
}


/* Leve menu */

.sidebar {
    background: rgb(255 235 0 / 81%); /* odkontrolovano 2025-07-29 */
}
.tm-main-nav a:hover, .tm-main-nav a:focus {
	color: #4260ff;
	background-image: url(../img/nav-item.png);
}

.tm-main-nav a.active {
	background-image: url(../img/nav-item-highlight-dark.png);
	color: #4260ff;
}


#tmSideBar {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

.sidebar {
    padding: 60px 40px 0 40px;
}

.tm-main-nav a {
    padding-right: 0px;
}

.tm-nav-fa-icon {
	display: none;
    /*margin-right: 25px;*/
}


/* ukotveni na displeji */
.sidebar {
  position: sticky;
  top: 0; /* Ukotví se k hornímu okraji */
  left: 0; /* Umístění na levý okraj */
  height: 100vh; /* Volitelně, aby zabíral celou výšku viewportu */
  width: 200px; /* Nastavte požadovanou šířku */
  overflow-y: auto; /* Pokud je obsah delší než výška, umožní rolování uvnitř menu */
}


/* ----------------- RESPONZE --------------------------------------------------------------------------*/

@media (max-width: 1800px) {
    .section-calendar {
        margin-left: auto;
    }
}

@media (max-width: 1724px) {
    #tmSideBar {
        padding: 30px 10px 0 0px;
    }

	.tm-main-nav a {
		margin: 20px 25px 40px 25px;
	}

}

@media (max-width: 1400px) {
    #tmSideBar {
        max-width: 100%;
        overflow-y: visible;
    }

    .sidebar {
        padding: 60px 20px;
    }

    .tm-main-nav a {
        margin: 10px 0 25px 10px;
    }

    .tm-nav-fa-icon {
        display: none;
    }
}