.ticket-chat { --tc-bg: var(--paper, #fff); --tc-soft: var(--paper-soft, #f4f6f3); --tc-text: var(--ink, #162016); --tc-muted: var(--ink-2, #536153); --tc-line: var(--line, #d9e1d6); margin-top: 18px; padding: 16px; border: 1px solid var(--tc-line); border-radius: 14px; background: var(--tc-bg); color: var(--tc-text); min-width: 0; }
body.dark .ticket-chat { --tc-bg: #182119; --tc-soft: #222d23; --tc-text: #eef5ec; --tc-muted: #b9c7b6; --tc-line: #3c4b3b; }
.ticket-chat [hidden] { display: none !important; }
.ticket-chat .tc-head { display: flex; position: static; justify-content: space-between; align-items: start; gap: 12px; margin: 0 0 8px; padding: 0; border: 0; min-height: 0; }
.ticket-chat h4 { margin: 0; font-size: 17px; color: var(--tc-text); }
.tc-ticket-status { font-size: 13px; }
.tc-title { font-size: 14px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; margin-bottom: 8px; }
.tc-sync, .tc-form small { display: block; font-size: 12px; color: var(--tc-muted); line-height: 1.5; }
.tc-messages { max-height: 390px; overflow: auto; overscroll-behavior: contain; margin: 12px 0; }
.tc-message { background: var(--tc-soft); border: 1px solid var(--tc-line); border-radius: 10px; padding: 12px; margin-bottom: 10px; }
.tc-message.tc-staff { border-left: 3px solid #48a82c; }
.ticket-chat .tc-message header { display: grid; position: static; gap: 4px; padding: 0; margin: 0 0 8px; min-height: 0; border: 0; }
.tc-message header b { font-size: 14px; color: var(--tc-text); }
.tc-message header span { font-size: 12px; color: var(--tc-muted); }
.tc-message p, .tc-description { font-size: 14px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; margin: 8px 0; color: var(--tc-text); }
.ticket-chat .tc-file, .ticket-chat .tc-older { display: block; background: var(--tc-bg); color: var(--tc-text); border: 1px solid var(--tc-line); border-radius: 8px; padding: 8px 10px; margin-top: 6px; font-size: 13px; cursor: pointer; overflow-wrap: anywhere; max-width: 100%; text-align: left; }
.tc-form { display: grid; gap: 10px; }
.tc-form label { display: grid; gap: 7px; font-size: 13px; color: var(--tc-text); }
.ticket-chat textarea { width: 100%; min-height: 90px; resize: vertical; border: 1px solid var(--tc-line); border-radius: 9px; padding: 10px; background: var(--tc-soft); color: var(--tc-text); font: inherit; }
.ticket-chat input[type="file"] { width: 100%; min-width: 0; font-size: 13px; color: var(--tc-text); }
.ticket-chat .tc-send { justify-self: start; border: 0; border-radius: 9px; background: #258700; color: #fff; padding: 12px 18px; font-weight: 700; cursor: pointer; }
.tc-error { font-size: 13px; color: var(--tc-text); line-height: 1.5; margin: 0; overflow-wrap: anywhere; }
.ticket-chat :focus-visible { outline: 2px solid #4599df; outline-offset: 2px; }
.tc-empty { font-size: 14px; color: var(--tc-muted); line-height: 1.5; }
.tc-file-row,.tc-modes,.tc-work-buttons { display:flex; flex-wrap:wrap; gap:8px; }
.tc-modes button,.tc-work-buttons button { font:inherit; padding:8px 10px; border:1px solid var(--tc-line); border-radius:6px; background:var(--tc-bg); color:var(--tc-text); cursor:pointer; }
.tc-modes button[aria-pressed="true"] { border-color:#369023; box-shadow:inset 0 -2px #369023; }
.tc-visibility { margin:0; font-size:13px; color:var(--tc-muted); }
.tc-message.tc-internal,.tc-internal-form { border-left:3px solid #9866af; }
.tc-selected-files { display:grid; gap:6px; overflow-wrap:anywhere; }
.tc-selected-files span { font-size:13px; }
.tc-selected-files button { color:var(--tc-text); background:var(--tc-bg); border:1px solid var(--tc-line); border-radius:5px; cursor:pointer; padding:3px 6px; }
.tc-drag { outline:2px dashed #369023; outline-offset:3px; }
.tc-preview,.tc-approval { border:1px solid var(--line,#ccd7ca); border-radius:12px; background:var(--paper,#fff); color:var(--ink,#17221d); padding:20px; width:min(1000px,calc(100vw - 24px)); max-height:90dvh; overflow:auto; box-sizing:border-box; }
.tc-preview::backdrop,.tc-approval::backdrop { background:rgb(0 0 0 / 55%); }
.tc-preview header { display:flex; position:static; justify-content:space-between; align-items:center; gap:20px; border:0; padding:0; min-height:0; }
.tc-preview h2 { font-size:18px; overflow-wrap:anywhere; }
.tc-preview button,.tc-approval button { font-size:14px; padding:10px 14px; border:1px solid var(--line,#ccd7ca); border-radius:6px; background:var(--paper-soft,#f4f6f3); color:inherit; cursor:pointer; }
.tc-preview-content { margin:18px 0; }
.tc-preview-content img { display:block; max-width:100%; max-height:65dvh; object-fit:contain; margin:auto; }
.tc-preview-content iframe { width:100%; height:65dvh; border:0; }
.tc-preview-content pre { white-space:pre-wrap; overflow-wrap:anywhere; font-size:14px; }
.tc-preview-download { color:var(--ink,#17221d); }
.tc-works { padding:12px; border:1px solid var(--tc-line); border-radius:8px; margin:12px 0; }
.tc-works summary { cursor:pointer; font-size:14px; font-weight:600; }
.tc-work { padding:14px 0; border-bottom:1px solid var(--tc-line); }
.tc-work h4 { font-size:16px; margin:0 0 8px; }
.tc-work p { white-space:pre-wrap; overflow-wrap:anywhere; font-size:14px; }
.tc-works-error { font-size:13px; }
.tc-approval { width:min(560px,calc(100vw - 24px)); }
.tc-approval form { display:grid; gap:14px; }
.tc-approval h2 { margin:0; font-size:22px; }
.tc-approval h3,.tc-approval p { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; }
.tc-approval label { display:grid; gap:6px; }
.tc-approval textarea { min-height:70px; width:100%; box-sizing:border-box; font:inherit; padding:10px; color:inherit; background:var(--paper-soft,#f4f6f3); border:1px solid var(--line,#ccd7ca); border-radius:6px; }
.tc-approval .tc-approval-confirm { display:flex; gap:10px; align-items:center; }
.tc-approval input[type=checkbox] { width:18px; height:18px; flex:none; }
.tc-approval footer { display:flex; justify-content:flex-end; gap:10px; }