/* Souhlas s cookies - lišta a podrobné nastavení
   Vzhled vychází z UI webu: #00001C, #001E7B, #004282, #7FA0BF, #F6F6F6 */

/* Prvky jsou skryté, dokud je nezobrazí skript (bez JS se nenastavují žádné volitelné cookies) */
.cookies-bar { display: none;}
.cookies-modal { display: none;}
html.cookies-modal-open { overflow: hidden;}
html.cookies-modal-open body { overflow: hidden;}

/* ---------- Lišta ---------- */
.cookies-bar.is-visible { width: 100%; height: auto; position: fixed; left: 0; bottom: 0; z-index: 9000; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; border-top: 2px dotted rgba(246,246,246,.25); background: #00001C; box-shadow: 0 -10px 40px -10px rgba(0,0,28,.8); animation: cookies-bar-in .5s ease-in-out both;}

.cookies-bar-inner { width: 1200px; max-width: calc(100% - 80px); height: auto; padding: 30px 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;}

.cookies-bar-text { width: 620px; max-width: 100%; height: auto; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start;}
.cookies-bar-text h2 { width: 100%; margin: 0 0 10px 0; font-size: 20px; font-family: 'SKODANext-BlackExpanded'; font-weight: 900; text-align: left; color: #F6F6F6;}
.cookies-bar-text p { width: 100%; margin: 0; font-size: 15px; line-height: 1.5; font-weight: 300; text-align: left; color: rgba(246,246,246,.8);}
.cookies-bar-text a { color: #7FA0BF; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 4px; text-decoration-color: rgba(127,160,191,.6);}
.cookies-bar-text a:hover { color: #F6F6F6; text-decoration-color: #F6F6F6;}

.cookies-bar-actions { width: 460px; max-width: 100%; height: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px;}

/* ---------- Tlačítka ---------- */
.cookies-btn { min-width: 150px; padding: 14px 26px; margin: 0; border: 2px solid transparent; border-radius: 999px; font-size: 13px; font-family: 'SKODANext-BlackExpanded'; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; text-align: center; cursor: pointer; transition: all .35s ease-in-out;}
.cookies-btn:focus-visible { outline: 2px solid #7FA0BF; outline-offset: 3px;}

/* Přijmout i odmítnout mají shodnou velikost i váhu - požadavek na rovnocennou volbu */
.cookies-btn-accept { border-color: #001E7B; background: #001E7B; color: #F6F6F6;}
.cookies-btn-accept:hover { border-color: #004282; background: #004282;}
.cookies-btn-reject { border-color: #F6F6F6; background: rgba(246,246,246,.1); color: #F6F6F6;}
.cookies-btn-reject:hover { background: rgba(246,246,246,.22);}
.cookies-btn-settings { min-width: auto; padding: 14px 10px; border-color: transparent; background: none; color: rgba(246,246,246,.8); text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 5px;}
.cookies-btn-settings:hover { color: #F6F6F6;}

@keyframes cookies-bar-in {
    from { opacity: 0; transform: translateY(100%);}
    to { opacity: 1; transform: none;}
}

/* ---------- Podrobné nastavení ---------- */
.cookies-modal.is-visible { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 9100; padding: 20px; box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; background: rgba(0,0,28,.8); animation: cookies-modal-in .35s ease-in-out both;}

.cookies-modal-box { width: 760px; max-width: 100%; max-height: 88vh; box-sizing: border-box; padding: 40px; border-radius: 20px; overflow-y: auto; background: #F6F6F6; box-shadow: 0 30px 80px -20px rgba(0,0,28,.9);}
.cookies-modal-box:focus { outline: none;}

.cookies-modal-head { width: 100%; padding: 0 0 20px 0; border-bottom: 2px dotted rgba(0,0,28,.25);}
.cookies-modal-head h2 { width: 100%; margin: 0 0 10px 0; font-size: 24px; font-family: 'SKODANext-BlackExpanded'; font-weight: 900; text-align: left; color: #00001C;}
.cookies-modal-head p { width: 100%; margin: 0; font-size: 15px; line-height: 1.5; font-weight: 300; text-align: left; color: #33334a;}
.cookies-modal-head a { color: #001E7B;}

.cookies-group { width: 100%; padding: 22px 0; border-bottom: 2px dotted rgba(0,0,28,.15); display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;}
.cookies-group-title { width: calc(100% - 80px); display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start;}
.cookies-group-title h3 { width: 100%; margin: 0 0 6px 0; font-size: 16px; font-family: 'SKODANext-BlackExpanded'; font-weight: 900; text-align: left; color: #00001C;}
.cookies-group-title p { width: 100%; margin: 0; font-size: 14px; line-height: 1.5; font-weight: 300; text-align: left; color: #3a3a52;}
.cookies-group-note { display: inline-block; margin: 0 0 6px 0; font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #004282;}

/* Přepínač */
.cookies-switch { width: 60px; height: 32px; position: relative; display: inline-block; flex: none;}
.cookies-switch input { width: 100%; height: 100%; position: absolute; top: 0; left: 0; margin: 0; opacity: 0; cursor: pointer;}
.cookies-switch-slider { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-radius: 999px; background: #c8c8d2; transition: background .35s ease-in-out; pointer-events: none;}
.cookies-switch-slider::before { content: ""; width: 24px; height: 24px; position: absolute; top: 4px; left: 4px; border-radius: 100%; background: #F6F6F6; box-shadow: 0 1px 3px rgba(0,0,28,.4); transition: transform .35s ease-in-out;}
.cookies-switch input:checked + .cookies-switch-slider { background: #001E7B;}
.cookies-switch input:checked + .cookies-switch-slider::before { transform: translateX(28px);}
.cookies-switch input:disabled + .cookies-switch-slider { background: #7FA0BF; cursor: not-allowed;}
.cookies-switch input:disabled { cursor: not-allowed;}
.cookies-switch input:focus-visible + .cookies-switch-slider { outline: 2px solid #004282; outline-offset: 3px;}

.cookies-modal-actions { width: 100%; padding: 25px 0 0 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 12px;}
.cookies-modal .cookies-btn-reject { border-color: #00001C; background: none; color: #00001C;}
.cookies-modal .cookies-btn-reject:hover { background: rgba(0,0,28,.08);}
.cookies-modal .cookies-btn-save { border-color: #00001C; background: #00001C; color: #F6F6F6;}
.cookies-modal .cookies-btn-save:hover { border-color: #004282; background: #004282;}

.cookies-modal-info { width: 100%; padding: 20px 0 0 0; margin: 20px 0 0 0; border-top: 2px dotted rgba(0,0,28,.15);}
.cookies-modal-info p { width: 100%; margin: 0; font-size: 12px; line-height: 1.6; font-weight: 300; text-align: left; color: #55556a;}
.cookies-modal-info a { color: #001E7B;}

@keyframes cookies-modal-in {
    from { opacity: 0;}
    to { opacity: 1;}
}

/* Odkaz na změnu souhlasu v patičce */
.cookies-settings-link { font-size: 15px; color: #F6F6F6; cursor: pointer; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 4px;}
.cookies-settings-link:hover { color: #7FA0BF;}

/* Tablety */
@media screen and (max-width: 1099px) {
    .cookies-bar-inner { max-width: calc(100% - 40px); padding: 25px 0;}
    .cookies-bar-text { width: 100%; margin: 0 0 20px 0;}
    .cookies-bar-actions { width: 100%; justify-content: flex-start;}
    .cookies-modal-box { padding: 30px;}
}

/* Mobil */
@media screen and (max-width: 600px) {
    .cookies-bar.is-visible { max-height: 85vh; overflow-y: auto;}
    .cookies-bar-text h2 { font-size: 18px;}
    .cookies-bar-text p { font-size: 14px;}
    .cookies-bar-actions { gap: 10px;}
    .cookies-btn { width: 100%; min-width: 0;}
    .cookies-btn-settings { width: 100%;}
    .cookies-modal.is-visible { padding: 10px;}
    .cookies-modal-box { padding: 25px 20px; max-height: 92vh; border-radius: 15px;}
    .cookies-modal-head h2 { font-size: 20px;}
    .cookies-group-title { width: calc(100% - 70px);}
    .cookies-modal-actions .cookies-btn { width: 100%;}
}

/* Omezení animací dle nastavení systému */
@media (prefers-reduced-motion: reduce) {
    .cookies-bar.is-visible, .cookies-modal.is-visible { animation: none;}
    .cookies-switch-slider, .cookies-switch-slider::before, .cookies-btn { transition: none;}
}
