/* Minimal styling for Kor4e Testimony Chat - variables for quick theming */
:root{
  --k4-bg:#fff;
  --k4-accent:#ff3366;
  --k4-text:#222;
}
/* keep selectors specific to reduce conflicts */
.k4-root { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; }


/* Kor4e: style for TikTok-like love button (white background, black border, circular) */

.k4-love-btn{
  background:#fff !important;
  border:1px solid #000 !important;
  padding:4px 6px !important;
  border-radius:6px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-sizing:border-box !important;
  font-size:18px !important;
  line-height:1 !important;
  cursor:pointer !important;
  transition: all 150ms ease !important;
  color: #000 !important;
  gap: 4px !important;
}

/* Liked states -- cover various possible class/data patterns that JS might toggle */
.k4-love-btn.liked,
.k4-love-btn.is-liked,
.k4-love-btn.active,
.k4-love-btn[data-liked="1"] {
  color: #ff2d55 !important;          /* make the heart/icon red */
  border-color: #ff2d55 !important;   /* border becomes red when liked */
  background:#fff !important;
}

/* Hover/pressed affordance */
.k4-love-btn:hover{ transform: scale(1.06); }
.k4-love-btn:active{ transform: scale(0.98); }

/* make sure small buttons beside it remain compact */
.k4-small-btn{ padding:6px 10px; border:1px solid transparent; background:transparent; border-radius:6px; cursor:pointer; }
