/* ==================================================
   0. GLOBÁLNÍ FONTY – JEDINÝ ZDROJ PRAVDY
   ================================================== */
body,
button,
input,
select,
textarea,
p,
div,
a,
li {
    font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* ==================================================
   1. ZÁKLADNÍ LAYOUT (DESKTOP + MOBIL)
   ================================================== */
.site,
.content-area,
.deli-content-wrapper {
    padding: 0 !important;
}

.site-header .custom-logo-link {
    margin: 0 !important;
}

.site-branding {
    max-height: 120px;
}

/* ==================================================
   2. WIDGETY
   ================================================== */
.widget,
.widget_block,
.widget.woocommerce.widget_product_tag_cloud {
    margin-bottom: 0 !important;
    padding: 10px !important;
}

.widgettitle {
    margin-left: -0.6em !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
}

/* ==================================================
   3. BREADCRUMB + FOOTER
   ================================================== */
.woocommerce-breadcrumb {
    display: none !important;
}

.storefront-breadcrumb {
    padding: 0 !important;
    margin: 10px;
}

.site-footer,
.site-footer a:not(.button):not(.components-button),
.site-footer .widget .widget-title {
    color: black;
}

/* ==================================================
   4. VYHLEDÁVÁNÍ PRODUKTŮ
   ================================================== */
.site-search .widget_product_search input[type=search] {
    background: rgba(255,255,255,0.8);
    border: 0;
    font-size: 12px;
    font-family: "Source Sans Pro", sans-serif;
    color: black;
}

/* ==================================================
   5. MOBIL – RESET STORE­FRONT LAYOUTU
   ================================================== */
@media (max-width: 768px) {

    .col-full,
    #content .col-full,
    .site-content .col-full,
    .content-area,
    .site-main {
        max-width: 100% !important;
        width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.custom-background {
        background-image: none !important;
        background-color: #ffffff !important;
    }
}

/* ==================================================
   6. MOBIL – BĚŽNÉ STRÁNKY (PAGE)
   ================================================== */
@media (max-width: 768px) {

    .page .entry-content,
    .page .entry-content p {
        text-align: justify !important;
        hyphens: auto;
    }

    .entry-content,
    .entry-header,
    .woocommerce-products-header {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    h1, h2, h3, h4 {
        text-align: left !important;
    }
}

/* ==================================================
   7. MOBIL – MENU
   ================================================== */
@media (max-width: 768px) {

    .main-navigation ul li a,
    .secondary-navigation ul li a,
    .handheld-navigation ul li a {
        color: #43454b !important;
        font-weight: 700 !important;
        font-size: 1.1em !important;
    }

    .main-navigation ul li.current-menu-item > a,
    .handheld-navigation ul li.current-menu-item > a {
        color: #000000 !important;
        font-weight: 800 !important;
    }
}

/* ==================================================
   8. MOBIL – SHOP / KATEGORIE (ARCHIVE)
   ================================================== */
@media (max-width: 768px) {

    ul.products {
        margin-top: 15px !important;
    }

    ul.products li.product {
        width: 48% !important;
        float: left !important;
        margin-right: 4% !important;
        margin-bottom: 15px !important;
        position: relative !important;
        clear: none !important;
    }

    ul.products li.product:nth-child(2n) {
        margin-right: 0 !important;
    }

    ul.products li.product img {
        width: 100% !important;
        height: auto !important;
        margin-bottom: 4px !important;
    }

    ul.products li.product .woocommerce-loop-product__title {
        font-size: 0.9em !important;
        line-height: 1.1 !important;
        margin: 5px 0 2px !important;
        padding-left: 8px !important;
        padding-right: 5px !important;
        text-align: left !important;
    }

    ul.products li.product .price {
        display: block !important;
        margin: 0 0 6px !important;
        padding-left: 8px !important;
        color: #0e7784 !important;
        line-height: 1 !important;
        text-align: left !important;
    }

    ul.products li.product .button {
        display: block !important;
        width: 100% !important;
        padding: 8px 4px !important;
        font-size: 0.8em !important;
        margin-top: 0 !important;
        line-height: 1 !important;
    }

    ul.products li.product .onsale {
        position: absolute !important;
        top: 10px !important;
        left: 10px !important;
        z-index: 10 !important;
        background: #ffffff !important;
        color: #cf2e2e !important;
        border: 1px solid #cf2e2e !important;
        font-size: 0.7em !important;
        padding: 4px 8px !important;
        border-radius: 3px !important;
        line-height: 1 !important;
    }
}

/* ==================================================
   9. MOBIL – HLAVIČKA OBCHODU (NÁZEV + ŘAZENÍ)
   ================================================== */
@media (max-width: 768px) {

    #main.site-main {
        display: flex !important;
        flex-wrap: wrap !important;
        flex-direction: row !important;
        padding-top: 10px !important;
    }

    header.woocommerce-products-header {
        flex: 0 0 35% !important;
        padding-left: 12px !important;
        margin: 0 !important;
    }

    h1.woocommerce-products-header__title.page-title {
        font-size: 1.1em !important;
        margin: 0 !important;
    }

    .storefront-sorting {
        flex: 0 0 65% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-end !important;
        padding-right: 12px !important;
        margin: 0 !important;
        border: none !important;
    }

    .woocommerce-ordering {
        margin-bottom: 4px !important;
    }

    .woocommerce-ordering select {
        font-size: 0.85em !important;
        padding: 5px !important;
        max-width: 170px !important;
    }

    .woocommerce-result-count {
        font-size: 0.75em !important;
        color: #777 !important;
        text-align: right !important;
        margin: 0 !important;
    }
} /* END @media (max-width: 768px) */


/* === BLOG POST: COMPACT LAYOUT === */

/* celý příspěvek */
.post.type-post {
    margin-bottom: 1.2em;
}

/* hlavička příspěvku (datum, autor, nadpis) */
.post.type-post .entry-header {
    margin-bottom: 0.6em;
}

/* metadata (datum, autor, komentáře) */
.post.type-post .entry-header span {
    margin-bottom: 0.2em;
}

/* nadpis příspěvku */
.post.type-post .entry-title {
    margin-top: 0.3em;
    margin-bottom: 0.4em;
}

/* obsah příspěvku */
.post.type-post .entry-content {
    margin-top: 0;
    margin-bottom: 0.6em;
}

/* kategorie pod článkem */
.post.type-post .entry-taxonomy {
    margin-top: 0.4em;
    padding-top: 0;
}


.widget.widget_search::before {
    content: none !important;
}



/* === STORE CONTENT: REMOVE TOP GAP UNDER HEADER === */

/* odstranit clearfix pseudo-elementy */
.col-full::before,
.col-full::after {
    content: none !important;
    display: none !important;
}

/* odstranit horní odsazení hlavního obsahu */
.site-content {
    padding-top: 0 !important;
}


/* ==================================================
   SHOP: NADPIS „OBCHOD“ + ŘAZENÍ DO JEDNOHO ŘÁDKU
   ================================================== */

/* rodič – zruší default Storefront flow */
body.post-type-archive-product #main.site-main {
    display: grid !important;
    grid-template-columns: auto 1fr;
    grid-template-areas:
        "title sorting"
        "products products";
    align-items: center;
}

/* nadpis Obchod */
body.post-type-archive-product
.woocommerce-products-header {
    grid-area: title;
    margin: 0 !important;
    padding: 0 !important;
}

/* samotný text Obchod */
body.post-type-archive-product
.woocommerce-products-header__title {
    margin: 0 !important;
}

/* box s řazením + počtem */
body.post-type-archive-product
.storefront-sorting {
    grid-area: sorting;
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin: 0 !important;
    padding: 0 !important;
}

/* odstranit DUPLIKÁT řazení (Storefront ho generuje 2×) */
body.post-type-archive-product
.storefront-sorting + .storefront-sorting {
    display: none !important;
}

/* produkty pod tím */
body.post-type-archive-product
ul.products {
    grid-area: products;
}

/* mobil: pod sebe */
@media (max-width: 768px) {
    body.post-type-archive-product #main.site-main {
        grid-template-columns: 1fr;
        grid-template-areas:
            "title"
            "sorting"
            "products";
    }

    body.post-type-archive-product
    .storefront-sorting {
        justify-content: flex-start;
    }
}

