/* =========================================
   RESET
========================================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    width: 100%;
    height: auto;
    font-family: Arial, sans-serif;
    background-color: #f5f5f7;
    color: #000;
}

/* =========================================
   ZÁKLADNÍ TYPOGRAFIE
========================================= */
body {
    font-size: 16px;
    line-height: 1.45;
}

/* Kontajner – budeme používat všude, kde potřebujeme zarovnání */
.container {
    width: 100%;
    max-width: 1400px; /* ÚPRAVA PRO TEBE */
    margin: 0 auto;
    padding-left: 12px;
    padding-right: 12px;
}

/* =========================================
   MEDIA QUERIES – MOBILE FIRST
   Profesionální rozmezí pro skutečný e-shop
========================================= */

/* -----------------------------------------
   1) MOBIL NA VÝŠKU (defaultní stav)
   0–479 px
   (Nic sem nepíšeme – default)
----------------------------------------- */


/* -----------------------------------------
   2) MOBIL NA ŠÍŘKU
   480 px a více
----------------------------------------- */
@media (min-width: 480px) {
    body {
        font-size: 17px;
    }
}


/* -----------------------------------------
   3) MENŠÍ TABLET / VĚTŠÍ TELEFONY NA ŠÍŘKU
   600 px a více
----------------------------------------- */
@media (min-width: 600px) {
    body {
        font-size: 17px;
    }
}


/* -----------------------------------------
   4) TABLET NA VÝŠKU
   768 px a více
----------------------------------------- */
@media (min-width: 768px) {
    body {
        font-size: 18px;
    }
}


/* -----------------------------------------
   5) TABLET NA ŠÍŘKU
   900 px a více
----------------------------------------- */
@media (min-width: 900px) {
    body {
        font-size: 18px;
    }
}


/* -----------------------------------------
   6) MALÝ NOTEBOOK / ZÁKLADNÍ DESKTOP
   992 px a více
----------------------------------------- */
@media (min-width: 992px) {
    body {
        font-size: 18px;
    }
}


/* -----------------------------------------
   7) STANDARDNÍ DESKTOP (4 sloupce)
   1200 px a více
----------------------------------------- */
@media (min-width: 1200px) {
    body {
        font-size: 18px;
    }

    .container {
        max-width: 1400px; /* ÚPRAVA PRO TEBE */
    }
}


/* -----------------------------------------
   8) VELKÉ MONITORY
   1400 px a více
----------------------------------------- */
@media (min-width: 1400px) {
    body {
        font-size: 19px;
    }

    .container {
        max-width: 1400px; /* ÚPRAVA PRO TEBE */
    }
}




/*--------------------------padding na mobilech--------*/
@media (max-width: 1400px) {
    body {
        padding-left: 10px;
        padding-right: 10px;
    }
}
/*____________________________________________________________________________________________info_bar.php

/* =========================================
   INFO BAR – KOŠÍK (max 1400 px, centrovaný)
========================================= */

.info-bar {
    width: 100%;
    max-width: 1400px;      /* max šířka celé lišty */
    margin: 0 auto;         /* centrování na střed okna */
    padding: 10px 16px;     /* trochu místa zleva i zprava, aby badge nelezl ven * - puvodni  padding: 10px 16px;  /
    display: flex;
    justify-content: flex-end; /* obsah infobaru vpravo v rámci 1400 px */
   
}

/* odkaz obaluje celý pravý blok */
.info-bar > a {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    text-decoration: none;
    color: inherit;
}

/* pravý blok (košík + badge vedle sebe) */
.info-bar-right {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 4px;              /* mezera mezi košíkem a badge */
}

/* samotný košík */
.cart-icon img {
    width: 30px;
    height: auto;
    display: block;
}

/* badge – samostatný objekt vedle košíku, posunutý nahoru */
.cart-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    padding: 3px 7px;
    background: #c30000;
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    border-radius: 0;
    border: 2px solid #ffffff;
}

/* =========================================
   INFO BAR – MEDIA QUERIES
========================================= */

/* 480+ px – mobil na šířku */
@media (min-width: 480px) {
    .cart-badge {
        font-size: 13px;
        padding: 3px 8px;
    }
}

/* 600+ px – malý tablet */
@media (min-width: 600px) {
    .cart-icon img {
        width: 32px;
    }
}

/* 768+ px – tablet na výšku */
@media (min-width: 768px) {
    .info-bar {
        padding: 12px 20px;
    }

    .cart-icon img {
        width: 34px;
    }

    .cart-badge {
        font-size: 14px;
    }
}

/* 992+ px – desktop */
@media (min-width: 992px) {
    .cart-icon img {
        width: 36px;
    }

    .cart-badge {
        font-size: 15px;
    }
}




/*____________________________________________________________________________________________logo.php
/* =========================================
   LOGO BAR – MAX 1400 PX, CENTROVANÝ
========================================= */

/* =========================================
   LOGO – základ
========================================= */

.logo-bar {
    width: 100%;
    max-width: 1400px;       /* stejná logika jako infobar */
    margin: 0 auto;
    padding: 1px 0;     /* původní  padding: 15px 0;*/

    display: flex;
    justify-content: center;
    align-items: center;
}

