/*!
Theme Name: Stockie-child
Theme URI: http://stockie.colabr.io/
Author: Colabrio
Author URI: http://colabr.io/
Description: Stockie is flexible and high performance multipurpose WordPress Theme for personal and corporate use. It comes with the most popular WordPress page builder Visual Composer. Create gorgeous pages and layouts fast and easy without coding.
Version: 1.1.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: stockie
Text Domain: stockie-child
Tags: one-column, two-columns, left-sidebar, right-sidebar, custom-colors, custom-header, custom-menu, featured-images, full-width-template, post-formats, theme-options, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/* toraasset 2026-05-19 — constrain footer logo size, header logo intentionally normal */
footer .theme-logo img,
.stockie-sidebar-footer-1 .theme-logo img,
.widget_stockie_widget_logo img {
    max-width: 140px;
    height: auto;
    width: auto;
}

/* toraasset 2026-05-20 — About: file-format badges (replaced demo client logos) */
.toraasset-format-badges {
    text-align: center;
}
.toraasset-format-badges .tfb__label {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #9a9da3;
    margin-bottom: 26px;
}
.toraasset-format-badges .tfb__wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}
.toraasset-format-badges .tfb__chip {
    display: inline-block;
    padding: 10px 20px;
    border: 1px solid #e0e1e4;
    border-radius: 6px;
    background: #fafafa;
    font-family: 'SFMono-Regular', Menlo, Consolas, monospace;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: #24262b;
    transition: border-color .2s ease, color .2s ease;
}
.toraasset-format-badges .tfb__chip:hover {
    border-color: #F2A516;
    color: #F2A516;
}

/* toraasset 2026-05-20 — promo tiles: text shifted right on desktop only.
   On tablet/mobile (stacked, full width) reset padding and show the dark void
   side of the image so text stays readable. Parent .vc_row prefix raises
   specificity above WPBakery's bare .vc_custom_* rules. */
@media (max-width: 991px) {
    .vc_row .vc_custom_1551864727695,
    .vc_row .vc_custom_1551864733982 {
        padding-left: 9% !important;
        padding-right: 9% !important;
    }
    .vc_row .vc_custom_1581947028966,
    .vc_row .vc_custom_1581947039034 {
        background-position: 78% center !important;
    }
}

/* toraasset 2026-05-20 — footer "We accept" payment badges: uniform white pills, 2x2 grid */
.payment-methods {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: center;
    max-width: 162px;
}
.payment-methods .pm-pill {
    flex: 0 0 calc(50% - 3px);
    max-width: 79px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid #e6e7e9;
    border-radius: 5px;
    height: 26px;
    padding: 0 7px;
    box-sizing: border-box;
}
.payment-methods .pm-pill img {
    height: 12px;
    width: auto;
    max-width: 100%;
    display: block;
    margin: 0;
    background: none;
    border-radius: 0;
    box-shadow: none;
}
.payment-methods .pm-pill img[alt="Visa Secure"] {
    height: 16px;
}

/* toraasset 2026-05-20 — remove Stockie subheader (top utility bar above main menu) */
.subheader {
    display: none !important;
}

/* toraasset 2026-05-20 — header logo: lockup is 4.17:1; 50px height rendered too
   large. Constrain to a balanced header size. */
.site-branding .site-title img,
.site-branding .fixed-logo img,
.site-branding .default-logo img,
.site-branding .mobile-logo img {
    max-height: 34px !important;
    height: auto !important;
    width: auto !important;
}

/* toraasset 2026-05-20 — advantages section on dark navy: icon-box titles white */
.parallax_section_icons .icon-box-headline {
    color: #ffffff !important;
}

/* toraasset 2026-05-20 — show/hide password "eye" on login + register + account forms.
   WooCommerce ships the .show-password-input toggle (JS works) but Stockie hides it. */
.woocommerce form .password-input,
.woocommerce-page form .password-input {
    display: block;
    position: relative;
}
.woocommerce form .password-input input,
.woocommerce-page form .password-input input {
    padding-right: 48px;
}
.woocommerce form .show-password-input,
.woocommerce-page form .show-password-input {
    display: block !important;
    position: absolute;
    top: 22px;
    right: 12px;
    transform: translateY(-50%);
    width: 26px;
    height: 26px;
    margin: 0;
    padding: 0;
    border: 0;
    background-color: transparent;
    box-shadow: none;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 21px 21px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
    opacity: 0.5;
    transition: opacity .15s ease;
}
.woocommerce form .show-password-input:hover,
.woocommerce-page form .show-password-input:hover {
    opacity: 0.85;
}
.woocommerce form .show-password-input.display-password,
.woocommerce-page form .show-password-input.display-password {
    opacity: 0.85;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
}
.woocommerce form .show-password-input::after,
.woocommerce-page form .show-password-input::after {
    content: none;
}


