/* Dealify Core Design System — BuyHatke Aesthetic */
:root {
  --primary: #1A237E; /* Deep Royal Blue */
  --primary-dark: #121858;
  --primary-light: #283593;
  --primary-bg: #E8EAF6;
  --accent: #FFC107; /* High-contrast Yellow */
  --accent-dark: #FFB300;
  --accent-light: #FFF8E1;
  --success: #16A34A;
  --success-light: #DCFCE7;
  --dark: #0F172A;
  --dark-light: #1E293B;
  --text: #334155;
  --muted: #64748B;
  --border: #E2E8F0;
  --bg: #F8FAFC;
  --white: #FFFFFF;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,.08);
  --shadow-lg: 0 10px 25px rgba(0,0,0,.1);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 9999px;
  --transition: .25s ease;
}

/* ── GLOBAL ─────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
body { background: var(--bg) !important; color: var(--text) !important; font-family: 'Inter', -apple-system, sans-serif !important; }
::selection { background: var(--primary) !important; color: #fff !important; }
a { color: var(--primary) !important; transition: color var(--transition) !important; }
a:hover { color: var(--primary-dark) !important; }

/* ══════════════════════════════════════════
   NAVBAR — Full ReHub Selector Coverage
══════════════════════════════════════════ */

/* 1. Full header background ─── */
#main_header,
#main_header .header_wrap,
#main_header .logo_section_wrap,
.logo_section_wrap,
.header_five_style,
.header_style_five,
.rh_header_wrap,
.site-header,
header.header {
  background: #FFFFFF !important;
  border-bottom: 1px solid #E2E8F0 !important;
}

/* Sticky header ─── */
.is-sticky #main_header,
.is-sticky .logo_section_wrap,
.sticky-header .logo_section_wrap,
.rh-sticky-header {
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,.08) !important;
  backdrop-filter: blur(12px) !important;
}

/* Compact header padding & Professional Layout ─── */
.logo_section_wrap .rh-container,
.header_five_style .rh-container,
#main_header .rh-container {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

/* The .logo-section acts as the main flex container holding all header items */
@media (min-width: 1024px) {
  #main_header .logo-section {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 15px !important;
    float: none !important;
  }

  /* 1. Logo wrapper */
  #main_header .logo-section > .logo {
    flex-shrink: 0 !important;
    width: auto !important;
    margin: 0 !important;
  }

  /* 2. Main Nav Menu */
  #main_header .logo-section > .main-nav {
    flex-shrink: 0 !important;
    width: auto !important;
    margin: 0 20px !important;
    flex-grow: 0 !important;
  }

  /* 3. Search Box Wrapper */
  #main_header .logo-section > .rh-flex-grow1.hideontablet {
    flex-grow: 1 !important;
    width: 100% !important;
    max-width: 800px !important; /* Allow the search bar to stretch wider */
    display: flex !important;
    justify-content: center !important;
    margin: 0 15px !important;
  }

  /* 4. Actions/Wishlist Wrapper */
  #main_header .logo-section > .header-actions-logo {
    flex-shrink: 0 !important;
    width: auto !important;
    margin: 0 !important;
  }
}

/* 2. Logo ─── */
.logo .textlogo,
.logo .textlogo a,
.rh-text-logo,
.rh-text-logo a,
.site-logo a,
header .logo a,
header .logo span {
  font-size: 24px !important;
  font-weight: 800 !important;
  color: var(--primary) !important;
  letter-spacing: -.5px !important;
  text-decoration: none !important;
  font-family: 'Inter', sans-serif !important;
}
.logo .textlogo a:hover,
.rh-text-logo a:hover { color: var(--accent) !important; }
.logo .sloganlogo,
.rh_text_slogan {
  color: #64748B !important;
  font-size: 11px !important;
  letter-spacing: .3px !important;
}

/* 3. Primary nav menu ─── */
#main_header nav.top_menu > ul,
.main-nav > ul,
.rh_menu > ul { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; gap: 2px !important; }

#main_header nav.top_menu > ul > li > a,
.main-nav .top_menu > ul > li > a,
.rh_menu > ul > li > a,
.header-navigation > ul > li > a {
  color: #334155 !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 10px 14px !important;
  border-radius: 6px !important;
  transition: all .2s ease !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
}
#main_header nav.top_menu > ul > li > a:hover,
.main-nav .top_menu > ul > li > a:hover,
#main_header nav.top_menu > ul > li.current-menu-item > a {
  color: var(--primary) !important;
  background: #F1F5F9 !important;
}

