/* =============================================
   MERAKI GLOBAL STYLES
   Consolidated from inline wp_head hooks for performance
   Created: 2025-12-16
   
   Contains:
   - Product badges (collection + PDP)
   - Button fixes
   - FunnelKit express button fixes
   - Quantity button alignment
   - Cart drawer font sizes
   ============================================= */

/* =============================================
   PRODUCT BADGES
   From: meraki_badge_styles()
   ============================================= */
.meraki-product-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 20;
    padding: 10px 18px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    border-radius: 0;
    color: #fff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.25);
    white-space: nowrap;
    line-height: 1.3;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Bestseller - Metallic Orange/Brown gradient */
.meraki-badge-bestseller {
    background: linear-gradient(135deg, #C89658 0%, #A67842 50%, #8B5A2C 100%);
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.2);
}

/* See the Collab - Metallic Purple/Blue gradient */
.meraki-badge-collab {
    background: linear-gradient(135deg, #7B6FC8 0%, #6058B0 50%, #4B4498 100%);
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.2);
}

/* Architect's Choice - Metallic Dark Blue */
.meraki-badge-architect {
    background: linear-gradient(135deg, #5A7FB5 0%, #3F5E8C 50%, #2A4770 100%);
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.2);
}

/* Designer Approved - Metallic Olive/Green gradient */
.meraki-badge-designer {
    background: linear-gradient(135deg, #9BAA75 0%, #7B8C58 50%, #5F6D40 100%);
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.2);
}

/* Shop/Category page specific */
.products li.product {
    position: relative;
}

.products li.product .meraki-product-badge {
    top: 10px;
    left: 10px;
}

/* Product image wrapper */
.product-thumbnail,
.product-loop-image-wrapper,
.woocommerce-loop-product__link {
    position: relative;
    display: block;
}

/* Single product page positioning */
.single-product .woocommerce-product-gallery {
    position: relative;
}

.single-product .meraki-product-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 100;
}

/* Make sure badges appear above product images */
.woocommerce-product-gallery__wrapper,
.woocommerce-product-gallery__image {
    position: relative;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .meraki-product-badge {
        font-size: 9px;
        padding: 5px 12px;
        top: 8px;
        left: 8px;
    }
}

/* =============================================
   BUTTON FIXES
   From: meraki_fix_all_buttons()
   ============================================= */
/* Fix general button padding - override everything */
.button,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.tm-button,
.product-action .button,
.add_to_cart_button {
    height: auto !important;
    line-height: 1.5 !important;
    min-height: auto !important;
    padding: 12px 24px !important;
}

/* Exception for Instagram widget buttons */
.DesignedButton__button,
.FollowButton {
    padding: 0 20px !important;
}

/* =============================================
   FUNNELKIT EXPRESS BUTTON WIDTH FIX
   From: meraki_fix_fkwcs_inline_width()
   ============================================= */
/* Fix FunnelKit inline express buttons to be responsive */
#fkwcs_stripe_smart_button_wrapper.fkwcs-product.inline {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
}

#fkwcs_stripe_smart_button_wrapper.fkwcs-product.inline #fkwcs_stripe_smart_button,
#fkwcs_stripe_smart_button_wrapper.fkwcs-product.inline #fkwcs_custom_express_button,
#fkwcs_stripe_smart_button_wrapper.fkwcs-product.inline .fkwcs_smart_buttons {
    width: 100% !important;
    max-width: 100% !important;
}

/* Mobile specific */
@media (max-width: 768px) {
    #fkwcs_stripe_smart_button_wrapper.fkwcs-product.inline {
        width: 100% !important;
    }
    
    #fkwcs_stripe_smart_button_wrapper.fkwcs-product.inline .fkwcs_smart_buttons {
        width: 100% !important;
    }
}

/* =============================================
   QUANTITY BUTTONS ALIGNMENT
   From: meraki_fix_quantity_alignment()
   ============================================= */
/* Fix quantity buttons vertical alignment */
.quantity .qty-button,
.quantity button.minus,
.quantity button.plus {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}

.quantity {
    display: flex !important;
    align-items: center !important;
}

.quantity input.qty {
    text-align: center !important;
}

/* =============================================
   FUNNELKIT CART DRAWER FONT SIZES
   From: meraki_fkcart_font_sizes_override()
   ============================================= */
/* FunnelKit Cart - Force font size increases with maximum specificity */

/* Main modal and drawer - increase all base text */
#fkcart-modal,
#fkcart-modal *,
.fkcart-drawer,
.fkcart-drawer * {
    font-size: 16px !important; /* Base was 14px */
}

/* Cart title */
#fkcart-modal .fkcart-drawer-header,
#fkcart-modal .fkcart-title,
.fkcart-title-wrap {
    font-size: 18px !important; /* Was 16px */
}

/* Product names */
#fkcart-modal .fkcart-item-title,
#fkcart-modal .fkcart-item-name,
#fkcart-modal .fkcart--item .fkcart-item-info h4,
.fkcart-item-title a {
    font-size: 16px !important; /* Was 14px */
    line-height: 1.4 !important;
}

/* Prices */
#fkcart-modal .fkcart-item-price,
#fkcart-modal .fkcart-summary-amount,
#fkcart-modal .amount,
.fkcart-item-price bdi {
    font-size: 16px !important; /* Was 14px */
    font-weight: 600 !important;
}

/* Total price - make bigger */
#fkcart-modal .fkcart-order-summary .fkcart-summary-line-item.fkcart-total .fkcart-summary-amount,
#fkcart-modal .order-total .amount {
    font-size: 20px !important; /* Was 18px */
    font-weight: 700 !important;
}

/* Subtotal and summary text */
#fkcart-modal .fkcart-summary-text,
#fkcart-modal .fkcart-subtotal-wrap,
.fkcart-summary-line-item {
    font-size: 16px !important; /* Was 14px */
}

/* Quantity */
#fkcart-modal .fkcart-quantity input,
#fkcart-modal .qty,
.fkcart-item-quantity {
    font-size: 16px !important; /* Was 14px */
}

/* Buttons */
#fkcart-modal button,
#fkcart-modal .button,
#fkcart-modal .fkcart-button,
.fkcart-checkout-btn {
    font-size: 16px !important; /* Was 14px */
    font-weight: 600 !important;
}

/* Product meta/variations */
#fkcart-modal .fkcart-item-meta,
#fkcart-modal .variation,
.fkcart-text-light {
    font-size: 14px !important; /* Was 12px */
}

/* Small text (was 12-13px) */
#fkcart-modal .fkcart-addon-title,
#fkcart-modal .fkcart-text,
.fkcart-free-shipping-text {
    font-size: 15px !important; /* Was 13px */
}

/* Very small text (shipping notice, etc) */
#fkcart-modal small,
#fkcart-modal .fkcart-small-text,
.backorder_notification {
    font-size: 14px !important; /* Was 12px */
}

/* Cart count badge */
.fkcart-count,
.cart-count {
    font-size: 13px !important; /* Was 11px */
}