.logo-inner {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

/* Výchozí logo — mobil + tablet */
.logo-img {
    width: 150px;            /* základní velikost */
    height: auto;
    display: block;
}


/* =========================================
   600 px – menší tablet
========================================= */
@media (min-width: 600px) {
    .logo-img {
        width: 170px;
    }
}

/* =========================================
   768 px – tablet na výšku
========================================= */
@media (min-width: 768px) {
    .logo-img {
        width: 190px;
    }
}

/* =========================================
   992 px – menší desktop, notebook
========================================= */
@media (min-width: 992px) {
    .logo-img {
        width: 200px;
    }
}

/* =========================================
   1200 px – VELKÝ DESKTOP
   (tady chceš zvýšení na 350 px)
========================================= */
@media (min-width: 1200px) {
    .logo-img {
        width: 220px;
    }
}

#logo_text {
    text-align: center;
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.4;
    margin: 6px 0 14px 0;   /* reset default h1 marginů */
    color: #000000;
}

/*____________________________________________________________________________________________ menu.php


/* =========================================
   MENU – základní struktura
========================================= */

.menu-bar {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;

    /* původně: padding: 1px 6px;  -> nyní 0 po stranách */
    padding: 8px 0;
}

.menu-container {
    display: grid;
    gap: 16px;

    /* default – mobilní telefony */
    grid-template-columns: repeat(2, 1fr);
}

/* =========================================
   MENU ITEM
========================================= */

.menu-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    background: #ffffff;
    border: 2px solid #e5e7eb;
    border-radius: 0;
    padding: 18px 10px;
    transition: transform 0.2s ease-in-out;
}

.menu-item:hover {
}

.menu-icon {
    width: 70px;
    height: auto;
    margin-bottom: 12px;
}

.menu-text {
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: black;
    line-height: 1.2;
}

/* =========================================
   ACTIVE MENU ITEM
========================================= */

.menu-item.active {
    border-color: #e5e7eb !important;
    background: #ffffff;
}

.menu-item.active .menu-text {
    color: #c90000;
    font-weight: 700;
}


/* =========================================
   RESPONSIVE BREAKPOINTS
========================================= */

@media (min-width: 600px) {
    .menu-container {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 768px) {
    .menu-icon {
        width: 80px;
    }
}

@media (min-width: 992px) {
    .menu-container {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1200px) {
    .menu-container {
        grid-template-columns: repeat(6, 1fr);
    }

    .menu-icon {
        width: 95px;
    }

    .menu-text {
        font-size: 18px;
    }
}


/*____________________________________________________________________________________________zobrazeniproduktu naramky.php, privesky.php atd:
/* =====================================================================================
   PRODUKTY – GRID A KARTY PRODUKTŮ
   (styl laděný do designu ÚčaÚče.cz, responzivní, čistý, profesionální)
===================================================================================== */

/* KONTEJNER S PRODUKTY */
.produkty-grid {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;

    /* PŮVODNĚ: padding: 16px;  -> teď chceme 0, aby první/poslední karta byly na hraně */
    padding: 0;

    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 20px;
}


/* KARTA PRODUKTU */
.produkt {
    background: #ffffff;
    border: 2px solid #e5e7eb;
    border-radius: 0;
    padding: 14px;
    text-align: center;
    cursor: pointer;
    transition: all 0.22s ease-in-out;

    display: grid;
    grid-template-rows: auto 1fr auto;  
}


.produkt:hover {
    box-shadow: none;
    
}


/* OBRÁZEK PRODUKTU */
.produkt-thumb {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 0;
    margin-bottom: 12px;
    background: #ffffff;
}

/* NÁZEV PRODUKTU */
.produkt-nazev {
    font-size: 1.1rem;
    font-weight: 600;
    color: #000000;
    margin-bottom: 6px;

    /* Tohle zarovná názvy, ale NEROZHODÍ střed */
    min-height: 48px;
}
/* CENA */
.produkt-cena {
    font-size: 1.2rem;
    font-weight: bold;
    color: #c30000;
}



/* =====================================================================================
   MEDIA QUERIES – PRODUKTY (navazuje na tvůj systém)
===================================================================================== */

/* 480 px — širší mobil */
@media (min-width: 480px) {
    .produkt-thumb {
        height: 220px;
    }
}

/* 600 px — mobil na šířku / malý tablet */
@media (min-width: 600px) {
    .produkty-grid {
        /* jen zvětšíme mezery mezi kartami, padding NEVRACÍME */
        gap: 24px;
    }
    .produkt-thumb {
        height: 230px;
    }
}

/* 768 px — tablet na výšku */
@media (min-width: 768px) {
    .produkt-thumb {
        height: 240px;
    }
}

/* 900 px — tablet na šířku */
@media (min-width: 900px) {
    .produkt-thumb {
        height: 250px;
    }
}

/* 992 px — menší desktop */
@media (min-width: 992px) {
    .produkty-grid {
        grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    }
    .produkt-thumb {
        height: 260px;
    }
}

/* 1200 px — klasický desktop */
@media (min-width: 1200px) {
    .produkt-thumb {
        height: 270px;
    }
}

/* 1400 px — velké monitory */
@media (min-width: 1400px) {
    .produkt-thumb {
        height: 300px;
    }
}

/*____________________________________________________________________________________________vzhledfiltrů v naramk.yphp privesky.php atd.
/* ========== FILTROVACÍ BOXY ========== */
/* ============================================================
   FILTR PANEL – NOVÝ MODERNÍ GRID DESIGN
============================================================ */

/* ========================================================================================
   FILTRY – KOMPAKTNÍ GRID 1–2–4 SLOUPCE (FINAL)
   Ladí s rámečky, barvami a zaoblením celého webu ÚčaÚče.cz
======================================================================================== */

.filtry-box {
    max-width: 1400px;
    margin: 20px auto;
    padding: 20px 24px;
    border: 2px solid #e5e7eb;
    border-radius: 0;
    background: #ffffff;
}

.filtry-nadpis {
    margin-bottom: 18px;
    font-size: 1.4rem;
    color: #002b40;
    font-weight: bold;
    text-align: center;
}

/* GRID – základní mobilní layout: 1 sloupec */
.filtry-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 26px;
}

/* BLOK FILTRU */
.filtr-blok h3 {
    margin-bottom: 8px;
    font-size: 1.15rem;
    font-weight: 600;
    color: #002b40;
}

.filtr-options label {
    display: block;
    margin: 4px 0;
    cursor: pointer;
}

/* Checkboxy a radio – sjednocený vzhled */
.filtr-options input[type="checkbox"],
.filtr-blok input[type="checkbox"],
.filtr-blok input[type="radio"] {
    margin-right: 6px;
    transform: scale(1.1);
}

/* Sekce Vlastní text */
.vlastni-text-label {
    margin-top: 10px;
    display: block;
    cursor: pointer;
}

/* Tlačítko RESET */
.reset-btn {
    margin-top: 16px;
    padding: 10px 18px;
    background: #c30000;
    color: #fff;
    font-weight: bold;
    border-radius: 0;
    border: none;
    cursor: pointer;
    width: 100%;
}

.reset-btn:hover {
    background: #a50000;
}
.vlastni-text-nadpis {
    margin-top: 18px;
    margin-bottom: 8px;
    font-size: 1.10rem;
    font-weight: 600;
    color: #002b40;
}

.vlastni-text-label {
    display: block;
    cursor: pointer;
    margin-bottom: 6px;
}
/* Radio buttony v sekci ŘAZENÍ – každý na vlastní řádek */
.filtr-blok h3 + label,  
.filtr-blok h3 + label + label {
    display: block;
    margin-bottom: 6px;
}


/* ==========================================================================
   RESPONSIVITA
   — Kompaktní layout na mobilech
   — 2 sloupce na tabletu
   — 4 sloupce na desktopu
========================================================================== */

/* 600 px – 2 sloupce */
@media (min-width: 600px) {
    .filtry-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px 40px;
    }
}

