/* ═══════════════════════════════════════
   Octolab Mini Cart (side drawer)
   ═══════════════════════════════════════ */

/* Desktop-only cart-page redesign. Mobile cart (≤767px) is handled by
   mobile-cart.css. This wrapper prevents the desktop image-220 / qty-127 /
   trash-44 styles from overriding the mobile layout. */
@media (min-width: 768px) {
/* ── Cart line items — MAX specificity to override Elementor post CSS ── */
html body.woocommerce-cart.woocommerce-page .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__image {
    width: 220px !important;
    min-width: 220px !important;
    height: auto !important;
    border-radius: 20px 0 0 20px !important;
    overflow: hidden !important;
    background: transparent !important;
    padding: 0 !important;
    display: table-cell !important;
    vertical-align: top !important;
    position: relative !important;
    align-self: stretch !important;
}
html body.woocommerce-cart.woocommerce-page .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__image img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 0 !important;
}
html body.woocommerce-cart.woocommerce-page .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__image a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}
html body.woocommerce-cart.woocommerce-page .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__image img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    object-fit: cover !important;
    mix-blend-mode: normal !important;
    display: block !important;
}
html body.woocommerce-cart .wc-block-cart-item__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}
html body .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__product .wc-block-components-product-name {
    font-family: "e-Ukraine", sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    color: #fff !important;
    text-decoration: none !important;
    line-height: 1.3 !important;
    max-width: none !important;
}
html body .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__product .wc-block-components-product-price {
    font-family: "Bebas Neue Cyrillic", Sans-serif !important;
    font-size: 28px !important;
    font-weight: 400 !important;
    color: #7C7CFF !important;
}
html body .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__product .wc-block-components-formatted-money-amount,
html body .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__product bdi {
    color: #7C7CFF !important;
}
/* Hide plain text metadata, show as badges instead */
html body .wc-block-cart table.wc-block-cart-items .wc-block-components-product-details {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 4px 0 0 !important;
}
html body .wc-block-cart table.wc-block-cart-items .wc-block-components-product-details li {
    padding: 4px 14px !important;
    border: 1.5px solid #7C7CFF !important;
    border-radius: 999px !important;
    color: #7C7CFF !important;
    font-size: 12px !important;
    background: transparent !important;
    display: inline-block !important;
}
html body .wc-block-cart table.wc-block-cart-items .wc-block-components-product-details__name {
    display: none !important;
}
html body .wc-block-cart table.wc-block-cart-items .wc-block-components-product-details__value {
    color: #7C7CFF !important;
}
/* Price under name */
html body.woocommerce-cart .wc-block-cart-item__prices {
    padding: 0 !important;
}
html body.woocommerce-cart .wc-block-cart-item__prices .wc-block-components-product-price {
    font-family: "Bebas Neue Cyrillic", Sans-serif !important;
    font-size: 28px !important;
    font-weight: 400 !important;
    color: #7C7CFF !important;
}
html body.woocommerce-cart .wc-block-cart-item__prices .wc-block-formatted-money-amount,
html body.woocommerce-cart .wc-block-cart-item__prices bdi {
    color: #7C7CFF !important;
    font-family: inherit !important;
    font-size: inherit !important;
}

/* Actions column — trash + quantity */
html body.woocommerce-cart td.wc-block-cart-item__quantity {
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 10px !important;
    flex-shrink: 0 !important;
}
html body.woocommerce-cart .wc-block-components-quantity-selector {
    border: 1.5px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 999px !important;
    padding: 4px 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    min-width: 140px !important;
}
html body.woocommerce-cart .wc-block-components-quantity-selector__button {
    background: transparent !important;
    border: 0 !important;
    color: #fff !important;
    font-size: 18px !important;
    padding: 0 12px !important;
}
html body.woocommerce-cart .wc-block-components-quantity-selector__input {
    background: transparent !important;
    border: 0 !important;
    color: #fff !important;
    text-align: center !important;
    font-size: 15px !important;
    width: 40px !important;
}
/* Trash icon button */
html body.woocommerce-cart .wc-block-cart-item__remove-link,
html body.woocommerce-cart button.wc-block-cart-item__remove-link {
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
    background: transparent !important;
    border: 1.5px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 50% !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    color: transparent !important;
    font-size: 0 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
html body.woocommerce-cart .wc-block-cart-item__remove-link::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8'%3E%3Cpath d='M3 6h18M8 6V4a2 2 0 012-2h4a2 2 0 012 2v2M19 6l-1 14a2 2 0 01-2 2H8a2 2 0 01-2-2L5 6'/%3E%3C/svg%3E") center no-repeat !important;
}
/* Hide subtotal column (duplicate price) */
html body .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__total {
    display: none !important;
}

