/* Tickets module: composer visibility, internal-note marking, relationships. Uses the theme variables from app.css. */
:root { --internal-bg: #F4F1E8; --internal-line: #C9BF9F; }
@media (prefers-color-scheme: dark) { :root { --internal-bg: #2C2A24; --internal-line: #6B6450; } }

/* Composer: unticking "Internal note" turns it into a customer-visible reply */
.composer .composer-internal { font-weight: 600; margin-bottom: .5rem; }
.composer.composer-public { border: 2px solid var(--brand); }
.composer-public-notice { margin: 0 0 .5rem; padding: .35rem .6rem; border-radius: var(--radius); background: var(--warn-bg); color: var(--warn); font-weight: 600; font-size: .9rem; }
.composer.composer-public .btn-primary { background: var(--brand-strong); }

/* Timeline: internal notes are visibly different from what the customer sees */
.entry.entry-note { background: var(--internal-bg); border-left: 3px solid var(--internal-line); }
.tag.tag-internal { background: var(--internal-line); color: var(--ink); }
@media (prefers-color-scheme: dark) { .tag.tag-internal { color: #ECECE8; } }

/* Relationships */
.merged-banner a { font-weight: 700; }
.rel-label { margin: .75rem 0 .25rem; text-transform: uppercase; letter-spacing: .04em; }
.rel-remove { display: inline; margin-left: .25rem; }
.rel-find { margin-top: 1rem; }
.rel-results { list-style: none; margin: .5rem 0; padding: 0; }
.rel-results li { padding: .5rem 0; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: .15rem; }
.rel-results li:last-child { border-bottom: 0; }
.rel-actions { display: flex; flex-wrap: wrap; gap: .25rem .75rem; align-items: center; }
.rel-actions form { display: inline; }
.tickets .subject .rel-badge { margin: .2rem .25rem 0 0; display: inline-block; font-size: .75rem; text-decoration: none; }

/* Ticket header buttons: other modules add theirs through the 'ticket.actions' extension point (e.g. Ask Claude). */
.ticket-head-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: flex-start; }
.ticket-head-actions form { margin: 0; }
