:root {
    --bg: #0f1724;
    --card: #0f1724;
    --muted: #1e266d;
    --accent: #6c8cff;
    --accent-2: #7be0c7;
    --glass: rgba(255, 255, 255, 0.06);
    --radius: 16px;
    --primary-color: #5a67d8;
    --active-item-bg: #5a67d8;
    font-family: 'Poppins', sans-serif;
}

* {
    box-sizing: border-box
}

html,
body {
    height: 100%;
    width: 100%;
    /* Přidáno pro plnou šířku */
    overflow-x: hidden;
    /* Přidáno pro zamezení horizontálního scrollu */
}

body {
    margin: 0;
    /*background: linear-gradient(180deg, #eef3ff 0%, #dde8ff 60%);*/
    color: #e6eef8 !important;
    /*color: #000;*/
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.45;
}

a {
    color: #0779e4;
}

.clear {
    clear: both;
}

input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.pageBody {
    margin-left: 0px;
    padding-right: 10px;
}

#pageBody {
    max-width: 1200px;
    margin: auto;
    --pad: 22px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(2, 8, 23, 0.06);
    border-radius: 18px;
    box-shadow: 0 10px 25px rgba(2, 8, 23, 0.18);
    backdrop-filter: blur(10px);
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.lock_info_free_text {
    font-size: 13px;
    color: #f44336;
}

.pageBodyHeadWarningInfo--devel {
    background-color: #e8f4fd;
    color: #0c5460;
    border: 1px solid #b8daff;
    border-left: 5px solid #17a2b8;
}

.pageBodyHeadWarningInfo {
    background-color: #fff9db;
    color: #856404;
    border: 1px solid #e5d5a5;
    border-left: 5px solid #ffc107;
    padding: 6px 20px;
    border-radius: 6px;
    margin-bottom: 5px;
    margin-top: 5px;
    margin-left: 5px;
    margin-right: 5px;
    text-align: left;
    font-weight: 600;
    font-size: 14px;
    line-height: 1.5;
}

.pageBodyHeadBtnUpsell {
    background: #007bff;
    color: #fff;
    padding: 4px 12px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: bold;
    font-size: 0.85em;
    margin-left: 10px;
}

.pageBodyHeadWarningInfo_close-btn {
    position: relative;
    top: 10px;
    right: 10px;
    float: right;
    transform: translateY(-50%);
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    color: #000;
    opacity: 0.5;
}

.pageBodyHeadWarningInfo_close-btn:hover {
    opacity: 1;
}

.dialog-overlay {
    display: none;
    /* Skryje overlay, dokud není aktivován */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    /* Poloprůhledné pozadí */
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.dialog-box {
    background-color: #fff;
    padding: 25px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    width: 300px;
    text-align: center;
    font-family: Arial, sans-serif;
}

.dialog-box h2 {
    margin-top: 0;
    color: #333;
}

.dialog-box p {
    color: #666;
    margin-bottom: 20px;
}

.dialog-box .buttons {
    display: flex;
    justify-content: space-around;
}

.dialog-box .buttons button {
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
}

.dialog-box .buttons .btn-cancel {
    background-color: #e0e0e0;
    color: #333;
}

.dialog-box .buttons .btn-logout {
    background-color: #d9534f;
    color: #fff;
}

.btn.primary {
    background: #3498db;
    color: #fff;
    border: none;
}

.btn {
    padding: 10px 16px;
    border-radius: 10px;
    cursor: pointer;
    border: 1px solid var(--line);
    background: #fff;
}

.mainPageBodyKontroler {
    display: flex;
}

.pageBodyKontrolerAdminMenu {
    float: left;
    width: 250px;
    background-color: #2e3748;
}

.pageBodyKontroler {
    min-height: 90vh;
    color: #0f1724;
    /*
  margin-left: 30px;
  margin-right: 30px;
  */
    flex: 1;
    width: calc(100% - 250px);
    float: left;
    /*
  margin-left: 10px;
  margin-right: 10px;
  */
    padding-right: 5px;
}

.pageHeadText {
    margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 15px;
    text-align: center;
    font-size: 21px;
    color: #555;
    font-weight: 600;
}

.pageBody {}

.pageErrorText {
    text-align: center;
}

ul {
    list-style-type: none;
    padding: 0px;
}

li {
    list-style-type: none;
    padding: 0px;
}

.hero {
    max-width: 1375px;
    margin-left: auto;
    margin-right: auto;
}

.container-features-list {
    max-width: 660px;
    padding-top: 50px;
}

.features-list-head-text {
    text-align: center;
    font-size: 2.5rem;
    margin: 0 0 12px;
    letter-spacing: -0.02em;
    color: var(--muted);
    font-weight: bold;
}

.features-list-benefits-ul {
    color: var(--muted);
    text-align: center;
}

/* Kontejner a nadpis */
.feature-check-boxs_section {
    padding: 60px 20px;
    background-color: #ffffff;
    /* Pokud chcete tečkované pozadí, lze přidat pattern */
    font-family: sans-serif;
}

.feature-check-boxs_container {
    max-width: 570px;
    margin: 0 auto;
}

.feature-check-boxs_title {
    text-align: center;
    font-size: 24px;
    font-weight: 800;
    color: #1d1d35;
    margin-bottom: 50px;
}

/* Grid rozvržení */
.feature-check-boxs_grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 40px 25px;
    /* Větší horní mezera kvůli ikonám */
}

/* Karta */
.feature-check-boxs_card {
    border: 1.5px solid #2b2b2b;
    border-radius: 12px;
    padding: 35px 20px 20px 20px;
    position: relative;
    text-align: center;
    background: #fff;
}

/* Zelená ikona s fajfkou */
.feature-check-boxs_icon {
    background-color: #5ce0b5;
    /* Tyrkysově zelená z obrázku */
    color: white;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    position: absolute;
    top: -20px;
    /* Posun o polovinu nahoru */
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Text uvnitř karty */
.feature-check-boxs_text {
    font-size: 15px;
    line-height: 1.4;
    color: #4a4a68;
    margin: 0;
}

.feature-check-boxs_text strong {
    color: #1d1d35;
    font-weight: 700;
}

/* Responzivita pro mobily */
@media (max-width: 600px) {
    .feature-check-boxs_grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }
}

/* layout */
.container {
    /*width: min(1100px, 92%);*/
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
}

#containerCenterText {
    max-width: 800px;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
}

/* Topbar */
.topbar {
    position: sticky;
    top: 0 !important;
    z-index: 40;
    backdrop-filter: blur(6px);
    background: #eef3ff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
    box-shadow: 0px 3px 10px -5px rgba(0, 0, 0, 0.53);
    -webkit-box-shadow: 0px 3px 10px -5px rgba(0, 0, 0, 0.53);
    -moz-box-shadow: 0px 3px 10px -5px rgba(0, 0, 0, 0.53);
}

.topbar-inner {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 10px 25px 0px 25px;
}

.brand {
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--accent);
    text-decoration: none;
}

.nav {
    margin-left: auto;
    display: flex;
    gap: 0.9rem;
    align-items: center;
}

.nav.open a {
    color: #ffff !important;
}

.nav a {
    color: var(--muted);
    text-decoration: none;
    padding: 8px 12px;
    border-radius: 10px;
    font-weight: 600;
}

.nav a:hover {
    color: var(--accent);
}

.store-btn:hover {
    opacity: 0.9 !important;
    transform: translateY(-1px) !important;
    background-color: #3498db;
}

.btn {
    background-color: #3498db;
    color: #fff;
    padding: 10px 14px;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 700;
    box-shadow: 0 6px 20px rgba(108, 140, 255, 0.15);
}

.btnAdminLogin {
    color: #fff !important;
}

.btnAdminLogin:hover {
    opacity: 0.9 !important;
    transform: translateY(-1px) !important;
    background-color: #3498db;
}

/* hamburger (mobile) */
.hamburger {
    display: none;
    margin-left: 8px;
    background: transparent;
    border: 0;
    color: var(--muted);
    font-size: 1.3rem;
    cursor: pointer;
}

/* Hero */
.hero {
    padding: 10px 0;
}

.hero-grid {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 32px;
    align-items: center;
}

.hero-text {
    padding-left: 5px;
    padding-right: 5px;
    text-align: center;
}

.hero-text h1 {
    font-size: 3rem;
    margin: 0 0 12px;
    letter-spacing: -0.02em;
    color: var(--muted);
}

.hero-text p {
    color: var(--muted);
    margin: 0 0 18px;
    /*max-width:36rem;*/
}

.cta-row {
    /*display:flex;*/
    gap: 12px;
    margin-bottom: 16px;
}

.cta-row-center {
    text-align: center;
    gap: 12px;
    margin-bottom: 16px;
}

.store-btn {
    display: inline-block;
    background-color: #3498db;
    color: #ffff;
    padding: 10px 14px;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 700;
    box-shadow: 0 6px 20px rgba(108, 140, 255, 0.15);
}

.store-btn.alt {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.06);
    color: var(--muted);
}

.hero-feats {
    list-style: none;
    padding: 0;
    margin: 10px 0 0;
    display: flex;
    gap: 12px;
    color: var(--muted)
}

.hero-feats li {
    font-weight: 600;
    font-size: 0.95rem
}

/* phone preview */
.hero-phone {
    display: flex;
    justify-content: center
}

.phone-frame {
    max-width: 70%;
    /*width:280px;*/
    border-radius: 28px;
    overflow: hidden;
    background: linear-gradient(180deg, #071021, #0b1724);
    padding: 10px;
    box-shadow: 0 20px 60px rgba(7, 18, 36, 0.6);
    transform: translateY(0);
    transition: transform .5s ease;
}

.phone-frame img {
    width: 100%;
    height: auto;
    max-width: 250px;
    display: block;
    border-radius: 16px
}

.phone-frame:hover {
    transform: translateY(-8px)
}

.phone-decor {
    height: 8px
}

/* Features */
.features {
    margin-top: 50px;

    /*  
      background-color: #edf2fe;
      -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
      border-radius: 50px;
      margin-left: 25px;
      margin-right: 25px;
      padding-top: 25px;
      padding-bottom: 80px;
  */
}

.section-title {
    text-align: center;
    font-size: 2rem;
    margin-bottom: 24px;
    color: var(--muted);
}

.section-title-center {
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
}

.section-title-footer {
    text-align: center;
    font-size: 2rem;
    margin-bottom: 24px;
    color: #FFFF;
}

.features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    padding-left: 5px;
    padding-right: 5px;
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

.feature-card {
    background-color: #5665fe;
    border-radius: 14px;
    padding: 18px;
    min-height: 140px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 280px;
}

.feature-card:hover {
    transform: translateY(-8px)
}

.feature-card .icon {
    font-size: 1.6rem
}

.feature-card h3 {
    margin: 0;
    color: white;
}

.feature-card p {
    color: white;
}

/* Screens */
.screens {
    padding: 48px 0
}

.screens-grid {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap
}

.screens-grid img {
    border-radius: 14px;
    width: 220px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6)
}

/* Pricing */
.pricing {
    padding: 0px 5px 25px 5px;
}

.pricing-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 320px));
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 20px;
}

.price-card {
    background-color: #5665fe;
    padding: 20px;
    height: 435px;
    border-radius: 14px;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    width: 100%;
    max-width: 305px;
    box-sizing: border-box;
    color: #fff;
    margin-top: 30px;
}

.price-card-pageHeadText {
    margin-top: 0px;
    margin-bottom: 0px;
    text-align: center;
    font-size: 21px;
    color: #555;
    font-weight: 600;
}

.price-card-section-title {
    text-align: center;
    font-size: 2rem;
    margin-bottom: 0px;
    margin-top: 0px;
    color: var(--muted);
}

.price-card-ordernew-button {
    margin-top: 0px;
}

.price-card-ordernew-button-btn {
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.45);
    height: 41px;
    display: block;
    width: 130px;
    margin-left: auto;
    margin-right: auto;
}

.price-card-pricing-toggle-container {
    display: flex;
    /*align-items: center;*/
    justify-content: center;
    gap: 20px;
    margin: 0px;
    font-family: sans-serif;
}

.price-card-pricing-toggle-container span {
    font-weight: 600;
    color: #666;
}

.price-card-pricing-toggle-container span.price-card-active {
    color: #5665fe;
}

.price-card-switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 30px;
}

.price-card-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.price-card-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: .4s;
    border-radius: 34px;
}

.price-card-slider:before {
    position: absolute;
    content: "";
    height: 22px;
    width: 22px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
}

input:checked+.price-card-slider {
    background-color: #5665fe;
}

input:checked+.price-card-slider:before {
    transform: translateX(30px);
}

.price-card-discount-badge {
    background-color: #ffeb3b;
    color: #000;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 12px;
    margin-left: 5px;
}

/* Logika zobrazení Měsíc vs Rok */
.price-card-price-yearly,
.price-card-btn-yearly {
    display: none !important;
}

.price-card-is-yearly .price-card-price-yearly,
.price-card-is-yearly .price-card-btn-yearly {
    display: block !important;
}

.price-card-is-yearly .price-card-price-monthly,
.price-card-is-yearly .price-card-btn-monthly {
    display: none !important;
}

/* Zachování blokového zobrazení cen */
.price-card-price-monthly,
.price-card-price-yearly {
    width: 100%;
}

.price-card-orderinfo-button {
    background: #3498db;
    color: #fff;
    padding: 10px 14px;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 700;
    box-shadow: 0 6px 20px rgba(108, 140, 255, 0.15);
    border: 1px solid var(--line);
    width: 130px;
    height: 41px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.45);
    /*margin-top: 10px;*/
}

.price-card-orderinfo-button-space {
    width: 115px;
    height: 41px;
    margin-top: 10px;
}

.price-card-show-more {
    margin-top: 10px;
}

.price-card-toggle-btn {
    background: none;
    border: none;
    color: #ffff;
    padding: 0px;
    cursor: pointer;
    font-size: 0.9em;
    transition: color 0.3s;
    text-decoration: underline;
    margin-top: 0px;
}

.price-card-addonpage-section {
    max-width: 1100px;
    width: 100%;
    margin: 40px auto;
    text-align: center;
    padding: 0 20px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.price-card-addonpage-title {
    color: #2d3447;
    font-size: 28px;
    margin-bottom: 30px;
    font-weight: bold;
}

.price-card-addonpage-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    /* Vycentrování boxů */
    align-items: stretch;
}

/* --- KARTY --- */
.price-card-addonpage-card {
    background: white;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
    border: 1px solid #e1e4e8;
    flex: 1 1 300px;
    max-width: 305px;
}

.price-card-addonpage-card:hover {
    transform: translateY(-5px);
}

.price-card-addonpage-header {
    height: 12px;
    width: 100%;
}

.price-card-addonpage-header-blue {
    background-color: #5e66ff;
}

.price-card-addonpage-header-green {
    background-color: #009337;
}

.price-card-addonpage-header-purple {
    background-color: #8e44ad;
}

.price-card-addonpage-content {
    padding: 25px;
    text-align: left;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.price-card-addonpage-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 15px;
    gap: 10px;
}

.price-card-addonpage-name {
    font-size: 15px;
    font-weight: 600;
    color: #2d3447;
}

.price-card-addonpage-price {
    font-weight: bold;
    color: #2d3447;
    font-size: 16px;
    white-space: nowrap;
}

.price-card-addonpage-desc {
    font-size: 14px;
    color: #6a737d;
    line-height: 1.5;
    margin-bottom: 25px;
    flex-grow: 1;
}

.price-card-addonpage-btn {
    background-color: #f0f3f6;
    color: #2d3447;
    border: none;
    padding: 12px 0;
    width: 100%;
    border-radius: 8px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s;
}

.price-card-addonpage-btn:hover {
    background-color: #2d3447;
    color: white;
}

/* --- VLASTNÍ DIALOG (MODAL) --- */

/* Hlavní kontejner, který zakryje celou obrazovku */
.price-card-addonpage-modal-overlay {
    /* Skryto v základu - JS musí nastavit display: flex */
    display: none;

    /* Fixní pozice na okno prohlížeče (viewport) */
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;

    /* Vzhled pozadí */
    background: rgba(0, 0, 0, 0.6);
    -webkit-backdrop-filter: blur(3px);
    /* Podpora pro Safari */
    backdrop-filter: blur(3px);

    /* Centrování vnitřního okna na střed */
    display: none;
    /* Přepište na 'flex' v JS pro zobrazení */
    align-items: center;
    justify-content: center;

    /* Aby byl vždy nad všemi prvky na webu */
    z-index: 99999;
}

/* Samotné bílé okno dialogu */
.price-card-addonpage-modal {
    background: white;
    padding: 30px;
    border-radius: 20px;
    max-width: 400px;
    width: 90%;
    text-align: center;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);

    /* Zajištění, že se modal nehýbe z centra */
    position: relative;

    /* Animace při otevření */
    animation: price-card-addonpage-anim 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);

    /* Reset box-sizingu pro jistotu */
    box-sizing: border-box;
}

