/* Maverrik AI 1.4.5.7 — frontend-only logged-in chat visual refresh.
 * Deliberately scoped to the portal chat shell. No auth, admin form, AI or
 * persistent workflow behaviour is changed by this stylesheet. */

/* Restrained ambient layers match the login design without using huge images. */
#chat-container {
  --mp-bg: #f5f8fd;
  --mp-panel: rgba(255,255,255,.96);
  --mp-line: #dfe8f5;
  --mp-text: #20334e;
  --mp-muted: #6c7f9b;
  --mp-shadow: 0 12px 32px rgba(32,69,119,.055);
  background: #f5f8fd;
  isolation: isolate;
}
.dark #chat-container {
  --mp-bg: #080f20;
  --mp-panel: #111e34;
  --mp-line: #263b58;
  --mp-text: #eaf1ff;
  --mp-muted: #9badc9;
  --mp-shadow: 0 12px 35px rgba(0,0,0,.15);
  background: #080f20;
}
#chat-container #messages {
  background-color: var(--mp-bg);
  background-image:
    radial-gradient(ellipse 540px 330px at 80% 2%,rgba(24,130,255,.075),transparent 75%),
    radial-gradient(ellipse 460px 350px at 13% 97%,rgba(77,156,247,.055),transparent 73%);
  scroll-padding-block: 20px;
}
.dark #chat-container #messages {
  background-image:
    radial-gradient(ellipse 680px 400px at 75% -6%,rgba(17,104,230,.095),transparent 76%),
    radial-gradient(ellipse 500px 360px at 8% 100%,rgba(30,91,176,.08),transparent 78%);
}