/* Active/current item accent underline */
#main_header nav.top_menu > ul > li.current-menu-item > a {
  color: var(--primary) !important;
  background: #E0E7FF !important;
}

/* Remove default borders */
#main_header nav.top_menu > ul > li,
.main-nav .top_menu > ul > li { border: none !important; background: none !important; }

/* Main nav bar row */
.main-nav,
.rh_menu_wrap,
.nav-main-menu-wrap { background: transparent !important; border: none !important; box-shadow: none !important; }

/* 4. Dropdown menus ─── */
#main_header nav.top_menu ul ul,
#main_header nav.top_menu ul.sub-menu,
.main-nav .top_menu ul ul {
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: var(--radius-md) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,.1) !important;
  padding: 6px !important;
  min-width: 200px !important;
}
#main_header nav.top_menu ul ul li a,
#main_header nav.top_menu ul.sub-menu > li > a {
  color: #334155 !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  display: block !important;
  transition: all .15s ease !important;
}
#main_header nav.top_menu ul ul li a:hover,
#main_header nav.top_menu ul.sub-menu > li > a:hover {
  background: #F1F5F9 !important;
  color: var(--primary) !important;
}

/* 5. Header search ─── */
#main_header .head_search,
.rh-header-search-wrap,
.header-search-wrap {
  display: flex !important;
  align-items: center !important;
}
#main_header .search_section form { width: 100% !important; display: flex !important; align-items: center !important; }

#main_header .head_search input[type="text"],
#main_header .head_search input[type="search"],
.rh-header-search-wrap input[type="text"],
.rh-header-search-wrap input[type="search"],
#main_header form.search-form input {
  border-radius: var(--radius-full) 0 0 var(--radius-full) !important;
  border: none !important;
  background: #F8FAFC !important;
  color: #333 !important;
  padding: 11px 18px !important;
  font-size: 14px !important;
  width: 100% !important;
  flex-grow: 1 !important;
  outline: none !important;
  transition: all .2s ease !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,.03) !important;
}
#main_header form.search-form input:focus,
.rh-header-search-wrap input:focus {
  background: #FFFFFF !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,.03), 0 0 0 3px rgba(37,99,235,.15) !important;
}
#main_header form.search-form input::placeholder,
.rh-header-search-wrap input::placeholder { color: #94A3B8 !important; }

.btnsearch,
button.btnsearch,
button.btnsearch.hideonmobile,
#sticky-wrapper #main_header form.search-form button[type="submit"].btnsearch,
#main_header form.search-form button[type="submit"].btnsearch,
.head_search form.search-form button[type="submit"],
#main_header form.search-form .btnsearch,
#main_header .head_search button,
#main_header .search-btn,
#main_header form.search-form button,
#main_header form.search-form [type="submit"] {
  background-color: #FFC107 !important;
  color: #000 !important;
  border: none !important;
  border-radius: 0 var(--radius-full) var(--radius-full) 0 !important;
  padding: 11px 22px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background .2s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.1) !important;
  min-width: 50px !important;
}
.btnsearch:hover,
button.btnsearch.hideonmobile:hover,
#main_header form.search-form [type="submit"]:hover { background-color: #FFB300 !important; }

/* 6. Header icon buttons (wishlist, compare, account) ─── */
.rh-header-icon,
.rh-wishlistmenu-link,
.rh-compare-header-icon,
.rh-header-icon.mobileinmenu,
#main_header .header-icons a {
  color: #475569 !important;
  font-size: 20px !important;
  padding: 6px 8px !important;
  border-radius: 6px !important;
  transition: all .2s ease !important;
  text-decoration: none !important;
  display: inline-block !important; /* Removed inline-flex to fix badge position */
  position: relative !important;
}
.rh-header-icon i,
.rh-wishlistmenu-link i,
.rh-compare-header-icon i,
#main_header .header-icons a i {
  font-size: 22px !important;
}
.rh-header-icon:hover,
.rh-wishlistmenu-link:hover {
  color: var(--primary) !important;
  background: #F1F5F9 !important;
}