/* 992 px – 4 sloupce */
@media (min-width: 992px) {
    .filtry-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 24px 50px;
    }
}

/* Hláška při 0 výsledcích */
.zadne-produkty {
    max-width: 1400px;
    margin: 20px auto;
    padding: 15px 20px;
    background: #fff5f5;
    border-left: 5px solid #c30000;
    font-size: 1.15rem;
    color: #b91c1c;
    border-radius: 0;
}


/*____________________________________________________________________________________________produkty_??.php
/* =====================================*/
/* =====================================*/
/* =====================================================================================
   DETAIL PRODUKTU – NÁRAMEK / PŘÍVĚSEK
   - max šířka 1400 px
   - galerie vlevo, info vpravo
   - hlavní obrázek + miniatury pod ním
   - popis produktu POD layoutem (pod obrázky)
===================================================================================== */

.product-detail {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px 0;
}

/* Layout – dva sloupce, mobilně pod sebou */
.product-detail-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}

/* ---------------------------------------------
   GALERIE
--------------------------------------------- */
.product-gallery {
    flex: 1 1 420px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* hlavní obrázek */
.product-gallery-main {
    width: 100%;
}

.product-gallery-img-wrapper {
    border: none;
    padding: 0;
    margin: 0;
    background: transparent;
    cursor: pointer;
    text-align: left;
    width: 100%;
}

/* ⭐ NOVÉ: pevný poměr stran 3:4 + contain */
.product-gallery-img-main {
    width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: contain;
    border-radius: 0;
    border: 2px solid #e5e7eb;
    background: #ffffff;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.product-gallery-img-main:hover {
    box-shadow: none;
}

/* miniatury pod hlavním obrázkem */
.product-gallery-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.product-gallery-thumb-wrapper {
    border: none;
    padding: 0;
    margin: 0;
    background: transparent;
    cursor: pointer;
}

/* ⭐ NOVÉ: miniatury také 3:4 + contain */
.product-gallery-thumb {
    width: 80px;
    height: auto;
    aspect-ratio: 3 / 4;
    object-fit: contain;
    border-radius: 0;
    border: 2px solid #e5e7eb;
    background: #ffffff;
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.product-gallery-thumb:hover {
    box-shadow: none;
    opacity: 0.95;
}

/* fallback pokud nejsou obrázky */
.product-no-image {
    padding: 40px 20px;
    border: 2px dashed #e5e7eb;
    border-radius: 0;
    text-align: center;
    color: #002b40;
    font-weight: 600;
}

/* ---------------------------------------------
   PRAVÝ SLOUPEC – INFO
--------------------------------------------- */
.product-main-info {
    flex: 1 1 420px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.product-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: #000;
}

/* sklad + cena */
.product-stock-price {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 30px;
    align-items: center;
}

/* skladem */
.product-stock-label {
    font-size: 1rem;
    padding: 6px 16px;
    border-radius: 0;
    font-weight: 600;
}

.product-stock-yes {
    background: #f0fdf4;
    color: #166534;
    border: 2px solid #e5e7eb;
}

.product-stock-no {
    background: #fff5f5;
    color: #b91c1c;
    border: 2px solid #e5e7eb;
}

/* cena */
.product-price {
    font-size: 1.7rem;
    font-weight: 700;
    color: #c30000;
}

/* ---------------------------------------------
   CUSTOM TEXT
--------------------------------------------- */
.product-custom-text-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    font-size: 1rem;
    color: #000;
}

.product-custom-text-input {
    padding: 8px 12px;
    border-radius: 0;
    border: 2px solid #d1d5db;
    font-size: 1rem;
    text-align: center;
    width: 300px;
    max-width: 100%;
}

.product-custom-text-input:focus {
    outline: none;
    border-color: #d1d5db;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
}

.product-custom-text-input-ok {
    border-color: #166534 !important;
}

.product-custom-text-counter {
    font-size: 0.9rem;
    color: #555;
}
/* ---------------------------------------------
   KOŠÍK
--------------------------------------------- */
.product-add-to-cart {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.product-add-to-cart-btn {
    padding: 12px 28px;
    font-size: 1.1rem;
    font-weight: 700;
    border: none;
    border-radius: 0;
    cursor: pointer;
    background-color: #c30000;
    color: #fff;
    transition: all 0.2s ease;
}

.product-add-to-cart-btn:hover:not(:disabled) {
    background-color: #a50000;
}

.product-add-to-cart-btn:active:not(:disabled) {
}

.product-add-to-cart-btn:disabled {
    background: #aaa;
    cursor: not-allowed;
}

/* hlášky */
.product-message {
    font-size: 1rem;
    min-height: 1.2em;
}

.product-message-success {
    color: #166534;
    font-weight: 600;
}

.product-message-error {
    color: #b91c1c;
    font-weight: 600;
}

/* ---------------------------------------------
   POPIS PRODUKTU – POD LAYOUTEM
--------------------------------------------- */
.product-description {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 2px solid #e5e7eb;
    font-size: 1.3rem;
    line-height: 1.55;
}

/* ---------------------------------------------
   NOT FOUND
--------------------------------------------- */
.product-detail-not-found {
    text-align: center;
    padding: 40px 20px;
    border: 2px solid #e5e7eb;
    border-radius: 0;
    margin: 40px auto;
    max-width: 900px;
    background: #fff5f5;
}

/* =====================================================================================
   FULLSCREEN LIGHTBOX – vlastní galerie
===================================================================================== */

.product-lightbox {
    position: fixed;
    inset: 0;
    display: none;
    z-index: 9999;
    font-family: inherit;
}

.product-lightbox.is-visible {
    display: block;
}

.product-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.8);
}

