/* Mimshack chat widget. Brand colours with fallbacks if theme tokens are absent. */
.ms-chat{ --c-blue: var(--ms-color-primary-blue, #0B5ED7); --c-navy: var(--ms-color-deep-navy, #1F2937); --c-gold: var(--ms-color-gold-accent, #F4B000); --c-border: var(--ms-color-border, #E3E7F0); --c-muted: var(--ms-color-text-muted, #5B6478); font-family: inherit; }
.ms-chat__launch{ position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 950; display:inline-flex; align-items:center; gap:8px; padding: 12px 18px; border:none; border-radius: 999px; background: var(--c-blue); color:#fff; font-family: inherit; font-weight: 600; font-size: 0.95rem; line-height: 1; cursor:pointer; box-shadow: 0 10px 26px rgba(11,23,48,0.28); }
.ms-chat__launch:hover{ background: var(--c-navy); }
.ms-chat__launch:focus-visible, .ms-chat button:focus-visible, .ms-chat a:focus-visible, .ms-chat input:focus-visible, .ms-chat textarea:focus-visible{ outline: 3px solid var(--c-gold); outline-offset: 2px; }
.ms-chat__panel{ position: fixed; right: 20px; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); z-index: 960; width: min(380px, calc(100vw - 40px)); max-height: calc(100vh - 120px); overflow-y: auto; background:#fff; border:1px solid var(--c-border); border-radius: 14px; box-shadow: 0 18px 40px rgba(11,23,48,0.25); padding: 18px; color: var(--c-navy); }
.ms-chat__panel[hidden]{ display:none; }
.ms-chat__head{ display:flex; align-items:center; justify-content:space-between; }
.ms-chat__head h2{ margin:0; font-size:1.1rem; color: var(--c-navy); }
.ms-chat__close{ background:none; border:none; font-size:1.6rem; line-height:1; cursor:pointer; color: var(--c-muted); padding: 0 4px; }
.ms-chat__intro{ margin: 6px 0 10px; font-size: 0.88rem; color: var(--c-muted); }
.ms-chat__whatsapp{ display:block; text-align:center; padding: 10px; border-radius: 8px; background: #25D366; color:#fff; font-weight:600; text-decoration:none; font-size:0.92rem; margin-bottom: 12px; }
.ms-chat__form{ display:flex; flex-direction:column; gap: 10px; }
.ms-chat__field{ display:flex; flex-direction:column; gap: 4px; font-size: 0.86rem; }
.ms-chat__field span{ font-weight:600; }
.ms-chat__field input, .ms-chat__field textarea{ font: inherit; padding: 8px 10px; border:1px solid var(--c-border); border-radius: 8px; }
.ms-chat__tools{ display:flex; flex-wrap:wrap; gap: 8px; }
.ms-chat__tool{ position:relative; display:inline-flex; align-items:center; padding: 7px 11px; border:1px solid var(--c-border); border-radius: 8px; background:#F5F7FB; color: var(--c-navy); font-size:0.82rem; cursor:pointer; font-family: inherit; font-size:0.82rem; }
.ms-chat__tool input[type=file]{ position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; }
.ms-chat__voice[aria-pressed=true]{ background: #FDECEC; border-color:#B42828; color:#7A1B1B; }
.ms-chat__items{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; font-size:0.82rem; }
.ms-chat__items li{ display:flex; justify-content:space-between; gap:8px; align-items:center; padding: 6px 8px; background:#F5F7FB; border-radius:6px; }
.ms-chat__remove{ background:none; border:none; color: var(--c-blue); cursor:pointer; font: inherit; font-size:0.8rem; }
.ms-chat__consent{ display:flex; gap:8px; font-size:0.8rem; color: var(--c-muted); align-items:flex-start; }
.ms-chat__send{ padding: 11px; border:none; border-radius: 8px; background: var(--c-blue); color:#fff; font-family: inherit; font-weight: 600; font-size: 0.95rem; cursor:pointer; }
.ms-chat__send:disabled{ opacity:0.6; cursor:not-allowed; }
.ms-chat__status{ margin:0; font-size:0.85rem; min-height: 1.2em; color: var(--c-navy); }
.ms-chat__status.is-error{ color:#7A1B1B; }
.ms-chat__honeypot{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
@media (max-width: 480px){
  .ms-chat__panel{ right: 10px; left: 10px; width: auto; }
}
@media (prefers-reduced-motion: reduce){ .ms-chat *{ transition:none !important; } }

/* Phones: the chat launcher becomes an icon-only circle so it stops covering content.
   The label stays available to screen readers. */
@media (max-width: 480px){
  .ms-chat__launch{ width:56px; height:56px; padding:0; justify-content:center; border-radius:50%; font-size:1.3rem; }
  .ms-chat__launch > span:last-child{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
}