/* ── ЗАГАЛЬНА СУМА styling ── */
.wc-block-components-totals-footer-item,
.wc-block-components-totals-footer-item__label,
.wc-block-components-totals-footer-item__value,
.woocommerce-cart .order-total th,
.woocommerce-cart .order-total td,
.woocommerce-cart .cart_totals h2 {
    font-family: "Bebas Neue Cyrillic", Sans-serif !important;
    font-weight: 400 !important;
}
.wc-block-components-totals-footer-item__label,
.woocommerce-cart .order-total th {
    font-size: 28px !important;
    color: #fff !important;
    text-transform: uppercase;
}
html body.woocommerce-cart .wc-block-cart .wc-block-components-totals-footer-item__value,
html body.woocommerce-cart .wc-block-cart .wc-block-components-totals-footer-item__value *,
html body.woocommerce-cart .wc-block-cart .wc-block-components-totals-footer-item__value bdi,
html body.woocommerce-cart .wc-block-cart .wc-block-components-totals-footer-item__value .wc-block-components-formatted-money-amount {
    font-family: "Bebas Neue Cyrillic", Sans-serif !important;
    font-size: 40px !important;
    font-weight: 400 !important;
    line-height: 130% !important;
    color: #7C7CFF !important;
}

/* ── Promocode field (cart page) — both classic & blocks ── */
.woocommerce-cart .coupon,
.woocommerce-cart .checkout_coupon {
    position: relative !important;
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    margin-top: 12px !important;
}
.woocommerce-cart .coupon input[type="text"],
.woocommerce-cart .checkout_coupon input.input-text {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 0 !important;
    color: #fff !important;
    padding: 12px 50px 12px 0 !important;
    font-size: 15px !important;
    width: 100% !important;
    box-shadow: none !important;
}
.woocommerce-cart .coupon input::placeholder,
.woocommerce-cart .checkout_coupon input::placeholder {
    color: #8a8a95 !important;
}
.woocommerce-cart .coupon button,
.woocommerce-cart .coupon .button,
.woocommerce-cart .checkout_coupon button {
    position: absolute !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: 0 !important;
    color: transparent !important;
    padding: 0 !important;
    width: 36px !important;
    height: 36px !important;
    cursor: pointer;
    box-shadow: none !important;
    overflow: hidden;
}
.woocommerce-cart .coupon button::after,
.woocommerce-cart .checkout_coupon button::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'%3E%3Cpath d='M7 17L17 7M17 7H7M17 7v10'/%3E%3C/svg%3E") center no-repeat;
}

