/* ==========================================================================
   OREGONS CHAT - MÓDULO: BOTÓN DE LLAMADA (ESTILOS LIMPIOS)
   Estilos independientes y clasificados para evitar código espagueti
   ========================================================================== */

#btn-llamada {
    background: transparent !important;
    border: none !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
    padding: 0 !important;
}

#btn-llamada:active {
    transform: scale(0.85) !important;
}

#btn-llamada svg {
    width: 24px !important;
    height: 24px !important;
}

/* MENÚ INFERIOR DE OPCIONES (BOTTOM SHEET) */
#call-menu {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background-color: #2d2d2d !important;
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
    padding: 24px 20px !important;
    box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.4) !important;
    transform: translateY(100%);
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease-in-out;
    z-index: 15 !important;
}

#call-menu.activo {
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.call-title {
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    margin-bottom: 20px !important;
}

.call-option-item {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 12px 0 !important;
    cursor: pointer !important;
    border-bottom: 1px solid #383838 !important;
}

.call-option-item:last-child {
    border-bottom: none !important;
}

.call-icon-circle {
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
}

.voice-bg {
    background-color: #0072ff !important;
}
.video-bg {
    background-color: #ff6b00 !important;
}

.call-text-area h3 {
    color: #ffffff !important;
    font-size: 14px !important;
    margin: 0 !important;
}

.call-text-area p {
    color: #a0a0a0 !important;
    font-size: 11px !important;
    margin: 2px 0 0 0 !important;
}