/* ===========================
 Andaxi Chat – CSS (clean rebuild)
=========================== */

/* Siguranță: ascunde atribute [hidden] și evită override de la teme */
[hidden]{display:none !important;}

/* ---------- RĂDĂCINĂ + FAB ---------- */
.andaxi-chat-root{
  position:fixed;
  z-index:9999;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  line-height:1.35;
  color:#111827;
  font-size:14px;
}

.andaxi-chat-button{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 14px;
  border-radius:999px;
  border:none;
  cursor:pointer;
  background:#1f2937;
  color:#fff;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.andaxi-chat-button:focus{outline:2px solid #93c5fd; outline-offset:2px;}
.andaxi-chat-button-dot{width:10px; height:10px; border-radius:999px; background:#10b981;}
.andaxi-badge-fab{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  display:none;
  align-items:center;
  justify-content:center;
  background:#dc2626;
  color:#fff;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  line-height:1;
  box-shadow:0 0 0 2px #fff;
}

/* ---------- PANOU ---------- */
.andaxi-chat-panel{
  position:fixed;
  width:min(92vw,360px);
  height:calc(100vh - 140px); /* înălțime consistentă */
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  box-shadow:0 24px 40px rgba(0,0,0,.16);
  display:flex;
  flex-direction:column;
}

.andaxi-chat-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
  border-bottom:1px solid #f3f4f6;
  background:#f9fafb;
  border-top-left-radius:14px;
  border-top-right-radius:14px;
}
.andaxi-chat-header h2{margin:0; font-size:16px; font-weight:800;}
.andaxi-chat-close{background:transparent; border:none; font-size:22px; line-height:1; cursor:pointer; color:#4b5563;}

.andaxi-tabs{
  display:flex;
  gap:8px;
  padding:10px 14px 0;
  flex:0 0 auto;
}
.andaxi-tab{
  flex:1;
  padding:8px 10px;
  border:none;
  border-radius:8px;
  background:#f3f4f6;
  font-weight:700;
  cursor:pointer;
  color:#111827;
}
.andaxi-tab.active{
  background:#111827;
  color:#fff;
}

.andaxi-chat-body{
  padding:12px 14px 14px;
  overflow:auto;
  flex:1 1 auto;
  min-height:0;
}
.andaxi-chat-welcome{ margin:0 0 10px; color:#374151; }
.andaxi-chat-placeholder{
  padding:12px;
  border:1px dashed #d1d5db;
  border-radius:12px;
  background:#fafafa;
  color:#4b5563;
}

.andaxi-chat-footer{
  border-top:1px solid #f3f4f6;
  padding:10px 14px;
  font-size:12px;
  color:#6b7280;
  background:#fff;
  border-bottom-left-radius:14px;
  border-bottom-right-radius:14px;
}

/* ---------- SLIDER AGENȚI (layout = slider) ---------- */
/* Container + track pe ORIZONTALĂ cu 1 card pe viewport și scroll-snap */
.andaxi-agents-slider{
  position:relative;
  align-items:center;
  gap:8px;
}

.andaxi-agents-slider .andaxi-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:100%;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding:0 0 12px;
}
/* Ascundem scrollbarul doar când rădăcina NU are .axc-vertical (mod slider orizontal) */
.andaxi-chat-root:not(.axc-vertical) .andaxi-agents-slider .andaxi-track::-webkit-scrollbar{ display:none; }
.andaxi-chat-root:not(.axc-vertical) .andaxi-agents-slider .andaxi-track{
  scrollbar-width:none;           /* Firefox */
  -ms-overflow-style:none;        /* IE/Edge legacy */
}


/* Card în slider: centrat și fixat la snap */
.andaxi-card{
  width:92%;
  margin:0 auto;
  scroll-snap-align:center;
  border:1px solid #e5e7eb;
  border-radius:12px;
  background:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  overflow:hidden;
}
.andaxi-card-img{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
}
.andaxi-card-body{ padding:12px 12px 14px; }
.andaxi-card-name{ margin:0 0 2px; font-size:16px; font-weight:800; color:#111827; }
.andaxi-card-role{ margin:0 0 6px; color:#6b7280; font-size:13px; }
.andaxi-card-desc{ margin:0 0 10px; color:#374151; font-size:14px; line-height:1.35; }
.andaxi-select-agent{
  width:100%;
  background:#1f2937;
  color:#fff;
  border:none;
  border-radius:10px;
  padding:10px 12px;
  cursor:pointer;
}
.andaxi-select-agent:focus{ outline:2px solid #93c5fd; outline-offset:2px; }

/* Navigație slider: vizibilă în modul slider */
.andaxi-nav{
  background:#f3f4f6;
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:6px 10px;
  cursor:pointer;
  flex:0 0 auto;
}
.andaxi-nav:hover{ background:#e5e7eb; }

.andaxi-dots{
  display:flex;
  justify-content:center;
  gap:6px;
  margin-top:4px;
}
.andaxi-dot{
  width:6px;
  height:6px;
  border-radius:999px;
  background:#d1d5db;
  border:none;
  padding:0;
  cursor:pointer;
}
.andaxi-dot[aria-current="true"]{ background:#111827; transform:scale(1.15); }

/* ---------- LISTĂ VERTICALĂ (layout = vertical) ---------- */
/* Se aplică DOAR când pe rădăcină există .axc-vertical (JS o adaugă) */
.axc-vertical .andaxi-agents-slider{
  align-items:stretch;
}
.axc-vertical .andaxi-agents-slider .andaxi-track{
  display:flex;
  flex-direction:column;
  gap:10px;
  overflow-y:auto;
  overflow-x:hidden;
  /* lăsăm doar stânga/jos/sus; dreapta = 0 ca să nu mai pară spațiu gol */
  padding:8px 0 8px 8px;
  border:1px solid #e5e7eb;
  border-radius:12px;
  background:#fff;
  scroll-snap-type:none;
  box-sizing:border-box;
  max-height:48vh;

  /* rezervă loc fix pentru scroll-bar, fără să mute conținutul */
  scrollbar-gutter: stable;              /* Chrome/Edge/Firefox moderne */
}


.axc-vertical .andaxi-agents-slider .andaxi-card{
  display:flex;
  align-items:center;
  gap:15px;
  width:100%;
  min-height:140px;
  margin:0;
  padding:5px 12px;
  box-sizing:border-box;
  scroll-snap-align:unset;
  box-shadow:0 4px 12px rgba(0,0,0,.05);
}
.axc-vertical .andaxi-agents-slider .andaxi-card-img{
  width:80px;
  height:80px;
  object-fit:cover;
  border-radius:8px;
  flex-shrink:0;
  display:block;
}
.axc-vertical .andaxi-agents-slider .andaxi-card-body{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  flex:1 1 auto;
}
.axc-vertical .andaxi-agents-slider .andaxi-card-body h3{ margin-bottom:-6px; }
.axc-vertical .andaxi-agents-slider .andaxi-card-body p:first-of-type{
  margin-top:0;
  margin-bottom:-2px;
}
.axc-vertical .andaxi-agents-slider .andaxi-card-body p:nth-of-type(2){
  margin:0;
  line-height:1.2;
  font-size:12px;
}
.axc-vertical .andaxi-agents-slider .andaxi-card button{
  margin-top:7px;
  min-height:40px;
  font-size:14px;
  font-weight:600;
  padding:8px 18px;
  border-radius:10px;
}

/* În modul vertical ascundem săgeți + puncte */
.axc-vertical .andaxi-agents-slider .andaxi-nav,
.axc-vertical .andaxi-agents-slider + .andaxi-dots{
  display:none !important;
}

/* ---------- PAȘI (Conversație nouă) ---------- */
.andaxi-steps-tracker{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2px;
  margin:2px 0 10px;
  user-select:none;
}
.andaxi-steps-tracker .sep{ opacity:.5; }
.andaxi-steps-tracker .step{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  text-align:center;
  min-width:0;
  opacity:.6;
}
.andaxi-steps-tracker .step.locked{
  opacity:.3;
  pointer-events:none;
  cursor:default;
}
.andaxi-steps-tracker .step.locked .num{
  border-style:dashed;
}
.andaxi-steps-tracker .step .num{
  width:18px;
  height:18px;
  border-radius:999px;
  border:1px solid #d1d5db;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
}
.andaxi-steps-tracker .step .lbl{ line-height:1.1; font-size:13px; color:#374151; }
.andaxi-steps-tracker .step.active{ opacity:1; }
.andaxi-steps-tracker .step.done .num{ background:#111827; color:#fff; border-color:#111827; }

.andaxi-steps{ overflow:hidden; margin-top:6px; }
.andaxi-steps-inner{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:100%;
  transition:transform .28s ease;
  will-change:transform;
}
.andaxi-step{ width:100%; padding:0 2px; box-sizing:border-box; }
.andaxi-step[hidden]{ display:none !important; }
.andaxi-step.active{ display:block; }

.andaxi-chat-root[data-has-agents="0"] .andaxi-steps{
  display:block;
  height:auto;
}
.andaxi-chat-root[data-has-agents="0"] .andaxi-steps-inner{
  display:block;
  width:100%;
  height:auto;
}
.andaxi-chat-root[data-has-agents="0"] .andaxi-step:not([hidden]){
  display:block;
}
.andaxi-chat-root[data-has-agents="0"] .andaxi-step:not([hidden]) form{
  width:100%;
}

.andaxi-form{ margin-top:4px; }
.andaxi-row{ margin-bottom:8px; }
.andaxi-row.two{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.andaxi-row input, .andaxi-row textarea{
  width:100%;
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:10px 12px;
  font:inherit;
}
.andaxi-row textarea{ resize:vertical; min-height:96px; }
.andaxi-actions{ display:flex; justify-content:flex-end; }
.andaxi-send{
  background:#1f2937;
  color:#fff;
  border:none;
  border-radius:10px;
  padding:10px 14px;
  cursor:pointer;
}
.andaxi-send:disabled{ opacity:.6; cursor:not-allowed; }
.andaxi-status{ margin-top:6px; font-size:13px; color:#374151; }
.andaxi-hint{ display:block; margin-top:6px; font-size:12px; color:#6b7280; opacity:.9; }

/* ---------- TAB „CONVERSAȚII” ---------- */
.andaxi-history-view{ padding:4px 2px 10px; }
.andaxi-history-head{ font-weight:800; margin:6px 2px 10px; }
.andaxi-history-list{ list-style:none; margin:0; padding:0; }
.andaxi-history-item{
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:12px 12px;
  margin-bottom:8px;
  background:#fff;
  cursor:pointer;
}
.andaxi-history-item:hover{ background:#fafafa; }
.andaxi-history-item .row1{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:4px;
}
.andaxi-history-item .title{ font-weight:700; }
.andaxi-history-item .meta{ font-size:12px; color:#6b7280; }

.andaxi-empty{
  padding:12px;
  border:1px dashed #d1d5db;
  border-radius:12px;
  background:#fafafa;
  color:#4b5563;
}

/* Thread stabil pentru UI live */
.andaxi-thread-view{ padding:4px 2px 10px; }
.axc-thread { display:flex; flex-direction:column; gap:10px; }
.axc-msgs { max-height:52vh; overflow:auto; padding:12px; border:1px solid #e5e7eb; border-radius:12px; background:#fff; }
.axc-bubble { margin:8px 0; max-width:78%; padding:10px 12px; border-radius:12px; }
.axc-bubble.user { background:#f3f4f6; margin-left:auto;}
.axc-bubble.agent { background:#e0f2fe; margin-left:0; }
.axc-bubble small { display:block; color:#6b7280; margin-top:6px; }

/* Toolbar inbox: stare activă pe butoane */
.andaxi-inbox-toolbar .button{
  background:#f3f4f6; border-color:#e5e7eb; color:#111827; transition:.15s ease-in-out;
}
.andaxi-inbox-toolbar .button.is-active,
.andaxi-inbox-toolbar .button[aria-pressed="true"]{
  background:#111827; color:#fff; border-color:#111827;
}
.andaxi-inbox-toolbar .button.is-active:focus{box-shadow:0 0 0 2px #93c5fd;}

/* Notița „închis” */
.axc-closed-note {
  margin-top:8px;
  padding:10px;
  font-size:13px;
  background:#f8f8f8;
  border:1px solid #e5e7eb;
  border-radius:10px;
  color:#555;
}

/* ---------- RESPONSIVE ---------- */
@media (max-height:640px){
  .andaxi-chat-panel{ height:calc(100vh - 100px); }
}
@media (max-width:360px){
  .andaxi-card-img{ height:160px; }
  .andaxi-row.two{ grid-template-columns:1fr; }
}
@media (max-width:940px){
  .axc-msgs{ height:312px; }
}