
/* Bar */
#cfc-bar.cfc{
  position: fixed; left:0; right:0; bottom:0; z-index: 2147483646;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-flow: column; align-items: center; gap: 8px;
  width:100%; max-width: 1100px; margin: 0 auto 12px;
  padding: 12px 10px calc(12px + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.96); border-top:1px solid #e6e6e6; border-radius:14px; backdrop-filter: blur(6px);
  pointer-events: none;
}
.admin-bar #cfc-bar.cfc{ bottom:32px; }
#cfc-bar .cfc__btn{ pointer-events:auto; display:flex; flex-direction:column; justify-content:center; align-items:center;
  height:78px; border-radius:16px; padding:10px 6px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.06); border:0; cursor:pointer; text-decoration:none; color:inherit; }
#cfc-bar .cfc__btn:hover{ box-shadow:0 2px 8px rgba(0,0,0,.1); }
#cfc-bar .cfc__icon{ font-size:22px; } #cfc-bar .cfc__label{ font-size:14px; margin-top:6px; color:#333; }
#cfc-bar .cfc__btn.is-on{ outline: 2px solid #16a34a33; }
.single-product #cfc-bar{ display:none !important; }

/* Force pointer on product cards/links (theme-safe) */
.Product_product__bI6Qj > a,
.productBoxCA a,
ul.products li.product a.woocommerce-LoopProduct-link,
.homePageProducts .productBoxCA,
.cfc-live__item { cursor: pointer !important; }