.product-lightbox-inner {
    position: relative;
    inset: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.product-lightbox-image-wrapper {
    max-width: 90vw;
    max-height: 90vh;
    pointer-events: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

/* ⭐ NOVÉ: zobrazit obrázek celý, ne oříznutý */
.product-lightbox-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 0;
    box-shadow: none;
    background: #ffffff;
}

.product-lightbox-counter {
    color: #fff;
    font-size: 0.95rem;
}

/* šipky */
.product-lightbox-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: auto;
    border: none;
    background: rgba(0,0,0,0.4);
    color: #fff;
    width: 44px;
    height: 44px;
    border-radius: 0;
    cursor: pointer;
    font-size: 1.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-lightbox-prev {
    left: 20px;
}

.product-lightbox-next {
    right: 20px;
}

.product-lightbox-arrow:hover {
    background: rgba(0,0,0,0.6);
}

/* zavírací křížek */
.product-lightbox-close {
    position: absolute;
    top: 16px;
    right: 16px;
    border: none;
    background: rgba(0,0,0,0.6);
    color: #fff;
    width: 36px;
    height: 36px;
    border-radius: 0;
    font-size: 1.6rem;
    cursor: pointer;
    pointer-events: auto;
}

.product-lightbox-close:hover {
    background: rgba(0,0,0,0.8);
}

/* =====================================================================================
   RESPONSIVITA
===================================================================================== */

@media (min-width: 600px) {
    .product-title {
        font-size: 1.9rem;
    }
}

@media (min-width: 768px) {
    .product-detail {
        padding: 30px 0;
    }
    .product-title {
        font-size: 2rem;
    }
    .product-price {
        font-size: 1.9rem;
    }
}

@media (min-width: 992px) {
    .product-gallery-img-main {
        max-height: 520px;
    }
}

@media (min-width: 1200px) {
    .product-title {
        font-size: 2.2rem;
    }
    .product-price {
        font-size: 2.1rem;
    }
}

@media (min-width: 1400px) {
    .product-gallery-img-main {
        max-height: 600px;
    }
}


/* ============================================================================
   FOOTER – Styl ÚčaÚče.cz (max-width 1400 px, centrovaný)
   Sticky chování – drží se dole, pokud je obsah krátký
============================================================================ */

/* Sticky layout – aplikujeme na html, body a hlavní wrapper */
html, body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
}

/* hlavní část se roztáhne, footer zůstane dole */
main {
    flex: 1 0 auto;
}

footer {
    flex-shrink: 0;
    margin-top: 20px;
}

/* -----------------------------------------------------------
   FOOTER – vizuál
----------------------------------------------------------- */
.footer {
    width: 100%;
    background: #f5f5f7;
    border-top: 2px solid #e5e7eb;
    padding: 20px 0 30px 0;
    position: relative;
    z-index: 10;
}

/* centrovaný wrapper */
.footer-container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    text-align: center;
    padding: 0 12px;
}

/* ODKAZY */
.footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 18px;
    margin-bottom: 22px;
}

.footer-links a {
    font-size: 1.05rem;
    text-decoration: none;
    color: #000000;
    font-weight: 600;
    transition: color 0.15s ease-in-out;
}

.footer-links a:hover {
    color: #c30000;
}

/* COPYRIGHT */
.footer-copy {
    font-size: 1rem;
    color: #313131;
    font-weight: 600;
}

/* -----------------------------------------------------------
   RESPONSIVITA
----------------------------------------------------------- */

/* 600 px – jemné zvětšení textu */
@media (min-width: 600px) {
    .footer-links a {
        font-size: 1.1rem;
    }
}