/* ── Promocode (WC Blocks variant) — using same specificity as theme overrides ── */
html body .wc-block-cart .wc-block-components-totals-coupon {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 0 !important;
    padding: 16px 0 !important;
}
html body .wc-block-cart .wc-block-components-panel {
    border-bottom: 0 !important;
}
html body .wc-block-cart .wc-block-components-panel__button {
    font-family: "e-Ukraine", sans-serif !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    line-height: 130% !important;
    text-transform: uppercase !important;
    color: #fff !important;
    background: transparent !important;
    text-align: left !important;
}
html body .wc-block-cart .wc-block-components-totals-coupon__form {
    display: block !important;
    position: relative !important;
    gap: 0 !important;
}
html body .wc-block-cart .wc-block-components-totals-coupon__form input,
html body .wc-block-cart .wc-block-components-text-input input {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 0 !important;
    padding: 12px 50px 12px 0 !important;
    color: #fff !important;
    font-size: 15px !important;
    width: 100% !important;
    outline: none !important;
    box-shadow: none !important;
}
html body .wc-block-cart .wc-block-components-totals-coupon__form input:focus {
    border-bottom-color: rgba(255, 255, 255, 0.5) !important;
}
html body .wc-block-cart .wc-block-components-totals-coupon__button {
    position: absolute !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    width: 36px !important;
    height: 36px !important;
    color: transparent !important;
    font-size: 0 !important;
    overflow: hidden !important;
    min-width: 36px !important;
    min-height: 36px !important;
}
html body .wc-block-cart .wc-block-components-totals-coupon__button::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'%3E%3Cpath d='M7 17L17 7M17 7H7M17 7v10'/%3E%3C/svg%3E") center no-repeat !important;
}
.wc-block-components-totals-coupon .wc-block-components-totals-coupon__button-text,
.wc-block-components-totals-coupon-link,
.wc-block-components-panel__button {
    font-family: "Bebas Neue Cyrillic", Sans-serif !important;
    font-size: 24px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    color: #fff !important;
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    text-align: left !important;
}
.wc-block-components-totals-coupon-link {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0 !important;
    text-decoration: none !important;
}
.wc-block-components-totals-coupon-link::after {
    content: "";
    display: inline-block;
    width: 14px;
    height: 8px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' fill='none'%3E%3Cpath d='M1 7l6-6 6 6' stroke='%23fff' stroke-width='1.8' fill='none'/%3E%3C/svg%3E") center no-repeat;
}
.wc-block-components-totals-coupon-link[aria-expanded="false"]::after {
    transform: rotate(180deg);
}
.wc-block-components-totals-coupon__form,
.wc-block-components-totals-coupon__content {
    margin-top: 0 !important;
    padding: 0 !important;
}
.wc-block-components-totals-coupon input[type="text"],
.wc-block-components-text-input input,
.wc-block-components-totals-coupon__input input,
.wc-block-components-totals-coupon__input,
.wc-block-components-totals-coupon__form .wc-block-components-text-input {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 0 !important;
    color: #fff !important;
    padding: 12px 0 !important;
    font-size: 15px !important;
    box-shadow: none !important;
    width: 100% !important;
}
.wc-block-components-totals-coupon__form .wc-block-components-text-input label {
    display: none !important;
}
.wc-block-components-totals-coupon input::placeholder,
.wc-block-components-text-input input::placeholder {
    color: #8a8a95 !important;
}
.wc-block-components-totals-coupon__button,
button.wc-block-components-totals-coupon__button {
    position: absolute !important;
    right: 0 !important;
    top: 8px !important;
    background: transparent !important;
    border: 0 !important;
    color: transparent !important;
    padding: 0 !important;
    font-size: 0 !important;
    width: 36px !important;
    height: 36px !important;
    cursor: pointer;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: hidden;
    text-indent: -9999px;
}
.wc-block-components-totals-coupon__button::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'%3E%3Cpath d='M7 17L17 7M17 7H7M17 7v10'/%3E%3C/svg%3E") center no-repeat;
}
.wc-block-components-totals-coupon__form {
    position: relative !important;
    display: flex !important;
}
} /* end @media (min-width: 768px) — desktop cart-page styles */

/* Hide only product grid on empty cart page (keep notification) */
.woocommerce-cart .wc-block-grid,
.woocommerce-cart .wc-block-product-categories,
.woocommerce-cart .wc-empty-cart-message + h2,
.woocommerce-cart .wp-block-heading + .wc-block-grid {
    display: none !important;
}

/* Remove dark overlay */
.elementor-menu-cart__container {
    background: transparent !important;
    pointer-events: none !important;
}
/* Desktop side-drawer frame per Figma 213:9159 (502px): #4a4a99 4px stroke on
   top/left/bottom only (right edge is flush to the viewport), rounded LEFT
   corners (32px), purple glow. Mobile bottom-sheet variant is below in the
   @media (max-width:767px) block. */
.elementor-menu-cart__main {
    background: #131313 !important;
    color: #fff !important;
    width: 502px !important;
    max-width: 100vw !important;
    pointer-events: auto !important;
    border: 4px solid #4a4a99 !important;
    border-right: 0 !important;
    border-radius: 32px 0 0 32px !important;
    box-shadow: 0 0 10px 0 #5544e5, 0 0 1px 0 #6251f3 !important;
}

/* Fix item image sizing */
.oct-mini-cart__item-img {
    width: 80px !important;
    height: 80px !important;
}

/* Fix product name width */
.oct-mini-cart__item-name {
    display: block;
    width: 100%;
}

