:root {
  --buko-milk: #FFFAF5;
  --buko-green: #194039;
  --buko-gold: #E6B372;
  --buko-green-hover: #1F5048;
  --buko-success: #1D6B50;
  --buko-error: #C0392B;
  --buko-section-bg: #F5F0EB;
  --buko-green-005: rgba(25, 64, 57, 0.05);
  --buko-green-008: rgba(25, 64, 57, 0.08);
  --buko-green-012: rgba(25, 64, 57, 0.12);
  --buko-green-020: rgba(25, 64, 57, 0.20);
  --buko-green-060: rgba(25, 64, 57, 0.60);
  --buko-radius-sm: 8px;
  --buko-radius-md: 12px;
  --buko-radius-lg: 16px;
  --buko-font: 'Lato', sans-serif;
}

.buko-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--buko-green);
  color: var(--buko-milk);
  border: none;
  border-radius: var(--buko-radius-sm);
  padding: 14px 24px;
  font-family: var(--buko-font);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s ease;
}
.buko-btn-primary:hover {
  background: var(--buko-green-hover);
  color: var(--buko-milk);
  text-decoration: none;
}

.buko-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--buko-green);
  border: 1px solid var(--buko-green);
  border-radius: var(--buko-radius-sm);
  padding: 14px 24px;
  font-family: var(--buko-font);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s ease;
}
.buko-btn-secondary:hover {
  background: var(--buko-green-005);
  color: var(--buko-green);
  text-decoration: none;
}

.buko-badge {
  display: inline-block;
  background: var(--buko-gold);
  color: var(--buko-green);
  border-radius: 6px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
}

.buko-section-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--buko-green);
  margin-bottom: 4px;
}
.buko-section-subtitle {
  font-size: 13px;
  color: var(--buko-green-060);
  margin-bottom: 16px;
}

.buko-sticky-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1040;
  background: var(--buko-milk);
  box-shadow: 0 -2px 8px rgba(25, 64, 57, 0.08);
  padding: 10px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  transform: translateY(100%);
  transition: transform 0.3s ease;
}
.buko-sticky-bar.is-visible {
  transform: translateY(0);
}
.buko-sticky-bar .buko-sticky-price {
  font-size: 20px;
  font-weight: 600;
  color: var(--buko-green);
  white-space: nowrap;
}
.buko-sticky-bar .buko-sticky-btn {
  flex: 1;
  max-width: 200px;
  background: var(--buko-green);
  color: var(--buko-milk);
  border: none;
  border-radius: var(--buko-radius-sm);
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.buko-floating-messenger {
  position: fixed;
  bottom: 20px;
  right: 16px;
  z-index: 1039;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--buko-gold);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 0.2s ease;
}
.buko-floating-messenger:hover {
  transform: scale(1.08);
}
.buko-floating-messenger svg {
  width: 28px;
  height: 28px;
  fill: var(--buko-green);
}
.buko-sticky-bar.is-visible ~ .buko-floating-messenger,
body.sticky-active .buko-floating-messenger {
  bottom: 80px;
}

.buko-how-it-works {
  padding: 24px 0;
}
.buko-how-it-works .buko-step {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
}
.buko-how-it-works .buko-step:last-child {
  margin-bottom: 0;
}
.buko-how-it-works .buko-step-number {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--buko-gold);
  color: var(--buko-green);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
}
.buko-how-it-works .buko-step-content h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--buko-green);
  margin: 0 0 2px;
}
.buko-how-it-works .buko-step-content p {
  font-size: 13px;
  color: var(--buko-green-060);
  margin: 0;
}

.buko-why-us {
  padding: 24px 0;
}
.buko-why-us .buko-check-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.buko-why-us .buko-check-item:last-child {
  margin-bottom: 0;
}
.buko-why-us .buko-check-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--buko-gold);
  display: flex;
  align-items: center;
  justify-content: center;
}
.buko-why-us .buko-check-icon svg {
  width: 12px;
  height: 12px;
  fill: var(--buko-green);
}
.buko-why-us .buko-check-text h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--buko-green);
  margin: 0 0 2px;
}
.buko-why-us .buko-check-text p {
  font-size: 13px;
  color: var(--buko-green-060);
  margin: 0;
}