/* Settings modal (wider, white theme) */
#cfc-settings[aria-hidden="true"]{ display:none !important; }
#cfc-settings:target{ display:block !important; }
.cfc-modal{ position: fixed; inset: 0; z-index: 2147483600; }
.cfc-modal__backdrop{ position:absolute; inset:0; background: rgba(0,0,0,.35); }
.cfc-modal__content{ position:absolute; left:50%; top:50%; transform: translate(-50%,-50%);
  width:min(98vw, 1240px); max-height:88vh; overflow:auto; background:#fff; border-radius:14px; padding:16px 16px 72px; box-shadow:0 10px 30px rgba(0,0,0,.18); }
.cfc-modal__close{ position:absolute; right:8px; top:6px; font-size:22px; background:transparent; border:0; cursor:pointer; text-decoration:none; }
.cfc-modal__body{ padding-top:8px; }
#cfc-settings .button{border:1px solid #e5e7eb;background:#fff;border-radius:10px;padding:10px 14px;cursor:pointer}
#cfc-settings .button-primary{background:#16a34a;border-color:#16a34a;color:#fff}
/* Footer actions sticky */
#cfc-settings .cfc-modal__footer{
  position: sticky; bottom: -16px; background: linear-gradient(180deg, rgba(255,255,255,0), #fff 30%);
  padding-top: 16px; margin-top: 8px; display:flex; gap:10px; justify-content:flex-end;
}

/* Carded layout for settings */
.LiveDealsFilterModal_modalContent__p_Jr4{
  display:grid; gap:14px;
}
.LiveDealsFilterModal_categoryBox__2cw2F{
  border:1px solid #e5e7eb; border-radius:12px; padding:14px; background:#fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.LiveDealsFilterModal_p1__KzFWN{ font-weight:700; color:#111827; margin-bottom:6px; }
.LiveDealsFilterModal_p2__nPVQF{ color:#111827; font-weight:600; }
.LiveDealsFilterModal_p3__w5lUV{ color:#374151; font-size:13px; }
.LiveDealsFilterModal_discountBoxes__lcF9s{
  display:grid; grid-template-columns: repeat(auto-fill,minmax(110px,1fr)); gap:8px; margin-top:8px;
}
.LiveDealsFilterModal_discountBox__jf2qw{
  border:1px solid #e5e7eb; background:#fff; border-radius:10px; padding:10px 8px; cursor:pointer;
}
#cfc-cats{
  display:grid; grid-template-columns: repeat(auto-fill,minmax(240px,1fr)); gap:10px;
}
#cfc-cats .categoryBox{
  border:1px solid #e5e7eb; border-radius:10px; padding:10px; background:#fff;
}

/* Live overlay (unchanged width) */
#cfc-live[aria-hidden="true"]{ display:none !important; }
.cfc-live{ position: fixed; inset: 0; z-index: 2147483600; }
.cfc-live__backdrop{ position:absolute; inset:0; background: rgba(0,0,0,.4); }
.cfc-live__box{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:min(98vw, 1240px); height:min(92vh, 820px); background:#fff; border-radius:14px; box-shadow:0 10px 30px rgba(0,0,0,.18); overflow:auto; padding:12px; }
.cfc-live__list{ display:grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap:12px; }
.cfc-live__item{ display:flex; gap:10px; padding:10px; border:1px solid #e5e7eb; border-radius:12px; background:#fff; text-decoration:none; color:inherit; }
.cfc-live__item img{ width:72px; height:72px; object-fit:cover; border-radius:10px; border:1px solid #f1f5f9; background:#fff; }
.cfc-live__title{ font-weight:600; font-size:14px; line-height:1.3; color:#0f172a; }
.cfc-live__price{ margin-top:4px; font-size:14px; color:#111827; }
.cfc-live__price s{ color:#6b7280; }
.cfc-live__pct{ display:inline-block; margin-left:6px; font-weight:700; color:#166534; background:#dcfce7; padding:2px 6px; border-radius:8px; font-size:12px; }

/* Radar (unchanged) */
.cfc-wait{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background: rgba(255,255,255,.98); z-index:2; }
.cfc-wait__box{ text-align:center; max-width:960px; width:min(92vw, 960px); }
.cfc-wait__radar{ position: relative; width: 260px; height: 260px; margin: 0 auto 18px; border-radius: 50%; background: radial-gradient(closest-side, #d1fae5, #ecfeff 65%); box-shadow: inset 0 0 40px rgba(34,197,94,.25), 0 10px 30px rgba(0,0,0,.08); }
.cfc-wait__ring{ position:absolute; inset:6px; border-radius:50%; border:2px solid rgba(34,197,94,.35); }
.cfc-wait__ring::after{ content:''; position:absolute; inset:-6px; border-radius:50%; border:2px dashed rgba(34,197,94,.25); animation: cfc-pulse 2.6s linear infinite; }
.cfc-wait__scanner{ position:absolute; width:50%; height:2px; top:50%; left:50%; transform-origin: left center; background: linear-gradient(90deg, rgba(16,185,129,.85), rgba(16,185,129,0)); animation: cfc-rotate 2.8s linear infinite; }
@keyframes cfc-rotate{ from{ transform: rotate(0deg); } to{ transform: rotate(360deg); } }
@keyframes cfc-pulse{ 0%{ opacity:.2; } 50%{ opacity:.6;} 100%{ opacity:.2;} }
.cfc-wait__text{ font: 500 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto; color:#0f172a; }
.cfc-wait__text button{ margin-top:10px; padding:8px 12px; border-radius:10px; border:1px solid #e5e7eb; background:#fff; cursor:pointer; }

/* v1.2.3 pointer & close */
.cfc-pointer{ cursor: pointer !important; }
.Product_product__bI6Qj > a,
.productBoxCA a,
ul.products li.product a.woocommerce-LoopProduct-link,
ul.products li.product .woocommerce-LoopProduct__link,
.homePageProducts .productBoxCA,
.woocommerce ul.products li.product,
.cfc-live__item { cursor: pointer !important; }

/* Close button framed and always on top */
.cfc-modal__close{
  position:absolute; right:10px; top:10px;
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:#fff; border:1px solid #e5e7eb; box-shadow:0 1px 3px rgba(0,0,0,.08);
  z-index:5; cursor:pointer;
}
.cfc-modal__close span{ font-size:22px; line-height:1; transform: translateY(-1px); }
.cfc-modal__close:hover{ background:#f8fafc; }

/* Make sure nothing overlays modal content improperly */
#cfc-settings .cfc-modal__content, #cfc-live .cfc-live__box{ pointer-events: auto; }
#cfc-settings .cfc-modal__backdrop, #cfc-live .cfc-live__backdrop{ pointer-events: auto; }

/* v1.2.4 - modal over bar, footer-aware lift, guaranteed pointer */
#cfc-settings.cfc-modal, #cfc-live.cfc-live{ z-index: 999999 !important; }
#cfc-bar.cfc{ z-index: 999990 !important; transition: transform .18s ease; }
body.cfc--modal-open #cfc-bar{ opacity:.98; pointer-events:none; will-change: transform; transform-box: fill-box; }

/* Ensure product grids accept pointer and click */
.woocommerce ul.products li.product,
.homePageProducts .productBoxCA { pointer-events: auto !important; }

/* Close button ensure clickable area */
.cfc-modal__close{ pointer-events:auto !important; }

/* Prevent footer overlay issues inside modal */
#cfc-settings .cfc-modal__content, #cfc-live .cfc-live__box{ position:relative; z-index:2; }

/* v1.2.5 - hide on scroll down / near bottom */
#cfc-bar.cfc{ transition: transform .22s ease, opacity .22s ease; }
#cfc-bar.cfc.cfc--bar-hidden{ transform: translateY(110%); opacity:.98; }

/* v1.2.6 - live close button */
.cfc-live__close{
  position:absolute; right:10px; top:10px;
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:#fff; border:1px solid #e5e7eb; box-shadow:0 1px 3px rgba(0,0,0,.08);
  z-index:5; cursor:pointer;
}
.cfc-live__close span{ font-size:22px; line-height:1; transform: translateY(-1px); }
.cfc-live__close:hover{ background:#f8fafc; }

/* v1.2.7 - Desktop full hide */
#cfc-bar.cfc.cfc--bar-hidden{ transform: translateY(calc(100% + 120px)); opacity:0; pointer-events:none; will-change: transform; transform-box: fill-box; visibility:hidden; }
/* settings removed in 1.2.9 */ .cfc-live__settings_removed{
  position:absolute; right:56px; top:10px;
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:#fff; border:1px solid #e5e7eb; box-shadow:0 1px 3px rgba(0,0,0,.08);
  z-index:5; cursor:pointer;
}
/* settings removed in 1.2.9 */ .cfc-live__settings_removed:hover{ background:#f8fafc; }


/* === Mobile-friendly navbar: horizontal scroll + centered items + safe-area padding === */
@media (max-width: 768px){
  #cfc-bar{
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    scroll-snap-type: x mandatory;
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
  }
  #cfc-bar .cfc__btn{
    display: inline-flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    min-width: 72px;
    margin: 0 6px;
    scroll-snap-align: center;
  }
  #cfc-bar .cfc__icon{
    display: block;
    line-height: 1;
  }
  #cfc-bar .cfc__label{
    display: block;
    text-align: center;
    line-height: 1.2;
    margin-top: 6px;
    white-space: normal; /* allow wrapping label if needed */
  }
  /* Prevent edge clipping near device notches */
  .admin-bar #cfc-bar.cfc{ bottom: calc(32px + env(safe-area-inset-bottom)); }
}
/* Optional: hide scrollbar visuals without disabling scroll */
#cfc-bar::-webkit-scrollbar{ height: 8px; }
#cfc-bar::-webkit-scrollbar-thumb{ background: rgba(0,0,0,.15); border-radius: 8px; }

/* LIVE toolbar (clean) */
#cfc-live .cfc-live__toolbar{position:sticky;top:0;z-index:3;display:flex;gap:8px;justify-content:center;background:rgba(255,255,255,.96);border-bottom:1px solid #eee;padding:8px 10px}
#cfc-live .cfc-live__tool{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:8px;border:0;cursor:pointer;font-weight:600;background:#f6f6f8;color:#1f2937}
#cfc-live .cfc-live__tool[aria-pressed="true"]{background:#f07804;color:#fff}
#cfc-live .cfc-live__tool[aria-pressed="true"] span{color:#fff}


/* === Settings sliders: black thumb + orange fill + black border track === */
#cfc-settings input[type=range]{
  -webkit-appearance: none;
  width: 100%;
  height: 16px;
  background: linear-gradient(#f07804,#f07804) no-repeat, #fff;
  /* background-size JS ile % değerine göre güncellenecek */
  border: 1px solid #111;
  border-radius: 10px;
  outline: none;
}
#cfc-settings input[type=range]::-webkit-slider-runnable-track{
  height: 14px;
  background: transparent; /* dolgu input arka planında */
  border-radius: 10px;
}
#cfc-settings input[type=range]::-moz-range-track{
  height: 14px;
  background: transparent;
  border-radius: 10px;
  border: none;
}
#cfc-settings input[type=range]::-ms-track{
  height: 14px;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
#cfc-settings input[type=range]::-webkit-slider-thumb{
  -webkit-appearance: none;
  width: 18px; height: 18px;
  background: #111; /* siyah thumb */
  border-radius: 50%;
  border: 2px solid #111;
  margin-top: -3px; /* track ortalama */
  cursor: pointer;
}
#cfc-settings input[type=range]::-moz-range-thumb{
  width: 18px; height: 18px;
  background: #111;
  border-radius: 50%;
  border: 2px solid #111;
  cursor: pointer;
}
#cfc-settings input[type=range]::-ms-thumb{
  width: 18px; height: 18px;
  background: #111;
  border-radius: 50%;
  border: 2px solid #111;
  cursor: pointer;
}
/* Hover/focus states */
#cfc-settings input[type=range]:focus-visible{
  box-shadow: 0 0 0 3px rgba(240,120,4,.3);
}

/* Turuncu renkli indirimli fiyat stili */
.cfc-live__price b {
  color: #ff6600 !important;
}


/* === Live Deals: uniform card layout, image area and aligned prices === */
#cfc-live .cfc-live__list{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
  align-items: stretch;
}

#cfc-live .cfc-live__item{
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  padding: 12px;
  height: 360px; /* consistent card height */
  text-decoration: none;
}

#cfc-live .cfc-live__item img{
  width: 100%;
  height: 180px;              /* fixed media window */
  object-fit: contain;        /* keep product proportions */
  background: #f7f7f7;        /* subtle backdrop like example */
  border-radius: 10px;
}

#cfc-live .cfc-live__meta{
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 10px;
  flex: 1;                    /* push price to bottom */
}

#cfc-live .cfc-live__title{
  font-size: 14px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;      /* clamp to two lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.6em;          /* keep rows equal */
}

#cfc-live .cfc-live__price{
  margin-top: auto;           /* lock price row to bottom */
  display: flex;
  align-items: baseline;
  gap: 8px;
}

