/*
 * Not a legacy file. It holds what the legacy Blade views did with inline `style` (blocked by the CSP) and the few
 * controls the legacy pages did not have: attachments, the transfer reference, ticket priority and assignment.
 */
@font-face {
  font-family: Cairo;
  src: url("../shared/fonts/Cairo-Variable.ttf") format("truetype");
  font-weight: 200 1000;
  font-display: swap;
}

.port-card-form { padding: var(--sp-4) var(--sp-5) var(--sp-5); }
.port-card-side { padding: var(--sp-4) var(--sp-5); }
.port-side-stack { display: flex; flex-direction: column; gap: var(--sp-4); }

.port-attach { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: 13px; font-weight: 700; color: inherit; }
.port-attach input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.port-attach-list { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; padding: 0; list-style: none; font-size: 12px; }
.port-attach-list button { border: 0; background: transparent; color: inherit; text-decoration: underline; cursor: pointer; font: inherit; padding: 0; }

.port-chat-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 8px 16px; border-block-end: 1px solid rgb(0 0 0 / 8%); font-size: 13px; }
.port-chat-tools label { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.port-chat-tools select { padding: 4px 8px; border: 1px solid rgb(0 0 0 / 15%); border-radius: 8px; background: transparent; font: inherit; }

.port-review-field { display: flex; flex-direction: column; gap: 6px; width: 100%; font-size: 13px; font-weight: 700; }
.port-review-field input, .port-review-field textarea { padding: 8px 10px; border: 1px solid rgb(0 0 0 / 15%); border-radius: 8px; background: transparent; font: inherit; }
.port-review-error { color: #c0392b; font-size: 12px; font-weight: 700; }

.port-toast-host { position: relative; }
.port-page-status { padding: 24px; text-align: center; }