/* Ticket submission fidelity */
.hf-support-submit {
  inline-size: 100%;
  max-inline-size: 70rem;
  margin-inline: auto;
  display: grid;
  gap: 1.25rem;
}
.hf-support-departments {
  inline-size: 100%;
  max-inline-size: 70rem;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .875rem;
}
.hf-support-department {
  min-block-size: 8.5rem;
  display: grid;
  grid-template-columns: 2.75rem minmax(0, 1fr);
  align-items: start;
  gap: .875rem;
  padding: 1rem;
  color: var(--hf-color-text);
  transition: border-color var(--hf-motion-fast) var(--hf-ease), transform var(--hf-motion-fast) var(--hf-ease), background var(--hf-motion-fast) var(--hf-ease);
}
.hf-support-department:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--hf-color-primary) 28%, var(--hf-color-border));
  background: color-mix(in srgb, var(--hf-color-primary) 3%, var(--hf-color-surface));
}
.hf-support-department__icon {
  inline-size: 2.75rem;
  block-size: 2.75rem;
  display: grid;
  place-items: center;
  border-radius: .75rem;
  color: var(--hf-color-primary);
  background: color-mix(in srgb, var(--hf-color-primary) 9%, var(--hf-color-surface));
}
.hf-support-department strong { display: block; font-size: 1rem; }
.hf-support-department p { margin: .35rem 0 0; color: var(--hf-color-text-muted); line-height: 1.75; font-size: .86rem; }
.hf-support-ticket-form {
  inline-size: 100%;
  max-inline-size: 56rem;
  margin-inline: auto;
  padding: 1.125rem;
}
.hf-support-submit--form > .hf-page-header { max-inline-size: 56rem; inline-size: 100%; margin-inline: auto; }

/* Support center surfaces: tickets, knowledgebase, downloads, announcements, status and notifications. */
.hf-support-toolbar {
  display: grid;
  grid-template-columns: minmax(14rem, 1.5fr) repeat(2, minmax(10rem, .75fr));
  gap: var(--hf-space-4);
  margin-block-end: var(--hf-space-5);
}
.hf-support-toolbar__search { min-inline-size: 0; }
.hf-support-ticket-list { display: grid; gap: var(--hf-space-3); }
.hf-support-ticket-card {
  display: grid;
  gap: var(--hf-space-4);
  padding: var(--hf-space-5);
  border: 1px solid var(--hf-color-border);
  border-radius: var(--hf-radius-lg);
  background: var(--hf-color-surface);
  color: var(--hf-color-text);
  box-shadow: var(--hf-shadow-sm);
  text-decoration: none;
  transition: border-color var(--hf-motion-fast) var(--hf-ease), transform var(--hf-motion-fast) var(--hf-ease), box-shadow var(--hf-motion-fast) var(--hf-ease);
}
.hf-support-ticket-card:hover { border-color: color-mix(in srgb, var(--hf-color-primary) 35%, var(--hf-color-border)); box-shadow: var(--hf-shadow-md); transform: translateY(-1px); }
.hf-support-ticket-card__top, .hf-ticket-view__header, .hf-ticket-view__meta, .hf-ticket-view__actions,
.hf-support-form-actions, .hf-download-file, .hf-server-status header, .hf-bottom-sheet__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--hf-space-3);
}
.hf-support-ticket-card__subject { display: block; margin-block-end: var(--hf-space-1); }
.hf-support-ticket-card__id { color: var(--hf-color-text-muted); font-size: .875rem; }
.hf-support-ticket-card__meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--hf-space-3); margin: 0; }
.hf-support-ticket-card__meta div { display: grid; gap: var(--hf-space-1); }
.hf-support-ticket-card__meta dt { color: var(--hf-color-text-muted); font-size: .78rem; }
.hf-support-ticket-card__meta dd { margin: 0; font-weight: 500; }
.hf-support-no-results { margin-block-start: var(--hf-space-4); text-align: center; color: var(--hf-color-text-muted); }