#cfc-live .cfc-live__price b{ /* discounted price (already set to orange elsewhere) */
  font-size: 18px;
  font-weight: 700;
}

#cfc-live .cfc-live__price s{
  color: #9aa0a6;
  font-size: 13px;
}

#cfc-live .cfc-live__pct{
  font-size: 12px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 6px;
  background: #e6f4ea;        /* soft badge background */
  color: #137333;             /* green text (like example) */
}

/* subtle card hover */
#cfc-live .cfc-live__item:hover{
  box-shadow: 0 6px 20px rgba(0,0,0,0.10);
  transform: translateY(-1px);
  transition: box-shadow .2s ease, transform .2s ease;
}




/* === Settings sticky header: centered title with orange badge only === */
#cfc-settings .cfc-settings__toolbar{
  position: sticky; top: 0; z-index: 3;
  background: #fff; /* keep modal bg */
  color: #1f2937;
  padding: 12px 16px; margin: -8px -8px 8px;
  border: none; border-radius: 10px;
  display: grid; grid-template-columns: 1fr auto; align-items: center;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
#cfc-settings .cfc-settings__title{ justify-self: center; }
#cfc-settings .cfc-settings__title-badge{
  display: inline-block;
  background: #ff7a00; color: #fff;
  padding: 4px 12px; border-radius: 9999px;
  font-weight: 700; font-size: 16px; line-height: 1.2;
}
#cfc-settings .cfc-settings__close{
  justify-self: end; background: transparent; border:0; color:#111827; cursor:pointer;
}
#cfc-settings .cfc-modal__close:not(.cfc-settings__close){ display:none; }


/* === CFC Yellow Theme v2 (non-destructive overrides) === */
:root{
  --cfc-yellow: #fed700;
  --cfc-ink: #111111;
}

/* Bottom bar: yellow background + slimmer buttons (desktop) */
#cfc-bar.cfc{
  background: var(--cfc-yellow) !important;
  border-top-color: var(--cfc-yellow) !important;
  box-shadow: 0 6px 22px rgba(0,0,0,.08);
  padding: 10px 10px calc(10px + env(safe-area-inset-bottom)) !important;
}
#cfc-bar .cfc__btn{
  height: 64px !important;
}
#cfc-bar .cfc__icon{ font-size: 20px !important; }
#cfc-bar .cfc__label{ font-size: 12px !important; color: var(--cfc-ink) !important; }

/* Mobile: a touch thinner */
@media (max-width: 768px){
  #cfc-bar{
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
  }
  #cfc-bar .cfc__btn{
    height: 56px !important;
    min-width: 64px !important;
  }
  #cfc-bar .cfc__icon{ font-size: 18px !important; }
  #cfc-bar .cfc__label{ font-size: 11px !important; }
}

/* Settings modal: yellow header + yellow actions */
#cfc-settings .cfc-settings__toolbar{
  background: var(--cfc-yellow) !important;
  color: var(--cfc-ink) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
#cfc-settings .cfc-settings__title-badge{
  background: var(--cfc-ink) !important;
  color: #fff !important;
}

/* Apply & Reset buttons in yellow */
#cfc-apply,
#cfc-reset{
  background-color: var(--cfc-yellow) !important;
  color: var(--cfc-ink) !important;
  border: none !important;
}
#cfc-apply:hover,
#cfc-reset:hover{
  filter: brightness(0.98);
  box-shadow: 0 0 0 3px rgba(0,0,0,0.14) inset;
}

/* Range sliders: replace orange fill with yellow */
#cfc-settings input[type=range]{
  background: linear-gradient(var(--cfc-yellow), var(--cfc-yellow)) no-repeat, #fff !important;
  border-color: var(--cfc-ink) !important;
}
#cfc-settings input[type=range]:focus-visible{
  box-shadow: 0 0 0 3px rgba(254, 215, 0, .3) !important;
}

/* Live overlay toolbar fully yellow */
#cfc-live .cfc-live__toolbar{
  background: var(--cfc-yellow) !important;
  border-bottom: 1px solid rgba(0,0,0,.12) !important;
}
#cfc-live .cfc-live__tool{
  background: rgba(255,255,255,.85) !important;
  color: var(--cfc-ink) !important;
}
#cfc-live .cfc-live__tool[aria-pressed="true"]{
  background: var(--cfc-ink) !important;
  color: #fff !important;
}
#cfc-live .cfc-live__tool[aria-pressed="true"] span{ color:#fff !important; }

/* Replace remaining oranges with theme yellow (price, badges) */
.cfc-live__price b{ color: var(--cfc-yellow) !important; }
#cfc-settings .cfc-settings__title-badge,
#cfc-live .cfc-live__pct{
  background: var(--cfc-yellow) !important;
  color: var(--cfc-ink) !important;
}

