:root{
  --scd-ink:#0F0F0F; --scd-muted:#6E6E73;
  --scd-glass-bg:rgba(255,255,255,.72);
  --scd-glass-border:rgba(15,15,15,.06);
  --scd-beige:#F5F2EB;
  --scd-radius:22px;
  --scd-ease:cubic-bezier(0.32,0.72,0,1);
  --scd-width:440px;
}

/* Hide Elementor Menu Cart's native drawer panel (keep the toggle icon visible) */
.elementor-menu-cart__main,
.elementor-menu-cart__container,
.elementor-menu-cart__main-wrap,
.elementor-menu-cart__content{
  display:none !important;
}
/* Keep ONLY the header toggle button visible (the icon + count badge) */
.elementor-menu-cart__toggle{ display:inline-flex !important; }

/* Body lock when drawer open.
 * `overflow:hidden` is enough on desktop, but iOS Safari IGNORES it for touch
 * scrolling — the page scrolls underneath even when the drawer is up. The JS
 * supplements this by setting `position:fixed` on body with a saved scrollY
 * (see open()/close()) — that's the only reliable cross-device lock. We keep
 * `overflow:hidden` here for the desktop scrollbar suppression.
 * `touch-action:none` on the BACKDROP stops touches there from chaining to
 * the page; `overscroll-behavior:contain` on the scroll container stops the
 * drawer's own scroll from chaining to body when the user hits top/bottom. */
body.siil-drawer-open{overflow:hidden;}
body.siil-drawer-open .siil-drawer-backdrop{touch-action:none;}

/* ============================================================================
 * BACKDROP — frosted fullscreen overlay
 * Z-index above chat widgets (Brevo/Crisp/Tidio use ~9999) so clicks through
 * the backdrop land on US, not on the chat icon. Max practical 32-bit signed
 * int leaves headroom for anything else.
 * ========================================================================== */
.siil-drawer-backdrop{
  position:fixed; inset:0; z-index:2147483646;
  background:rgba(15,15,15,.34);
  backdrop-filter:blur(10px) saturate(1.2);
  -webkit-backdrop-filter:blur(10px) saturate(1.2);
  opacity:0; pointer-events:none;
  transition:opacity .35s var(--scd-ease);
}
.siil-drawer-backdrop[aria-hidden="true"]{display:none !important;}
.siil-drawer-open .siil-drawer-backdrop{display:block !important;opacity:1;pointer-events:auto;}
body.siil-drawer-just-closed .mobile-sticky{
  bottom:0 !important;
  transform:translate3d(0,0,0);
}

/* ============================================================================
 * PANEL — crystal glass sidebar
 * Highest int-32 z-index so it always sits above any 3rd-party widget
 * (chat, popups, cookie banner) without hiding them — layer-based approach.
 * ========================================================================== */
