/*!
Theme Name: Touchupxs.shop
Theme URI: http://underscores.me/
Author: Sajid Anwar khattak
Author URI: http://underscores.me/
Description: We are an automotive paint, primer, and coating company with manufacturing and sales operations in the USA. Our primary market includes customers across the USA and Canada.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: touchupxs-shop
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, 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.

touchupxs.shop is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

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

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap");

* {
  padding: 0;
  margin: 0;
  outline: none;
  box-sizing: border-box;
}

body {
  font-family: "Nunito", sans-serif;
  overflow-x: hidden !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
ul,
a {
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
}

li {
  list-style-type: none;
}

body {
    font-family: "Inter", sans-serif;
}

html, body { overflow-x: hidden; }
img { max-width: 100%; height: auto; }

.light_blue {
    background-color: #0a5a99;
    color: #FFF;
}

.container {
    width:100%;
    max-width: 1184px !important;
    margin: 0 auto;
}

.footerCss {
    font-weight: 500;
    font-size: 14px;
}

.fooheadcss {
    font-weight: 700;
    font-size: 24px;
    line-height: 32px;
}
.top-bar {
    font-family: "Inter", sans-serif;
}
.top-bar {
    background-color: #f8f9fc; /* Very light blue background for the top bar */
    /* Blue border separating it from the main nav */
    padding: 0.5rem 0;
    font-size: 0.85rem;
    color: #333;
}

.top-bar-link {
    color: #02518c; /* Blue text for links/calls to action */
    font-weight: 500;
    font-size: 16px;
}

.topbarspan {
    font-weight: 400;
    font-size: 13.5px;
    color: #1e1e1e;
}

.dropdown .btn {
    background-color: #f8f9fc !important;
}

.main-navbar-container {
    background-color: #ebf1f6; /* Light grey/off-white background */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    /* Subtle shadow for depth */
}

.banner {
    height: 48px !important;
}
/* Style for the logo container */
.logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    padding: 0.5rem 0;
    margin-right: 2rem; /* Spacing from the navigation links */
}

/* Placeholder for the logo image/graphic */
.logo-graphic {
    height: 35px;
    width: 100px;
    background: linear-gradient(
            to right,
            #ff9900,
            #ff6600
    ); /* Orange/Yellow Gradient */
    border-radius: 5px;
    margin-bottom: 2px;
}

.logo-text-top {
    font-size: 0.9rem;
    font-weight: bold;
    color: #444;
}

.logo-text-bottom {
    font-size: 0.65rem;
    color: #888;
    line-height: 1;
}

/* Nav links to match the image style (underlined on hover) */
.navbar-nav .nav-link {
    color: #0e1016 !important;
    font-weight: 500;
    padding: 0.5rem 0.8rem;
    border-bottom: 2px solid transparent;
    transition: border-bottom 0.3s;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: #02518c !important;
    border-bottom-color: #02518c !important;
}

/* Utility icons alignment */
.utility-icons .nav-link {
    font-size: 1.25rem;
    color: #555;
}

/* Cart badge */
.cart-badge {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 8px;
    right: -4px;
    font-size: 0.8rem !important;
    padding: 0.2rem 0.4rem !important;
    line-height: 1.1;
    font-weight: 200 !important;
}

/* Mega menu container */
.mega-menu {
    width: 100%;
    left: 0;
    right: 0;
    top: 100%;
    display: none;
    position: absolute;
    background: #fff;
    border-top: 2px solid #02518c;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    z-index: 1000;
}

/* Show menu on hover */
.mega-dropdown:hover .mega-menu {
    display: block;
}

/* Optional hover effect */
.mega-menu img {
    max-width: 100px;
    transition: transform 0.3s;
}

.mega-menu img:hover {
    transform: scale(1.1);
}

.mega-menu p {
    margin: 0;
    color: #333;
    font-size: 14px;
}

.navCss {
    /*
    padding-left: 63px;
    padding-right: 63px; */
}


.mega-menu {
    width: 100%;
    left: 0;
    right: 0;
    top: 100%;
    display: none;
    opacity: 0;
    background: #f5f9ff;
    transition: opacity .2s ease;
    border-radius: 0 0 16px 16px;
}
.mega-menu.show {
    display: block;
    opacity: 1;
}
.mega-card {
    background: #eaf1f8;
    border: 1px solid #e3ebf2;
    border-radius: 16px;
}
.mega-card:hover {
    background: #dde8f3;
}