/* Close buttons with yellow chip */
.cfc-modal__close,
.cfc-live__close{
  background: var(--cfc-yellow) !important;
  border-color: transparent !important;
  color: var(--cfc-ink) !important;
}
.cfc-modal__close:hover,
.cfc-live__close:hover{ filter: brightness(.96); }


/* === CFC Yellow Theme v2.1 — fine-tune heights & consistent sliders === */

/* Bottom bar — slimmer on desktop */
#cfc-bar .cfc__btn{
  height: 58px !important; /* was 64 */
}
#cfc-bar .cfc__icon{ font-size: 18px !important; }
#cfc-bar .cfc__label{ font-size: 11px !important; }

/* Bottom bar — slimmer on mobile */
@media (max-width: 768px){
  #cfc-bar{
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom)) !important;
  }
  #cfc-bar .cfc__btn{
    height: 50px !important; /* was 56 */
    min-width: 56px !important;
  }
  #cfc-bar .cfc__icon{ font-size: 16px !important; }
  #cfc-bar .cfc__label{ font-size: 10px !important; }
}

/* Settings sliders — yellow fill with black thumb (dot) */
#cfc-settings input[type=range]{
  background: linear-gradient(var(--cfc-yellow,#fed700), var(--cfc-yellow,#fed700)) no-repeat, #fff !important;
  background-size: 0% 100% !important; /* JS updates to % */
  border: 1px solid #111 !important;
  height: 16px !important;
  border-radius: 10px !important;
}
#cfc-settings input[type=range]::-webkit-slider-thumb{
  -webkit-appearance: none;
  width: 16px; height: 16px;
  background: #111; border: 2px solid #111;
  border-radius: 50%;
  margin-top: -3px;
}
#cfc-settings input[type=range]::-moz-range-thumb{
  width: 16px; height: 16px;
  background: #111; border: 2px solid #111; border-radius: 50%;
}
#cfc-settings input[type=range]::-ms-thumb{
  width: 16px; height: 16px;
  background: #111; border: 2px solid #111; border-radius: 50%;
}

/* Live toolbar — ensure we can place close at right */
#cfc-live .cfc-live__toolbar{
  display: flex;
  align-items: center;
  gap: 8px;
}
#cfc-live .cfc-live__close{
  order: 99;
  margin-left: auto;
}

/* Mobile tweaks */
@media (max-width: 640px){
  #cfc-fab{ width: 48px; height: 48px; 
  overflow: visible; -webkit-tap-highlight-color: transparent;
}
  #cfc-fab .cfc-fab__icon{ font-size: 22px; }
  #cfc-fab .cfc-fab__ring{
  animation: cfc-spin 10s linear infinite; transform-origin:50% 50%; will-change: transform; transform-box: fill-box; inset:-12px; width: 76px; height: 76px; }
  #cfc-fab .cfc-fab__ring text{ font: 700 8px/1 system-ui, -apple-system, Segoe UI, Roboto; letter-spacing: 2px; }
}
@media (max-width: 360px){
  #cfc-fab{ width: 44px; height: 44px; }
  #cfc-fab .cfc-fab__icon{ font-size: 20px; }
  #cfc-fab .cfc-fab__ring{
  animation: cfc-spin 10s linear infinite; transform-origin:50% 50%; will-change: transform; transform-box: fill-box; inset:-10px; width: 68px; height: 68px; }
  #cfc-fab .cfc-fab__ring text{ font: 700 7px/1 system-ui, -apple-system, Segoe UI, Roboto; letter-spacing: 1.6px; }
}

/* Eski alt navbar'ı kalıcı olarak gizle (flash'ı önler) */
#cfc-bar{ display:none !important; }

/* FAB ikonunu ilk kareden sabitle */
#cfc-fab .cfc-fab__icon{
  display: inline-grid;
  place-items: center;
  line-height: 0;          /* metin yüksekliği sıfırla */
  font-size: 0 !important; /* emoji/metin fallback’ı görünmesin */
}

/* Temanın ::before ile ikon basmasını engelle */
#cfc-fab .cfc-fab__icon::before{
  content: none !important;
}

/* SVG her zaman görünür olsun */
#cfc-fab .cfc-fab__icon svg{
  display: block;
  width: 28px; height: 28px; /* PHP’de verdiğimiz ölçüyle aynı */
}

/* --- Range (ayar çubuğu) temel görünüm + progress için hazırlık --- */
.LiveDealsFilterModal_range__dzISD{
  -webkit-appearance:none; appearance:none;
  width:100%;
  height:6px; border-radius:999px;
  background:#e5e7eb;               /* JS gelene kadar gri */
  outline:0;
  transition:background .15s ease;
}

/* Track'i transparan yapıyoruz; arka planı elementin kendisine vereceğiz */
.LiveDealsFilterModal_range__dzISD::-webkit-slider-runnable-track{
  height:6px; border-radius:999px; background:transparent;
}
.LiveDealsFilterModal_range__dzISD::-moz-range-track{
  height:6px; border-radius:999px; background:transparent;
}
.LiveDealsFilterModal_range__dzISD::-ms-track{
  height:6px; border-radius:999px; background:transparent;
  border-color:transparent; color:transparent;
}

/* Başparmak (thumb) */
.LiveDealsFilterModal_range__dzISD::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:18px; height:18px; border-radius:50%;
  background:#111; border:2px solid var(--cfc-yellow, #fed700);
  margin-top:-6px; /* 18px thumb, 6px track -> merkezde dursun */
  cursor:pointer;
}
.LiveDealsFilterModal_range__dzISD::-moz-range-thumb{
  width:18px; height:18px; border-radius:50%;
  background:#111; border:2px solid var(--cfc-yellow, #fed700);
  cursor:pointer;
}
.LiveDealsFilterModal_range__dzISD::-ms-thumb{
  width:18px; height:18px; border-radius:50%;
  background:#111; border:2px solid var(--cfc-yellow, #fed700);
  cursor:pointer;
}

/* Hover/focus küçük vurgular (opsiyonel) */
.LiveDealsFilterModal_range__dzISD:hover{ filter:brightness(0.98); }
.LiveDealsFilterModal_range__dzISD:focus{ box-shadow:0 0 0 2px rgba(254,215,0,.25); }