.siil-drawer{
  position:fixed; top:0; right:0; bottom:0; z-index:2147483647;
  width:var(--scd-width); max-width:100vw;
  box-sizing:border-box;
  /* Brighter, cleaner white — container glass still subtle behind the backdrop */
  background:
    linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.94) 100%);
  backdrop-filter:blur(32px) saturate(1.6);
  -webkit-backdrop-filter:blur(32px) saturate(1.6);
  border-left:1px solid rgba(15,15,15,.05);
  box-shadow:
    -12px 0 32px rgba(15,15,15,.06),
    -28px 0 80px rgba(15,15,15,.08);
  transform:translateX(100%);
  transition:transform .42s var(--scd-ease), opacity .22s ease, visibility 0s linear .42s;
  display:flex; flex-direction:column;
  will-change:transform;
  font-family:'Albert Sans', system-ui, -apple-system, sans-serif;
  color:var(--scd-ink);
}
.siil-drawer[aria-hidden="true"]{
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.siil-drawer[aria-hidden="true"]:not(.is-closing){
  display:none !important;
}
.siil-drawer.is-closing[aria-hidden="true"]{
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:none !important;
}
.siil-drawer-open .siil-drawer{
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  transition:transform .42s var(--scd-ease), opacity .22s ease;
  transform:translateX(0);
}

/* Drag handle (mobile grip) */
.siil-drawer__drag-handle{display:none;}

/* ============================================================================
 * HEADER
 * ========================================================================== */
.siil-drawer__header{
  padding:22px 24px 14px;
  display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid rgba(15,15,15,.06);
  flex-shrink:0;
}
.siil-drawer__title{
  font-size:19px; font-weight:600; letter-spacing:-.01em;
  margin:0; display:flex; align-items:baseline; gap:10px;
}
.siil-drawer__count{
  font-size:13px; color:var(--scd-muted); font-weight:500;
}
/* Close: minimal X. No bg, no circle — just the icon. */
.siil-drawer__close{
  width:32px !important; min-width:32px !important; height:32px !important;
  border-radius:50% !important;
  background:transparent !important;
  border:0 !important; padding:0 !important;
  color:var(--scd-ink) !important;
  cursor:pointer;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  transition:color .2s var(--scd-ease), transform .25s var(--scd-ease), background .2s var(--scd-ease);
  -webkit-appearance:none !important; appearance:none !important;
  box-shadow:none !important;
  font-size:0; line-height:0;
}
.siil-drawer__close:hover{color:var(--scd-ink) !important; background:rgba(15,15,15,.05) !important; transform:rotate(90deg);}
.siil-drawer__close:active{transform:rotate(90deg) scale(.9);}
.siil-drawer__close svg{width:20px;height:20px;stroke-width:1.8;}

/* ============================================================================
 * LFFS banner slot (populated at open-time if siil-lffs available)
 * ========================================================================== */
.siil-drawer__lffs{ padding:12px 16px 0; flex-shrink:0; }
.siil-drawer__lffs:empty{display:none;}
.siil-drawer__lffs .siil-lffs-banner{
  border-radius:14px; padding:10px 14px; font-size:13px;
}

/* ============================================================================
 * CONTENT — scrollable container holding the items list OR the empty state.
 *
 * `flex:1 1 auto` + `min-height:0` lets it take all space between header/lffs
 * and footer AND shrink below natural content height so the inner scroll kicks
 * in. Without `min-height:0`, a flex child defaults to `min-height:auto`
 * (= content height) — meaning a tall items list inflates `__content` past the
 * drawer bounds, the footer (with the checkout CTA) gets pushed BELOW the
 * viewport, and the user can't reach "Finalizar compra". Bug fixed in 1.4.7.
 *
 * Scrollbar is monochrome (Crystal Glass black-and-white aesthetic). On mobile
 * a swipe is the natural gesture; the thin thumb is just a hint that more is
 * below the fold.
 * ========================================================================== */
.siil-drawer__content{
  flex:1 1 auto;
  min-height:0;
  display:flex; flex-direction:column;
  overflow-y:auto; overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  /* iOS Safari needs both. `overscroll-behavior:contain` stops scroll chain
   * to body when at boundaries; `touch-action:pan-y` tells the engine this
   * area captures vertical drags so they don't bubble to the underlying page. */
  overscroll-behavior:contain;
  touch-action:pan-y;
  scrollbar-width:thin;
  scrollbar-color:rgba(15,15,15,.30) transparent;
}
.siil-drawer__content::-webkit-scrollbar{width:6px;}
.siil-drawer__content::-webkit-scrollbar-track{background:transparent;}
.siil-drawer__content::-webkit-scrollbar-thumb{
  background:rgba(15,15,15,.28);
  border-radius:3px;
  transition:background-color .25s ease;
}
.siil-drawer__content::-webkit-scrollbar-thumb:hover{background:rgba(15,15,15,.55);}

/* ============================================================================
 * ITEMS LIST — refined, airy, minimal
 * Scroll is delegated to `.siil-drawer__content` (the parent). Keep the list
 * as a naturally-sized flex child so the parent can scroll cleanly.
 * ========================================================================== */
.siil-drawer__items{
  flex:none;
  overflow:visible;
  padding:6px 24px 12px;
  list-style:none; margin:0;
}

.siil-drawer-item{
  display:grid; grid-template-columns:66px 1fr; gap:16px;
  padding:18px 0; border-bottom:1px solid rgba(15,15,15,.06);
  transition:opacity .3s var(--scd-ease);
  list-style:none;
}
.siil-drawer-item:last-child{border-bottom:0;}
.siil-drawer-item.is-removing{opacity:.35;pointer-events:none;}
.siil-drawer-item__thumb{
  width:66px; height:99px; border-radius:10px;
  overflow:hidden; background:var(--scd-beige);
  box-shadow:0 1px 2px rgba(15,15,15,.03);
  display:block;
}
.siil-drawer-item__thumb img{
  width:100% !important; height:100% !important; object-fit:cover;
  object-position:center 18%;
  display:block; margin:0 !important; padding:0;
}
.siil-drawer-item__body{display:flex; flex-direction:column; gap:6px; min-width:0;}
.siil-drawer-item__title{
  font-size:14px; font-weight:500; line-height:1.3;
  color:var(--scd-ink) !important; text-decoration:none !important;
  letter-spacing:-.005em;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.siil-drawer-item__title:hover{color:var(--scd-ink) !important;text-decoration:none !important;}
.siil-drawer-item__variation{
  font-size:11.5px; color:var(--scd-muted); line-height:1.3;
  letter-spacing:.005em;
}
.siil-drawer-item__row{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-top:auto;
}
.siil-drawer-item__actions{
  display:flex; align-items:center; gap:6px;
}

/* Qty stepper — minimal hairline, zero fill, icons only */
.siil-drawer-item__qty{
  display:inline-flex; align-items:center;
  border:1px solid rgba(15,15,15,.12);
  border-radius:999px;
  background:transparent !important;
  height:28px; padding:0 2px;
}
.siil-drawer-item__qty button{
  width:24px !important; min-width:24px !important; height:24px !important;
  border:0 !important; background:transparent !important;
  font-size:15px !important; line-height:1 !important;
  color:var(--scd-ink) !important;
  cursor:pointer; padding:0 !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  border-radius:50% !important;
  -webkit-appearance:none !important; appearance:none !important;
  transition:color .2s var(--scd-ease), background .2s var(--scd-ease);
  font-family:inherit; font-weight:400;
  box-shadow:none !important;
  letter-spacing:0;
}
.siil-drawer-item__qty button:hover:not(:disabled){color:var(--scd-ink) !important; background:rgba(15,15,15,.05) !important;}
.siil-drawer-item__qty button:disabled{opacity:.25;cursor:not-allowed;}
.siil-drawer-item__qty-value{
  min-width:22px; text-align:center;
  font-size:12.5px; font-weight:500; color:var(--scd-ink);
  font-variant-numeric:tabular-nums;
  padding:0 2px;
}

.siil-drawer-item__price{
  font-size:13.5px; font-weight:500; color:var(--scd-ink);
  font-variant-numeric:tabular-nums;
  letter-spacing:-.005em;
  white-space:nowrap;
}

/* Remove — trash icon, inline with qty stepper */
.siil-drawer-item__remove{
  width:28px !important; min-width:28px !important; height:28px !important;
  background:transparent !important; border:0 !important; padding:0 !important;
  cursor:pointer;
  color:var(--scd-muted) !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  border-radius:50% !important;
  transition:color .2s var(--scd-ease), background .2s var(--scd-ease), transform .2s var(--scd-ease);
  -webkit-appearance:none !important; appearance:none !important;
  box-shadow:none !important;
  flex-shrink:0;
  font-size:0; line-height:0;
}
.siil-drawer-item__remove:hover{color:#B8342C !important; background:rgba(184,52,44,.06) !important;}
.siil-drawer-item__remove:active{transform:scale(.9);}
.siil-drawer-item__remove svg{width:15px !important; height:15px !important; stroke-width:1.6; display:block;}

/* ============================================================================
 * EMPTY STATE
 * ========================================================================== */
.siil-drawer__empty{
  flex:1 1 auto; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  padding:40px 24px; text-align:center;
}
.siil-drawer__empty-icon{
  width:64px; height:64px; border-radius:50%;
  background:rgba(255,255,255,.55); backdrop-filter:blur(18px) saturate(1.6);
  border:1px solid rgba(255,255,255,.7);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:16px; color:var(--scd-muted);
  box-shadow:0 8px 24px rgba(15,15,15,.08);
}
.siil-drawer__empty-title{
  font-size:17px; font-weight:600; margin:0 0 6px; color:var(--scd-ink);
}
.siil-drawer__empty-text{
  font-size:13px; color:var(--scd-muted); margin:0 0 20px;
  max-width:260px; line-height:1.5;
}

/* ============================================================================
 * FOOTER
 * ========================================================================== */
.siil-drawer__footer{
  flex-shrink:0;
  padding:18px 22px 22px;
  background:linear-gradient(180deg, rgba(255,255,255,.0) 0%, rgba(255,255,255,.5) 40%);
  border-top:1px solid rgba(15,15,15,.06);
}
.siil-drawer__subtotal{
  display:flex; align-items:baseline; justify-content:space-between;
  margin-bottom:14px;
}
.siil-drawer__subtotal-label{font-size:13px; color:var(--scd-muted); font-weight:500;}
.siil-drawer__subtotal-value{font-size:19px; font-weight:600; color:var(--scd-ink); font-variant-numeric:tabular-nums;}

.siil-drawer__ctas{ display:flex; flex-direction:column; gap:10px; }

.siil-drawer__btn{
  display:flex; align-items:center; justify-content:center;
  padding:15px 18px; border-radius:999px;
  font-family:inherit; font-size:14px; font-weight:500;
  letter-spacing:.005em; text-decoration:none !important; cursor:pointer; border:0;
  transition:transform .36s var(--scd-ease), box-shadow .4s var(--scd-ease), background-color .25s ease, color .25s ease;
  will-change:transform, box-shadow;
}
.siil-drawer__btn, .siil-drawer__btn:hover, .siil-drawer__btn:focus, .siil-drawer__btn:visited{
  /* Kill theme link colors (blue underline from Elementor kit) */
  text-decoration:none !important;
}
.siil-drawer__btn--primary{
  background:var(--scd-ink);
  color:#fff !important;
  box-shadow:0 1px 2px rgba(15,15,15,.08), 0 4px 10px rgba(15,15,15,.14);
}
.siil-drawer__btn--primary:hover{
  color:#fff !important;
  transform:translateY(-3px);
  box-shadow:0 2px 4px rgba(15,15,15,.06), 0 10px 22px rgba(15,15,15,.18), 0 18px 40px rgba(15,15,15,.14);
}
.siil-drawer__btn--primary:active{transform:translateY(-1px) scale(.985);}
.siil-drawer__btn--primary.loading,
.siil-drawer__btn--primary.siil-is-loading{
  position:relative;
  color:transparent !important;
  /* SIIL_BFCACHE_CTA 1.4.26: no pointer-events:none here - a CTA restored from the iOS back-forward cache stayed dead */
  transform:translateY(0);
}
.siil-drawer__btn--primary.loading *,
.siil-drawer__btn--primary.siil-is-loading *{color:transparent !important;}
.siil-drawer__btn--primary.loading::after,
.siil-drawer__btn--primary.siil-is-loading::after{
  content:"";
  position:absolute;left:50%;top:50%;
  width:20px;height:20px;margin:-10px 0 0 -10px;
  border:2px solid currentColor;
  border-top-color:transparent;
  border-radius:50%;
  color:#fff;
  animation:siil-atc-spin .7s linear infinite;
  opacity:.95;
}
@keyframes siil-atc-spin { to { transform:rotate(360deg); } }

/* Tiny secondary link under primary CTA (replaces chunky "Ver carrito" button) */
.siil-drawer__cart-link{
  display:block; text-align:center;
  font-size:12px; color:var(--scd-muted) !important;
  text-decoration:underline !important;
  text-decoration-color:rgba(15,15,15,.2) !important;
  text-underline-offset:3px;
  padding:4px 0;
  letter-spacing:.01em;
  transition:color .2s var(--scd-ease);
}
.siil-drawer__cart-link:hover{color:var(--scd-ink) !important;text-decoration-color:var(--scd-ink) !important;}

/* ============================================================================
 * MOBILE — bottom sheet style
 * Force 100vw with !important so any upstream width cascade can't leak through
 * and overflow the viewport. `100dvw` avoids the iOS Safari toolbar-offset bug
 * where 100vw can exceed the visible viewport when URL bar is hidden.
 * ========================================================================== */
@media (max-width:1199px){
  :root{--scd-width:100vw;}
  .siil-drawer{
    top:auto !important; right:0 !important; left:0 !important; bottom:0 !important;
    width:100vw !important;
    width:100dvw !important;
    max-width:100vw !important;
    max-width:100dvw !important;
    height:86vh; max-height:86vh;
    border-left:0;
    border-top-left-radius:24px; border-top-right-radius:24px;
    /* Closed sheet must be fully off-screen on real iOS Safari. translateY(100%)
       can leave the rounded top/handle peeking above the bottom browser chrome. */
    transform:translateY(calc(100% + 96px));
    box-shadow:0 -12px 32px rgba(15,15,15,.1), 0 -28px 80px rgba(15,15,15,.14);
  }
  .siil-drawer[aria-hidden="true"]{
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateY(calc(100% + 160px)) !important;
  }
  .siil-drawer.is-closing[aria-hidden="true"]{
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:none !important;
    transform:translateY(calc(100% + 160px)) !important;
  }
  .siil-drawer-open .siil-drawer{
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
    transform:var(--siil-drawer-mobile-transform, translateY(0)) !important;
  }
  .siil-drawer__drag-handle{
    display:block; width:44px; height:5px; border-radius:3px;
    background:rgba(15,15,15,.18);
    margin:10px auto 4px;
    cursor:grab;
    touch-action:none;
    user-select:none;
    -webkit-user-select:none;
  }
  .siil-drawer__header{
    touch-action:none;
  }
  .siil-drawer.is-dragging{transition:none !important; cursor:grabbing;}
  /* Guarantee children can't exceed parent box when browser zooms font */
  .siil-drawer__header,
  .siil-drawer__footer,
  .siil-drawer__items,
  .siil-drawer__content,
  .siil-drawer__lffs{ max-width:100%; box-sizing:border-box; }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  .siil-drawer, .siil-drawer-backdrop, .siil-drawer__close, .siil-drawer__btn{transition:opacity .2s ease;}
  .siil-drawer__close:hover, .siil-drawer__btn:hover{transform:none !important;}
}

/* Small tweak to the header Elementor Menu Cart toggle — make it trigger our drawer cleanly */
.elementor-menu-cart__toggle{cursor:pointer;}

/* ============================================================================
 * Drawer upsell (-40% extra unit) — AOV-2026-08-15
 * Same Crystal Glass look as the checkout banner (siil-checkout-improvements.php),
 * compacted for the 440px drawer. Scoped under .siil-drawer__upsell: the checkout
 * styles are only printed on is_checkout() (where the drawer never renders).
 * The slot div is always in the (cached) shell; content arrives per-session via
 * the #siil-drawer-upsell WC fragment. Empty slot => no layout footprint.
 * ========================================================================== */
.siil-drawer__upsell{padding:0 16px;}
.siil-drawer__upsell:empty{display:none;}
.siil-drawer__upsell #siil-upsell-fragment:empty{display:none;}
.siil-drawer__upsell #siil-upsell-wrap{
  background:radial-gradient(ellipse at 20% 15%,rgba(252,252,250,0.32) 0%,transparent 45%),radial-gradient(ellipse at 85% 25%,rgba(245,247,250,0.20) 0%,transparent 50%),linear-gradient(180deg,rgba(255,255,255,0.62) 0%,rgba(253,253,253,0.45) 100%);
  -webkit-backdrop-filter:blur(30px) saturate(180%);backdrop-filter:blur(30px) saturate(180%);
  border:1px solid rgba(15,15,15,.08);border-radius:14px;padding:12px;margin:10px 0 4px;
  box-shadow:0 1px 2px rgba(14,14,14,0.05),0 10px 30px rgba(14,14,14,0.06),inset 0 1px 0 rgba(255,255,255,0.85);
  display:flex;align-items:center;gap:10px;position:relative;overflow:hidden;cursor:pointer;
  transition:all .25s ease;
}
.siil-drawer__upsell #siil-upsell-wrap:hover{transform:translateY(-1px);box-shadow:0 2px 4px rgba(14,14,14,0.06),0 14px 40px rgba(14,14,14,0.10),inset 0 1px 0 rgba(255,255,255,0.9);}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-img{position:relative;flex-shrink:0;width:72px;height:96px;border-radius:12px;overflow:hidden;box-shadow:0 4px 14px rgba(14,14,14,0.10);z-index:1;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-img img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;border:none;max-width:none;max-height:none;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-pct{display:inline-flex;align-items:center;position:absolute;bottom:5px;left:5px;background:rgba(255,255,255,0.94);color:#0E0E0E;font-weight:700;font-size:9px;padding:3px 7px;border-radius:20px;box-shadow:0 4px 12px rgba(14,14,14,0.18),inset 0 0 0 1px rgba(14,14,14,0.06);letter-spacing:.2px;z-index:3;line-height:1;text-shadow:none;white-space:nowrap;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;position:relative;z-index:1;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-offer-tag{display:inline-block;align-self:flex-start;background:rgba(255,255,255,0.85);color:#0E0E0E;font-weight:700;font-size:9px;letter-spacing:.6px;padding:2px 7px;border-radius:12px;text-transform:uppercase;border:1px solid rgba(14,14,14,0.10);}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-subtitle{color:#0E0E0E;font-weight:600;font-size:12.5px;line-height:1.15;letter-spacing:-.2px;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-name{color:#7F7F7F;font-size:10.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-price-row{display:flex;align-items:baseline;gap:6px;margin:0;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-old{color:#9a9a9a;font-size:11px;text-decoration:line-through;font-weight:400;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-new{color:#0E0E0E;font-weight:700;font-size:13px;letter-spacing:0;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-save-row{display:inline-block;align-self:flex-start;background:linear-gradient(135deg,#1A1A1A 0%,#0A0A0A 100%);color:#fff;font-weight:600;font-size:10px;padding:5px 10px;border-radius:100px;letter-spacing:.3px;text-transform:uppercase;box-shadow:0 4px 14px rgba(14,14,14,0.18),inset 0 1px 0 rgba(255,255,255,0.10);margin-top:4px;line-height:1.2;white-space:nowrap;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-add{flex-shrink:0;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;z-index:1;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-plus{background:#0E0E0E;color:#fff;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:300;line-height:1;box-shadow:0 4px 14px rgba(14,14,14,0.22),inset 0 1px 0 rgba(255,255,255,0.12);transition:all .25s ease;}
.siil-drawer__upsell #siil-upsell-wrap:hover .siil-u-plus{transform:scale(1.08);background:#1F1F1F;}
.siil-drawer__upsell #siil-upsell-wrap .siil-u-add-label{color:#0E0E0E;font-weight:600;font-size:9px;letter-spacing:.5px;margin-top:3px;text-transform:uppercase;}
.siil-drawer__upsell .siil-u-hint{text-align:center;color:#7F7F7F;font-size:11px;margin:4px 0 8px;letter-spacing:.2px;}
.siil-drawer__upsell .siil-u-hint .siil-u-link{color:#1569AE;text-decoration:underline;cursor:pointer;}
.siil-drawer__upsell .siil-u-sizes{display:flex;flex-wrap:wrap;gap:4px;margin:3px 0 1px;}
.siil-drawer__upsell .siil-u-size{border:1px solid rgba(14,14,14,.16);background:#fff;color:#0E0E0E;font-size:10px;font-weight:700;padding:3px 7px;border-radius:999px;cursor:pointer;line-height:1.2;letter-spacing:.2px;}
.siil-drawer__upsell .siil-u-size.is-on{background:#0E0E0E;color:#fff;border-color:#0E0E0E;}
.siil-drawer__upsell .siil-u-size.is-off,.siil-drawer__upsell .siil-u-size:disabled{opacity:.32;cursor:not-allowed;text-decoration:line-through;}
.siil-drawer__upsell #siil-upsell-wrap.is-deal .siil-u-pct{background:#0E0E0E;color:#fff;}
.siil-drawer__upsell #siil-upsell-wrap.is-deal .siil-u-offer-tag{background:#0E0E0E;color:#fff;border-color:#0E0E0E;}
.siil-drawer__upsell #siil-upsell-wrap.need-size .siil-u-sizes{box-shadow:0 0 0 1.5px #0E0E0E;}
.siil-drawer__upsell #siil-upsell-wrap.need-size .siil-u-plus{opacity:.45;}