/* V364. IT Support only. Screen breakpoints keep desktop and print intact.
   Native table headers remain in the accessibility tree when rows become cards. */
@media screen and (max-width:1100px) {
  body[data-portal-page="tickets"] #content .tw362 .tw362-metrics {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body[data-portal-page="tickets"] #content .tw362 .tw362-filters {
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:10px;
  }
  body[data-portal-page="tickets"] #content .tw362 .tw362-search {
    grid-column:1/-1;min-width:0;
  }
  body[data-portal-page="tickets"] #content .tw362 .tw362-select-wrap {min-width:0}
  body[data-portal-page="tickets"] #content .tw362 select {width:100%;max-width:none;padding-inline:12px 30px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-clear {grid-column:1/-1;justify-self:start}
}

@media screen and (max-width:760px) {
  body[data-portal-page="tickets"] #content :is(.tw362,.detail-grid,.stack,.card,.card-body,.detail-meta,.comment-box,.document-name,.tw362-column,.tw362-engineer-copy) {min-width:0;max-width:100%}
  body[data-portal-page="tickets"] #content :is(h1,h2,h3,.kv b,.timeline li,.audit-note,.comment-body,.document-name,.record-secondary,.tw362-card-title,.tw362-ticket-id,.tw362-person-row,.tw362-engineer-copy) {overflow-wrap:anywhere}
  body[data-portal-page="tickets"] #content .detail-grid {grid-template-columns:minmax(0,1fr);gap:16px}
  body[data-portal-page="tickets"] #content .stack {gap:16px}
  body[data-portal-page="tickets"] #content .card-head {padding:18px 16px 14px}
  body[data-portal-page="tickets"] #content .card-body {padding:0 16px 18px}
  body[data-portal-page="tickets"] #content .detail-meta {padding:20px 16px;gap:20px 16px;grid-template-columns:repeat(2,minmax(0,1fr))}
  body[data-portal-page="tickets"] #content .detail-meta .kv b {font-size:14px;line-height:1.55;white-space:normal}
  body[data-portal-page="tickets"] #content .detail-meta .kv small {font-size:12px}
  body[data-portal-page="tickets"] #content .comment {gap:10px;align-items:flex-start}
  body[data-portal-page="tickets"] #content .comment>.avatar {flex:0 0 30px;width:30px;height:30px}
  body[data-portal-page="tickets"] #content .comment-box {flex:1;padding:12px}
  body[data-portal-page="tickets"] #content .comment-header {align-items:flex-start;flex-direction:column;gap:4px}
  body[data-portal-page="tickets"] #content .comment-header span {white-space:normal}
  body[data-portal-page="tickets"] #content .document-row {gap:10px;flex-wrap:wrap;padding:12px 0}
  body[data-portal-page="tickets"] #content .document-name {flex:1 1 140px;white-space:normal}
  body[data-portal-page="tickets"] #content .document-name small {white-space:normal}
  body[data-portal-page="tickets"] #content .timeline li {padding-left:20px;padding-bottom:22px}
  body[data-portal-page="tickets"] #content .timeline small {white-space:normal;overflow-wrap:anywhere}
  body[data-portal-page="tickets"] #content :is(.head-actions,.form-actions) {display:flex;flex-wrap:wrap;width:100%;gap:10px}
  body[data-portal-page="tickets"] #content :is(.head-actions,.form-actions) .btn {min-height:46px;flex:1 1 160px;white-space:normal}
  body[data-portal-page="tickets"] #content :is(.back-link,.document-row,.text-link) {min-height:44px;align-items:center}
  body[data-portal-page="tickets"] #content .back-link {display:inline-flex}
  body[data-portal-page="tickets"] :is(#content,.modal) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),select,textarea) {min-width:0;max-width:100%;min-height:46px;font-size:16px;line-height:1.4}
  body[data-portal-page="tickets"] :is(#content,.modal) input[type="file"] {width:100%;padding:10px}
  body[data-portal-page="tickets"] :is(#content,.modal) .check-label {min-height:44px;display:flex;align-items:center;gap:9px}
  body[data-portal-page="tickets"] .modal .form-grid {grid-template-columns:minmax(0,1fr)}
  body[data-portal-page="tickets"] .modal .form-actions {flex-wrap:wrap}
  body[data-portal-page="tickets"] .modal .form-actions .btn {min-height:46px;flex:1 1 140px}

  body[data-portal-page="tickets"] #content .tw362 .tw362-hero {padding:20px 16px;border-radius:16px}
  body[data-portal-page="tickets"] #content .tw362 :is(.tw362-brand-row,.tw362-brand,.tw362-hero-copy) {flex-wrap:wrap;min-width:0}
  body[data-portal-page="tickets"] #content .tw362 .tw362-brand-row {gap:12px;margin-bottom:20px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-brand strong {font-size:12px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-hero-copy {display:flex;flex-direction:column;align-items:stretch;gap:18px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-hero h1 {font-size:clamp(25px,7vw,34px);line-height:1.15;max-width:none;letter-spacing:-.8px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-hero p {font-size:13px;max-width:none}
  body[data-portal-page="tickets"] #content .tw362 .tw362-hero-action {width:100%;min-height:46px;white-space:normal;font-size:14px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-metrics {gap:10px;margin:14px 0 22px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-metric {grid-template-columns:minmax(0,1fr) auto;padding:14px 12px;gap:10px;min-width:0}
  body[data-portal-page="tickets"] #content .tw362 .tw362-metric-icon {grid-column:1;grid-row:1;width:32px;height:32px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-metric>span:not(.tw362-metric-icon) {grid-column:1/-1;grid-row:2;min-width:0}
  body[data-portal-page="tickets"] #content .tw362 .tw362-metric-value {grid-column:2;grid-row:1;font-size:28px;overflow-wrap:anywhere}
  body[data-portal-page="tickets"] #content .tw362 .tw362-metric-label {font-size:12px;line-height:1.5}
  body[data-portal-page="tickets"] #content .tw362 .tw362-workspace-head {align-items:flex-start;flex-wrap:wrap;gap:10px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-workspace-head p {font-size:12px}
  body[data-portal-page="tickets"] #content .tw362 :is(.tw362-refresh,.tw362-clear,.tw362-view-switch button,.tw362-scope-tabs button,.tw362-pagination button,.tw362-lane-foot button,.tw362-solid-button) {min-height:44px;font-size:13px;white-space:normal}
  body[data-portal-page="tickets"] #content .tw362 .tw362-scope-row {padding:0 12px;gap:8px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-scope-tabs {gap:16px;max-width:100%;flex-wrap:wrap}
  body[data-portal-page="tickets"] #content .tw362 .tw362-toolbar {display:flex;flex-direction:column;align-items:stretch;padding:12px;gap:12px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-search {width:100%;min-width:0}
  body[data-portal-page="tickets"] #content .tw362 .tw362-search input {min-height:46px;height:auto;font-size:16px;padding-inline:0}
  body[data-portal-page="tickets"] #content .tw362 select {font-size:16px;min-height:46px;height:auto}
  body[data-portal-page="tickets"] #content .tw362 .tw362-view-switch {width:100%;margin:0}
  body[data-portal-page="tickets"] #content .tw362 .tw362-view-switch button {flex:1;justify-content:center}
  body[data-portal-page="tickets"] #content .tw362 .tw362-result-line {flex-direction:column;align-items:flex-start;font-size:12px;gap:5px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-scroll-hint {display:none}
  body[data-portal-page="tickets"] #content .tw362 .tw362-board-scroll {overflow:visible;max-width:100%;padding:0 0 12px}
  body[data-portal-page="tickets"] #content .tw362 :is(.tw362-board,.tw362-closed-board) {display:grid;grid-template-columns:minmax(0,1fr);gap:16px;min-width:0;width:100%;max-width:100%}
  body[data-portal-page="tickets"] #content .tw362 .tw362-column {min-height:0;padding:16px 12px 12px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-column-title {font-size:16px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-column-caption {font-size:12px;min-height:0}
  body[data-portal-page="tickets"] #content .tw362 .tw362-card {padding:15px 13px;min-width:0;overflow-wrap:anywhere}
  body[data-portal-page="tickets"] #content .tw362 .tw362-card-title {font-size:16px;min-height:0}
  body[data-portal-page="tickets"] #content .tw362 .tw362-card-top {flex-wrap:wrap;gap:8px}
  body[data-portal-page="tickets"] #content .tw362 :is(.tw362-ticket-id,.tw362-category,.tw362-person-row,.tw362-person-label,.tw362-engineer-row,.tw362-card-foot) {font-size:12px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-engineer-copy small {font-size:11px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-person-row {align-items:flex-start;flex-wrap:wrap;gap:6px 12px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-status-note {font-size:12px;line-height:1.5}
  body[data-portal-page="tickets"] #content .tw362 .tw362-pagination {flex-wrap:wrap;align-items:flex-start;gap:12px;font-size:12px}
  body[data-portal-page="tickets"] #content .tw362 .tw362-pagination>div {display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:100%}
  body[data-portal-page="tickets"] #content .tw362 .tw362-page-foot {font-size:11px;align-items:flex-start;flex-direction:column;gap:7px}

  /* Both the original ticket list and V362 list share these six columns. */
  body[data-portal-page="tickets"] #content :is(#listGrid>.table-wrap,.tw362-table-wrap) {overflow:visible;border:0;background:transparent}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) {display:block;width:100%;min-width:0;max-width:100%;border:0;background:transparent}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) thead {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) tbody {display:grid;grid-template-columns:minmax(0,1fr);gap:12px;width:100%}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) tbody tr {display:block;min-width:0;border:1px solid var(--border,#e2e9e6);background:var(--surface,#fff);border-radius:12px;padding:13px 14px;box-shadow:none}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td {display:grid;grid-template-columns:88px minmax(0,1fr);gap:10px;padding:7px 0;border:0;min-width:0;font-size:13px;line-height:1.5;white-space:normal;overflow-wrap:anywhere;align-items:start}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td:first-child {display:block;padding:0 0 12px;margin-bottom:5px;border-bottom:1px solid var(--border,#e2e9e6);box-shadow:none}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td::before {font-size:12px;color:var(--muted);font-weight:500}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td:nth-child(2)::before {content:"Requester"}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td:nth-child(3)::before {content:"Priority"}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td:nth-child(4)::before {content:"Status"}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td:nth-child(5)::before {content:"Assigned to"}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td:nth-child(6)::before {content:"Created"}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) td :is(.nowrap,.badge,.tw362-table-status,.tw362-priority) {white-space:normal;max-width:100%;justify-self:start;font-size:12px}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) :is(.record-link,.tw362-row-button) {display:block;min-height:44px;font-size:14px;overflow-wrap:anywhere}
  body[data-portal-page="tickets"] #content :is(.list-table,.tw362-table-wrap table) :is(.record-secondary,.tw362-row-title) {max-width:100%;font-size:15px;white-space:normal;overflow-wrap:anywhere}
}

@media screen and (max-width:480px) {
  body[data-portal-page="tickets"] #content .detail-meta {grid-template-columns:minmax(0,1fr)}
  body[data-portal-page="tickets"] #content .tw362 .tw362-filters {grid-template-columns:minmax(0,1fr)}
  body[data-portal-page="tickets"] #content .tw362 .tw362-clear {width:100%;justify-self:stretch}
  body[data-portal-page="tickets"] #content .ticket-progress>ol {display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
  body[data-portal-page="tickets"] #content .ticket-progress li {display:flex;align-items:center;gap:12px;text-align:left;font-size:13px}
  body[data-portal-page="tickets"] #content .ticket-progress li>span {margin:0;flex:0 0 34px;width:34px;height:34px}
  body[data-portal-page="tickets"] #content .ticket-progress li::after {display:none}
}