.mini-cart-element .mini-cart-header {
    position: relative;
}

.mini-cart-element .cart-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mini-cart-element .cart-icon {
    color: #000;
}

.mini-cart-element .cart-icon svg,
.mini-cart-element .cart-icon .ah-theme-icon img {
    width: 20px;
    height: 20px;
}

/* Fixed popup width so long product titles wrap instead of widening the popup */
.mini-cart-element .mini-cart-header-content {
    width: 300px;
    max-width: 100vw;
}

.mini-cart-element .mini-cart-header-content .mini-cart-item-data {
    overflow-wrap: anywhere;
}

/* Compact remove button with an SVG close icon; outranks .woocommerce-mini-cart .woocommerce-mini-cart-item a.remove.
   The icon color is set on ::before because WooCommerce forces the link color on hover */
.mini-cart-element .woocommerce-mini-cart .woocommerce-mini-cart-item a.remove,
.mini-cart-element .woocommerce-mini-cart .woocommerce-mini-cart-item a.remove:hover {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin: 0;
    margin-inline-end: 6px;
    padding: 0;
    border-radius: 50%;
    background: none;
    font-size: 0;
    line-height: 0;
}

.mini-cart-element .woocommerce-mini-cart .woocommerce-mini-cart-item a.remove::before {
    content: '';
    width: 14px;
    height: 14px;
    background-color: #6b7280;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / contain no-repeat;
    transition: background-color .2s ease;
}

.mini-cart-element .woocommerce-mini-cart .woocommerce-mini-cart-item a.remove:hover::before,
.mini-cart-element .woocommerce-mini-cart .woocommerce-mini-cart-item a.remove:focus-visible::before {
    background-color: #dc2626;
}

/* Item price reads clearly; the widget's Item Price Color control overrides the color */
.mini-cart-element .mini-cart-header-content .quantity {
    color: var(--main-text-color, #181522);
    font-weight: 400;
}

.mini-cart-element .mini-cart-header-content .widget_shopping_cart_content {
    width: 100%;
}

/* Checkout button defaults to the theme button colors. Outranks body.woocommerce .woocommerce-mini-cart__buttons a.button.checkout;
   the widget's style controls use a more specific selector and override these */
.mini-cart-element .mini-cart-header-content .woocommerce-mini-cart__buttons a.button.checkout {
    border-color: var(--ahura-theme-primary, #1d67e8);
    background: var(--ahura-theme-primary, #1d67e8);
    color: var(--ahura-theme-secondary, #fff);
    box-shadow: none;
}