/*
 * Theme Name:  Zette Child
 * Theme URI:   https://zettebrands.com
 * Description: Zette Child Theme
 * Author:      Zette Brands
 * Author URI:  https://zettebrands.com
 * Template:    zette
 * Version:     1.0.7
 */

/* Copy any classes from parent theme here. They will override the parent's version. */

/* Mobile Header Customization: Dark Background & Logo Display */
@media (max-width: 1019px) {
    /* Dark background for the mobile header */
    .site-header,
    .navbar-primary,
    .navbar-primary .navbar-wrap,
    .header-large .navbar-topbar,
    .header-large .navbar-bottombar {
        background-color: #111111 !important;
        border-color: #333333 !important;
    }

    /* Force display of the logo */
    .navbar-primary .navbar-brand,
    .header-large .navbar-topbar .navbar-brand,
    .header-large .navbar-bottombar .navbar-brand {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: #ffffff !important;
        align-items: center;
    }
    
    /* Ensure the sidebar menu (offcanvas) icon and search icon are visible and white */
    .navbar-primary .navbar-toggle-offcanvas,
    .navbar-primary .toggle-search,
    .navbar-primary .toggle-offcanvas {
        display: flex !important;
        color: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    /* Adjust text color for logo if it's text-based */
    .navbar-primary .navbar-brand.site-title,
    .site-title {
        color: #ffffff !important;
    }
    
    /* Fix potential overlapping issues */
    .navbar-primary .navbar-brand img {
        max-height: 40px !important;
        display: block !important;
    }
}

/* Paper canvas: one faint tiled texture behind the whole page. */
html {
    background-color: #f8f5ef;
}

body {
    background-color: #f8f5ef;
    background-image:
        linear-gradient(rgba(248, 245, 239, 0.88), rgba(248, 245, 239, 0.88)),
        url("assets/page-bg.webp");
    background-repeat: repeat;
    background-size: auto, 512px 512px;
    background-attachment: scroll;
}

.site,
.site-inner,
.site-content,
.cs-container,
.main-content,
.content-area,
.site-main,
.section-homepage-posts,
.cs-homepage-posts,
.cs-featured-posts,
.widget-area,
.sidebar-area,
.post-archive,
.archive-wrap,
.archive-main,
.entry-container,
.entry-content-wrap,
.entry-content,
.post-inner,
.post-wrap {
    background-color: transparent;
    background-image: none;
}

body .site-footer,
body .site-footer.cs-bg-dark {
    background-image: none;
}

@media (min-width: 1020px) {
    body .navbar-primary,
    body .navbar-primary .navbar-wrap,
    body .header-large .navbar-bottombar,
    body .header-default .navbar-wrap {
        background-color: transparent !important;
    }
}


.site-footer .footer-address {
    display: block;
    margin-top: 1rem;
    font-style: normal;
    font-size: 0.75rem;
    line-height: 1.55;
    color: inherit;
}

.site-footer .footer-solidarity {
    margin: 0.85rem 0 0;
    font-size: 0.95rem;
    line-height: 1.5;
    font-weight: 700;
    color: inherit;
}

.site-footer .footer-heart {
    display: inline-block;
    margin-left: 0.28em;
    color: #e10600;
    font-size: 0.95em;
    line-height: 1;
    vertical-align: -0.05em;
}