/* Active agent: a single, compact navigation strip above the conversation. */
#chat-container .mav-portal-agent-header {
  display: flex; align-items: center; min-height: 72px; flex: 0 0 auto;
  gap: 13px; padding: 12px 26px;
  background: rgba(255,255,255,.93);
  border-bottom: 1px solid var(--mp-line);
  box-shadow: 0 1px 0 rgba(255,255,255,.52) inset;
  color: var(--mp-text);
  position: relative; z-index: 2;
}
.dark #chat-container .mav-portal-agent-header {
  background: rgba(14,25,44,.96);
  box-shadow: 0 1px 0 rgba(117,165,234,.055) inset;
}
#chat-container .mav-portal-agent-header::after {
  content: ''; position:absolute; bottom: -1px; left: 0; width: min(210px,40%);
  height: 1px; pointer-events: none;
  background: linear-gradient(90deg,rgba(23,125,249,.75),rgba(23,125,249,0));
}
#chat-container .mav-portal-agent-avatar {
  display: grid; flex: 0 0 40px; place-items:center;
  width:40px;height:40px; border-radius:12px;
  background:linear-gradient(145deg,#e9f2ff,#d7e9ff);
  color:#156dd9; border:1px solid #cbe0f9;
  box-shadow: 0 5px 14px rgba(17,105,220,.07);
}
.dark #chat-container .mav-portal-agent-avatar {
  background:linear-gradient(145deg,#1e467a,#143256);
  color:#a0d1ff;border-color:#325b87;
  box-shadow:0 5px 18px rgba(0,0,0,.16);
}
#chat-container .mav-portal-agent-avatar svg {width:20px;height:20px;}
#chat-container .mav-portal-agent-avatar[data-kind="strategy"] {color:#116bcb;}
#chat-container .mav-portal-agent-avatar[data-kind="research"] {color:#067d8a;}
#chat-container .mav-portal-agent-avatar[data-kind="code"] {color:#6856c5;}
#chat-container .mav-portal-agent-avatar[data-kind="writing"] {color:#9d5cbd;}
.dark #chat-container .mav-portal-agent-avatar[data-kind] {color:#b4dfff;}
#chat-container .mav-portal-header-copy {display:flex;flex-direction:column;min-width:0;flex:1;gap:2px;}
#chat-container .mav-portal-header-eyebrow {
  font:700 9px/1.25 'JetBrains Mono',monospace;
  letter-spacing:.11em;color:#267de2;
}
.dark #chat-container .mav-portal-header-eyebrow {color:#7fbaff;}
#chat-container #mav-portal-agent-name {
  font-size:14px;font-weight:800;letter-spacing:-.025em;
  line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  color:var(--mp-text);
}
#chat-container #mav-portal-agent-description {
  font-size:11px;line-height:1.35;color:var(--mp-muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:650px;
}
#chat-container .mav-portal-header-new {
  display:inline-flex;align-items:center;justify-content:center;gap:9px;flex:0 0 auto;
  padding:9px 13px;border-radius:10px;
  border:1px solid #c8dcf6;background:#edf5ff;color:#126bc8;
  font-weight:750;font-size:12px;cursor:pointer;
  transition: background .15s,border-color .15s,transform .15s;
}
#chat-container .mav-portal-header-new:hover {background:#dcecff;border-color:#8dc0f8;transform:translateY(-1px);}
.dark #chat-container .mav-portal-header-new {background:#152f51;border-color:#31557d;color:#b8dcff;}
.dark #chat-container .mav-portal-header-new:hover {background:#1d406a;border-color:#4c86bc;}
#chat-container .mav-portal-header-new:focus-visible,
#chat-container .mav-portal-mobile-menu:focus-visible {outline:2px solid #1882ff;outline-offset:2px;}
@media (min-width:768px) {
  /* A collapsed sidebar owns the leftmost 48px; do not conceal the header. */
  #app-view.sidebar-is-collapsed #chat-container .mav-portal-agent-header {padding-left:66px;}
  #app-view.sidebar-is-collapsed > main > #sidebar-expand-btn {
    top:17px;left:15px;border-radius:11px;
  }
}
@media (max-width:767px) {
  #chat-container .mav-portal-agent-header {min-height:61px;padding:9px 12px;gap:10px;}
  #chat-container .mav-portal-mobile-menu {
    display:grid;flex:0 0 35px;place-items:center;align-self:center;
    width:35px;height:35px;border:1px solid var(--mp-line);border-radius:10px;
    color:var(--mp-muted);background:var(--mp-panel);cursor:pointer;
  }
  #chat-container .mav-portal-agent-avatar {flex-basis:34px;width:34px;height:34px;border-radius:11px;}
  #chat-container .mav-portal-agent-avatar svg {width:17px;height:17px;}
  #chat-container .mav-portal-header-eyebrow {font-size:8px;}
  #chat-container #mav-portal-agent-name {font-size:12.5px;}
  #chat-container #mav-portal-agent-description {display:none;}
  #chat-container .mav-portal-header-new {padding:8px;border-radius:10px;min-width:35px;height:35px;}
  #chat-container .mav-portal-header-new span {display:none;}
}
@media (max-width:360px) {
  #chat-container .mav-portal-agent-avatar {display:none;}
  #chat-container .mav-portal-agent-header {gap:8px;}
}