.buko-final-cta {
  background: var(--buko-green-005);
  border-radius: var(--buko-radius-md);
  padding: 24px 16px;
  text-align: center;
  margin: 24px 0;
}
.buko-final-cta h3 {
  font-size: 18px;
  font-weight: 600;
  color: var(--buko-green);
  margin: 0 0 8px;
}
.buko-final-cta p {
  font-size: 14px;
  color: var(--buko-green-060);
  margin: 0 0 4px;
}
.buko-final-cta .buko-final-cta-note {
  font-size: 12px;
  color: var(--buko-green-060);
  margin-bottom: 16px;
}

.buko-cta-row {
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.buko-cta-row .buko-btn-primary {
  flex: 65;
}
.buko-cta-row .buko-btn-secondary {
  flex: 35;
}

.buko-size-help-toggle {
  font-size: 13px;
  color: var(--buko-green-060);
  cursor: pointer;
  text-decoration: underline;
  border: none;
  background: none;
  padding: 4px 0;
  margin-top: 8px;
}
.buko-size-help {
  display: none;
  background: var(--buko-green-005);
  border-radius: var(--buko-radius-sm);
  padding: 14px;
  margin-top: 8px;
  font-size: 13px;
  color: var(--buko-green);
  line-height: 1.6;
}
.buko-size-help.is-open {
  display: block;
}

@media (min-width: 992px) {
  .buko-sticky-bar {
    display: none !important;
  }
}


/* ===== Hide old theme product buttons (keep #button-cart in DOM for programmatic click) ===== */
.rm-product-center-buttons .rm-product-quantity {
  display: none !important;
}
.rm-product-center-buttons #button-cart {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  padding: 0 !important;
  margin: -1px !important;
}
.rm-product-one-click-btn {
  display: none !important;
}
.rm-product-center-buttons > .d-flex:first-child {
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ===== Restyle chat widget to BUKO gold/green design ===== */
#rm_fixed_contact_button {
  background: var(--buko-gold) !important;
  box-shadow: 0 4px 16px rgba(230, 179, 114, 0.4) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
#rm_fixed_contact_button:hover {
  transform: scale(1.06);
  box-shadow: 0 6px 20px rgba(230, 179, 114, 0.5) !important;
}
.rm-fixed-contact-pulsation {
  background: var(--buko-gold) !important;
}
.rm-fixed-contact-icon {
  color: var(--buko-green) !important;
}
.rm-fixed-contact-icon i {
  color: var(--buko-green) !important;
}
.rm-fixed-contact-dropdown {
  border-radius: var(--buko-radius-md) !important;
  box-shadow: 0 8px 32px rgba(25, 64, 57, 0.15) !important;
  border: 1px solid var(--buko-green-012) !important;
}
.rm-fixed-contact-item {
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
  transition: background 0.15s ease !important;
  border-radius: 6px !important;
  padding: 6px 8px !important;
}
.rm-fixed-contact-item:hover {
  background: var(--buko-green-005) !important;
  color: var(--buko-green) !important;
}
.rm-fixed-contact-item-icon {
  width: 36px !important;
  height: 36px !important;
}
.rm-fixed-contact-instagram .rm-fixed-contact-item-icon,
.rm-fixed-contact-item-icon.rm-fixed-contact-instagram {
  background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%) !important;
}

/* ===== Hide separate Instagram floating button (moved into chat dropdown) ===== */
.buko-floating-messenger {
  display: none !important;
}
.buko-sticky-bar.is-visible ~ .buko-floating-messenger,
body.sticky-active .buko-floating-messenger {
  display: none !important;
}



/* ================================================================
   BUKO VISUAL SKIN — Phase 2: Visual Consistency
   Override ReMarket theme defaults with BUKO brand palette
   Rule: NO pure white #FFF, NO pure black #000
   ================================================================ */

/* --- 1. Global: body, font, base color --- */
body,
.body-product {
  background-color: var(--buko-milk) !important;
  font-family: var(--buko-font) !important;
  color: var(--buko-green) !important;
}
#top {
  background: var(--buko-milk) !important;
}
a {
  color: var(--buko-green) !important;
}
a:hover {
  color: var(--buko-green-hover) !important;
}

/* --- 2. Product title H1 --- */
.body-product h1 {
  font-family: var(--buko-font) !important;
  font-weight: 600 !important;
  font-size: 22px !important;
  color: var(--buko-green) !important;
  line-height: 1.3 !important;
  margin-bottom: 8px !important;
}

/* --- 3. "В наявності" badge --- */
.rm-module-stock {
  color: var(--buko-success) !important;
  font-family: var(--buko-font) !important;
  font-weight: 500 !important;
  font-size: 13px !important;
}
.productdrive {
  background: var(--buko-success) !important;
}