/* Definice animace (zvětšení a zprůhlednění) */
@keyframes price-card-addonpage-anim {
    from {
        transform: scale(0.9);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Nadpis v dialogu */
.price-card-addonpage-modal-title {
    font-size: 20px;
    font-weight: 800;
    color: #2d3447;
    margin-bottom: 12px;
    font-family: sans-serif;
}

/* Text popisu */
.price-card-addonpage-modal-text {
    color: #6a737d;
    line-height: 1.6;
    margin-bottom: 25px;
    font-family: sans-serif;
}

/* Spodní část s tlačítky */
.price-card-addonpage-modal-footer {
    display: flex;
    justify-content: center;
    gap: 12px;
}

/* Společný styl pro obě tlačítka */
.price-card-addonpage-modal-btn-confirm,
.price-card-addonpage-modal-btn-cancel {
    border: none;
    padding: 14px 20px;
    flex: 1;
    border-radius: 12px;
    font-weight: bold;
    font-size: 14px;
    cursor: pointer;
    transition: transform 0.1s ease, opacity 0.2s ease;
}

.price-card-addonpage-modal-btn-confirm:active,
.price-card-addonpage-modal-btn-cancel:active {
    transform: scale(0.96);
}

/* Potvrzovací tlačítko (tmavé) */
.price-card-addonpage-modal-btn-confirm {
    background: #2d3447;
    color: white;
}

/* Zrušit tlačítko (světlé) */
.price-card-addonpage-modal-btn-cancel {
    background: #f0f3f6;
    color: #2d3447;
}

.price-card-addonpage-modal-btn-cancel:hover {
    background: #e2e8f0;
}

.hidden-details {
    display: none;
    margin-top: 10px;
    padding-top: 0px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    text-align: left;
    font-size: 0.9em;
    color: #e8eaf6;
}

.hidden-details.is-visible {
    display: block !important;
}

.hidden-details p {
    margin-bottom: 10px;
    font-weight: 600;
}

.hidden-details ul {
    list-style: disc;
    margin-left: 0px;
    padding-left: 0px;
}

.hidden-details li {
    /*list-style-type: disc;*/
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    line-height: 30px;
}

.price-card-text {
    min-height: 275px;
    text-align: center;
}

.price-card-text ul {
    list-style-type: none;
    padding: 0px;
    text-align: center;
    margin: 0px;
}

.price-card-text li {
    list-style-type: none;
    padding-bottom: 10px;
    text-align: center;
    font-size: 16px;
    line-height: 22px;
    /*height: 50px;*/
    display: grid;
    align-items: center;
}

.btn-price-card {
    position: absolute;
    bottom: 0;
    margin-left: -60px;
    margin-bottom: 20px;
}

.price-card-free {
    margin-top: -40px;
    /*margin-left: 10px;*/
    /*width: 245px;*/
    padding: 0.5em 12px;
    background-color: #2e3748 !important;
    color: rgb(255, 255, 255);
    font-size: 16px;
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.price-card-free-body {
    background-color: #2e3748 !important;
}

.price-card-advanced {
    margin-top: -40px;
    /*margin-left: 10px;*/
    /*width: 245px;*/
    padding: 0.5em 12px;
    background-color: #4b54b7;
    color: rgb(255, 255, 255);
    font-size: 16px;
    border-radius: 14px;
}

.price-card-popular {
    margin-top: -40px;
    /*margin-left: 30px;*/
    /*width: 200px;*/
    padding: 0.5em 12px;
    background-color: #008531;
    color: rgb(255, 255, 255);
    font-size: 16px;
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

@media (max-width: 1083px) {
    .price-card {
        width: 100%;
        margin-top: 20px;
    }
}

@media (max-width: 335px) {
    .price-card-text li{
        font-size: 13px !important;
        padding-bottom: 5px !important;
    }
    .hidden-details li{
        line-height: 19px !important;
    }
}

.price-card h3 {
    font-size: 28px;
    margin-top: 0px;
    margin-bottom: 0px;
    text-transform: uppercase;
}

.price {
    font-size: 19px;
    margin: 0px 0 5px;
    color: #FFFF;
    font-weight: bold;
}

.price-card.popular {
    transform: translateY(-6px);
    border: 1px solid rgba(123, 224, 199, 0.09)
}

.pricing-cards-dph {
    text-align: right;
    margin-top: 15px;
}

.price-card-line-li {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: sans-serif;
    margin-bottom: 0px;
}

.price-card-line-green {
    color: #08f708;
    font-weight: bold;
    font-size: 20px;
    line-height: 1;
}

.price-card-line-red {
    color: #e91024;
    font-weight: bold;
    font-size: 20px;
    line-height: 1;
}

.price-card-line-text {
    font-size: 13px;
    color: #fff;
}


/* Contact */
.contact {
    padding: 48px 15px;
    background-color: #212240;
}

.contact-form {
    display: grid;
    gap: 10px;
    max-width: 560px;
    margin-top: 12px
}

.contact-form input,
.contact-form textarea {
    padding: 12px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.04);
    background: rgba(255, 255, 255, 0.02);
    color: inherit;
    outline: none;
}

/* Footer */
.footer {
    padding: 22px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.03)
}

.footer-inner {
    color: #0779e4;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px
}

/* responsiveness */
@media (max-width:900px) {
    .hero-grid {
        grid-template-columns: 1fr;
        text-align: center
    }

    .hero-phone {
        order: 0
    }

    .nav {
        display: none
    }

    .topbar-inner {
        display: block !important;
    }

    .hamburger {
        display: block !important;
        float: right;
    }

    .nav.open {
        display: flex;
        position: absolute;
        left: 0;
        right: 0;
        top: 64px;
        background: linear-gradient(180deg, rgba(7, 10, 20, 1), rgba(7, 10, 20, 1));
        padding: 12px;
        flex-direction: column;
        gap: 8px
    }
}

.separator-waves {
    width: 100%;
    /*height: 100px;*/
}

.separator-waves .separator-waves-parallax>use {
    animation: moveWaves 12s cubic-bezier(.55, .5, .45, .5) infinite;
}

.separator-waves .separator-waves-parallax>use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
}

.separator-waves .separator-waves-parallax>use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
}

.separator-waves .separator-waves-parallax>use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
}

.separator-waves .separator-waves-parallax>use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
}

@keyframes moveWaves {
    0% {
        transform: translate3d(-90px, 0, 0);
    }

    100% {
        transform: translate3d(85px, 0, 0);
    }
}

/*
.loginpage-container {
    background-color: rgba(255, 255, 255, 0.8);
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    max-width: 380px;
    box-sizing: border-box;
    margin: 20px;
    margin-left: auto;
    margin-right: auto;
}
*/

/* --- STYLY PŘIHLAŠOVACÍHO FORMULÁŘE --- */
.loginpage-form {
    /* Používá flexbox pro rozložení prvků ve sloupci. */
    display: flex;
    /* Uspořádá položky ve sloupci. */
    flex-direction: column;
    /* Mezera mezi jednotlivými položkami formuláře. */
    gap: 5px;
}

/* --- SKUPINA VSTUPNÍHO POLE (IKONA + INPUT) --- */
.loginpage-input-group {
    /* Relativní pozice pro umístění ikony uvnitř. */
    position: relative;
    /* Flexbox pro zarovnání ikony a vstupního pole. */
    display: flex;
    /* Zarovná ikony a text inputu vertikálně na střed. */
    align-items: center;
    /* Světlé pozadí pro oblast vstupního pole. */
    background-color: #f8f8f8;
    /* Zaoblení rohů vstupního pole. */
    border-radius: 10px;
    /* Jemný okraj vstupního pole. */
    border: 1px solid #e0e0e0;
    /* Vnitřní odsazení pro text a ikonu uvnitř pole. */
    padding: 10px 15px;
}

/* --- IKONA UVNITŘ VSTUPNÍHO POLE --- */
.loginpage-input-group .loginpage-icon {
    /* Velikost písma ikony. */
    font-size: 20px;
    /* Barva ikony. */
    color: #666;
    /* Pravý okraj ikony pro oddělení od textu inputu. */
    margin-right: 10px;
}

/* --- SAMOTNÉ VSTUPNÍ POLE (INPUT) --- */
.loginpage-input-group input {
    /* Umožní vstupnímu poli vyplnit zbývající prostor ve skupině. */
    flex-grow: 1;
    /* Odstraní výchozí okraj inputu. */
    border: none;
    /* Odstraní outline při zaměření inputu. */
    outline: none;
    /* Vnitřní odsazení pro text inputu. */
    padding: 5px 0;
    /* Velikost písma inputu. */
    font-size: 16px;
    /* Průhledné pozadí inputu, aby bylo vidět pozadí skupiny. */
    background-color: transparent;
    /* Barva textu inputu. */
    color: #333;
}

/* --- STYL TEXTU PLACEHOLDERU V INPUTU --- */
.loginpage-input-group input::placeholder {
    /* Barva placeholder textu. */
    color: #999;
}

/* --- SEKCE VOLITEBNÝCH MOŽNOSTÍ (CHECKBOX + ZAPOMENUTÉ HESLO) --- */
.loginpage-options {
    /* Používá flexbox pro zarovnání položek. */
    display: flex;
    /* Rozloží položky na opačné strany. */
    justify-content: space-between;
    /* Zarovná položky vertikálně na střed. */
    align-items: center;
    /* Velikost písma. */
    font-size: 14px;
    /* Barva textu. */
    color: #555;
    /* Horní okraj. */
    margin-top: 0px;
}

/* --- KONTEJNER PRO VLASTNÍ STYL CHECKBOXU --- */
.loginpage-checkbox-container {
    /* Chová se jako blokový element. */
    display: block;
    /* Relativní pozice pro absolutní umístění zaškrtávacího políčka. */
    position: relative;
    /* Levý padding pro prostor pro zaškrtávací políčko. */
    padding-left: 25px;
    /* Odstraní spodní okraj. */
    margin-bottom: 0;
    /* Změní kurzor na ruku, když je nad checkboxem. */
    cursor: pointer;
    /* Velikost písma textu vedle checkboxu. */
    font-size: 14px;
    /* Zabrání výběru textu. */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /* Barva textu. */
    color: #555;
}

/* --- SKRYTÍ VÝCHOZÍHO CHECKBOXU --- */
.loginpage-checkbox-container input {
    /* Absolutní pozice. */
    position: absolute;
    /* Skryje vizuálně. */
    opacity: 0;
    /* Kurzor zůstává aktivní. */
    cursor: pointer;
    /* Nulová výška a šířka. */
    height: 0;
    width: 0;
}

/* --- VLASTNÍ VIZUÁLNÍ ČTVEREC CHECKBOXU --- */
.loginpage-checkmark {
    /* Absolutní pozice vzhledem k `.loginpage-checkbox-container`. */
    position: absolute;
    /* Umístění nahoře a vlevo. */
    top: 0;
    left: 0;
    /* Velikost čtverce. */
    height: 18px;
    width: 18px;
    /* Barva pozadí nazaškrtnutého stavu. */
    background-color: #eee;
    /* Zaoblení rohů. */
    border-radius: 4px;
    /* Okraj čtverce. */
    border: 1px solid #ccc;
}

/* --- STYL CHECKBOXU PŘI ZAŠKRTNUTÍ --- */
.loginpage-checkbox-container input:checked~.loginpage-checkmark {
    /* Modrá barva pozadí při zaškrtnutí. */
    background-color: #2196F3;
    /* Modrá barva okraje při zaškrtnutí. */
    border-color: #2196F3;
}

/* --- VÝCHOZÍ SKRYTÍ ZAŠKRTÁVACÍHO "HÁČKU" --- */
.loginpage-checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* --- ZOBRAZENÍ ZAŠKRTÁVACÍHO "HÁČKU" PŘI ZAŠKRTNUTÍ --- */
.loginpage-checkbox-container input:checked~.loginpage-checkmark:after {
    display: block;
}

/* --- STYL ZAŠKRTÁVACÍHO "HÁČKU" --- */
.loginpage-checkbox-container .loginpage-checkmark:after {
    /* Pozice háčku uvnitř čtverce. */
    left: 6px;
    top: 2px;
    /* Rozměry háčku. */
    width: 5px;
    height: 10px;
    /* Barva a šířka okraje pro vytvoření háčku. */
    border: solid white;
    border-width: 0 3px 3px 0;
    /* Rotace pro správný úhel háčku. */
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* --- ODKAZ "ZAPOMENUTÉ HESLO?" --- */
.loginpage-forgot-password {
    /* Modrá barva odkazu. */
    color: #2196F3;
    /* Odstraní podtržení odkazu. */
    text-decoration: none;
    /* Silnější písmo. */
    font-weight: 500;
}

/* --- EFEKT HOVER NA ODKAZY --- */
.loginpage-forgot-password:hover,
.loginpage-register-link:hover {
    /* Podtrhne odkaz při přejetí myší. */
    text-decoration: underline;
}

/* --- ZÁKLADNÍ STYL TLAČÍTEK --- */
.loginpage-btn {
    /* Vnitřní odsazení tlačítek. */
    padding: 15px;
    /* Odstraní okraj tlačítka. */
    border: none;
    /* Zaoblení rohů tlačítek. */
    border-radius: 10px;
    /* Velikost písma textu tlačítka. */
    font-size: 16px;
    /* Silnější písmo textu tlačítka. */
    font-weight: 600;
    /* Změní kurzor na ruku. */
    cursor: pointer;
    /* Plynulá animace změny barvy pozadí. */
    transition: background-color 0.3s ease;
    /* Flexbox pro zarovnání textu a ikon. */
    display: flex;
    /* Zarovná text a ikony vertikálně na střed. */
    align-items: center;
    /* Zarovná text a ikony horizontálně na střed. */
    justify-content: center;
    /* Mezera mezi ikonou a textem pro sociální tlačítka. */
    gap: 10px;
}

/* --- STYL PRIMÁRNÍHO TLAČÍTKA (PŘIHLÁSIT SE) --- */
.loginpage-primary-btn {
    /* Jasně modrá barva pozadí jako v obrázku. */
    background-color: #2196F3;
    /* Bílá barva textu. */
    color: white;
    /* Text velkými písmeny. */
    text-transform: uppercase;
    /* Horní okraj po sekci options. */
    margin-top: 10px;
}

/* --- EFEKT HOVER NA PRIMÁRNÍM TLAČÍTKU --- */
.loginpage-primary-btn:hover {
    /* Mírně tmavší modrá při přejetí myší. */
    background-color: #1976D2;
}

/* --- ODDĚLOVAČ ("nebo") --- */
.loginpage-separator {
    /* Text na střed. */
    text-align: center;
    /* Vnější okraje nahoře a dole. */
    margin: 0;
    /* Relativní pozice pro absolutní umístění linek. */
    position: relative;
    /* Barva textu. */
    color: #888;
    /* Velikost písma. */
    font-size: 14px;
}

/* --- LINKY PO STRANÁCH ODDĚLOVAČE --- */
.loginpage-separator::before,
.loginpage-separator::after {
    content: '';
    /* Povinný pro pseudoelementy. */
    position: absolute;
    /* Absolutní pozice vzhledem k .loginpage-separator. */
    top: 50%;
    /* Vertikálně na střed. */
    width: 40%;
    /* Šířka linky. */
    height: 1px;
    /* Výška linky. */
    background-color: #ddd;
    /* Barva linky. */
}

/* --- LEVÁ LINKA ODDĚLOVAČE --- */
.loginpage-separator::before {
    left: 0;
    /* Umístí ji na levou stranu. */
}

/* --- PRAVÁ LINKA ODDĚLOVAČE --- */
.loginpage-separator::after {
    right: 0;
    /* Umístí ji na pravou stranu. */
}

/* --- TEXT "nebo" UVNITŘ ODDĚLOVAČE --- */
.loginpage-separator span {
    /* Barva pozadí odpovídající kontejneru pro překrytí linek. */
    background-color: rgba(255, 255, 255, 0.95);
    /* Vnitřní odsazení textu. */
    padding: 0 10px;
    /* Relativní pozice a vyšší z-index pro zajištění, že text je nad linkami. */
    position: relative;
    z-index: 1;
}

/* --- ZÁKLADNÍ STYL SOCIÁLNÍCH TLAČÍTEK --- */
.loginpage-social-btn {
    /* Bílé pozadí. */
    background-color: #fff;
    /* Tmavá barva textu. */
    color: #333;
    /* Jemný okraj. */
    border: 1px solid #ddd;
    /* Jemný stín. */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

/* --- EFEKT HOVER NA SOCIÁLNÍCH TLAČÍTKECH --- */
.loginpage-social-btn:hover {
    /* Mírně světlejší šedé pozadí při přejetí myší. */
    background-color: #f5f5f5;
}

/* --- STYL IKON V SOCIÁLNÍCH TLAČÍTKECH --- */
.loginpage-social-btn img {
    /* Velikost ikon. */
    height: 24px;
    width: 24px;
}

/* --- STYL TLAČÍTKA APPLE --- */
.loginpage-apple-btn {
    /* Černé pozadí. */
    background-color: #000;
    /* Bílá barva textu. */
    color: white;
}

/* --- EFEKT HOVER NA TLAČÍTKU APPLE --- */
.loginpage-apple-btn:hover {
    /* Tmavě šedé pozadí při přejetí myší. */
    background-color: #333;
}

/* --- VÝZVA K REGISTRACI --- */
.loginpage-signup-prompt {
    text-align: center;
    font-size: 16px;
    color: #555;
    font-weight: 600;
}

/* --- ODKAZ "ZAREGISTRUJTE SE" --- */
.loginpage-register-link {
    color: #2196F3;
    text-decoration: none;
    font-weight: 600;
}

.loginpage-lostpassword-link {
    color: #2196F3;
    text-decoration: none;
    font-weight: 600;
}

/* --- RESPONSIVNÍ STYLY PRO MENŠÍ OBRAZOVKY --- */
@media (max-width: 480px) {

    /* Kontejner přihlašování */
    .loginpage-container {
        /* Menší vnější okraj. */
        margin: 10px;
        /* Menší vnitřní odsazení. */
        padding: 20px;
        /* Menší zaoblení rohů. */
        border-radius: 10px;
    }

    /* Tlačítka */
    .loginpage-btn {
        /* Menší vnitřní odsazení. */
        padding: 12px;
        /* Menší velikost písma. */
        font-size: 15px;
    }

    /* Skupina vstupního pole */
    .loginpage-input-group {
        /* Menší vnitřní odsazení. */
        padding: 8px 12px;
    }

    /* Samotné vstupní pole */
    .loginpage-input-group input {
        /* Menší velikost písma. */
        font-size: 15px;
    }
}

/* new login end */

.prefix_admin_login-hero {
    max-width: 450px;
    margin: 30px auto 24px;
    padding: 0px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: start;
}

.prefix_admin_login-card {
    --pad: 22px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(2, 8, 23, 0.06);
    border-radius: 18px;
    box-shadow: 0 10px 25px rgba(2, 8, 23, 0.18);
    backdrop-filter: blur(10px);
    padding: 20px;
}

.prefix_admin_login-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 20px;
    border-bottom: 1px dashed rgba(2, 8, 23, 0.08);
}

.prefix_admin_login-card-title {
    font-weight: 700;
}

.prefix_admin_login-card-title-login-fail {
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #b71c1c;
    color: #fff;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    font-size: 15px;
}

.prefix_admin_login-meta {
    font-size: 14px;
    color: #475569;
}

.prefix_admin_login-meta a {
    color: #4338ca;
    text-decoration: none;
}

.prefix_admin_login-meta a:hover {
    text-decoration: underline;
}

.prefix_admin_login-field {
    display: grid;
    gap: 8px;
}

.prefix_admin_login-label {
    font-size: 14px;
    color: #334155;
    font-weight: 600;
}

.prefix_admin_login-control {
    position: relative;
}

.prefix_admin_login-input {
    width: 100%;
    padding: 14px 44px 14px 42px;
    border-radius: 14px;
    border: 1px solid rgba(2, 8, 23, 0.1);
    background: #fff;
    font-size: 15px;
}

.prefix_admin_login-input::placeholder {
    color: #94a3b8;
}

.prefix_admin_login-input:focus {
    outline: none;
    border-color: #93c5fd;
    box-shadow: 0 0 0 4px rgba(147, 197, 253, 0.35);
}

.prefix_admin_login-ico {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.7;
}

.prefix_admin_login-toggle {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 6px;
    border-radius: 10px;
}

.prefix_admin_login-toggle:hover {
    background: rgba(2, 8, 23, 0.06);
}

.prefix_admin_login-actions {
    display: grid;
    gap: 10px;
}

.prefix_admin_login-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: none;
    cursor: pointer;
    font-weight: 700;
    padding: 14px 16px;
    border-radius: 14px;
}

