/* 1.6.5 — mobile UX/UI system for all front promotion widgets.
 * Presentation only: no promotion data or calculation logic is changed.
 */
@media (max-width: 767px) {
  .miceyupsell-product-block,
  .miceyupsell-cart-panel,
  .miceyupsell-discount-group,
  .miceyupsell-package-card,
  .miceyupsell-banners,
  .miceyupsell-variant-modal {
    --miceyupsell-mobile-space-1: 6px;
    --miceyupsell-mobile-space-2: 10px;
    --miceyupsell-mobile-space-3: 14px;
    --miceyupsell-mobile-space-4: 18px;
    --miceyupsell-mobile-radius: 16px;
    --miceyupsell-mobile-touch: 44px;
    --miceyupsell-mobile-border: #e5e7eb;
    --miceyupsell-mobile-muted: #68717b;
    --miceyupsell-mobile-accent: #9a5b18;
    --miceyupsell-mobile-accent-soft: #fff6eb;
  }

  .miceyupsell-product-block,
  .miceyupsell-cart-panel {
    font-size: 14px;
    -webkit-text-size-adjust: 100%;
  }

  .miceyupsell-product-block a,
  .miceyupsell-product-block button,
  .miceyupsell-cart-panel a,
  .miceyupsell-cart-panel button,
  .miceyupsell-variant-modal a,
  .miceyupsell-variant-modal button,
  .miceyupsell-variant-modal select,
  .miceyupsell-variant-modal label {
    -webkit-tap-highlight-color: rgba(154, 91, 24, .12);
  }

  .miceyupsell-product-block a:focus-visible,
  .miceyupsell-product-block button:focus-visible,
  .miceyupsell-cart-panel a:focus-visible,
  .miceyupsell-cart-panel button:focus-visible,
  .miceyupsell-variant-modal a:focus-visible,
  .miceyupsell-variant-modal button:focus-visible,
  .miceyupsell-variant-modal select:focus-visible {
    outline: 3px solid rgba(177, 116, 50, .24);
    outline-offset: 2px;
  }

  /* Compact cards: one readable card plus a visible edge of the next card. */
  .miceyupsell-product-block:not(.miceyupsell-product-block--mobile-stacked) {
    display: flex;
    width: 100%;
    max-width: 100%;
    flex-wrap: nowrap;
    gap: 12px;
    margin: 12px 0 6px;
    padding: 3px max(72px, env(safe-area-inset-right)) 12px 1px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-padding-inline: 1px 72px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .miceyupsell-product-block:not(.miceyupsell-product-block--mobile-stacked)::-webkit-scrollbar,
  .miceyupsell-mini-products::-webkit-scrollbar,
  .miceyupsell-package-products::-webkit-scrollbar,
  .miceyupsell-discount-group-viewport::-webkit-scrollbar {
    display: none;
  }

  .miceyupsell-product-block:not(.miceyupsell-product-block--mobile-stacked) > .miceyupsell-bundle-card {
    width: clamp(232px, 76vw, 300px);
    max-width: clamp(232px, 76vw, 300px);
    min-width: 0;
    flex: 0 0 clamp(232px, 76vw, 300px);
    scroll-snap-align: start;
  }

  /* Wide widgets contain their own horizontal list, so they stack vertically. */
  .miceyupsell-product-block--mobile-stacked {
    display: block !important;
    width: 100%;
    max-width: 100%;
    margin: 12px 0;
    padding: 0;
    overflow: visible;
  }

  .miceyupsell-product-block--mobile-stacked > .miceyupsell-bundle-card,
  .miceyupsell-product-block--mobile-stacked > .miceyupsell-package-card,
  .miceyupsell-product-block--mobile-stacked > .miceyupsell-discount-group {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0 0 12px;
  }

  .miceyupsell-product-block--mobile-stacked > :last-child {
    margin-bottom: 0;
  }



  .miceyupsell-mobile-rail-controls {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 0 0 12px;
    padding: 0 2px;
  }

  .miceyupsell-mobile-rail-controls[hidden] {
    display: none !important;
  }

  .miceyupsell-mobile-rail-hint {
    margin-right: auto;
    color: var(--miceyupsell-mobile-muted, #68717b);
    font-size: 12px;
    line-height: 1.35;
  }

  .miceyupsell-mobile-rail-arrow {
    display: inline-flex;
    width: 38px;
    height: 38px;
    min-width: 38px;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1d5c8;
    border-radius: 50%;
    background: #fff;
    color: #734417;
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 3px 12px rgba(31, 41, 55, .10);
    touch-action: manipulation;
  }

  .miceyupsell-mobile-rail-arrow:disabled {
    opacity: .35;
    box-shadow: none;
  }

  .miceyupsell-product-block:not(.miceyupsell-product-block--mobile-stacked).is-mobile-scrollable {
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent 100%);
  }

  .miceyupsell-bundle-card,
  .miceyupsell-cart-promo,
  .miceyupsell-package-card,
  .miceyupsell-discount-group {
    border-color: var(--miceyupsell-mobile-border);
    border-radius: var(--miceyupsell-mobile-radius);
    box-shadow: 0 7px 22px rgba(31, 41, 55, .065);
  }

  .miceyupsell-bundle-card {
    min-height: 0;
    padding: var(--miceyupsell-mobile-space-3);
    transform: none !important;
  }

  .miceyupsell-bundle-card:hover {
    transform: none;
  }

  .miceyupsell-bundle-topline {
    min-height: 28px;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
  }

  .miceyupsell-eyebrow {
    font-size: 10px;
    letter-spacing: .07em;
  }

  .miceyupsell-saving,
  .miceyupsell-badge,
  .miceyupsell-no-discount {
    min-height: 28px;
    align-items: center;
    padding: 6px 9px;
    font-size: 11px;
    line-height: 1.15;
  }

  .miceyupsell-bundle-title {
    min-height: 0;
    margin-top: 6px;
    font-size: 16px;
    line-height: 1.32;
    -webkit-line-clamp: 3;
  }

  .miceyupsell-description,
  .miceyupsell-global-message {
    margin-top: 8px;
    color: #5f6872;
    font-size: 13px;
    line-height: 1.5;
    -webkit-line-clamp: 3;
  }

  .miceyupsell-scope-note,
  .miceyupsell-cart-scope-note {
    margin-top: 8px;
    font-size: 12px;
    line-height: 1.45;
  }

  .miceyupsell-mini-products {
    width: 100%;
    min-height: 62px;
    margin: 11px 0 7px;
    padding: 2px 2px 6px;
    gap: 10px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .miceyupsell-mini-product {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    border-radius: 12px;
  }

  .miceyupsell-mini-product + .miceyupsell-mini-product::before {
    left: -13px;
    width: 18px;
    height: 18px;
    line-height: 16px;
  }

  .miceyupsell-bundle-products-text {
    gap: 4px;
    margin-top: 7px;
    font-size: 13px;
    line-height: 1.4;
  }

  .miceyupsell-bundle-products-text > a,
  .miceyupsell-bundle-products-text strong,
  .miceyupsell-bundle-products-text span {
    -webkit-line-clamp: 2;
  }

  .miceyupsell-countdown {
    min-height: 38px;
    flex-wrap: wrap;
    margin-top: 10px;
    padding: 8px 10px;
    gap: 5px 10px;
    font-size: 12px;
  }

  .miceyupsell-countdown strong {
    font-size: 12px;
  }

  .miceyupsell-price-row {
    margin-top: 12px;
    padding: 11px 12px;
    border: 1px solid #eee7de;
    border-radius: 12px;
    background: #fcfaf7;
    gap: 12px;
  }

  .miceyupsell-price-label {
    font-size: 11px;
  }

  .miceyupsell-price-before strong {
    font-size: 13px;
  }

  .miceyupsell-price-after strong {
    font-size: 20px;
    line-height: 1.15;
  }

  .miceyupsell-btn,
  .miceyupsell-link-btn,
  .miceyupsell-add-bundle,
  .miceyupsell-package-add,
  .miceyupsell-discount-group-choose {
    min-height: var(--miceyupsell-mobile-touch);
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.2;
    touch-action: manipulation;
  }

  a.miceyupsell-btn,
  a.miceyupsell-link-btn,
  a.miceyupsell-discount-group-choose {
    display: flex;
  }

  .miceyupsell-btn,
  .miceyupsell-add-bundle {
    margin-top: 12px;
  }

  .miceyupsell-inline-status,
  .miceyupsell-package-status {
    font-size: 12px;
    line-height: 1.45;
  }

  /* Cart promotion panel: keep savings comparable without tall stacked columns. */
  .miceyupsell-cart-panel {
    margin: 14px 0;
    padding: 12px;
    border-radius: 18px;
  }

  .miceyupsell-cart-panel h3 {
    margin: 0 2px 11px;
    font-size: 18px;
    line-height: 1.3;
  }

  .miceyupsell-cart-promo {
    padding: 14px;
    border-radius: 15px;
  }

  .miceyupsell-cart-promo + .miceyupsell-cart-promo {
    margin-top: 11px;
  }

  .miceyupsell-cart-promo-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 8px 10px;
  }

  .miceyupsell-cart-promo-title {
    min-width: 0;
    font-size: 16px;
    line-height: 1.35;
  }

  .miceyupsell-cart-promo-head .miceyupsell-badge {
    justify-self: end;
    max-width: 46vw;
    text-align: center;
  }

  .miceyupsell-cart-summary {
    margin-top: 9px;
    font-size: 14px;
    line-height: 1.5;
  }

  .miceyupsell-cart-values,
  .miceyupsell-cart-values-compact {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 0;
    margin-top: 11px;
    padding: 10px 4px;
  }

  .miceyupsell-cart-values-compact > div,
  .miceyupsell-cart-values-compact > div:nth-child(2),
  .miceyupsell-cart-values-compact > div:nth-child(3) {
    min-width: 0;
    padding: 0 8px;
    text-align: center;
  }

  .miceyupsell-cart-values-compact > div + div {
    border-left: 1px solid #e5e5e5;
  }

  .miceyupsell-cart-values span {
    min-height: 25px;
    font-size: 10px;
    line-height: 1.25;
  }

  .miceyupsell-cart-values strong,
  .miceyupsell-cart-values-compact > div:nth-child(1) strong,
  .miceyupsell-cart-values-compact > div:nth-child(2) strong {
    font-size: clamp(11px, 3.3vw, 14px);
    line-height: 1.2;
    white-space: nowrap;
  }

  .miceyupsell-cart-values-compact > div:nth-child(3) strong {
    font-size: clamp(14px, 4.2vw, 17px);
    white-space: nowrap;
  }

  .miceyupsell-cart-progress,
  .miceyupsell-cart-discounted-products {
    gap: 7px;
    margin: 10px 0 0;
    font-size: 12px;
  }

  .miceyupsell-cart-progress span,
  .miceyupsell-cart-discounted-products span {
    max-width: 100%;
    padding: 6px 9px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  .miceyupsell-cart-next-thresholds {
    margin-top: 12px;
    padding: 11px;
    border-radius: 13px;
  }

  .miceyupsell-cart-next-thresholds-head {
    display: block;
    margin-bottom: 9px;
  }

  .miceyupsell-cart-next-thresholds-head strong {
    display: block;
    font-size: 14px;
    line-height: 1.35;
  }

  .miceyupsell-cart-next-thresholds-head > span {
    display: block;
    max-width: none;
    margin-top: 3px;
    font-size: 11px;
    line-height: 1.4;
    text-align: left;
  }

  .miceyupsell-cart-next-thresholds-list {
    gap: 8px;
  }

  .miceyupsell-cart-next-threshold {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 8px;
    padding: 11px;
    border-radius: 11px;
  }

  .miceyupsell-cart-next-threshold-copy > span {
    font-size: 13px;
    line-height: 1.45;
  }

  .miceyupsell-cart-next-threshold-copy > span strong {
    font-size: 15px;
  }

  .miceyupsell-cart-next-threshold-copy small {
    font-size: 11px;
    line-height: 1.4;
  }

  .miceyupsell-cart-next-threshold-value {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-items: baseline;
    gap: 2px 10px;
    padding-top: 8px;
    border-top: 1px dashed #e5ddd2;
    text-align: left;
  }

  .miceyupsell-cart-next-threshold-value span {
    grid-column: 1;
    grid-row: 1;
    font-size: 10px;
  }

  .miceyupsell-cart-next-threshold-value strong {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    margin: 0;
    font-size: 18px;
    white-space: nowrap;
  }

  .miceyupsell-cart-next-threshold-value small {
    grid-column: 1;
    grid-row: 2;
    font-size: 11px;
  }

  .miceyupsell-cart-forecast-note {
    margin-top: 9px;
    font-size: 10px;
    line-height: 1.45;
  }

  .miceyupsell-comparison,
  .miceyupsell-comparison-simple {
    padding: 9px 10px;
    font-size: 12px;
    line-height: 1.45;
  }

  .miceyupsell-cart-actions {
    display: block;
    margin-top: 11px;
  }

  .miceyupsell-cart-actions .miceyupsell-link-btn {
    width: 100%;
  }

  /* Product package: larger selectable tiles and a thumb-friendly checkbox. */
  .miceyupsell-package-card {
    padding: 14px;
    overflow: hidden;
  }

  .miceyupsell-package-header {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 9px;
    margin-bottom: 12px;
  }

  .miceyupsell-package-title {
    margin-top: 4px;
    font-size: 18px;
    line-height: 1.32;
  }

  .miceyupsell-package-description {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.5;
  }

  .miceyupsell-package-count {
    min-height: 30px;
    align-self: flex-start;
    padding: 7px 10px;
    font-size: 11px;
  }

  .miceyupsell-package-products {
    width: calc(100% + 28px);
    max-width: none;
    margin: 0 -14px;
    padding: 2px 14px 10px;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-padding-inline: 14px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .miceyupsell-package-product {
    width: min(82vw, 310px);
    min-width: 250px;
    max-width: 310px;
    min-height: 102px;
    flex: 0 0 min(82vw, 310px);
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
    border-radius: 14px;
    scroll-snap-align: start;
  }

  .miceyupsell-package-product + .miceyupsell-package-product::before {
    display: none;
  }

  .miceyupsell-package-checkbox {
    top: 3px;
    right: 3px;
    display: flex;
    width: var(--miceyupsell-mobile-touch);
    height: var(--miceyupsell-mobile-touch);
    align-items: center;
    justify-content: center;
  }

  .miceyupsell-package-checkbox span {
    width: 24px;
    height: 24px;
    border-radius: 7px;
  }

  .miceyupsell-package-checkbox input:checked + span::after {
    font-size: 15px;
    line-height: 22px;
  }

  .miceyupsell-package-image {
    width: 72px;
    height: 72px;
    border-radius: 11px;
  }

  .miceyupsell-package-product-copy {
    padding-right: 32px;
  }

  .miceyupsell-package-product-title {
    font-size: 14px;
    line-height: 1.35;
    -webkit-line-clamp: 3;
  }

  .miceyupsell-package-variant {
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.35;
  }

  .miceyupsell-package-price,
  .miceyupsell-package-price-from {
    font-size: 13px;
  }

  .miceyupsell-package-countdown {
    width: 100%;
    max-width: none;
  }

  .miceyupsell-package-footer {
    display: flex;
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
    margin-top: 11px;
    padding-top: 11px;
  }

  .miceyupsell-package-hint {
    font-size: 12px;
    line-height: 1.45;
  }

  .miceyupsell-package-add {
    width: 100%;
    min-width: 0;
    flex-basis: auto;
    margin-top: 0;
  }

  /* Discount group: full-width heading, swipeable products and overlay arrows. */
  .miceyupsell-discount-group {
    padding: 14px;
    overflow: hidden;
  }

  .miceyupsell-discount-group-head {
    display: block;
    margin-bottom: 13px;
  }

  .miceyupsell-discount-group-title {
    margin: 5px 0 7px;
    font-size: 18px;
    line-height: 1.3;
  }

  .miceyupsell-discount-group-description {
    margin-bottom: 7px;
    font-size: 13px;
    line-height: 1.5;
  }

  .miceyupsell-discount-group-source {
    font-size: 12px;
    line-height: 1.45;
  }

  .miceyupsell-discount-group-benefit {
    display: flex;
    width: 100%;
    max-width: none;
    min-height: 40px;
    margin-top: 11px;
    padding: 9px 12px;
    border-radius: 11px;
    font-size: 13px;
    line-height: 1.35;
  }

  .miceyupsell-discount-group-carousel {
    position: relative;
    display: block;
    width: calc(100% + 28px);
    margin: 0 -14px;
  }

  .miceyupsell-discount-group-viewport {
    width: 100%;
    min-width: 0;
    padding: 2px 14px 10px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-padding-inline: 14px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .miceyupsell-discount-group-track {
    gap: 12px;
  }

  .miceyupsell-discount-group-item {
    width: min(76vw, 286px);
    min-width: 228px;
    max-width: 286px;
    flex: 0 0 min(76vw, 286px);
    border-radius: 14px;
    scroll-snap-align: start;
    box-shadow: 0 3px 12px rgba(31, 41, 55, .045);
  }

  .miceyupsell-discount-group-image {
    height: 166px;
  }

  .miceyupsell-discount-group-copy {
    padding: 13px;
  }

  .miceyupsell-discount-group-product-title {
    min-height: 0;
    font-size: 14px;
    line-height: 1.4;
  }

  .miceyupsell-discount-group-product-price {
    margin-top: 8px;
    font-size: 16px;
  }

  .miceyupsell-discount-group-saving {
    margin-top: 8px;
    font-size: 13px;
  }

  .miceyupsell-discount-group-pair {
    margin: 6px 0 10px;
    font-size: 12px;
    line-height: 1.35;
  }

  .miceyupsell-discount-group-choose {
    width: 100%;
    margin-top: auto;
  }

  .miceyupsell-group-arrow {
    position: absolute;
    top: 50%;
    z-index: 4;
    width: var(--miceyupsell-mobile-touch);
    height: var(--miceyupsell-mobile-touch);
    min-width: var(--miceyupsell-mobile-touch);
    flex-basis: auto;
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    font-size: 28px;
    line-height: 1;
    box-shadow: 0 5px 18px rgba(31, 41, 55, .16);
    transform: translateY(-50%);
    backdrop-filter: blur(6px);
    touch-action: manipulation;
  }

  .miceyupsell-group-arrow--prev {
    left: 5px;
  }

  .miceyupsell-group-arrow--next {
    right: 5px;
  }

  .miceyupsell-group-arrow:disabled {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }

  .miceyupsell-discount-group-foot {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.4;
  }

  .miceyupsell-discount-group-foot .miceyupsell-countdown {
    width: 100%;
    margin-top: 0;
  }

  .miceyupsell-discount-group-note {
    margin-top: 8px;
    font-size: 11px;
    line-height: 1.45;
  }

  /* Graphic banners: compact, legible and free from overlapping countdowns. */
  .miceyupsell-banner {
    border-radius: 14px;
  }

  .miceyupsell-banner__text,
  .miceyupsell-banners--product .miceyupsell-banner__text {
    gap: 4px;
    padding: 11px 13px;
  }

  .miceyupsell-banner__text strong,
  .miceyupsell-banners--product .miceyupsell-banner__text strong {
    font-size: 15px;
    line-height: 1.35;
  }

  .miceyupsell-banner__text small,
  .miceyupsell-banners--product .miceyupsell-banner__text small {
    font-size: 12px;
    line-height: 1.45;
  }

  .miceyupsell-banner__countdown,
  .miceyupsell-banners--product .miceyupsell-banner__countdown {
    position: static;
    width: auto;
    margin: 8px 10px 10px;
  }

  /* Variant selector as a robust mobile bottom sheet. */
  .miceyupsell-variant-modal {
    align-items: flex-end;
    padding: 0;
  }

  .miceyupsell-variant-dialog {
    width: 100%;
    max-height: calc(100vh - 8px);
    max-height: calc(100dvh - 8px - env(safe-area-inset-top));
    border-radius: 20px 20px 0 0;
  }

  .miceyupsell-variant-header {
    flex: 0 0 auto;
    align-items: flex-start;
    padding: 15px 14px 12px;
    gap: 12px;
  }

  .miceyupsell-variant-header h3 {
    margin-top: 3px;
    font-size: 18px;
    line-height: 1.3;
  }

  .miceyupsell-variant-header p {
    font-size: 12px;
    line-height: 1.45;
  }

  .miceyupsell-variant-close {
    width: var(--miceyupsell-mobile-touch);
    height: var(--miceyupsell-mobile-touch);
    flex: 0 0 var(--miceyupsell-mobile-touch);
    font-size: 28px;
  }

  .miceyupsell-variant-body {
    min-height: 0;
    padding: 5px 14px 12px;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }

  .miceyupsell-variant-product {
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 12px;
    padding: 14px 0;
  }

  .miceyupsell-variant-product-image {
    width: 68px;
    height: 68px;
    border-radius: 11px;
  }

  .miceyupsell-variant-product-title-row {
    flex-wrap: wrap;
    gap: 4px 10px;
    margin-bottom: 9px;
  }

  .miceyupsell-variant-product-title-row strong {
    font-size: 14px;
    line-height: 1.4;
  }

  .miceyupsell-variant-product-title-row span {
    font-size: 12px;
  }

  .miceyupsell-variant-group-label {
    margin-bottom: 7px;
  }

  .miceyupsell-variant-group-label > span,
  .miceyupsell-variant-group-label > strong,
  .miceyupsell-variant-product-main label {
    font-size: 12px;
  }

  .miceyupsell-variant-select {
    min-height: 46px;
    padding: 9px 38px 9px 11px;
    border-radius: 10px;
    font-size: 16px;
  }

  .miceyupsell-variant-color-options {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(76px, 1fr));
    gap: 8px;
  }

  .miceyupsell-variant-color {
    width: 100%;
    min-height: 88px;
    grid-template-rows: 58px auto;
    gap: 5px;
    padding: 5px;
    border-radius: 10px;
  }

  .miceyupsell-variant-color-media {
    height: 58px;
  }

  .miceyupsell-variant-color-name {
    padding-bottom: 2px;
    font-size: 10px;
  }

  .miceyupsell-variant-radio-options {
    gap: 8px;
  }

  .miceyupsell-variant-radio span {
    min-height: var(--miceyupsell-mobile-touch);
    padding: 9px 14px;
    font-size: 13px;
  }

  .miceyupsell-variant-price-line,
  .miceyupsell-variant-fixed {
    font-size: 12px;
    line-height: 1.45;
  }

  .miceyupsell-variant-footer {
    flex: 0 0 auto;
    align-items: stretch;
    flex-direction: column;
    gap: 11px;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
  }

  .miceyupsell-variant-summary {
    width: 100%;
    gap: 5px;
  }

  .miceyupsell-variant-summary-row > span {
    font-size: 12px;
  }

  .miceyupsell-variant-summary-row > strong {
    font-size: 15px;
  }

  .miceyupsell-variant-summary-final > strong {
    font-size: 20px;
  }

  .miceyupsell-variant-actions,
  .miceyupsell-variant-buttons {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr);
    gap: 8px;
  }

  .miceyupsell-variant-actions .miceyupsell-btn,
  .miceyupsell-variant-buttons .miceyupsell-btn {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    margin: 0;
  }
}

@media (max-width: 379px) {
  .miceyupsell-product-block:not(.miceyupsell-product-block--mobile-stacked) > .miceyupsell-bundle-card {
    width: clamp(216px, calc(100vw - 92px), 272px);
    max-width: clamp(216px, calc(100vw - 92px), 272px);
    min-width: 0;
    flex-basis: clamp(216px, calc(100vw - 92px), 272px);
  }

  .miceyupsell-cart-panel,
  .miceyupsell-cart-promo,
  .miceyupsell-package-card,
  .miceyupsell-discount-group,
  .miceyupsell-bundle-card {
    padding-left: 12px;
    padding-right: 12px;
  }

  .miceyupsell-cart-values-compact > div,
  .miceyupsell-cart-values-compact > div:nth-child(2),
  .miceyupsell-cart-values-compact > div:nth-child(3) {
    padding-right: 5px;
    padding-left: 5px;
  }

  .miceyupsell-cart-values strong,
  .miceyupsell-cart-values-compact > div:nth-child(1) strong,
  .miceyupsell-cart-values-compact > div:nth-child(2) strong {
    font-size: 12px;
  }

  .miceyupsell-cart-values-compact > div:nth-child(3) strong {
    font-size: 15px;
  }

  .miceyupsell-package-products,
  .miceyupsell-discount-group-carousel {
    width: calc(100% + 24px);
    margin-right: -12px;
    margin-left: -12px;
  }

  .miceyupsell-package-products,
  .miceyupsell-discount-group-viewport {
    padding-right: 12px;
    padding-left: 12px;
    scroll-padding-inline: 12px;
  }

  .miceyupsell-package-product {
    width: calc(100vw - 58px);
    min-width: 238px;
    flex-basis: calc(100vw - 58px);
  }

  .miceyupsell-discount-group-item {
    width: calc(100vw - 70px);
    min-width: 220px;
    flex-basis: calc(100vw - 70px);
  }

  .miceyupsell-variant-product {
    grid-template-columns: 60px minmax(0, 1fr);
    gap: 10px;
  }

  .miceyupsell-variant-product-image {
    width: 60px;
    height: 60px;
  }

  .miceyupsell-variant-actions,
  .miceyupsell-variant-buttons {
    grid-template-columns: 1fr;
  }
}

@media (hover: none) and (pointer: coarse) and (max-width: 767px) {
  .miceyupsell-bundle-card:hover,
  .miceyupsell-package-product.is-selected:hover {
    border-color: var(--miceyupsell-mobile-border, #e5e7eb);
    box-shadow: 0 7px 22px rgba(31, 41, 55, .065);
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .miceyupsell-product-block,
  .miceyupsell-package-products,
  .miceyupsell-discount-group-viewport {
    scroll-behavior: auto !important;
  }

  .miceyupsell-product-block *,
  .miceyupsell-cart-panel *,
  .miceyupsell-variant-modal * {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* 1.6.6 — final mobile overrides for long bundle lists and package clarity. */
@media (max-width: 767px) {
  .miceyupsell-list-controls {
    display: flex;
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 12px;
    padding: 11px 12px;
    border-radius: 13px;
  }

  .miceyupsell-list-status {
    font-size: 12px;
    text-align: center;
  }

  .miceyupsell-list-actions {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
  }

  .miceyupsell-list-button {
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 11px;
    font-size: 13px;
    touch-action: manipulation;
  }

  .miceyupsell-list-button--primary {
    width: 100%;
  }

  .miceyupsell-list-button--link {
    padding-right: 9px;
    padding-left: 9px;
  }

  /* Package products are a complete readable list, not a hidden carousel. */
  .miceyupsell-package-products,
  .miceyupsell-product-block--mobile-stacked .miceyupsell-package-products {
    display: grid;
    width: 100%;
    max-width: 100%;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 0;
    padding: 0;
    overflow: visible;
    scroll-snap-type: none;
  }

  .miceyupsell-package-product,
  .miceyupsell-product-block--mobile-stacked .miceyupsell-package-product {
    width: 100%;
    min-width: 0;
    max-width: none;
    min-height: 92px;
    flex: none;
    grid-template-columns: 66px minmax(0, 1fr);
    gap: 11px;
    padding: 11px;
    scroll-snap-align: none;
  }

  .miceyupsell-package-image {
    width: 66px;
    height: 66px;
  }

  .miceyupsell-package-product-copy {
    min-height: 66px;
  }

  .miceyupsell-package-product-title {
    font-size: 13px;
    -webkit-line-clamp: 2;
  }

  /* Discount group remains swipeable, but the frame and controls stay light. */
  .miceyupsell-discount-group {
    padding: 13px;
    border-radius: 13px;
    box-shadow: 0 3px 12px rgba(31, 41, 55, .04);
  }

  .miceyupsell-discount-group-carousel {
    width: calc(100% + 26px);
    margin: 0 -13px;
    padding: 0;
  }

  .miceyupsell-discount-group-viewport {
    padding: 2px 13px 9px;
    scroll-padding-inline: 13px;
  }

  .miceyupsell-discount-group-track {
    gap: 10px;
  }

  .miceyupsell-discount-group-item,
  .miceyupsell-discount-group-item-link {
    width: min(70vw, 250px);
    min-width: 214px;
    max-width: 250px;
    flex: 0 0 min(70vw, 250px);
    border-radius: 12px;
  }

  .miceyupsell-discount-group-image {
    height: 148px;
  }

  .miceyupsell-discount-group-copy {
    padding: 11px 12px 12px;
  }

  .miceyupsell-discount-group-product-title {
    min-height: 0;
    font-size: 13px;
    line-height: 1.38;
  }

  .miceyupsell-discount-group-product-price {
    margin-top: 7px;
    font-size: 15px;
  }

  .miceyupsell-discount-group-choose {
    width: auto;
    min-height: 0;
    margin-top: 9px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--miceyupsell-mobile-accent);
    font-size: 12px;
    justify-content: flex-start;
  }

  .miceyupsell-group-arrow {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 50%;
    font-size: 22px;
    box-shadow: 0 3px 12px rgba(31, 41, 55, .12);
  }

  .miceyupsell-group-arrow--prev {
    left: 4px;
  }

  .miceyupsell-group-arrow--next {
    right: 4px;
  }
}

@media (max-width: 379px) {
  .miceyupsell-list-actions {
    grid-template-columns: 1fr;
  }

  .miceyupsell-list-button {
    width: 100%;
  }

  .miceyupsell-package-products,
  .miceyupsell-discount-group-carousel {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }

  .miceyupsell-discount-group-viewport {
    width: calc(100% + 24px);
    margin-right: -12px;
    margin-left: -12px;
    padding-right: 12px;
    padding-left: 12px;
  }

  .miceyupsell-discount-group-item,
  .miceyupsell-discount-group-item-link {
    width: calc(100vw - 78px);
    min-width: 208px;
    flex-basis: calc(100vw - 78px);
  }
}

/* 1.6.9 - mobile compact bundle tile refinements */
@media (max-width: 767px) {
  .miceyupsell-product-block:not(.miceyupsell-product-block--mobile-stacked) > .miceyupsell-bundle-card--compact {
    width: clamp(232px, 76vw, 300px);
    max-width: clamp(232px, 76vw, 300px);
    flex-basis: clamp(232px, 76vw, 300px);
  }

  .miceyupsell-bundle-card--compact .miceyupsell-bundle-title {
    min-height: 0;
    font-size: 14px;
    line-height: 1.28;
    overflow: visible;
    -webkit-line-clamp: unset;
    -webkit-box-orient: initial;
  }

  .miceyupsell-bundle-card--compact .miceyupsell-mini-products {
    gap: 17px;
    min-height: 72px;
    overflow-x: auto;
    padding: 2px 4px 5px 1px;
  }

  .miceyupsell-bundle-card--compact .miceyupsell-mini-product {
    width: 68px;
    height: 68px;
    flex: 0 0 68px;
  }

  .miceyupsell-bundle-card--compact .miceyupsell-mini-product + .miceyupsell-mini-product::before {
    left: -21px;
    width: 25px;
    height: 25px;
    font-size: 16px;
    line-height: 21px;
  }

  .miceyupsell-bundle-card--compact .miceyupsell-bundle-products-text {
    max-height: none;
    overflow: visible;
  }

  .miceyupsell-discount-scope {
    font-size: 12px;
  }

  .miceyupsell-listing-promo-badge {
    top: 7px;
    left: 7px;
    padding: 4px 7px;
    font-size: 9px;
  }
}

/* 1.6.13 - mobile message card and tier preview refinements */
@media (max-width: 767px) {
  .miceyupsell-product-block:not(.miceyupsell-product-block--mobile-stacked) > .miceyupsell-bundle-card-message {
    width: min(88vw, 340px);
    max-width: min(88vw, 340px);
    flex-basis: min(88vw, 340px);
  }

  .miceyupsell-bundle-card-message .miceyupsell-global-message {
    font-size: 13px;
    line-height: 1.42;
    -webkit-line-clamp: 4;
  }

  .miceyupsell-bundle-card-message .miceyupsell-global-message--long {
    font-size: 12px;
    line-height: 1.36;
    -webkit-line-clamp: 5;
  }

  .miceyupsell-bundle-card-message .miceyupsell-global-message--dense {
    font-size: 11px;
    line-height: 1.32;
    -webkit-line-clamp: 6;
  }

  .miceyupsell-tier-preview {
    gap: 5px;
    margin-top: 7px;
  }

  .miceyupsell-tier-preview-item {
    padding: 5px 7px;
    font-size: 10px;
  }
}


@media (min-width: 768px) {
  .miceyupsell-mobile-rail-controls {
    display: none !important;
  }
}

/* 5.5.1 — mobile rail for same-type bundle cards; mixed promotion types stay stacked as sections. */
@media (max-width: 767px) {
  .miceyupsell-product-block.miceyupsell-product-block--with-bundle-rail {
    display: block !important;
    width: 100%;
    max-width: 100%;
    margin: 12px 0;
    padding: 0;
    overflow: visible;
    scroll-snap-type: none;
  }

  .miceyupsell-product-block.miceyupsell-product-block--with-bundle-rail > .miceyupsell-bundle-rail {
    display: flex;
    width: calc(100% + 14px);
    max-width: none;
    flex-wrap: nowrap;
    gap: 12px;
    margin: 0 -14px 0 0;
    padding: 3px max(64px, env(safe-area-inset-right)) 12px 1px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-padding-inline: 1px 64px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .miceyupsell-product-block.miceyupsell-product-block--with-bundle-rail > .miceyupsell-bundle-rail::-webkit-scrollbar {
    display: none;
  }

  .miceyupsell-product-block.miceyupsell-product-block--with-bundle-rail > .miceyupsell-bundle-rail.is-scrollable {
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 30px), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 30px), transparent 100%);
  }

  .miceyupsell-product-block.miceyupsell-product-block--with-bundle-rail > .miceyupsell-bundle-rail > .miceyupsell-bundle-card {
    width: clamp(232px, 76vw, 300px);
    max-width: clamp(232px, 76vw, 300px);
    min-width: 0;
    flex: 0 0 clamp(232px, 76vw, 300px);
    scroll-snap-align: start;
  }

  .miceyupsell-product-block.miceyupsell-product-block--with-bundle-rail .miceyupsell-add-bundle,
  .miceyupsell-product-block.miceyupsell-product-block--with-bundle-rail .miceyupsell-btn-muted {
    margin-top: auto;
  }

  .miceyupsell-bundle-rail-controls {
    justify-content: space-between;
    gap: 8px;
    margin: -3px 0 13px;
    padding: 0 2px;
  }

  .miceyupsell-bundle-rail-more {
    min-height: 38px;
    padding: 8px 12px;
    border-color: #f4d2a6;
    background: #fff7ed;
    font-size: 12px;
    box-shadow: 0 3px 12px rgba(80, 45, 10, .07);
  }

  .miceyupsell-bundle-rail-arrows {
    gap: 8px;
  }

  .miceyupsell-bundle-rail-arrow {
    width: 38px;
    height: 38px;
    min-width: 38px;
    font-size: 24px;
    touch-action: manipulation;
  }

  .miceyupsell-product-block--mixed-types .miceyupsell-discount-group,
  .miceyupsell-product-block--mixed-types .miceyupsell-package-card {
    margin-top: 12px;
  }
}

/* 5.6.0 — panel promocji w koszyku na telefonach. */
@media (max-width: 767px) {
  .miceyupsell-cart-panel-headline {
    display: block;
  }

  .miceyupsell-cart-panel-headline h3 {
    font-size: 18px;
  }

  .miceyupsell-cart-rules-link {
    display: inline-block;
    margin-top: 6px;
  }

  .miceyupsell-cart-promo {
    padding: 14px;
    border-radius: 14px;
  }

  .miceyupsell-cart-promo-head {
    flex-direction: row;
    align-items: flex-start;
  }

  .miceyupsell-cart-promo-title {
    font-size: 15px;
  }

  .miceyupsell-cart-values {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .miceyupsell-cart-values > div {
    padding: 9px 8px;
  }

  .miceyupsell-cart-values > div:last-child {
    text-align: right;
  }

  .miceyupsell-cart-values dd,
  .miceyupsell-cart-values > div:last-child dd {
    font-size: 14px;
  }

  .miceyupsell-cart-values > div:first-child dd {
    font-size: 12px;
  }

  .miceyupsell-cart-opportunity-head {
    padding: 12px 12px 9px;
  }

  .miceyupsell-cart-opportunity-head strong {
    font-size: 14px;
  }

  .miceyupsell-cart-opportunity-head span {
    font-size: 11px;
  }

  .miceyupsell-cart-opportunities {
    padding: 9px;
  }

  .miceyupsell-cart-opportunities li {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 9px;
    padding: 12px 10px;
  }

  .miceyupsell-cart-opportunity-plus {
    width: 30px;
    height: 30px;
    font-size: 20px;
  }

  .miceyupsell-cart-opportunity-value {
    grid-column: 2;
    min-width: 0;
    text-align: left;
  }

  .miceyupsell-cart-opportunity-value small,
  .miceyupsell-cart-opportunity-value b,
  .miceyupsell-cart-opportunity-value em {
    display: inline-block;
    margin: 3px 6px 0 0;
    vertical-align: middle;
  }

  .miceyupsell-cart-opportunity-value b {
    font-size: 15px;
  }

  .miceyupsell-cart-discount-scope li {
    align-items: flex-start;
  }
}

/* 5.6.1 — product banners use the source image ratio on phones. */
@media (max-width: 767px) {
  .miceyupsell-banners--product,
  .miceyupsell-banners--product .miceyupsell-banner,
  .miceyupsell-banners--product .miceyupsell-banner__link,
  .miceyupsell-banners--product .miceyupsell-banner__picture {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible;
  }

  .miceyupsell-banners--product .miceyupsell-banner__picture {
    overflow: hidden !important;
    line-height: 0;
  }

  .miceyupsell-banners--product .miceyupsell-banner__picture img,
  .miceyupsell-banners--product .miceyupsell-banner--pending .miceyupsell-banner__picture img,
  .miceyupsell-banners--product .miceyupsell-banner--wide .miceyupsell-banner__picture img,
  .miceyupsell-banners--product .miceyupsell-banner--contained .miceyupsell-banner__picture img,
  .miceyupsell-banners--product .miceyupsell-banner--autocrop .miceyupsell-banner__picture img {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    transform: none !important;
    object-fit: contain !important;
    object-position: center !important;
  }
}

/* 5.6.2 — no decorative card around product-page banners on phones. */
@media (max-width: 767px) {
  .miceyupsell-banners--product .miceyupsell-banner,
  .miceyupsell-banners--product .miceyupsell-banner__picture,
  .miceyupsell-banners--product .miceyupsell-banner__picture img {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}
