/*
 * ARTIZS.SAY v0.3.8 — Stable Composer + EN/TH + Light/Dark
 * Product rule: capability may grow; complexity must not.
 */

/* Legacy first-join notice is intentionally invisible. The privacy rule stays in the backend. */
.history-marker,
.empty-first-join-note{display:none!important}

/* Utility controls: current theme icon + current language + profile */
.people-utility{
  display:grid!important;
  grid-template-columns:1fr 1fr 1fr;
  align-items:center;
  min-height:52px;
  padding:0 2px 12px!important;
  margin-bottom:14px!important;
  border-bottom:1px solid #EEF2F7;
}
.utility-control{
  width:36px;height:36px;border:0;background:transparent;border-radius:12px;
  display:inline-grid;place-items:center;color:#111827;padding:0;
}
.utility-control:hover{background:#F1F5F9}
.theme-control{justify-self:start}
.language-control{justify-self:center;width:auto;min-width:56px;grid-auto-flow:column;gap:5px;font-size:11px;font-weight:850;color:#111827}
.language-caret{font-size:13px;line-height:1;transform:translateY(-1px)}
.quick-profile{justify-self:end}
.theme-icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Desktop grid rows are explicitly assigned so hiding the topic filter can never move the composer. */
@media (min-width:1200px){
  .chat-panel{
    min-height:0!important;
    height:100dvh!important;
    grid-template-rows:auto auto auto minmax(0,1fr) auto!important;
  }
  .room-meta-strip{grid-row:1}
  .room-cover{grid-row:2}
  .message-filter{grid-row:3}
  .messages{grid-row:4;min-height:0!important;height:auto!important;overflow-y:auto!important}
  .composer-wrap{
    grid-row:5;
    align-self:end;
    width:100%;
    min-height:0;
    flex:0 0 auto!important;
    position:relative!important;
    bottom:auto!important;
  }
}

/* On narrower screens keep the composer anchored as the last flex item. */
@media (max-width:1199px){
  .composer-wrap{position:relative!important;bottom:auto!important;flex:0 0 auto!important;width:100%}
  .messages{min-height:0!important;flex:1 1 auto!important}
}

/* ---------- Dark theme ---------- */
html[data-theme="dark"]{
  color-scheme:dark;
  --ink:#F3F4F6;
  --muted:#98A2B3;
  --line:#252C36;
  --soft:#171D25;
  --panel:#11161D;
  --say-ink:#F3F4F6;
  --say-text:#E5E7EB;
  --say-subtext:#98A2B3;
  --say-border:#29313C;
  --say-bg:#151B23;
}
html[data-theme="dark"] body,
html[data-theme="dark"] .app-shell{background:#0D1117;color:#E5E7EB}
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .people-panel,
html[data-theme="dark"] .chat-panel,
html[data-theme="dark"] .room-meta-strip,
html[data-theme="dark"] .composer-wrap{background:#11161D!important;color:#E5E7EB}
html[data-theme="dark"] .sidebar{border-right-color:#252C36}
html[data-theme="dark"] .people-panel{border-left-color:#252C36}
html[data-theme="dark"] .people-utility,
html[data-theme="dark"] .sidebar-footer,
html[data-theme="dark"] .room-info-card{border-color:#252C36!important}
html[data-theme="dark"] .brand-wordmark,
html[data-theme="dark"] .room-copy strong,
html[data-theme="dark"] .profile-copy strong,
html[data-theme="dark"] .room-meta-title-line h1,
html[data-theme="dark"] .panel-header h2,
html[data-theme="dark"] .room-info-head strong,
html[data-theme="dark"] .welcome-copy strong,
html[data-theme="dark"] .msg-name{color:#F3F4F6!important}
html[data-theme="dark"] .room-copy small,
html[data-theme="dark"] .profile-copy small,
html[data-theme="dark"] .room-meta-copy p,
html[data-theme="dark"] .room-meta-title-line #roomOnline,
html[data-theme="dark"] .panel-online-count,
html[data-theme="dark"] .room-info-card>p,
html[data-theme="dark"] .welcome-copy p,
html[data-theme="dark"] .composer-help{color:#98A2B3!important}
html[data-theme="dark"] .room-search,
html[data-theme="dark"] .room-item,
html[data-theme="dark"] .chip,
html[data-theme="dark"] .room-tags button,
html[data-theme="dark"] .summary-pill{background:#151B23!important;border-color:#29313C!important;color:#C7D0DB!important}
html[data-theme="dark"] .room-search input{color:#E5E7EB!important}
html[data-theme="dark"] .room-item:hover,
html[data-theme="dark"] .profile-chip:hover,
html[data-theme="dark"] .person:hover,
html[data-theme="dark"] .utility-control:hover{background:#1A212B!important}
html[data-theme="dark"] .room-item.active{
  background:#1B2633!important;
  border-color:var(--room-accent,#3B82F6)!important;
  color:#F3F4F6!important;
}
html[data-theme="dark"] .room-item.active .room-copy small{color:#AAB4C2!important}
html[data-theme="dark"] .room-count{background:#222A35!important;color:#C7D0DB!important}
html[data-theme="dark"] .room-item.active .room-count{background:#27313E!important;color:#F3F4F6!important}
html[data-theme="dark"] .message-filter button,
html[data-theme="dark"] .room-tags button.active,
html[data-theme="dark"] .room-tags button:hover{background:#152A46!important;border-color:#315A8A!important;color:#93C5FD!important}
html[data-theme="dark"] .msg-body{background:#18202A!important;color:#E5E7EB!important}
html[data-theme="dark"] .reply-context{background:#151B23!important;color:#AAB4C2!important}
html[data-theme="dark"] .reaction-btn{background:#151B23!important;border-color:#29313C!important;color:#C7D0DB!important}
html[data-theme="dark"] .reaction-btn[data-reaction="like"]{background:#261A20!important;border-color:#49303A!important}
html[data-theme="dark"] .reaction-btn[data-reaction="angry"]{background:#2A2017!important;border-color:#4B3827!important}
html[data-theme="dark"] .composer{
  background:#151B23!important;border-color:#35404D!important;color:#E5E7EB!important;
}
html[data-theme="dark"] .composer:focus-within{border-color:#64748B!important;box-shadow:0 0 0 3px rgba(100,116,139,.16)!important}
html[data-theme="dark"] .composer #messageInput{color:#F3F4F6!important}
html[data-theme="dark"] .composer-icon-btn{color:#AAB4C2!important}
html[data-theme="dark"] .send-btn{background:#E5E7EB!important}
html[data-theme="dark"] .send-btn:after{color:#111827!important}
html[data-theme="dark"] .sticker-popover,
html[data-theme="dark"] .tag-suggestions,
html[data-theme="dark"] .sound-popover,
html[data-theme="dark"] .modal{background:#151B23!important;border-color:#29313C!important;color:#E5E7EB!important}
html[data-theme="dark"] .sticker-btn,
html[data-theme="dark"] .tag-suggestions button{background:#1E2631!important;border-color:#29313C!important;color:#E5E7EB!important}
html[data-theme="dark"] .modal input,
html[data-theme="dark"] .modal select{background:#0F141B!important;border-color:#35404D!important;color:#E5E7EB!important}
html[data-theme="dark"] .modal p,
html[data-theme="dark"] .modal label>span,
html[data-theme="dark"] .field-help{color:#AAB4C2!important}
html[data-theme="dark"] .recognition-box{background:#111820!important;border-color:#29313C!important}
html[data-theme="dark"] .primary-btn{background:#E5E7EB!important;color:#111827!important}
html[data-theme="dark"] .text-btn{color:#AAB4C2!important}
html[data-theme="dark"] .welcome-card{background:linear-gradient(135deg,#151B23 0%,#142033 100%)!important;border-color:#29313C!important}
html[data-theme="dark"] .utility-control,
html[data-theme="dark"] .language-control{color:#F3F4F6!important}
html[data-theme="dark"] .quick-profile:hover{box-shadow:0 0 0 3px #1A212B!important}
html[data-theme="dark"] .message-avatar-presence.is-online:after{border-color:#11161D!important}
html[data-theme="dark"] .presence-wrap:after{border-color:#11161D!important}
html[data-theme="dark"] .toast{background:#F3F4F6!important;color:#111827!important}

/* Cover remains artwork-led in both themes; only the surrounding UI changes. */
html[data-theme="dark"] .room-cover{background-color:#0F172A}
@media (max-width:1199px){
  .people-utility{display:none!important}
}