.prefix_admin_login-btn-primary {
    color: #fff;
    background: linear-gradient(135deg, #6366f1, #22d3ee);
    box-shadow: 0 20px 45px rgba(2, 8, 23, 0.28);
}

.prefix_admin_login-btn-primary:hover {
    filter: brightness(0.97);
    transform: translateY(-1px);
}

.left_menu_admin_sidebar {
    /*width: 250px;*/
    background-color: var(--sidebar-bg);
    color: var(--text-color-light);
    /*padding: 2rem 0;*/
    box-shadow: var(--shadow);
}

.left_menu_admin_profile {
    font-size: 1.1rem;
    font-weight: 600;
    /* border-bottom: 1px solid rgba(255, 255, 255, 0.1); */
    margin-bottom: 10px;
    color: #ecf0f1;
    padding: 10px 15px 0px;
}

.left_menu_admin_side-nav {
    padding-left: 10px;
    padding-right: 10px;
}

.left_menu_admin_side-nav ul {
    list-style: none;
}

.left_menu_admin_header {
    display: block;
    margin: 0px;
    text-align: left;
    padding-left: 5px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 10px;
    font-size: 16px;
}

.left_menu_admin_sub .left_menu_admin_item {
    font-size: 13px;
    opacity: 0.92;
}

.left_menu_admin_sub a {
    padding-left: 12px !important;
}

.left_menu_admin_header_mobile {
    display: none;
    margin: 0px;
    text-align: left;
    padding-left: 0px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 0px;
    font-size: 17px;
}

@media (max-width: 950px) {
    .left_menu_admin_header {
        display: none !important;
    }

    .left_menu_admin_header_mobile {
        display: block !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
}

.left_menu_admin_side-nav a {
    display: flex;
    align-items: center;
    padding: 7px 5px;
    text-decoration: none;
    color: var(--text-color-light);
    font-weight: 400;
    transition: background-color 0.3s ease;
    border-radius: 6px;
    margin: 4px 0px;
    background-color: #4e5563;
    box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.3);
}

.left_menu_admin_side-nav a i {
    margin-right: 1rem;
    width: 20px;
    text-align: center;
}

.left_menu_admin_side-nav a:hover {
    background-color: #3498db;
    color: #ffffff;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 6px;
}

.left_menu_admin_side-nav a.active {
    background-color: #3498db;
    color: #ffffff;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 6px;
}

.left_menu_admin_side-nav div {
    display: flex;
    align-items: center;
    padding: 7px 5px;
    text-decoration: none;
    color: var(--text-color-light);
    font-weight: 400;
    transition: background-color 0.3s ease;
    cursor: pointer;
    margin: 4px 0px;
    border-radius: 6px;
}

.left_menu_admin_side-nav div:hover {
    background-color: #3498db;
    color: #ffffff;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 6px;
}

.left_menu_admin_side-nav div i {
    margin-right: 1rem;
    width: 20px;
    text-align: center;
}

.left_menu_admin_item {
    padding-left: 5px;
}

@media (max-width: 950px) {
    .pageBodyKontrolerAdminMenu {
        /*
    width: 60px !important;
    float: left;
    */
        display: none !important;
        z-index: 9999;
    }

    .pageBodyKontrolerAdminMenu.open {
        display: block !important;
        width: 100% !important;
        float: none !important;
        position: absolute !important;
    }

    .pageBodyKontroler.hide {
        /*display: none !important;*/
    }

    .pageBodyKontroler {
        width: calc(100% - 100px) !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }

    .left_menu_admin_profile {
        display: none !important;
    }

    .left_menu_admin_item {
        /*display: none !important;*/
    }
}

@media (max-width: 600px) {
    .hero-text h1 {
        font-size: 2rem !important;
    }
}

.lostPasswordContent {
    --pad: 22px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(2, 8, 23, 0.06);
    border-radius: 18px;
    box-shadow: 0 10px 25px rgba(2, 8, 23, 0.18);
    backdrop-filter: blur(10px);
    padding: 20px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 50px;
}

.inputLostPassEmail {
    width: 100%;
    padding: 14px 14px 14px 14px;
    border-radius: 14px;
    border: 1px solid rgba(2, 8, 23, 0.1);
    background: #fff;
    font-size: 15px;
    margin-bottom: 20px;
    margin-top: 10px;
}

.pageDashboardTitle {
    text-align: center;
    font-size: 25px;
    font-weight: 600;
    margin-left: 15px;
    margin-top: 10px;
}

.pageDashboardPageBody {
    padding-left: 5px;
    padding-right: 5px;
    /*margin-right: 10px;*/
    margin-bottom: 20px;
    /* padding: 0px; */
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: start;
    /* max-width: 100% !important;*/
}

@media (max-width: 600px) {
    .pageDashboardPageBody {
        grid-template-columns: 1fr;
    }

    .pageDashboardPageBodyStats {
        margin-bottom: 0;
    }
}

.pageDashboardPageBodyDownloadStats {
    --pad: 22px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(2, 8, 23, 0.06);
    border-radius: 18px;
    box-shadow: 0 10px 25px rgba(2, 8, 23, 0.18);
    backdrop-filter: blur(10px);
    padding: 20px;
}

.pageDashboardPageBodyDownloadStatscard {}

.pageDashboardPageBodyDownloadStatshd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
}

.pageDashboardPageBodyDownloadStatspad {
    padding: 14px 18px;
}

.pageDashboardPageBodyDownloadStatschart {
    height: 90px;
    width: 100%;
}

.pageDashboardPageBodyDownloadStatsflex {
    margin-top: 10px;
    font-size: 12px;
    color: var(--muted);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pageLogoutBody {
    max-width: 450px;
    margin: 30px auto 24px;
    padding: 0px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: start;
}

.pageLogoutWindow {
    --pad: 22px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(2, 8, 23, 0.06);
    border-radius: 18px;
    box-shadow: 0 10px 25px rgba(2, 8, 23, 0.18);
    backdrop-filter: blur(10px);
    padding: 20px;
}

.pageLogoutHead {
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 20px;
    border-bottom: 1px dashed rgba(2, 8, 23, 0.08);
}

.pageLogoutHeadText {
    font-weight: 700;
}

.pageLogoutHeadLoginAginText {
    font-size: 14px;
    color: #475569;
}

.pageLogoutHeadLoginAginText a {
    font-size: 14px;
    color: #475569;
    font-weight: 400;
}

.pageLogoutText {
    text-align: center;
    margin-top: 25px;
    font-size: 14px;
    color: #334155;
    font-weight: 600;
}

.pageSettingsPageBody {
    margin: 20px 10px 5px 5px;
    align-items: start;
}

.pageSettingsUsersPageBody {
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 10px;
    margin: 10px;
}

@media (max-width: 950px) {
    .pageSettingsPageBodyUser {
        padding-left: 0px !important;
    }
}

.pageSettingsPageBodyUser {
    --pad: 22px;
    backdrop-filter: blur(10px);
    padding: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
}

.pageSettingsPageBodyUserHead {
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px dashed rgba(2, 8, 23, 0.08);
}

.pageSettingsPageBodyUserBody {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
    /*border: 1px solid #3498db;*/
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.pageSettingsPageBodyUserHeadTitle {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.pageSettingsPageBodyUserName {
    font-size: 16px;
    margin-top: 10px;
}

.pageSettingsPageBodyUserNameTitle {
    padding-top: 5px;
    padding-bottom: 5px;
}

.pageSettingsPageBodyUserForname {
    font-size: 16px;
}

.pageSettingsPageBodyUserFornameTitle {
    padding-top: 5px;
    padding-bottom: 5px;
}

.pageSettingsPageBodyUserFornameEmail {
    margin-left: 0px;
}

.pageSettingsPageBodyUserSaveButton {
    margin-top: 15px;
}

.pageSettingsPageBodyUserPassword {}

.pageSettingsPageBodyPasswordTitle {
    padding-top: 5px;
    padding-bottom: 5px;
}

.pageSettingsPageBodyUserSaveButton {}

.pageSettingsPageBodyUserMessageOk {
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #12a306;
    color: #fff;
    font-size: 15px;
}

.pageSettingsPageBodyUserMessageError {
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #b71c1c;
    color: #fff;
    font-size: 15px;
}

@media (max-width: 800px) {
    .pageSettingsPageBody {
        grid-template-columns: 1fr !important;
    }

    .pageSettingsPageBodyUser {
        max-width: 100% !important;
    }
}

.pageSettingsPageBodyBanner {
    margin: 30px 10px 10px 5px;
    padding: 0px;
    display: block;
}

@media (max-width: 1200px) {
    .pageSettingsPageBodyPwaSettings {
        max-width: 100% !important;
    }

    .pageSettingsPageBodyBanner {
        grid-template-columns: 1fr !important;
        display: block !important;
    }

    .pageSettingsPageBodyBannerHead {
        max-width: 100% !important;
    }

    .pageSettingsPageBodyBannerDown {
        max-width: 100% !important;
    }

    .pageSettingsPageBodyBannerMenuDown {
        max-width: 100% !important;
    }
}

@media (max-width: 950px) {
    .pageSettingsPageBodyPwaSettings {
        padding-left: 0px !important;
    }
}

.pageSettingsPageBodyPwaSettings {
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 5px;
    padding-right: 5px;
}

.pageSettingsPageBodyPwaSettingSaveButton {
    margin-left: 0px;
    margin-top: 15px;
}

.pageSettingsPageBodyPwaSettingsHeadTitle {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.pageSettingsPageBodyPwaSettingsHeadBody {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
    padding-top: 10px;
    /*border: 1px solid #3498db;*/
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.pwa_settings_form {
    margin: 0 auto;
}

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

.pwa_settings_label {
    display: block;
    margin-bottom: 5px;
}

/* Stylování inputů a textarea přes třídu */
.pwa_settings_input:not([type="submit"]):not([type="file"]),
.pwa_settings_textarea {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.pwa_settings_error-message {
    color: red;
    font-size: 0.9em;
    margin-top: 5px;
}

.pwa_settings_submit-btn {
    padding: 10px 15px;
    cursor: pointer;
    width: 110px;
}

/* Styl pro neaktivní tlačítko */
.pwa_settings_submit-btn:disabled {
    background-color: #aaa;
    cursor: not-allowed;
}

.pwa_settings_submit-btn:hover:not(:disabled) {
    /*background-color: #45a049;*/
}

.pageSettingsPageBodyBannerHead,
.pageSettingsPageBodyBannerDown,
.pageSettingsPageBodyBannerMenuDown {
    --pad: 22px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 8px;
    backdrop-filter: blur(10px);
    /* Now the grid columns determine the width */
    width: 100%;
    margin-bottom: 10px;
}

.pageSettingsPageBodyBannerHeadBody {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
    padding-top: 10px;
    /*border: 1px solid #3498db;*/
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.pageSettingsPageBodyBannerHeadTitle {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.pageSettingsPageBodySelectBanner {
    padding-top: 10px;
    padding-left: 0px;
    padding-bottom: 10px;
    text-align: left;
}

#bannerType {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

#bannerDownType {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

#bannerMenuDownType {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.pageSettingsPageBodySelectBannerTypeBody {
    padding-left: 5px;
}

.pageSettingsPageBodySelectBannerTypeBodyText {}

.pageSettingsPageBodySelectBannerTypeBodyTextTitle {
    text-align: left;
    margin-bottom: 10px;
}

@media (max-width: 369px) {
    .pageSettingsPageBodySelectBannerTypeBodyTextTitle {
        width: 55px !important;
    }

    .color-picker-input-text {
        margin-left: 0px !important;
        width: 50px !important;
    }
}

.pageSettingsPageBodySelectBannerTypeBodyTextColorInput {
    text-align: center;
}

.pageSettingsPageBodySelectBannerTypeBodyTextColorInput input {
    background: rgba(255, 255, 255, 0.72);
    padding: 2px;
    float: left;
}

.pageSettingsPageBodySelectBannerTypeBodyTextColorInput #textColor {
    height: 40px;
    width: 40px;
}

.pageSettingsPageBodySelectBannerTypeBodyTextColorInput #backgroundColor {
    height: 40px;
    width: 40px;
}

.pageSettingsPageBodySelectBannerTypeBodyTextColorInput #textColorBannerDown {
    height: 40px;
    width: 40px;
}

.pageSettingsPageBodySelectBannerTypeBodyTextColorInput #backgroundColorBannerDown {
    height: 40px;
    width: 40px;
}

.pageSettingsPageBodySelectBannerTypeBodyTextColorInput #textColorBannerMenuDown {
    height: 40px;
    width: 40px;
}

.pageSettingsPageBodySelectBannerTypeBodyTextColorInput #backgroundColorBannerMenuDown {
    height: 40px;
    width: 40px;
}

.pageSettingsPageBodySelectBannerTypeBodyImg {}

.pageSettingsPageBodyBannerPreview {
    padding-left: 5px;
    margin-top: 15px;
}

/* CSS styly pro náhled banneru */
.banner-preview {
    width: 100%;
    height: 40px;
    border: 1px solid #e5e7eb;
    background-color: #f0f0f0;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative;
}

/* Styl pro klikací overlay */
.banner-preview-link {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}

/* Styl pro obrázek */
.banner-preview img {
    /*height: 100%;*/
    width: auto;
    object-fit: cover;
    object-position: center;
}

/* Styl pro text */
.banner-preview-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 5px;
    padding-right: 5px;
}

.banner-preview_banner_down {
    width: 100%;
    height: 40px;
    border: 1px solid #e5e7eb;
    background-color: #f0f0f0;
    overflow: hidden;
    display: flex;
    justify-content: center;
    /* This is the key change */
    align-items: center;
    /* Removed redundant text-align: center; */
    position: relative;
    text-align: center;
}

.banner-menu-button-firstline {
    width: 100%;
    max-height: 40px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.banner-menu-button-socialline {
    width: 100%;
    max-height: 40px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

/* Styl pro klikací overlay */
.banner-preview-link {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}

/* Styl pro obrázek */
.banner-preview_banner_down img {
    /*height: 100%;*/
    width: auto;
    object-fit: cover;
    object-position: center;
}

/* Skryjeme kontejner na začátku */
#bannerPreviewContainer {
    display: none;
}

.pageSettingsPageBodyBannerPreviewTitleWarning {
    display: none;
}

.pageSettingsPageBodyBannerClickable {
    margin-top: 10px;
    margin-bottom: 10px;
}

.pageSettingsPageBodyBannerClickable input {
    float: left;
    width: 50px;
    margin-top: 5px;
}

.pageSettingsPageBodyBannerClickable label {
    float: left;
}

#bannerUrl {
    width: 100% !important;
}

#bannerDownUrl {
    width: 100% !important;
}

.pageSettingsPageBodyBannerTextColor {
    float: left;
    width: 50%;
}

.pageSettingsPageBodyBannerBackgroundColor {
    float: left;
    width: 50%;
}

.pageSettingsPageBodyBannerDownTextColor {
    float: left;
    width: 50%;
}

.pageSettingsPageBodyBannerDownBackgroundColor {
    float: left;
    width: 50%;
}

.pageSettingsPageBodyBannerMenuDownTextColor {
    float: left;
    width: 50%;
}

.pageSettingsPageBodyBannerMenuDownBackgroundColor {
    float: left;
    width: 50%;
}

#isDownBannerClickable {
    float: left;
    width: 50px;
    margin-top: 5px;
}

.pageSettingsPageBodyBannerDownClickable label {
    float: left;
}

.pageSettingsPageBodyBannerDownClickable {
    margin-top: 10px;
    margin-bottom: 10px;
}

.banner-menu-buttons {}

.banner-menu-button-social {
    float: left;
    margin-left: 0px;
    margin-right: 5px;
    /*font-size: 20px;*/
    font-size: 25px;
    display: none;
}

.banner-menu-button {
    float: left;
    margin-left: 0px;
    margin-right: 5px;
    font-size: 25px;
    display: none;
}

.menu-banner-icon-setting {
    margin-bottom: 10px;
    margin-top: 10px;
}

#showIconButton {
    float: left;
}

.showIconButtonInput {
    float: left;
    width: 30px;
    margin-top: 6px;
}

.menu-banner-icon-setting-showicon {
    float: right;
}

.collapseButtonSocialIconsClose {
    display: none;
    width: 100%;
    text-align: left;
    padding: 5px;
    border: 1px solid #ccc;
    background-color: #3498db;
    color: #fff;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    font-size: 17px;
    margin-top: 5px;
    margin-bottom: 5px;
    transition: background-color 0.2s;
}

.collapseButtonSocialIconsOpen {
    width: 100%;
    text-align: left;
    padding: 5px;
    border: 1px solid #ccc;
    background-color: #3498db;
    color: #fff;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    font-size: 17px;
    margin-top: 5px;
    margin-bottom: 5px;
    transition: background-color 0.2s;
}

.collapseButtonAddsIconsClose {
    display: none;
    width: 100%;
    text-align: left;
    padding: 5px;
    border: 1px solid #ccc;
    background-color: #3498db;
    color: #fff;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    font-size: 17px;
    margin-top: 5px;
    margin-bottom: 5px;
    transition: background-color 0.2s;
}

.collapseButtonAddsIconsOpen {
    width: 100%;
    text-align: left;
    padding: 5px;
    border: 1px solid #ccc;
    background-color: #3498db;
    color: #fff;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    font-size: 17px;
    margin-top: 5px;
    margin-bottom: 5px;
    transition: background-color 0.2s;
}

.blockButtonsAddsIcons {
    display: none;
}

.blockButtonsSocialIcons {
    display: none;
}

.pageSettingsPageBodyBannerHeadSaveButton {
    margin-left: 0px;
    margin-top: 15px;
}

.pageSettingsPageBodyBannerDownSaveButton {
    margin-left: 0px;
    margin-top: 15px;
}

.pageSettingsPageBodyBannerMenuDownSaveButton {
    margin-left: 0px;
    margin-top: 15px;
}





.pageSettingsPageBodySelectBannerTypeBodyTextTitle {
    font-weight: bold;
    margin-bottom: 5px;
}

.color-picker-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

.color-picker-input-color {
    height: 40px;
    width: 40px;
    border: 1px solid #ccc;
    padding: 0;
    cursor: pointer;
}

