/* Contextual icons and brand color, with native WooCommerce behavior intact. */
:root {
 --baby-mama-icon-basket: url('../icons/basket.svg');
 --baby-mama-icon-menu: url('../icons/menu.svg');
 --baby-mama-icon-user: url('../icons/user.svg');
 --baby-mama-icon-tag: url('../icons/tag.svg');
 --baby-mama-icon-truck: url('../icons/truck.svg');
 --baby-mama-icon-help: url('../icons/help.svg');
 --baby-mama-icon-package: url('../icons/package.svg');
 --baby-mama-icon-arrow: url('../icons/arrow-left.svg');
}
/* CSS masks are decorative: the native text/ARIA labels remain the names. */
.baby-mama-cart-trigger .wc-block-mini-cart__quantity-badge::before,
.baby-mama-primary-navigation .wp-block-navigation__responsive-container-open::before,
.baby-mama-account-trigger .wc-block-customer-account__visual::before,
.woocommerce-cart .baby-mama-compact-row h1::before,
.wc-block-mini-cart__drawer .wc-block-mini-cart__title::before,
.baby-mama-back-icon,
.wc-block-cart .wc-block-components-totals-coupon .wc-block-components-panel__button::before,
.wc-block-cart__submit-button .wc-block-components-button__text::after,
.wc-block-mini-cart__footer-checkout .wc-block-components-button__text::after,
.wp-block-woocommerce-product-button .product_type_simple.add_to_cart_button::before,
.baby-mama-trust-item strong::before {
 content: '';
 display: inline-block;
 flex: 0 0 24px;
 inline-size: 24px;
 block-size: 24px;
 background-color: currentColor;
 mask: var(--baby-mama-icon, var(--baby-mama-icon-basket)) center / contain no-repeat;
}
.baby-mama-cart-trigger .wc-block-mini-cart__button {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 8px;
 box-sizing: border-box;
 min-block-size: 44px;
 block-size: 44px;
 padding: 8px 12px;
 border: 1px solid var(--wp--preset--color--brand-purple-soft);
 border-radius: 12px;
 background: var(--wp--preset--color--brand-purple-soft);
 color: var(--wp--preset--color--brand-purple);
}
.baby-mama-cart-trigger .wc-block-mini-cart__button::after { display: block; color: inherit; font-weight: 600; line-height: 20px; }
.baby-mama-cart-trigger .wc-block-mini-cart__quantity-badge { position: relative; display: flex; align-items: center; }
.baby-mama-cart-trigger .wc-block-mini-cart__badge {
 position: absolute;
 inset-block-start: -8px;
 inset-inline-end: -8px;
 margin: 0;
 min-inline-size: 18px;
 block-size: 18px;
 padding: 0 3px;
 border-radius: 999px;
 background: var(--wp--preset--color--brand-pink-dark) !important;
 color: var(--wp--preset--color--surface) !important;
 font-size: 11px;
 line-height: 18px;
 box-shadow: 0 0 0 2px var(--wp--preset--color--brand-purple-soft);
}
.baby-mama-primary-navigation .wp-block-navigation__responsive-container-open {
 --baby-mama-icon: var(--baby-mama-icon-menu);
 display: inline-flex;
 align-items: center;
 gap: 6px;
 box-sizing: border-box;
 block-size: 44px;
 padding: 10px 0;
 color: var(--wp--preset--color--brand-purple);
}
.baby-mama-primary-navigation .wp-block-navigation__responsive-container-open::after { display: block; font-weight: 600; line-height: 20px; }
.baby-mama-account-trigger .wc-block-customer-account__visual { --baby-mama-icon: var(--baby-mama-icon-user); display: flex; align-items: center; inline-size: 20px; block-size: 20px; }
.baby-mama-cart-trigger .wc-block-mini-cart__quantity-badge::before,
.baby-mama-primary-navigation .wp-block-navigation__responsive-container-open::before,
.baby-mama-account-trigger .wc-block-customer-account__visual::before { flex-basis: 20px; inline-size: 20px; block-size: 20px; }
.baby-mama-account-trigger .wc-block-customer-account__visual > :is(svg,img) { display: none; }
.baby-mama-account-trigger a { box-sizing: border-box; gap: 6px; padding-block: 0; color: var(--wp--preset--color--brand-purple); }
/* A recognizable cart header and a visible route back to shopping. */
.baby-mama-compact-row { grid-template-columns: auto minmax(0,1fr); gap: 16px; min-block-size: 72px; }
.baby-mama-compact-row .baby-mama-back-link { grid-column: 1; grid-row: 1; justify-self: start; }
.baby-mama-compact-row h1 { grid-column: 2; grid-row: 1; padding: 0; text-align: end; justify-content: flex-end; }
.baby-mama-back-link a { inline-size: auto; min-inline-size: 80px; gap: 6px; color: var(--wp--preset--color--brand-purple); }
.baby-mama-back-icon { --baby-mama-icon: var(--baby-mama-icon-arrow); flex-basis: 20px; inline-size: 20px; block-size: 20px; }
[dir="rtl"] .baby-mama-back-icon { transform: scaleX(-1); }
.baby-mama-back-label { font-size: 14px; font-weight: 600; }
.woocommerce-cart .baby-mama-compact-header { background: var(--wp--preset--color--brand-purple); border: 0; }
.woocommerce-cart .baby-mama-compact-row h1 { display: flex; align-items: center; gap: 10px; color: var(--wp--preset--color--surface); font-size: 22px; }
.woocommerce-cart .baby-mama-back-link a { color: var(--wp--preset--color--surface); }
.woocommerce-cart .baby-mama-back-link a:focus-visible { outline-color: var(--wp--preset--color--surface); }
/* Keep table geometry native; tint the summary and controls to create hierarchy. */
.woocommerce-cart .wc-block-cart__sidebar {
 box-sizing: border-box;
 padding: 24px;
 border: 1px solid var(--wp--preset--color--accent-border);
 border-radius: 20px;
 background: var(--wp--preset--color--brand-purple-soft);
}
.woocommerce-cart .wc-block-cart__totals-title { color: var(--wp--preset--color--brand-purple-dark); }
.woocommerce-cart .wc-block-cart .wc-block-components-totals-footer-item { color: var(--wp--preset--color--brand-purple-dark); }
.woocommerce-cart .wc-block-cart__submit-container { background: transparent; }
.woocommerce-cart .wc-block-cart__submit-container--sticky { background: var(--wp--preset--color--surface); }
.wc-block-cart .wc-block-components-totals-coupon .wc-block-components-panel__button {
 --baby-mama-icon: var(--baby-mama-icon-tag);
 display: flex;
 align-items: center;
 gap: 8px;
 min-block-size: 44px;
 color: var(--wp--preset--color--brand-purple-dark);
}
.wc-block-cart .wc-block-components-totals-coupon .wc-block-components-panel__button::before { flex-basis: 20px; inline-size: 20px; block-size: 20px; }
.wc-block-cart__submit-button .wc-block-components-button__text,
.wc-block-mini-cart__footer-checkout .wc-block-components-button__text { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.wc-block-cart__submit-button .wc-block-components-button__text::after,
.wc-block-mini-cart__footer-checkout .wc-block-components-button__text::after { --baby-mama-icon: var(--baby-mama-icon-arrow); flex-basis: 20px; inline-size: 20px; block-size: 20px; }
:is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-components-quantity-selector {
 inline-size: 134px;
 min-inline-size: 134px;
 flex-basis: 134px;
 border: 1px solid var(--wp--preset--color--accent-border-strong);
 border-radius: 10px;
 overflow: hidden;
 background: var(--wp--preset--color--surface);
}
:is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-components-quantity-selector > button {
 background: var(--wp--preset--color--brand-purple-soft);
 color: var(--wp--preset--color--brand-purple);
 opacity: 1;
}
:is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-components-quantity-selector > button:disabled { color: var(--wp--preset--color--muted); background: var(--wp--preset--color--canvas); }
:is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-cart-item__remove-link { color: var(--wp--preset--color--danger); border-radius: 10px; }
:is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-cart-item__image img { border-radius: 10px; outline: 1px solid rgb(0 0 0 / 10%); outline-offset: -1px; }
.wc-block-cart .wc-block-cart-items__row { background: var(--wp--preset--color--surface); }
.wc-block-cart .wc-block-cart-items__row td { padding-block: 20px; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__title { color: var(--wp--preset--color--brand-purple-dark); }
.wc-block-mini-cart__drawer .wc-block-mini-cart__title::before { align-self: center; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer { background: var(--wp--preset--color--brand-purple-soft); }
/* The drawer is narrow even on desktop: put each line total below its details. */
.wc-block-mini-cart__drawer table.wc-block-cart-items,
.wc-block-mini-cart__drawer table.wc-block-cart-items tbody { display: block; inline-size: 100%; min-inline-size: 0; }
.wc-block-mini-cart__drawer table.wc-block-cart-items .wc-block-cart-items__row {
 box-sizing: border-box;
 display: grid;
 grid-template-columns: 64px minmax(0,1fr);
 gap: 12px 16px;
 inline-size: 100%;
 min-inline-size: 0;
 padding: 16px;
 margin-block-end: 12px;
 border: 1px solid var(--wp--preset--color--border);
 border-radius: 16px;
 background: var(--wp--preset--color--surface);
}
.wc-block-mini-cart__drawer table.wc-block-cart-items .wc-block-cart-items__row > td { min-inline-size: 0; inline-size: auto; padding: 0; }
.wc-block-mini-cart__drawer table.wc-block-cart-items .wc-block-cart-items__row > td.wc-block-cart-item__image { padding: 0; grid-column: 1; grid-row: 1 / span 2; }
.wc-block-mini-cart__drawer table.wc-block-cart-items .wc-block-cart-items__row > td.wc-block-cart-item__product { padding: 0; grid-column: 2; grid-row: 1; }
.wc-block-mini-cart__drawer table.wc-block-cart-items .wc-block-cart-items__row > td.wc-block-cart-item__total { padding: 0; grid-column: 2; grid-row: 2; text-align: start; flex-direction: column; align-items: flex-start; }
.wc-block-mini-cart__drawer .wc-block-cart-item__total::before { content: 'إجمالي المنتج'; display: block; color: var(--wp--preset--color--muted); font-size: 14px; margin-block-end: 4px; }
.wc-block-mini-cart__drawer :is(.wc-block-cart-item__wrap, .wc-block-components-product-name) { min-inline-size: 0; max-inline-size: 100%; overflow-wrap: anywhere; }
.wc-block-mini-cart__drawer .wc-block-cart-item__total .wc-block-components-product-price { display: flex; flex-wrap: wrap; gap: 4px; }
.wp-block-woocommerce-product-button .product_type_simple.add_to_cart_button { gap: 6px; }
.wp-block-woocommerce-product-button .product_type_simple.add_to_cart_button::before { flex-basis: 20px; inline-size: 20px; block-size: 20px; }
/* Icons follow semantic block classes, so reordering information preserves meaning. */
.baby-mama-trust-strip { background: var(--wp--preset--color--brand-pink-soft); border: 0; padding-block: 32px; }
.baby-mama-trust-strip > h2 { color: var(--wp--preset--color--brand-purple-dark); }
.baby-mama-trust-item { margin: 0; color: var(--wp--preset--color--brand-purple-dark); }
.baby-mama-trust-item strong { display: flex; align-items: center; gap: 12px; line-height: 28px; margin-block-end: 8px; }
.baby-mama-trust-item strong::before { flex-basis: 28px; inline-size: 28px; block-size: 28px; background-color: var(--wp--preset--color--brand-purple); }
.baby-mama-info-product { --baby-mama-icon: var(--baby-mama-icon-package); }
.baby-mama-info-delivery { --baby-mama-icon: var(--baby-mama-icon-truck); }
.baby-mama-info-cart { --baby-mama-icon: var(--baby-mama-icon-basket); }
.baby-mama-info-help { --baby-mama-icon: var(--baby-mama-icon-help); }
.baby-mama-footer { background: var(--wp--preset--color--brand-purple-soft); border-block-start-color: var(--wp--preset--color--accent-border); }
.baby-mama-footer h2 { color: var(--wp--preset--color--brand-purple-dark); }
@media (hover: hover) and (pointer: fine) {
 .baby-mama-cart-trigger .wc-block-mini-cart__button:hover { background: var(--wp--preset--color--accent-hover); }
 :is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-components-quantity-selector > button:hover:not(:disabled) { background: var(--wp--preset--color--accent-hover); }
 :is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-cart-item__remove-link:hover { background: var(--wp--preset--color--danger-soft); }
}
@media (max-width: 782px) {
 .baby-mama-header-top { grid-template-columns: 74px minmax(0,1fr) 74px; }
 .baby-mama-cart-trigger .wc-block-mini-cart__button { padding: 8px 6px; gap: 4px; }
 .baby-mama-cart-trigger .wc-block-mini-cart__button::after { font-size: 12px; }
 .baby-mama-primary-navigation .wp-block-navigation__responsive-container-open::after { font-size: 12px; }
 .baby-mama-primary-navigation .wp-block-navigation__responsive-container-open { gap: 4px; }
 .woocommerce-cart .baby-mama-compact-row h1 { font-size: 20px; }
 .woocommerce-cart .wc-block-cart__sidebar { padding: 20px 16px; }
 .wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row { border: 1px solid var(--wp--preset--color--border); border-radius: 16px; padding: 16px; margin-block-end: 16px; }
 .wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row > td { padding: 0; }
 .baby-mama-trust-strip .wp-block-columns { gap: 24px; }
 .baby-mama-trust-item { position: relative; padding-inline-start: 44px; }
 .baby-mama-trust-item strong::before { position: absolute; inset-inline-start: 0; inset-block-start: 0; }
}
@media (max-width: 359px) {
 .baby-mama-header-top .baby-mama-wordmark img { flex-basis: 36px; inline-size: 36px; block-size: 36px; }
 .baby-mama-header-top .baby-mama-wordmark span { font-size: 14px; }
}

:is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-cart-item__remove-link svg { fill: currentColor; }
/* Keep keyboard focus visible inside the rounded quantity group. */
:is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-components-quantity-selector > :focus-visible {
 outline: 3px solid var(--wp--preset--color--brand-purple) !important;
 outline-offset: -3px;
 position: relative;
 z-index: 1;
}

/* Phones and portrait tablets share the native menu, account and mini-cart.
 * Landscape tablets retain the desktop header and category row. */
.baby-mama-mobile-navigation-shell { display: contents; }
.baby-mama-mobile-nav-link,
.baby-mama-mobile-navigation-shell > .baby-mama-primary-navigation { display: none; }
/* Preserve an already-open native dialog when a tablet rotates to desktop. */
.baby-mama-mobile-navigation-shell > .baby-mama-primary-navigation:has(.is-menu-open) { display: contents; }
.baby-mama-header-top .baby-mama-mobile-navigation-shell > .baby-mama-account-trigger { display: flex; grid-column: 3; grid-row: 1; margin-block: 0; }
.baby-mama-header-top .baby-mama-mobile-navigation-shell > .baby-mama-cart-trigger { grid-column: 4; grid-row: 1; }
@media (max-width: 1023px), (max-width: 1180px) and (orientation: portrait) {
 :root { --baby-mama-bottom-nav-height: calc(69px + env(safe-area-inset-bottom, 0px)); }
 html:has(.baby-mama-mobile-navigation-shell) { scroll-padding-block-end: calc(var(--baby-mama-bottom-nav-height) + 16px); }
 body:has(.baby-mama-mobile-navigation-shell) { padding-block-end: var(--baby-mama-bottom-nav-height); }
 .baby-mama-header-shell .baby-mama-header-top { display: flex !important; justify-content: center; min-block-size: 64px; padding-block: 8px; }
 .baby-mama-header-shell .baby-mama-header-top > .baby-mama-wordmark { margin: 0; text-align: center; }
 .baby-mama-header-shell .baby-mama-header-search,
 .baby-mama-header-shell .baby-mama-desktop-links { display: none !important; }
 .baby-mama-header-shell .baby-mama-search-row { display: block; padding-block: 0 12px; }
 .baby-mama-mobile-navigation-shell {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: center;
  position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 35;
  box-sizing: border-box; min-block-size: var(--baby-mama-bottom-nav-height);
  margin: 0 !important; gap: 0; padding: 6px max(8px, env(safe-area-inset-right, 0px)) calc(6px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px));
  border-block-start: 1px solid var(--wp--preset--color--border); background: var(--wp--preset--color--surface);
  box-shadow: 0 -3px 14px #211a250d;
 }
 .baby-mama-mobile-navigation-shell > :is(.baby-mama-mobile-nav-link, .baby-mama-primary-navigation, .baby-mama-account-trigger, .baby-mama-cart-trigger) { display: block; margin: 0 !important; min-inline-size: 0; justify-self: stretch; grid-column: auto !important; grid-row: auto !important; }
 .baby-mama-header-top .baby-mama-mobile-navigation-shell > .baby-mama-account-trigger { display: block; }
 .baby-mama-mobile-navigation-shell :is(.baby-mama-mobile-nav-link > a, .baby-mama-account-trigger > a, .wp-block-navigation__responsive-container-open, .wc-block-mini-cart__button) {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  box-sizing: border-box; inline-size: 100%; min-inline-size: 0; min-block-size: 56px; block-size: auto;
  gap: 4px; padding: 4px 2px; margin: 0; border: 0; border-radius: 8px;
  background: transparent; color: var(--wp--preset--color--brand-purple); font: 500 12px/1.5 'Noto Sans Arabic', Tahoma, sans-serif; text-decoration: none;
 }
 .baby-mama-mobile-navigation-shell :is(.wp-block-navigation__responsive-container-open, .wc-block-mini-cart__button)::after { font: inherit; color: inherit; }
 /* Beat the native Navigation block's repeated class selector without changing
  * typography inside its open dialog. */
 .baby-mama-mobile-navigation-shell .baby-mama-primary-navigation .wp-block-navigation__responsive-container-open { font: 500 12px/1.5 'Noto Sans Arabic', Tahoma, sans-serif; }
 .baby-mama-mobile-nav-link a::before { content: ''; inline-size: 20px; block-size: 20px; background: currentColor; mask: var(--baby-mama-mobile-nav-icon) center / contain no-repeat; }
 .baby-mama-mobile-nav-home { --baby-mama-mobile-nav-icon: url('../icons/home.svg'); }
 .baby-mama-mobile-nav-shop { --baby-mama-mobile-nav-icon: var(--baby-mama-icon-package); }
 .baby-mama-mobile-navigation-shell :is(.baby-mama-mobile-nav-link, .baby-mama-account-trigger) > a:is([aria-current="page"],[aria-current="true"]) { background: var(--wp--preset--color--brand-purple-soft); font-weight: 700; }
 .baby-mama-mobile-navigation-shell :focus-visible { outline-offset: -3px; }
 .baby-mama-mobile-navigation-shell .wp-block-navigation__responsive-container.is-menu-open { inset: 0; block-size: 100dvh; padding-block-end: calc(24px + env(safe-area-inset-bottom, 0px)); }
 body:has(.baby-mama-mobile-navigation-shell) .baby-mama-sticky-purchase:not([hidden]) { inset-block-end: var(--baby-mama-bottom-nav-height); padding-block-end: 8px; }
 body.has-baby-mama-sticky-purchase:has(.baby-mama-mobile-navigation-shell) { padding-block-end: calc(160px + var(--baby-mama-bottom-nav-height)); }
 body.has-baby-mama-sticky-purchase:has(.baby-mama-mobile-navigation-shell) :focus { scroll-margin-block-end: calc(180px + var(--baby-mama-bottom-nav-height)); }
}

/* Keep editable quantities readable on phones, including native Woo inputs. */
.single-product .quantity input.qty,
:is(.wc-block-cart, .wc-block-mini-cart__drawer) .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input { font-size: 16px; }
