/* TEZAK TRADE - lišta a nastavení cookies */
/* Vychází z designu webu: #2678B4 / #0a4c88 / #2a2a2a / #e6e6e6, ostré hrany, přechody 0.35s */

/* Základ, společný pro všechna rozhraní */
#cookies-lista, #cookies-okno, #cookies-zalozka { font-family: 'Source Sans Pro', sans-serif; font-weight: 300; box-sizing: border-box;}
#cookies-lista *, #cookies-okno *, #cookies-zalozka * { box-sizing: border-box;}

#cookies-lista { width: 100%; position: fixed; left: 0; bottom: 0; z-index: 9000; text-align: left; color: #e6e6e6; background: #2a2a2a; border-top: 1px solid #2678B4; box-shadow: 0 -10px 50px rgba(0,0,0,.5);}
#cookies-lista.cookies-skryto, #cookies-okno.cookies-skryto, #cookies-zalozka.cookies-skryto { display: none;}
#cookies-lista.cookies-prichod { animation: cookies-nabeh 0.35s ease-in-out;}

.cookies-lista-obsah { position: relative; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;}
.cookies-kvadrus { width: 80px; height: 5px; margin: 0 0 15px 0; background: #2678B4;}
.cookies-nadpis { color: #e6e6e6; margin: 0 0 10px 0; font-weight: 300;}
.cookies-nadpis span { font-weight: 900;}
.cookies-text { color: rgba(230,230,230,.75); margin: 0 0 0 0;}
.cookies-text a { color: #2678B4; text-decoration: underline; transition: all 0.35s ease-in-out;}
.cookies-text a:hover { color: #e6e6e6;}

/* Tlačítka - vychází ze stylu .bottom-tituls-text a .maps-button */
.cookies-tlacitka { display: flex; flex-wrap: wrap;}
.cookies-btn { display: block; text-align: center; font-weight: 900; text-decoration: none; border: 1px solid transparent; cursor: pointer; outline: none; transition: all 0.35s ease-in-out; font-family: 'Source Sans Pro', sans-serif;}
.cookies-btn-hlavni { color: #e6e6e6; background: #2678B4; border-color: #2678B4;}
.cookies-btn-hlavni:hover, .cookies-btn-hlavni:focus-visible { color: #e6e6e6; background: #0a4c88; border-color: #0a4c88;}
.cookies-btn-vedlejsi { color: #e6e6e6; background: transparent; border-color: rgba(230,230,230,.3); font-weight: 600;}
.cookies-btn-vedlejsi:hover, .cookies-btn-vedlejsi:focus-visible { color: #2678B4; background: rgba(38,120,180,.1); border-color: #2678B4;}
.cookies-btn-odkaz { color: rgba(230,230,230,.75); background: transparent; border: none; font-weight: 600; text-decoration: underline; padding: 0;}
.cookies-btn-odkaz:hover, .cookies-btn-odkaz:focus-visible { color: #2678B4;}
.cookies-btn:focus-visible, .cookies-prepinac input:focus-visible + .cookies-prepinac-drazka { outline: 2px solid #2678B4; outline-offset: 2px;}

/* Modální okno s podrobným nastavením */
#cookies-okno { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10100; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.85); animation: cookies-zeslabeni 0.35s ease-in-out;}
.cookies-okno-panel { position: relative; background: #2a2a2a; border-top: 5px solid #2678B4; box-shadow: 0 0 50px rgba(0,0,0,.75); overflow-y: auto; text-align: left; color: #e6e6e6; outline: none;}
.cookies-okno-zavrit { position: absolute; top: 0; right: 0; width: 50px; height: 50px; color: #e6e6e6; background: transparent; border: none; font-size: 20px; font-weight: 600; line-height: 50px; cursor: pointer; outline: none; transition: all 0.35s ease-in-out;}
.cookies-okno-zavrit:hover, .cookies-okno-zavrit:focus-visible { color: #2678B4; background: rgba(230,230,230,.05);}

/* Jednotlivé kategorie */
.cookies-sekce { border-bottom: 1px solid rgba(230,230,230,.15);}
.cookies-sekce:last-of-type { border-bottom: none;}
.cookies-sekce-hlava { display: flex; align-items: flex-start; justify-content: space-between;}
.cookies-sekce-nadpis { color: #e6e6e6; font-weight: 900; margin: 0 0 6px 0;}
.cookies-sekce-popis { color: rgba(230,230,230,.75); margin: 0 0 0 0;}
.cookies-sekce-sluzby { color: #2678B4; font-weight: 600; margin: 10px 0 0 0;}
.cookies-sekce-sluzby span { color: rgba(230,230,230,.5); font-weight: 300;}

/* Přepínač - hranatý, v duchu prvku .button-id */
.cookies-prepinac { position: relative; flex-shrink: 0;}
.cookies-prepinac input { position: absolute; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer;}
.cookies-prepinac-drazka { display: block; width: 62px; height: 28px; background: rgba(230,230,230,.15); border: 1px solid rgba(230,230,230,.3); transition: all 0.35s ease-in-out; pointer-events: none;}
.cookies-prepinac-drazka:after { content: ''; display: block; width: 20px; height: 20px; margin: 3px 0 0 3px; background: #e6e6e6; transition: all 0.35s ease-in-out;}
.cookies-prepinac input:checked + .cookies-prepinac-drazka { background: rgba(38,120,180,.25); border-color: #2678B4;}
.cookies-prepinac input:checked + .cookies-prepinac-drazka:after { margin: 3px 0 0 36px; background: #2678B4;}
.cookies-prepinac input:disabled { cursor: not-allowed;}
.cookies-prepinac input:disabled + .cookies-prepinac-drazka { background: rgba(10,76,136,.35); border-color: #0a4c88;}
.cookies-prepinac input:disabled + .cookies-prepinac-drazka:after { background: #0a4c88;}
.cookies-prepinac-popis { display: block; text-align: center; color: rgba(230,230,230,.5); font-weight: 600; margin: 5px 0 0 0;}

/* Vyvolání nastavení po uložení volby */
#cookies-zalozka { position: fixed; left: 0; bottom: 0; z-index: 8900; color: rgba(230,230,230,.75); background: #2a2a2a; border: 1px solid rgba(38,120,180,.5); border-left: none; border-bottom: none; font-weight: 600; text-decoration: none; cursor: pointer; outline: none; transition: all 0.35s ease-in-out;}
#cookies-zalozka:hover, #cookies-zalozka:focus-visible { color: #e6e6e6; background: #2678B4; border-color: #2678B4;}

/* Souhra s rozbalenou mobilní navigací - lišta ani záložka ji nesmí překrývat */
body:has(.menu-overlay.active) #cookies-lista,
body:has(.menu-overlay.active) #cookies-zalozka { display: none;}
/* Nad otevřeným nastavením nemá viset tlačítko navigace */
body.cookies-okno-otevreno .menu-button-target { visibility: hidden;}

/* Odkaz na nastavení v patičce webu */
.copyright a { color: rgba(230,230,230,.75); text-decoration: underline; font-weight: 300; transition: all 0.35s ease-in-out;}
.copyright a:hover { color: #2678B4;}

@keyframes cookies-nabeh {
    0% { opacity: 0; transform: translateY(100%);}
    100% { opacity: 1; transform: translateY(0);}
}
@keyframes cookies-zeslabeni {
    0% { opacity: 0;}
    100% { opacity: 1;}
}
@media (prefers-reduced-motion: reduce) {
    #cookies-lista.cookies-prichod, #cookies-okno { animation: none;}
}

/* Rozhraní pro notebook + PC */
@media screen and (min-width: 1100px) {
    .cookies-lista-obsah { width: 1100px; padding: 35px 0;}
    .cookies-lista-text { width: 700px;}
    .cookies-nadpis { font-size: 30px;}
    .cookies-text { font-size: 18px;}
    .cookies-tlacitka { width: 300px; flex-direction: column;}
    .cookies-btn { width: 300px; height: 44px; margin: 0 0 10px 0; padding: 0 15px; font-size: 17px; line-height: 42px;}
    .cookies-btn-odkaz { height: auto; line-height: normal; margin: 5px 0 0 0; font-size: 16px;}

    .cookies-okno-panel { width: 760px; max-height: 86vh; padding: 40px 50px;}
    .cookies-okno-hlava { margin: 0 0 25px 0; padding: 0 30px 0 0;}
    .cookies-okno-hlava .cookies-nadpis { font-size: 34px;}
    .cookies-okno-hlava .cookies-text { font-size: 18px;}
    .cookies-sekce { padding: 25px 0;}
    .cookies-sekce-nadpis { font-size: 22px;}
    .cookies-sekce-popis, .cookies-sekce-sluzby { font-size: 16px;}
    .cookies-sekce-text { width: calc(100% - 100px);}
    .cookies-prepinac-popis { font-size: 12px;}
    .cookies-okno-pata { margin: 30px 0 0 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
    .cookies-okno-pata .cookies-btn { width: 325px; margin: 0 0 10px 0;}

    #cookies-zalozka { padding: 8px 20px; font-size: 14px;}
}

/* Rozhraní pro tablety */
@media screen and (min-width: 768px) and (max-width: 1100px) {
    .cookies-lista-obsah { width: 100%; padding: 30px 20px;}
    .cookies-lista-text { width: calc(100% - 280px); padding: 0 20px 0 0;}
    .cookies-nadpis { font-size: 26px;}
    .cookies-text { font-size: 17px;}
    .cookies-tlacitka { width: 260px; flex-direction: column;}
    .cookies-btn { width: 260px; height: 42px; margin: 0 0 10px 0; padding: 0 15px; font-size: 16px; line-height: 40px;}
    .cookies-btn-odkaz { height: auto; line-height: normal; margin: 5px 0 0 0; font-size: 15px;}

    .cookies-okno-panel { width: calc(100% - 60px); max-height: 86vh; padding: 35px 40px;}
    .cookies-okno-hlava { margin: 0 0 20px 0; padding: 0 30px 0 0;}
    .cookies-okno-hlava .cookies-nadpis { font-size: 28px;}
    .cookies-okno-hlava .cookies-text { font-size: 17px;}
    .cookies-sekce { padding: 20px 0;}
    .cookies-sekce-nadpis { font-size: 20px;}
    .cookies-sekce-popis, .cookies-sekce-sluzby { font-size: 15px;}
    .cookies-sekce-text { width: calc(100% - 100px);}
    .cookies-prepinac-popis { font-size: 12px;}
    .cookies-okno-pata { margin: 25px 0 0 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
    .cookies-okno-pata .cookies-btn { width: calc(50% - 5px); margin: 0 0 10px 0;}

    #cookies-zalozka { padding: 8px 18px; font-size: 14px;}
}

/* Rozhraní pro smartphone */
@media screen and (max-width: 768px) {
    #cookies-lista { max-height: 90vh; overflow-y: auto;}
    .cookies-lista-obsah { width: 100%; padding: 25px 20px;}
    .cookies-lista-text { width: 100%; margin: 0 0 20px 0;}
    .cookies-kvadrus { width: 60px; height: 4px; margin: 0 0 12px 0;}
    .cookies-nadpis { font-size: 22px;}
    .cookies-text { font-size: 15px;}
    .cookies-tlacitka { width: 100%; flex-direction: column;}
    .cookies-btn { width: 100%; height: 44px; margin: 0 0 10px 0; padding: 0 15px; font-size: 16px; line-height: 42px;}
    .cookies-btn-odkaz { height: auto; line-height: normal; margin: 5px 0 0 0; font-size: 15px;}

    .cookies-okno-panel { width: 100%; height: 100%; max-height: 100%; padding: 30px 20px; border-top: 4px solid #2678B4;}
    .cookies-okno-hlava { margin: 0 0 15px 0; padding: 0 40px 0 0;}
    .cookies-okno-hlava .cookies-nadpis { font-size: 24px;}
    .cookies-okno-hlava .cookies-text { font-size: 15px;}
    .cookies-sekce { padding: 20px 0;}
    .cookies-sekce-hlava { flex-wrap: wrap;}
    .cookies-sekce-nadpis { font-size: 19px;}
    .cookies-sekce-popis, .cookies-sekce-sluzby { font-size: 15px;}
    .cookies-sekce-text { width: calc(100% - 80px);}
    .cookies-prepinac-popis { font-size: 11px;}
    .cookies-okno-pata { margin: 25px 0 0 0;}
    .cookies-okno-pata .cookies-btn { width: 100%;}

    #cookies-zalozka { padding: 7px 15px; font-size: 13px;}
}