/* === Ayar slider'ı: sarı/turuncu dolgu için altlık === */
:root{ --cfc-yellow: #fed700; } /* turuncu istersen: #ffa500 */

#cfc-settings input[type=range]{
  -webkit-appearance:none; appearance:none;
  width:100%;
  height:6px;
  border-radius:999px;
  background:#e5e7eb;              /* JS gelene kadar gri taban */
  outline:0;
}
#cfc-settings input[type=range].cfc-fill{
  /* JS yüzdeyi --cfc-pct ile verir; soldan sarı, sonrası gri */
  background:linear-gradient(90deg,var(--cfc-yellow) 0%, var(--cfc-yellow) var(--cfc-pct,0%), #e5e7eb var(--cfc-pct,0%), #e5e7eb 100%);
}

/* Track'i transparan bırakıyoruz, dolgu input arka planında */
#cfc-settings input[type=range]::-webkit-slider-runnable-track{ height:6px; background:transparent; border-radius:999px; }
#cfc-settings input[type=range]::-moz-range-track{ height:6px; background:transparent; border-radius:999px; }

/* Başparmak (thumb) */
#cfc-settings input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:18px;height:18px;border-radius:50%;
  background:#111;border:2px solid var(--cfc-yellow);
  margin-top:-6px; cursor:pointer;
}
#cfc-settings input[type=range]::-moz-range-thumb{
  width:18px;height:18px;border-radius:50%;
  background:#111;border:2px solid var(--cfc-yellow);
  cursor:pointer;
}

/* === Ayar slider'ı: sarı dolgu (progress) === */
:root{ --cfc-yellow: #fed700; } /* turuncu istersen: #ffa500 */

#cfc-settings input[type=range]{
  -webkit-appearance:none; appearance:none;
  width:100%; height:8px; border-radius:999px;
  background:#e5e7eb; /* Firefox tabanı; WebKit’te track’i ayrıca boyuyoruz */
  outline:0;
}

/* WebKit (Chrome/Safari/Android/iOS) — dolgu: var(--cfc-pct) kadar sarı, kalanı gri */
#cfc-settings input[type=range]::-webkit-slider-runnable-track{
  height:8px; border-radius:999px;
  background: linear-gradient(90deg,
    var(--cfc-yellow, #fed700) 0%,
    var(--cfc-yellow, #fed700) var(--cfc-pct, 0%),
    #e5e7eb var(--cfc-pct, 0%),
    #e5e7eb 100%
  );
}

/* Firefox — progress kısmını sarıya boya */
#cfc-settings input[type=range]::-moz-range-track{
  height:8px; border-radius:999px; background:#e5e7eb;
}
#cfc-settings input[type=range]::-moz-range-progress{
  height:8px; border-radius:999px; background:var(--cfc-yellow, #fed700);
}

/* Thumb (siyah top) */
#cfc-settings input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:18px; height:18px; border-radius:50%;
  background:#111; border:2px solid var(--cfc-yellow, #fed700);
  margin-top:-5px; cursor:pointer;
}
#cfc-settings input[type=range]::-moz-range-thumb{
  width:18px; height:18px; border-radius:50%;
  background:#111; border:2px solid var(--cfc-yellow, #fed700);
  cursor:pointer;
}

/* === Canlı Fırsatlar: Tüm cihazlarda tam ekran === */
.cfc-live{position:fixed; inset:0; z-index:2147483646; display:none;}
.cfc-live[aria-hidden="false"],
.cfc-live.open,.cfc-live.is-open,.cfc-live.active,.cfc-live.visible{display:block;}

.cfc-live__backdrop{position:absolute; inset:0; background:rgba(0,0,0,.5);}

.cfc-live__box{
  position:absolute; inset:0; margin:0; max-width:none;
  width:100vw;
  height:100svh; /* modern mobil tarayıcılar */
  height:calc(var(--cfc-vh, 1vh) * 100); /* eski iOS için fallback */
  background:#fff; border-radius:0;
  display:flex; flex-direction:column;
  padding: max(12px, env(safe-area-inset-top))
           max(12px, env(safe-area-inset-right))
           max(12px, env(safe-area-inset-bottom))
           max(12px, env(safe-area-inset-left));
}

.cfc-live__toolbar{
  display:flex; gap:8px; align-items:center; flex-wrap:wrap;
  position:sticky; top:0; z-index:1; background:#fff; padding-bottom:4px; margin-bottom:8px;
}

.cfc-live__close{position:absolute; top:max(8px, env(safe-area-inset-top)); right:max(8px, env(safe-area-inset-right));}

#cfc-live-list{flex:1 1 auto; min-height:0; overflow-y:auto;}

/* Panel açıkken arka plan sayfayı kilitle */
body.cfc--modal-open{overflow:hidden; touch-action:none; overscroll-behavior:contain;}

/* === CFC Live Toolbar: mobile left-align + single row === */
@media (max-width: 640px){
  #cfc-live .cfc-live__toolbar{
    justify-content: flex-start !important; /* ortalamayı geçersiz kıl */
    flex-wrap: nowrap !important;           /* alt satıra düşmesini engelle */
    overflow-x: auto;                       /* dar ekranda yatay kaydırma */
    -webkit-overflow-scrolling: touch;
    gap: 8px;                               /* butonlar arası boşluk sabit kalsın */
  }
  #cfc-live .cfc-live__tool{
    flex: 0 0 auto;                         /* butonlar sıkışıp küçülmesin */
    white-space: nowrap;                    /* metin tek satırda kalsın */
  }
  #cfc-live .cfc-live__close{
    order: 99 !important;                   /* kapatma en sağda */
    margin-left: auto !important;           /* sağ kenara it */
    position: static !important;            /* toolbar akışında dursun */
  }
}

/* === Settings: Apply/Reset'i üst sarı şeritte göster === */
#cfc-settings .cfc-settings__toolbar{
  display:flex; align-items:center; gap:8px;
  justify-content:flex-start;           /* sola yasla */
  background: var(--cfc-yellow) !important;
  padding: 8px 12px;
}
#cfc-settings .cfc-settings__actions{
  display:flex; gap:8px; flex-wrap:nowrap;
}
#cfc-settings .cfc-settings__btn{
  appearance:none; border:0; border-radius:10px;
  padding:8px 12px; font-weight:600;
  background: var(--cfc-ink, #111);     /* siyah zemin */
  color:#fff;                           /* beyaz yazı */
}
#cfc-settings .cfc-settings__btn--apply{
  box-shadow: 0 0 0 2px rgba(255,255,255,.28) inset; /* küçük vurgu */
}
#cfc-settings .cfc-settings__close{ margin-left:auto; } /* × en sağa */
@media (max-width: 640px){
  #cfc-settings .cfc-settings__toolbar{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  #cfc-settings .cfc-settings__btn{ white-space:nowrap; flex:0 0 auto; }
}

