.hl-compare-btn{border:1px solid #cfe0ec;background:#fff;color:#0b5f99;border-radius:8px;padding:9px 12px;font-weight:800;cursor:pointer}.hl-compare-btn.active{background:#eaf6ff;border-color:#1784c7}.hl-detail-compare-btn{margin-left:10px;min-height:46px}.hl-compare-tray{position:fixed;left:18px;bottom:22px;z-index:9993;border:0;border-radius:999px;background:#0a77bd;color:#fff;padding:12px 16px;box-shadow:0 10px 30px rgba(0,70,120,.28);font-weight:900}.hl-compare-modal{display:none;position:fixed;inset:0;z-index:10020;background:rgba(5,25,44,.46);padding:24px;overflow:auto}.hl-compare-modal.show{display:block}.hl-compare-dialog{max-width:1000px;margin:5vh auto;background:#fff;border-radius:18px;padding:18px}.hl-compare-head{display:flex;justify-content:space-between;align-items:center}.hl-compare-head button{border:0;background:none;font-size:30px}.hl-compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}.hl-compare-grid article{border:1px solid #e0eaf1;border-radius:14px;padding:14px;display:grid;gap:8px}.hl-compare-grid img{width:100%;height:140px;object-fit:contain}.hl-compare-grid h4{margin:0}.hl-compare-grid article>button{border:0;border-radius:8px;padding:8px;background:#f5f8fb}.hl-notifications-panel{position:fixed;right:18px;top:76px;z-index:10030;width:min(390px,calc(100vw - 24px));max-height:70vh;overflow:auto;background:#fff;border:1px solid #dce8f0;border-radius:16px;box-shadow:0 18px 50px rgba(8,46,76,.22);display:none}.hl-notifications-panel.show{display:block}.hl-notifications-head{display:flex;justify-content:space-between;align-items:center;padding:14px;border-bottom:1px solid #edf2f6}.hl-notifications-head button{border:0;background:#eef6fb;border-radius:8px;padding:8px 10px}.hl-notification-item{display:grid;grid-template-columns:1fr auto;gap:12px;padding:13px 14px;border-bottom:1px solid #edf2f6}.hl-notification-item p{margin:4px 0;color:#526d82}.hl-notification-item small{color:#8799aa}.hl-notification-item>button{border:0;background:#fff0f0;color:#b22;border-radius:8px;width:32px;height:32px;font-size:20px}.hl-notifications-empty{padding:25px;text-align:center;color:#71879b}@media(max-width:600px){.hl-compare-modal{padding:10px}.hl-compare-grid{grid-template-columns:1fr 1fr}.hl-compare-tray{left:12px;bottom:12px}.hl-notifications-panel{right:12px;top:64px}}

/* v27 favorites, clickable cards, compact unread badge */
.hl-favorite-heart,.hl-detail-favorite-heart{border:0;background:#fff;color:#8aa0b2;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 14px rgba(16,55,82,.14);z-index:8;font-family:Arial,sans-serif}
.hl-favorite-heart{position:absolute;right:10px;top:10px;width:34px;height:34px;border-radius:50%;font-size:23px;padding:0}
.hl-detail-favorite-heart{float:right;width:42px;height:42px;border-radius:50%;font-size:28px;margin:0 0 8px 12px}
.hl-favorite-heart.active,.hl-detail-favorite-heart.active{color:#d92d20;background:#fff5f5}
.hl-notification-badge-host{position:relative!important;overflow:visible!important}
.hl-notification-unread-dot{position:absolute!important;right:-3px!important;top:-4px!important;min-width:13px!important;height:13px!important;padding:0 3px!important;border:2px solid #fff!important;border-radius:999px!important;background:#dc2626!important;color:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:7px!important;line-height:9px!important;font-weight:900!important;box-sizing:border-box!important;z-index:20!important;box-shadow:0 1px 4px rgba(0,0,0,.22)!important}
.hl-notification-unread-dot[hidden]{display:none!important}

/* v31 notification buttons + main product arrow */
.header .hl-dash-bell-v9{width:42px;height:42px;min-width:42px;padding:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(0,59,149,.12);border-radius:.8rem;background:#fff;color:#17324d;font-size:18px;cursor:pointer;box-shadow:0 3px 12px rgba(15,23,42,.06)}
#dashboardOverlay .hl-dash-bell-v9{width:40px;height:40px;min-width:40px;padding:0;border:1px solid #dce7ef;border-radius:12px;background:#fff;color:#17324d;font-size:18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.hl-product-arrow-btn{font-size:21px!important;line-height:1!important;min-width:44px!important;padding-left:12px!important;padding-right:12px!important}
@media(max-width:700px){.header .hl-dash-bell-v9{width:38px;height:38px;min-width:38px}}

/* Desktop compare reliability / visibility */
@media (min-width: 769px){
  .hl-compare-tray{left:24px!important;right:auto!important;bottom:24px;min-width:74px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:15px;cursor:pointer}
  .hl-compare-tray:not([hidden]){display:flex!important}
  .hl-compare-modal.show{display:block!important}
  .hl-compare-dialog{max-width:1100px;width:calc(100% - 48px);max-height:86vh;overflow:auto}
  .hl-compare-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
  [data-hl-compare-id]{cursor:pointer}
}

/* Mobile compare tray: keep it on the left side */
@media (max-width: 768px){
  .hl-compare-tray{
    left:12px!important;
    right:auto!important;
    bottom:12px!important;
  }
}

/* Mobile compare button: force to left so it never overlaps the messages/chat button */
@media (max-width: 768px){
  html body .hl-compare-tray{
    position:fixed!important;
    left:14px!important;
    right:auto!important;
    bottom:14px!important;
    margin:0!important;
    transform:none!important;
    z-index:999990!important;
  }
}


/* Desktop compare click fix: keep tray above page layers and clickable */
@media (min-width: 769px){
  html body .hl-compare-tray{
    position:fixed!important;
    left:24px!important;
    right:auto!important;
    bottom:24px!important;
    z-index:2147483000!important;
    pointer-events:auto!important;
    cursor:pointer!important;
    touch-action:manipulation!important;
  }
}

/* v34 — compact compare action inside catalog cards */
.hl-page-catalog .product-actions .hl-card-compare-btn,
.hl-catalog-card-v7 .product-actions .hl-card-compare-btn{
  grid-column:2!important;
  grid-row:1!important;
  width:46px!important;
  min-width:46px!important;
  min-height:46px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:relative!important;
  border:1px solid #d6e3f1!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#315d79!important;
  box-shadow:none!important;
  font-size:0!important;
}
.hl-page-catalog .product-actions .hl-card-compare-btn:hover,
.hl-catalog-card-v7 .product-actions .hl-card-compare-btn:hover{
  border-color:#9bc7e3!important;
  background:#f2f9fe!important;
  color:#0877bd!important;
}
.hl-page-catalog .product-actions .hl-card-compare-btn.active,
.hl-catalog-card-v7 .product-actions .hl-card-compare-btn.active{
  border-color:#1684c7!important;
  background:#eaf6ff!important;
  color:#086aa7!important;
}
.hl-card-compare-icon{width:21px;height:21px;display:block;pointer-events:none}
.hl-card-compare-check{position:absolute;right:4px;top:3px;width:14px;height:14px;display:grid;place-items:center;border-radius:999px;background:#16a34a;color:#fff;font-size:9px;font-weight:900;line-height:1;pointer-events:none}


/* v35 — mobile catalog actions: never allow Compare text to stretch the grid */
@media (max-width: 700px) {
  .hl-page-catalog .product-actions,
  .hl-catalog-card-v7 .product-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 42px 42px !important;
    grid-auto-rows: 46px !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 46px !important;
  }
  .hl-page-catalog .product-actions > *,
  .hl-catalog-card-v7 .product-actions > * {
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    align-self: center !important;
  }
  .hl-page-catalog .product-actions .hl-card-add-btn,
  .hl-catalog-card-v7 .product-actions .hl-card-add-btn {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 12px !important;
    white-space: normal !important;
    line-height: 1.15 !important;
  }
  .hl-page-catalog .product-actions .hl-card-compare-btn,
  .hl-catalog-card-v7 .product-actions .hl-card-compare-btn,
  .hl-page-catalog .product-actions .details-btn,
  .hl-catalog-card-v7 .product-actions .details-btn {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    padding: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    font-size: 0 !important;
  }
  .hl-card-compare-btn .hl-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
  .hl-card-compare-btn .hl-card-compare-icon {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    margin: 0 auto !important;
  }
}