/* ==========================================
   HAIR PALACE — MODERN CART (compact)
   Smaller fonts, tighter spacing, responsive
========================================== */

:root {
    --hp-mc-ink: #211126;
    --hp-mc-gold: #d4af37;
    --hp-mc-font: "Manrope", system-ui, sans-serif;
}

/* ---------- FLOATING BUTTON ---------- */
#moderncart-floating-cart.moderncart-toggle-slide-out,
#moderncart-floating-cart {
    height: 48px !important;
    bottom: 18px !important;
    right: 14px !important;
    left: auto !important;
    z-index: 9998 !important;
}

#moderncart-floating-cart button.moderncart-floating-cart-button,
#moderncart-floating-cart button {
    height: 48px !important;
    min-width: 48px !important;
    width: 48px !important;
    line-height: 48px !important;
    border-radius: 999px !important;
    box-shadow: 0 6px 16px rgba(33, 17, 38, 0.22) !important;
}

#moderncart-floating-cart .moderncart-floating-cart-icon {
    width: 48px !important;
}

#moderncart-floating-cart .moderncart-floating-cart-icon svg,
#moderncart-floating-cart .moderncart-floating-cart-icon .moderncart-custom-cart-icon {
    width: 22px !important;
    height: 22px !important;
}

#moderncart-floating-cart .moderncart-floating-cart-count {
    font-size: 10px !important;
    height: 18px !important;
    min-width: 18px !important;
    padding: 0 4px !important;
    top: -3px !important;
    left: -3px !important;
    font-family: var(--hp-mc-font) !important;
}

#moderncart-floating-cart .moderncart-floating-cart-button-notification {
    font-size: 11px !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    font-family: var(--hp-mc-font) !important;
    max-width: 160px;
    line-height: 1.25;
}

/* Keep clear of WhatsApp (usually bottom-left) and mobile browser chrome */
@media (max-width: 767px) {
    #moderncart-floating-cart.moderncart-toggle-slide-out,
    #moderncart-floating-cart {
        bottom: calc(14px + env(safe-area-inset-bottom)) !important;
        right: 12px !important;
        height: 44px !important;
    }

    #moderncart-floating-cart button.moderncart-floating-cart-button,
    #moderncart-floating-cart button {
        height: 44px !important;
        min-width: 44px !important;
        width: 44px !important;
        line-height: 44px !important;
    }

    #moderncart-floating-cart .moderncart-floating-cart-icon {
        width: 44px !important;
    }

    #moderncart-floating-cart .moderncart-floating-cart-icon svg,
    #moderncart-floating-cart .moderncart-floating-cart-icon .moderncart-custom-cart-icon {
        width: 20px !important;
        height: 20px !important;
    }
}

/* ---------- SLIDE-OUT PANEL ---------- */
#moderncart-slide-out .moderncart-panel,
#moderncart-slide-out-modal .moderncart-panel,
.moderncart-default-slide-out .moderncart-panel {
    font-family: var(--hp-mc-font) !important;
    font-size: 13px !important;
    max-width: 100%;
}

/* Narrower drawer on tablet/desktop */
@media (min-width: 768px) {
    #moderncart-slide-out .moderncart-panel,
    .moderncart-default-slide-out.moderncart-modal-wrap,
    #moderncart-slide-out-modal .moderncart-default-slide-out {
        width: min(360px, 92vw) !important;
        max-width: 360px !important;
    }
}

@media (max-width: 767px) {
    #moderncart-slide-out .moderncart-panel,
    .moderncart-default-slide-out.moderncart-modal-wrap,
    #moderncart-slide-out-modal .moderncart-default-slide-out {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* Header */
#moderncart-slide-out .moderncart-slide-out-header-heading {
    padding: 12px 14px !important;
    gap: 8px !important;
}

#moderncart-slide-out .moderncart-slide-out-header-title span {
    font-size: 16px !important;
    line-height: 1.25 !important;
    font-family: "Cormorant Garamond", Georgia, serif !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

#moderncart-slide-out .moderncart-slide-out-header-quantity {
    font-size: 12px !important;
    line-height: 1.3 !important;
}

#moderncart-slide-out .moderncart-slide-out-header-close {
    max-height: 22px !important;
    max-width: 22px !important;
}

#moderncart-slide-out .moderncart-slide-out-header-close svg {
    width: 20px !important;
    height: 20px !important;
}

/* Cart items */
.moderncart-cart-item,
.moderncart-cart-item-container {
    gap: 8px !important;
}

.moderncart-cart-item-container {
    padding: 10px 12px !important;
}

.moderncart-cart-item-image,
.moderncart-cart-item-image a {
    width: 64px !important;
    min-width: 64px !important;
}

.moderncart-cart-item-image img {
    width: 64px !important;
    height: 64px !important;
    object-fit: cover !important;
    border-radius: 8px !important;
}

.moderncart-cart-item-product-name,
.moderncart-cart-item-product-link a {
    font-size: 13px !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    font-weight: 600 !important;
    max-width: 100% !important;
    -webkit-line-clamp: 2 !important;
}

.moderncart-price,
.moderncart-cart-item-actions--pricing,
.moderncart-cart-item-actions--pricing .amount {
    font-size: 12px !important;
    line-height: 1.3 !important;
}

.moderncart-cart-item-actions-remove svg {
    width: 16px !important;
    height: 16px !important;
}

#moderncart-slide-out .moderncart-cart-item-quantity-selector {
    margin-top: 4px !important;
    transform: scale(0.92);
    transform-origin: left center;
}

/* Totals / footer */
#moderncart-slide-out .moderncart-slide-out-footer .moderncart-cart-total .moderncart-cart-line-items-item {
    font-size: 12px !important;
    line-height: 1.35 !important;
    padding: 6px 14px !important;
}

#moderncart-slide-out .moderncart-slide-out-footer .moderncart-have-coupon-code-area {
    padding: 0 14px !important;
}

#moderncart-slide-out .moderncart-slide-out-footer button,
#moderncart-slide-out .moderncart-slide-out-footer a.button,
#moderncart-slide-out .moderncart-slide-out-footer .moderncart-button {
    font-size: 12px !important;
    min-height: 40px !important;
    padding: 8px 12px !important;
    border-radius: 10px !important;
    font-family: var(--hp-mc-font) !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

/* Recommendations */
#moderncart-slide-out .moderncart-slide-out-recommendations {
    padding-top: 12px !important;
}

.moderncart-slide-out-recommendations .moderncart-cart-item-product-link a {
    font-size: 12px !important;
    line-height: 1.25 !important;
}

.moderncart-cart-recommended-item-actions {
    margin-top: 6px !important;
    margin-bottom: 14px !important;
}

/* Empty / misc text */
.moderncart-plugin,
.moderncart-modal,
#moderncart-slide-out {
    font-family: var(--hp-mc-font) !important;
}

.moderncart-plugin p,
.moderncart-plugin span,
.moderncart-plugin label,
.moderncart-plugin input,
.moderncart-plugin button {
    font-size: inherit;
}

@media (max-width: 480px) {
    #moderncart-slide-out .moderncart-slide-out-header-title span {
        font-size: 15px !important;
    }

    .moderncart-cart-item-product-name,
    .moderncart-cart-item-product-link a {
        font-size: 12px !important;
    }

    .moderncart-cart-item-image,
    .moderncart-cart-item-image a,
    .moderncart-cart-item-image img {
        width: 56px !important;
        min-width: 56px !important;
        height: 56px !important;
    }

    .moderncart-cart-item-container {
        padding: 8px 10px !important;
    }
}