.oct-mini-cart {
    padding: 32px 24px;
    color: #fff;
    position: relative;
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    max-height: 100vh !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
/* Mobile bottom-sheet uses wider top / narrow side padding per Figma 293:19348 */
@media (max-width: 767px) {
.oct-mini-cart {
    padding: 40px 16px;
}
}
/* Position context for the absolute close button + zero Elementor default
   padding (inner .oct-mini-cart provides the padding) — both breakpoints. */
.elementor-menu-cart__main {
    position: relative !important;
    padding: 0 !important;
}
/* Mobile bottom-sheet frame per Figma 293:19348 (375px): solid #131313 fill,
   light-purple stroke 4px, purple glow stack, 32px top corners, zero Elementor
   padding (inner .oct-mini-cart 40/16 padding only). Desktop keeps the clean
   dark side drawer defined above (box-shadow -8px, no border/radius). */
@media (max-width: 767px) {
.elementor-menu-cart__main {
    background: #131313 !important;
    border: 4px solid #7C7CFF !important;
    border-bottom: 0 !important;
    border-radius: 32px 32px 0 0 !important;
    padding: 0 !important;
    box-shadow:
        0 0 2px 0 rgba(124, 124, 255, 1),
        0 0 20px 0 rgba(85, 68, 229, 0.85),
        0 0 40px 0 rgba(85, 68, 229, 0.55) !important;
}
}
/* Pin the cart drawer to the right edge of the viewport (Elementor centers it
   by default). Affects every breakpoint. */
.elementor-menu-cart__container,
.elementor-lightbox .elementor-menu-cart__main {
    margin-left: auto !important;
    margin-right: 0 !important;
}
.elementor-menu-cart__container {
    justify-content: flex-end !important;
    align-items: flex-start !important;
}
/* Inner content stays left-aligned (parent text-align right was leaking in) */
.oct-mini-cart,
.elementor-menu-cart__main,
.oct-mini-cart__title,
.oct-mini-cart__empty,
.oct-mini-cart__empty-title,
.oct-mini-cart__empty-lead,
.widget_shopping_cart_content {
    text-align: left !important;
}

/* Close (X) button — bright white, top-right, 24×24 strokes per Figma */
.elementor-menu-cart__close-button {
    position: absolute !important;
    top: 46px !important;
    right: 30px !important;
    width: 24px !important;
    height: 24px !important;
    z-index: 10 !important;
    cursor: pointer !important;
}
@media (max-width: 767px) {
.elementor-menu-cart__close-button {
    top: 36px !important;
    right: 16px !important;
}
}
.elementor-menu-cart__close-button::before,
.elementor-menu-cart__close-button::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    width: 24px !important;
    height: 2px !important;
    background: #F9F9F9 !important;
    border-radius: 1px !important;
}
.elementor-menu-cart__close-button::before {
    transform: translateY(-50%) rotate(45deg) !important;
}
.elementor-menu-cart__close-button::after {
    transform: translateY(-50%) rotate(-45deg) !important;
}
.elementor-menu-cart__main {
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden !important;
}
.oct-mini-cart__items {
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    min-height: 0 !important;
}
.oct-mini-cart__totals,
.oct-mini-cart__buttons,
.oct-mini-cart__title {
    flex-shrink: 0 !important;
}
.oct-mini-cart__empty {
    flex: 1 1 auto !important;
    overflow-y: auto !important;
}
/* Custom scrollbar */
.oct-mini-cart__items::-webkit-scrollbar {
    width: 6px;
}
.oct-mini-cart__items::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.2);
    border-radius: 3px;
}
.oct-mini-cart__items::-webkit-scrollbar-track {
    background: transparent;
}
.oct-mini-cart__title {
    font-family: "Bebas Neue Cyrillic", Sans-serif !important;
    font-size: 60px !important;
    font-weight: 400 !important;
    line-height: 0.9 !important;
    letter-spacing: -0.66px !important;
    text-transform: uppercase;
    margin: 0 0 24px !important;
    color: #fff !important;
}
@media (max-width: 767px) {
.oct-mini-cart__title {
    font-size: 42px !important;
    letter-spacing: -0.462px !important;
}
}

