/*
Theme Name:   Patriot Storefront Child
Theme URI:    https://patriottshirtcompany.store/
Description:  Child theme for Storefront - Patriot T-Shirt Company customizations
Author:       AC Jackson
Author URI:   https://patriottshirtcompany.store/
Template:     storefront
Version:      2.14.7
Text Domain:  patriot-storefront-child
*/


.site-title {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}


.site-branding {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}


/* Completely hide header search box (desktop and mobile) */
.storefront-product-search,
.site-header .widget_product_search,
.header-search-form {
    display: none !important;
}




/* Mobile: Override with different image */
@media screen and (max-width: 767px) {
    .site-header {
        background-image: url('https://patriottshirtcompany.store/wp-content/uploads/2026/01/wordpress-MOBILE-HEADER-2.3.webp') !important;
        background-size: cover;
        background-position: center;
    }
}

/* Drop cart icoons down with top margin */
.main-navigation {
    margin-top: 20px !important;
    padding-top: 40px !important;
    /* Adjust this value to control how far down it drops – start with 20–40px */
}

/* Drop cart icoons down with top margin */
.site-header-cart {
    margin-top: 20px !important;
    padding-top: 40px !important;
    /* Adjust this value to control how far down it drops – start with 20–40px */
}


/* Hover color for all relevant links */
.site-branding .site-title a:hover,
.main-navigation ul.menu > li > a:hover,
/* .secondary-navigation ul.menu > li > a:hover, */
.site-header-cart .cart-contents:hover {
    color: #00c9ff !important;
}


/* Remove default focus/click outline from primary menu links */
.primary-navigation a,
.primary-navigation ul.menu > li > a,
.primary-navigation ul.menu a {
    outline: none !important;
    box-shadow: none !important;
}

/*menu */
.primary-navigation {
        font-weight: 900;
        text-align: right;
}

/* Mobile-specific overrides */
@media screen and (max-width: 767px) {
  
    /* Hover color for links on mobile */
    .main-navigation ul.menu > li > a:hover {
        color: #00c9ff !important;
    }

    /* Menu toggle button background (hamburger dropdown button) */
    .menu-toggle {
        background-color: #a00000 !important;
    }

    /* Optional: If the expanded menu background needs adjustment (e.g., if it's white and causes issues) */
    .handheld-navigation ul.menu {
        background-color: #002147 !important; /* Or match to button if desired */
    }

    /* Ensure cart icon/$ on mobile if visible */
    .site-header-cart .cart-contents {
        color: #1293d1 !important;
    }
}
/* Add 10px left padding to the mobile/handheld menu items */
@media screen and (max-width: 767px) {
    .handheld-navigation ul,
    .handheld-navigation ul li a,
    .handheld-navigation .menu,
    .handheld-navigation .menu > ul {
        text-align: left !important;
        padding-left: 10px !important;  /* Indents the entire menu list */
        margin-left: 0 !important;      /* Prevents any negative margin interference */
    }

    /* Optional: If sub-menus need extra indent for hierarchy */
    .handheld-navigation ul ul {
        padding-left: 20px !important;  /* Deeper indent for dropdowns/sub-items */
    }
}


/* WooCommerce buttons - hover background & text color */
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce .button:hover,
.woocommerce .added_to_cart:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce .wc-forward:hover,
.woocommerce .button.alt:hover,
.woocommerce .button.alt:focus {
    background-color: #002147 !important;    /* Your dark navy background on hover */
    color: #00c9ff !important;              /* Bright cyan text on hover */
    border-color: #00c9ff !important;       /* Optional: matching border for definition */
}

/* Optional: Smooth transition so the change feels polished */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .button,
.woocommerce .added_to_cart,
.woocommerce .single_add_to_cart_button,
.woocommerce .wc-forward,
.woocommerce .button.alt {
    transition: all 0.25s ease;
}

