/**
 * Assistant shell — shared responsive layout contract for all live chat assistants.
 * Skins (colors, branding) live in product-specific CSS (gusi_assistant.css, panel_gm.css, etc.).
 *
 * Breakpoint: 1100px — below = single column; at/above = two columns when summary present.
 * Viewport: --gm-asst-vh set by assistant_shell.js (visualViewport fallback to 100dvh).
 */

:root {
  --gm-asst-bp: 1100px;
  --gm-asst-vh: 100dvh;
  --gm-asst-vh-stable: 100svh;
  --gm-asst-touch-min: min(44px, 12vmin);
  --gm-asst-gap: clamp(0.65rem, 2vw, 1rem);
  --gm-asst-summary-min: 16rem;
  --gm-asst-summary-max: 22rem;
}

/* ── Root shell ─────────────────────────────────────────────── */

.gm-asst,
.gusi-assistant.gm-asst {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}

.gm-asst *,
.gm-asst *::before,
.gm-asst *::after {
  box-sizing: border-box;
}

/* Page variant: fills remaining viewport in portal/staff pages */
.gm-asst--page,
.gusi-assistant.gusi-layout-page.gm-asst--page {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}

/* Embed variant: bounded by parent tab/panel */
.gm-asst--embed,
.gusi-assistant.gusi-layout-embed.gm-asst--embed {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  max-height: min(var(--gm-asst-vh, 100dvh), 100%);
}

/* Float variant: fixed panel (consult widget, staff float) */
.gm-asst--float {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: min(32rem, calc(var(--gm-asst-vh, 100dvh) - 6rem));
}

/* ── Context bar (pedido, staff, CEO) ───────────────────────── */

.gm-asst__context {
  flex-shrink: 0;
  min-width: 0;
}

/* ── Main workspace ─────────────────────────────────────────── */

.gm-asst__main,
.gusi-assistant-layout.gm-asst__main {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  gap: var(--gm-asst-gap);
  width: 100%;
}

@media (min-width: 1100px) {
  .gm-asst__main--split,
  .gusi-assistant-layout.gm-asst__main--split {
    display: grid;
    grid-template-columns: minmax(var(--gm-asst-summary-min), var(--gm-asst-summary-max)) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    align-items: stretch;
  }
}

/* ── Summary column ─────────────────────────────────────────── */

.gm-asst__summary,
.gusi-summary-col.gm-asst__summary {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}

/* Mobile/tablet: accordion (summary collapsible, chat always visible) */
@media (max-width: 1099.98px) {
  .gm-asst__summary--accordion .gm-asst__summary-toggle {
    display: flex;
  }

  .gm-asst__summary--accordion .gm-asst__summary-body-wrap:not(.is-open) {
    display: none;
  }

  .gm-asst__summary--accordion .gm-asst__summary-body-wrap.is-open {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    min-height: 0;
    max-height: min(58dvh, 34rem);
    overflow: hidden;
  }

  /* Legacy tab-hidden: never hide chat on stacked layout */
  .gm-asst__main--stacked .gm-asst__panel.gm-asst__panel--chat,
  .gm-asst__main--stacked .gusi-chat-col,
  .gm-asst__main--stacked .gusi-chat-col.gusi-tab-hidden {
    display: flex !important;
    order: 1;
    flex: 1 1 auto;
    min-height: min(52dvh, calc(var(--gm-asst-vh, 100dvh) - 13rem));
  }

  .gm-asst__main--stacked .gusi-summary-col.gusi-tab-hidden {
    display: flex !important;
  }

  .gm-asst__main--stacked .gusi-summary-col {
    order: 2;
    flex: 0 0 auto;
  }

  .gm-asst__main--stacked .gm-asst__summary--accordion .gm-asst__summary-body-wrap.is-open {
    max-height: min(38dvh, 26rem);
  }
}

@media (min-width: 1100px) {
  .gm-asst__summary-toggle {
    display: none;
  }

  .gm-asst__summary-body-wrap {
    display: flex !important;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
  }

  .gm-asst__summary,
  .gusi-summary-col.gm-asst__summary {
    min-height: 0;
    height: 100%;
  }

  .gusi-summary-card.gm-asst__panel-card {
    flex: 1 1 auto;
    min-height: 0;
  }
}

.gm-asst__summary-toggle {
  display: none;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0.5rem;
  background: rgba(255, 255, 255, 0.04);
  color: inherit;
  font-weight: 600;
  font-size: clamp(0.85rem, 2.2vw, 1rem);
  cursor: pointer;
  text-align: left;
  min-height: var(--gm-asst-touch-min);
}

.gm-asst__summary-toggle-chevron {
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.gm-asst__summary-toggle[aria-expanded="true"] .gm-asst__summary-toggle-chevron {
  transform: rotate(180deg);
}

/* ── Assistant panel (chat column) ──────────────────────────── */

.gm-asst__panel,
.gusi-chat-col.gm-asst__panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}

.gm-asst__panel-card,
.gusi-chat-card.gm-asst__panel-card,
.gusi-summary-card.gm-asst__panel-card {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  width: 100%;
  overflow: hidden;
}

