/* Support. The first part carries the layout rules of the stylesheet this design replaced on
   2026-10-08, with its colours, type and corners brought to this design; the second part is
   written for this design. Loaded after site.css and portal.css. */

/* ---- Carried over from the previous stylesheet ------------------------------------------------ */
.mobile-account-link{display:none}.support-main{max-width:1040px}.support-shell{border:1px solid var(--line);background:linear-gradient(145deg,rgba(14,18,24,.95),rgba(6,8,11,.97));border-radius:8px;padding:18px;box-shadow:0 20px 70px #00000088}.support-create{display:grid;gap:14px;max-width:760px}.support-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.support-choice button{border:1px solid #272c32;background:#0c1015;color:#d0d3d7;border-radius:6px;padding:14px;text-align:left;font:600 15px var(--sans);cursor:pointer}.support-choice button.active{border-color:#2f9dff;background:#1b242f;box-shadow:none;color:#ffffff}.support-create label{display:grid;gap:6px;color:#d9dbdf;font-weight:600}.support-create select,.support-create input,.support-create textarea,.support-composer textarea{width:100%;box-sizing:border-box;border:1px solid #2d333a;background:#06080c;color:#ffffff;border-radius:6px;padding:12px;font:500 15px var(--sans)}.support-create textarea{min-height:150px;resize:vertical}.support-create select:focus,.support-create input:focus,.support-create textarea:focus,.support-composer textarea:focus{outline:none;border-color:#2f9dff;box-shadow:none}.support-note{border:1px solid #272c32;background:#0b0f14;border-radius:6px;padding:12px;color:#bec2c7}.support-ticket-head{display:flex;justify-content:space-between;gap:14px;align-items:center;border-bottom:1px solid #20242a;padding-bottom:14px}.support-ticket-head h2{margin:0}.support-ticket-head p{margin:4px 0 0;color:var(--muted)}.support-messages{height:min(58vh,620px);min-height:390px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:14px 2px}.support-message{display:grid;grid-template-columns:40px minmax(0,1fr);gap:11px;border:1px solid #20242a;background:#090c10;border-radius:6px;padding:12px}.support-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;background:#19202b}.support-message-body{min-width:0}.support-message-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.support-message-head small,.support-message small{color:var(--muted)}.support-message-content{white-space:pre-wrap;overflow-wrap:anywhere;margin:5px 0;color:#d9dbdf}.support-embed{border-left:3px solid #2f9dff;background:#0d1117;border-radius:4px;padding:10px;margin-top:7px}.support-embed p{white-space:pre-wrap;overflow-wrap:anywhere}.support-media{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.support-media img{max-width:min(100%,440px);max-height:320px;border:1px solid #2d333a;border-radius:6px;object-fit:contain}.support-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;border-top:1px solid #20242a;padding-top:12px}.support-composer textarea{grid-column:1;resize:none}.support-composer>button[type=submit]{grid-column:2;grid-row:1/3}.support-file-row{grid-column:1;display:flex;align-items:center;gap:8px;min-width:0}.support-file-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}.empty-support{text-align:center;padding:35px 15px;color:var(--muted)}
@media(max-width:760px){.mobile-account-link{display:inline-flex;white-space:nowrap;padding:8px 10px}.support-main{padding:22px 10px}.compact-hero{display:none}.support-shell{border-radius:6px;padding:11px}.support-choice{grid-template-columns:1fr}.support-ticket-head{align-items:flex-start;flex-direction:column}.support-ticket-head .button{width:100%}.support-messages{height:calc(100vh - 330px);min-height:340px}.support-composer{grid-template-columns:1fr}.support-composer .button{width:100%}.support-message{grid-template-columns:32px minmax(0,1fr);padding:9px}.support-avatar{width:32px;height:32px}}

.support-page-body.support-ticket-open{height:100vh;min-height:0;overflow:hidden}
.support-ticket-open .support-main{height:calc(100vh - 78px);min-height:0;padding:16px clamp(12px,2vw,28px);display:flex;flex-direction:column;overflow:hidden}
.support-ticket-open .compact-hero{display:none}
.support-ticket-open #supportContent{flex:1;min-height:0;display:flex}
.support-ticket-open .support-shell{flex:1;min-height:0;display:flex;flex-direction:column;width:100%}
.support-ticket-open .support-messages{flex:1;height:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#2d333a transparent}
.support-ticket-open .support-messages::-webkit-scrollbar{width:7px}
.support-ticket-open .support-messages::-webkit-scrollbar-thumb{background:#2d333a;border-radius:99px}
.support-member-link,.support-author-link{display:inline;padding:0;border:0;background:none;color:#70bcff;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
.support-member-link:hover,.support-author-link:hover{text-decoration:underline;color:#ffffff}
.support-product-link{display:inline-block;color:#b29bff;text-decoration:none;border-bottom:1px solid #8d68ff80}
.support-product-link:hover{color:#ffffff;border-color:#bdaaff}
.support-mention{color:#b29bff}
.support-time{color:#d9dbdf}
.support-member-profile{text-align:center}
.support-profile-avatar{width:96px;height:96px;border:4px solid #2f9dff;border-radius:50%;object-fit:cover;box-shadow:none}
.support-member-profile h3{margin:19px 0 8px;font:700 14px var(--sans);font-stretch:118%}
.support-member-profile>.button{margin-top:22px}
.support-profile-chips{display:flex;gap:7px;flex-wrap:wrap;justify-content:center}
.support-profile-chip{display:inline-flex;border:1px solid #687585;border-radius:999px;padding:4px 9px;color:#eaedf1;text-decoration:none}
.support-profile-product{border-color:#6e61d9;background:#211b48}
.support-profile-product:hover{border-color:#b29bff;color:#ffffff}
.support-profile-empty{color:var(--muted)}

@media(max-width:760px){
  .support-ticket-open .support-main{height:calc(100vh - 68px);padding:7px}
  .support-ticket-open .support-shell{padding:9px;border-radius:6px}
  .support-ticket-open .support-ticket-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding-bottom:8px}
  .support-ticket-open .support-ticket-head .button{width:auto;padding:8px 10px}
  .support-ticket-open .support-ticket-head h2{font-size:16.5px}
  .support-ticket-open .support-ticket-head p{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .support-ticket-open .support-messages{height:auto;min-height:0;padding:8px 1px}
  .support-ticket-open .support-composer{grid-template-columns:minmax(0,1fr) auto;gap:6px;padding-top:7px}
  .support-ticket-open .support-composer textarea{grid-column:1;padding:8px;min-height:44px}
  .support-ticket-open .support-composer>button[type=submit]{grid-column:2;grid-row:1/3;width:auto;padding:8px 13px}
  .support-ticket-open .support-file-row{grid-column:1;gap:5px}
  .support-ticket-open .support-file-row .button{width:auto;padding:6px 8px}
  .support-ticket-open .support-message{grid-template-columns:28px minmax(0,1fr);gap:7px;padding:8px}
  .support-ticket-open .support-avatar{width:28px;height:28px}
  .support-member-profile{padding:18px}
}
.support-create [hidden]{display:none!important}
@supports(height:100dvh){.support-page-body.support-ticket-open{height:100dvh}.support-ticket-open .support-main{height:calc(100dvh - 78px)}@media(max-width:760px){.support-ticket-open .support-main{height:calc(100dvh - 68px)}}}

.support-reply-reference,.support-compose-reply{display:flex;gap:8px;border-left:3px solid #2f9dff;background:#0d1117;border-radius:4px;padding:8px 10px;color:#ced1d5}.support-reply-reference{flex-direction:column;margin-top:7px}.support-reply-reference span,.support-compose-reply span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.support-message-actions{display:flex;justify-content:flex-end;margin-top:7px}.support-reply-button{border:0;background:none;color:#78c0ff;font:600 12px var(--sans);cursor:pointer}.support-reply-button:hover{color:#ffffff;text-decoration:underline}.support-compose-reply{grid-column:1/-1;grid-row:1;align-items:center;justify-content:space-between}.support-compose-reply[hidden]{display:none}.support-compose-reply div{display:flex;flex-direction:column;min-width:0}.support-compose-reply button{border:0;background:none;color:#e3e6eb;font-size:20.5px;cursor:pointer}.support-composer textarea,.support-ticket-open .support-composer textarea{grid-column:1;grid-row:2}.support-composer>button[type=submit],.support-ticket-open .support-composer>button[type=submit]{grid-column:2;grid-row:2/4}.support-file-row,.support-ticket-open .support-file-row{grid-column:1;grid-row:3}
.support-edit-form{display:grid;gap:14px}.support-edit-form label{display:grid;gap:6px;color:#d9dbdf;font-weight:600}.support-edit-form textarea{display:block;width:100%;min-height:120px;box-sizing:border-box;resize:vertical;border:1px solid #2d333a;background:#06080c;color:#ffffff;border-radius:6px;padding:12px;font:500 15px var(--sans)}.support-edit-form textarea:focus{outline:none;border-color:#2f9dff;box-shadow:inset 0 0 0 1px #2f9dff}.support-edit-form .action-row{margin-top:0}

@media(max-width:760px){.support-compose-reply{font-size:12px}.support-reply-reference{padding:6px 8px}}
.support-message-footer,.admin-support-message-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;min-height:26px}.chat-reactions{display:flex;flex-wrap:wrap;gap:5px}.chat-reaction{display:inline-flex;align-items:center;gap:5px;border:1px solid #272c32;border-radius:999px;padding:3px 8px;background:#0b0e13;color:#dfe2e7;cursor:pointer}.chat-reaction:hover,.chat-reaction.active{border-color:#2f9dff;background:#18202c;box-shadow:none}.chat-reaction img{width:18px;height:18px;object-fit:contain}.message-reaction-picker{position:fixed;z-index:120;display:grid;grid-template-columns:repeat(8,34px);gap:4px;max-width:304px;border:1px solid #2d333a;border-radius:6px;padding:8px;background:#090c10;box-shadow:0 16px 45px #000000cc}.message-reaction-picker[hidden]{display:none}.message-reaction-picker button{display:grid;place-items:center;width:34px;height:34px;border:1px solid transparent;border-radius:4px;background:transparent;color:#ffffff;font-size:18.5px;cursor:pointer}.message-reaction-picker button:hover{border-color:#2f9dff;background:#1b242f}.message-reaction-picker img{width:24px;height:24px;object-fit:contain}@media(max-width:600px){.support-message-footer{align-items:flex-end}.message-reaction-picker{grid-template-columns:repeat(7,34px);max-width:270px}}
.support-timeout-status{margin:12px 0 0;border:1px solid #a43b50;border-radius:6px;padding:10px 12px;background:#3e1721;color:#ffb1be;font-weight:600}.support-timeout-status[hidden]{display:none}.support-member-timeout{display:block;width:max-content;max-width:100%;margin-bottom:4px;color:#ff7188;font:600 11px var(--sans)}

/* ---- Written for this design ------------------------------------------------------------------ */
/* The ticket is one flat panel; its messages are rows on hairlines, as in the community chat. */
.support-shell { border: 1px solid var(--line); border-radius: 6px; background: #0a0d12; box-shadow: none; }
.support-message { border: 0; border-top: 1px solid var(--line); border-radius: 0; background: none; box-shadow: none; }
.support-message:hover { background: rgba(255, 255, 255, .025); }
.support-composer > .button { align-self: end; }