/* 992 px – větší desktop */
@media (min-width: 992px) {
    .footer {
        padding: 24px 0 34px 0;
    }
    .footer-links {
        gap: 26px;
    }
    .footer-copy {
        font-size: 1.1rem;
    }
}

/* 1200 px – velké monitory */
@media (min-width: 1200px) {
    .footer-links a {
        font-size: 1.15rem;
    }
}







/* ========================================================================
   Doporučení – kartičky k náramku
======================================================================== */

.doporuceni-box {
    width: 100%;
    max-width: 1400px;
    margin: 30px auto 10px auto;
    padding: 20px 24px;
    border: 2px solid #e5e7eb;
    border-radius: 0;
    background: #ffffff;
}

.doporuceni-wrapper {
    display: flex;
    align-items: center;
    gap: 30px; /* ⭐ zvětšeno z 20px kvůli většímu obrázku */
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
}

.doporuceni-img {
    width: 400px;  /* ⭐ mnohem větší obrázek */
    height: auto;
    border-radius: 0; /* ⭐ odstraněný radius */
    border: none;     /* ⭐ odstraněný border */
    background: transparent; /* ⭐ odstraněné pozadí */
}

.doporuceni-text {
    font-size: 1.2rem;
    font-weight: 600;
    color: #002b40;
}

.doporuceni-btn {
    display: inline-block;
    padding: 12px 26px;
    background: #c30000;
    color: #ffffff;
    border-radius: 0;
    font-size: 1.1rem;
    font-weight: 700;
    text-decoration: none;
    transition: 0.18s ease-in-out;
}

.doporuceni-btn:hover {
    background: #a50000;
}

/* mobilní úpravy */
@media (max-width: 600px) {
    .doporuceni-img {
        width: 160px; /* ⭐ větší než původních 100px */
    }
    .doporuceni-text {
        font-size: 1.05rem;
    }
}














/* ===================================================================
   MODAL – Doporučení kartičky
=================================================================== */

.modal-karticky-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.55); /* průhledné šedé pozadí */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

/* Samotný box */
.modal-karticky-box {
    background: #ffffff;
    padding: 28px;
    max-width: 420px;
    width: 90%;
    text-align: center;
    border-radius: 0;
    box-shadow: none;
}

/* Obrázek – větší tak, aby byl dominantní */
.modal-karticky-img {
    width: 100%;
    max-width: 340px;
    height: auto;
    margin-bottom: 18px;
}

/* Text */
.modal-karticky-text {
    font-size: 1.25rem;
    font-weight: 700;
    color: #002b40;
    margin-bottom: 22px;
}

