/**
 * Cart Counter Pro
 * 
 * @author    WBF
 * @copyright 2026 WBF
 * @license   Commercial
 */

/* Header cart badge - compact display */
.cart-nbr.js-cart-nbr,
.cart-products-count,
.js-cart-products-count {
    min-width: 18px !important;
    width: auto !important;
    max-width: 36px !important;
    padding: 2px 4px !important;
    white-space: nowrap !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
}

/* Akira theme header badge */
.blockcart .cart-nbr,
.block-cart .cart-nbr,
.header-cart .cart-nbr {
    min-width: 18px !important;
    width: auto !important;
    max-width: 36px !important;
    padding: 2px 4px !important;
    border-radius: 10px !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

/* Cart summary section - full format display */
.cart-summary-top .summary_count,
.js-cart-summary-top .summary_count,
.cart-summary .summary_count,
.js-checkout-summary .cart-products-count,
.checkout-summary .cart-products-count {
    min-width: auto !important;
    width: auto !important;
    max-width: none !important;
    padding: 4px 10px !important;
    white-space: nowrap !important;
    font-size: 12px !important;
}

/* Hummingbird theme */
.header-block-cart .cart-products-count {
    min-width: 18px !important;
    width: auto !important;
    max-width: 36px !important;
    padding: 2px 4px !important;
    white-space: nowrap !important;
    font-size: 10px !important;
}

/* Classic theme */
#_desktop_cart .cart-products-count,
#_mobile_cart .cart-products-count {
    min-width: 16px !important;
    width: auto !important;
    max-width: 32px !important;
    padding: 1px 4px !important;
    white-space: nowrap !important;
    font-size: 10px !important;
}

/* Elementor header cart badge positioning */
.elementor-element .btn-canvas .cart-nbr,
.elementor-widget-container .btn-canvas .cart-nbr {
    position: absolute !important;
    top: -10px !important;
    right: -15px !important;
    border-radius: 0 !important;
    min-width: 18px !important;
    width: auto !important;
    max-width: 36px !important;
    padding: 2px 4px !important;
    white-space: nowrap !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
}

/* ============================================
   TOOLTIP STYLES
   ============================================ */

.wbf-ccp-tooltip {
    background: #333;
    color: #fff;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 10000;
}

.wbf-ccp-tooltip[style*="display: block"] {
    opacity: 1;
}

/* Tooltip arrow */
.wbf-ccp-tooltip::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: transparent transparent #333 transparent;
}

/* ============================================
   CHECKOUT BADGE STYLES
   ============================================ */

.wbf-ccp-checkout-badge {
    display: inline-block;
    background: #706F6C;
    color: #fff;
    padding: 6px 14px;
    border-radius: 0;
    font-size: 12px;
    font-weight: 600;
    /* Wrap long content (many unit types) instead of clipping it */
    white-space: normal;
    line-height: 1.5;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
}

/* Hide the original summary_count since we have our badge */
.cart-summary .summary_count,
.js-cart-summary .summary_count,
.cart-summary-top .summary_count,
.checkout-summary .summary_count {
    display: none !important;
}

/* Hide the article count in cart sidebar (e.g., "4 Articole") */
.totals-nb.js-cart-canvans-title,
.js-cart-canvans-title,
#canvas-mini-cart h3.title-canvas-widget .js-cart-canvans-title,
#canvas-mini-cart h3.title-canvas-widget .totals-nb,
#canvas-mini-cart .title-canvas-widget .js-cart-canvans-title,
#canvas-mini-cart .title-canvas-widget .totals-nb {
    display: none !important;
}

/* ============================================
   CART SIDEBAR - FIXED BOTTOM LAYOUT
   Ensures subtotal and buttons stay at bottom
   ============================================ */

/* Make cart sidebar content a flex container */
#canvas-mini-cart .canvas-widget-content,
.canvas-mini-cart .canvas-widget-content {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    overflow: hidden !important;
}

/* Products list - scrollable area */
#canvas-mini-cart .cart-item-wrap,
#canvas-mini-cart .products-list,
#canvas-mini-cart .cart-items,
.canvas-mini-cart .cart-item-wrap,
.canvas-mini-cart .products-list {
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    min-height: 0 !important;
    padding-bottom: 10px !important;
}

/* Bottom section - fixed at bottom */
#canvas-mini-cart .card-block-bottom,
.canvas-mini-cart .card-block-bottom {
    flex: 0 0 auto !important;
    position: sticky !important;
    bottom: 0 !important;
    background: #fff !important;
    padding: 15px !important;
    border-top: 1px solid #eee !important;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.08) !important;
    z-index: 10 !important;
    margin-top: auto !important;
}

/* Position checkout badge on a new line below header */
.cart-summary .card-header,
.js-cart-summary .card-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.cart-summary .card-header .wbf-ccp-checkout-badge,
.js-cart-summary .card-header .wbf-ccp-checkout-badge {
    flex-basis: 100%;
    margin-top: 4px;
}

/* Alternative: Badge after h1/title */
.cart-summary h1 + .wbf-ccp-checkout-badge,
.cart-summary .h1 + .wbf-ccp-checkout-badge {
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
}

/* Akira theme checkout adjustments */
.ax-cart-summary .wbf-ccp-checkout-badge {
    margin: 10px 0;
}

/* Make header badges clickable for tooltip */
.cart-nbr,
.js-cart-nbr,
.cart-products-count,
.js-cart-products-count {
    cursor: pointer;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .wbf-ccp-tooltip {
        font-size: 12px;
        padding: 6px 10px;
        max-width: 90vw;
        white-space: normal;
        text-align: center;
    }
    
    .wbf-ccp-checkout-badge {
        font-size: 12px;
        padding: 5px 12px;
    }
}