/*
 * LOOK call control palette — NC-98. The FINAL color layer of every call
 * surface on iPhone AND Samsung: 1:1 audio, 1:1 video, the incoming screen,
 * the minimized bubble, the group call (full + mini strip + in-layer invite),
 * the global group invite banner and the chat "Join" pill.
 *
 * Buttons declare their role with data-call-tone; this sheet is linked LAST
 * in index.html and every rule is !important, so no older layer (index.css
 * .call-control*, look-visual-system.css, look-group-call-layer.css, Tailwind
 * utilities, inline styles) can win on device. Geometry is never touched —
 * only background, glyph color and border.
 *
 * Four colors only:
 *   green  #3E9B68  Accept / Join — entering a call (matte, no glow)
 *   red    #EF4444  Decline / Hang up / Leave + a stopped state (Mic muted,
 *                   Camera off)
 *   blue   #168BFF  Mic, Speaker/Earpiece, Camera, Flip — live call functions
 *   white  #FFFFFF  Minimize / Expand / neutral actions (dark glyph)
 */
:root {
  --look-call-green: #3e9b68;
  --look-call-red: #ef4444;
  --look-call-blue: #168bff;
  --look-call-white: #ffffff;
  --look-call-ink: #111827;
}

[data-call-tone] {
  border-color: transparent !important;
  background-image: none !important;
}

[data-call-tone='blue'] {
  background: var(--look-call-blue) !important;
  background-color: var(--look-call-blue) !important;
  color: #ffffff !important;
}

[data-call-tone='green'] {
  background: var(--look-call-green) !important;
  background-color: var(--look-call-green) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(17, 24, 39, 0.18) !important; /* matte — never a glow */
}

[data-call-tone='red'] {
  background: var(--look-call-red) !important;
  background-color: var(--look-call-red) !important;
  color: #ffffff !important;
}

[data-call-tone='white'] {
  background: var(--look-call-white) !important;
  background-color: var(--look-call-white) !important;
  color: var(--look-call-ink) !important;
}

/* Glyphs follow the button (lucide svg strokes + phosphor font icons). */
[data-call-tone] svg,
[data-call-tone] i {
  color: inherit !important;
}

/* A completely disabled control: transparency only — never a grey fill. */
[data-call-tone]:disabled,
[data-call-tone][aria-disabled='true'] {
  opacity: 0.45 !important;
}