/* Mobile / smaller screens - same hover rules apply */
@media screen and (max-width: 767px) {
    .woocommerce #respond input#submit:hover,
    .woocommerce a.button:hover,
    .woocommerce button.button:hover,
    .woocommerce input.button:hover,
    .woocommerce .button:hover,
    .woocommerce .added_to_cart:hover,
    .woocommerce .single_add_to_cart_button:hover,
    .woocommerce .wc-forward:hover,
    .woocommerce .button.alt:hover {
        background-color: #002147 !important;
        color: #00c9ff !important;
        border-color: #00c9ff !important;
    }
}

/* Eliminate vertical gap between main header and header-widget-region */
.site-header {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.header-widget-region {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Also target any inner wrappers that might add space */
.header-widget-region .col-full,
.header-widget-region .widget-area {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 6px white border line between header and header-widget-region */
.header-widget-region {
    border-top: 6px solid #ffffff !important;
}

/* Optional: thinner on mobile if it feels too heavy */
@media screen and (max-width: 767px) {
    .header-widget-region {
        border-top-width: 4px !important;  /* or keep 6px */
    }
}

/* ==================================================
   Header Widget Region - Base Styling
   ================================================== */

.header-widget-region {
    background-color: #002147 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 12px 0 !important;
    width: 100%;
    color: #ffffff;
}

/* Inner container - centers and limits width */
.header-widget-region .col-full,
.header-widget-region .widget-area {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

/* General widget styling inside header region */
.header-widget-region .widget {
    flex: 1;
    min-width: 220px;
    text-align: center;
    margin: 8px 0;
    padding-bottom: 0px;
}

/* Mobile - stack columns vertically */
@media screen and (max-width: 767px) {
    .header-widget-region .col-full,
    .header-widget-region .widget-area {
        flex-direction: column;
        padding: 0 15px;
        gap: 16px;
    }

    .header-widget-region .widget {
        width: 100%;
        margin: 10px 0;
        padding-bottom: 0px;
    }
}


/* WooCommerce product search form in header widget */
.woocommerce-product-search {
    text-align: center;           /* or right/left depending on layout */
    margin: 10px 0;
}


/* Remove "Search" label above the search input in header widget area */
.header-widget-region .wp-block-search__label {
    display: none !important;
}

.woocommerce-product-search form {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 300px;             /* adjust width to fit your header */
    margin: 0 auto;
}

.woocommerce-product-search .search-field {
    flex-grow: 1;
    padding: 10px 15px;
    border: 2px solid #002147;   /* your navy border */
    border-radius: 4px 0 0 4px;
    font-size: 1em;
    background: #ffffff;
    color: #002147;
}

.woocommerce-product-search .search-field::placeholder {
    color: #666666;
}

/* Custom placeholder text: "Search Products" */
.header-widget-region .wp-block-search__input::placeholder {
    content: "Search Products" !important;
    color: #666666 !important;           /* medium gray – adjust to taste */
    opacity: 1 !important;
}

/* Fallback for browsers that don't support ::placeholder content override */
.header-widget-region .wp-block-search__input {
    /* This is just visual fallback – real placeholder is set in widget or via JS if needed */
}


.woocommerce-product-search .search-submit {
    padding: 10px 20px;
    background-color: #a00000;    /* patriotic red */
    color: #ffffff;
    border: none;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

.woocommerce-product-search .search-submit:hover {
    background-color: #002147;    /* darker navy on hover */
    color: #00c9ff;
}

/* Optional: Make it full-width on mobile */
@media screen and (max-width: 767px) {
    .woocommerce-product-search form {
        max-width: 100%;
    }
}


/* Site-wide breadcrumbs color */
.storefront-breadcrumb,
.woocommerce-breadcrumb,
.woocommerce-breadcrumb a,
.woocommerce-breadcrumb span {
    color: #002147 !important;
}

/* Breadcrumbs hover/link color (for better UX - optional but recommended) */
.woocommerce-breadcrumb a:hover {
    color: #a00000 !important;  /* Patriotic red on hover - matches your headings */
    text-decoration: underline;
}

/* Site-wide page titles (h1.entry-title, shop/category archives, etc.) */
.entry-title,
.page-title,
.woocommerce-products-header h1,
.archive .page-title,
.single-product .product_title,
.woocommerce .product_title {
    color: #002147 !important;
}

/* Optional: Make titles bolder/stand out more */
.entry-title,
.page-title {
    font-weight: 700;  /* Or 800 for extra weight */
}

/* Mobile adjustments if needed (Storefront breakpoint) */
@media screen and (max-width: 767px) {
    .woocommerce-breadcrumb,
    .entry-title,
    .page-title {
        color: #002147 !important;
    }
}


.storefront-breadcrumb,
.woocommerce-breadcrumb {
    margin-top: 0px !important;          /* Small top margin for breathing room after header */
    margin-bottom: 0px !important;       /* Reduced bottom margin before page title */
    padding: 10px 0 !important;           /* Minimal internal padding if any */
}

/* Reduce top margin on page titles (h1.entry-title or similar) */
.page .entry-header h1.entry-title,
.page-title,
.woocommerce-products-header h1,
.archive .page-title {
    margin-top: 0 !important;             /* Tighten from top (after breadcrumbs) */
    margin-bottom: 0px !important;       /* Keep a little space below title to content */
}

/* Mobile adjustments (Storefront's mobile breakpoint is around 768px) */
@media screen and (max-width: 767px) {
    .storefront-breadcrumb,
    .woocommerce-breadcrumb {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
    }
    
    .entry-header h1.entry-title,
    .page-title {
        margin-top: 0 !important;
    }
}


/* Cards for Beaver Builder - Custom overrides */

/* Card heading/title - patriotic red */
.bb_boot_card_title {
    color: #a00000 !important;
    font-weight: bold;  /* Or 700 if you prefer heavier; remove if already set */
    text-align:center !important;
}

/* Card description/text - dark navy */
.bb_boot_card_text {
    color: #002147 !important;
}

/* Add 10px top padding to the image container (creates space above description if image is top) */
.bb_boot_card_image {
    padding-top: 10px !important;
}

/* Center images in Bootstrap Cards on mobile (and smaller screens) */
@media screen and (max-width: 767px) {
    .bb_boot_card_image,
    .bb_boot_card_image img {  /* Targets the div and the actual img inside */
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;  /* Fallback if img is inline */
    }

    /* Optional: Ensure the image container itself is centered if it has width issues */
    .bb_boot_card_image {
        width: 100% !important;  /* Full width of card */
        max-width: 300px;        /* Optional cap to prevent oversized images; adjust as needed */
    }

    /* If the img has float or other alignment, reset */
    .bb_boot_card_image img {
        float: none !important;
    }
}

/* Site-wide blue-scale drop shadow on all cards (using your #002147 as base) */
     
.bb_boot_card_container    /* Possible outer wrapper */
{
    box-shadow: 0 4px 12px rgba(0, 33, 101, 0.3) !important;  /* #002147 RGB with 30% opacity for visible blue tint */
}

/* Optional: Enhance on hover (lift + stronger blue shadow) */
.card:hover,
.bb-boot-card_container .card:hover {
    box-shadow: 0 8px 24px rgba(0, 33, 141, 0.45) !important;
    transform: translateY(-4px);
    transition: all 0.3s ease;
}
/* Hide the Bootstrap Cards button completely but keep it functional for stretched-link */
.bb_boot_card_link_button {   /* Covers variations like btn-primary etc. */
    display: none !important;              /* Completely removes it from layout */
}

/* Ensure the card container is positioned for stretched-link to work */
.bb_boot_card_container {
    position: relative !important;
    cursor: pointer !important;            /* Hand cursor on whole card */
}

/* Optional: Hover effect for better UX (lift + stronger blue shadow) */
.bb_boot_card_container:hover {
    transform: translateY(-5px) scale(1.02);
    transition: all 0.3s ease;
    box-shadow: 0 8px 24px rgba(0, 33, 71, 0.45) !important; /* Your blue shadow */
}

/* Make the hidden button cover the full card for clicks (while staying invisible) */
.bb_boot_card_link_button {
    display: block !important;             /* Override the none to allow positioning */
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0 !important;                 /* Fully transparent/invisible */
    z-index: 1 !important;                 /* Above other card content */
    background: transparent !important;    /* No visible fill */
    border: none !important;               /* Remove any button styling */
    text-indent: -9999px !important;       /* Hide text offscreen for accessibility */
    overflow: hidden !important;
}

/* Ensure the container allows clicks through properly */
.bb_boot_card_container {
    position: relative !important;         /* Already there, but confirm */
    overflow: hidden !important;           /* Prevents any overflow issues */
}

/* On product category archive pages: hide only images inside the description block */
/* Keep all other text, headings, paragraphs, links, etc. visible */
.tax-product_cat .term-description img,
.tax-product_cat .woocommerce-taxonomy-description img,
.tax-product_cat .woocommerce-products-header .term-description img {
    display: none !important;
}


/* Reduce space between category description and sorting bar — ONLY on desktop/large screens */
@media screen and (min-width: 768px) {
    .tax-product_cat .woocommerce-taxonomy-description,
    .tax-product_cat .term-description {
        margin-bottom: -40px !important;     /* Your working value — only applies here */
        padding-bottom: 0 !important;
    }

    /* Optional: Pull the sorting bar up a bit more if needed */
    .tax-product_cat .woocommerce-products-header,
    .tax-product_cat .storefront-sorting,
    .tax-product_cat .woocommerce-ordering {
        margin-top: -10px !important;        /* Tiny lift to meet the negative bottom */
    }
}

/* Hide "Additional Information" tab and content on single product pages */
.single-product .woocommerce-tabs .woocommerce-Tabs-panel--additional_information,
.single-product .woocommerce-tabs ul.tabs li.additional_information_tab,
.single-product .woocommerce-tabs .panel.additional_information {
    display: none !important;
}

/* Hide ONLY the product tags, keep the "Categories" line visible */
.single-product .product_meta .tagged_as,
.single-product .product_meta span.tagged_as,
.single-product .product_meta a[rel="tag"] {
    display: none !important;
}

/* Explicitly ensure the categories line stays visible (safety net) */
.single-product .product_meta .posted_in,
.single-product .product_meta span.posted_in,
.single-product .product_meta .posted_in a {
    display: inline !important;      /* or inline/inline-block if preferred */
}




/* Fix Beaver Builder form success message readability */
 .wpforms-confirmation-container-full  {
    background-color: #002147 !important;   /* Your dark navy background for brand consistency */
    color: #ffffff !important;             /* White text – already is, but force it */
    border: 1px solid #00c9ff !important;  /* Optional: subtle cyan border for visibility */
    padding: 15px !important;
    margin: 15px 0 !important;
    text-align: center !important;
    font-weight: bold !important;
}

/* Optional: Make error messages more readable too (red tones) */
 .wpforms-confirmation-container-full {
    background-color: #a00000 !important;  /* Patriotic red for errors */
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

/* Ensure it works on mobile */
@media screen and (max-width: 767px) {
    .wpforms-confirmation-container-full {
        font-size: 1.1em !important;   /* Slightly larger for touch devices */
    }
}


/* footer */



/* Reduce top padding on the entire footer area */
.site-footer {
    margin-top: 0px !important;
    padding: 0px !important;/* Default is often 40–60px; adjust this value lower (e.g., 10px or 0) as needed */
}

/* Reduce top padding/margin on the copyright/credit bar at the very bottom */
.site-info {
    padding-top: 0px !important;       /* Tightens space above the credit text */
    margin-top: -40px !important;           /* Removes any extra top margin */
}

/* Mobile adjustments – keep it from feeling cramped on small screens */
@media screen and (max-width: 767px) {
    .site-footer {
        padding-top: 15px !important;   /* Slightly more breathing room on mobile */
    }
    .site-info {
        padding-top: 8px !important;
    }
}
.site-info {
    text-align: right !important;
    float: right !important;
}
.site-info a {
    color: #ffffff !important;
    font-weight: bold !important;
    text-decoration: underline !important;
}
.site-info a:hover {
    color: #00c9ff !important;
}