.color-picker-input-text {
    width: 66px;
    max-width: 80%;
    height: 37px;
    margin-top: 2px;
    margin-left: 0px;
    font-size: 14px;
    border: 1px solid #e5e7eb;
    border-radius: 5px;
    text-transform: uppercase;
}

:root {
    --notifikace_sidebar-width: 60px;
    --notifikace_primary-color: #3498db;
    --notifikace_secondary-color: #e8eaf6;
    --notifikace_accent-color: #4a55a6;
    --notifikace_text-color: #333;
    --notifikace_light-gray: #f5f5f5;
    --notifikace_white: #fff;
    --notifikace_border-color: #e0e0e0;
    --notifikace_font-family: 'Roboto', sans-serif;
}

.notifikace_main-content {
    flex-grow: 1;
    padding: 0;
    margin-left: var(--notifikace_sidebar-width);
    min-width: 250px;
}

.notifikace_header-top {
    display: flex;
    justify-content: flex-end;
    padding: 0;
    gap: 20px;
    font-weight: 500;
    flex-wrap: wrap;
}

.notifikace_header-top a {
    text-decoration: none;
    color: var(--notifikace_text-color);
    white-space: nowrap;
}

.notifikace_page-title {
    font-size: 28px;
    font-weight: 500;
    margin-bottom: 30px;
}

.notifikace_pageNotificationBody {
    margin-left: 5px;
    margin-right: 5px;
    background: rgba(255, 255, 255, 0.72);
    /* border-radius: 18px; */
    /* box-shadow: 0 0px 2px rgba(2, 8, 23, 0.18); */
    backdrop-filter: blur(10px);
    padding: 10px;
    width: 95%;
    box-sizing: border-box;
}

.notifikace_list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.notifikace_item {
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 8px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    /*
            border: 1px solid var(--notifikace_border-color);
            border-radius: 8px;
            padding: 5px;
            */
    background-color: var(--notifikace_white);
}

.notifikace_row-top,
.notifikace_row-bottom {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
}

.notifikace_row-top-url {
    display: none;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
}

.notifikace_row-bottom {
    margin-top: 0px;
}

.notifikace_cell {
    flex: 1 1 0px;
    display: flex;
    flex-direction: column;
    padding: 0;
    transition: opacity 0.3s ease;
    margin-bottom: 5px;
}

.notifikace_cell.notifikace_hidden {
    display: none;
}

.notifikace_date-cell {
    max-width: 180px;
    /* Nastavení maximální šířky pro datum */
}

.notifikace_cell label {
    font-weight: 500;
    color: #666;
    margin-bottom: 0px;
}

.notifikace_actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.notifikace_cell input,
.notifikace_cell textarea,
.notifikace_actions .notifikace_btn {
    width: 100%;
    box-sizing: border-box;
}

.notifikace_cell input[type="text"] {
    padding: 8px;
    border: 1px solid var(--notifikace_border-color);
    border-radius: 4px;
}

.notifikace_cell textarea.notifikace_textarea {
    padding: 8px;
    border: 1px solid var(--notifikace_border-color);
    border-radius: 4px;
    resize: none;
    overflow: hidden;
    min-height: 38px;
    font-family: inherit;
    font-size: inherit;
    line-height: 1.4;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.notifikace_cell input[type="date"] {
    padding: 7px;
    border: 1px solid var(--notifikace_border-color);
    border-radius: 4px;
}

.notifikace_radio-options {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.notifikace_cell-created {
    font-weight: 500;
    color: #666;
    margin-bottom: 0px;
}

.notifikace_btn {
    padding: 8px 12px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s;
    font-size: 14px;
}

.notifikace_btn-primary {
    background-color: var(--notifikace_primary-color);
    color: var(--notifikace_white);
}

.notifikace_btn-secondary {
    background-color: #f44336;
    color: var(--notifikace_white);
}

.notifikace_btn-create-new {
    background-color: var(--notifikace_primary-color);
    color: var(--notifikace_white);
    margin-top: 20px;
    padding: 12px 20px;
    font-size: 16px;
    display: block;
    width: fit-content;
    margin: 20px auto 0 auto;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 8px;
}

.notifikace_btn-cancel-send {
    background-color: #ffc107;
    color: var(--notifikace_white);
}

.notifikace_item_info-ok {
    display: none;
    background-color: var(--notifikace_primary-color);
    color: #ffff;
    padding: 5px;
    border: none;
    border-radius: 4px;
    font-weight: 500;
    margin-bottom: 5px;
}

/* --- RESPONSIVE STYLE --- */

@media (min-width: 769px) {

    .notifikace_row-top,
    .notifikace_row-bottom {
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: flex-start;
    }

    .notifikace_cell {
        flex: 1 1 auto;
    }

    .notifikace_date-cell {
        flex: 0 0 150px;
        /* Nastavení pevné šířky na velkých obrazovkách */
        max-width: 180px;
    }

    .notifikace_actions {
        flex-direction: row;
        width: auto;
        justify-content: flex-end;
    }

    .notifikace_btn {
        width: auto;
    }
}

@media (max-width: 768px) {
    .notifikace_sidebar {
        display: none;
    }

    .notifikace_main-content {
        margin-left: 0;
        padding: 0;
    }

    .notifikace_pageNotificationBody {
        padding: 10px;
    }

    .notifikace_item {
        gap: 0px;
    }

    .notifikace_row-top,
    .notifikace_row-bottom {
        flex-direction: column;
        gap: 10px;
    }

    .notifikace_cell {
        width: 100%;
    }

    .notifikace_date-cell {
        max-width: none;
        /* Zruší omezení šířky na mobilu */
    }
}

.notifikace_radio-options-item {
    width: 120px;
    float: left;
}

.notifikace_radio-options-item-text {
    float: left;
}

.notifikace_radio-options-item-radio {
    float: left;
}

.notifikace_checkbox-options-item {
    width: 120px;
    float: left;
}

.notifikace_checkbox-options-item-text {
    float: left;
}

.notifikace_checkbox-options-item-checkbox {
    float: left;
}

.notifikace_tab-button {
    padding: 10px 20px;
    border: 1px solid rgba(2, 8, 23, 0.06);
    border-radius: 4px;
    background-color: transparent;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.3s;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 8px;
    margin-top: 5px;
}

@media (max-width: 660px) {
    .notifikace_tab-button {
        width: 100% !important;
    }
}

.notifikace_tab-button.notifikace_active-tab {
    color: #fff;
    background-color: #3498db;
}

.notifikace_tab-content {
    display: none;
    padding-left: 15px;
}

.notifikace_tab-content.notifikace_active-content {
    display: block;
}

.notifikace_tabInstalladmin-button {
    padding: 10px 20px;
    border: none;
    background-color: transparent;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.3s;
}

.notifikace_tabInstalladmin-button.notifikace_active-tab {
    color: var(--notifikace_primary-color);
    border-bottom: 2px solid var(--notifikace_primary-color);
}

.notifikace_tabInstalladmin-content {
    display: none;
}

.notifikace_tabInstalladmin-content.notifikace_active-content {
    display: block;
}

.notifikace_history-table th,
.notifikace_history-table td {
    text-align: left;
    padding: 5px;
    font-weight: 400;
    border-bottom: 1px solid var(--notifikace_border-color);
    display: table-cell;
}

.notifikace_page-tabs {
    /*border-bottom: 2px solid #ccc;*/
    margin-bottom: 10px;
    margin-left: 15px;
}

@media (max-width: 656px) {

    .notifikace_history-table,
    .notifikace_history-table thead,
    .notifikace_history-table tbody,
    .notifikace_history-table th,
    .notifikace_history-table td,
    .notifikace_history-table tr {
        display: block;
    }

    .notifikace_history-table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .notifikace_history-table tr {
        border: 1px solid var(--notifikace_border-color);
        margin-bottom: 15px;
        border-radius: 8px;
    }

    .notifikace_history-table td {
        border: none;
        position: relative;
        padding-left: 50%;
        text-align: right;
        border-bottom: 1px solid var(--notifikace_light-gray);
        white-space: normal;
        word-wrap: break-word;
    }

    .notifikace_history-table td:before {
        content: attr(data-label);
        position: absolute;
        left: 10px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: 500;
        color: #666;
    }
}


.notifikaceItemInfoDelete {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--notifikace_border-color);
    border-radius: 8px;
    padding: 15px;
    background-color: #f44336;
    color: #ffff;
}

.notifikaceItemInfoSend {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--notifikace_border-color);
    border-radius: 8px;
    padding: 15px;
    background-color: var(--notifikace_primary-color);
    color: #ffff;
    position: relative;
    transition: opacity 0.5s ease-in-out;
}

.close-button {
    position: absolute;
    top: 5px;
    right: 5px;
    background-color: transparent;
    border: none;
    font-size: 1.2rem;
    cursor: pointer;
    color: #fff;
}

.fade-out {
    opacity: 0;
    transition: opacity 0.5s ease-out;
}

#btn-confirm-delete {
    background-color: #d9534f;
    color: #fff;
}