/* Tlačítka */
.modal-karticky-buttons {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.modal-karticky-btn {
    padding: 12px 22px;
    border-radius: 0;
    font-size: 1.05rem;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: 0.15s ease-in-out;
}

.modal-karticky-btn-close {
    background: #bbbbbb;
    color: #000;
}

.modal-karticky-btn-close:hover {
    background: #a5a5a5;
}

.modal-karticky-btn-go {
    background: #c30000;
    color: #fff;
}

.modal-karticky-btn-go:hover {
    background: #a50000;
}
/* ============================================================
   KOŠÍK – NOVÝ MODERNÍ CSS STYL (Úplně od nuly)
   Layout: obrázek vlevo (desktop), obrázek nahoře uprostřed (mobil)
   Autor: ChatGPT – úprava podle přesných požadavků
============================================================ */

/* ---------- ZÁKLADNÍ KONTEJNERY ---------- */

.cart-page {
    margin: 20px auto;
    width: 100%;
}

.cart-box {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    background: #ffffff;
    border: 2px solid #e5e7eb;
    border-radius: 0;
}

.cart-title {
    font-size: 2rem;
    font-weight: 700;
    color: #000000;
    text-align: center;
    margin-bottom: 24px;
}

/* ---------- SEZNAM POLOŽEK ---------- */

.cart-items-wrapper {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-bottom: 24px;
}

.cart-empty {
    padding: 18px;
    background: #fff5f5;
    border: 2px solid #e5e7eb;
    border-radius: 0;
    text-align: center;
    font-size: 1.1rem;
}

/* ---------- KARTA JEDNÉ POLOŽKY ---------- */

.cart-item {
    display: flex;
    flex-direction: row;
    gap: 20px;
    padding: 18px;
    background: #ffffff;
    border: 2px solid #e5e7eb;
    border-radius: 0;
    transition: none;
}

.cart-item:hover {
}

.cart-item-left {
    flex: 0 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cart-item-thumb {
    max-width: 150px;
    width: 100%;
    height: auto;
    border-radius: 0;
    border: 2px solid #e5e7eb;
    background: #ffffff;
    display: block;
}

/* Textová část */
.cart-item-right {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cart-item-number {
    color: #4a4a4a;
    font-size: 0.95rem;
}

.cart-item-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #000;
}

.cart-item-text {
    font-size: 1rem;
    color: #374151;
}

/* ---------- PRAVÁ KONTROLNÍ ČÁST (cena, +/-, odebrat) ---------- */

.cart-item-controls {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.cart-item-price {
    font-size: 1.1rem;
    font-weight: 700;
    color: #c30000;
}

.cart-item-qty {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cart-btn-minus,
.cart-btn-plus {
    width: 34px;
    height: 34px;
    border-radius: 0;
    border: 2px solid #e5e7eb;
    background: #ffffff;
    color: #000000;
    font-size: 1.2rem;
    font-weight: bold;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    display: flex;
    transition: none;
}

.cart-btn-plus[disabled] {
    opacity: 0.5;
    cursor: not-allowed;
}

.cart-btn-minus:hover,
.cart-btn-plus:hover {
    background: #f5f5f7;
    color: #000000;
}

.cart-qty-number {
    min-width: 24px;
    text-align: center;
    font-size: 1.1rem;
    font-weight: 600;
}

.cart-item-subtotal {
    font-size: 1rem;
}

.cart-item-subtotal-value {
    font-weight: 700;
}

/* Odebrat */
.cart-btn-remove {
    padding: 6px 14px;
    border-radius: 0;
    border: 2px solid #e5e7eb;
    background: #ffffff;
    color: #b91c1c;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    transition: none;
}

.cart-btn-remove:hover {
    background: #fff5f5;
    color: #b91c1c;
}

/* ---------- SOUHRN ---------- */

.cart-summary {
    border-top: 2px solid #e5e7eb;
    margin-top: 16px;
    padding-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cart-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.cart-summary-label {
    font-weight: 600;
}

.cart-summary-value {
    font-weight: 700;
}

.cart-summary-total .cart-summary-value {
    color: #c30000;
    font-size: 1.3rem;
}

/* ---------- POZNÁMKY ---------- */

.cart-note-form {
    max-width: 1400px;
    margin: 20px auto;
}

.cart-note-label {
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: 6px;
}

.cart-note-textarea {
    width: 100%;
    padding: 12px;
    border: 2px solid #d1d5db;
    border-radius: 0;
    font-size: 1rem;
    resize: vertical;
}

.cart-note-textarea:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(0,0,0,0.1);
}

.cart-note-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 12px;
}

.cart-btn-secondary,
.cart-btn-primary {
    padding: 10px 22px;
    border-radius: 0;
    font-size: 1rem;
    text-decoration: none;
    font-weight: 700;
    cursor: pointer;
}

.cart-btn-secondary {
    border: 2px solid #e5e7eb;
    color: #000000;
}

.cart-btn-secondary:hover {
    background: #f5f5f7;
    color: #000000;
}

.cart-btn-primary {
    background: #c30000;
    color: #ffffff;
    border: none;
}

.cart-btn-primary:hover {
    background: #a50000;
}

/* ---------- GLOBÁLNÍ HLÁŠKA ---------- */

.cart-global-message {
    display:none;
    max-width: 1400px;
    margin: 10px auto;
    min-height: 20px;
}

.cart-global-message-error {
    display:none;
    color: #b91c1c;
}

.cart-global-message-ok {
    display:none;
    color: #166534;
}

/* ============================================================
   RESPONSIVITA – MOBIL
   Obrázek se přesune nahoru doprostřed
============================================================ */

@media (max-width: 768px) {

    .cart-item {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .cart-item-left {
        order: 1;
    }

    .cart-item-thumb {
        max-width: 180px;
    }

    .cart-item-right {
        order: 2;
        align-items: center;
        text-align: center;
    }

    .cart-item-controls {
        order: 3;
        align-items: center;
    }

    .cart-summary-row {
        flex-direction: column;
        gap: 6px;
        text-align: center;
    }

    .cart-note-actions {
        justify-content: center;
    }
}



/* ===================================================================
   UPOZORNĚNÍ POD POLOŽKAMI V KOŠÍKU
=================================================================== */

.cart-legal-warning {
    margin: 15px 0 20px 0;
    padding: 12px 18px;
    border-left: 2px solid #b91c1c;
    background: #fff5f5;
    border-radius: 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #000;
}

.cart-legal-warning strong {
    color: #b91c1c;
    font-weight: 700;
}





/* ========================================================================
   KOŠÍK – KROK 2 (kosik_2.php)
   Namespace: .checkout-step2
   Styl: sjednocený s ÚčaÚče.cz
   Mobile-first, bez kolizí
======================================================================== */

/* =====================================================
   ROOT
===================================================== */

.checkout-step2 {
    max-width: 1400px;
    margin: 0 auto;
    padding: 10px 0 30px 0;
}

/* =====================================================
   NADPIS
===================================================== */

.checkout-step2 .checkout-title {
    text-align: center;
    font-size: 1.8rem;
    font-weight: 700;
    color: #000000;
    margin: 20px 0 26px 0;
}

/* =====================================================
   BOX
===================================================== */

.checkout-step2 .checkout-box {
    border: 2px solid #e5e7eb;
    border-radius: 0;
    padding: 20px 18px;
    margin-bottom: 22px;
    background: #ffffff;
}

.checkout-step2 .checkout-box h2 {
    font-size: 1.4rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 18px;
}

/* =====================================================
   HINT
===================================================== */

.checkout-step2 .checkout-hint {
    margin-top: 12px;
    font-size: 0.95rem;
    color: #333;
}

/* =====================================================
   FORM GRID – KONTAKT
===================================================== */

.checkout-step2 .form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.checkout-step2 .form-grid label {
    display: flex;
    flex-direction: column;
    font-weight: 600;
    font-size: 1rem;
}

.checkout-step2 input[type="text"],
.checkout-step2 input[type="email"],
.checkout-step2 input[type="tel"] {
    margin-top: 6px;
    padding: 10px 12px;
    border-radius: 0;
    border: 2px solid #d1d5db;
    font-size: 1rem;
}

.checkout-step2 input:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(0,0,0,0.1);
}

/* =====================================================
   VALIDACE
===================================================== */
/* (logika je řízena výhradně třídou .is-invalid z JS) */



/* =====================================================
   DOPRAVA – LIST
===================================================== */

.checkout-step2 .delivery-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.checkout-step2 .delivery-item {
    border: 2px solid #e5e7eb;
    border-radius: 0;
    padding: 14px 14px;
    background: #ffffff;
}

/* =====================================================
   RADIO ŘÁDEK
===================================================== */

.checkout-step2 .delivery-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: center;
    cursor: pointer;
}

.checkout-step2 .delivery-row input[type="radio"] {
    transform: scale(1.15);
}

.checkout-step2 .delivery-name {
    font-weight: 700;
    font-size: 1.05rem;
}

.checkout-step2 .delivery-price {
    font-weight: 700;
    color: #c30000;
    text-align: right;
    white-space: nowrap;
}

.checkout-step2 .delivery-free-note {
    display: block;
    font-size: 0.85rem;
    color: #166534;
    font-weight: 600;
}

/* =====================================================
   DETAIL POD DOPRAVOU
===================================================== */

.checkout-step2 .delivery-detail {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed #e5e7eb;
}

/* =====================================================
   VÝDEJNÍ MÍSTO
===================================================== */

.checkout-step2 .pickup-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.checkout-step2 .pickup-label {
    font-weight: 700;
}

.checkout-step2 .pickup-input {
    padding: 10px 12px;
    border-radius: 0;
    border: 2px solid #d1d5db;
    font-size: 1rem;
    background: #ffffff;
    cursor: pointer;
}

.checkout-step2 .pickup-input:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(0,0,0,0.1);
}

/* =====================================================
   ADRESA
===================================================== */

.checkout-step2 .address-box {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.checkout-step2 .address-box label {
    display: flex;
    flex-direction: column;
    font-weight: 600;
}

/* =====================================================
   SOUHLASY
===================================================== */

.checkout-step2 .checkbox-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: start;
    margin-bottom: 10px;
    font-weight: 600;
}

.checkout-step2 .checkbox-row input {
    transform: scale(1.1);
    margin-top: 2px;
}

.checkout-step2 .checkbox-row a {
    color: #000;
    text-decoration: underline;
}

.checkout-step2 .checkbox-row a:hover {
    color: #c30000;
}

/* =====================================================
   NAVIGACE
===================================================== */

.checkout-step2 .cart-note-actions {
    display: flex;
    justify-content: space-between;
    gap: 12px;
   //* margin-top: 30px; xx1 */
}

/* =====================================================
   OVERLAY (WIDGETY)
===================================================== */

#overlay_balikovna,
#overlay_zasilkovna {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

#overlay_balikovna[hidden],
#overlay_zasilkovna[hidden] {
    display: none !important;
}

