/* A small inbox: one request form, a request list and its conversation. */
#support-view { max-width: 1440px; margin-inline: auto; width: 100%; }
#support-view .support-heading-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
#support-view .status-grid { gap: 12px; margin-bottom: 16px; }
#support-view .status-grid article { padding: 16px 20px; }
#support-view .status-grid strong { font-size: 25px; }
#support-view .support-layout { display: grid; grid-template-columns: minmax(240px, .72fr) minmax(0, 1.6fr); gap: 18px; align-items: start; }
#support-view .support-request-panel { grid-column: 1 / -1; }
#support-view .support-request-panel > summary { cursor: pointer; list-style: none; margin: 0; }
#support-view .support-request-panel > summary::-webkit-details-marker { display: none; }
#support-view .support-request-panel > summary > span { color: var(--iq-accent); font-size: 22px; font-weight: 400; }
#support-view .support-request-panel[open] > summary > span { transform: rotate(45deg); }
#support-view .support-ticket-form { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px 22px; border-top: 1px solid var(--iq-line); margin-top: 16px; padding-top: 20px; }
#support-view .support-ticket-form label:has(#support-subject),
#support-view .support-ticket-form label:has(#support-body),
#support-view .support-ticket-form .form-message { grid-column: 1 / -1; }
#support-view .support-ticket-form > button { justify-self: start; min-width: 150px; }
#support-view .support-ticket-form textarea { min-height: 140px; }
#support-view .support-list-panel,
#support-view .support-detail-panel { min-width: 0; }
#support-view .support-ticket-list { max-height: 720px; padding-right: 0; gap: 8px; scrollbar-color: var(--iq-line) transparent; }
#support-view .support-ticket-row { min-height: 0; gap: 8px; border: 1px solid var(--iq-line); border-radius: 8px; background: var(--iq-surface); color: var(--iq-text); padding: 15px; transform: none; }
#support-view .support-ticket-row:hover,
#support-view .support-ticket-row.active { background: var(--iq-soft); border-color: var(--iq-accent); transform: none; }
#support-view .support-ticket-row > strong { font-size: 14px; font-weight: 650; overflow-wrap: anywhere; }
#support-view .support-ticket-row > span:not(.support-ticket-pills) { color: var(--iq-muted); font-size: 11px; font-weight: 400; line-height: 1.6; overflow-wrap: anywhere; }
#support-view .support-ticket-pills { gap: 6px; }
#support-view .support-ticket-detail { min-height: 180px; max-height: 620px; padding-right: 0; scrollbar-color: var(--iq-line) transparent; }
#support-view .support-ticket-summary { background: var(--iq-bg); border: 1px solid var(--iq-line); border-radius: 8px; padding: 16px; }
#support-view .support-ticket-summary > strong { font-size: 17px; font-weight: 650; overflow-wrap: anywhere; }
#support-view .support-ticket-summary span { color: var(--iq-muted); font-size: 12px; font-weight: 400; overflow-wrap: anywhere; }
#support-view .support-message { background: var(--iq-surface); border: 1px solid var(--iq-line); border-radius: 8px; padding: 16px; }
#support-view .support-message.admin { background: var(--iq-soft); border-left: 3px solid var(--iq-accent); }
#support-view .support-message.internal { background: var(--iq-bg); border-left: 3px solid var(--iq-orange); }
#support-view .support-message-head { flex-wrap: wrap; gap: 5px 15px; }
#support-view .support-message-head strong { font-size: 12px; font-weight: 650; }
#support-view .support-message-head span { color: var(--iq-muted); font-size: 11px; font-weight: 400; }
#support-view .support-message p { color: var(--iq-text); font-size: 13px; line-height: 1.75; overflow-wrap: anywhere; }
#support-view .support-reply-form { border-top: 1px solid var(--iq-line); margin-top: 20px; padding-top: 18px; }
#support-view .support-reply-form textarea { min-height: 112px; }
#support-view .support-reply-form > button { justify-self: start; min-width: 130px; }
#support-view .support-admin-controls { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
#support-view .support-internal-note { background: var(--iq-bg); border: 1px solid var(--iq-line); }
#support-view #support-detail-status { color: var(--iq-muted); font-size: 12px; }
#support-view .form-message:empty { display: none; }
#support-view #support-list-message:not(:empty) { padding: 12px 15px; border: 1px solid var(--iq-line); border-radius: 7px; background: var(--iq-surface); margin: 0 0 18px; }
#support-view #support-conversation-message:not(:empty) { margin-top: 14px; }
#support-view .form-message { font-weight: 500; font-size: 12px; }
#support-view .empty-state { font-size: 13px; font-weight: 400; line-height: 1.7; }
#support-view :is(button,summary):focus-visible { outline: 3px solid var(--iq-blue); outline-offset: 3px; }
@media(max-width:850px) {
  #support-view .support-layout { grid-template-columns: minmax(0,1fr); }
  #support-view .support-ticket-list { max-height: 350px; }
  #support-view .support-ticket-detail { max-height: none; }
}
@media(max-width:550px) {
  #support-view .support-ticket-form,
  #support-view .support-admin-controls { grid-template-columns: minmax(0,1fr); }
  #support-view .status-grid { gap: 8px; }
  #support-view .status-grid article { padding: 12px; }
  #support-view .support-heading-actions { width: 100%; }
  #support-view .support-heading-actions > button { flex: 1; }
}