.notifikace_row-top-errorname {
    display: none;
    background-color: #f44336;
    color: var(--notifikace_white);
    padding-left: 5px;
    padding-bottom: 5px;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

.notifikace_row-top-errortext {
    display: none;
    background-color: #f44336;
    color: var(--notifikace_white);
    padding-left: 5px;
    padding-bottom: 5px;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

.notifikace_allow_error {
    text-align: right;
}


.pageBlogAdminPageListItem {
    background: #eef3ff;
    padding: 10px;
    margin-bottom: 20px;
    margin-left: 20px;
    margin-right: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 20px;
}

@media (max-width: 768px) {
    .pageBlogAdminPageListItem {
        flex-direction: column;
        text-align: center;
    }
}

.pageBlogAdminPageListItemPostImg {
    width: 200px;
    height: 150px;
    object-fit: cover;
    border-radius: 5px;
}

@media (max-width: 768px) {
    .pageBlogAdminPageListItemPostImg {
        width: 100%;
        height: auto;
        margin-bottom: 15px;
    }
}

.pageBlogAdminPageListItemPost {
    flex: 1;
}

.pageBlogAdminPageListItemPostMeta {
    font-size: 0.9em;
    color: #666;
    margin-bottom: 10px;
}

.pageBlogAdminPageListItemPostReadMore {
    display: inline-block;
    margin-top: 10px;
    color: #0779e4;
    text-decoration: none;
    font-weight: bold;
}


.pageBlogAdminPagePostContainer {
    max-width: 960px;
    margin: 20px auto;
    padding: 30px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    /* Větší mezery mezi sekcemi */
}

.pageBlogPagePostContainer {
    max-width: 960px;
    margin: 20px auto;
    padding: 30px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    /* Větší mezery mezi sekcemi */
}

/* Hlavička příspěvku */
.pageBlogAdminPagePostHeader {
    padding-bottom: 10px;
    margin-bottom: 0px;
    font-size: 22px;
    text-align: center;
    margin-top: 0px;
}

.pageBlogAdminPagePostHeader h1 {
    margin-bottom: 10px;
    color: #555;
}

/* Hlavička příspěvku */
.pageBlogPagePostHeader {
    padding-bottom: 10px;
    margin-bottom: 0px;
    font-size: 22px;
    text-align: center;
    margin-top: 0px;
}

.pageBlogPagePostHeader h1 {
    margin-bottom: 10px;
    color: #555;
}

.pageBlogAdminPagePostMeta {
    font-size: 0.9em;
    color: #777;
}

/* Sekce nahrávání souborů */
.pageBlogAdminPageFileUploadSection {
    display: flex;
    flex-wrap: wrap;
    /* Umožní přechod na další řádek na menších obrazovkách */
    gap: 15px;
    padding: 15px;
    background-color: #f9f9f9;
    border: 1px dashed #ccc;
    border-radius: 5px;
}

.pageBlogAdminPageFileUploadItem {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    /* Umožní prvkům zabrat dostupný prostor */
    min-width: 200px;
    /* Minimální šířka pro dobrou čitelnost */
}

.pageBlogAdminPageFileUploadItem label {
    font-weight: bold;
    color: #555;
}

.pageBlogAdminPageFileUploadItem input[type="file"] {
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    background-color: #fff;
    flex-grow: 1;
    /* Aby vstup zabral zbývající místo */
}

/* Sekce textového editoru */
.pageBlogAdminPageEditorSection h2 {
    margin-bottom: 15px;
    color: #555;
}

.pageBlogPageEditorSection h2 {
    margin-bottom: 15px;
    color: #555;
}

#pageBlogAdminPageArticleEditor {
    width: 100%;
    min-height: 400px;
    /* Minimální výška pro editor */
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 1.1em;
    box-sizing: border-box;
    /* Zahrnuje padding a border do celkové šířky/výšky */
    resize: vertical;
    /* Umožní vertikální změnu velikosti */
    font-family: 'Arial', sans-serif;
    /* Zachování fontu */
}

/* Patička a tlačítko */
.pageBlogAdminPagePostFooter {
    text-align: center;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

.pageBlogAdminPagePublishButton {
    background-color: var(--notifikace_primary-color);
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    font-size: 1.1em;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.pageBlogAdminPagePublishButton:hover {
    background-color: #45a049;
}

/* Responzivita */
@media (max-width: 768px) {
    .pageBlogAdminPagePostContainer {
        margin: 10px;
        padding: 10px;
    }

    .pageBlogPagePostContainer {
        margin: 0px;
        padding: 0px;
    }

    .pageBlogAdminPagePostHeader h1 {
        font-size: 2em;
    }

    .pageBlogAdminPageFileUploadSection {
        flex-direction: column;
        /* Skládá prvky pod sebe na menších obrazovkách */
        align-items: stretch;
    }

    .pageBlogAdminPageFileUploadItem {
        min-width: auto;
        /* Odebere minimální šířku */
        width: 100%;
    }

    .pageBlogAdminPageFileUploadItem input[type="file"] {
        width: 100%;
    }

    #pageBlogAdminPageArticleEditor {
        min-height: 300px;
        /* Snížení minimální výšky na menších obrazovkách */
    }
}

@media (max-width: 480px) {
    .pageBlogPagePostContainer {
        padding: 15px;
    }

    .pageBlogAdminPagePostHeader h1 {
        font-size: 1.8em;
    }

    .pageBlogAdminPagePublishButton {
        width: 100%;
        padding: 10px;
    }
}

.pageBlogAdminPageFileUploadItemPreview {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    position: relative;
}

.pageBlogAdminPageFileUploadItemPreview img {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    max-height: 250px;
}

.pageBlogAdminPageFileUploadItemPreviewDeleteImg {
    position: absolute;
    top: 5px;
    /* Trochu odsazené shora */
    right: 5px;
    /* Trochu odsazené zprava */
    background-color: #e74c3c;
    /* Sytější červená */
    color: #ffffff;
    /* Bílá */
    font-size: 20px;
    /* Větší písmo */
    font-weight: bold;
    /* Tučné písmo */
    width: 35px;
    /* Pevná šířka */
    height: 35px;
    /* Pevná výška */
    display: flex;
    /* Pro centrování obsahu */
    justify-content: center;
    /* Centrování na osu X */
    align-items: center;
    /* Centrování na osu Y */
    border-radius: 50%;
    /* Kulatý tvar */
    cursor: pointer;
    /* Ukazatel myši */
    transition: background-color 0.3s ease;
    /* Plynulá animace */
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    /* Jemný stín */
}

.pageBlogAdminPageFileUploadItemPreviewDeleteImg svg {
    color: #ffffff;
    /* Bílá */
}

.pageBlogAdminPageFileUploadItemPreviewDeleteImg:hover {
    background-color: #c0392b;
    /* Tmavší červená při najetí myší */
}

.pageBlogPageFileUploadItemPreview {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    position: relative;
}

.pageBlogPageFileUploadItemPreview img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: 100%;
}

.pageBlogPageFileUploadItemPreviewDeleteImg {
    position: absolute;
    top: 5px;
    /* Trochu odsazené shora */
    right: 5px;
    /* Trochu odsazené zprava */
    background-color: #e74c3c;
    /* Sytější červená */
    color: #ffffff;
    /* Bílá */
    font-size: 20px;
    /* Větší písmo */
    font-weight: bold;
    /* Tučné písmo */
    width: 35px;
    /* Pevná šířka */
    height: 35px;
    /* Pevná výška */
    display: flex;
    /* Pro centrování obsahu */
    justify-content: center;
    /* Centrování na osu X */
    align-items: center;
    /* Centrování na osu Y */
    border-radius: 50%;
    /* Kulatý tvar */
    cursor: pointer;
    /* Ukazatel myši */
    transition: background-color 0.3s ease;
    /* Plynulá animace */
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    /* Jemný stín */
}

.pageBlogPageFileUploadItemPreviewDeleteImg svg {
    color: #ffffff;
    /* Bílá */
}

.pageBlogPageFileUploadItemPreviewDeleteImg:hover {
    background-color: #c0392b;
    /* Tmavší červená při najetí myší */
}

.articleAudioBody {
    width: 50%;
    margin-top: 0px;
    float: left;
}

.articleAudioText {
    float: left;
    padding-top: 5px;
    color: #6c757d;
    width: 50%;
    overflow: hidden;
}

.articleAudioButton {
    float: left;
    margin-left: 15px;
    margin-top: -3px;
    cursor: pointer;
    font-size: 28px;
}

.articleAudioButtonDelete {
    float: left;
    margin-left: 15px;
    cursor: pointer;
    background-color: #e74c3c;
    /* Sytější červená */
    color: #ffffff;
    /* Bílá */
    font-size: 20px;
    /* Větší písmo */
    font-weight: bold;
    /* Tučné písmo */
    width: 35px;
    /* Pevná šířka */
    height: 35px;
    /* Pevná výška */
    display: flex;
    /* Pro centrování obsahu */
    justify-content: center;
    /* Centrování na osu X */
    align-items: center;
    /* Centrování na osu Y */
    border-radius: 50%;
    /* Kulatý tvar */
    transition: background-color 0.3s ease;
    /* Plynulá animace */
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    /* Jemný stín */
}

.articleAudioButtonDelete svg {
    color: #ffffff;
    /* Bílá */
}

.articleAudioButtonDelete:hover {
    background-color: #c0392b;
    /* Tmavší červená při najetí myší */
}

.pageBlogAdminPageListItemPostBtnCreateNewBody {
    margin-top: 15px;
    margin-bottom: 15px;
}

.pageBlogAdminPageListItemPostBtnCreateNewBody a {
    text-decoration: none;
    width: 100%;
}

.pageBlogAdminPageListItemPostBtnCreateNew {
    background-color: var(--notifikace_primary-color);
    color: var(--notifikace_white);
    margin-top: 20px;
    padding: 12px 20px;
    font-size: 16px;
    display: block;
    width: fit-content;
    margin: 20px auto 0 auto;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s;
}

.pageBlogAdminPageDeleteButton {
    background-color: #f44336;
    color: var(--notifikace_white);
    margin-top: 20px;
    padding: 12px 20px;
    font-size: 16px;
    display: block;
    width: fit-content;
    margin: 20px auto 0 auto;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s;
}

.pageBlogAdminPageDeleteButton a {
    text-decoration: none;
    color: var(--notifikace_white);
}

.pageBlogAdminPageInfoOk {
    background-color: var(--notifikace_primary-color);
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    font-size: 1.1em;
    cursor: pointer;
    transition: background-color 0.3s ease;
    text-align: center;
}

.pageBlogAdminPageInfoDeleteOk {
    background-color: var(--notifikace_primary-color);
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    font-size: 1.1em;
    cursor: pointer;
    transition: background-color 0.3s ease;
    text-align: center;
}

.pageBlogAdminPageInfoError {
    background-color: #f44336;
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    font-size: 1.1em;
    cursor: pointer;
    transition: background-color 0.3s ease;
    text-align: center;
}

.pageBlogPageList {
    padding-left: 20px;
    padding-right: 20px;
}

.pageBlogPageListItem {
    background-color: #eef3ff;
    padding: 10px;
    margin-bottom: 20px;
    border-radius: 5px;
    box-shadow: 2px 1px 0px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 20px;
}

@media (max-width: 768px) {
    .pageBlogPageListItem {
        flex-direction: column;
        text-align: center;
    }
}

.pageBlogPageListItemPostImg {
    width: 200px;
    height: 150px;
    object-fit: cover;
    border-radius: 5px;
}

@media (max-width: 768px) {
    .pageBlogPageListItemPostImg {
        width: 100%;
        height: auto;
        margin-bottom: 15px;
    }
}

.pageBlogPageListItemPost {
    flex: 1;
}

.pageBlogPageListItemPost a {
    color: #0779e4;
    text-decoration: none;
}

.pageBlogPageListItemPostMeta {
    font-size: 0.9em;
    color: #666;
    margin-bottom: 10px;
}

.pageBlogPageListItemPostReadMore {
    display: inline-block;
    margin-top: 10px;
    color: #0779e4;
    text-decoration: none;
    font-weight: bold;
}

.pageBlogPageCreated {
    width: 50%;
    margin-top: 0px;
    float: right;
    text-align: right;
    color: #6c757d;
    min-width: 210px;
}

@media (max-width: 315px) {
    .pageBlogPageMeta {
        max-width: 210px !important;
    }
}

/* Pro menší obrazovky (mobil a tablet) */
@media (max-width: 768px) {
    .pageBlogPageMeta {
        flex-direction: column;
        /* Změní uspořádání prvků na sloupec */
        align-items: flex-start;
        /* Zarovná prvky doleva */
    }

    .articleAudioBody {
        width: 100% !important;
    }

    .pageBlogPageCreated {
        float: right;
        text-align: center;
    }

    .articleAudioText {
        /*margin-bottom: 10px;*/
        /* Přidá mezeru pod audiopřehrávačem, aby se nelepil na datum */
        width: 100% !important;
    }

    .player-controls {
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}

#BannerMenuDownType {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.pageBlogPageMeta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
    font-size: 14px;
    color: #666666;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 15px;
}

.pageBodyStatsAdminGraph {
    margin: 20px 5px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: start;
}

.pageBodyStatsAdminGraph > * {
    min-width: 0;
}

.pageBodyStatsAdminGraph .pageDashboardPageBodyStats {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

/* Float-era .clear bere zbytečně buňku v CSS gridu */
.pageBodyStatsAdminGraph > .clear {
    display: none;
}

/*
 * Grafy: Chart.js (maintainAspectRatio: false) + flex-grow:1 + height:100% na rodičích
 * způsobovalo „rozjíždění“ výšky po načtení. Oblast kreslení má pevnou výšku.
 */
.pageDashboardPageBodyStatsBody {
    height: auto !important;
    min-height: 0;
}

.pageDashboardPageBodyStatsBody .pageBodyStatsAdminGraphItemDashboard,
.pageDashboardPageBodyStatsBody .pageBodyStatsAdminGraphInsideBody {
    height: auto !important;
    min-height: 0;
}

.pageBodyStatsAdminGraph .pageBodyStatsAdminGraphInside {
    height: auto !important;
    min-height: 0;
}

.pageBodyStatsAdminGraph .pageBodyStatsAdminGraphItemDashboard,
.pageBodyStatsAdminGraph .pageBodyStatsAdminGraphInsideBody {
    height: auto !important;
    min-height: 0;
}

.pageDashboardPageBodyStatsBody .chart-container,
.pageBodyStatsAdminGraph .chart-container,
.pageBodyStatsAdminGraphItemDashboard > div[style*="min-height: 250px"] {
    flex-grow: 0 !important;
    flex-shrink: 0;
    height: 340px !important;
    min-height: 280px !important;
    max-height: 480px;
    box-sizing: border-box;
}

.pageDashboardPageBodyStatsBody .pageBodyStatsAdminGraphInsideBody > div:not(.pageBodyStatsAdminGraphItemSelect),
.pageBodyStatsAdminGraph .pageBodyStatsAdminGraphInsideBody > div:not(.pageBodyStatsAdminGraphItemSelect) {
    flex-grow: 0 !important;
    flex-shrink: 0;
    height: 340px !important;
    min-height: 280px !important;
    max-height: 480px;
    box-sizing: border-box;
}

/*
.pageDashboardPageBodyStatsAdmin{

}
.pageDashboardPageBodyStatsAdminGraph{

}
.pageDashboardPageBodyStatsAdminGraphItem{
    margin: 30px auto 24px;
    padding: 0px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: start;
}
*/
/* General container styles for better spacing on all devices */
.pageBodyStatsAdminGraphItem {
    background-color: #ffffff;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    padding: 0px;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    min-width: 0;
    margin-left: 0;
    margin-right: 0;
    border-radius: 8px;
}

/* Adjustments for the main text and icon container */
.pageBodyStatsAdminGraphItemText {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    text-align: left;
    margin: 0;
    /* Use flexbox for better alignment of text and icons */
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;

    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
    color: #fff;
    background-color: #3498db;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

/* Specific icon adjustments */
.collapse-toggle-stats-admin-graph-icon-down,
.collapse-toggle-stats-admin-graph-icon-up {
    margin-left: 10px;
    font-size: 1.2em;
    /* Increase icon size for better visibility */
    margin-right: 10px;
}

/* Show the down icon by default, hide the up icon */
.collapse-toggle-stats-admin-graph-icon-down {
    display: inline-block;
}

.collapse-toggle-stats-admin-graph-icon-up {
    display: none;
}

/* Table container to handle overflow on small screens */
.table-container {
    overflow-x: auto;
    /* This is the key for responsive tables */
    -webkit-overflow-scrolling: touch;
    /* Improves scrolling on iOS */
}

/* Table styles for better legibility */
#notificationStatsTable {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

#notificationStatsTable th,
#notificationStatsTable td {
    border: 1px solid #e5e7eb;
    padding: 12px 15px;
    /* Increase padding for better touch targets */
    text-align: left;
    white-space: nowrap;
    /* Prevent content from wrapping */
}

#notificationStatsTable thead th {
    background-color: #f2f2f2;
    font-weight: 600;
    color: #333;
    font-size: 13px;
}

.pageBodyStatsAdminGraphItemSelect select {
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    margin-bottom: 10px;
}

.collapse-toggle-stats-admin-graph-text {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    text-align: left;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

/*
    Media Queries for Responsiveness
    This section tailors the design to different screen sizes.
*/

/* Styles for devices with a max width of 768px (e.g., tablets and smaller) */
@media (max-width: 768px) {
    .pageBodyStatsAdminGraphItem {
        padding: 0px;
    }

    .pageBodyStatsAdminGraphItemText {
        font-size: 16px;
        /*flex-direction: column;*/
        text-align: center;
    }

    .collapse-toggle-stats-admin-graph-text {
        width: 100%;
        margin-bottom: 8px;
    }

    .collapse-toggle-stats-admin-graph-icon-down,
    .collapse-toggle-stats-admin-graph-icon-up {
        font-size: 1.1em;
        margin-left: 0;
    }
}

/* Styles for mobile devices (max width of 500px) */
@media (max-width: 500px) {
    .pageBodyStatsAdminGraphItem {
        padding: 0px;
    }

    .pageBodyStatsAdminGraphItemText {
        font-size: 14px;
    }

    #notificationStatsTable th,
    #notificationStatsTable td {
        padding: 8px;
        /* Reduce padding for smaller screens */
        font-size: 12px;
    }
}

.pageBodyStatsAdminGraphInside {
    display: none;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 30px;
    width: 100%;
    box-sizing: border-box;
    min-width: 0;
}

.pageBodyStatsAdminGraphInsideBody {
    display: flex;
    flex-direction: column;
    padding-top: 10px;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 20px;
    min-width: 0;
    gap: 12px;
}

/* General container styles for better spacing on all devices */
.pageBodyOverviewAdminGraphItem {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 24px;
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    /* Use a max-width for better control on very large screens */
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Adjustments for the main text and icon container */
.pageBodyOverviewAdminGraphItemText {
    font-size: 18px;
    font-weight: 600;
    color: #555;
    text-align: left;
    margin: 0;
    /* Use flexbox for better alignment of text and icons */
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

/* Specific icon adjustments */
.collapse-toggle-overview-admin-graph-icon-down,
.collapse-toggle-overview-admin-graph-icon-up {
    margin-left: 10px;
    font-size: 1.2em;
    /* Increase icon size for better visibility */
}

/* Show the down icon by default, hide the up icon */
.collapse-toggle-overview-admin-graph-icon-down {
    display: inline-block;
}

.collapse-toggle-overview-admin-graph-icon-up {
    display: none;
}

/* Table container to handle overflow on small screens */
.table-container {
    overflow-x: auto;
    /* This is the key for responsive tables */
    -webkit-overflow-scrolling: touch;
    /* Improves scrolling on iOS */
}

/* Table styles for better legibility */
#cohortRetentionTable {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

#cohortRetentionTable th,
#cohortRetentionTable td {
    border: 1px solid #e5e7eb;
    padding: 12px 15px;
    /* Increase padding for better touch targets */
    text-align: left;
    white-space: nowrap;
    /* Prevent content from wrapping */
}

#cohortRetentionTable thead th {
    background-color: #f2f2f2;
    font-weight: 600;
    color: #333;
    font-size: 13px;
}

.pageBodyOverviewAdminGraphItemSelect select {
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    margin-bottom: 10px;
}

.collapse-toggle-overview-admin-graph-text {
    font-size: 15px;
}

/*
    Media Queries for Responsiveness
*/

/* Styles for devices with a max width of 768px (e.g., tablets and smaller) */
@media (max-width: 768px) {
    .pageBodyOverviewAdminGraphItem {
        padding: 16px;
    }

    .pageBodyOverviewAdminGraphItemText {
        font-size: 16px;
        flex-direction: column;
        text-align: center;
    }

    .collapse-toggle-overview-admin-graph-text {
        width: 100%;
        margin-bottom: 8px;
    }

    .collapse-toggle-overview-admin-graph-icon-down,
    .collapse-toggle-overview-admin-graph-icon-up {
        font-size: 1.1em;
        margin-left: 0;
    }
}

/* Styles for mobile devices (max width of 500px) */
@media (max-width: 500px) {
    .pageBodyOverviewAdminGraphItem {
        padding: 12px;
    }

    .pageBodyOverviewAdminGraphItemText {
        font-size: 14px;
    }

    #cohortRetentionTable th,
    #cohortRetentionTable td {
        padding: 8px;
        /* Reduce padding for smaller screens */
        font-size: 12px;
    }
}

.pageBodyOverviewAdminGraphInside {
    display: none;
}


.settingsusers-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0px 0px 10px 0px;
    background-color: #fff;
}

.settingsusers-table thead {
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.settingsusers-table th,
.settingsusers-table td {
    padding: 12px 15px;
    text-align: left;
    /*border-bottom: 1px solid #ddd;*/
    font-size: 14px;
    border-bottom: none;
}

.settingsusers-table th {
    background-color: #3498db;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* Nastaví zaoblení levého horního rohu pro PRVNÍ buňku v hlavičce */
.settingsusers-table th:first-child {
    border-top-left-radius: 4px;
}

/* Nastaví zaoblení pravého horního rohu pro POSLEDNÍ buňku v hlavičce */
.settingsusers-table th:last-child {
    border-top-right-radius: 4px;
}

.settingsusers-table tr:hover {
    background-color: #f1f1f1;
}

.settingsusers-button {
    padding: 8px 12px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s;
}

.settingsusers-delete-btn {
    background-color: #dc3545;
    color: white;
}

.settingsusers-delete-btn:hover {
    background-color: #c82333;
}

.settingsusers-invite-btn {
    background-color: #28a745;
    color: white;
}

.settingsusers-invite-btn:hover {
    background-color: #218838;
}

.settingsusers-status {
    padding: 5px 10px;
    border-radius: 20px;
    font-weight: bold;
    color: white;
}

.settingsusers-status.active {
    background-color: #28a745;
}

.settingsusers-status.pending {
    background-color: #ffc107;
}

.settingsusers-status.inactive {
    background-color: #6c757d;
}

.settingsusers-email-input {
    width: 150px;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.error-text {
    color: #dc3545;
    font-size: 12px;
    margin-top: 5px;
}

/* Responsive styles for small screens */
@media (max-width: 768px) {

    .settingsusers-table,
    .settingsusers-table thead,
    .settingsusers-table tbody,
    .settingsusers-table th,
    .settingsusers-table td,
    .settingsusers-table tr {
        display: block;
    }

    .settingsusers-table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .settingsusers-table tr {
        border: 1px solid #ccc;
        margin-bottom: 10px;
        border-radius: 8px;
    }

    .settingsusers-table td {
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        text-align: right;
        white-space: normal;
        overflow: hidden;
    }

    .settingsusers-table td:before {
        position: absolute;
        top: 12px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
        color: #3498db;
        content: attr(data-label);
    }

    /* Set content for each cell on small screens */
    .settingsusers-table tr td:nth-of-type(1):before {
        content: "Uživatel";
    }

    .settingsusers-table tr td:nth-of-type(2):before {
        content: "E-mail";
    }

    .settingsusers-table tr td:nth-of-type(3):before {
        content: "Status";
    }

    .settingsusers-table tr td:nth-of-type(4):before {
        content: "Akce";
    }

    /* Remove padding for inputs and button rows */
    .settingsusers-table tr:last-child td {
        padding-left: 12px;
        text-align: left;
    }

    .settingsusers-table tr:last-child td:before {
        content: none;
    }
}

.orderslistadmin-table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.orderslistadmin-table th,
.orderslistadmin-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}

.orderslistadmin-table th {
    background-color: #3498db;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.orderslistadmin-table tr:hover {
    background-color: #f1f1f1;
}

/* Responsive styles for small screens */
@media (max-width: 768px) {

    .orderslistadmin-table,
    .orderslistadmin-table thead,
    .orderslistadmin-table tbody,
    .orderslistadmin-table th,
    .orderslistadmin-table td,
    .orderslistadmin-table tr {
        display: block;
    }

    .orderslistadmin-table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .orderslistadmin-table tr {
        border: 1px solid #ccc;
        margin-bottom: 10px;
        border-radius: 8px;
    }

    .orderslistadmin-table td {
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        text-align: right;
        white-space: normal;
        overflow: hidden;
    }

    .orderslistadmin-table td:before {
        position: absolute;
        top: 12px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
        color: #3498db;
        content: attr(data-label);
    }

    /* Set content for each cell on small screens */
    .orderslistadmin-table tr td:nth-of-type(1):before {
        content: "Id";
    }

    .orderslistadmin-table tr td:nth-of-type(2):before {
        content: "Firma";
    }

    .orderslistadmin-table tr td:nth-of-type(3):before {
        content: "Datum";
    }

    .orderslistadmin-table tr td:nth-of-type(4):before {
        content: "Tarif";
    }

    .orderslistadmin-table tr td:nth-of-type(5):before {
        content: "Interval";
    }

}

.firmsList-table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.firmsList-table th,
.firmsList-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}

.firmsList-table th {
    background-color: #3498db;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.firmsList-table tr:hover {
    background-color: #f1f1f1;
}

/* Responsive styles for small screens */
@media (max-width: 768px) {

    .firmsList-table,
    .firmsList-table thead,
    .firmsList-table tbody,
    .firmsList-table th,
    .firmsList-table td,
    .firmsList-table tr {
        display: block;
    }

    .firmsList-table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .firmsList-table tr {
        border: 1px solid #ccc;
        margin-bottom: 10px;
        border-radius: 8px;
    }

    .firmsList-table td {
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        text-align: right;
        white-space: normal;
        overflow: hidden;
    }

    .firmsList-table td:before {
        position: absolute;
        top: 12px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
        color: #3498db;
        content: attr(data-label);
    }

    /* Set content for each cell on small screens */
    .firmsList-table tr td:nth-of-type(1):before {
        content: "Firma";
    }

    .firmsList-table tr td:nth-of-type(2):before {
        content: "Název";
    }

    .firmsList-table tr td:nth-of-type(3):before {
        content: "IČO";
    }

    .firmsList-table tr td:nth-of-type(4):before {
        content: "Tarif";
    }

}

.pageSettingsPageBodyUserCheckboxBody {
    margin-top: 10px;
}

.pageSettingsPageBodyUserCheckbox {
    float: right;
}

.pageSettingsPageBodyUserCheckboxText {
    float: left;
    margin-left: 10px;
}

.pageSettingsPageBodyUserNameSelect {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.settingsusers-role-select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

#btn-confirm-user-delete {
    background-color: #d9534f;
    color: #fff;
    margin-left: 10px;
}

.left_menu_admin_nastaveni {
    margin-top: 20px;
}

.left_menu_admin_blog {
    margin-top: 20px;
    background-color: #4e5563;
}

.left_menu_admin_academy {
    background-color: #4e5563;
}

.left_menu_admin_overview {
    background-color: #4e5563;
}

.left_menu_admin_firms {
    background-color: #4e5563;
}

.left_menu_admin_orders {
    background-color: #4e5563;
}

.left_menu_admin_install {
    margin-top: 20px;
}

#li-logout-button-menu {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    margin-top: 10px;
}

#logout-button-menu {
    margin-top: 10px;
    background-color: #4e5563;
    box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.3);
}


.emojiBtn {
    border-radius: 5px;
    width: 35px;
    height: 35px;
    cursor: pointer;
}

