/* Shared by every telephone action. No fixed pixel columns or clipped controls. */
@media screen {
  :is(#appShell #actions, #actionModalBackdrop, #actionContactModalBackdrop) *,
  :is(#appShell #actions, #actionModalBackdrop, #actionContactModalBackdrop) { font-size: 10pt !important; }
  #actionContactModalBackdrop .modal { max-height: calc(100dvh - 32px); overflow-y: auto; max-width: calc(100vw - 24px); }
  #actionContactCreateError { color: #a52920; }
  #actions, #actions .action-workspace, #actions .action-workspace > *,
  #actions .action-detail-head > *, #actions .action-toolbar > * { min-width: 0; max-width: 100%; }
  #actions .action-workspace { grid-template-columns: minmax(200px, 240px) minmax(0, 1fr); }
  #actions .action-detail-panel { container: action-panel / inline-size; }
  #actions .action-detail-head, #actions .action-toolbar, #actions .section-head { flex-wrap: wrap; }
  #actions .action-detail-head > div:first-child { flex: 1 1 220px; }
  #actions .action-detail-buttons { flex: 1 1 270px; }
  #actions .action-toolbar .search { flex: 1 1 220px; width: auto; }
  #actions .action-toolbar .search input { min-width: 0; width: 100%; }
  #actions .action-toolbar select { flex: 1 1 160px; min-height: 38px; min-width: 0; max-width: 100%; }
  #actions :is(.call-action-item, #activeActionName, #activeActionDescription, .import-hint) { overflow-wrap: anywhere; }
  #actionContactsTable { overflow: visible; width: 100%; min-width: 0; }
  #actionContactsTable .action-contact-row { min-width: 0; width: 100%; grid-template-columns: repeat(12, minmax(0, 1fr)); }
  #actionContactsTable .action-contact-input { width: 100%; min-width: 0; box-sizing: border-box; margin-bottom: 6px; padding: 7px; border: 1px solid var(--line); border-radius: 6px; font: inherit; }
  #actionContactsTable .action-note-field textarea { display: block; width: 100%; min-width: 0; min-height: 76px; resize: vertical; padding: 8px; border: 1px solid var(--line); border-radius: 6px; font: inherit; color: var(--ink); background: white; box-sizing: border-box; }
  #actionContactsTable .action-note-buttons { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
  #actionContactsTable .action-note-buttons button { padding: 6px 8px; white-space: normal; }
  #actionContactsTable .action-note-field small { display: block; margin-top: 4px; }
  #actionContactsTable .action-contact-row > * { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
  #actionContactsTable .action-contact-row :is(span, a) { overflow: visible; text-overflow: clip; white-space: normal; }
  #actionContactsTable .action-contact-field { display: block; margin: 0; color: var(--ink); }
  #actionContactsTable .status-with-light { min-width: 0; max-width: 100%; }
  #actionContactsTable .action-row-buttons { flex-wrap: wrap; }
  #actionContactsTable .action-row-buttons button { max-width: 100%; white-space: normal; }
  #actionContactsTable .action-row-buttons .action-delete-contact {
    display: inline-grid; place-items: center; width: 36px; min-height: 36px;
    padding: 7px; color: #a52920; background: #fff3f2; border-color: #e9b8b2;
    vertical-align: middle;
  }
  #actionContactsTable .action-delete-contact:hover { background: #ffe2df; }
  #actionContactsTable .action-delete-contact:focus-visible { outline: 2px solid #a52920; outline-offset: 2px; }
  @media (max-width: 1350px) {
    #actions .action-workspace { grid-template-columns: minmax(0, 1fr); }
    #actions .call-action-list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); }
  }
  @media (max-width: 760px) {
    #actions .action-detail-head > div:first-child,
    #actions .action-detail-buttons,
    #actions .action-toolbar .search,
    #actions .action-toolbar select { flex: none; width: 100%; }
    #actions .action-toolbar .search { height: 40px; }
    #actions .action-toolbar select { min-height: 38px; }
  }
  @container action-panel (max-width: 1800px) {
    #actionContactsTable .action-note-field { grid-column: 1 / -1; }
    #actionContactsTable .action-contact-row.header { display: flex; flex-wrap: wrap; gap: 6px 12px; padding: 10px 0; }
    #actionContactsTable .action-contact-row.header > span { width: auto; }
    #actionContactsTable .action-contact-row:not(.header) {
      grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
      gap: 12px 16px; border: 1px solid var(--line); border-radius: 10px; padding: 14px; margin: 12px 0;
      align-items: start;
    }
    #actionContactsTable .action-contact-row:not(.header) > [data-label]::before {
      content: attr(data-label); display: block; color: var(--muted); font-weight: 400; margin-bottom: 5px;
    }
    #actionContactsTable .action-contact-row :is(.action-whatsapp, .action-email) { width: max-content; max-width: 100%; }
    #actionContactsTable .action-row-buttons { display: block; }
    #actionContactsTable .action-row-buttons button { margin: 0 5px 5px 0; }
  }
}