/* Fix Wishlist Notification Bubble */
.rh-header-icon .rh-icon-notice,
.rh-wishlistmenu-link .rh-icon-notice,
#main_header .header-icons a .rh-icon-notice {
  position: absolute !important;
  top: -5px !important;
  right: -5px !important;
  background-color: var(--dealify-orange) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: bold !important;
  width: 18px !important;
  height: 18px !important;
  line-height: 18px !important;
  border-radius: 50% !important;
  text-align: center !important;
  padding: 0 !important;
  display: inline-block !important;
}
/* Wishlist count badge */
.rh-wishlistmenu-link .rh-header-count,
.wishlist-count {
  background: var(--accent) !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  width: 17px !important;
  height: 17px !important;
  line-height: 17px !important;
  text-align: center !important;
  position: absolute !important;
  top: -4px !important; right: -4px !important;
}

/* 7. Mobile menu toggle ─── */
.rhslidermenu,
.rh-mobile-menu-toggle,
.menu-btn,
.menubtn {
  color: #fff !important;
  background: rgba(255,255,255,.07) !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  border: none !important;
  cursor: pointer !important;
}

/* 8. Top bar (if used) ─── */
.topbar_wrap,
.header_topbar { background: #080F1E !important; border-bottom: 1px solid rgba(255,255,255,.04) !important; }
.topbar_wrap a, .header_topbar a { color: rgba(255,255,255,.5) !important; font-size: 12px !important; }
.topbar_wrap a:hover { color: rgba(255,255,255,.8) !important; }

/* ── CTA BUTTONS ────────────────────────── */
.rehub-main-btn, .btn_offer_block, .cegg-btn-buy, .wpsm-button,
a.re_track_btn, .rh-deal-compact-btn, .custom-cta-btn,
.single_add_to_cart_button, .woo_loop_btn, a.woo_loop_btn,
a.re_track_btn.woo_loop_btn {
  background: var(--accent) !important; color: #fff !important; border: none !important;
  border-radius: var(--radius-sm) !important; font-weight: 600 !important; font-size: 14px !important;
  padding: 10px 22px !important; text-decoration: none !important; cursor: pointer !important;
  box-shadow: 0 2px 8px rgba(249,115,22,.25) !important;
  transition: all var(--transition) !important; display: inline-flex !important;
  align-items: center !important; justify-content: center !important; gap: 6px !important;
  line-height: 1.4 !important; text-transform: none !important; letter-spacing: .2px !important;
}
.rehub-main-btn:hover, .btn_offer_block:hover, .cegg-btn-buy:hover,
.wpsm-button:hover, a.re_track_btn:hover, a.woo_loop_btn:hover,
.single_add_to_cart_button:hover {
  background: var(--accent-dark) !important; color: #fff !important;
  transform: translateY(-1px) !important;
}

/* ═══════════════════════════════════════════
   PRODUCT CARDS — CLEAN MINIMAL REDESIGN
   - Single border only
   - 2-line title (hard clamp)
   - Price + "View Deal" same row
   - Compare/Wishlist ALWAYS visible (top-left)
   - Best deal strip at bottom
═══════════════════════════════════════════ */

/* Card wrapper — SINGLE border, no double */
.deal-item,
.col_item .deal-item,
.col_wrap_fourth .col_item .deal-item,
.col_wrap_three .col_item .deal-item,
.grid_woo .product,
.products li.product,
.woocommerce ul.products li.product {
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;         /* ← removes double shadow */
  padding: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
  position: relative !important;
}
.deal-item:hover,
.woocommerce ul.products li.product:hover {
  border-color: #A5B4FC !important;   /* indigo-300 */
  box-shadow: 0 4px 16px rgba(67,56,202,.08) !important;
}
/* Kill any inner wrappers that add their own border/bg */
.deal-item *,
.col_item .deal-item *,
.woocommerce ul.products li.product * { box-shadow: none !important; }
/* But restore for buttons */
.deal-item .re_track_btn { box-shadow: unset !important; }

/* ── IMAGE ZONE ─────────────────────────── */
.deal-item > a:first-of-type,
.deal-item .deal-item-img,
.grid_woo .product > a.woocommerce-loop-product__link {
  display: block !important;
  background: #F8FAFC !important;
  border-bottom: 1px solid #F1F5F9 !important;
  overflow: hidden !important;
  border-radius: 0 !important;
}
.deal-item > a:first-of-type img,
.deal-item .deal-item-img img,
.grid_woo .product img.attachment-woocommerce_thumbnail,
.deal-item img.deal-thumb {
  width: 100% !important;
  height: 180px !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
  padding: 12px !important;
  background: #F8FAFC !important;
  border-radius: 0 !important;
  border: none !important;
  transition: transform .3s ease !important;
}
.deal-item:hover img { transform: scale(1.03) !important; }

/* ── WISHLIST + COMPARE BUTTONS — ALWAYS VISIBLE ── */
/* These are ReHub's native .btn_act_for_grid — keep always shown */
.btn_act_for_grid,
.deal-item .btn_act_for_grid,
.woocommerce ul.products li.product .btn_act_for_grid,
.button_action {
  position: absolute !important;
  top: 8px !important;
  left: 8px !important;          /* top-LEFT as per ReHub default */
  right: auto !important;
  display: flex !important;
  flex-direction: row !important;
  gap: 5px !important;
  opacity: 1 !important;          /* ALWAYS VISIBLE — not hidden */
  visibility: visible !important;
  z-index: 10 !important;
  padding: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.btn_act_for_grid a,
.btn_act_for_grid .heartplus,
.btn_act_for_grid .thumbscount,
.button_action a,
.button_action .heartplus,
.button_action .thumbscount,
.button_action .compare_for_grid span {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid #E2E8F0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64748B !important;
  font-size: 13px !important;
  text-decoration: none !important;
  transition: all .2s ease !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.1) !important;
}
.btn_act_for_grid a:hover,
.btn_act_for_grid .heartplus:hover,
.btn_act_for_grid .thumbscount:hover,
.button_action a:hover,
.button_action .heartplus:hover,
.button_action .thumbscount:hover,
.button_action .compare_for_grid span:hover {
  background: var(--primary) !important;
  color: #fff !important;
  border-color: var(--primary) !important;
}

/* Hide the text in the action buttons */
.button_action .wishaddedwrap,
.button_action .wishremovedwrap,
.button_action .comparelabel,
.btn_act_for_grid .comparelabel,
.btn_act_for_grid .wishaddedwrap {
  display: none !important;
}

/* ── SALE BADGE — top-right ─────────────── */
.deal-item .onsale,
.deal-item .saled_badge,
.woocommerce ul.products li.product .onsale {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  left: auto !important;
  background: #16A34A !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  z-index: 10 !important;
  border: none !important;
  box-shadow: none !important;
}

/* ── CARD BODY ──────────────────────────── */
.deal-item-body,
.deal-item .deal-content,
.col_item .deal-item > *:not(a):not(.btn_act_for_grid):not(.onsale):not(.saled_badge) {
  padding: 12px 14px 0 !important;
}

/* ── TITLE — exactly 2 lines, no overflow ─ */
.deal-item h3,
.deal-item h3 a,
.deal-item .post-title,
.deal-item .post-title a,
.col_item h3,
.col_item h3 a,
.grid_woo .product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #1E293B !important;
  line-height: 1.45 !important;
  /* Hard 2-line clamp */
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 39px !important;   /* 2 × line-height */
  max-height: 39px !important;
  margin: 12px 14px 8px !important;
  padding: 0 !important;
  text-decoration: none !important;
  white-space: normal !important;
  word-break: break-word !important;
}
.deal-item .post-title a,
.deal-item h3 a,
.col_item h3 a { color: #1E293B !important; text-decoration: none !important; }
.deal-item .post-title a:hover,
.deal-item h3 a:hover,
.col_item h3 a:hover { color: var(--primary) !important; }

/* ── PRICE + VIEW DEAL — SAME ROW ────────── */
.deal-item .deal-price-row,
.col_item .deal-price-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 8px 14px 12px !important;
  flex-wrap: nowrap !important;
}