.hf-ticket-view { display: grid; gap: var(--hf-space-5); }
.hf-ticket-view__header { align-items: flex-start; }
.hf-ticket-view__header h1 { margin: var(--hf-space-2) 0; }
.hf-ticket-view__eyebrow { color: var(--hf-color-text-muted); }
.hf-ticket-view__meta { justify-content: flex-start; flex-wrap: wrap; color: var(--hf-color-text-muted); }
.hf-ticket-thread { display: grid; gap: var(--hf-space-4); }
.hf-ticket-reply, .hf-ticket-message {
  max-inline-size: min(100%, 56rem);
  padding: var(--hf-space-5);
  border: 1px solid var(--hf-color-border);
  border-radius: var(--hf-radius-lg);
  background: var(--hf-color-surface);
  box-shadow: var(--hf-shadow-sm);
}
.hf-ticket-thread > :nth-child(even) { margin-inline-start: auto; background: color-mix(in srgb, var(--hf-color-primary) 4%, var(--hf-color-surface)); }
.hf-ticket-composer { display: grid; gap: var(--hf-space-4); }
.hf-ticket-composer form, .hf-support-ticket-form { display: grid; gap: var(--hf-space-4); }
.hf-ticket-upload { display: grid; gap: var(--hf-space-3); padding: var(--hf-space-4); border: 1px dashed var(--hf-color-border); border-radius: var(--hf-radius-md); background: var(--hf-color-surface-muted); }
.hf-ticket-upload__row { display: grid; grid-template-columns: 1fr auto; gap: var(--hf-space-2); }
.hf-ticket-upload small { color: var(--hf-color-text-muted); }
.hf-ticket-attachments { display: flex; flex-wrap: wrap; gap: var(--hf-space-2); }
.hf-ticket-attachments a { padding: var(--hf-space-2) var(--hf-space-3); border-radius: var(--hf-radius-sm); background: var(--hf-color-surface-muted); }

.hf-help-center { display: grid; gap: var(--hf-space-6); }
.hf-help-center__hero {
  padding: clamp(1.5rem, 4vw, 3.5rem);
  border: 1px solid var(--hf-color-border);
  border-radius: var(--hf-radius-lg);
  background: linear-gradient(135deg, color-mix(in srgb, var(--hf-color-primary) 8%, var(--hf-color-surface)), var(--hf-color-surface));
  text-align: center;
}
.hf-help-center__hero h1 { margin: 0; }
.hf-help-center__hero p { color: var(--hf-color-text-muted); }
.hf-help-center__search { display: grid; grid-template-columns: 1fr auto; gap: var(--hf-space-2); max-inline-size: 44rem; margin: var(--hf-space-5) auto 0; }
.hf-kb-category-grid, .hf-download-category-grid, .hf-server-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--hf-space-4);
}
.hf-kb-category, .hf-download-category { display: grid; gap: var(--hf-space-2); color: var(--hf-color-text); text-decoration: none; }
.hf-kb-category p, .hf-download-category p { margin: 0; color: var(--hf-color-text-muted); }
.hf-kb-article-list, .hf-kb-popular > div, .hf-kb-related { display: grid; gap: var(--hf-space-3); }
.hf-kb-article-card { display: grid; gap: var(--hf-space-1); padding-block: var(--hf-space-3); color: var(--hf-color-text); text-decoration: none; border-block-end: 1px solid var(--hf-color-border); }
.hf-kb-article-card:last-child { border-block-end: 0; }
.hf-kb-article { max-inline-size: 62rem; margin-inline: auto; }
.hf-kb-article header { margin-block-end: var(--hf-space-6); }
.hf-kb-back { color: var(--hf-color-primary); }
.hf-kb-article__body { line-height: 2; }
.hf-kb-article__body img { max-inline-size: 100%; block-size: auto; border-radius: var(--hf-radius-md); }
.hf-kb-article__body pre { overflow: auto; direction: ltr; text-align: left; padding: var(--hf-space-4); border-radius: var(--hf-radius-md); background: #0f172a; color: #e2e8f0; }
.hf-kb-feedback { display: flex; align-items: center; gap: var(--hf-space-3); margin-block-start: var(--hf-space-6); padding-block-start: var(--hf-space-4); border-block-start: 1px solid var(--hf-color-border); }

.hf-download-list, .hf-announcement-list { display: grid; gap: var(--hf-space-4); }
.hf-download-file { align-items: flex-start; }
.hf-download-file p, .hf-announcement-card p { color: var(--hf-color-text-muted); }
.hf-announcement-card time, .hf-announcement-detail time { color: var(--hf-color-text-muted); font-size: .875rem; }
.hf-announcement-card h2 { margin: var(--hf-space-2) 0; }
.hf-announcement-card h2 a { color: var(--hf-color-text); text-decoration: none; }
.hf-announcement-detail { max-inline-size: 62rem; margin-inline: auto; }
.hf-rich-content { line-height: 2; overflow-wrap: anywhere; }

.hf-server-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hf-server-status { display: grid; gap: var(--hf-space-4); }
.hf-server-status dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--hf-space-3); margin: 0; }
.hf-server-status dl div { padding: var(--hf-space-3); border-radius: var(--hf-radius-md); background: var(--hf-color-surface-muted); }
.hf-server-status dt { color: var(--hf-color-text-muted); font-size: .8rem; }
.hf-server-status dd { margin: var(--hf-space-1) 0 0; font-weight: 500; }
.hf-network-issues { margin-block-start: var(--hf-space-5); }
.hf-network-issues article + article { border-block-start: 1px solid var(--hf-color-border); padding-block-start: var(--hf-space-4); margin-block-start: var(--hf-space-4); }