/* Items */
.oct-mini-cart__items {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 24px !important;
}
.oct-mini-cart__item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    list-style: none !important;
}
.oct-mini-cart__item-img {
    width: 80px;
    height: 100px;
    flex-shrink: 0;
    border-radius: 10px;
    overflow: hidden;
    background: linear-gradient(135deg, #1a1a2e 0%, #3a2a7a 100%);
}
.oct-mini-cart__item-img a {
    display: block;
    width: 100%;
    height: 100%;
}
.oct-mini-cart__item-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}
.oct-mini-cart__item-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.oct-mini-cart__item-name {
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 500;
    text-decoration: none !important;
    line-height: 1.3;
}
.oct-mini-cart__item-attrs {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}
.oct-mini-cart__item-badge {
    font-size: 11px;
    padding: 2px 10px;
    border-radius: 999px;
    border: 1px solid #7C7CFF;
    color: #7C7CFF;
}
.oct-mini-cart__item-price {
    font-family: "e-Ukraine", sans-serif !important;
    font-weight: 500 !important;
    font-size: 18px !important;
    line-height: 1.5 !important;
    text-transform: uppercase !important;
    color: #7C7CFF !important;
}

/* Actions */
.oct-mini-cart__item-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    min-width: 100px;
}
/* Remove (trash) — Figma 293:19335: 32×32 rounded box, rgba(255,255,255,0.3)
   background, 14px backdrop blur. Material-symbols delete-outline icon (same
   SVG as desktop cart) painted via mask so it inherits color. */