.gm-asst__panel-header,
.gusi-panel-header.gm-asst__panel-header {
  flex-shrink: 0;
  min-width: 0;
}

.gm-asst__panel-body,
.gusi-panel-body.gm-asst__panel-body,
.chat-panel-body.gm-asst__panel-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
}

/* ── Conversation thread (scroll zone) ─────────────────────── */

.gm-asst__thread,
.gusi-chat-scroll.gm-asst__thread,
.chat-messages-wrap.gm-asst__thread,
.gm-float-gusi-messages-wrap.gm-asst__thread,
.chat-marketing-scroll.gm-asst__thread {
  flex: 1 1 auto;
  min-height: min(14rem, 32dvh);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.gm-asst__thread-hint,
.gusi-chat-intro-wrap.gm-asst__thread-hint {
  flex-shrink: 0;
  min-width: 0;
}

.gm-asst__thread-inner,
.gusi-chat-messages.gm-asst__thread-inner,
.gm-float-gusi-messages.gm-asst__thread-inner,
#agentMessages.chat-messages.gm-asst__thread-inner {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
}

/* ── Secondary blocks (files, pending) ──────────────────────── */

.gm-asst__secondary,
.gusi-files-panel.gm-asst__secondary {
  flex-shrink: 1;
  min-height: 0;
  min-width: 0;
  max-height: min(28vh, 14rem);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.gm-asst__secondary--collapsed:not(.is-open) .gm-asst__secondary-body {
  display: none;
}

.gm-asst__secondary-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.5rem 0.65rem;
  border: none;
  border-radius: 0.375rem;
  background: rgba(255, 255, 255, 0.05);
  color: inherit;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  min-height: 2.25rem;
}

/* ── Composer (always visible, never sticky hack) ───────────── */

.gm-asst__composer,
.gusi-composer.gm-asst__composer,
.gm-asst__composer-zone,
.gusi-chat-foot.gm-asst__composer-zone,
.chat-marketing-input-zone.gm-asst__composer-zone,
.gm-float-gusi-input-row.gm-asst__composer {
  flex-shrink: 0;
  min-width: 0;
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

.gm-asst__composer .gm-asst__input-wrap,
.gusi-input-wrap.gm-asst__input-wrap,
.chat-input-wrap.gm-asst__input-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.65rem;
  min-width: 0;
  width: 100%;
}

.gm-asst__composer textarea,
.gm-asst__composer .form-control,
.gusi-chat-input.gm-asst__input,
.gm-float-gusi-input.gm-asst__input {
  flex: 1 1 12rem;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  min-height: 2.75rem;
  max-height: 14rem;
  resize: vertical;
}

.gm-asst__composer .gm-btn-primary,
.gm-asst__composer #gusiBtnSend,
.gm-asst__composer #agentSend,
.gm-float-gusi-send {
  flex: 0 0 auto;
  min-height: var(--gm-asst-touch-min);
}

@media (max-width: 767.98px) {
  .gm-asst__composer .gm-asst__input-wrap,
  .gusi-input-wrap.gm-asst__input-wrap {
    flex-direction: column;
    align-items: stretch;
  }

  .gm-asst__composer .gm-btn-primary,
  .gm-asst__composer #gusiBtnSend {
    width: 100%;
  }
}

/* ── Summary scroll ─────────────────────────────────────────── */

.gm-asst__summary-body-wrap,
.gusi-summary-body-wrap {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
}

.gm-asst__summary-scroll,
.gusi-summary-scroll.gm-asst__summary-scroll {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: min(12rem, 28dvh);
  overflow: hidden;
}