.emojiPickerBubble {
    height: 83px;
    max-width: 340px;
    width: 205px;
    /* overflow: hidden; */
    position: absolute;
    overflow-y: auto;
    background-color: #fff;
    z-index: 9999;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 9px;
    display: none;
    margin-top: 83px;
}

.emoji {
    font-size: 20px;
    cursor: pointer;
    text-align: center;
    line-height: 30px;
    width: 30px;
    height: 30px;
    display: inline-block;
    border-radius: 5px;
}

.pageDashboardPageBodyStatsBodyInside {
    padding: 5px;
}

.pageDashboardPageBodyStats {
    --pad: 22px;
    /*height: 330px;*/
    margin-top: 0px;
    margin-bottom: 0px;
    /*border: 1px solid #3498db;*/
    border-radius: 5px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 10px;
    width: 100%;
    min-width: 0;
}

.pageDashboardPageBodyStatsBodyRow {
    padding-top: 0px;
    padding-right: 5px;
    padding-left: 5px;
}

.pageDashboardPageBodyStatsBodyRowText {
    float: left;
}

.pageDashboardPageBodyStatsBodyRowBold {
    float: right;
}

.pageDashboardPageBodyStatsHeadTitle {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    height: 48px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.pageDashboardPageBodyStatsHeadTextBig {
    float: left;
    font-size: 20px;
}

.pageDashboardPageBodyStatsHeadBoldBig {
    float: right;
    font-weight: 600;
    font-size: 20px;
}

.pageDashboardPageBodyStatsHeadText {
    float: left;
}

.pageDashboardPageBodyStatsHeadBold {
    float: right;
    font-weight: 600;
}

.pageDashboardPageBodyStatsHead {
    /*margin-top: 5px;*/
}

.pageBodyStatsAdminGraphItemDashboard {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
}



.site-footer {
    font-size: 14px;
    color: #1a1a2e !important;
}

.footer-main {
    background: linear-gradient(180deg, #f5f9ff 0%, #eef4fb 100%);
    padding: 10px 0 10px;
    border-top: 1px solid rgba(7, 121, 228, 0.08);
}

.footer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) minmax(0, 1.25fr) minmax(0, 1.15fr);
    gap: 40px 36px;
    max-width: 1180px;
    align-items: start;
}

.footer-col {
    min-width: 0;
}

.footer-col-brand .footer-brand {
    display: inline-block;
    margin-bottom: 22px;
    text-decoration: none;
}

.footer-brand-logo {
    max-width: 132px;
    height: auto;
    display: block;
}

.footer-heading {
    font-size: 15px;
    font-weight: 700;
    color: #1a1a2e !important;
    margin: 0 0 20px;
    letter-spacing: 0.02em;
    line-height: 1.3;
    min-height: 20px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 12px;
}

.footer-links li:last-child {
    margin-bottom: 0;
}

.footer-links a {
    color: #4a4a68 !important;
    text-decoration: none;
    transition: color 0.2s ease;
    line-height: 1.55;
    font-size: 14px;
}

.footer-links a:hover {
    color: #0779e4 !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.footer-care-text {
    color: #4a4a68 !important;
    line-height: 1.75;
    margin: 0;
    font-size: 14px;
    max-width: 34ch;
}

.footer-care-text a {
    color: #4a4a68 !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(7, 121, 228, 0.35);
}

.footer-care-text a:hover {
    color: #0779e4 !important;
    text-decoration-color: #0779e4;
}

.footer-contact-panel {
    background: #ffffff;
    border: 1px solid rgba(7, 121, 228, 0.1);
    border-radius: 14px;
    padding: 20px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.footer-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: #0779e4;
    color: #ffffff !important;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    padding: 13px 18px;
    border-radius: 10px;
    margin-bottom: 20px;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: 0 4px 14px rgba(7, 121, 228, 0.28);
}

.footer-cta-btn:hover {
    background-color: #0568c7;
    color: #ffffff !important;
    box-shadow: 0 6px 18px rgba(7, 121, 228, 0.34);
    transform: translateY(-1px);
}

.footer-contact-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 16px;
    padding-top: 16px;
    border-top: 1px solid #edf2f7;
}

.footer-contact-item--last {
    margin-bottom: 0;
}

.footer-contact-icon {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    background-color: #f5f9ff;
    border: 1px solid rgba(7, 121, 228, 0.12);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0779e4;
    font-size: 17px;
}

.footer-contact-icon--phone {
    position: relative;
}

.footer-contact-icon--phone::after {
    content: '';
    position: absolute;
    top: 7px;
    right: 7px;
    width: 7px;
    height: 7px;
    background-color: #f5a623;
    border-radius: 50%;
    border: 2px solid #f5f9ff;
}

.footer-contact-value {
    display: block;
    color: #1a1a2e !important;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    margin-bottom: 4px;
    line-height: 1.35;
}

.footer-contact-value:hover {
    color: #0779e4 !important;
}

.footer-contact-note {
    margin: 0;
    font-size: 12px;
    color: #6b8cae !important;
    line-height: 1.45;
}

.footer-bottom {
    background-color: #e6eef5;
    color: #0779e4 !important;
    padding: 16px 0;
}

.footer-inner {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 13px;
    max-width: 1180px;
}

@media (max-width: 1024px) {
    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 36px 32px;
    }

    .footer-care-text {
        max-width: none;
    }
}

@media (max-width: 600px) {
    .footer-main {
        padding: 10px 0 10px;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .footer-contact-panel {
        padding: 18px 16px;
    }

    .footer-inner {
        text-align: center;
        justify-content: center;
    }
}

.aboutpage_section {
    padding: 30px 20px;
    /* Přidán padding i na boky pro mobil */
    text-align: center;
}

.aboutpage_section.aboutpage_mission {
    background-color: #f7f9fc;
}

/* Styly pro sekci Tým */
.aboutpage_team-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* 3 sloupce na desktopu */
    gap: 40px;
    margin-top: 40px;
}

.aboutpage_team-member {
    text-align: center;
}

.aboutpage_team-member img {
    width: 100%;
    max-width: 200px;
    /* Zmenšeno pro lepší vzhled */
    height: 200px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 15px;
    border: 5px solid var(--riselify-blue);
}

.aboutpage_member-quote {
    font-style: italic;
    font-size: 0.95em;
    color: var(--text-dark);
    background-color: #fff;
    /* Změněno na bílé pozadí citace pro kontrast */
    padding: 10px;
    border-radius: 8px;
    margin-top: 10px;
    min-height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: left;
    /* Text uvnitř citace zarovnán doleva pro lepší čitelnost */
}

/* Styly pro sekci Hodnoty */
.aboutpage_values-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /* 2 sloupce na desktopu */
    gap: 30px;
    text-align: left;
    margin-top: 40px;
}

.aboutpage_value-item {
    padding: 30px;
    background-color: #5665fe;
    color: #fff;
    border-radius: 10px;
}

.aboutpage_value-item p {
    margin: 0;
    max-width: none;
    color: var(--text-dark);
    font-size: 1em;
    text-align: left;
    /* Zarovnání doleva uvnitř boxu */
}

.aboutpage_value-item strong {
    display: block;
    font-size: 1.2em;
    color: var(--riselify-blue);
    margin-bottom: 10px;
    font-weight: 700;
}

/* Sekce Vizuály */
.aboutpage_visual-placeholder {
    min-height: 400px;
    background-color: #ccc;
    margin-bottom: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5em;
    color: white;
    font-weight: bold;
}

/* Infografika */
.aboutpage_story-infographic {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 40px;
    position: relative;
}

.aboutpage_story-infographic::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 10%;
    right: 10%;
    height: 2px;
    background: #ddd;
    z-index: 1;
}

.aboutpage_info-step {
    width: 30%;
    text-align: center;
    z-index: 2;
}

.aboutpage_info-icon {
    font-size: 3em;
    color: #007bff;
    background-color: white;
    border: 4px solid #007bff;
    border-radius: 50%;
    width: 80px;
    height: 80px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

.aboutpage_info-icon-full {
    background-color: #007bff;
    color: #ffff;
}

.aboutpage_info-caption {
    font-weight: bold;
    color: var(--text-dark);
}

.aboutpage_team {
    background-color: #e8f5ff;
}

/* --- MEDIA QUERY PRO RESPONZIVITU (Max-width 768px - typický tablet/mobil) --- */
@media (max-width: 768px) {

    .aboutpage_section {
        padding: 40px 10px;
        /* Menší padding na mobilu */
    }

    /* Responzivní Tým: 3 sloupce se srovnají do 1 */
    .aboutpage_team-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .aboutpage_team-member img {
        max-width: 150px;
        height: 150px;
    }

    .aboutpage_member-quote {
        min-height: auto;
        /* Zruší pevnou výšku na mobilu */
        text-align: center;
        /* Zpět na střed citace */
    }

    /* Responzivní Hodnoty: 2 sloupce se srovnají do 1 */
    .aboutpage_values-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .aboutpage_value-item p,
    .aboutpage_value-item strong {
        text-align: center;
        /* Zarovná text a nadpis hodnot na střed */
    }

    /* Infografika - zmenšení ikon a mezer */
    .aboutpage_story-infographic {
        flex-direction: column;
        gap: 20px;
    }

    .aboutpage_story-infographic::before {
        content: none;
        /* Odstraní linku, když jsou prvky pod sebou */
    }

    .aboutpage_info-step {
        width: 100%;
    }

}

.contactpage_container {
    margin-bottom: 50px;
}

.contactpage_intro p {
    font-size: 1.1em;
    margin-bottom: 40px;
    color: var(--text-light);
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

/* --- Kontaktní formulář --- */
.contactpage_form-wrapper {
    background-color: #f7f9fc;
    padding: 40px;
    border-radius: 10px;
    text-align: left;
}

.contactpage_form-wrapper h3 {
    text-align: center;
}

.contactpage_form-wrapper form {
    max-width: 600px;
    margin: 0 auto;
}

.contactpage_form-group {
    margin-bottom: 20px;
}

.contactpage_form-group-honey-pot {
    display: none;
}

.contactpage_form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: bold;
    color: var(--text-dark);
}

.contactpage_form-group input,
.contactpage_form-group textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-sizing: border-box;
    /* Zajišťuje, že padding nezvětšuje šířku */
    font-size: 1em;
}

.contactpage_form-group textarea {
    resize: vertical;
    min-height: 150px;
}

.contactpage_submit-button {
    color: #ffff;
    background: linear-gradient(90deg, var(--accent), var(--accent-2));
    padding: 15px 30px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1.1em;
    transition: background-color 0.3s;
    display: block;
    width: 100%;
}

.contactpage_submit-button:hover {
    background-color: #2980b9;
}

/* --- Sekce přímých kontaktů a mapy --- */
.contactpage_info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: 60px;
    text-align: center;
}

.contactpage_info-item {
    padding: 30px;
    background-color: #e8f5ff;
    border-radius: 10px;
}

.contactpage_info-item h3 {
    color: #3498db;
    font-size: 1.8em;
    margin-top: 0;
}

.contactpage_info-item p {
    margin: 5px 0;
    font-size: 1em;
    color: #333;
}

.contactpage_map-placeholder {
    min-height: 350px;
    background-color: #ddd;
    border-radius: 10px;
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    font-weight: bold;
}


/* --- MEDIA QUERY PRO RESPONZIVITU (Max-width 768px - mobil) --- */
@media (max-width: 768px) {
    .contactpage_form-wrapper {
        padding: 10px;
    }

    /* Místo 2 sloupců pro kontakty se srovnají do 1 */
    .contactpage_info-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .contactpage_map-placeholder {
        min-height: 250px;
    }
}





.pageAcademyAdminPageListItem {
    background: #eef3ff;
    padding: 10px;
    margin-bottom: 20px;
    margin-left: 20px;
    margin-right: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 20px;
}

@media (max-width: 768px) {
    .pageAcademyAdminPageListItem {
        flex-direction: column;
        text-align: center;
    }
}

.pageAcademyAdminPageListItemPostImg {
    width: 200px;
    height: 150px;
    object-fit: cover;
    border-radius: 5px;
}

@media (max-width: 768px) {
    .pageAcademyAdminPageListItemPostImg {
        width: 100%;
        height: auto;
        margin-bottom: 15px;
    }
}

.pageAcademyAdminPageListItemPost {
    flex: 1;
}

.pageAcademyAdminPageListItemPostMeta {
    font-size: 0.9em;
    color: #666;
    margin-bottom: 10px;
}

.pageAcademyAdminPageListItemPostReadMore {
    display: inline-block;
    margin-top: 10px;
    color: #0779e4;
    text-decoration: none;
    font-weight: bold;
}


.pageAcademyAdminPagePostContainer {
    max-width: 960px;
    margin: 20px auto;
    padding: 30px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    /* Větší mezery mezi sekcemi */
}

.pageAcademyPagePostContainer {
    max-width: 960px;
    margin: 20px auto;
    padding: 30px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    /* Větší mezery mezi sekcemi */
}

/* Hlavička příspěvku */
.pageAcademyAdminPagePostHeader {
    padding-bottom: 10px;
    margin-bottom: 0px;
    font-size: 22px;
    text-align: center;
    margin-top: 0px;
}

.pageAcademyAdminPagePostHeader h1 {
    margin-bottom: 10px;
    color: #555;
}

/* Hlavička příspěvku */
.pageAcademyPagePostHeader {
    padding-bottom: 10px;
    margin-bottom: 0px;
    font-size: 22px;
    text-align: center;
    margin-top: 0px;
}

.pageAcademyPagePostHeader h1 {
    margin-bottom: 10px;
    color: #555;
}

.pageAcademyAdminPagePostMeta {
    font-size: 0.9em;
    color: #777;
}

/* Sekce nahrávání souborů */
.pageAcademyAdminPageFileUploadSection {
    display: flex;
    flex-wrap: wrap;
    /* Umožní přechod na další řádek na menších obrazovkách */
    gap: 15px;
    padding: 15px;
    background-color: #f9f9f9;
    border: 1px dashed #ccc;
    border-radius: 5px;
}

.pageAcademyAdminPageFileUploadItem {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    /* Umožní prvkům zabrat dostupný prostor */
    min-width: 200px;
    /* Minimální šířka pro dobrou čitelnost */
}

.pageAcademyAdminPageFileUploadItem label {
    font-weight: bold;
    color: #555;
}

.pageAcademyAdminPageFileUploadItem input[type="file"] {
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    background-color: #fff;
    flex-grow: 1;
    /* Aby vstup zabral zbývající místo */
}

/* Sekce textového editoru */
.pageAcademyAdminPageEditorSection h2 {
    margin-bottom: 15px;
    color: #555;
}

.pageAcademyPageEditorSection h2 {
    margin-bottom: 15px;
    color: #555;
}

#pageAcademyAdminPageArticleEditor {
    width: 100%;
    min-height: 400px;
    /* Minimální výška pro editor */
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 1.1em;
    box-sizing: border-box;
    /* Zahrnuje padding a border do celkové šířky/výšky */
    resize: vertical;
    /* Umožní vertikální změnu velikosti */
    font-family: 'Arial', sans-serif;
    /* Zachování fontu */
}

/* Patička a tlačítko */
.pageAcademyAdminPagePostFooter {
    text-align: center;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

.pageAcademyAdminPagePublishButton {
    background-color: var(--notifikace_primary-color);
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    font-size: 1.1em;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.pageAcademyAdminPagePublishButton:hover {
    background-color: #45a049;
}

/* Responzivita */
@media (max-width: 768px) {
    .pageAcademyAdminPagePostContainer {
        margin: 10px;
        padding: 20px;
    }

    .pageAcademyPagePostContainer {
        margin: 0px;
        padding: 0px;
    }

    .pageAcademyAdminPagePostHeader h1 {
        font-size: 2em;
    }

    .pageAcademyAdminPageFileUploadSection {
        flex-direction: column;
        /* Skládá prvky pod sebe na menších obrazovkách */
        align-items: stretch;
    }

    .pageAcademyAdminPageFileUploadItem {
        min-width: auto;
        /* Odebere minimální šířku */
        width: 100%;
    }

    .pageAcademyAdminPageFileUploadItem input[type="file"] {
        width: 100%;
    }

    #pageAcademyAdminPageArticleEditor {
        min-height: 300px;
        /* Snížení minimální výšky na menších obrazovkách */
    }
}

@media (max-width: 480px) {
    .pageAcademyPagePostContainer {
        padding: 15px;
    }

    .pageAcademyAdminPagePostHeader h1 {
        font-size: 1.8em;
    }

    .pageAcademyAdminPagePublishButton {
        width: 100%;
        padding: 10px;
    }
}

.pageAcademyAdminPageFileUploadItemPreview {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    position: relative;
}

.pageAcademyAdminPageFileUploadItemPreview img {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    max-height: 250px;
}

.pageAcademyAdminPageFileUploadItemPreviewDeleteImg {
    position: absolute;
    top: 5px;
    /* Trochu odsazené shora */
    right: 5px;
    /* Trochu odsazené zprava */
    background-color: #e74c3c;
    /* Sytější červená */
    color: #ffffff;
    /* Bílá */
    font-size: 20px;
    /* Větší písmo */
    font-weight: bold;
    /* Tučné písmo */
    width: 35px;
    /* Pevná šířka */
    height: 35px;
    /* Pevná výška */
    display: flex;
    /* Pro centrování obsahu */
    justify-content: center;
    /* Centrování na osu X */
    align-items: center;
    /* Centrování na osu Y */
    border-radius: 50%;
    /* Kulatý tvar */
    cursor: pointer;
    /* Ukazatel myši */
    transition: background-color 0.3s ease;
    /* Plynulá animace */
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    /* Jemný stín */
}

.pageAcademyAdminPageFileUploadItemPreviewDeleteImg svg {
    color: #ffffff;
    /* Bílá */
}

.pageAcademyAdminPageFileUploadItemPreviewDeleteImg:hover {
    background-color: #c0392b;
    /* Tmavší červená při najetí myší */
}

.pageAcademyPageFileUploadItemPreview {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    position: relative;
}

.pageAcademyPageFileUploadItemPreview img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: 100%;
}

.pageAcademyPageFileUploadItemPreviewDeleteImg {
    position: absolute;
    top: 5px;
    /* Trochu odsazené shora */
    right: 5px;
    /* Trochu odsazené zprava */
    background-color: #e74c3c;
    /* Sytější červená */
    color: #ffffff;
    /* Bílá */
    font-size: 20px;
    /* Větší písmo */
    font-weight: bold;
    /* Tučné písmo */
    width: 35px;
    /* Pevná šířka */
    height: 35px;
    /* Pevná výška */
    display: flex;
    /* Pro centrování obsahu */
    justify-content: center;
    /* Centrování na osu X */
    align-items: center;
    /* Centrování na osu Y */
    border-radius: 50%;
    /* Kulatý tvar */
    cursor: pointer;
    /* Ukazatel myši */
    transition: background-color 0.3s ease;
    /* Plynulá animace */
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    /* Jemný stín */
}

