/* ===== Kolbo Smart Sticky ATC — frontend.css ===== */
.kolbo-ssatc{
  position:fixed;left:0;right:0;bottom:0;
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding:.75rem 1rem;background:#ffffff;color:#111;border-top:2px solid #e5e7eb;
  z-index:9999;box-shadow:0 -8px 24px rgba(0,0,0,.08);
  font-family:inherit;
}
.kolbo-ssatc__left,.kolbo-ssatc__center,.kolbo-ssatc__right{display:flex;align-items:center;gap:.5rem}
.kolbo-ssatc__price{font-weight:700;font-size:1rem}
.kolbo-ssatc__btn{
  background:#2563eb;color:#fff;border:none;border-radius:.5rem;
  padding:.6rem 1rem;font-weight:700;cursor:pointer;transition:transform .15s ease,opacity .2s ease;
}
.kolbo-ssatc__btn:hover{transform:translateY(-1px)}
.kolbo-ssatc__btn:active{transform:translateY(0)}
.kolbo-ssatc__icon{font-size:1.1rem;line-height:1}
.kolbo-ssatc__icon.blink{animation:kolbo-blink 1s infinite}
.kolbo-ssatc__icon.yellow{filter: hue-rotate(0deg)} /* visual hint only */
.kolbo-ssatc__icon.green{filter: hue-rotate(90deg)}
@keyframes kolbo-blink{50%{opacity:.35}}

/* smaller screens */
@media (max-width: 640px){
  .kolbo-ssatc{padding:.6rem .75rem}
  .kolbo-ssatc__price{font-size:.95rem}
  .kolbo-ssatc__btn{padding:.55rem .9rem}
}

/* highlight variations area */
.kolbo-ssatc__field-pulse{
  box-shadow:0 0 0 0 rgba(234,179,8,.75);
  animation:kolbo-pulse 1.2s infinite;
  border-radius:.4rem;
}
@keyframes kolbo-pulse{
  0%{box-shadow:0 0 0 0 rgba(234,179,8,.75)}
  70%{box-shadow:0 0 0 10px rgba(234,179,8,0)}
  100%{box-shadow:0 0 0 0 rgba(234,179,8,0)}
}

/* ensure footer not covered by WP admin bar */
body.admin-bar .kolbo-ssatc{bottom:32px}


/* === Offset: finger and a half (אצבע וחצי) === */
/* Base finger size (can be tuned): 48px */
:root{ --kolbo-finger: 48px; }

/* Position the sticky above by 1.5 * finger, while respecting safe-area insets */
.kolbo-ssatc{
  bottom: calc(env(safe-area-inset-bottom, 0px) + (1.5 * var(--kolbo-finger)));
}

/* If WP admin bar is visible, keep the same visual offset above it */
body.admin-bar .kolbo-ssatc{
  bottom: calc(32px + env(safe-area-inset-bottom, 0px) + (1.5 * var(--kolbo-finger)));
}