.gm-asst__summary-body,
.gusi-summary-body.gm-asst__summary-body {
  flex: 1 1 auto;
  min-height: min(10rem, 24dvh);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.gm-asst__summary-footer,
.gusi-summary-footer.gm-asst__summary-footer {
  flex-shrink: 0;
}

/* ── Float panel (staff CEO / marketing) ────────────────────── */

.chat-float-panel.gm-asst--float-panel {
  display: none;
  flex-direction: column;
  position: fixed;
  bottom: 5.5rem;
  right: 1.5rem;
  z-index: 1000;
  width: min(24rem, calc(100vw - 2rem));
  max-height: min(32rem, calc(var(--gm-asst-vh, 100dvh) - 7rem));
  overflow: hidden;
  border-radius: 12px;
}

.chat-float-panel.gm-asst--float-panel.is-open,
.chat-float-panel.gm-asst--float-panel[aria-hidden="false"] {
  display: flex;
}

.chat-float-panel--embedded.gm-asst--page-panel {
  position: static !important;
  display: flex !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  flex: 1 1 auto;
  min-height: 0;
  bottom: auto !important;
  right: auto !important;
  z-index: 1 !important;
  margin: 0;
}

body.page-gusi-ceo .chat-float-panel--embedded.gm-asst--page-panel {
  min-height: min(calc(var(--gm-asst-vh, 100dvh) - 12rem), 100%);
}

/* ── Portal assistant page shell ────────────────────────────── */

body.portal-assistant-page {
  min-height: var(--gm-asst-vh-stable, 100svh);
  height: var(--gm-asst-vh, 100dvh);
  max-height: var(--gm-asst-vh, 100dvh);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

body.portal-assistant-page .portal-header,
body.portal-assistant-page #portal-efemerides-bar {
  flex-shrink: 0;
}

body.portal-assistant-page main.container.portal-assistant-main {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
  overflow: hidden;
  max-width: 100%;
}

body.portal-assistant-page .portal-assistant-workspace {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

body.portal-assistant-page .portal-assistant-workspace > .gusi-assistant {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

body.portal-assistant-page #gusiAssistantMain {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

body.portal-assistant-page .gusi-chat-col {
  min-height: 0;
}

body.portal-assistant-page #gusiChatScroll {
  min-height: min(16rem, 38dvh);
}

body.portal-assistant-page .gusi-staff-context-bar,
body.portal-assistant-page .gusi-login-banner,
body.portal-assistant-page .gusi-mis-pedidos-cta,
body.portal-assistant-page .gusi-pedido-bar {
  flex-shrink: 0;
}

body.portal-assistant-page .gusi-page-intro {
  flex-shrink: 0;
  margin-bottom: 0.5rem !important;
}

body.portal-assistant-page .gusi-page-intro .h4 {
  font-size: clamp(1rem, 2.5vw, 1.25rem);
  margin-bottom: 0.25rem !important;
}

body.portal-assistant-page .gusi-page-intro .small {
  margin-bottom: 0.25rem !important;
}

body.portal-assistant-page .portal-footer {
  flex-shrink: 0;
  display: none;
}

body.portal-assistant-page .gm-mobile-nav {
  flex-shrink: 0;
}

@media (max-width: 1099.98px) {
  body.portal-assistant-page .portal-header .portal-header-subtitle,
  body.portal-assistant-page #portal-efemerides-bar {
    display: none;
  }

  body.portal-assistant-page .portal-header {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
  }

  body.portal-assistant-page .gusi-page-intro {
    display: none;
  }

  body.portal-assistant-page .gusi-canva-guide {
    display: none;
  }

  body.portal-assistant-page .gusi-chat-intro {
    margin-bottom: 0;
    font-size: 0.8125rem;
    line-height: 1.35;
  }

  body.portal-assistant-page .gusi-chat-intro-wrap {
    padding: 0 0.15rem 0.35rem;
  }

  body.portal-assistant-page .gusi-chat-usage {
    margin-bottom: 0.35rem !important;
  }

  body.portal-assistant-page .gusi-chat-usage .small {
    font-size: 0.75rem;
  }
}

@media (max-width: 767.98px) {
  body.portal-assistant-page.gm-has-mobile-nav {
    padding-bottom: 0;
  }

  body.portal-assistant-page.gm-has-mobile-nav .gusi-composer,
  body.portal-assistant-page.gm-has-mobile-nav .gm-asst__composer {
    padding-bottom: calc(3.25rem + env(safe-area-inset-bottom, 0px));
  }

  body.portal-assistant-page .gusi-page-intro {
    display: none;
  }
}

/* Hide legacy mobile tabs when using accordion */
.gm-asst--accordion .gusi-mobile-tabs {
  display: none !important;
}

/* Action buttons wrap (Gusi summary uses its own grid in gusi_assistant.css) */
.gm-asst__actions:not(.gusi-summary-actions) {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-width: 0;
}

.gm-asst__actions:not(.gusi-summary-actions) .gm-btn {
  flex: 1 1 auto;
  min-width: min(100%, 8rem);
}

/* Float trigger buttons (CEO, marketing) */
.chat-float-btn {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 1001;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  border: none;
  padding: 0;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  background: #fff;
  overflow: hidden;
}

.chat-float-btn img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.page-gusi-ceo .chat-float-btn {
  display: none !important;
}

/* CEO chat panel body — thread scroll */
.chat-float-panel--ceo .ceo-chat-thread,
.chat-float-panel--ceo .gm-asst__thread {
  flex: 1 1 auto;
  min-height: 0;
}

.chat-float-panel--ceo .chat-intro,
.chat-float-panel--ceo .chat-usage-header {
  flex-shrink: 0;
}

.chat-float-panel--marketing .chat-marketing-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}

.chat-float-panel--marketing .chat-marketing-input-zone {
  flex-shrink: 0;
}

.gusi-layout-embed .gm-quote-tab-panel[data-panel="gusi"] {
  display: flex;
  flex-direction: column;
  min-height: min(50dvh, 28rem);
  min-width: 0;
}

.gm-asst__summary-toggle {
  color: var(--gusi-text, #f0f0f0);
  border-color: rgba(230, 82, 151, 0.35);
  background: rgba(0, 0, 0, 0.25);
}

.gm-asst__secondary-toggle {
  color: var(--gusi-text, #f0f0f0);
}

@media (min-width: 1100px) {
  .gm-asst__summary-body-wrap {
    display: flex !important;
  }
}

@media (max-width: 575.98px) {
  .gm-asst__actions:not(.gusi-summary-actions) {
    flex-direction: column;
  }

  .gm-asst__actions:not(.gusi-summary-actions) .gm-btn {
    width: 100%;
  }
}