/* === Settings header: canlı pencere toolbar'ı ile birebir === */
/* Varsayılan: ortalı (live gibi), mobilde live’daki gibi sola yaslanır */
#cfc-settings .cfc-settings__toolbar{
  /* live toolbar ile aynı yapı: flex + gap */
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;

  /* live toolbar default’u gibi ortala */
  justify-content: center !important;

  /* canlı pencere temasına uysun */
  background: var(--cfc-yellow, #fed700) !important;
  border-bottom: 1px solid rgba(0,0,0,.12) !important;
  padding: 8px 10px !important;
}

/* Ayarlar başlığını gizle (yerine butonlar gözükecekse başlık görünmesin) */
#cfc-settings .cfc-settings__title{ display: none !important; }

/* Üst çubuktaki Reset/Uygula butonlarını live’daki “tool” stili gibi yap */
#cfc-settings .cfc-settings__toolbar #cfc-reset,
#cfc-settings .cfc-settings__toolbar #cfc-apply{
  appearance: none;
  border: 0;
  border-radius: 8px;
  padding: 7px 12px;
  font-weight: 600;

  /* canlı pencerede aktif tool = siyah zemin + beyaz yazı */
  background: #111 !important;
  color: #fff !important;
}

/* Kapat (×) butonu sağda kalsın – live’daki #cfc-live .cfc-live__close ile aynı mantık */
#cfc-settings .cfc-settings__close{
  order: 99 !important;
  margin-left: auto !important;
  position: static !important;
}

/* Mobilde live gibi: tek satır, yatay kaydırma, sola yaslı */
@media (max-width: 640px){
  #cfc-settings .cfc-settings__toolbar{
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  #cfc-settings .cfc-settings__toolbar #cfc-reset,
  #cfc-settings .cfc-settings__toolbar #cfc-apply{
    white-space: nowrap;
    flex: 0 0 auto;
  }
}

/* === Settings header: sticky + center + hide old footer === */

/* 1) ÜST ÇUBUĞU TEPESİNE SABİTLE (overlay içinde) */
#cfc-settings .cfc-settings__toolbar{
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;

  /* canlı pencere ile aynı görünüm + tek satır */
  background: var(--cfc-yellow, #fed700) !important;
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important; /* [sol boşluk] [BUTONLAR] [×] */
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  border-bottom: 1px solid rgba(0,0,0,.1) !important;
  box-shadow: 0 2px 0 rgba(0,0,0,.06) !important;
}

/* Başlığı gizle (butonlar üst bantta görünecek) */
#cfc-settings .cfc-settings__title{ display:none !important; }

/* 2) BUTONLARI ORTAYA KOY (orta kolon) */
#cfc-settings .cfc-settings__toolbar .cfc-settings__actions,
#cfc-settings .cfc-settings__toolbar #cfc-reset,
#cfc-settings .cfc-settings__toolbar #cfc-apply{
  grid-column: 2 !important;
  justify-self: center !important;
  display: inline-flex !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
}

/* Buton renkleri (siyah zemin + beyaz yazı) ve tek satır */
#cfc-settings .cfc-settings__toolbar #cfc-reset,
#cfc-settings .cfc-settings__toolbar #cfc-apply{
  background: #000 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  padding: 8px 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* × sağda kalsın */
#cfc-settings .cfc-settings__close{
  grid-column: 3 !important;
  justify-self: end !important;
  position: static !important;
  margin-left: 0 !important;
}

/* Mobilde de ortalı kalsın; taşarsa yatay kaydırma */
@media (max-width: 640px){
  #cfc-settings .cfc-settings__toolbar{
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}

/* 3) ALTTAKİ ESKİ SIFIRLA/UYGULA BÖLÜMÜNÜ GİZLE */
#cfc-settings .cfc-modal__footer,
#cfc-settings .cfc-settings__footer,
#cfc-settings .cfc-settings__actions--footer{
  display: none !important;
}

/* === CFC Settings: Üst çubuk sticky + ikonlar + alt kopyayı gizle === */

/* Üst şerit: sarı zemin, tepeye yapışık, 3 kolon ızgara (sol boş, orta aksiyon, sağ X) */
#cfc-settings .cfc-settings__toolbar{
  position: sticky; top: 0; z-index: 3;
  background: var(--cfc-yellow, #fed700) !important;
  display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  margin: -8px -8px 8px; /* içerik pedini sarı şeride taşır */
  border-radius: 10px;
}

/* Başlığı tamamen gizle (yerine butonlar gelecek) */
#cfc-settings .cfc-settings__title{ display:none !important; }

/* X (kapat) sağ uca */
#cfc-settings .cfc-settings__close{
  grid-column: 3; justify-self: end;
  background: transparent !important; color: #111;
}

/* Üstteki aksiyon alanı tam ortaya */
#cfc-settings .cfc-settings__actions{
  grid-column: 2; justify-self: center;
  display: inline-flex; gap: 8px; flex-wrap: nowrap;
}

/* Buton görünümleri: siyah zemin, beyaz yazı (canlı penceredeki tema ile uyumlu) */
#cfc-settings #cfc-apply,
#cfc-settings #cfc-reset,
#cfc-settings .cfc-settings__btn{
  appearance:none; border:0; border-radius:10px;
  padding: 8px 12px; line-height:1; font-weight:700;
  background:#000; color:#fff;
  display:inline-flex; align-items:center; gap:6px; /* ikon + metin arası */
}

/* İkonlar (metnin soluna) */
#cfc-settings #cfc-apply::before{ content:"✔️"; }
#cfc-settings #cfc-reset::before{ content:"↺"; }

/* Hover’da küçük vurgu (Uygula) */
#cfc-settings .cfc-settings__btn--apply,
#cfc-settings #cfc-apply{
  box-shadow: 0 0 0 2px rgba(255,255,255,.25) inset;
}

/* Alttaki eski Uygula/Sıfırla bölümü gizle */
#cfc-settings .cfc-modal__footer,
#cfc-settings .cfc-settings__footer--moved{ display:none !important; }

