/* ============================================
   ValueChecks Overrides – Nav + Product Grids
   Date: 2025-12-01
   ============================================ */

/* -----------------------------
   LEFT NAV: arrows + readability
   ----------------------------- */

/* Remove old tiny arrow image and restore comfy height */
.left_menu li > a {
    background-image: none !important;
    background-repeat: no-repeat;
    background-position: left center;
    line-height: 26px !important;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
}

/* Clear arrow ONLY on items that truly have children */
.left_menu li.has-children > a::before {
    content: "►";              /* right-pointing arrow */
    font-size: 15px;
    font-weight: bold;
    color: #444;
    display: inline-block;
    margin-right: 6px;
    transform: translateY(-1px);  /* visually center the arrow */
}

/* Selected menu item labels stay on one line */
.left_menu li a.black_bg,
.left_menu li a.white_bg {
    white-space: nowrap !important;
}


/* -----------------------------
   PRODUCT GRID: global behavior
   ----------------------------- */

/* Product tile wrapper (all grids) */
.box.global.boxlist {
    min-height: 260px;                /* enough room for image + text */
    overflow: hidden;                 /* hover zoom won't break rows */
    position: relative;
    margin-bottom: 28px !important;   /* vertical space between rows */
    box-shadow: none !important;      /* remove any old shadow image */
    border: none !important;
}

/* Fixed-size image window inside each tile */
.box.global.boxlist .box-img-wrap {
    width: 100%;
    height: 120px;                    /* was 140 – shorter = less blur */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;                 /* keeps tall images contained */
    position: relative;
}

/* Image itself */
.box.global.boxlist .box-img-wrap img {
    max-width: 100%;
    max-height: 120px;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: transform 0.25s ease;
}

/* Gentle hover zoom that stays inside the wrapper */
.box.global.boxlist:hover .box-img-wrap img {
    transform: scale(1.5);           /* softer than 1.6 to avoid fuzziness */
}


/* -----------------------------
   HOMEPAGE CHEAP CHECKS SECTION
   (keeps it consistent with grids)
   ----------------------------- */

/* Clamp images in #hp_cheap_checks tiles */
#hp_cheap_checks .box.global.boxlist img.box-img {
    max-width: 100% !important;
    max-height: 120px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
}

/* Ensure hover stays inside tile and is gentle */
#hp_cheap_checks .box.global.boxlist {
    overflow: hidden !important;
}

#hp_cheap_checks .box.global.boxlist:hover img.box-img {
    transform: scale(1.15) !important;
}


/* -----------------------------
   "DESIGNS FOUND" BAR
   ----------------------------- */

/* Standardize the look of the designs count bar */
#num_designs {
    font-size: 12pt !important;
    font-style: normal !important;
    padding: 8px 0 !important;
}

/* If any inline “Designs Found” block exists in the homepage section */
#hp_cheap_checks > div[style*="Designs Found"] {
    font-size: 12pt !important;
    padding: 8px 0 !important;
}
/* === FIX LISTING PAGE PRODUCT IMAGES === */

/* Create a stable 140px image window without needing .box-img-wrap */
.box.global.boxlist img.box-img {
    display: block;
    margin: 0 auto 6px;
    max-width: 100%;
    max-height: 140px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
    transition: transform 0.25s ease;
    image-rendering: auto; /* prevents blur from CSS rescaling */
}

/* Container must hide overflow for safe zoom */
.box.global.boxlist {
    overflow: hidden !important;
}

/* Gentle hover zoom (stays inside tile) */
.box.global.boxlist:hover img.box-img {
    transform: scale(1.12);
}