.hf-notification-trigger { position: relative; }
.hf-notification-trigger__badge {
  position: absolute;
  inset-block-start: -.25rem;
  inset-inline-start: -.25rem;
  min-inline-size: 1.25rem;
  block-size: 1.25rem;
  display: grid;
  place-items: center;
  padding-inline: .25rem;
  border: 2px solid var(--hf-color-surface);
  border-radius: 999px;
  background: var(--hf-color-danger);
  color: white;
  font-size: .65rem;
  font-weight: 500;
}
.hf-notification-center .hf-bottom-sheet__panel { max-block-size: min(78vh, 42rem); overflow: auto; }
.hf-notification-center__list { display: grid; gap: var(--hf-space-2); margin-block-start: var(--hf-space-4); }
.hf-notification-center__item {
  display: grid;
  grid-template-columns: .6rem 1fr;
  gap: var(--hf-space-3);
  align-items: start;
  padding: var(--hf-space-3);
  border: 1px solid var(--hf-color-border);
  border-radius: var(--hf-radius-md);
  color: var(--hf-color-text);
  text-decoration: none;
}
.hf-notification-center__item > span:last-child { display: grid; gap: var(--hf-space-1); }
.hf-notification-center__item > span:last-child > span { color: var(--hf-color-text-muted); }
.hf-notification-center__marker { inline-size: .5rem; block-size: .5rem; margin-block-start: .45rem; border-radius: 999px; background: var(--hf-color-info); }
.hf-notification-center__item--warning .hf-notification-center__marker { background: var(--hf-color-warning); }
.hf-notification-center__item--danger .hf-notification-center__marker { background: var(--hf-color-danger); }
.hf-notification-center__item--success .hf-notification-center__marker { background: var(--hf-color-success); }
.hf-notification-center__empty { margin-block-start: var(--hf-space-5); }
.hf-text-muted { color: var(--hf-color-text-muted); }

@media (max-width: 60rem) {
  .hf-support-toolbar { grid-template-columns: 1fr 1fr; }
  .hf-support-toolbar__search { grid-column: 1 / -1; }
  .hf-kb-category-grid, .hf-download-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 42rem) {
  .hf-support-departments { grid-template-columns: 1fr; }
  .hf-support-department { min-block-size: 7.25rem; }
  .hf-support-ticket-form { padding: 1rem; }
  .hf-support-toolbar, .hf-support-ticket-card__meta, .hf-kb-category-grid, .hf-download-category-grid, .hf-server-status-grid, .hf-server-status dl { grid-template-columns: 1fr; }
  .hf-support-toolbar__search { grid-column: auto; }
  .hf-ticket-view__header, .hf-download-file { align-items: stretch; flex-direction: column; }
  .hf-ticket-view__actions, .hf-support-form-actions { inline-size: 100%; }
  .hf-ticket-view__actions .hf-btn, .hf-support-form-actions .hf-btn, .hf-download-file .hf-btn { inline-size: 100%; }
  .hf-help-center__search { grid-template-columns: 1fr; }
  .hf-ticket-upload__row { grid-template-columns: 1fr; }
  .hf-ticket-reply, .hf-ticket-message { max-inline-size: 100%; }
}