.oct-mini-cart__remove {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 32px !important;
    background: rgba(255, 255, 255, 0.3) !important;
    -webkit-backdrop-filter: blur(14px) !important;
            backdrop-filter: blur(14px) !important;
    color: #F9F9F9 !important;
    text-decoration: none !important;
    font-size: 0 !important;
    transition: background 0.15s !important;
}
.oct-mini-cart__remove:hover {
    background: rgba(255, 255, 255, 0.45) !important;
    color: #F9F9F9 !important;
}
.oct-mini-cart__remove svg {
    display: none !important;
}
.oct-mini-cart__remove::before {
    content: "" !important;
    display: block !important;
    width: 16px !important;
    height: 18px !important;
    background-color: #F9F9F9 !important;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 14 16' fill='none'><path d='M2.59887 15.6667C2.15711 15.6667 1.77927 15.5094 1.46534 15.1948C1.15141 14.8802 0.994118 14.503 0.993455 14.0633V1.7584H0.496731C0.355661 1.7584 0.237772 1.71072 0.143063 1.61535C0.0483547 1.51998 0.000669103 1.40176 6.80443e-06 1.26069C-0.000655495 1.11962 0.0470301 1.00173 0.143063 0.907018C0.239097 0.81231 0.356986 0.764955 0.496731 0.764955H3.9738C3.9738 0.559643 4.04996 0.380822 4.20229 0.228493C4.35462 0.0761644 4.53344 0 4.73876 0H9.16954C9.37485 0 9.55367 0.0761644 9.706 0.228493C9.85833 0.380822 9.93449 0.559643 9.93449 0.764955H13.4116C13.5526 0.764955 13.6705 0.812641 13.7652 0.908012C13.8599 1.00338 13.9076 1.1216 13.9083 1.26267C13.9089 1.40374 13.8613 1.52163 13.7652 1.61634C13.6692 1.71105 13.5513 1.7584 13.4116 1.7584H12.9148V14.0623C12.9148 14.5034 12.7575 14.8809 12.4429 15.1948C12.1284 15.5087 11.7508 15.666 11.3104 15.6667H2.59887ZM11.9214 1.7584H1.9869V14.0623C1.9869 14.2404 2.04419 14.3868 2.15877 14.5014C2.27335 14.6159 2.42005 14.6732 2.59887 14.6732H11.3104C11.4886 14.6732 11.6349 14.6159 11.7495 14.5014C11.8641 14.3868 11.9214 14.2404 11.9214 14.0623V1.7584ZM5.27323 12.6863C5.4143 12.6863 5.53252 12.6387 5.62789 12.5433C5.72326 12.4479 5.77062 12.33 5.76996 12.1896V4.24202C5.76996 4.10096 5.72227 3.98307 5.6269 3.88836C5.53153 3.79365 5.41331 3.74596 5.27224 3.7453C5.13117 3.74464 5.01328 3.79232 4.91857 3.88836C4.82386 3.98439 4.77651 4.10228 4.77651 4.24202V12.1896C4.77651 12.3307 4.82419 12.4486 4.91956 12.5433C5.01493 12.6387 5.13282 12.6863 5.27323 12.6863ZM8.63605 12.6863C8.77712 12.6863 8.89501 12.6387 8.98972 12.5433C9.08443 12.4479 9.13179 12.33 9.13179 12.1896V4.24202C9.13179 4.10096 9.0841 3.98307 8.98873 3.88836C8.89336 3.79299 8.77547 3.7453 8.63506 3.7453C8.49399 3.7453 8.37577 3.79299 8.2804 3.88836C8.18503 3.98373 8.13767 4.10162 8.13834 4.24202V12.1896C8.13834 12.3307 8.18602 12.4486 8.28139 12.5433C8.37677 12.638 8.49498 12.6857 8.63605 12.6863Z' fill='%23000'/></svg>") !important;
            mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 14 16' fill='none'><path d='M2.59887 15.6667C2.15711 15.6667 1.77927 15.5094 1.46534 15.1948C1.15141 14.8802 0.994118 14.503 0.993455 14.0633V1.7584H0.496731C0.355661 1.7584 0.237772 1.71072 0.143063 1.61535C0.0483547 1.51998 0.000669103 1.40176 6.80443e-06 1.26069C-0.000655495 1.11962 0.0470301 1.00173 0.143063 0.907018C0.239097 0.81231 0.356986 0.764955 0.496731 0.764955H3.9738C3.9738 0.559643 4.04996 0.380822 4.20229 0.228493C4.35462 0.0761644 4.53344 0 4.73876 0H9.16954C9.37485 0 9.55367 0.0761644 9.706 0.228493C9.85833 0.380822 9.93449 0.559643 9.93449 0.764955H13.4116C13.5526 0.764955 13.6705 0.812641 13.7652 0.908012C13.8599 1.00338 13.9076 1.1216 13.9083 1.26267C13.9089 1.40374 13.8613 1.52163 13.7652 1.61634C13.6692 1.71105 13.5513 1.7584 13.4116 1.7584H12.9148V14.0623C12.9148 14.5034 12.7575 14.8809 12.4429 15.1948C12.1284 15.5087 11.7508 15.666 11.3104 15.6667H2.59887ZM11.9214 1.7584H1.9869V14.0623C1.9869 14.2404 2.04419 14.3868 2.15877 14.5014C2.27335 14.6159 2.42005 14.6732 2.59887 14.6732H11.3104C11.4886 14.6732 11.6349 14.6159 11.7495 14.5014C11.8641 14.3868 11.9214 14.2404 11.9214 14.0623V1.7584ZM5.27323 12.6863C5.4143 12.6863 5.53252 12.6387 5.62789 12.5433C5.72326 12.4479 5.77062 12.33 5.76996 12.1896V4.24202C5.76996 4.10096 5.72227 3.98307 5.6269 3.88836C5.53153 3.79365 5.41331 3.74596 5.27224 3.7453C5.13117 3.74464 5.01328 3.79232 4.91857 3.88836C4.82386 3.98439 4.77651 4.10228 4.77651 4.24202V12.1896C4.77651 12.3307 4.82419 12.4486 4.91956 12.5433C5.01493 12.6387 5.13282 12.6863 5.27323 12.6863ZM8.63605 12.6863C8.77712 12.6863 8.89501 12.6387 8.98972 12.5433C9.08443 12.4479 9.13179 12.33 9.13179 12.1896V4.24202C9.13179 4.10096 9.0841 3.98307 8.98873 3.88836C8.89336 3.79299 8.77547 3.7453 8.63506 3.7453C8.49399 3.7453 8.37577 3.79299 8.2804 3.88836C8.18503 3.98373 8.13767 4.10162 8.13834 4.24202V12.1896C8.13834 12.3307 8.18602 12.4486 8.28139 12.5433C8.37677 12.638 8.49498 12.6857 8.63605 12.6863Z' fill='%23000'/></svg>") !important;
    -webkit-mask-position: center !important; mask-position: center !important;
    -webkit-mask-repeat: no-repeat !important; mask-repeat: no-repeat !important;
    -webkit-mask-size: contain !important; mask-size: contain !important;
}
.oct-mini-cart__qty {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    padding: 2px;
}
.oct-qty-btn {
    background: transparent;
    border: 0;
    color: #fff;
    cursor: pointer;
    width: 24px;
    height: 24px;
    font-size: 14px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.oct-qty-btn,
.oct-qty-btn:hover,
.oct-qty-btn:focus,
.oct-qty-btn:active,
button.oct-qty-btn,
button.oct-qty-btn:hover,
button.oct-qty-btn:focus,
button.oct-qty-btn:active {
    background: transparent !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}
.oct-qty-btn:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.08) !important;
}
.oct-mini-cart__qty span {
    min-width: 20px;
    text-align: center;
    font-size: 13px;
}
.oct-mini-cart__count {
    font-size: 12px;
    color: #8a8a95;
}
.oct-mini-cart__stock {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.02em;
    text-align: right;
    display: block;
}
.oct-mini-cart__stock--limit {
    color: #ff4d5a;
}
.oct-mini-cart__stock--out {
    color: #7C7CFF;
    font-size: 13px;
    font-weight: 600;
}

