/* SupportMax AI Chat — fancy styles + dynamic color support */
:root{
  --acs-title:#ffffff;
  --acs-subtitle:#e8eaed;
  --acs-icon:#e8eaed;
  --acs-body-bg:#ffffff;
  --acs-input-bg:#ffffff;
  --acs-input-text:#0f172a;
  --acs-input-border:#cbd5e1;
  --acs-input-placeholder:#64748b;
  --acs-btn-bg:var(--acs-primary);
  --acs-btn-text:#ffffff;
  --acs-btn-hover:var(--acs-primary);
  --acs-user-text:#0f172a;
  --acs-bot-text:#0f172a;
  --acs-history-bg:#ffffff;
  --acs-warn:#da8b00;

  --acs-bg:#0f172a;
  --acs-card:#ffffff;
  --acs-primary:#2563eb; /* overwritten inline by the shortcode */
  --acs-muted:#64748b;
  --acs-border:#e2e8f0;
  --acs-bot:#f1f5f9;
  --acs-user:#e0f2fe;
  --acs-radius:16px;
  --acs-shadow: 0 10px 25px rgba(2,6,23,.08);


  --acs-card-border:var(--acs-border);

  --acs-input-focus:#93c5fd;
  --acs-input-focus-shadow:rgba(59,130,246,.1);
  --acs-validating-color:#2563eb;
}
.acs-container{max-width:760px;margin:16px auto;padding:8px;}
.acs-card{background:var(--acs-card);border:1px solid var(--acs-card-border);border-radius:var(--acs-radius);box-shadow:var(--acs-shadow);overflow:hidden;}

/* Desktop only border */
@media (min-width:1025px){.acs-card{ } }
.acs-header{padding:20px 24px;color:var(--acs-title);}
.acs-title{font-size:20px;font-weight:700;color:var(--acs-title);}
.acs-subtitle{font-size:13px;opacity:.95;margin-top:4px;color:var(--acs-subtitle);}
.acs-body{padding:16px 16px 20px 16px;}
.acs-form{display:block;}
.acs-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px;}
@media (max-width:640px){.acs-grid{grid-template-columns:1fr;}}
.acs-field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#0f172a;}
.acs-input{background:var(--acs-input-bg);color:var(--acs-input-text);border:1px solid var(--acs-input-border);border-radius:12px;padding:10px 12px;font-size:14px;outline:none;}
.acs-input:focus{border-color:var(--acs-input-focus);box-shadow:0 0 0 4px var(--acs-input-focus-shadow);}
.acs-input-grow{flex:1;}
.acs-btn{background:var(--acs-btn-bg);color:var(--acs-btn-text);border:none;border-radius:12px;padding:10px 14px;font-weight:600;cursor:pointer;transition:transform .02s ease,opacity .15s;}
.acs-btn:hover{background:var(--acs-btn-hover);opacity:1;}
.acs-btn:active{transform:translateY(1px);}
.acs-msg{margin-top:8px;font-size:13px;}
.acs-msg-warn{color:var(--acs-warn);}
.acs-history{border:1px solid var(--acs-border);border-radius:12px;padding:12px;height:400px;overflow:auto;margin-bottom:10px;background:var(--acs-history-bg);}
.acs-system{color:var(--acs-muted);font-size:12px;margin:6px 0;}
.acs-msg-user,.acs-msg-bot{display:flex;margin:8px 0;}
.acs-msg-user{justify-content:flex-end;}
.acs-msg-bot{justify-content:flex-start;}
.acs-bubble{display:block;max-width:84%;padding:10px 12px;border-radius:16px;line-height:1.4;}
.acs-msg-user .acs-bubble{background:var(--acs-user);color:var(--acs-user-text);}
.acs-msg-bot .acs-bubble{background:var(--acs-bot);color:var(--acs-bot-text);}
.acs-bubble ul{margin:6px 0 6px 18px;padding:0;}
.acs-bubble li{margin:2px 0;}
.acs-bubble b{font-weight:700;}
.acs-bubble hr{border:0;border-top:1px dashed var(--acs-input-border);margin:8px 0;}
.acs-chatbar{display:flex;gap:8px;align-items:center;}


/* === 0.6.5: typing dots inside empty bot bubble === */
.acs-bubble .acs-dots{display:inline-flex;gap:6px;align-items:center;vertical-align:middle;}
.acs-bubble .acs-dot{width:6px;height:6px;border-radius:50%;background:var(--acs-muted);opacity:.4;animation:acs-blink 1.2s infinite;}
.acs-bubble .acs-dot:nth-child(2){animation-delay:.2s}
.acs-bubble .acs-dot:nth-child(3){animation-delay:.4s}
@keyframes acs-blink{0%,80%,100%{opacity:.2}40%{opacity:1}}