.overlay-inner {
    width: 95%;
    height: 95%;
    background: #ffffff;
    border-radius: 0;
    overflow: hidden;
    position: relative;
}

.overlay-inner iframe,
#packeta-widget-container {
    width: 100%;
    height: 100%;
}

.overlay-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 42px;
    height: 42px;
    border-radius: 0;
    border: none;
    background: rgba(0,0,0,0.6);
    color: #ffffff;
    font-size: 26px;
    cursor: pointer;
}

/* =====================================================
   RESPONSIVITA
===================================================== */

@media (min-width: 600px) {
    .checkout-step2 .form-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 768px) {
    .checkout-step2 .checkout-title {
        font-size: 2rem;
    }
}

@media (min-width: 992px) {
    .checkout-step2 .delivery-row {
        grid-template-columns: auto 1fr auto;
    }
}
/* =========================================================
   VALIDACE – KOŠÍK KROK 2
   Aktivuje se POUZE přidáním třídy .is-invalid (JS)
========================================================= */

.checkout-step2 input.is-invalid {
    border: 2px solid #e5e7eb;
    background-color: #fff5f5;
}

.checkout-step2 input.is-invalid:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(0,0,0,0.1);
}

.checkout-step2 .field-error {
    display: block;
    margin-top: 4px;
    font-size: 13px;
    color: #b91c1c;
}

.checkout-step2 .field-error:empty {
    display: none;
}

.checkout-step2 input[type="checkbox"].is-invalid,
.checkout-step2 input[type="radio"].is-invalid {
    box-shadow: 0 0 0 2px rgba(0,0,0,0.1);
    border-radius: 0;
}

.checkout-step2 .checkbox-row.is-invalid {
    color: #b91c1c;
}

.checkout-step2 .delivery-item.is-invalid {
    border-color: #e5e7eb;
    background: #fff5f5;
}

/* =========================================
   ADRESA – OMEZENÍ ŠÍŘKY NA DESKTOPU
========================================= */

@media (min-width: 900px) {
    .checkout-step2 .address-box {
        max-width: 40%;
    }
}










/* =========================================================
   SOUHLASY – STABILNÍ LAYOUT (BEZ ZÁSAHU DO WIDGETŮ)
========================================================= */

#boxSouhlasy .checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    line-height: 1.45;
}

/* checkbox fixní velikost */
#boxSouhlasy input[type="checkbox"] {
    flex-shrink: 0;
    margin-top: 3px;
}

/* celý text jako jeden blok */
#boxSouhlasy .checkbox-row span,
#boxSouhlasy .checkbox-row a {
    display: inline;
}


/* =====================================================
   INFO O PLATBĚ – KOŠÍK KROK 2
===================================================== */

#boxPlatbaInfo .payment-info-text {
    font-size: 1.05rem;
    line-height: 1.5;
    color: #000000;
}

#boxPlatbaInfo .payment-info-text p {
    margin-bottom: 10px;
}

#boxPlatbaInfo .payment-info-text p:last-child {
    margin-bottom: 0;
}


#boxSouhlasy .checkbox-row span {
    display: inline;
}


/* =====================================================
   PLATBA – INFO BOX (sjednocení vzhledu s checkout-box)
===================================================== */

#boxPlatbaInfo .payment-info-text{
    margin-top: 2px;
    font-size: 1.2rem;
    line-height: 1.5;
    color: #000;
}