/* --- 4. Price --- */
.rm-product-center-price {
  font-family: var(--buko-font) !important;
}
.rm-product-center-price > span:first-child {
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
  font-weight: 600 !important;
  font-size: 24px !important;
}
.rm-product-center-price-old {
  color: var(--buko-green-060) !important;
  font-family: var(--buko-font) !important;
  font-size: 14px !important;
}
.rm-product-center-price-sticker {
  background: var(--buko-gold) !important;
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
  font-weight: 500 !important;
  font-size: 11px !important;
  border-radius: 6px !important;
  border: none !important;
}
.rm-product-center-price-tax {
  color: var(--buko-green-060) !important;
  font-family: var(--buko-font) !important;
}

/* --- 5. Product stickers (Хіт, Акція) --- */
.rm-module-stickers-sticker {
  background: var(--buko-gold) !important;
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
  font-weight: 500 !important;
  font-size: 11px !important;
  border-radius: 6px !important;
  border: none !important;
  padding: 3px 10px !important;
}

/* --- 6. Article/SKU --- */
.modell,
.modell_mob,
.rm-product-center-info-item-title {
  color: rgba(25,64,57,0.5) !important;
  font-family: var(--buko-font) !important;
  font-size: 13px !important;
}

/* --- 7. Breadcrumbs --- */
.rm-breadcrumb {
  font-family: var(--buko-font) !important;
  font-size: 12px !important;
}
.rm-breadcrumb-item a {
  color: var(--buko-green-060) !important;
}
.rm-breadcrumb-item a:hover {
  color: var(--buko-green) !important;
}
.rm-breadcrumb-item:last-child {
  color: var(--buko-green) !important;
}
.rm-breadcrumb-item + .rm-breadcrumb-item::before {
  color: var(--buko-green-020) !important;
}

/* --- 8. Size pills --- */
.radio-box {
  border: 1px solid var(--buko-green-020) !important;
  border-radius: 8px !important;
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
  background: transparent !important;
}
.radio-box.active,
.radio-box:has(input:checked) {
  border-color: var(--buko-green) !important;
  background: var(--buko-green-005) !important;
}
.radio-box::after {
  background: var(--buko-green) !important;
}

/* --- 9. Accordion (Опис, Доставка, Гарантія) --- */
.rm-accardion-title {
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  border-bottom-color: var(--buko-green-008) !important;
}
.rm-accardion-item {
  border-color: var(--buko-green-008) !important;
}
.rm-accardion-content {
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}
.rm-product-tabs-attributtes-list-item {
  border-color: var(--buko-green-008) !important;
  font-family: var(--buko-font) !important;
  color: var(--buko-green) !important;
}

/* --- 10. Section backgrounds --- */
.buko-how-it-works {
  background: var(--buko-section-bg) !important;
  border-radius: var(--buko-radius-md) !important;
  padding: 20px 16px !important;
  margin: 16px 0 !important;
}
.buko-why-us {
  background: var(--buko-section-bg) !important;
  border-radius: var(--buko-radius-md) !important;
  padding: 20px 16px !important;
  margin: 16px 0 !important;
}

/* --- 11. Slick gallery dots --- */
.rm-product-images-main .slick-dots li button {
  background: var(--buko-green-020) !important;
}
.rm-product-images-main .slick-dots li.slick-active button {
  background: var(--buko-green) !important;
}

/* --- 12. Header --- */
.rm-header,
header {
  background: var(--buko-milk) !important;
}
.rm-header-cart-quantity {
  background: var(--buko-gold) !important;
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
  font-weight: 600 !important;
}
.rm-mobile-nav-buttons-btn,
.rm-header-cart {
  color: var(--buko-green) !important;
}
.invert_sidebar {
  /* filter: none - disabled, working with invert instead */
}

/* --- 13. Marquee bar (already styled, reinforce) --- */
.top-nav-info-list a,
.top-nav-account-links-item a,
.top-nav-account-links-item button,
.top-nav-account-links-item > span {
  font-family: var(--buko-font) !important;
}

/* --- 14. Dividers --- */
hr,
.rm-product-center > hr,
.rm-product-center-options > hr {
  border-color: var(--buko-green-008) !important;
  opacity: 1 !important;
}

/* --- 15. Footer --- */
.rm-footer {
  background-color: var(--buko-section-bg) !important;
  font-family: var(--buko-font) !important;
}
.rm-footer,
.rm-footer-text,
.rm-footer-credits {
  color: var(--buko-green) !important;
}
.rm-footer-phones,
.rm-footer-links-list a,
.rm-footer-phones a {
  color: rgba(25,64,57,0.7) !important;
}
.rm-footer-phones a:hover,
.rm-footer-links-list a:hover {
  color: var(--buko-green) !important;
}

