/**
 * Hlavička EpicDecks: horní lišta + hlavní řádek v jednom lepicím obalu (.ed-masthead).
 * Výšku viditelné části zapisuje sticky-header.js do --ed-masthead-h (lepicí prvky a kotvy pod ní).
 */

/* Rezerva pro posuvník – stránky se mezi sebou neposouvají do strany. */
html {
    overflow-y: scroll;
    scrollbar-gutter: stable;
    scroll-padding-top: calc(var(--ed-masthead-h, 121px) + var(--wp-admin--admin-bar--height, 0px) + 8px);
}

/* Otevřené menu, košík, hledání: stránka pod nimi se neposouvá. Zámek je na <html> –
   overflow na <body> by z něj udělal posuvný kontejner a lepicí hlavička by poskočila. */
html.ed-scroll-lock { overflow: hidden; }

/* Obrys jen při ovládání klávesnicí (dřív se fokus mazal úplně – V6). */
:focus:not(:focus-visible) { outline: none; }
:focus-visible {
    outline: 2px solid var(--ed-brand, #3BC1F4);
    outline-offset: 2px;
}
a, button, summary { -webkit-tap-highlight-color: transparent; }

/* ── Obal ─────────────────────────────────────────────────────────────── */
/* top: 0 i s lištou správce – šablona Storefront dává body overflow-x: hidden, takže lepicí kontejner
   je body (pod okrajem html, který už lištu obsahuje); výška lišty navíc dělala pod ní 32px pruh. */
.ed-masthead {
    position: sticky;
    top: 0;
    z-index: var(--ed-z-header, 1000);
    transition: transform var(--ed-ease, .18s ease);
}

/* Místo pro lištu správce dělá jen okraj html (WordPress); některé pluginy pro přihlášené přidávají
   ještě odsazení body – tím vznikal druhý pruh stejné výšky jako lišta. */
html body.admin-bar.has-epicdecks-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ── Horní lišta ──────────────────────────────────────────────────────── */
.epicdecks-top-bar {
    width: 100%;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    font-size: 12px;
}

.epicdecks-top-bar__container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

.epicdecks-top-bar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 36px;
    gap: 16px;
}

.epicdecks-top-bar__nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 16px;
    min-width: 0;
}

.epicdecks-top-bar__nav a {
    color: #6b7280;
    text-decoration: none;
    transition: color 0.2s;
    font-weight: 500;
}

.epicdecks-top-bar__nav a:hover {
    color: #3BC1F4;
}

.epicdecks-top-bar__nav a.is-active {
    color: #111827;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: #3BC1F4;
    text-decoration-thickness: 2px;
}

.epicdecks-top-bar__nav .topbar-account-link {
    color: #3BC1F4;
    font-weight: 600;
}

.epicdecks-top-bar__nav .topbar-logged-in {
    color: #10b981;
}

.epicdecks-top-bar__contact {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-shrink: 0;
}

.epicdecks-phone,
.epicdecks-email {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #374151;
    text-decoration: none;
    font-weight: 500;
    white-space: nowrap;
}

.epicdecks-phone {
    transition: color 0.2s;
}

.epicdecks-phone:hover {
    color: #3BC1F4;
}

.epicdecks-phone svg,
.epicdecks-email svg {
    flex-shrink: 0;
    stroke: #3BC1F4;
}

/* ── Hlavní řádek ─────────────────────────────────────────────────────── */
.epicdecks-header {
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
}

.epicdecks-header__container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

.epicdecks-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 72px;
    gap: 24px;
}

.epicdecks-header__logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    min-width: 180px;
}

.epicdecks-header__logo img {
    height: 50px;
    width: auto;
    max-width: 180px;
    object-fit: contain;
}

.epicdecks-logo-text {
    font-size: 24px;
    font-weight: 700;
    color: #3BC1F4;
    text-decoration: none;
}