/* pokud bys místo divu použil <p>, tak ať odstavce nerozhodí spacing */
#boxPlatbaInfo p{
    margin: 0;
}

/* nezalamovat vybraná slova */
#boxPlatbaInfo .nowrap{
    white-space: nowrap;
}


/* =========================================
   KOŠÍK 3 – DORUČENÍ A KONTAKT
   STEJNÝ VZHLED JAKO CHECKOUT-BOX (košík 1 / 2)
========================================= */

/* HLAVNÍ BOX – identický jako ostatní checkout-box */
.checkout-box {
    border: 2px solid #e5e7eb;
    border-radius: 0;
    padding: 22px 24px;
    background: #ffffff;
    margin-top: 24px;
}

/* H2 – STEJNÁ VELIKOST JAKO V KOŠÍKU 1/2 */
.checkout-box > h2 {
    margin: 0 0 16px 0;
    font-size: 1.3rem;
    font-weight: 700;
}

/* VNITŘNÍ SEKCE (doprava / kontakt) */
.checkout-summary-section {
    padding: 0;
}

/* H3 – PODNADPISY (Způsob dopravy, Kontaktní údaje) */
.checkout-summary-title {
    margin: 0 0 6px 0;
    font-size: 1.05rem;
    font-weight: 600;
}

/* TEXTOVÝ OBSAH – ZÁKLAD STRÁNKY */
.checkout-summary-value {
    font-size: 1rem;
    line-height: 1.5;
    color: #000;
}

/* jednotlivé řádky (jméno, email, telefon, adresa) */
.checkout-summary-value div {
    margin-bottom: 4px;
}

/* zvýraznění jména */
.checkout-summary-value strong {
    font-weight: 700;
}

/* oddělovací čára – stejná jako jinde */
.checkout-summary-divider {
    margin: 18px 0;
    border: none;
    border-top: 1px solid #e5e7eb;
}



/* =========================================
   KOŠÍK 3 – TLAČÍTKA DOLE
   Zpět vlevo | Odeslat objednávku vpravo
========================================= */

.cart-note-actions-split {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 28px;
}














/* =====================================================
   OBJEDNÁVKA – DETAIL OBJEDNÁVKY + PLATBA + QR
   Styl: ÚčaÚče.cz (sjednoceno s košíkem / checkoutem)
===================================================== */

.objednavka-page {
    width: 100%;
    margin: 20px auto;
}

.objednavka-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    background: #ffffff;
    border: 2px solid #e5e7eb;
    border-radius: 0;
}

/* =====================================================
   NADPIS
===================================================== */

.objednavka-container h1 {
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 14px;
}

/* =====================================================
   STAV OBJEDNÁVKY
===================================================== */

.objednavka-status {
    text-align: center;
    font-size: 1.05rem;
    font-weight: 600;
    color: #000;
    margin-bottom: 26px;
}

.objednavka-status strong {
    color: #c30000;
}

/* =====================================================
   BLOKY
===================================================== */

.objednavka-block {
    border-top: 2px solid #e5e7eb;
    padding-top: 20px;
    margin-top: 20px;
}

.objednavka-block h2 {
    font-size: 1.4rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 12px;
}

/* =====================================================
   PLATEBNÍ ÚDAJE
===================================================== */

.objednavka-payment-info p {
    display: flex;
    gap: 10px;
    font-size: 1.05rem;
    margin-bottom: 8px;
    color: #000;
}

.objednavka-payment-info strong {
    min-width: 200px;
    font-weight: 700;
}

/* =====================================================
   QR KÓD
===================================================== */

.objednavka-qr-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 18px;
}

.objednavka-qrcode {
    width: 256px;
    height: 256px;
    border: 2px solid #e5e7eb;
    border-radius: 0;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* =====================================================
   PATIČKA
===================================================== */

.objednavka-footer {
    margin-top: 26px;
    padding-top: 16px;
    border-top: 1px solid #e5e7eb;
    text-align: center;
    font-size: 1rem;
    font-weight: 600;
    color: #000000;
}

/* =====================================================
   RESPONSIVITA
===================================================== */

@media (max-width: 768px) {

    .objednavka-container {
        padding: 20px 16px;
    }

    .objednavka-payment-info p {
        flex-direction: column;
        gap: 2px;
    }

    .objednavka-qrcode {
        width: 220px;
        height: 220px;
    }

    .objednavka-container h1 {
        font-size: 1.7rem;
    }
}





/* LEGAL PAGE (Obchodní podmínky / GDPR / Reklamace) */
.legal-page{
  max-width: 1100px;
  margin: 0 auto;
  padding: 18px;
}

.legal-title{
  margin: 8px 0 14px 0;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: .2px;
}

.legal-card{
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 0;
  padding: 18px;
}

.legal-card h2{
  margin: 18px 0 10px 0;
  font-size: 18px;
  font-weight: 900;
}

.legal-card p{
  margin: 8px 0;
  line-height: 1.65;
}

.legal-card ul,
.legal-card ol{
  margin: 8px 0 8px 18px;
  padding: 0;
}

.legal-card li{
  margin: 6px 0;
  line-height: 1.6;
}

.legal-card hr{
  border: 0;
  height: 1px;
  background: #e5e7eb;
  margin: 16px 0;
}

/* a), b), c), d) list style, ale BEZ změny textu */
.legal-ol-alpha{
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

.legal-ol-alpha li{
  padding-left: 0;
}

.legal-download {
    margin: 10px 0 20px 0;
    font-weight: 600;
    text-align: left;
}

.legal-download a {
    color: #b30000;
    text-decoration: underline;
    font-weight: 700;
}

.legal-download a:hover {
    text-decoration: none;
}