/* =====================================================
   THEME: F4JOY — BIKER GANG NEON
   Asphalt • Leather • Fire • Headlight
===================================================== */

/* ===============================
   HEADER — TOP BAR
================================ */
#chat-header {
  background: linear-gradient(
    90deg,
    rgba(120, 0, 0, 0.55),     /* dark blood red */
    rgba(255, 90, 0, 0.55)     /* hot orange */
  );
  color: #fff2e6;
  border-bottom: 1px solid rgba(255, 120, 40, 0.35);
}

#chat-header span {
  color: #fff2e6;
}

/* ===============================
   HEADER BUTTONS — TIP / PREMIUM
================================ */
#premium-button,
#tip-button {
  background: rgba(255, 90, 0, 0.22);
  border-color: rgba(255, 120, 40, 0.55);
  color: #ff9a2e;
}

#premium-button:hover,
#tip-button:hover {
  background: rgba(255, 120, 40, 0.38);
  box-shadow: 0 0 16px rgba(255, 120, 40, 0.55);
}

/* ===============================
   USER MESSAGE — RIGHT BUBBLE
================================ */
.me {
  background: linear-gradient(
    135deg,
    rgba(160, 0, 0, 0.96),     /* deep red */
    rgba(255, 60, 0, 0.96)     /* burning red */
  );
  box-shadow: 0 0 18px rgba(255, 60, 0, 0.55);
}

/* ===============================
   AI MESSAGE — LEFT BUBBLE
================================ */
.her {
  background: rgba(18, 18, 18, 0.90);  /* asphalt black */
  color: #ffe6d2;
  box-shadow: inset 0 0 0 1px rgba(255, 90, 0, 0.28);
}

/* ===============================
   INPUT AREA — BOTTOM BAR
================================ */
#input-area {
  background: rgba(14, 14, 14, 0.97);
  border-top: 1px solid rgba(255, 90, 0, 0.45);
}

/* ===============================
   SEND BUTTON — ARROW (VIBRANT)
================================ */
#input-area button {
  color: #ffb000; /* 🔥 FAROL LIGADO */
  border-left: 1px solid rgba(255, 120, 40, 0.65);
  text-shadow: 0 0 8px rgba(255, 176, 0, 0.75);
}

/* ===============================
   OPTIONAL — TYPING DOTS
================================ */
.typing span {
  background: rgba(255, 120, 40, 0.9);
}
