.support-hub { min-width: 0; color: #183c43; }
.support-menu-count { display: inline-flex; justify-content: center; align-items: center; min-width: 26px; min-height: 26px; margin-inline-start: 6px; padding: 2px 7px; border-radius: 999px; background: #fee4e2; color: #b42318; font-size: 14px; font-weight: 800; line-height: 1.4; vertical-align: middle; }
.support-hub *, .support-hub *::before, .support-hub *::after { box-sizing: border-box; }
.support-hub h2, .support-hub h3 { margin: 0 0 12px; overflow-wrap: anywhere; }
.support-hub p { line-height: 1.9; overflow-wrap: anywhere; }
.support-hub [hidden] { display: none !important; }
.support-toolbar, .support-actions, .support-pagination, .support-ticket-heading, .support-message-heading, .support-ticket-meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.support-toolbar { margin-bottom: 24px; }
.support-toolbar > div { flex: 1 1 240px; min-width: 0; }
.support-toolbar p { margin-bottom: 0; color: #637c87; }
.support-button { border: 1px solid #b6cecb; color: #096b60; background: #fff; border-radius: 12px; padding: 10px 16px; font: inherit; font-weight: 700; min-height: 44px; cursor: pointer; }
.support-primary { background: #087f71; color: #fff; border-color: #087f71; }
.support-hub button:disabled { opacity: .55; cursor: default; }
.support-hub button:focus-visible, .support-hub input:focus-visible, .support-hub textarea:focus-visible { outline: 3px solid #e9aa37; outline-offset: 3px; }
.support-card { padding: 24px; border: 1px solid #d6e2e3; border-radius: 16px; background: #fff; margin-bottom: 24px; min-width: 0; }
.support-form { display: grid; gap: 18px; min-width: 0; }
.support-form label { display: grid; gap: 8px; font-weight: 600; }
.support-form input, .support-form textarea { width: 100%; min-width: 0; max-width: 100%; font: inherit; color: inherit; padding: 12px; background: #fff; border: 1px solid #cbd9de; border-radius: 12px; }
.support-form textarea { resize: vertical; line-height: 1.8; }
.support-form > button { justify-self: start; }
.support-notice { color: #167261; padding: 12px 16px; border-radius: 12px; background: #f1f8f6; }
.support-error { color: #b42318; background: #fff2f0; }
.support-list { display: grid; gap: 12px; }
.support-ticket { display: grid; gap: 12px; border: 1px solid #d4e1e3; border-radius: 16px; padding: 20px; background: #fff; font: inherit; color: inherit; text-align: start; cursor: pointer; min-width: 0; width: 100%; overflow-wrap: anywhere; }
.support-ticket:hover { border-color: #087f71; background: #f4fbf9; }
.support-ticket-heading { justify-content: space-between; }
.support-ticket-heading strong { min-width: 0; flex: 1 1 180px; }
.support-ticket-meta { color: #637c87; font-size: 14px; overflow-wrap: anywhere; }
.support-badge { display: inline-flex; padding: 5px 10px; border-radius: 8px; font-size: 14px; font-weight: 700; }
.support-waiting { color: #845000; background: #fff2d7; }
.support-answered { color: #096b60; background: #dff4ec; }
.support-pagination { justify-content: center; margin-top: 20px; }
.support-conversation > button { margin-bottom: 20px; }
.support-messages { display: grid; gap: 16px; margin: 24px 0; }
.support-message { padding: 18px; border: 1px solid #dde7ea; border-radius: 14px; min-width: 0; background: #f7f9fa; }
.support-message-admin { background: #edf8f4; border-color: #beddd2; }
.support-message-heading { justify-content: space-between; }
.support-message time { font-size: 14px; color: #637c87; }
.support-message p { margin: 12px 0 0; white-space: pre-wrap; unicode-bidi: plaintext; }
.support-conversation .support-form { border-top: 1px solid #d6e2e3; padding-top: 24px; margin-top: 24px; }
.support-empty { text-align: center; padding: 32px 16px; background: #f4f8f8; border-radius: 16px; color: #637c87; }
@media (max-width: 600px) {
  .support-card, .support-ticket { padding: 16px; }
  .support-message { padding: 14px; }
  .support-toolbar { gap: 10px; }
  .support-toolbar > div { flex-basis: 100%; }
  .support-button { padding: 10px 12px; }
}