/* --- Misc polish --- */
.rm-product-center {
  font-family: var(--buko-font) !important;
}
.rm-product-center-info-item {
  font-family: var(--buko-font) !important;
  color: var(--buko-green) !important;
}
.rm-product-center-info-item-reviews .blue-link {
  color: var(--buko-green-060) !important;
}
.rm-product-center-options label {
  font-family: var(--buko-font) !important;
  color: var(--buko-green) !important;
}
.form-control {
  font-family: var(--buko-font) !important;
  color: var(--buko-green) !important;
  border-color: var(--buko-green-012) !important;
}
.form-control:focus {
  border-color: var(--buko-green) !important;
  box-shadow: 0 0 0 2px var(--buko-green-008) !important;
}
.modal-content {
  background: var(--buko-milk) !important;
  font-family: var(--buko-font) !important;
}
.modal-title {
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
}

/* Product info section wrapper */
.rm-product-center-stock {
  font-family: var(--buko-font) !important;
}

/* Wishlist button */
.rm-product-top-button {
  color: var(--buko-green) !important;
}
.rm-product-top-button:hover {
  background: var(--buko-green) !important;
  color: var(--buko-milk) !important;
}

/* Related products / modules */
.rm-module-title a,
.rm-module-title {
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
}
.rm-module-header span {
  border-color: var(--buko-green) !important;
  color: var(--buko-green) !important;
  font-family: var(--buko-font) !important;
}
.rm-module-item {
  background: var(--buko-milk) !important;
  border-color: var(--buko-green-008) !important;
}

/* Mobile menu */
#rm_mobile_nav, nav#rm_mobile_nav {
  background: var(--buko-green) !important;
}
.rm-menu-list-item-link {
  font-family: var(--buko-font) !important;
}

/* Buttons override for ReMarket theme buttons we did not hide */
.rm-btn.dark {
  background-color: var(--buko-green) !important;
  color: var(--buko-milk) !important;
  font-family: var(--buko-font) !important;
}
.rm-btn.dark:hover {
  background-color: var(--buko-green-hover) !important;
}
.rm-btn.secondary {
  font-family: var(--buko-font) !important;
  color: var(--buko-green) !important;
}
.rm-btn.primary {
  background-color: var(--buko-green) !important;
  color: var(--buko-milk) !important;
  font-family: var(--buko-font) !important;
}
.rm-btn.primary:hover {
  background-color: var(--buko-green-hover) !important;
}




/* --- Fix: Header icons — work WITH filter:invert(1) --- */
/* SVGs have inline filter:invert(1); color #E6BFC6 inverts to #194039 (buko-green) */
.search-btn svg,
.search-btn {
  color: #E6BFC6 !important;
}
a.wishlist svg,
a.wishlist,
.wishlist.invert_sidebar svg,
a.wishlist.invert_sidebar {
  color: #E6BFC6 !important;
}
.rm-header-cart-icon.invert_sidebar svg,
.rm-header-cart-icon svg {
  color: #E6BFC6 !important;
}
.top-nav-account-links .search-btn svg path {
  fill: #E6BFC6 !important;
}
.rm-btn-icon span {
  background: #194039 !important;
}
nav#rm_mobile_nav, #rm_mobile_nav {
  background: var(--buko-green) !important;
}

/* --- Mobile header: dark green bg, white icons & text --- */
nav#rm_mobile_nav .search-btn svg,
nav#rm_mobile_nav .search-btn {
  color: #000 !important;
}
nav#rm_mobile_nav a.wishlist svg,
nav#rm_mobile_nav a.wishlist,
nav#rm_mobile_nav .wishlist.invert_sidebar svg,
nav#rm_mobile_nav .invert_sidebar {
  color: #000 !important;
}
nav#rm_mobile_nav .rm-header-cart-icon svg,
nav#rm_mobile_nav .rm-header-cart-icon.invert_sidebar svg {
  color: #000 !important;
}
nav#rm_mobile_nav .rm-btn-icon span {
  background: var(--buko-milk) !important;
}
nav#rm_mobile_nav .rm-mobile-nav-buttons-btn,
nav#rm_mobile_nav .rm-header-cart,
nav#rm_mobile_nav .rm-header-cart-text {
  color: var(--buko-milk) !important;
}