/* =========================================================
   Askivio Chat — Core Styles (clean, English-only)
   - Close "X" button is hidden
   - Header/Message avatar sizes via CSS variables:
       --askivio-header-avatar-size (default 48px)
       --askivio-msg-avatar-size    (default 32px)
   - Button/bubble colors via CSS variables (with fallbacks):
       --askivio-btn-send (default #0b79d0)
       --askivio-bubble-bg (default #0ea5e9)
   ========================================================= */

/* Launcher & window base visibility */
#askivio-launcher { outline: none; }
.askivio-chat-window { display: none; }

/* Links in messages */
.askivio-msg a { text-decoration: underline; }

/* Stacking order */
#askivio-launcher { position: fixed; z-index: 2147483001; }
.askivio-chat-window { z-index: 2147483000; }

/* If launcher is bottom-aligned, lift the window above it */
body .askivio-chat-window[data-pos="br"],
body .askivio-chat-window[data-pos="bl"],
body .askivio-chat-window[data-pos="bc"] {
  margin-bottom: 68px; /* 56px button + 12px gap */
}

/* =============== CTA buttons =============== */
.askivio-cta-wrap { margin-top: 8px; }
.askivio-cta-btn {
  display: inline-block;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--askivio-btn-send, #0b79d0);
  color: #fff;
  text-decoration: none;
  font-weight: 600;
}
.askivio-cta-btn:hover { filter: brightness(1.05); }

/* =============== System / usage banners =============== */
.askivio-msg.system {
  background: #fff8e1;
  color: #7a5700;
  border: 1px solid #ffe08a;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.35;
  margin: 8px 0;
}
.askivio-msg.system.limit {
  background: #ffeef0;
  color: #86181d;
  border-color: #ffd1d6;
}

/* =============== Consent bar =============== */
.askivio-consent{
  border: 1px solid #e6eaf0;
  border-radius: 12px;
  padding: 12px;
  margin: 10px 0;
  background: #f7f9fc;
  font-size: 13px;
  line-height: 1.45;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
.askivio-consent-title{ font-weight: 600; margin-bottom: 6px; color: #0f172a; }
.askivio-consent-body{ color: #334155; }
.askivio-consent-actions{ margin-top: 10px; display: flex; gap: 10px; flex-wrap: wrap; }

.askivio-btn{
  display: inline-flex; align-items: center; justify-content: center;
  padding: 8px 14px; border-radius: 10px; border: 1px solid transparent;
  background: #fff; color: #0f172a; cursor: pointer; text-decoration: none;
  transition: box-shadow .15s ease, transform .03s ease, filter .15s ease;
  user-select: none;
}
.askivio-btn:active{ transform: translateY(1px); }

/* Primary (agree) */
.askivio-btn.agree{
  background: linear-gradient(180deg, #4ea6ff 0%, #0a66c2 100%);
  color: #fff; border-color: #0a66c2;
  box-shadow: 0 1px 1px rgba(13, 110, 253, 0.25), 0 1px 8px rgba(13, 110, 253, 0.18);
}
.askivio-btn.agree:hover{ filter: brightness(1.05); }
.askivio-btn.agree:focus{ outline: 2px solid #93c5fd; outline-offset: 2px; }

/* Ghost secondary (deny) */
.askivio-btn.ghost{
  background: #fff; color: #0f172a; border-color: #e5e7eb;
}
.askivio-btn.ghost:hover{ background: #f8fafc; }
.askivio-btn.ghost:focus{ outline: 2px solid #e5e7eb; outline-offset: 2px; }

/* Smaller buttons inside consent blocks */
.askivio-consent .askivio-btn { padding: 5px 9px; font-size: 11.5px; border-radius: 7px; }
.askivio-consent .askivio-consent-actions { gap: 6px; }

/* =============== Header =============== */
.askivio-header { position: relative; display: flex; align-items: center; }

/* Hide the close "X" button entirely */
.askivio-close { display: none !important; }

/* Header avatar (uses CSS var; JS/inline styles cannot override thanks to !important) */
.askivio-header-avatar{
  width: var(--askivio-header-avatar-size, 48px) !important;
  height: var(--askivio-header-avatar-size, 48px) !important;
  min-width: var(--askivio-header-avatar-size, 48px) !important;
  min-height: var(--askivio-header-avatar-size, 48px) !important;
  max-width: var(--askivio-header-avatar-size, 48px) !important;
  max-height: var(--askivio-header-avatar-size, 48px) !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  background: #fff;
  border: 2px solid rgba(255,255,255,.7);
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
  margin-right: 16px;
  display: block;
}

/* =============== Message layout & avatars =============== */
.askivio-row { align-items: flex-start; }

/* Bot/user avatar next to messages (CSS var) */
.askivio-avatar {
  width: var(--askivio-msg-avatar-size, 32px) !important;
  height: var(--askivio-msg-avatar-size, 32px) !important;
  min-width: var(--askivio-msg-avatar-size, 32px) !important;
  min-height: var(--askivio-msg-avatar-size, 32px) !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  background: #fff;
  border: 1px solid #ddd;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

/* =============== Send button color helper =============== */
.askivio-send,
.askivio-cta-btn {
  background: var(--askivio-btn-send, #0b79d0);
  color: #fff;
}
.askivio-send:hover { filter: brightness(1.05); }

/* =============== Bubble / launcher background helper =============== */
.askivio-launcher,
.askivio-bubble {
  background: var(--askivio-bubble-bg, #0ea5e9);
  color: #fff;
}

/* =============== Utilities =============== */
.askivio-msg { word-wrap: break-word; overflow-wrap: anywhere; }
.askivio-msg p { margin: 0.4em 0; }
.askivio-msg code, .askivio-msg pre {
  background: #f3f4f6;
  border-radius: 6px;
  padding: 2px 6px;
}

/* Optional: textarea/input base styles inside the chat window */
.askivio-chat-window input[type="text"],
.askivio-chat-window textarea {
  font-family: inherit;
  font-size: inherit;
}

/* (If you use a draggable/floating mode, keep pointer events sane) */
.askivio-chat-window.is-dragging { cursor: grabbing; }