/* Price block */
.deal-item .price,
.col_item .price,
.grid_woo .product .price,
.woocommerce ul.products li.product .price {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}
.deal-item .price del,
.grid_woo .product .price del,
.woocommerce ul.products li.product .price del {
  color: #94A3B8 !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
  display: block !important;
}
.deal-item .price del .woocommerce-Price-amount,
.woocommerce ul.products li.product .price del .woocommerce-Price-amount { color: #94A3B8 !important; }
.deal-item .price ins,
.deal-item .price > .woocommerce-Price-amount,
.grid_woo .product .price ins,
.woocommerce ul.products li.product .price ins {
  color: #1E293B !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  line-height: 1 !important;
  display: block !important;
}
.deal-item .price ins .woocommerce-Price-amount bdi,
.grid_woo .product .price ins bdi,
.woocommerce ul.products li.product .price ins bdi { color: #1E293B !important; }

/* "View Deal" button — right side of row, compact */
.deal-item .re_track_btn.woo_loop_btn,
.deal-item a.woo_loop_btn,
.deal-item a.re_track_btn,
.col_item .re_track_btn,
.grid_woo .re_track_btn.woo_loop_btn,
.woocommerce ul.products li.product a.re_track_btn,
a.re_track_btn.woo_loop_btn {
  background: #F97316 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 7px !important;
  padding: 8px 14px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background .2s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  width: auto !important;           /* NOT full width — sits next to price */
  margin: 0 !important;
  box-shadow: none !important;
}
.deal-item .re_track_btn.woo_loop_btn:hover,
a.re_track_btn.woo_loop_btn:hover { background: #EA580C !important; }

/* ── BEST DEAL / COMPARE STRIP — BOTTOM ─── */
/* ReHub outputs .re_compare_in_loop or .btn_tocompare below the button */
.re_compare_in_loop,
.btn_tocompare,
.deal-item .re_compare_grid,
.woo_grid_compact .re_compare_grid,
.deal-item .compare-price-info,
.compare-price-link {
  display: block !important;
  text-align: center !important;
  color: #4338CA !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  padding: 6px 14px 10px !important;
  text-decoration: none !important;
  border-top: 1px solid #F1F5F9 !important;
  margin: 0 !important;
  background: #FAFAFA !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.re_compare_in_loop:hover,
.btn_tocompare:hover { color: #3730A3 !important; text-decoration: underline !important; }

/* ── GRID LAYOUT ────────────────────────── */
.col_wrap_fourth,
.col_wrap_three {
  display: flex !important;
  flex-wrap: wrap !important;
  margin: -8px !important;
  padding: 0 !important;
}
.col_wrap_fourth .col_item {
  width: 25% !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
}
.col_wrap_three .col_item {
  width: 33.333% !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
}
/* ── ELEMENTOR GRID (ReCompare) ───────────── */
/* Apply the single clean border and white background, but DO NOT override padding or positioning so we don't break ReHub's absolute bottom row or slider heights. */
.col_item.woo_grid_compact {
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

/* Hide the weird metadata (Camera/Flight Time) being injected into coffee machines */
.col_item.woo_grid_compact .wp-block-group.is-layout-flow,
.col_item.woo_grid_compact .product-attributes,
.col_item.woo_grid_compact .def_quick_view {
  display: none !important;
}

@media (max-width: 900px) {
  .col_wrap_fourth .col_item { width: 50% !important; }
}
@media (max-width: 540px) {
  .col_wrap_fourth .col_item,
  .col_wrap_three .col_item { width: 50% !important; }
}
@media (max-width: 360px) {
  .col_wrap_fourth .col_item,
  .col_wrap_three .col_item { width: 100% !important; }
}

/* ═══════════════════════════════════════════
   DEALIFY CARDS (CUSTOM LOOP)
═══════════════════════════════════════════ */
.dealify-product-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 24px !important;
}

.dealify-card {
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  position: relative !important;
  transition: all .2s ease !important;
}

.dealify-card:hover {
  border-color: #C7D2FE !important;
  box-shadow: 0 8px 24px rgba(26,35,126,0.08) !important;
  transform: translateY(-4px) !important;
}

.dealify-card__media {
  display: block !important;
  background: #F8FAFC !important;
  border-bottom: 1px solid #F1F5F9 !important;
  position: relative !important;
  padding: 16px !important;
  text-align: center !important;
  height: 200px !important;
}

.dealify-card__image {
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  transition: transform .3s ease !important;
}
.dealify-card:hover .dealify-card__image {
  transform: scale(1.05) !important;
}

.dealify-card__badge {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  background: #16A34A !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  z-index: 12 !important;
}

.dealify-card__actions {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  z-index: 12 !important;
}

.dealify-card__action a,
.dealify-card__action span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.95) !important;
  color: #64748B !important;
  font-size: 14px !important;
  border: 1px solid #E2E8F0 !important;
  text-decoration: none !important;
  transition: all .2s ease !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}

.dealify-card__action a:hover,
.dealify-card__action span:hover {
  background: var(--primary) !important;
  color: #fff !important;
  border-color: var(--primary) !important;
}

.dealify-card__action .wishaddedwrap,
.dealify-card__action .wishremovedwrap,
.dealify-card__action .comparelabel { display: none !important; }

/* Force wishlist and compare buttons to be icon-only */
.dealify-card__action .def_btn,
.dealify-card__action .heartplus,
.dealify-card__action .compare_for_grid span {
  font-size: 0 !important; /* hide text */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.dealify-card__action .def_btn::before,
.dealify-card__action .heartplus::before,
.dealify-card__action .compare_for_grid span::before {
  font-size: 14px !important; /* restore icon size */
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  position: static !important;
  display: block !important;
  transform: none !important;
  left: auto !important;
  top: auto !important;
}

/* Also ensure native ReHub button icons (if any) are visible and stacked correctly */
.dealify-card__actions > div,
.dealify-card__actions > span { display: block !important; margin: 0 !important; }

.dealify-card__body {
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

.dealify-card__store {
  font-size: 11px !important;
  color: #64748B !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin-bottom: 6px !important;
  font-weight: 600 !important;
}

.dealify-card__title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #1E293B !important;
  line-height: 1.4 !important;
  margin: 0 0 8px 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  height: 39px !important;
}
.dealify-card__title a { color: #1E293B !important; text-decoration: none !important; }
.dealify-card__title a:hover { color: var(--primary) !important; }

.dealify-card__signals {
  display: flex !important;
  gap: 8px !important;
  font-size: 11px !important;
  color: #94A3B8 !important;
  margin-bottom: 12px !important;
}
.dealify-card__signals span { background: #F1F5F9 !important; padding: 2px 6px !important; border-radius: 4px !important; }

.dealify-card__meta {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-top: auto !important;
  padding-top: 12px !important;
  border-top: 1px solid #F1F5F9 !important;
}

.dealify-card__price {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
}
.dealify-card__price ins,
.dealify-card__price > .woocommerce-Price-amount {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #1E293B !important;
  text-decoration: none !important;
  line-height: 1 !important;
}
.dealify-card__price del {
  font-size: 12px !important;
  color: #94A3B8 !important;
  text-decoration: line-through !important;
  display: block !important;
}

.dealify-card__button {
  background: var(--accent) !important;
  color: #000 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 8px 16px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: background .2s ease !important;
  white-space: nowrap !important;
}
.dealify-card__button:hover { background: var(--accent-dark) !important; }

.dealify-card__compare {
  text-align: center !important;
  background: #F8FAFC !important;
  border-top: 1px solid #E2E8F0 !important;
  padding: 8px 16px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
  text-decoration: none !important;
  display: block !important;
  transition: all .2s ease !important;
}
.dealify-card__compare:hover { background: #F1F5F9 !important; color: var(--primary-dark) !important; }

/* ═══════════════════════════════════════════
   FOOTER FIXES
═══════════════════════════════════════════ */
#b_footer, footer, .footer-bottom, .rh-footer {
  background-color: #0F172A !important;
  color: #F8FAFC !important;
  border: none !important;
}
#b_footer *, footer *, .footer-bottom *, .rh-footer * {
  color: inherit;
}
#b_footer a, footer a, .footer-bottom a, .rh-footer a {
  color: #94A3B8 !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}
#b_footer a:hover, footer a:hover, .footer-bottom a:hover, .rh-footer a:hover {
  color: #F8FAFC !important;
}
/* Hide empty white boxes / reset widget backgrounds */
.rh_widgets_in_footer .widget,
.footer_widget,
.footer-widget,
#b_footer .widget,
footer .widget {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}
/* Ensure widget titles have good contrast */
#b_footer .widget-title, footer .widget-title, .rh-footer .widget-title {
  color: #FFFFFF !important;
  border-bottom: 1px solid rgba(255,255,255,0.1) !important;
  padding-bottom: 10px !important;
  margin-bottom: 20px !important;
}