/* Solicitudes de contacto de clientes (ADR cobranza/013 PR2): globo del muelle + modal de revisión. Piel de plataforma. */
.gbal-muelle .gm-chip.gm-solic { background: #AB0010; }
.gbal-muelle .gm-chip.gm-solic .num { color: #AB0010; }
@media (min-width: 576px) { .sc-dialog { max-width: 96%; width: 96%; } }   /* como la de pendientes (.pc-dialog); en teléfono manda .modal-cel */
.sc-cuerpo { padding: 0; }
.sc-cargando, .sc-vacio { padding: 22px 20px; color: #6b6b70; font-size: 14px; }
.sc-vacio .fas { color: #1e7e34; margin-right: 6px; }
.sc-vacio.sc-mal .fas { color: #b02a37; }
.sc-tabla th { font-size: 10.5px; text-transform: uppercase; letter-spacing: .9px; color: #6b6b70; background: #f2f2f3; border-top: 0; white-space: nowrap; }
.sc-tabla td { vertical-align: middle; font-size: 13.5px; }
.sc-tabla .cliente-id { font-variant-numeric: tabular-nums; color: #6b6b70; }
.sc-tabla .sc-cli { min-width: 220px; }
.sc-tabla .sc-cli small, .sc-tabla .sc-quien small { display: block; color: #6b6b70; font-size: 12px; margin-top: 2px; }
.sc-canal { display: inline-flex; gap: 6px; align-items: center; background: #f2f2f3; border-radius: 999px; padding: 3px 9px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.sc-dato { min-width: 260px; }
.sc-dato > div { margin-bottom: 5px; }
.sc-dato .de { color: #6b6b70; text-decoration: line-through; font-variant-numeric: tabular-nums; }
.sc-dato .a { overflow-wrap: anywhere; }
.sc-flecha { color: #AB0010; margin: 0 8px; font-size: 12px; }
.sc-mut { color: #6b6b70; font-style: italic; }
.sc-quien { white-space: nowrap; }
.sc-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; padding: 3px 9px; border-radius: 99px; white-space: nowrap; }
.sc-ok { background: #e7f4ec; color: #1e7e34; }
.sc-espera { background: #fbf3e2; color: #856404; }
.sc-gris { background: #f2f2f3; color: #6b6b70; border: 1px solid #e4e4e8; }
.sc-acc { white-space: nowrap; text-align: right; }
.sc-acc-fila { display: flex; gap: 6px; justify-content: flex-end; }
.sc-acc .btn { min-height: 40px; display: inline-flex; align-items: center; white-space: nowrap; }
.sc-acc .sc-historial { margin-top: 2px; padding-right: 0; }
.sc-acc .btn-link { color: #6b6b70; text-decoration: none; }
.sc-acc .btn-link[aria-expanded="true"] { color: #AB0010; }
/* formulario en línea (edicionEnLinea del kit): 3 columnas que suman, 1 en teléfono */
#modalSolicitudesContacto .gbal-inline-cuerpo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#modalSolicitudesContacto .gbal-inline-cuerpo .sc-bit { grid-column: 1 / -1; font-size: 12.5px; color: #6b6b70; }
#modalSolicitudesContacto .gbal-inline-cuerpo .sc-bit .fas { color: #1a56b0; margin-right: 4px; }
#modalSolicitudesContacto .gbal-inline-cuerpo .sc-campo-motivo { grid-column: 1 / -1; }
#modalSolicitudesContacto .gbal-inline-campo textarea { min-height: 46px; font-size: 15px; }
/* historial: línea de tiempo canónica del kit (.ecm-ev, index.css) dentro de la fila */
.sc-hist-fila > td { background: #fafafb; padding: 10px 14px 4px; }
.sc-lt { margin-top: 0; border-top: 0; padding-top: 0; max-width: 760px; }
.sc-lt .ecm-ev .n .b.no { border-color: #b02a37; color: #b02a37; }
.sc-seva { transition: opacity .35s ease; opacity: 0; }
.sc-pie { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; }
.sc-nota { font-size: 12.5px; }
.sc-pie .btn { margin-left: auto; }
@media (max-width: 991px) {
  #modalSolicitudesContacto .gbal-inline-cuerpo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #modalSolicitudesContacto .gbal-inline-cuerpo .gbal-inline-campo:first-child { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .sc-tabla td, .sc-tabla th { padding: 8px 10px; }
  .sc-tabla .sc-cli { min-width: 150px; }
  .sc-dato { min-width: 200px; }
  .sc-acc-fila { flex-direction: column; }
  .sc-acc .btn { width: 100%; justify-content: center; }
  #modalSolicitudesContacto .gbal-inline-cuerpo { grid-template-columns: 1fr; }
  /* la tabla hace scroll lateral; el formulario y el historial se quedan a la vista, al ancho del teléfono */
  .sc-tabla .gbal-inline-fila > td, .sc-tabla .sc-hist-fila > td { display: block; position: sticky; left: 0; width: calc(96vw - 2px); box-sizing: border-box; }
  #modalSolicitudesContacto .gbal-inline-campo input, #modalSolicitudesContacto .gbal-inline-campo textarea { font-size: 16px; }
}
/* teléfono: cada solicitud es una tarjeta apilada (mobile-first, regla UX 6); el formulario y el historial van debajo, sin scroll lateral */
@media (max-width: 575.98px) {
  .sc-tabla thead { display: none; }
  .sc-tabla, .sc-tabla tbody, .sc-tabla tr, .sc-tabla td { display: block; width: 100%; box-sizing: border-box; }
  .sc-tabla tr.sc-fila { padding: 10px 12px 12px; border-bottom: 1px solid #e4e4e8; }
  .sc-tabla td { border: 0; padding: 3px 0; min-width: 0; }
  .sc-tabla .sc-cli { font-weight: 700; }
  .sc-tabla .sc-cli small { font-weight: 400; }
  .sc-quien { white-space: normal; }
  .sc-tabla .sc-quien small { display: inline; margin-left: 6px; }
  .sc-acc { text-align: left; margin-top: 6px; }
  .sc-acc .sc-historial { width: auto; padding-left: 0; }
  .sc-tabla .gbal-inline-fila > td, .sc-tabla .sc-hist-fila > td { position: static; width: auto; padding: 0 12px 12px; }
  .sc-pie .sc-nota:nth-child(2) { display: none; }
}
@media (max-width: 480px) {
  .sc-acc { white-space: normal; }
}