/* Sidebar: recognizable agent navigation and softer, more deliberate geometry. */
#sidebar {background:#fbfdff;border-right:1px solid #dfe8f3;}
.dark #sidebar {background:#0e192e;border-right-color:#263853;}
#sidebar .mav-sidebar-header {padding-top:18px;}
#sidebar .mav-sidebar-new-chat {
  min-height:43px;border-radius:11px;
  background:linear-gradient(120deg,#136fe9,#188bff);
  box-shadow:0 6px 17px rgba(19,111,233,.2);
}
#sidebar .mav-sidebar-new-chat:hover {background:linear-gradient(120deg,#0867da,#0d7eeb);}
#sidebar .mav-sidebar-section-heading {letter-spacing:.11em;}
#sidebar .mav-sidebar-agents {gap:5px;}
#sidebar .mav-sidebar-agents > button.mav-portal-agent-item {
  display:flex;align-items:center;justify-content:initial;gap:8px;
  min-height:43px;padding:6px 8px;border-radius:11px;
  font-size:12px;letter-spacing:-.01em;
}
#sidebar .mav-portal-agent-item-icon {
  flex:0 0 29px;display:grid;place-items:center;
  width:29px;height:29px;border-radius:9px;
  color:#256fbd;background:#edf5ff;border:1px solid #e0ecfa;
}
.dark #sidebar .mav-portal-agent-item-icon {background:#203652;color:#a2cffa;border-color:#315074;}
#sidebar .mav-portal-agent-item-icon svg {width:16px;height:16px;}
#sidebar .mav-portal-agent-item-icon[data-kind="research"] {color:#007b8f;}
#sidebar .mav-portal-agent-item-icon[data-kind="strategy"] {color:#1d69b9;}
#sidebar .mav-portal-agent-item-icon[data-kind="code"] {color:#6c54c6;}
#sidebar .mav-portal-agent-item-icon[data-kind="writing"] {color:#9a5fba;}
.dark #sidebar .mav-portal-agent-item-icon[data-kind] {color:#a4d3ff;}
#sidebar .mav-portal-agent-item[aria-current="true"] .mav-portal-agent-item-icon {
  background:rgba(255,255,255,.19);color:#fff;border-color:rgba(255,255,255,.25);
}
#sidebar .mav-portal-agent-item-name {flex:1;min-width:0;text-align:left;line-height:1.3;}
#sidebar .mav-portal-agent-search-indicator {flex:0 0 auto;font-size:11px;}
#sidebar .mav-portal-agent-item-model {font-size:10px;max-width:77px;overflow:hidden;text-overflow:ellipsis;}
#sidebar .mav-sidebar-search {height:39px;border-radius:11px;background:#fff;}
.dark #sidebar .mav-sidebar-search {background:#0a1528;}
#sidebar .mav-thread-row {border-radius:11px;}
#sidebar .mav-thread-row.is-active {box-shadow:inset 3px 0 0 #1882ff;}
#sidebar .mav-sidebar-footer {background:#f5f9ff;}
.dark #sidebar .mav-sidebar-footer {background:#101e35;}

/* Conversation message cards — clear contrast and a readable rhythm. */
#chat-container #messages {padding-top:24px;padding-bottom:26px;}
#chat-container #messages > div {max-width:56rem;}
#chat-container #messages .mav-answer-surface {
  border-radius:17px;
  background:var(--mp-panel);
  border-color:var(--mp-line);
  box-shadow:var(--mp-shadow);
  padding:19px 21px;
  color:var(--mp-text);
}
#chat-container #messages .mav-answer-surface > div:first-child {
  padding-bottom:12px;margin-bottom:14px;
  border-bottom-color:var(--mp-line);
}
#chat-container .mav-answer-surface .markdown-body {font-size:15.5px;line-height:1.78;}
#chat-container .mav-answer-surface .markdown-body p {margin-bottom:1rem;}
#chat-container .mav-answer-surface .markdown-body h2 {letter-spacing:-.025em;}
#chat-container #messages .user-prompt-card {
  border:1px solid rgba(255,255,255,.18);
  border-radius:15px 15px 4px 15px;
  background:linear-gradient(138deg,#1678f3,#0870e5);
  box-shadow:0 9px 24px rgba(24,130,255,.14);
}
#chat-container .mav-message-row > .mav-followups {
  border-radius:15px;border-color:#d4e5fb;
  background:rgba(241,247,255,.94);
  box-shadow:0 7px 20px rgba(35,92,162,.05);
}
.dark #chat-container .mav-message-row > .mav-followups {
  border-color:#2b486d;background:#101e35;
  box-shadow:0 10px 24px rgba(0,0,0,.11);
}
#chat-container .mav-followups-label {font-size:13px;letter-spacing:-.015em;}
#chat-container .mav-followups-hint {font-size:11.5px;}

/* Agent splash screen: cohesive with the login without overpowering the work. */
#chat-container .mav-agent-welcome {width:min(100%,715px);margin:clamp(18px,6vh,66px) auto 34px;}
#chat-container .mav-agent-hero-symbol {
  width:61px;height:61px;border-radius:19px;
  background:linear-gradient(145deg,#0969d6,#31a5ff);
  border:1px solid #6cb9ff;
  box-shadow:0 0 0 8px rgba(24,130,255,.045),0 13px 30px rgba(24,130,255,.17);
}
.dark #chat-container .mav-agent-hero-symbol {box-shadow:0 0 0 8px rgba(24,130,255,.05),0 15px 32px rgba(0,0,0,.24);}
#chat-container .mav-agent-hero-kicker {letter-spacing:.13em;}
#chat-container .mav-agent-welcome-main {
  background:var(--mp-panel);border-color:var(--mp-line);
  border-radius:20px;padding:25px;
  box-shadow:0 15px 43px rgba(25,67,124,.075);
}
.dark #chat-container .mav-agent-welcome-main {box-shadow:0 18px 43px rgba(0,0,0,.19);}
#chat-container .mav-agent-starter {
  background:rgba(245,249,255,.92);border-color:#dce7f7;
  border-radius:12px;min-height:49px;font-size:13px;padding:13px 15px;
}
#chat-container .mav-agent-starter:hover {border-color:#8cbdff;background:#eaf3ff;}
.dark #chat-container .mav-agent-starter {background:#192a45;border-color:#345070;color:#ebf4ff;}
.dark #chat-container .mav-agent-starter:hover {background:#223a5d;border-color:#558fd3;}
#chat-container .mav-agent-welcome-hint {margin-top:17px;}

