/* Matanya Chat: כל הכללים תחת .mchat כדי לא להתנגש בעיצוב האתר */
.mchat, .mchat * { box-sizing: border-box; }
.mchat {
  /* צבעי מותג מתניה (נמדדו מהאתר): כחול כהה #14213D, בז' #F2EFEC, זהב מהמוצרים, גופן Heebo וכותרות Dida */
  --mc-brand: #14213d;
  --mc-brand-dark: #0b1630;
  --mc-accent: #c9a24b;
  --mc-bg: #ffffff;
  --mc-text: #1b2335;
  --mc-muted: #6b7280;
  --mc-bot: #f2efec;
  --mc-line: #e2ddd6;
  --mc-blue-soft: #3d5a8a;   /* כחול בהיר יותר (משני) לקישורים */
  --mc-highlight: #f5b800;  /* צהוב להדגשה (תג תצוגת מנהלים) */
  font-family: "Heebo", "Assistant", "Segoe UI", Arial, sans-serif;
  position: fixed; bottom: 20px; z-index: 99999;
  font-size: 15px; line-height: 1.5; color: var(--mc-text);
}
.mchat[data-pos="left"] { left: 20px; }
.mchat[data-pos="right"] { right: 20px; }

.mchat-bubble {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  height: 56px; min-width: 56px; padding: 0 18px; border: 0; border-radius: 28px; cursor: pointer;
  background: var(--mc-brand); color: #fff; font: inherit; font-weight: 600;
  box-shadow: 0 6px 20px rgba(0,0,0,.25); transition: transform .15s ease, background .15s ease;
}
.mchat-bubble:hover { background: var(--mc-brand-dark); transform: translateY(-1px); }
.mchat-bubble:focus-visible, .mchat button:focus-visible, .mchat input:focus-visible, .mchat textarea:focus-visible { outline: 3px solid var(--mc-accent); outline-offset: 2px; }
.mchat-bubble svg { width: 24px; height: 24px; fill: currentColor; }
.mchat-preview-tag { font-size: 11px; background: var(--mc-highlight); color: #14213d; border-radius: 10px; padding: 1px 7px; }

.mchat-panel {
  display: none; flex-direction: column; width: 370px; max-width: calc(100vw - 24px); height: 540px; max-height: calc(100vh - 100px);
  background: var(--mc-bg); border-radius: 16px; overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,.3); border: 1px solid var(--mc-line);
}
.mchat.is-open .mchat-panel { display: flex; }
.mchat.is-open .mchat-bubble { display: none; }

.mchat-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: var(--mc-brand); color: #fff; border-bottom: 3px solid var(--mc-accent); }
.mchat-title { flex: 1; font-weight: 700; font-family: "Dida", "Heebo", "Segoe UI", Arial, sans-serif; letter-spacing: .2px; }
.mchat-title small { display: block; font-weight: 400; opacity: .8; font-size: 12px; }
.mchat-close { background: transparent; border: 0; color: #fff; font-size: 26px; line-height: 1; cursor: pointer; padding: 0 6px; }

.mchat-msgs { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 14px; display: flex; flex-direction: column; gap: 10px; background: #fff; }
.mchat-msgs > * { flex-shrink: 0; }
.mchat-msg { max-width: 86%; padding: 9px 13px; border-radius: 14px; white-space: pre-wrap; overflow-wrap: anywhere; }
.mchat-msg.bot { align-self: flex-end; background: var(--mc-bot); border-end-end-radius: 4px; }
.mchat-msg.user { align-self: flex-start; background: var(--mc-brand); color: #fff; border-end-start-radius: 4px; }
.mchat-msg.bot a { color: var(--mc-blue-soft); text-decoration: underline; }
.mchat-msg.user a { color: inherit; text-decoration: underline; }
.mchat-status { align-self: flex-end; font-size: 13px; color: var(--mc-muted); padding: 0 4px; }
.mchat-wa { align-self: flex-end; display: inline-block; padding: 9px 14px; border-radius: 12px; background: #25d366; color: #fff !important; text-decoration: none; font-weight: 600; }

.mchat-form { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--mc-line); background: #fff; }
.mchat-input { flex: 1; resize: none; border: 1px solid var(--mc-line); border-radius: 12px; padding: 9px 12px; font: inherit; color: var(--mc-text); max-height: 110px; }
.mchat-send { border: 0; border-radius: 12px; padding: 0 16px; background: var(--mc-brand); color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.mchat-send:disabled { opacity: .5; cursor: default; }

.mchat-fallback { padding: 14px; display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--mc-line); border-radius: 12px; background: #fafcfd; position: relative; }
.mchat-fallback input, .mchat-fallback textarea { border: 1px solid var(--mc-line); border-radius: 10px; padding: 9px 12px; font: inherit; width: 100%; }
.mchat-fallback .mchat-hp { position: absolute; left: -9999px; height: 0; width: 0; opacity: 0; }
.mchat-fallback .mchat-note { color: var(--mc-muted); font-size: 13px; }
.mchat-fallback .mchat-err { color: #b3261e; font-size: 13px; }

@media (max-width: 480px) {
  .mchat { bottom: 12px; }
  .mchat[data-pos] { left: 12px; right: 12px; }
  .mchat-bubble { margin-inline-start: auto; }
  .mchat[data-pos="left"] .mchat-bubble { margin-inline-end: auto; margin-inline-start: 0; }
  .mchat-panel { width: 100%; height: calc(100vh - 24px); max-height: none; }
}
@media (prefers-reduced-motion: reduce) { .mchat-bubble { transition: none; } }