.touchup_second_level {
    top: 61px !important;
}

.nav-link {
    font-family: "Inter", sans-serif;
    font-size: 13.3px;
}



/* Container title spacing */
.touchup_second_level h5 {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 1rem;
}

/* Grid for the menu items */
.touchup_second_level .child__menuitems {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;              /* space between cards */
}

/* Card link */
.touchup_second_level .child__menuitems li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;          /* centers image block nicely */
    text-decoration: none;
    background: #f2f5f8;              /* soft gray like the screenshot */
    border-radius: 14px;
    padding: 22px 16px;
    min-height: 140px;                /* card height */
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,0.04);
}

/* Image sizing */
.touchup_second_level .child__menuitems li a img {
    width: 86px;                      /* can size */
    height: 86px;
    object-fit: contain;
    margin-bottom: 10px;
    display: block;
}

/* Label */
.touchup_second_level .child__menuitems li a span {
    display: block;
    font-size: 0.93rem;
    line-height: 1.2;
    color: #2a2f36;
    font-weight: 500;
    text-align: center;
    white-space: nowrap;
}

/* Hover effect */
.touchup_second_level .child__menuitems li a:hover {
    background: #ffffff;
    transform: translateY(-2px);
    box-shadow:
            0 8px 18px rgba(20, 23, 28, 0.08),
            inset 0 0 0 1px rgba(0,0,0,0.06);
}

/* Responsive: 2-up on tablets, 1-up on phones */
@media (max-width: 992px) {
    .touchup_second_level .child__menuitems {
        grid-template-columns: repeat(2, 1fr);
    }
    .mobile_hide{display:none;}
    .top-bar .d-flex.align-items-center.header_top_bar{width:100%;justify-content:space-between !important;}
    .main-navbar-container{padding:10px 0px;}
    .container.navCss {padding: 0px 12px;}
    .touchup_second_level.dropdown-menu{opacity:1; opacity: 1;min-width: 100% !important;box-shadow: none !important;background: transparent !important;}
}
@media (max-width: 520px) {
    .touchup_second_level .child__menuitems {
        grid-template-columns: 1fr;
    }
}

/* Optional: constrain the dropdown for a nice megamenu width */
.touchup_second_level.dropdown-menu {
    min-width: 720px;                 /* adjust to your design/system */
    border-radius: 12px;
}