/* Loading state — show spinner on totals, skeleton values */
.oct-mini-cart {
    position: relative;
}
.oct-mini-cart.is-loading .oct-mini-cart__totals {
    position: relative;
}
.oct-mini-cart.is-loading .oct-mini-cart__totals::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(19, 19, 19, 0.75);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    z-index: 2;
    border-radius: 8px;
}
.oct-mini-cart.is-loading .oct-mini-cart__totals::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 28px;
    height: 28px;
    margin: -14px 0 0 -14px;
    border: 2.5px solid rgba(124, 124, 255, 0.25);
    border-top-color: #7C7CFF;
    border-radius: 50%;
    animation: oct-mc-spin 0.7s linear infinite;
    z-index: 3;
}
.oct-mini-cart.is-loading .oct-qty-btn,
.oct-mini-cart.is-loading .oct-mini-cart__remove {
    pointer-events: none;
}
.oct-mini-cart.is-loading .oct-mini-cart__buttons {
    position: relative;
    pointer-events: none;
    opacity: 0.5;
    filter: grayscale(0.4);
    transition: opacity 0.15s ease;
}
.oct-mini-cart.is-loading .oct-mini-cart__buttons a {
    pointer-events: none !important;
    cursor: wait !important;
}
@keyframes oct-mc-spin {
    to { transform: rotate(360deg); }
}

/* Totals */
.oct-mini-cart__totals {
    padding: 16px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.oct-mini-cart__row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    font-size: 13px;
    color: #b8b8c4;
    text-transform: uppercase;
    font-weight: 600;
}
.oct-mini-cart__row strong {
    color: #fff;
    font-weight: 600;
}
.oct-mini-cart__note {
    font-size: 11px;
    color: #8a8a95;
    margin: 8px 0 16px;
    line-height: 1.4;
}
.oct-mini-cart__total {
    padding: 16px 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    align-items: baseline;
    text-transform: uppercase;
}
.oct-mini-cart__total span {
    font-family: "Bebas Neue Cyrillic", Sans-serif;
    font-size: 24px;
    line-height: 0.9;
    letter-spacing: -0.011em;
    color: #F9F9F9;
}
.oct-mini-cart__total strong,
.oct-mini-cart__total strong .woocommerce-Price-amount,
.oct-mini-cart__total strong .woocommerce-Price-amount bdi,
.oct-mini-cart__total strong .woocommerce-Price-currencySymbol {
    font-family: "Bebas Neue Cyrillic", Sans-serif !important;
    font-size: 40px !important;
    line-height: 1.3 !important;
    letter-spacing: -0.011em !important;
    color: #7C7CFF !important;
    font-weight: 400 !important;
}
/* Hide secondary "Переглянути кошик" button — not in Figma 293:19348 */
.oct-mini-cart__view {
    display: none !important;
}

/* Buttons */
.oct-mini-cart__buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
}
.oct-mini-cart__checkout {
    display: block !important;
    text-align: center;
    background: #5B49F3 !important;
    color: #fff !important;
    border: 0;
    border-radius: 999px;
    padding: 14px 28px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    transition: background 0.15s;
}
.oct-mini-cart__checkout:hover {
    background: #4a3ad4 !important;
}
/* "Переглянути кошик" secondary button — not in Figma 293:19348, hidden site-wide */
.oct-mini-cart__view,
a.oct-mini-cart__view {
    display: none !important;
}