.pageAcademyPageFileUploadItemPreviewDeleteImg svg {
    color: #ffffff;
    /* Bílá */
}

.pageAcademyPageFileUploadItemPreviewDeleteImg:hover {
    background-color: #c0392b;
    /* Tmavší červená při najetí myší */
}

.pageAcademyAdminPageListItemPostBtnCreateNewBody {
    margin-top: 15px;
    margin-bottom: 15px;
}

.pageAcademyAdminPageListItemPostBtnCreateNewBody a {
    text-decoration: none;
    width: 100%;
}

.pageAcademyAdminPageListItemPostBtnCreateNew {
    background-color: var(--notifikace_primary-color);
    color: var(--notifikace_white);
    margin-top: 20px;
    padding: 12px 20px;
    font-size: 16px;
    display: block;
    width: fit-content;
    margin: 20px auto 0 auto;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s;
}

.pageAcademyAdminPageDeleteButton {
    background-color: #f44336;
    color: var(--notifikace_white);
    margin-top: 20px;
    padding: 12px 20px;
    font-size: 16px;
    display: block;
    width: fit-content;
    margin: 20px auto 0 auto;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s;
}

.pageAcademyAdminPageDeleteButton a {
    text-decoration: none;
    color: var(--notifikace_white);
}

.pageAcademyPageList {
    padding-left: 20px;
    padding-right: 20px;
}

.pageAcademyPageListItem {
    background-color: #eef3ff;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
    box-shadow: 2px 1px 0px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 20px;
}

@media (max-width: 768px) {
    .pageAcademyPageListItem {
        flex-direction: column;
        text-align: center;
    }
}

.pageAcademyPageListItemPostImg {
    width: 200px;
    height: 150px;
    object-fit: cover;
    border-radius: 5px;
}

@media (max-width: 768px) {
    .pageAcademyPageListItemPostImg {
        width: 100%;
        height: auto;
        margin-bottom: 15px;
    }
}

.pageAcademyPageListItemPost {
    flex: 1;
}

.pageAcademyPageListItemPost a {
    color: #0779e4;
    text-decoration: none;
}

.pageAcademyPageListItemPostMeta {
    font-size: 0.9em;
    color: #666;
    margin-bottom: 10px;
}

.pageAcademyPageListItemPostReadMore {
    display: inline-block;
    margin-top: 10px;
    color: #0779e4;
    text-decoration: none;
    font-weight: bold;
}

.pageAcademyPageCreated {
    width: 50%;
    margin-top: 0px;
    float: right;
    text-align: right;
    color: #6c757d;
    min-width: 210px;
}

@media (max-width: 315px) {
    .pageAcademyPageMeta {
        max-width: 210px !important;
    }
}

/* Pro menší obrazovky (mobil a tablet) */
@media (max-width: 768px) {
    .pageAcademyPageMeta {
        flex-direction: column;
        /* Změní uspořádání prvků na sloupec */
        align-items: flex-start;
        /* Zarovná prvky doleva */
    }
}

.contactpage_result_ok {
    text-align: center;
    font-size: 20px;
    height: 200px;
    color: #1e266d;
    font-weight: 600;
}

.contactpage_result_message {
    text-align: center;
    font-size: 20px;
    height: 20px;
    color: #1e266d;
    font-weight: 600;
}