/* Composer: one cohesive, anchored dock with comfortable targets. */
#chat-container .mav-portal-composer-dock {
  position:relative;z-index:2;flex:0 0 auto;
  background:rgba(252,254,255,.96);
  border-top:1px solid var(--mp-line);
  box-shadow:0 -8px 32px rgba(26,69,122,.045);
}
.dark #chat-container .mav-portal-composer-dock {
  background:rgba(11,21,39,.97);
  box-shadow:0 -12px 34px rgba(0,0,0,.14);
}
#chat-container .mav-portal-composer-inner {max-width:56rem;}
#chat-container .mav-portal-compose-row {gap:10px;}
#chat-container #user-input.mav-chat-composer {
  border-radius:14px;background:#fff;border-color:#cdddf0;
  box-shadow:0 2px 10px rgba(27,63,105,.035);
  color:#233752;line-height:1.55;
}
.dark #chat-container #user-input.mav-chat-composer {
  background:#0a1528;border-color:#344862;color:#e9f3ff;
  box-shadow:0 3px 16px rgba(0,0,0,.09);
}
#chat-container #user-input.mav-chat-composer:focus {
  border-color:#2489ff;box-shadow:0 0 0 3px rgba(24,130,255,.13);
}
#chat-container #btn-attach-file {
  border-radius:13px;background:#f2f7fe;border-color:#d3e0f2;
  width:49px;height:49px;padding:12px;display:grid;place-items:center;
}
.dark #chat-container #btn-attach-file {background:#111e32;border-color:#344862;}
#chat-container #send-btn {
  border-radius:13px;min-height:49px;
  padding:12px 23px;text-transform:none;letter-spacing:0;
  font-size:13px;font-weight:800;
  background:linear-gradient(130deg,#1578f2,#0d73e8);
  box-shadow:0 7px 17px rgba(17,108,220,.17);
}
#chat-container #send-btn:hover {background:linear-gradient(130deg,#096de5,#0768d8);}
#chat-container #send-btn:focus-visible, #chat-container #btn-attach-file:focus-visible {outline:2px solid #1882ff;outline-offset:2px;}
#chat-container .mav-portal-composer-dock p {font-size:10px;}

@media (max-width:767px) {
  #chat-container #messages {padding:15px 12px 21px;}
  #chat-container #messages .mav-answer-surface {padding:15px 14px;border-radius:15px;}
  #chat-container .mav-answer-surface .markdown-body {font-size:15px;line-height:1.69;}
  #chat-container .mav-portal-composer-dock {padding:10px 10px 12px;}
  #chat-container #btn-attach-file {width:43px;height:45px;}
  #chat-container #send-btn {min-height:45px;padding:10px 15px;font-size:12px;}
  #chat-container #user-input.mav-chat-composer {min-height:45px;padding:11px 12px;font-size:16px;}
  #chat-container .mav-agent-welcome {margin:24px auto 26px;}
  #chat-container .mav-agent-welcome-main {padding:18px 16px;}
  #chat-container .mav-agent-hero-symbol {width:52px;height:52px;}
  #chat-container .mav-agent-hero-description {font-size:12.5px;}
  #chat-container .mav-agent-starter {font-size:12.5px;padding:12px;min-height:44px;}
}
@media (prefers-reduced-motion:reduce) {
  #chat-container .mav-portal-header-new,
  #chat-container .mav-agent-starter {transition:none;transform:none!important;}
}