/**
 * Ellaroza Shop Flow - shared cart icon styles.
 * Kept deliberately small because this file is used outside the cart route.
 */
:root {
    --ellaroza-color-primary: #F198B3;
    --ellaroza-color-secondary: #FF90BB;
    --ellaroza-color-accent: #8ACCD5;
    --ellaroza-color-grey: #6B728E;
    --ellaroza-color-text: #1A1A1A;
    --ellaroza-color-border: #E3E3E3;
    --ellaroza-color-bg: #FFFFFF;
    --ellaroza-color-highlight: #FFD040;
    --ellaroza-color-black: #000000;
    --ellaroza-color-white: #FFFFFF;
    --ellaroza-spacing-xs: 4px;
    --ellaroza-spacing-sm: 8px;
    --ellaroza-spacing-md: 16px;
    --ellaroza-spacing-lg: 24px;
    --ellaroza-spacing-xl: 40px;
    --ellaroza-radius-sm: 4px;
    --ellaroza-radius-md: 7px;
    --ellaroza-font-size-sm: 13px;
    --ellaroza-font-size-base: 14px;
    --ellaroza-font-size-lg: 16px;
    --ellaroza-font-weight-normal: 500;
    --ellaroza-font-weight-bold: 600;
    --ellaroza-transition: 0.2s ease;
}

.custom-cart-wrapper {
    display: inline-block;
    position: relative;
}

.custom-cart-link {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    text-decoration: none;
    transition: opacity var(--ellaroza-transition);
}

.custom-cart-link:hover {
    opacity: 0.8;
}

.your-cart-icon {
    display: block;
    width: 24px;
    height: 24px;
}

.custom-cart-count {
    position: absolute;
    top: -8px;
    right: -8px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 var(--ellaroza-spacing-xs);
    border-radius: 50%;
    background-color: var(--ellaroza-color-primary);
    color: var(--ellaroza-color-bg);
    font-size: 11px;
    font-weight: var(--ellaroza-font-weight-bold);
    line-height: 1;
}

.rtl .custom-cart-count {
    right: auto;
    left: -8px;
}