/*
 Theme Name:   CP10 Child+
 Theme URI:    https://premiumpress.com
 Description:  Child Theme for CP10 with Shop Configuration
 Author:       PremiumPress
 Author URI:   https://premiumpress.com
 Template:     CP10
 Version:      1.0.0
 Text Domain:  cp10-child
*/

/* Fix Social Icons not centered */
.ppt-icons-social li i {
    margin: 0 !important;
    padding: 30%;
}

/* ========================================
   Hover Icons on Card Images
   ======================================== */

/* Container for hover icons - hidden by default */
.icon_wrap {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: 5;
}

/* Show icons on hover */
[ppt-box]:hover .icon_wrap,
.card-ppt-search:hover .icon_wrap {
    opacity: 1;
    visibility: visible;
}

/* Individual icon buttons */
.icon_wrap .save,
.icon_wrap .view {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 44px;
    height: 44px;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.icon_wrap .save:hover,
.icon_wrap .view:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

/* Hide cancel icon by default, show heart */
.icon_wrap .save ._cancel {
    display: none;
}

.icon_wrap .save ._ok {
    display: inline-flex;
}

/* When item is in favorites, swap icons */
.isFavs .icon_wrap .save ._cancel {
    display: inline-flex;
}

.isFavs .icon_wrap .save ._ok {
    display: none;
}

/* ========================================
   QR Icon Link - Prevent color change
   ======================================== */
a.qr-icon-link,
a.qr-icon-link:link,
a.qr-icon-link:hover,
a.qr-icon-link:visited,
a.qr-icon-link:active,
a.qr-icon-link:focus {
    color: inherit !important;
    text-decoration: none !important;
    display: inline-flex;
}

a.qr-icon-link svg,
a.qr-icon-link:link svg,
a.qr-icon-link:hover svg,
a.qr-icon-link:visited svg,
a.qr-icon-link:active svg,
a.qr-icon-link:focus svg {
    fill: currentColor !important;
    stroke: currentColor !important;
}

a.qr-icon-link [ppt-icon-24],
a.qr-icon-link [ppt-icon-20],
a.qr-icon-link .qr-hover {
    color: inherit !important;
}

/* ========================================
   Fix Invisible Filter Count Badges
   The JS creates badges with badge-light + text-light
   which makes text invisible. Force all badges
   to use theme primary color with white text.
   High specificity selectors to override JS-added styles.
   ======================================== */

/* Force ALL filter badges to use primary color and white text */
body .addcount .badge,
body .addcount .badge.novalue,
body .addcount .badge.badge-light,
body .addcount .badge.badge-light.text-light,
body .addcount .badge.badge-pill.badge-light.text-light,
body [data-countkey] .badge,
body [data-countkey] .badge.novalue,
body [data-countkey] .badge.badge-light,
body .custom-control-label .badge.novalue,
body .custom-control-label .badge.badge-light,
body .tax-div .badge.novalue,
body .tax-div .badge.badge-light {
    background-color: rgb(12, 205, 109) !important; /* Theme primary color */
    color: #ffffff !important;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Hide the defaultvalue badge (JS creates novalue with dynamic count) */
body .addcount .badge.defaultvalue,
body [data-countkey] .badge.defaultvalue {
    display: none !important;
}

/* Hide duplicate novalue badges - show only the first one */
body .addcount .badge.novalue ~ .badge.novalue,
body [data-countkey] .badge.novalue ~ .badge.novalue {
    display: none !important;
}

/* ========================================
   Hide Image Overlay
   ======================================== */
.overlay-inner {
    display: none !important;
}