.pageBodyText {
    margin: 20px auto;
    margin-left: 5px;
    margin-right: 5px;
    padding: 10px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.ordernew_container {
    /*padding: 40px;*/
}

.ordernew_header {
    text-align: center;
    margin-bottom: 30px;
}

.ordernew_riselify-icon {
    width: 40px;
    height: 40px;
    margin: 0 auto 10px;
    /* Použití gradientu s hex kódy */
    background: linear-gradient(135deg, #6a9aff, #36d1dc);
    border-radius: 50%;
}

.ordernew_header h1 {
    font-size: 24px;
    color: #333;
    /* Text Color */
    margin-bottom: 5px;
}

.ordernew_subtitle {
    color: #666;
    /* Light Text */
    font-size: 15px;
}

/* Badge tarifu - používá #5b55e8 a bílý text */
.ordernew_plan-badge {
    display: inline-block;
    background-color: #5b55e8;
    /* Primary Color */
    color: #ffffff;
    /* Card Background (Bílá) */
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    margin-top: 10px;
    letter-spacing: 0.5px;
}

.ordernew_container_error {
    text-align: center;
    margin-bottom: 40px;
    margin-top: 20px;
}

.ordernew_container_error li {
    color: #ff0000;
    font-weight: bold;
}

.ordernew_container_success {
    text-align: center;
    margin-bottom: 40px;
    margin-top: 20px;
    color: #1a7f37;
    font-weight: bold;
}

.ordernew_form-group {
    margin-bottom: 20px;
}

.ordernew_form-group-line {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    font-size: 16px;
    border-bottom: 1px solid #e0e0e0;
}

.ordernew_form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    font-size: 14px;
}

.ordernew_input-field {
    width: 100%;
    padding: 12px;
    border: 1px solid #e0e0e0;
    /* Border Color */
    border-radius: 8px;
    box-sizing: border-box;
    transition: border-color 0.3s, box-shadow 0.3s;
    font-size: 16px;
}

.ordernew_input-field:focus {
    border-color: #5b55e8;
    /* Primary Color */
    box-shadow: 0 0 0 3px rgba(91, 85, 232, 0.1);
    /* Průhledný odstín Primary Color */
    outline: none;
}

/* Zelená barva pro úspěšnou validaci - #38c172 */
.ordernew_input-field.valid {
    border-color: #38c172 !important;
}

.ordernew_input-description {
    font-size: 12px;
    color: #666;
    /* Light Text */
    margin-top: 5px;
    display: block;
}

.ordernew_password-container {
    position: relative;
}

.ordernew_password-toggle {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #666;
    /* Light Text */
    font-size: 14px;
    user-select: none;
}

.ordernew_password-requirements {
    background-color: #f4f7f9;
    /* Background */
    border: 1px solid #e0e0e0;
    /* Border Color */
    padding: 10px;
    border-radius: 6px;
    margin-top: 10px;
    font-size: 13px;
    color: #666;
    /* Light Text */
    display: none;
}

.ordernew_btn-primary {
    width: 100%;
    padding: 14px;
    border: none;
    border-radius: 12px;
    /* Použití gradientu s hex kódy */
    background-image: linear-gradient(to right, #6a9aff, #36d1dc);
    color: white;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.3s, transform 0.3s;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.ordernew_btn-primary:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

.ordernew_btn-google {
    width: 100%;
    padding: 12px;
    border: 1px solid #e0e0e0;
    /* Border Color */
    background-color: #ffffff;
    /* Card Background */
    color: #333;
    /* Text Color */
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    transition: background-color 0.2s;
}

.ordernew_btn-google:hover {
    background-color: #f4f7f9;
}

/* Background (světlejší při najetí) */

.ordernew_google-icon {
    width: 18px;
    height: 18px;
    margin-right: 10px;
}

.ordernew_divider {
    text-align: center;
    margin: 25px 0 25px 0;
    position: relative;
    font-size: 13px;
    color: #666;
    /* Light Text */
}

.ordernew_divider::before,
.ordernew_divider::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 40%;
    height: 1px;
    background-color: #e0e0e0;
    /* Border Color */
}

.ordernew_divider::before {
    left: 0;
}

.ordernew_divider::after {
    right: 0;
}

.ordernew_legal-text {
    font-size: 12px;
    text-align: center;
    color: #666;
    /* Light Text */
    margin-top: 15px;
}

.ordernew_legal-text a {
    color: #5b55e8;
    /* Primary Color */
    text-decoration: none;
}

.ordernew_login-link {
    text-align: center;
    margin-top: 30px;
    font-size: 15px;
}

.ordernew_login-link a {
    color: #5b55e8;
    /* Primary Color */
    text-decoration: none;
    font-weight: 600;
}

.doplnit {
    color: red;
    font-weight: bold;
}

/* Styl pro tip box */
.installadmin_tip {
    /* PREFIXED */
    background-color: #fff8e1;
    border: 1px solid #ffecb3;
    border-left: 5px solid #ffc107;
    padding: 15px;
    margin: 20px 0;
    border-radius: 4px;
}

.installadmin_tip code {
    /* PREFIXED */
    background-color: #f0f0f0;
    overflow-wrap: break-word;
    word-break: break-word;
}

.installadmin_step_small {
    margin-left: 10px;
}

.installadmin_step_small-button {
    text-align: right;
    margin-bottom: 5px;
}

.installadmin_step_small_code {
    background-color: #f5f5f5;
    border: 1px solid #efede5;
    border-left: 5px solid #07baff;
    padding: 15px;
    margin-left: 10px;
    border-radius: 4px;
    overflow-y: hidden;
    overflow-x: scroll;
}

/* Styly pro záložkový kontejner */
.tabInstalladmin-group {
    border: 1px solid #ddd;
    padding: 15px;
    margin-top: 20px;
    border-radius: 6px;
}

.tabInstalladmin-header-container {
    display: flex;
    margin-bottom: -1px;
}

.tabInstalladmin-header {
    padding: 10px 20px;
    margin-right: 5px;
    cursor: pointer;
    border: 1px solid #ddd;
    /*border-bottom: none;*/
    background-color: #f9f9f9;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    transition: background-color 0.2s;
}

.tabInstalladmin-header:hover {
    background-color: #f0f0f0;
}

.tabInstalladmin-header.active {
    background-color: #fff;
    border-bottom: 1px solid #fff;
    /* Skrývá spodní linku, splývá s obsahem */
    font-weight: bold;
}

.tabInstalladmin-content {
    padding-top: 10px;
    border-top: 1px solid #ddd;
}


.code-containerInstalladmin {
    position: relative;
    padding: 15px;
    background-color: #f5f5f5;
    /* Světle šedé pozadí pro lepší viditelnost kódu */
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-bottom: 10px;
    overflow-x: auto;
    /* Pro případ dlouhého řádku */
}

/* Styl pro tlačítko */
.copy-buttonInstalladmin {
    position: relative;
    padding: 5px 10px;
    color: #fff;
    background: linear-gradient(135deg, #6366f1, #22d3ee);
    /*box-shadow: 0 20px 45px rgba(2, 8, 23, 0.28);*/
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s ease;
    z-index: 10;
    /* Zajistí, že je tlačítko nad kódem */
}

.copy-buttonInstalladmin:hover {
    background-color: #0056b3;
}

/* Styl pro zprávu po zkopírování */
.copy-messageInstalladmin {
    margin-top: 10px;
    color: green;
    font-weight: bold;
    display: none;
    /* Skryté, dokud se neklikne na tlačítko */
}

/* General container styles for better spacing on all devices */
.pageBodyInstallAdminItem {
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    /*background-color: #ffff;*/
    border-radius: 8px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    border-color: #3498db;
    /*border: 1px solid #3498db;*/
    /*box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);*/
    padding: 0px;
    /* margin-bottom: 15px; */
    display: flex;
    flex-direction: column;
    gap: 0px;
    /*max-width: 1200px;*/
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
}

/* Adjustments for the main text and icon container */
.pageBodyInstallAdminItemText {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    text-align: left;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    /*margin-bottom: 15px;*/
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

/* Specific icon adjustments */
.collapse-toggle-install-admin-icon-down,
.collapse-toggle-install-admin-icon-up {
    margin-left: 10px;
    font-size: 1.2em;
    /* Increase icon size for better visibility */
}

/* Show the down icon by default, hide the up icon */
.collapse-toggle-install-admin-icon-down {
    display: inline-block;
}

.collapse-toggle-install-admin-icon-up {
    display: none;
}

.pageBodyInstallAdminInside,
#pageBodyInstallAdminInside-1,
#pageBodyInstallAdminInside-2 {
    display: none;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
    border-radius: 4px;
}

/* Nastavení firmy / segment obchodu — obsah bez accordion JS, vždy viditelný */
.pageSettingsPageBody > .pageBodyInstallAdminItem > .pageBodyInstallAdminInside {
    display: block;
}

.pageBodyInstallAdminInsideWarningInfo {
    background-color: #cf3543;
    color: rgb(255, 255, 255);
    padding: 12px 20px;
    border: 1px solid #cf3543;
    border-radius: 4px;
    margin-bottom: 15px;
    font-family: sans-serif;
    text-align: center;
}

.pwa_settings_field-group {
    margin-bottom: 20px;
}

.pwa_settings_label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

.pwa_settings_input,
.pwa_settings_textarea {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.pwa_settings_textarea {
    resize: vertical;
}

.pwa_settings_error-message {
    color: red;
    font-size: 0.9em;
    margin-top: 5px;
}

.pwa_settings_submit-btn {
    padding: 10px 15px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.pwa_settings_submit-btn:hover {
    background-color: #0056b3;
}

.pwa_settings_submit-btn:disabled {
    background-color: #ccc;
    cursor: not-allowed;
}

/* CSS pro náhledy ikon */
.pwa_settings_preview-container-body {
    text-align: center;
}

.pwa_settings_preview-container {
    position: relative;
    width: 192px;
    /* Standardní velikost pro malou ikonu */
    max-width: 100%;
    max-height: 100%;
    border: 1px solid #ddd;
    display: inline-block;
    margin-top: 10px;
    margin-bottom: 10px;
    overflow: hidden;
    background-color: #f9f9f9;
    /* Pozadí pro lepší viditelnost PNG s průhledností */
}

#icon_big_preview_container {
    max-width: 100%;
    max-height: 100%;
    width: 512px;
}

.pwa_settings_icon-preview {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: none;
    /* Zpočátku skryté, zobrazeno JS při platném src */
}

.pwa_settings_remove-btn {
    position: absolute;
    top: 5px;
    right: 5px;
    background: rgba(255, 0, 0, 0.7);
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    line-height: 21px;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    font-size: 1.2em;
    display: none;
    /* Zpočátku skryté, zobrazeno, pokud je ikona */
    z-index: 10;
}

.pwa_settings_view_app {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.pwa_settings_notification_view {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.settings_notification_send {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.pageSettingsPageBodySettingsItemSelect {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.pageSettingsPageBodySettingsItem {
    margin-top: 20px;
}

#pageBodyMap {
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-top: 0px;
    /* border: 1px solid #3498db; */
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.pageBodyMapHeadTitle {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}


/* --- ZÁKLADNÍ CSS TŘÍDY (s prefixem) --- */

.videolistadmin_videoListTable {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 14px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    background-color: #fff;
}

.videolistadmin_pageVideoListAdminPageBody {
    margin-left: 5px;
    margin-right: 5px;
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(10px);
    padding: 10px;
    width: 95%;
    box-sizing: border-box;
}

/* Hlavička tabulky */
.videolistadmin_videoListTable thead th {
    background-color: var(--notifikace_primary-color);
    color: var(--notifikace_white);
    padding: 10px 15px;
    text-align: left;
    font-weight: bold;
    border-bottom: 1px solid var(--notifikace_primary-color);
    border-right: 1px solid var(--notifikace_primary-color);
    border-left: 1px solid #ddd;
}

/* 2. Speciální styl pro PRVNÍ hlavičkovou buňku (levý roh) */
.videolistadmin_videoListTable thead th:first-child {
    border-top-left-radius: 4px;
    border-left: none;
}

/* 3. Speciální styl pro POSLEDNÍ hlavičkovou buňku (pravý roh) */
.videolistadmin_videoListTable thead th:last-child {
    border-top-right-radius: 4px;
    border-right: none;
}

/* Řádky v tabulce */
.videolistadmin_videoListTable tbody tr {
    border-bottom: 1px solid #eee;
}

.videolistadmin_videoListTable tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}

.videolistadmin_videoListTable tbody tr:hover {
    background-color: #f1f1f1;
}

/* Buňky v tabulce */
.videolistadmin_videoListTable tbody td {
    padding: 10px 15px;
    border: 1px solid #ddd;
    vertical-align: middle;
}

/* Odkazy v buňkách */
.videolistadmin_videoListTable tbody td a {
    color: #007bff;
    text-decoration: none;
    transition: color 0.2s;
}

.videolistadmin_videoListTable tbody td a:hover {
    color: #0056b3;
    text-decoration: underline;
}

/* Styly pro indikátor stavu Zobrazit */
.videolistadmin_status-active {
    background-color: #e6ffe6;
    color: #28a745;
    padding: 3px 8px;
    border-radius: 4px;
    font-weight: bold;
}

.videolistadmin_status-inactive {
    background-color: #ffe6e6;
    color: #dc3545;
    padding: 3px 8px;
    border-radius: 4px;
    font-weight: bold;
}

/* Styly pro tlačítko Vytvořit nové video */
.videolistadmin_pageVideoListAdminPageAddButton,
.videolistadmin_pageVideoListAdminPageListItemPostBtnCreateNewBody {
    margin-bottom: 20px;
}

.videolistadmin_pageVideoListAdminPageBtnCreateNew {
    display: inline-block;
    padding: 10px 20px;
    background-color: var(--notifikace_primary-color);
    color: var(--notifikace_white);
    text-align: center;
    border-radius: 5px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.2s;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 8px;
}

.videolistadmin_pageVideoListAdminPageBtnCreateNew:hover {
    background-color: #0056b3;
}

.videolistadmin_pageVideoListAdminPageAddButton a,
.videolistadmin_pageVideoListAdminPageListItemPostBtnCreateNewBody a {
    text-decoration: none;
}

.videolistadmin_video-preview-cell {
    width: 100px;
    text-align: center;
}

.videolistadmin_video-preview-thumb {
    width: 100%;
    max-height: 60px;
    height: auto;
    object-fit: cover;
    border: 1px solid #ddd;
    border-radius: 3px;
    display: block;
    margin: 0 auto;
}

/* --- RESPONZIVNÍ STYLY (Card View) --- */

@media screen and (max-width: 768px) {

    .videolistadmin_videoListTable,
    .videolistadmin_videoListTable thead,
    .videolistadmin_videoListTable tbody,
    .videolistadmin_videoListTable th,
    .videolistadmin_videoListTable td,
    .videolistadmin_videoListTable tr {
        display: block;
        /* Všechny prvky tabulky se chovají jako blokové */
    }

    .videolistadmin_videoListTable thead tr {
        position: absolute;
        /* Skrytí hlavičky */
        top: -9999px;
        left: -9999px;
    }

    .videolistadmin_videoListTable tr {
        border: 1px solid #ccc;
        margin-bottom: 10px;
        border-radius: 4px;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    /* Vzhled buňky */
    .videolistadmin_videoListTable td {
        border: none;
        /* Odstranit okraje buňky */
        border-bottom: 1px solid #eee;
        /* Pouze oddělovač mezi "poli" */
        position: relative;
        padding-left: 50%;
        /* Uvolnit místo pro popisek (data-label) */
        text-align: right;
    }

    /* Poslední buňka v řádku */
    .videolistadmin_videoListTable tr td:last-child {
        border-bottom: none;
    }

    /* Zobrazení datového atributu jako popisku */
    .videolistadmin_videoListTable td:before {
        content: attr(data-label);
        /* Získat text z data-label */
        position: absolute;
        left: 0;
        width: 45%;
        padding-left: 15px;
        font-weight: bold;
        text-align: left;
        white-space: nowrap;
        /* Zabrání zalomení textu popisku */
    }

    /* Úpravy pro Náhled (centrování) */
    .videolistadmin_video-preview-cell {
        width: 100%;
        padding-top: 15px;
        /* Více místa */
        padding-bottom: 15px;
        text-align: center;
    }

    .videolistadmin_video-preview-cell:before {
        line-height: 60px;
        /* Zarovnání popisku k vertikálnímu středu */
    }

    .videolistadmin_video-preview-thumb {
        display: inline-block;
        /* Aby se dal vycentrovat */
        max-width: 100px;
        /* Menší náhled na mobilu */
        height: auto;
    }
}

#statsmapadminMapa {
    height: 600px;
    /* Nastavte podle potřeby */
    width: 100%;
    z-index: 1;
}

.notifikace_status {
    height: 50px;
}

.notifikace_status_head {
    float: left;
    margin-left: 15px;
}

.notifikace_status_text_on {
    float: left;
    padding-left: 5px;
    color: #008000;
}

.notifikace_status_text_off {
    float: left;
    padding-left: 5px;
    color: #f44336;
}

.pageBodyStatsAdminGraphItemSelect {
    background: #fff;
    padding: 5px;
    border-radius: 10px;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    margin-top: 5px;
    box-sizing: border-box;
}

/* Dva+ selecty vedle sebe — bez přetečení z úzké karty (flex default min-width:auto brání smrštění) */
.pageBodyStatsAdminGraphItemSelect--row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
    min-width: 0;
    max-width: 100%;
}

.pageBodyStatsAdminGraphItemSelect--row select {
    flex: 1 1 0;
    min-width: 0;
    max-width: 100%;
    margin-bottom: 0;
    box-sizing: border-box;
}

.pageBodyStatsAdminGraphItemDashboard > .pageBodyStatsAdminGraphItemSelect {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
    width: 100%;
    margin-bottom: 8px;
}

/* Řádek s výběrem období nad canvasem — nepřekrývat osu grafu */
.pageBodyStatsAdminGraphInsideBody > .pageBodyStatsAdminGraphItemSelect {
    flex-shrink: 0;
    width: 100%;
    margin-bottom: 10px;
    box-sizing: border-box;
}

.pageBodyStatsAdminGraphInsideBody > .pageBodyStatsAdminGraphItemSelect select {
    margin-bottom: 0;
}

.impersonaceadminTableBody {
    background: #eef3ff;
    padding: 10px;
    margin-bottom: 20px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 20px;
}

.impersonaceadminTable {
    width: 100%;
    color: #000;
}

.impersonaceadminTable td {
    text-align: center;
}

.pageSettingsAbandonedcartPageBody {
    margin: 30px 10px 10px 5px;
    padding: 0px;
    display: block;
    --pad: 22px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 8px;
    backdrop-filter: blur(10px);
    width: 100%;
}

.pageSettingsAbandonedcartHeadTitle {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.pageSettingsAbandonedcartHeadBody {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
    padding-top: 10px;
    /* border: 1px solid #3498db; */
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.abandonedcart_settings_form {
    margin: 0 auto;
}

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

.abandonedcart_settings_label {
    display: block;
    margin-bottom: 5px;
}

/* Stylování inputů a textarea přes třídu */
.abandonedcart_settings_input:not([type="submit"]):not([type="file"]),
.abandonedcart_settings_textarea {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.abandonedcart_settings_error-message {
    color: red;
    font-size: 0.9em;
    margin-top: 5px;
}

.abandonedcart_settings_submit-btn {
    padding: 10px 15px;
    cursor: pointer;
    width: 110px;
}

/* Styl pro neaktivní tlačítko */
.abandonedcart_settings_submit-btn:disabled {
    background-color: #aaa;
    cursor: not-allowed;
}

.abandonedcart_settings_submit-btn:hover:not(:disabled) {
    /*background-color: #45a049;*/
}

.abandonedcart_settings_notification_view {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.abandonedcart_settings_notification_abandonedcart {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.abandonedcart_settings_notification_abandonedcart_time {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.pageAbandonedcartPageList {
    margin: 30px 10px 10px 5px;
    padding: 0px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: start;
}

.pageAbandonedcartPageList > * {
    min-width: 0;
}

.pageAbandonedcartPageList > .clear {
    display: none;
}

.pageAbandonedcartPageHead {
    --pad: 22px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 8px;
    backdrop-filter: blur(10px);
    width: 100%;
    margin-bottom: 10px;
}

.pageAbandonedcartPageHeadTitle {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}

.VOP_container {
    font-family: 'Arial', sans-serif;
    line-height: 1.5;
    color: #222;
    max-width: 950px;
    margin: 30px auto;
    padding: 50px;
    background: #fff;
    border: 1px solid #ccc;
}

.VOP_title {
    text-align: center;
    font-weight: bold;
    font-size: 22px;
    margin-bottom: 30px;
    text-transform: uppercase;
}

.VOP_heading-1 {
    font-weight: bold;
    font-size: 18px;
    margin-top: 25px;
    margin-bottom: 10px;
}

.VOP_heading-2 {
    font-weight: bold;
    margin-top: 15px;
    margin-bottom: 5px;
}

.VOP_text {
    margin-bottom: 10px;
    white-space: pre-line;
    /* Zachová zalomení řádků jako v původním textu */
}

.VOP_indent {
    margin-left: 20px;
}

@media print {
    .VOP_container {
        border: none;
        margin: 0;
        padding: 0;
    }
}

.GDPR_container {
    /*
    font-family: 'Arial', sans-serif;
    line-height: 1.5;
    color: #222;
    max-width: 950px;
    margin: 30px auto;
    padding: 50px;
    background: #fff;
    border: 1px solid #ccc;
    */
}

.GDPR_title {
    text-align: center;
    font-weight: bold;
    font-size: 22px;
    margin-bottom: 30px;
    text-transform: uppercase;
}

.GDPR_heading-1 {
    font-weight: bold;
    font-size: 18px;
    margin-top: 25px;
    margin-bottom: 10px;
}

.GDPR_heading-2 {
    font-weight: bold;
    margin-top: 15px;
    margin-bottom: 5px;
}

.GDPR_text {
    margin-bottom: 10px;
    white-space: pre-line;
}

.GDPR_indent {
    margin-left: 20px;
}

.GDPR_table {
    width: 100%;
    border-collapse: collapse;
    margin: 15px 0;
}

.GDPR_table th,
.GDPR_table td {
    border: 1px solid #ccc;
    padding: 10px;
    text-align: left;
}

.GDPR_table th {
    background-color: #f2f2f2;
}

@media print {
    .GDPR_container {
        border: none;
        margin: 0;
        padding: 0;
    }
}

.pageSettingsPageBodyUserNameSelectBox {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.firmaPoznamka {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}

.searchContainerImpersonace {
    background: #eef3ff;
    padding: 10px;
    margin-bottom: 20px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 20px;
}

.searchContainerImpersonaceInput {
    padding: 10px;
    width: 100%;
    border-radius: 4px;
    border: 1px solid #ccc;
}

.pageBodyTextTarifSettings {
    margin-top: 20px;
    margin-bottom: 20px;
}

.ordercompleteadmin_container {
    max-width: 800px;
    margin: 40px auto;
    font-family: sans-serif;
}

.ordercompleteadmin_content {
    text-align: center;
    padding: 40px 20px;
    background-color: #ffffff;
}

.ordercompleteadmin_icon {
    font-size: 64px;
    color: #28a745;
    margin-bottom: 20px;
}

.ordercompleteadmin_main-text {
    font-size: 1.25rem;
    color: #333;
    margin-bottom: 15px;
}

.ordercompleteadmin_sub-text {
    color: #666;
    margin-bottom: 30px;
}

.ordercompleteadmin_divider {
    height: 1px;
    background-color: #eee;
    margin: 30px auto;
    width: 50%;
}

.ordercompleteadmin_support a {
    color: #007bff;
    text-decoration: none;
}

.ordercompleteadmin_support a:hover {
    text-decoration: underline;
}

.ordercompleteadmin_btn {
    display: inline-block;
    background-color: #007bff;
    color: #ffffff;
    padding: 12px 25px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.2s;
}

.ordercompleteadmin_btn:hover {
    background-color: #0056b3;
}

.footer-bottom-logo {
    padding: 20px 0 12px;
    background-color: #e6eef5;
    color: #1a1e36;
}

.footer-logo {
    max-width: 420px;
    height: auto;
    display: block;
    margin: 0 auto;
    padding: 0px 0;
}

@media (max-width: 530px) {
    .footer-logo {
        max-width: 100% !important;
    }
}

.footer-inner-comgate {
    text-align: center;
}

/* Základní styl kontejneru */
.faktury-container {
    width: 100%;
    margin: 20px 0;
    font-family: 'Segoe UI', Roboto, sans-serif;
}

.table-faktury {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    color: #2c3e50;
}

.table-faktury thead tr {
    background-color: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.table-faktury th,
.table-faktury td {
    padding: 15px;
    text-align: left;
}

/* Flexbox pro akce v posledním sloupci */
.faktury-actions-cell {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: flex-end;
}

/* --- RESPONSIVE BREAKPOINT --- */
@media screen and (max-width: 768px) {

    /* Skryjeme hlavičku tabulky */
    .table-faktury thead {
        display: none;
    }

    .table-faktury,
    .table-faktury tbody,
    .table-faktury tr,
    .table-faktury td {
        display: block;
        width: 100%;
    }

    .table-faktury tr {
        margin-bottom: 0px;
        border: 1px solid #eee;
        border-radius: 10px;
        padding: 10px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
    }

    .table-faktury td {
        text-align: right;
        padding-left: 50%;
        position: relative;
        border-bottom: 1px solid #f9f9f9;
    }

    /* Přidáme popisky před hodnoty pomocí data-label */
    .table-faktury td::before {
        content: attr(data-label);
        position: absolute;
        left: 15px;
        width: 45%;
        font-weight: bold;
        text-align: left;
        color: #666;
    }

    .table-faktury td:last-child {
        border-bottom: none;
        padding-left: 15px;
        /* Akce chceme na celou šířku */
    }

    .faktury-actions-cell {
        justify-content: center;
        width: 100%;
    }
}

/* Styl tlačítek a ikon */
.pay-button-invoices {
    background: #007bff;
    color: white;
    padding: 8px 16px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}

.pay-button-invoices-small {
    background: #007bff;
    color: white;
    padding: 2px 16px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    margin-left: 5px;
}

.faktury-action-icon {
    color: #333;
    font-size: 20px;
    text-decoration: none;
}

.pay-button-invoices-nopay-info {
    color: #28a745;
    font-weight: bold;
    font-size: 13px;
}

.add-addon-pay-button-body {
    background: #0779e4;
    color: #ffffff;
    border: none;
    padding: 7px 0px;
    flex: 1;
    border-radius: 12px;
    font-weight: bold;
    font-size: 14px;
    cursor: pointer;
    transition: transform 0.1s ease, opacity 0.2s ease;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
}

.add-addon-pay-button-body a {
    color: #fff !important;
    text-decoration: none !important;
}

.ordercompleteadmin_pay_button_body {
    background: #0779e4;
    color: #ffffff;
    border: none;
    padding: 7px 0px;
    flex: 1;
    border-radius: 12px;
    font-weight: bold;
    font-size: 14px;
    cursor: pointer;
    transition: transform 0.1s ease, opacity 0.2s ease;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
}

.ordercompleteadmin_pay_button_body a {
    color: #fff !important;
    text-decoration: none !important;
}

.paymentsuccessful_container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

.paymentsuccessful_card {
    text-align: center;
}

.paymentsuccessful_icon_wrapper {
    width: 80px;
    height: 80px;
    background-color: #2ecc71;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 20px;
    color: white;
    font-size: 40px;
    font-weight: bold;
}

.paymentsuccessful_icon_wrapper_fail {
    width: 80px;
    height: 80px;
    background-color: #ff4757;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 20px;
    color: white;
    font-size: 40px;
    font-weight: bold;
}

.paymentsuccessful_title {
    color: var(--paymentsuccessful-dark);
    margin-bottom: 10px;
    font-size: 24px;
}

.paymentsuccessful_message {
    color: var(--paymentsuccessful-gray);
    line-height: 1.5;
    margin-bottom: 30px;
}

.paymentsuccessful_card a {
    text-decoration: none;
}

.universal_payment_result_btn {
    background-color: #2d3447;
    color: white;
    border: none;
    padding: 12px 0;
    width: 100%;
    border-radius: 8px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s;
}

.tariffpaymentoperationadmin_container {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    max-width: 900px;
    color: #1e293b;
    background-color: #fff;
    border-radius: 12px;
}

.tariffpaymentoperationadmin_header h1 {
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    text-align: center;
}

.tariffpaymentoperationadmin_card {
    background: #ffffff;
    border: 1px solid #e1e4e8;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    margin-bottom: 1rem;
}

.tariffpaymentoperationadmin_plan-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-left: 4px solid #2563eb;
}

.tariffpaymentoperationadmin_plan-name h2 {
    margin: 0.25rem 0;
    font-size: 1.25rem;
    display: inline-block;
}

.tariffpaymentoperationadmin_price {
    font-size: 1.5rem;
    font-weight: bold;
    color: #2563eb;
    margin-left: 1rem;
}

.tariffpaymentoperationadmin_price span {
    font-size: 0.9rem;
    color: #64748b;
}

.tariffpaymentoperationadmin_payment-button {
    margin-top: 10px;
}

.tariffpaymentoperationadmin_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.tariffpaymentoperationadmin_detail-item {
    margin-top: 1rem;
    background: #f1f5f9;
    padding: 0.75rem;
    border-radius: 6px;
}

.tariffpaymentoperationadmin_small-label {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.tariffpaymentoperationadmin_qr-placeholder {
    margin-top: 1.5rem;
    display: flex;
    justify-content: center;
}

.tariffpaymentoperationadmin_qr-box {
    width: 120px;
    height: 120px;
    background: #eee;
    border: 1px dashed #ccc;
    display: flex;
    align-items: center;
    text-align: center;
    font-size: 0.8rem;
    color: #666;
    padding: 10px;
}

.tariffpaymentoperationadmin_btn-secondary {
    background: white;
    border: 1px solid #e2e8f0;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.2s;
}

.tariffpaymentoperationadmin_btn-secondary:hover {
    background: #f1f5f9;
}

.tariffpaymentoperationadmin_btn-link {
    background: none;
    border: none;
    color: #2563eb;
    text-decoration: underline;
    cursor: pointer;
    padding: 0;
    margin-top: 1rem;
    font-size: 0.9rem;
}

@media (max-width: 600px) {
    .tariffpaymentoperationadmin_grid {
        grid-template-columns: 1fr;
    }

    .tariffpaymentoperationadmin_plan-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
}
.Readership-overview_container {
    font-family: sans-serif;
    color: #2d3748;
    margin: 20px auto;
    max-width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
}

.Readership-overview_indicator {
    background: #f8fafc;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #edf2f7;
    margin-bottom: 20px;
    text-align: center;
}

.Readership-overview_total-val {
    font-size: 2rem;
    font-weight: bold;
    color: #3182ce;
    margin: 5px 0;
}

.Readership-overview_table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.Readership-overview_th {
    background: #edf2f7;
    padding: 12px 15px;
    text-align: left;
    font-size: 0.75rem;
    text-transform: uppercase;
    color: #4a5568;
}

.Readership-overview_td {
    padding: 12px 15px;
    border-bottom: 1px solid #edf2f7;
    font-size: 0.9rem;
    word-break: break-all;
}

.Readership-overview_val-box {
    font-family: monospace;
    font-weight: bold;
    text-align: right;
    white-space: nowrap;
}

.Readership-overview_count-box {
    text-align: center;
    color: #718096;
    font-size: 0.85rem;
}

.Readership-overview_high {
    color: #2f855a;
}

.Readership-overview_mid {
    color: #c05621;
}

.Readership-overview_low {
    color: #e53e3e;
}

.Readership-overview_zero {
    color: #a0aec0;
}

@media screen and (max-width: 768px) {

    .Readership-overview_table,
    .Readership-overview_table thead,
    .Readership-overview_table tbody,
    .Readership-overview_table th,
    .Readership-overview_table td,
    .Readership-overview_table tr {
        display: block;
    }

    .Readership-overview_table thead {
        display: none;
    }

    .Readership-overview_tr {
        border-bottom: 3px solid #edf2f7;
        padding: 10px 0;
    }

    .Readership-overview_td {
        border-bottom: none;
        position: relative;
        padding-left: 45%;
        text-align: right;
    }

    .Readership-overview_td::before {
        content: attr(data-label);
        position: absolute;
        left: 15px;
        width: 40%;
        text-align: left;
        font-weight: bold;
        text-transform: uppercase;
        font-size: 0.65rem;
        color: #a0aec0;
    }
}

.pageSettingsSlevovekuponyadminPageBody{
    margin: 30px 10px 10px 5px;
    padding: 0px;
    display: block;
    --pad: 22px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    border-radius: 8px;
    backdrop-filter: blur(10px);
    width: 100%;
}
.pageSettingsSlevovekuponyadminHeadTitle {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #fff;
    background-color: #3498db;
    padding: 12px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}
.pageSettingsSlevovekuponyadminHeadBody{
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
    padding-top: 10px;
    /* border: 1px solid #3498db; */
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
    -moz-box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.39);
}
.slevovekuponyadmin_settings_label {
    display: block;
    margin-bottom: 5px;
}
.slevovekuponyadmin_settings_field-group {
    margin-bottom: 15px;
}
.slevovekuponyadmin_settings_notification_slevovekuponyadmin {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
}
#slevovekuponyadmin_name {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
    border: 1px solid #ddd;
    border-radius: 4px;
}