@tailwind base;
@tailwind components;
@tailwind utilities;



.voice-bubble {
  cursor: pointer;
}

.voice-bubble:hover .play-btn {
  opacity: .8;
}

.voice-waveform {
  /* you could even show a dashed “fake waveform” behind it:
     background-image: repeating-linear-gradient(
       to right,
       rgba(0,0,0,0.1) 0, rgba(0,0,0,0.1) 2px,
       transparent 2px, transparent 4px
     );
  */
}


/* blue check similar to Twitter / Facebook */
.badge-admin {
    display:inline-block;
    vertical-align:middle;
    margin-left:.25rem;          /* little gap after the name */
    width:14px;
    height:14px;
    border-radius:50%;
    background:#0d6efd;          /* Bootstrap “primary” */
    color:#fff;
    font-size:9px;
    line-height:14px;
    text-align:center;
    font-weight:bold;
}