/* === SHOP PAGE: REMOVE DOTTED BORDER AROUND SORTING === */

.archive.woocommerce .storefront-sorting {
    border: none !important;
}

/* ==================================================
   DESKTOP ONLY – SHOP SLEVA (ONSale)
   ================================================== */
@media (min-width: 769px) {

    .woocommerce ul.products li.product .onsale,
    .woocommerce span.onsale {
        position: absolute !important;
        top: 12px !important;
        left: 12px !important;

        background-color: #f57c00 !important; /* oranžová */
        color: #ffffff !important;

        font-size: 0.9em !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;

        padding: 6px 12px !important;
        border-radius: 4px !important;

        border: none !important;
        box-shadow: none !important;
        line-height: 1 !important;

        z-index: 20 !important;
    }

}


/* ==================================================
   MOBILE FIX – STORE FRONT SORTING
   ================================================== */

/* 1. Na mobilu zobraz jen PRVNÍ sorting */
@media (max-width: 768px) {

    .storefront-sorting + .storefront-sorting {
        display: none !important;
    }

    /* 2. Jeden řádek */
    .storefront-sorting {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 8px !important;
    }

    /* 3. Select (řazení) */
    .storefront-sorting form {
        margin: 0 !important;
    }

    .storefront-sorting select {
        max-width: 160px;
    }

    /* 4. Text „Zobrazeno …“ */
    .woocommerce-result-count {
        margin: 0 !important;
        white-space: nowrap;
        font-size: 0.85em;
    }

    /* 5. Stránkování */
    .woocommerce-pagination {
        margin: 0 !important;
    }

}


/* === MOBILE: odstranit duplikovaný sorting + 1 řádek === */
@media (max-width: 767px) {

    /* odstranit druhý (duplicitní) sorting */
    main.site-main > .storefront-sorting:last-of-type {
        display: none !important;
    }

    /* vše v jednom řádku */
    .storefront-sorting {
        display: flex !important;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

    .storefront-sorting > * {
        flex: 0 0 auto;
        margin: 0 !important;
        white-space: nowrap;
    }

    .woocommerce-ordering select {
        max-width: 160px;
        font-size: 13px;
        padding: 4px 6px;
    }

    .woocommerce-result-count {
        font-size: 12px;
        white-space: nowrap;
    }

    .woocommerce-pagination {
        white-space: nowrap;
    }
}

/* === DESKTOP: sorting v jednom řádku === */
@media (min-width: 768px) {

    .storefront-sorting {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        flex-wrap: nowrap;
        gap: 12px;
    }

    .storefront-sorting > * {
        white-space: nowrap;
    }

}


