/* Перший шар — «Обране»: сердечка на картках і товарі, іконка в шапці, сторінка /obrane/ (fl-fav.php, 03.10.2026) */
.fl-favbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;color:var(--fl-muted);
  border:1px solid var(--fl-line)!important;background:#fff!important;border-radius:999px!important;box-shadow:none!important;
  font:inherit;font-family:var(--fl-b);font-size:14px;font-weight:600;text-transform:none!important;letter-spacing:0!important;
  transition:color .15s,border-color .15s,background .15s,transform .15s;-webkit-tap-highlight-color:transparent}
.fl-favbtn svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;transition:fill .15s,stroke .15s,transform .15s}
.fl-favbtn:hover{color:var(--fl-coral);border-color:#F3C2C4!important;background:var(--fl-coral-lt)!important}
.fl-favbtn.is-on{color:var(--fl-coral)!important;border-color:#F3C2C4!important}
.fl-favbtn.is-on svg{fill:var(--fl-coral);stroke:var(--fl-coral)}
.fl-favbtn.is-pop svg{animation:fl-fav-pop .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes fl-fav-pop{0%{transform:scale(.7)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.fl-favbtn.is-pop svg{animation:none}}

/* кружечок у правому верхньому куті картки (ліворуч стоять позначки .fl-flags) */
.fl-favbtn--card{position:absolute;top:10px;right:10px;z-index:3;width:38px;height:38px;padding:0!important;box-shadow:0 2px 8px rgba(18,37,60,.10)!important}
.fl-favbtn--card:hover{transform:translateY(-1px)}
/* на сторінці товару — кнопка з підписом під «У кошик» */
.fl-favbtn--pdp{margin:14px 0 0;min-height:46px;padding:0 18px!important;color:var(--fl-ink)}
.fl-favbtn--pdp.is-on{background:var(--fl-coral-lt)!important}

/* іконка в шапці */
.fl-ico.fl-fav{position:relative}
.fl-ico.fl-fav svg{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;transition:fill .15s}
.fl-ico.fl-fav.has-items svg{fill:var(--fl-coral);stroke:var(--fl-coral)}
.fl-fav-n{position:absolute;top:2px;right:2px;min-width:18px;height:18px;display:grid;place-items:center;padding:0 5px;
  background:var(--fl-coral);color:#fff;border-radius:999px;font-family:var(--fl-m);font-size:10px;font-weight:700;line-height:1;font-style:normal}
.fl-fav-n[hidden]{display:none}
@media (max-width:820px){
  /* у телефонній шапці іконки профілю/кошика сховані (вони в нижній панелі) — сердечко лишаємо поруч із пошуком */
  .fl-head .fl-head-act > a.fl-ico.fl-fav{display:inline-flex!important;padding:9px 8px}
  .fl-head .fl-head-act > a.fl-ico.fl-fav > span{display:none}
  .fl-favbtn--card{width:34px;height:34px;top:8px;right:8px}
  .fl-favbtn--card svg{width:18px;height:18px}
}

/* сторінка /obrane/ */
.fl-favpage{min-height:240px}
.fl-favpage-bar{display:flex;align-items:center;gap:12px;margin:0 0 18px}
.fl-favpage-count{font-family:var(--fl-m);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--fl-muted)}
.fl-favpage-sp{flex:1}
.fl-favpage-clear{border:1px solid var(--fl-line)!important;background:#fff!important;color:var(--fl-muted)!important;cursor:pointer;
  font-family:var(--fl-m)!important;font-size:11px!important;font-weight:700;letter-spacing:.08em;text-transform:uppercase!important;padding:8px 13px!important;border-radius:999px!important;box-shadow:none!important}
.fl-favpage-clear:hover{border-color:var(--fl-coral)!important;color:var(--fl-coral)!important;background:var(--fl-coral-lt)!important}
.fl-favpage-clear[hidden]{display:none}
.fl-favpage-empty{text-align:center;padding:48px 20px;background:var(--fl-card);border:1px dashed var(--fl-line);border-radius:var(--fl-r-card)}
.fl-favpage-empty[hidden]{display:none}
.fl-favpage-empty svg{width:44px;height:44px;fill:none;stroke:var(--fl-coral);stroke-width:1.6;margin-bottom:12px}
.fl-favpage-empty b{display:block;font-family:var(--fl-h);font-size:20px;margin-bottom:8px}
.fl-favpage-empty p{margin:0 auto 20px;max-width:420px;color:var(--fl-muted);font-size:15px;line-height:1.55}
.fl-favpage.is-loading .fl-fav-list{opacity:.5}
.fl-fav-list:empty{display:none}