a.checkout-button.button.alt.wc-forward {background-color: #0a5a99;}

/* Blog */
.breadcrum {
    padding: 8px 0px;
    border-bottom: 1px solid #ebf1f6;
}
.breadcrum .breadcrum-wrapper {
    display: flex;
    justify-content: space-between;
}
.breadcrum .breadcrum-list {
    display: flex;
    align-items: center;
    column-gap: 8px;
    margin: 0;
}
.breadcrum .breadcrum-list li, .breadcrum .breadcrum-list li a {
    color: #525050;
    font-size: 14px;
    display: flex;
    align-items: center;
    font-weight: 600;
    column-gap: 8px;
}

.main-heading {
    color: #1e1e1e;
    font-size: 28px;
    font-weight: 700;
    text-align: center;
}
.page-heading {
    padding: 35px 0;
}
.sub-heading {
    text-align: center;
    color: #717171;
    font-size: 16px;
}

.page  h2,.page h3 {
    color: #0a5a99;
    margin: 17px 0;
    font-size: 20px;
} {
    color: #0a5a99;
    margin: 17px 0;
	 font-size: 20px;
}
/*
.woocommerce ul.products li.product .cardCss .woocommerce-loop-product__title{
    height: 49px;
    max-height: 49px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 12px;
} */
.single-product.woocommerce div.product .product_title {
    font-size: 18px;
    font-weight: 800;
    line-height: 34px;
    margin: 10px 0px;
}

/* Cart Table Layout */
.woocommerce-cart table.shop_table {
    border-radius: 12px;
    border: 1px solid #e4e4e4;
    overflow: hidden;
}

/* Table Cell Styling */
.woocommerce-cart table.shop_table td,
.woocommerce-cart table.shop_table th {
    padding: 18px 16px;
    border-color: #e4e4e4;
}

/* Product Thumbnail */
.woocommerce-cart .product-thumbnail img {
    width: 55px;
    height: auto;
    border-radius: 6px;
}

/* Remove Button */
.woocommerce-cart .product-remove a.remove {
    background: #ffeaea;
    color: #e60000 !important;
    border-radius: 50%;
    font-weight: bold;
}
.woocommerce-cart-form__cart-item.cart_item .product-name a{
    text-decoration: none;
    color: #333333 !important;
    font-weight: 600 !important;
    font-size: 17px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.woocommerce-cart .cart_totals {
    border: 1px solid #e4e4e4;
    background: #fff;
    padding: 25px;
    border-radius: 12px;
}

.woocommerce-cart .cart_totals h2 {
    font-size: 20px;
    color: #2b2b2b;
    margin-bottom: 15px;
}

.woocommerce-cart .cart_totals table {
    border: none !important;
}

.woocommerce-cart input#coupon_code {
    border: 1px solid #ccc;
    padding: 10px 14px;
    border-radius: 6px;
    height: 40px;
}

.woocommerce-cart .coupon .button {
    border-radius: 6px;
    margin-left: 5px;
}

.woocommerce .woocommerce-cart-form a.button,
.woocommerce .woocommerce-cart-form button.button,
.woocommerce .woocommerce-cart-form input.button {
    background: #0a5a99;
    color: #fff !important;
    padding: 12px 24px;
    font-weight: 600;
    border-radius: 6px;
    border: none;
    transition: 0.2s ease;
}

.woocommerce .woocommerce-cart-form a.button:hover,
.woocommerce .woocommerce-cart-form button.button:hover,
.woocommerce .woocommerce-cart-form input.button:hover {
    background: #005bb5;
}



.range-price-parent .range_container {
    width: 100%;
    background: #fff;
    padding: 20px 10px;
}
.range-price-parent .sliders_control {
    position: relative;
    min-height: 24px;
}
.range-price-parent .min-max-price {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.range-price-parent .min-max-price .max-price,
.range-price-parent .min-max-price .min-price {
    font-size: 12px;
    color: #333333;
    font-weight: 300;
}
.range-price-parent .sliders_control .tracking-line {
    position: absolute;
}
.range-price-parent input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    pointer-events: all;
    width: 18px;
    height: 18px;
    background-color: #2d2d2d;
    border-radius: 50%;
    box-shadow: 0 0 0 1px #c6c6c6;
    cursor: pointer;
}
.range-price-parent .sliders_control .tracking-line {
    position: absolute;
    width: 80%;
    background: #2d2d2d;
    height: 2px;
    z-index: 9;
}
.range-price-parent input[type="range"]::-moz-range-thumb {
    -webkit-appearance: none;
    pointer-events: all;
    width: 18px;
    height: 18px;
    background-color: #2d2d2d;
    border-radius: 50%;
    box-shadow: 0 0 0 1px #c6c6c6;
    cursor: pointer;
}

.range-price-parent input[type="range"]::-webkit-slider-thumb:active {
    box-shadow: inset 0 0 3px #387bbe, 0 0 9px #387bbe;
    -webkit-box-shadow: inset 0 0 3px #387bbe, 0 0 9px #387bbe;
}

.range-price-parent input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    height: 2px;
    width: 100%;
    position: absolute;
    background-color: #c6c6c6;
    pointer-events: none;
}

.range-price-parent #fromSlider {height: 0;z-index: 1;}
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {color: #0a5a99;}
.widget_price_filter h2.widgettitle {margin: 0px 0px 12px 0px;font-size: 16px;font-weight: bold;}



/* Title */
.widget_price_filter .widget-title,
.widget_price_filter h3 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
}

/* Slider Track */
.price_slider_wrapper .ui-slider {
    background: #e5e5e5 !important;
    height: 6px !important;
    border-radius: 8px;
}

/* Active Range Color */
.price_slider_wrapper .ui-slider-range {
    background: #0b5aa3 !important; /* blue color */
}

/* Slider Handles */
.price_slider_wrapper .ui-slider-handle {
    width: 18px !important;
    height: 18px !important;
    background: #0b5aa3 !important; /* circle color */
    border: 3px solid white !important;
    border-radius: 50% !important;
    top: -6px !important;
    cursor: pointer !important;
    transition: 0.2s ease;
    box-shadow: 0 0 6px rgba(0,0,0,0.15);
}

.price_slider_wrapper .ui-slider-handle:hover {
    transform: scale(1.12);
}

/* Price Label */
.price_slider_amount {
    margin-top: 10px;
    font-size: 15px;
    font-weight: 600;
}

.price_slider_amount .price_label {
    color: #333;
}

#add_payment_method table.cart img, .woocommerce-cart table.cart img, .woocommerce-checkout table.cart img { width: 32%;}