.support-panel { min-width: 0; }
.support-heading { align-items: flex-start; }
.support-state { margin: 12px 0; padding: 12px 14px; border-radius: 12px; color: #7b2637; background: #ffe7ec; font-size: 12px; }
.support-summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 18px 0; }
.support-summary article { min-width: 0; min-height: 102px; padding: 15px; border: 1px solid var(--xp-line); border-radius: 18px; background: rgba(255,255,255,.78); }
.support-summary span, .support-summary strong, .support-summary small { display: block; overflow-wrap: anywhere; }
.support-summary span { color: var(--xp-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.support-summary strong { margin: 8px 0 4px; font-size: 27px; }
.support-summary small { color: var(--xp-muted); font-size: 10px; }
.support-summary .warning { background: #fff6db; }
.support-summary .critical { background: #ffecef; }
.support-summary .resolved { background: #eff9df; }
.support-create-form, .support-filters { display: grid; gap: 12px; margin: 18px 0; padding: 18px; border: 1px solid var(--xp-line); border-radius: 20px; background: rgba(255,255,255,.78); }
.support-create-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.support-create-form[hidden] { display: none; }
.support-create-form label, .support-filters label, .support-management label, .support-correspondence label { color: var(--xp-muted); font-size: 11px; font-weight: 700; }
.support-create-form input, .support-create-form select, .support-create-form textarea, .support-filters input, .support-filters select, .support-management input, .support-management select, .support-correspondence textarea, .support-correspondence select { width: 100%; margin-top: 6px; }
.support-wide, .support-section-heading { grid-column: 1 / -1; }
.support-section-heading, .support-list-heading, .support-detail-header, .support-message-head, .support-event-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.support-section-heading h4, .support-section-heading h5 { margin: 3px 0 0; }
.support-filters { grid-template-columns: minmax(180px, 1.5fr) repeat(3, minmax(130px, 1fr)); align-items: end; }
.support-search { grid-column: span 2; }
.support-check { display: flex; align-items: center; gap: 8px; padding-bottom: 11px; }
.support-check input { width: auto; margin: 0; }
.support-filter-actions { display: flex; gap: 8px; }
.support-workspace { display: grid; grid-template-columns: minmax(250px, .62fr) minmax(0, 1.38fr); gap: 16px; align-items: start; }
.support-list-column, .support-detail { min-width: 0; }
.support-list-heading { align-items: center; margin-bottom: 10px; }
.support-list-heading h4 { margin: 0; }
.support-list { display: grid; gap: 10px; }
.support-card { position: relative; display: grid; gap: 8px; width: 100%; padding: 14px 14px 14px 18px; overflow: hidden; color: var(--xp-text) !important; border: 1px solid var(--xp-line) !important; border-radius: 17px !important; background: rgba(255,255,255,.86) !important; box-shadow: none !important; text-align: left; }
.support-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: #9da29e; }
.support-card.priority-critical::before { background: #d3485b; }
.support-card.priority-high::before { background: #ed8954; }
.support-card.priority-normal::before { background: #6d7eea; }
.support-card.priority-low::before { background: #79aa45; }
.support-card.selected { border-color: #6d7eea !important; box-shadow: 0 0 0 2px rgba(68,98,255,.08) !important; }
.support-card-head, .support-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.support-code { font-size: 9px; font-weight: 900; letter-spacing: .07em; }
.support-card > strong { overflow-wrap: anywhere; font-size: 13px; }
.support-card-context, .support-card-footer { margin: 0; color: var(--xp-muted); font-size: 10px; }
.support-pill { display: inline-flex; align-items: center; padding: 5px 8px; border-radius: 999px; color: #464a47; background: #e9eae3; font-size: 9px; font-weight: 900; }
.support-pill.priority-critical { color: #8e2a3c; background: #ffe7ec; }
.support-pill.priority-high { color: #89451e; background: #ffeadb; }
.support-pill.priority-normal { color: #3e4f9f; background: #e9edff; }
.support-pill.priority-low { color: #356524; background: #edf8de; }
.support-detail { padding: 20px; border: 1px solid var(--xp-line); border-radius: 22px; background: rgba(255,255,255,.78); }
.support-detail-header h4 { margin: 4px 0 0; overflow-wrap: anywhere; font-size: clamp(20px,2.7vw,31px); line-height: 1.08; }
.support-detail-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.support-meta-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 18px 0; }
.support-meta-grid > div { min-width: 0; padding: 12px; border-radius: 14px; background: #f5f6f4; }
.support-meta-grid span, .support-meta-grid strong { display: block; overflow-wrap: anywhere; }
.support-meta-grid span { color: var(--xp-muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.support-meta-grid strong { margin-top: 6px; font-size: 11px; }
.support-management, .support-correspondence, .support-history { margin-top: 14px; padding: 16px; border: 1px solid var(--xp-line); border-radius: 17px; background: #fff; }
.support-management { background: rgba(68,98,255,.04); }
.support-management form { display: grid; grid-template-columns: minmax(140px,1fr) minmax(180px,1.4fr) auto; gap: 9px; align-items: end; margin-top: 12px; }
.support-management form:first-of-type { grid-template-columns: minmax(180px,1fr) auto; }
.support-messages, .support-events { display: grid; gap: 9px; margin-top: 12px; }
.support-message, .support-event { padding: 12px; border: 1px solid rgba(16,17,22,.08); border-radius: 13px; background: #fff; }
.support-message.visibility-internal { background: #fff6db; }
.support-message-head { align-items: center; flex-wrap: wrap; }
.support-message-head strong { font-size: 11px; }
.support-message-head span, .support-message-head time, .support-event time, .support-event small { color: var(--xp-muted); font-size: 9px; }
.support-message p, .support-event p { margin: 9px 0 0; overflow-wrap: anywhere; white-space: pre-wrap; font-size: 11px; line-height: 1.55; }
.support-event-reason { padding: 8px; border-radius: 9px; background: #f5f6f4; }
.support-correspondence form { display: grid; grid-template-columns: minmax(150px,.4fr) minmax(0,1.6fr); gap: 10px; align-items: end; margin-top: 14px; }
.support-correspondence form .support-wide { grid-column: 1 / -1; }
.support-correspondence form button { justify-self: end; }

@media (max-width: 1180px) {
  .support-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .support-filters { grid-template-columns: repeat(3,minmax(140px,1fr)); }
  .support-workspace { grid-template-columns: minmax(220px,.52fr) minmax(0,1.48fr); }
  .support-meta-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .support-workspace { grid-template-columns: 1fr; }
  .support-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .support-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .support-panel { padding: 15px; }
  .support-heading, .support-detail-header { display: grid; }
  .support-heading .heading-actions, .support-heading .heading-actions button { width: 100%; }
  .support-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .support-create-form, .support-filters, .support-list, .support-management form, .support-management form:first-of-type, .support-correspondence form { grid-template-columns: 1fr; }
  .support-search, .support-wide, .support-section-heading, .support-correspondence form .support-wide { grid-column: 1; }
  .support-filter-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .support-filter-actions button, .support-management button, .support-correspondence button { width: 100%; }
  .support-detail-badges { justify-content: flex-start; }
}
@media (max-width: 390px) {
  .support-panel { padding: 12px; }
  .support-summary, .support-meta-grid { grid-template-columns: 1fr; }
  .support-detail { padding: 12px; border-radius: 16px; }
  .support-message-head, .support-event-head { display: grid; }
}
