/* ==========================================================================
   Portal de clientes - App Mode (telefono). Solo bajo html.oam (omnes_app.js).
   Antes el lanzador se ocultaba por debajo de 735px y el cliente no podia
   chatear desde el movil: aqui es un boton flotante y la ventana va a pantalla
   completa entre la barra superior y la de pestanas.
   ========================================================================== */
html.oam .ch_pointer { display: block; }
html.oam .ch_pointer .ch_pointer-main {
    right: calc(16px + var(--oam-safe-r, 0px));
    bottom: calc(var(--oam-bottom) + 16px);
    width: var(--oam-fab-size, 56px);
    height: var(--oam-fab-size, 56px);
    padding: 0;
    border-radius: 50%;
    background-color: var(--oam-primary);
    box-shadow: var(--oam-shadow-2);
    z-index: 1040;
}
html.oam.oam-kb-open .ch_pointer .ch_pointer-main { display: none; }
html.oam #clientChat .firstDiv {
    top: var(--oam-top);
    right: 0;
    bottom: var(--oam-bottom);
    left: 0;
    width: auto;
    border-radius: 0;
    box-shadow: none;
    background: var(--oam-surface);
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 1041;
}
html.oam.oam-kb-open #clientChat .firstDiv { bottom: 0; }
/* client_groups.php fija left/right 8px !important por debajo de 480px */
html.oam #clientChat .firstDiv { left: 0 !important; right: 0 !important; }
/* Abierta (jQuery .toggle pone display:block en linea): columna cabecera / staff / mensajes / escritura */
html.oam #clientChat .firstDiv[style*="display: block"] { display: flex !important; flex-direction: column; }
html.oam #clientChat .company_top_info { flex: none; height: 56px; min-height: 0; overflow: hidden; }
html.oam #clientChat .company_top_info_parent { animation: none; }
html.oam #clientChat .company_logo_placeholder img { max-height: 40px; width: auto; }
html.oam #clientChat .top_close_icon {
    position: absolute;
    top: 6px;
    right: 6px;
    margin: 0;
    width: var(--oam-touch);
    height: var(--oam-touch);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
}
html.oam #clientChat .customer_admins_wrapper { position: static; display: block; flex: none; margin: 0; }
html.oam #clientChat .customer_first_co_wrapper { width: 100%; border-radius: 0; box-shadow: none; border-bottom: 1px solid var(--oam-line); }
html.oam #clientChat .customer_main_placeholder_top { padding: 12px var(--oam-pad) 10px; }
html.oam #clientChat .staff_online_text { font-size: 17px; margin: 0 0 2px; }
html.oam #clientChat .staff_image_parent {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    max-height: none;
    margin-top: 8px;
    padding-bottom: 4px;
    scrollbar-width: none;
}
html.oam #clientChat .staff_image_parent::-webkit-scrollbar { display: none; }
html.oam #clientChat .staff_image_wrapper { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0; }
html.oam #clientChat .staff_image_wrapper > * { flex: none; }
html.oam #clientChat .info_company_name { margin-left: 0; }
html.oam #clientChat .clientwrapper { position: relative; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
html.oam #clientChat .m-area { flex: 1 1 auto; min-height: 0; height: auto; overscroll-behavior: contain; }
html.oam #clientChat ol.chat { height: auto; min-height: 100%; margin: 0; }
html.oam #clientChat .placeholder-messages { flex: none; position: relative; }
html.oam #clientChat .clients_textarea {
    font-size: var(--oam-font-input);
    height: auto;
    min-height: var(--oam-touch);
    padding: 11px 92px 11px 12px;
}
html.oam #clientChat .send_client_message,
html.oam #clientChat .attachment {
    width: var(--oam-touch);
    height: var(--oam-touch);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}
html.oam #clientChat .fa.fa-paper-plane.send_client_message { right: 4px; bottom: 2px; }
html.oam body #clientChat .attachment { right: 50px; bottom: 2px; }
/* Grupos del portal (client_groups.php): sin zoom de iOS y objetivos de 44px */
html.oam #cg-pane .cg-form textarea { font-size: var(--oam-font-input); min-height: var(--oam-touch); }
html.oam #cg-pane .cg-form button { width: var(--oam-touch); height: var(--oam-touch); }