/* compact bubble when empty+thinking */
.acs-msg-bot .acs-bubble.acs-thinking{display:inline-flex;align-items:center;min-height:20px;}
/* keep arrow button style from previous versions */
.acs-btn.acs-btn-arrow{display:inline-flex;align-items:center;justify-content:center;width:44px;min-width:44px;height:44px;padding:0;border-radius:12px;}
.acs-btn.acs-btn-arrow svg{width:20px;height:20px;display:block}


/* Requested adjustments */
#acs-validate-form .acs-input {
  height: 50px !important;
  font-weight: normal !important;
  font-size: 16px !important;
}
#acs-validate-form .acs-btn {
  padding: 6px 14px !important;
  font-size: 14px !important;
}


/* Reduce the space below the form and chat */
#acs-validate-form {
  margin-bottom: 8px !important;
}
#acs-chat-form {
  margin-bottom: 8px !important;
}

@media (max-width: 1024px) {
  /* iOS anti-zoom and typographic consistency */
  html,
  input,
  select,
  textarea,
  button,
  .acs-input,
  .acs-textarea,
  .acs-btn,
  .acs-btn-arrow,
  input[type="text"],
  input[type="email"],
  input[type="search"],
  input[type="number"],
  input[type="tel"],
  input[type="url"],
  input[type="password"] {
    -webkit-text-size-adjust: 100%;
    font-size: 16px !important;
    line-height: 1.35;
  }
}


/* Home SVG icon: hidden by default, only on mobile/tablet (<=1024px) */
.acs-home-icon{display:none !important;cursor:pointer;outline:none;fill:var(--acs-icon) !important;}
@media (max-width:1024px){
  .acs-header{position:relative;}
  .acs-home-icon{fill:var(--acs-icon) !important;}
  .acs-home-icon:focus{outline:2px solid rgba(0,0,0,.2);outline-offset:4px;}
}


/* Priority: classic style for system messages */
.acs-history .acs-system{color:var(--acs-muted);font-size:12px;margin:6px 0;}

/* Border radius global para inputs, textarea e select */

input[type=text],
input[type=email],
input[type=password],
textarea,
select {
  border-radius: 12px !important;
}

#acs-validate-form .acs-msg{color:var(--acs-validating-color);}

/* Force no border on mobile */
@media (max-width:1024px){#ai-chat-support .acs-card{ border:none !important; }}

/* Prevent desktop flicker of the mobile-only home icon */
@media (min-width:1025px){
  #ai-chat-support .acs-home-icon{fill:var(--acs-icon) !important;}
}

.acs-input::placeholder{color:var(--acs-input-placeholder);}



/* Home SVG icon: force mobile-only (overrides inline display) */
.acs-home-icon{display:none !important;fill:var(--acs-icon) !important;}
@media (max-width:1024px){
  .acs-header{position:relative;}
  .acs-home-icon{display:block !important;position:absolute;right:12px;top:50%;transform:translateY(-50%);width:28px;height:28px;}
}
@media (min-width:1025px){
  .acs-home-icon{display:none !important;}
}


}







/* Ensure bubble inner markup does not override chosen bubble text color */
#ai-chat-support .acs-bubble * {
  color: inherit !important;
}
#ai-chat-support .acs-bubble a {
  text-decoration: underline;
}



/* Preserve line breaks when rendering bubble content as text */
#ai-chat-support .acs-bubble{white-space:pre-wrap;}

/* vertical centering between header and button */
.acs-body{padding-top:32px;}

/* Premium round avatar for assistant/system responses */
#ai-chat-support .acs-msg-bot.acs-has-avatar{
  align-items:flex-start;
  gap:10px;
}
#ai-chat-support .acs-system-avatar{
  width:42px;
  height:42px;
  min-width:42px;
  border-radius:999px;
  object-fit:cover;
  display:block;
  margin-top:2px;
  background:var(--acs-card);
  border:1px solid rgba(148,163,184,.28);
  box-shadow:0 8px 18px rgba(15,23,42,.12);
}
#ai-chat-support .acs-msg-bot.acs-has-avatar .acs-bubble{
  max-width:calc(84% - 48px);
}
@media (max-width:640px){
  #ai-chat-support .acs-system-avatar{
    width:42px;
    height:42px;
    min-width:42px;
    margin-top:1px;
  }
  #ai-chat-support .acs-msg-bot.acs-has-avatar{
    gap:11px;
  }
  #ai-chat-support .acs-msg-bot.acs-has-avatar .acs-bubble{
    max-width:calc(100% - 53px);
  }
}