/* ===== Audit fixes 2026-05-21 ===== */

/* Fix 3 — single product: clear the transparent absolute header, tame oversized gallery image */
.single-product .woo_c-product-image,
.single-product .woo_c-product-details {
    padding-top: 110px;
}
@media (max-width: 991px) {
    .single-product .woo_c-product-details { padding-top: 0; }
}
/* Product image fills its column edge-to-edge — no grey frame. The Stockie
   type1-left slider is 705px wide with a grey background; a centred small image
   left grey on the sides. transform:none clears the slider JS's stale
   translateX centring offset. */
.single-product .woo_c-product-image .images,
.single-product .woo_c-product-image .image-wrap {
    width: 100% !important;
}
.single-product .woo_c-product-image .gimg,
.single-product .woo_c-product-image img.wp-post-image {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    transform: none !important;
    display: block;
}

/* Fix 6 — shop pagination must not overflow the viewport on small screens */
@media (max-width: 767px) {
    .woocommerce nav.woocommerce-pagination ul,
    ul.page-numbers {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .woocommerce nav.woocommerce-pagination ul li,
    ul.page-numbers li {
        margin: 2px;
        float: none;
    }
}

/* Fix 7 — footer copyright row: keep legal links clear of the right edge */
.site-info .page-container {
    padding-left: 25px;
    padding-right: 25px;
}


/* ===== Fixes 2026-05-21 (b) ===== */

/* Single product: the Stockie image-slider container defaults to height:100vh
   (full-viewport immersive layout). Our digital products have one square
   preview, so the 100vh container reserved a tall white gap below the image.
   Collapse it to the image height. */
.single-product .woo_c-product-image-slider {
    height: auto !important;
    background: transparent !important;
}

/* Footer widgets: equal gap between all four columns on desktop. The theme
   renders four equal 25% columns; the brand column's content is much wider
   than the link columns, so left-aligned content produced uneven visual gaps.
   Flex space-between with content-width columns => identical gaps. Below the
   theme's lg breakpoint (1200px) the columns stack 2x2 (vc_col-sm-6) — leave
   that untouched. */
@media (min-width: 1200px) {
    .site-footer .widgets {
        display: flex;
        justify-content: space-between;
        flex-wrap: nowrap;
        align-items: flex-start;
    }
    .site-footer .widgets:before,
    .site-footer .widgets:after,
    .site-footer .widgets > .clear {
        display: none !important;
    }
    .site-footer .widgets-column {
        width: auto !important;
        max-width: none !important;
        flex: 0 1 auto;
        float: none;
    }
}


/* ===== Mobile audit fixes 2026-05-22 ===== */
@media (max-width: 767px) {
    /* Trending tabs: wrap instead of clipping the 3rd tab off the viewport */
    .tabNav {
        white-space: normal !important;
        overflow-x: visible !important;
        text-align: center !important;
    }
    .tabNav .tabNav_line { display: none !important; }
    .tabNav .tabNav_link.active { color: #F2A516 !important; }

    /* Product carousels: drop the nav arrows on mobile (cards swipe), they
       overlapped the cards */
    .st__product__carousel .owl-nav { display: none !important; }

    /* Featured Collections: hide the side image column that collapses to a
       16px background-image sliver on mobile */
    .vc_custom_1581947123411 { display: none !important; }

    /* Shop grid: pin the product-name heading to two lines so the price
       starts at the same offset and prices align across a row */
    .woocommerce ul.products li.product .wc-product-title-wrap h2 { min-height: 54px; }
}


/* ===== Footer centered on mobile 2026-05-22 ===== */
@media (max-width: 767px) {
    .site-footer .widgets-column { text-align: center !important; }
    .site-footer .widgets-column ul { padding-left: 0 !important; margin-left: 0 !important; }
    .site-footer .payment-methods { margin-left: auto !important; margin-right: auto !important; }
}


/* R5 audit 2026-06-05: hide empty Back link on Shop archive (Stockie header-title.php) */
.woocommerce.archive .back-link,
.post-type-archive-product .back-link { display: none !important; }