/* Empty state — Figma 293:19350: title in Bebas, lead text, big octoman */
.oct-mini-cart__empty {
    text-align: left;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.oct-mini-cart__empty-title,
.oct-mini-cart__empty h3 {
    font-family: "Bebas Neue Cyrillic", "Bebas Neue", sans-serif !important;
    font-size: 42px !important;
    font-weight: 400 !important;
    line-height: 0.9 !important;
    letter-spacing: -0.462px !important;
    text-transform: uppercase !important;
    color: #F9F9F9 !important;
    margin: 16px 0 16px !important;
}
.oct-mini-cart__empty-lead,
.oct-mini-cart__empty p {
    font-family: "e-Ukraine", sans-serif !important;
    font-weight: 200 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    letter-spacing: -0.154px !important;
    color: #F9F9F9 !important;
    margin: 0 0 24px !important;
}
.oct-mini-cart__empty-img,
.oct-mini-cart__empty img {
    width: 100% !important;
    max-width: 460px !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    align-self: center !important;
}

/* ═══════════════════════════════════════
   Full cart page — item card layout
   Turn WC Blocks cart rows into individual outlined cards
   to match the design (rounded border, radial blue image bg)
   ═══════════════════════════════════════ */
html body.woocommerce-cart .wc-block-cart table.wc-block-cart-items,
html body.woocommerce-cart .wc-block-cart .wc-block-cart-items {
    display: block !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
}
html body.woocommerce-cart .wc-block-cart .wc-block-cart-items thead {
    display: none !important;
}
html body.woocommerce-cart .wc-block-cart .wc-block-cart-items tbody {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}
html body.woocommerce-cart .wc-block-cart .wc-block-cart-items__row {
    display: grid !important;
    grid-template-columns: 180px 1fr auto !important;
    align-items: center !important;
    gap: 20px !important;
    position: relative !important;
    background: #131313 !important;
    border: 1px solid transparent !important;
    border-radius: 20px !important;
    padding: 0 24px 0 0 !important;
    background-image:
        linear-gradient(#131313, #131313),
        linear-gradient(135deg, #5B49F3 0%, rgba(91, 73, 243, 0.15) 40%, rgba(255, 255, 255, 0.15) 100%) !important;
    background-origin: border-box !important;
    background-clip: padding-box, border-box !important;
}
html body.woocommerce-cart .wc-block-cart .wc-block-cart-items__row > td {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}
/* Product info column */
html body.woocommerce-cart .wc-block-cart .wc-block-cart-item__product {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding-right: 40px !important;
}
/* Quantity + remove column */
html body.woocommerce-cart .wc-block-cart td.wc-block-cart-item__quantity {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    min-width: 160px !important;
}
/* Trash icon positioned top-right inside the card */
html body.woocommerce-cart .wc-block-cart-item__remove-link,
html body.woocommerce-cart button.wc-block-cart-item__remove-link {
    top: 12px !important;
    right: 12px !important;
    width: 32px !important;
    height: 32px !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
/* Hide the stray "x ..." link text under thumbnail if any */
html body.woocommerce-cart .wc-block-cart .wc-block-cart-item__image + .wc-block-cart-item__remove-link {
    display: none !important;
}

/* Out-of-stock / limit labels inside qty column */
html body.woocommerce-cart .wc-block-cart .wc-block-components-product-badge {
    border: 1px solid #ff6b7a !important;
    color: #ff6b7a !important;
    border-radius: 999px !important;
    padding: 4px 12px !important;
    font-size: 12px !important;
    background: transparent !important;
}

/* Responsive: stack on mobile */
@media (max-width: 640px) {
    html body.woocommerce-cart .wc-block-cart .wc-block-cart-items__row {
        grid-template-columns: 100px 1fr !important;
        grid-template-areas: "img info" "qty qty" !important;
        gap: 14px !important;
        padding: 14px !important;
    }
    html body.woocommerce-cart .wc-block-cart .wc-block-cart-item__product {
        grid-area: info !important;
        padding-right: 48px !important;
    }
    html body.woocommerce-cart .wc-block-cart td.wc-block-cart-item__quantity {
        grid-area: qty !important;
        justify-content: space-between !important;
    }
}

/* =========================================================== */
/* Header cart toggle counter — Figma 190:17638                */
/* Purple dot at bottom-right of bag icon, no number,          */
/* hidden when cart is empty (data-counter="0").               */
/* =========================================================== */

.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button .elementor-button-icon {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 0 !important;
}

.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button .elementor-button-icon-qty {
    position: absolute !important;
    top: auto !important;
    left: auto !important;
    bottom: 3px !important;
    right: 2px !important;
    width: 7px !important;
    min-width: 7px !important;
    height: 7px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #7C7CFF !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    border: none !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    pointer-events: none;
}

.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button .elementor-button-icon-qty[data-counter="0"] {
    display: none !important;
}