/* Güvence: aksiyon butonları sadece üstte görünür olsun */
#cfc-settings #cfc-apply, #cfc-settings #cfc-reset{ display:none; }
#cfc-settings .cfc-settings__actions #cfc-apply,
#cfc-settings .cfc-settings__actions #cfc-reset{ display:inline-flex !important; }

/* Mobilde tek satır kalsın, taşarsa yatay kaydırma */
@media (max-width: 640px){
  #cfc-settings .cfc-settings__toolbar{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  #cfc-settings .cfc-settings__btn{ white-space:nowrap; flex:0 0 auto; }
}

/* === Settings üst çubuk: modalın tepesine tam yapışık (gap sıfır) === */
#cfc-settings .cfc-modal__body{               /* üstteki 8px boşluğu kapat */
  padding-top: 0 !important;
}

#cfc-settings .cfc-settings__toolbar{
  position: sticky !important;
  top: 0 !important;
  z-index: 10 !important;

  /* .cfc-modal__content iç pedini telafi et (16px) → boşluk tamamen kalkar */
  margin: -16px -16px 8px -16px !important;

  /* mevcut grid/orta hizayı koru */
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  gap: 8px !important;

  /* sarı şerit */
  background: var(--cfc-yellow, #fed700) !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
}

/* butonlar ortada kalsın (mevcut kurallarla aynı) */
#cfc-settings .cfc-settings__actions{
  grid-column: 2 !important;
  justify-self: center !important;
}


@keyframes cfc-spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* === MOBILE FIX: Live toolbar buttons side-by-side (like web) === */
@media (max-width: 640px){
  #cfc-live .cfc-live__toolbar{
    display: flex !important;
    flex-wrap: nowrap !important;           /* prevent wrapping to new line */
    justify-content: center !important;     /* like web: centered controls */
    align-items: center !important;
    gap: 8px !important;
    overflow-x: auto !important;            /* allow sideways scroll if needed */
    -webkit-overflow-scrolling: touch;
  }
  #cfc-live .cfc-live__tool{
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }
  #cfc-live .cfc-live__close{
    order: 99 !important;                   /* keep close at far right */
    margin-left: auto !important;
    position: static !important;
    flex: 0 0 auto !important;
  }
}

/* === SETTINGS: üst çubuk tam tepeye yapışsın (boşluğu kaldır) === */
#cfc-settings .cfc-modal__content{ padding-top: 0 !important; }
#cfc-settings .cfc-modal__body{    padding-top: 0 !important; }

#cfc-settings .cfc-settings__toolbar{
  position: sticky !important;
  top: 0 !important;
  z-index: 10 !important;
  margin: 0 0 8px 0 !important;    /* önceki -8px/-16px marginleri iptal et */
}

/* === AYARLAR MODALİ TAM EKRAN (yeniden) ===
   Bu kurallar mobil ve masaüstünde ayarlar panelini tam ekran yapar.
   Üst sarı çubuğun ve içerik alanının safe-area tarafından kesilmemesini sağlar. */
@media (min-width: 0px){
  #cfc-settings .cfc-modal__content{
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100svh !important;
    height: calc(var(--cfc-vh, 1vh) * 100) !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    /* safe-area padding: üstte sabit boşluğu kaldır, sadece cihazın çentik alanını hesaba kat.  
       Üst kısım için 12px sabit boşluk kullanmak yerine env(safe-area-inset-top) kullanıyoruz.  
       Böylece masaüstünde ve Android cihazlarda beyaz boşluk oluşmaz.  
       Sol ve sağ için 12px sabit boşluk korunur; alt için 12px korunur. */
    padding: env(safe-area-inset-top) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)) !important;
  }
  /* Toolbar’ın sağa ve sola kadar uzanmasını sağla, tepeye yapıştır */
  #cfc-settings .cfc-settings__toolbar{
    /* Negatif margin ile safe-area paddingsini ortadan kaldır. Üst boşluk için de
       safe-area değerini negatife çevirerek sarı çubuğun çentik alanını kaplamasını sağla. */
    margin-left: calc(-1 * max(12px, env(safe-area-inset-left))) !important;
    margin-right: calc(-1 * max(12px, env(safe-area-inset-right))) !important;
    margin-top: calc(-1 * env(safe-area-inset-top)) !important;
    border-radius: 0 !important;
  }
  /* Modal gövde alanını esnek yap ve kaydırılabilir kıl */
  #cfc-settings .cfc-modal__body{
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    min-height: 0 !important;
    padding-top: 0 !important;
  }
}

/* === MOBILE SETTINGS HEADER FIX ===
   When the settings modal is opened on mobile, the yellow header should be fully visible
   and attached to the very top of the viewport. We achieve this by making the
   toolbar fixed and offsetting the modal content by the toolbar height plus
   any safe-area inset. These rules only apply on small screens. */
@media (max-width: 640px){
  /* Reserve space at the top of the modal content for the fixed header */
  #cfc-settings .cfc-modal__content{
    padding-top: calc(56px + env(safe-area-inset-top)) !important;
  }
  /* Fix the toolbar to the top of the viewport and span full width */
  #cfc-settings .cfc-settings__toolbar{
    position: fixed !important;
    top: env(safe-area-inset-top) !important;
    left: 0 !important;
    right: 0 !important;
    height: 56px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: var(--cfc-yellow, #fed700) !important;
    z-index: 11 !important;
    margin: 0 !important;
    padding: 0 max(12px, env(safe-area-inset-right)) 0 max(12px, env(safe-area-inset-left)) !important;
    border-bottom: 1px solid rgba(0,0,0,.06) !important;
  }
  /* Allow the body to scroll beneath the fixed header */
  #cfc-settings .cfc-modal__body{
    padding-top: 0 !important;
  }
}

/* === CFC Settings header alignment ONLY (non-destructive) === */
/* Önce .cfc-settings__toolbar varsa onu düzeltelim */
#cfc-settings .cfc-settings__toolbar{
  display: grid !important;
  grid-template-columns: 1fr auto 1fr; /* sol boşluk – başlık/aksiyonlar – sağ boşluk */
  align-items: center !important;
}
#cfc-settings .cfc-settings__title{
  grid-column: 2 !important;
  justify-self: center !important;
  text-align: center !important;
}
/* Kapatma butonunu sağa yasla */
#cfc-settings .cfc-modal__close{
  grid-column: 3 !important;
  justify-self: end !important;
  position: relative !important;  /* mevcut top/right değerlerine dokunmadan */
  right: 0 !important;
  top: 0 !important;
}

