:root {
    --gg-bottom: 36px;
    --gg-side: 20px;
    --gg-height: 48px;
    --gg-icon: 36px;
    --gg-radius: 999px;
    --gg-z: 100;
    --gg-bg: #faaf00;
    --gg-fg: #0b0d12;
    --gg-hover: #e6a100;
}

.woot-widget-bubble.goldika-gapify-owned {
    box-sizing: border-box !important;
    bottom: var(--gg-bottom) !important;
    height: var(--gg-height) !important;
    min-height: var(--gg-height) !important;
    min-width: var(--gg-height) !important;
    border-radius: var(--gg-radius) !important;
    background: var(--gg-bg) !important;
    color: var(--gg-fg) !important;
    z-index: var(--gg-z) !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    isolation: isolate !important;
    opacity: 1 !important;
    transition: bottom .22s ease, opacity .18s ease, background-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.woot-widget-bubble.goldika-gapify-owned.goldika-gapify-right {
    right: var(--gg-side) !important;
    left: auto !important;
}

.woot-widget-bubble.goldika-gapify-owned.goldika-gapify-left {
    left: var(--gg-side) !important;
    right: auto !important;
}

.woot-widget-bubble.goldika-gapify-owned:not(.woot--close):hover {
    background: var(--gg-hover) !important;
    transform: translateY(-1px) !important;
}

.goldika-gapify__content {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    pointer-events: none;
    white-space: nowrap;
    direction: rtl;
}

.goldika-gapify__icon {
    width: var(--gg-icon);
    height: var(--gg-icon);
    display: inline-grid;
    place-items: center;
    flex: 0 0 var(--gg-icon);
    color: currentColor;
}

/* Goldika launcher icons are outline icons. Keep them stroke-only even if Gapify/theme CSS
   injects fill/stroke rules after the widget is mounted. JS mirrors these as inline !important
   properties on every render for an additional layer of protection. */
.goldika-gapify__icon svg {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    background: unset !important;
    color: currentColor !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
}

.goldika-gapify__icon svg path,
.goldika-gapify__icon svg circle,
.goldika-gapify__icon svg rect,
.goldika-gapify__icon svg line,
.goldika-gapify__icon svg polyline,
.goldika-gapify__icon svg polygon,
.goldika-gapify__icon svg ellipse {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
}

.goldika-gapify__label {
    color: currentColor;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.woot-widget-bubble.goldika-gapify-owned.woot--close .goldika-gapify__content {
    opacity: 0 !important;
    visibility: hidden !important;
}

.woot-widget-bubble.goldika-gapify-owned.woot--close::before,
.woot-widget-bubble.goldika-gapify-owned.woot--close::after {
    content: "" !important;
    position: absolute !important;
    inset: 50% auto auto 50% !important;
    width: 24px !important;
    height: 3px !important;
    border: 0 !important;
    border-radius: 99px !important;
    background: currentColor !important;
    transform-origin: center !important;
    z-index: 4 !important;
}

.woot-widget-bubble.goldika-gapify-owned.woot--close::before {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}

.woot-widget-bubble.goldika-gapify-owned.woot--close::after {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}

html.goldika-gapify-sheet-open .woot-widget-bubble.goldika-gapify-owned {
    z-index: var(--gg-open-z, 1) !important;
}

/* Dedicated open-state path: selector match wins over z-index and simply fades the launcher out. */
html.goldika-gapify-state-hidden .woot-widget-bubble.goldika-gapify-owned {
    opacity: 0 !important;
    pointer-events: none !important;
}

html.goldika-gapify-mobile .woot-widget-bubble.goldika-gapify-owned {
    width: var(--gg-height) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

html.goldika-gapify-mobile-hide-label .woot-widget-bubble.goldika-gapify-owned .goldika-gapify__label {
    display: none !important;
}