/* CRM Gaiatri - modal thread estable */

body.gcrmth-modal-open {
  overflow: hidden !important;
}

.gcrmth-busy {
  position: fixed !important;
  right: 18px !important;
  bottom: 18px !important;
  z-index: 2147483200 !important;
  display: none !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 10px 13px !important;
  border-radius: 999px !important;
  background: #4b3219 !important;
  color: #fff !important;
  box-shadow: 0 12px 35px rgba(32, 21, 10, .30) !important;
  font: 13px/1.2 Arial, sans-serif !important;
}

.gcrmth-busy.is-visible {
  display: flex !important;
}

.gcrmth-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  box-sizing: border-box !important;
}

.gcrmth-modal.is-open {
  display: flex !important;
}

.gcrmth-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(32, 24, 16, .55) !important;
  backdrop-filter: blur(3px) !important;
}

.gcrmth-panel {
  position: relative !important;
  width: min(980px, calc(100vw - 28px)) !important;
  height: min(760px, calc(100vh - 42px)) !important;
  background: #fffaf1 !important;
  border: 1px solid rgba(137, 102, 47, .28) !important;
  border-radius: 22px !important;
  box-shadow: 0 24px 90px rgba(38, 25, 10, .42) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.gcrmth-head {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 18px 20px !important;
  border-bottom: 1px solid rgba(137, 102, 47, .22) !important;
  background: linear-gradient(180deg, #fff7e8, #f6ead6) !important;
}

.gcrmth-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #4b3219 !important;
}

.gcrmth-subtitle {
  margin-top: 4px !important;
  font-size: 13px !important;
  color: #80613e !important;
}

.gcrmth-close {
  width: 38px !important;
  height: 38px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(137, 102, 47, .26) !important;
  background: #fffaf1 !important;
  color: #5a3b1e !important;
  font-size: 26px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.gcrmth-body {
  flex: 1 1 auto !important;
  overflow: auto !important;
  padding: 18px !important;
  background: #fffaf1 !important;
}

.gcrmth-compose {
  flex: 0 0 auto !important;
  padding: 14px 16px 16px !important;
  border-top: 1px solid rgba(137, 102, 47, .22) !important;
  background: #fff7e8 !important;
}

.gcrmth-reply-text {
  width: 100% !important;
  min-height: 84px !important;
  resize: vertical !important;
  border-radius: 14px !important;
  border: 1px solid rgba(137, 102, 47, .28) !important;
  padding: 12px 13px !important;
  background: #fff !important;
  color: #3d2b1c !important;
  font-size: 15px !important;
  box-sizing: border-box !important;
}

.gcrmth-compose-actions {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin-top: 10px !important;
}

.gcrmth-compose-actions button {
  border: 0 !important;
  border-radius: 999px !important;
  padding: 10px 14px !important;
  cursor: pointer !important;
  font-weight: 700 !important;
}

.gcrmth-send {
  background: #6f4f22 !important;
  color: #fff !important;
}

.gcrmth-external {
  background: #eadcc5 !important;
  color: #4b3219 !important;
}

.gcrmth-cancel {
  background: #f3eee5 !important;
  color: #4b3219 !important;
}

.gcrmth-compose-status {
  margin-top: 8px !important;
  font-size: 13px !important;
  color: #6f4f22 !important;
}

.gcrmth-compose-status.is-error {
  color: #a32714 !important;
}

.gcrmth-msg {
  display: flex !important;
  flex-direction: column !important;
  margin: 10px 0 !important;
}

.gcrmth-msg.is-out {
  align-items: flex-end !important;
}

.gcrmth-msg.is-in {
  align-items: flex-start !important;
}

.gcrmth-msg-bubble {
  max-width: min(76%, 620px) !important;
  border-radius: 16px !important;
  padding: 11px 13px !important;
  background: #f0e4d0 !important;
  color: #352515 !important;
  box-shadow: 0 2px 8px rgba(66, 42, 18, .08) !important;
  white-space: normal !important;
}

.gcrmth-msg.is-out .gcrmth-msg-bubble {
  background: #6f4f22 !important;
  color: #fff !important;
}

.gcrmth-msg-meta {
  margin-top: 4px !important;
  font-size: 11px !important;
  color: #967a58 !important;
}

.gcrmth-loading-card,
.gcrmth-error,
.gcrmth-empty {
  border: 1px solid rgba(137, 102, 47, .20) !important;
  background: #fff7e8 !important;
  border-radius: 18px !important;
  padding: 18px !important;
  color: #4b3219 !important;
}

.gcrmth-loading-main {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin-bottom: 16px !important;
}

.gcrmth-loading-title {
  font-weight: 800 !important;
  color: #4b3219 !important;
  font-size: 16px !important;
}

.gcrmth-loading-sub {
  margin-top: 4px !important;
  color: #80613e !important;
  font-size: 13px !important;
}

.gcrmth-spinner {
  width: 17px !important;
  height: 17px !important;
  display: inline-block !important;
  border-radius: 999px !important;
  border: 3px solid rgba(111, 79, 34, .18) !important;
  border-top-color: #6f4f22 !important;
  animation: gcrmth-spin .75s linear infinite !important;
  flex: 0 0 auto !important;
}

.gcrmth-spinner-lg {
  width: 32px !important;
  height: 32px !important;
  border-width: 4px !important;
}

@keyframes gcrmth-spin {
  to { transform: rotate(360deg); }
}

.gcrmth-skeleton-line {
  height: 12px !important;
  border-radius: 999px !important;
  margin: 10px 0 !important;
  background: linear-gradient(90deg, rgba(111,79,34,.10), rgba(111,79,34,.20), rgba(111,79,34,.10)) !important;
  background-size: 200% 100% !important;
  animation: gcrmth-pulse 1.1s ease-in-out infinite !important;
}

.gcrmth-skeleton-line.w70 {
  width: 70% !important;
}

.gcrmth-skeleton-line.w80 {
  width: 80% !important;
}

.gcrmth-skeleton-line.w90 {
  width: 90% !important;
}

@keyframes gcrmth-pulse {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.gcrmux-row.gcrmth-row-loading {
  opacity: .72 !important;
  position: relative !important;
}

.gcrmux-row.gcrmth-row-loading::after {
  content: "Abriendo…" !important;
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  background: #4b3219 !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 5px 9px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  pointer-events: none !important;
}

@media (max-width: 720px) {
  .gcrmth-modal {
    padding: 8px !important;
    align-items: stretch !important;
  }

  .gcrmth-panel {
    width: 100% !important;
    height: calc(100vh - 16px) !important;
    border-radius: 18px !important;
  }

  .gcrmth-msg-bubble {
    max-width: 88% !important;
  }

  .gcrmth-busy {
    right: 10px !important;
    bottom: 10px !important;
  }
}