/* === Fallback: header 'toolbar' yerine generic modal header kullanan temalar için === */
#cfc-settings .cfc-modal__header{
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
}
#cfc-settings .cfc-modal__header .cfc-modal__title{
  grid-column: 2 !important;
  justify-self: center !important;
  text-align: center !important;
}
#cfc-settings .cfc-modal__header .cfc-modal__close{
  grid-column: 3 !important;
  justify-self: end !important;
  position: relative !important;
  right: 0 !important;
  top: 0 !important;
}

/* === CFC PATCH 2025-10-26: Live overlay full-screen fix (mobile & desktop) === */
#cfc-live .cfc-live__box {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  margin: 0 !important;
  max-width: none !important;
  height: calc(var(--cfc-vh, 1vh) * 100) !important;
  min-height: 100dvh !important;
  max-height: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
/* === End CFC PATCH === */
/* === CFC PATCH — Canlı üst şerit & butonlar, Ayarlar ölçülerine eşitle === */

/* 1) Üst sarı şerit: sabit 54px yerine daha kompakt (48px) */
#cfc-live .cfc-live__toolbar{
  height: 48px !important;
  padding: 0 12px !important;   /* Ayarlar üst bantta olduğu gibi yatay 12px */
  gap: 8px !important;
  align-items: center !important;
}

/* 2) Şerit üzerindeki butonlar: Ayarlar buton pedingi (8x12) + 14px yazı */
#cfc-live .cfc-live__tool{
  padding: 8px 12px !important;  /* Ayarlar ile aynı peding */  /* :contentReference[oaicite:2]{index=2} */
  font-size: 14px !important;
  line-height: 1 !important;
  border-radius: 10px !important;
}
/* aktif (siyah zeminli) halde de aynı ölçü kalsın */
#cfc-live .cfc-live__tool[aria-pressed="true"]{
  padding: 8px 12px !important;
}

/* 3) Kapat (×) butonu: biraz küçült */
#cfc-live .cfc-live__close{
  width: 36px !important;
  height: 36px !important;
  font-size: 22px !important;
  top: max(6px, env(safe-area-inset-top)) !important;
  right: max(8px, env(safe-area-inset-right)) !important;
}

/* 4) İçeriğin üstten boşluğu: yeni başlık yüksekliğine göre ayarla (48px) */
#cfc-live .cfc-live__box{
  padding-top: calc(48px + max(12px, env(safe-area-inset-top))) !important; /* was 56px */ /* :contentReference[oaicite:3]{index=3} */
}

/* === Mobil: canlı pencere üst şeritte yazıyı sola hizala ve × için boşluğu büyüt === */
@media (max-width: 640px){
  #cfc-live .cfc-live__toolbar{
    justify-content: flex-start !important; /* merkez yerine sola */
    padding-left: max(10px, env(safe-area-inset-left)) !important; /* hafif sola kaydır */
    padding-right: max(92px, calc(12px + env(safe-area-inset-right))) !important; /* × için yer */
  }
}

/* Daha küçük ekranlarda tamponu biraz daha büyüt */
@media (max-width: 480px){
  #cfc-live .cfc-live__toolbar{
    padding-right: max(104px, calc(12px + env(safe-area-inset-right))) !important;
  }
}
@media (max-width: 360px){
  #cfc-live .cfc-live__toolbar{
    padding-right: max(112px, calc(12px + env(safe-area-inset-right))) !important;
  }
}

/* === CFC PATCH — Canlı üst şerit yüksekliğini Ayarlar ile eşitle (56px) === */
#cfc-live .cfc-live__toolbar{
  height: 56px !important;        /* Ayarlar’daki başlık yüksekliği */
  padding-top: 0 !important;       /* yüksekliği sabitlediğimiz için dikey paddingi sıfırla */
  padding-bottom: 0 !important;
  padding-left: 16px !important;   /* Ayarlar ile aynı yatay boşluk */
  padding-right: 16px !important;
  align-items: center !important;  /* içerikleri dikey ortala */
}

/* (Mobilde × butonu içerideyse) satır hizasını koru */
@media (max-width: 640px){
  #cfc-live .cfc-live__toolbar{
    height: 56px !important;
  }
}

/* === CFC FAB — Yeni görünüm: üstte oval etiket + ortada favicon, dönen halka kapalı === */

/* Boyut/boşluk ayarları */
#cfc-fab{ --fab-size: 56px; --fab-gap: 6px; }

/* Daire (sarı arkaplan) ve konum */
#cfc-fab{
  position: fixed !important;
  left: 16px !important; bottom: 16px !important;
  width: var(--fab-size) !important;
  height: var(--fab-size) !important;
  border-radius: 50% !important;
  background: var(--cfc-yellow, #fed700) !important;
  color: var(--cfc-ink, #111) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.16) !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  overflow: visible !important; /* üst etikete yer */
  z-index: 2147483645 !important;
}

/* Dönen yazı halkasını tamamen kapat */
#cfc-fab .cfc-fab__ring{ display: none !important; }

/* İç ikonu favicon olarak göster (mevcut svg'yi gizle) */
#cfc-fab .cfc-fab__icon{ position: relative !important; width: 100% !important; height: 100% !important; display: grid !important; place-items: center !important; }
#cfc-fab .cfc-fab__icon svg{ display: none !important; }
#cfc-fab .cfc-fab__icon::after{
  content: '' !important;
  width: calc(var(--fab-size) - var(--fab-gap) * 2) !important;
  height: calc(var(--fab-size) - var(--fab-gap) * 2) !important;
  background: var(--cfc-fab-favicon) no-repeat center / contain !important;
  border-radius: 12px !important; /* Tam daire istersen: 50% */
  display: block !important;
}

/* Üstte oval, kalın etiket */
#cfc-fab::after{
  content: 'CANLI FIRSATLAR' !important;
  position: absolute !important;
  left: 50% !important; transform: translateX(-50%) !important;
  bottom: calc(100% + 10px) !important;
  background: rgba(17,17,17,.92) !important;
  color: #fff !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  padding: 6px 12px !important;
  border-radius: 9999px !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  white-space: nowrap !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.12) !important;
}

/* Hover minik vurgusu (opsiyonel) */
#cfc-fab:hover{ filter: brightness(.98); }

/* Mobilde biraz küçült */
@media (max-width: 480px){
  #cfc-fab{ --fab-size: 52px; }
  #cfc-fab::after{ font-size: 12px !important; padding: 5px 10px !important; }
}