/* Hledání uprostřed */
.epicdecks-header__search {
    flex: 1;
    min-width: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.epicdecks-header__search .epicdecks-search {
    width: 100%;
    max-width: 800px;
    display: flex;
    align-items: center;
}

.epicdecks-header__search form,
.epicdecks-header__search .epicdecks-search-form,
.epicdecks-header__search .epicdecks-search__form {
    width: 100%;
    max-width: 600px;
    position: relative;
    display: flex;
    align-items: center;
    margin: 0;
}

.epicdecks-header__search input[type="search"],
.epicdecks-header__search .epicdecks-search-input,
.epicdecks-header__search .epicdecks-search__input {
    width: 100%;
    padding: 10px 45px 10px 16px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    transition: border-color 0.2s, box-shadow 0.2s;
    margin: 0;
    box-sizing: border-box;
}

.epicdecks-header__search input:focus {
    outline: none;
    border-color: #3BC1F4;
    box-shadow: 0 0 0 3px rgba(59, 193, 244, 0.15);
}

.epicdecks-header__search button[type="submit"],
.epicdecks-header__search .epicdecks-search-submit {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    padding: 6px;
    background: none;
    border: none;
    cursor: pointer;
    color: #6b7280;
    transition: color 0.2s;
}

.epicdecks-header__search button:hover {
    color: #3BC1F4;
}

.epicdecks-header__search button svg {
    width: 20px;
    height: 20px;
}

.epicdecks-header__search .epicdecks-search__input-wrapper {
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0;
}

/* Ikony vpravo */
.epicdecks-header__nav {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.epicdecks-account-toggle {
    position: relative;
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 8px;
    color: #374151;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}

.epicdecks-account-toggle:hover {
    background: #f9fafb;
    color: #3BC1F4;
}

.epicdecks-account-toggle svg {
    width: 24px;
    height: 24px;
}

.epicdecks-account-dot {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 10px;
    height: 10px;
    background: #10b981;
    border: 2px solid #fff;
    border-radius: 50%;
}

/* Světlý / tmavý vzhled: měsíc ve světlém, slunce v tmavém (Frontend\Theme_Mode). */
.ed-theme-toggle {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 8px;
    color: #374151;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.ed-theme-toggle:hover {
    background: #f9fafb;
    color: #3BC1F4;
}

.ed-theme-toggle:focus-visible {
    outline: 2px solid #3BC1F4;
    outline-offset: 2px;
}

.ed-theme-toggle svg {
    position: absolute;
    width: 22px;
    height: 22px;
    transition: transform 0.35s ease, opacity 0.25s ease;
}

.ed-theme-toggle__sun,
html[data-theme="dark"] .ed-theme-toggle__moon {
    opacity: 0;
    transform: rotate(-90deg) scale(0.5);
}

html[data-theme="dark"] .ed-theme-toggle__sun {
    opacity: 1;
    transform: none;
    color: #FFCB05;
}

@media (prefers-reduced-motion: reduce) {
    .ed-theme-toggle svg {
        transition: none;
    }
}

/* Na mobilu v řadě s hledáním, košíkem a menu – stejné orámované tlačítko. */
@media (max-width: 768px) {
    .ed-theme-toggle {
        border: 1px solid #e5e7eb;
    }
}

@media (max-width: 480px) {
    .ed-theme-toggle {
        width: 40px;
        height: 40px;
    }

    .ed-theme-toggle svg {
        width: 20px;
        height: 20px;
    }
}

.epicdecks-cart-toggle {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: none;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, color 0.2s;
    color: #374151;
}

.epicdecks-cart-toggle:hover {
    background: #f9fafb;
    border-color: #3BC1F4;
    color: #3BC1F4;
}

.epicdecks-cart-toggle svg {
    width: 24px;
    height: 24px;
}

.epicdecks-cart-count {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: #3BC1F4;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.epicdecks-mobile-toggle {
    display: none;
    padding: 8px;
    background: none;
    border: none;
    cursor: pointer;
    color: #374151;
}

/* ── Šířky ────────────────────────────────────────────────────────────── */
@media (max-width: 1400px) {
    .epicdecks-header__search {
        max-width: 400px;
    }
}

/* Lišta s mnoha odkazy: na středních šířkách se odkazy zúží, kontakty zůstanou. */
@media (max-width: 1100px) {
    .epicdecks-top-bar__nav { column-gap: 12px; }
    .epicdecks-email { display: none; }
}

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

    .epicdecks-top-bar__inner {
        justify-content: center;
    }

    .epicdecks-top-bar__contact {
        gap: 12px;
        font-size: 11px;
    }

    .epicdecks-header__container {
        padding: 0 12px;
    }

    .epicdecks-header__inner {
        height: 60px;
        gap: 8px;
    }

    .epicdecks-header__logo {
        min-width: 0;
        margin-right: auto;
    }

    .epicdecks-header__logo img {
        height: 40px;
        max-width: 120px;
    }

    .epicdecks-header__search {
        display: none;
    }

    /* Účet je v menu (návrh hlavičky): v řádku hledání, košík, menu. */
    .epicdecks-header__nav .epicdecks-account-toggle {
        display: none;
    }

    .epicdecks-header__nav {
        gap: 4px;
    }

    .epicdecks-mobile-toggle {
        display: block;
    }

    .epicdecks-cart-toggle {
        padding: 8px;
        border: none;
    }

    /* Při posunu dolů se lišta schová posunem obalu (obsah neposkočí). */
    .ed-masthead.is-compact {
        transform: translateY(calc(-1 * var(--ed-topbar-h, 37px)));
    }
}

@media (max-width: 480px) {
    .epicdecks-top-bar__inner {
        min-height: 32px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ed-masthead { transition: none; }
}