/* Desktop Specific Layout & Styling */

body {
  overflow: hidden; /* Prevent global body scroll */
}

/* Ações manuais da régua de mensagens */
.sequence-schedule-hint {
  margin: 0 0 10px;
  color: var(--color-text-secondary);
  font-size: 0.72rem;
  line-height: 1.4;
}

.sequence-step-actions {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex-shrink: 0;
}

.followup-send-button {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #fff;
  background: #16a34a;
  box-shadow: 0 1px 3px rgb(22 163 74 / 25%);
  cursor: pointer;
  transition: transform 0.16s ease, background-color 0.16s ease, box-shadow 0.16s ease;
}

.followup-send-button:hover:not(:disabled) {
  background: #15803d;
  box-shadow: 0 3px 8px rgb(22 163 74 / 28%);
  transform: translateY(-1px);
}

.followup-send-button:focus-visible {
  outline: 2px solid rgb(22 163 74 / 32%);
  outline-offset: 2px;
}

.followup-send-button:disabled {
  color: #fff;
  background: #a7b0bc;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.72;
}

.followup-send-button i {
  font-size: 14px;
  line-height: 1;
}

.followup-send-icon--spin {
  animation: followup-send-spin 0.8s linear infinite;
}

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

.followup-custom-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
}

.followup-custom-schedule-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.followup-custom-schedule-option input {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  cursor: pointer;
}

.followup-custom-schedule-option label {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  color: hsl(120, 60%, 30%);
  font-size: calc(0.75rem + 1px);
  font-weight: 600;
  cursor: pointer;
}

.followup-custom-send-button {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  flex: 0 0 auto;
  padding: 7px 12px;
  border: 0;
  border-radius: 7px;
  color: #fff;
  background: #16a34a;
  box-shadow: 0 2px 6px rgb(22 163 74 / 24%);
  font-size: calc(0.75rem + 1px);
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.followup-custom-send-button:hover:not(:disabled) {
  background: #15803d;
  box-shadow: 0 4px 10px rgb(22 163 74 / 26%);
  transform: translateY(-1px);
}

.followup-custom-send-button:focus-visible {
  outline: 2px solid rgb(22 163 74 / 35%);
  outline-offset: 2px;
}

.followup-custom-send-button:disabled {
  background: #a7b0bc;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.8;
}

@media (max-width: 900px) {
  .followup-custom-actions {
    align-items: flex-start;
    flex-direction: column;
  }

  .followup-custom-send-button {
    align-self: flex-end;
  }
}

.address-validation-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}

.address-validation-group {
  position: relative;
  z-index: 25;
}
.address-input-with-map {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(0, 1fr) 44px;
  align-items: stretch;
  gap: 8px;
}

.address-input-with-map > textarea {
  min-width: 0;
  margin: 0;
}

.address-map-icon-button {
  display: inline-flex;
  width: 44px;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  border: 1px solid #d8e2ee;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 1px 2px rgb(15 23 42 / 5%);
  transition: background-color 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.address-map-icon-button:hover {
  border-color: #a9c7ee;
  background: #f7fbff;
  transform: translateY(-1px);
}

.address-map-icon-button:focus-visible {
  outline: 2px solid rgb(15 95 189 / 24%);
  outline-offset: 2px;
}

.address-map-icon-button img {
  display: block;
  width: 27px;
  height: 27px;
  object-fit: contain;
}


.address-validation-heading label {
  margin: 0;
}

.address-validation-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.address-validated-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #137333;
  font-size: calc(0.72rem + 1px);
  font-weight: 700;
  white-space: nowrap;
}

.address-validated-badge[hidden] {
  display: none;
}

.address-validate-button {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 5px 10px;
  border: 1px solid #bfd5f4;
  border-radius: 7px;
  color: #0f5fbd;
  background: #f7fbff;
  font-size: calc(0.72rem + 1px);
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.address-validate-button:hover:not(:disabled) {
  border-color: #8eb8ed;
  background: #edf6ff;
  transform: translateY(-1px);
}

.address-validate-button:focus-visible {
  outline: 2px solid rgb(15 95 189 / 24%);
  outline-offset: 2px;
}

.address-validate-button:disabled {
  color: #7f8b99;
  border-color: #d8dee7;
  background: #f3f4f6;
  cursor: wait;
}

.address-autocomplete-panel {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  left: 0;
  padding: 8px;
  border: 1px solid #d8e2ee;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 16px 34px rgb(15 23 42 / 18%);
  z-index: 90;
}

.address-autocomplete-status {
  padding: 7px 9px;
  color: #64748b;
  font-size: calc(0.69rem + 1px);
}

.address-autocomplete-status:empty {
  display: none;
}

.address-autocomplete-status.is-error {
  color: #b42318;
}

.address-autocomplete-results {
  display: grid;
  gap: 3px;
  max-height: 260px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.address-autocomplete-option {
  width: 100%;
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border: 0;
  border-radius: 7px;
  color: #172033;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.address-autocomplete-option:hover,
.address-autocomplete-option.is-active {
  background: #edf5ff;
}

.address-autocomplete-option strong,
.address-autocomplete-option small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.address-autocomplete-option strong {
  font-size: calc(0.74rem + 1px);
}

.address-autocomplete-option small {
  color: #66758a;
  font-size: calc(0.66rem + 1px);
}

.address-autocomplete-attribution {
  display: inline-block;
  margin: 7px 9px 2px;
  color: #64748b;
  font-family: Roboto, Arial, sans-serif;
  font-size: 12px;
  text-decoration: none;
}
.address-validation-panel {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  left: 0;
  max-height: min(430px, 62vh);
  padding: 10px;
  border: 1px solid #d8e2ee;
  border-radius: 9px;
  background: #f8fafc;
  box-shadow: 0 16px 34px rgb(15 23 42 / 18%);
  overflow: hidden;
  z-index: 80;
}

.address-validation-status {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #526174;
  font-size: calc(0.72rem + 1px);
  line-height: 1.4;
}

.address-validation-status.is-success {
  color: #137333;
}

.address-validation-status.is-error {
  color: #b42318;
}

.address-validation-results {
  display: grid;
  gap: 8px;
  margin-top: 8px;
  max-height: min(310px, 44vh);
  padding-right: 4px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.address-validation-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border: 1px solid #dce5ef;
  border-radius: 8px;
  background: #fff;
}

.address-validation-result.is-selected {
  border-color: #22a35a;
  box-shadow: 0 0 0 2px rgb(34 163 90 / 10%);
}

.address-validation-result-copy {
  min-width: 0;
}

.address-validation-result-copy strong,
.address-validation-result-copy small {
  display: block;
}

.address-validation-result-copy strong {
  color: #172033;
  font-size: calc(0.76rem + 1px);
  line-height: 1.35;
}

.address-validation-result-copy small {
  margin-top: 3px;
  overflow: hidden;
  color: #6c788a;
  font-size: calc(0.67rem + 1px);
  line-height: 1.35;
  text-overflow: ellipsis;
}

.address-validation-result-actions {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.address-validation-map-link,
.address-validation-use-button {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 5px 9px;
  border-radius: 6px;
  font-size: calc(0.68rem + 1px);
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.address-validation-map-link {
  border: 1px solid #d4deea;
  color: #42526a;
  background: #fff;
}

.address-validation-use-button {
  border: 0;
  color: #fff;
  background: #16a34a;
  cursor: pointer;
}

.address-validation-attribution {
  display: inline-block;
  margin-top: 9px;
  color: #64748b;
  font-size: 10px;
  text-decoration: underline;
}

.address-validation-privacy {
  display: block;
  margin-top: 9px;
  color: #788597;
  font-size: 10px;
  line-height: 1.35;
}

.address-validation-privacy + .address-validation-attribution {
  margin-top: 3px;
}

@media (max-width: 900px) {
  .address-validation-result {
    grid-template-columns: 1fr;
  }

  .address-validation-result-actions {
    justify-content: flex-end;
  }
}

/* Master Container */
.desktop-container {
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: row;
  background-color: var(--color-bg-page);
  overflow: hidden;
}

/* Right Content Area (Topbar + Main Content) */
.im-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
  background-color: var(--color-bg-page);
}

.desktop-header {
  height: 64px;
  width: 100% !important;
  max-width: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: 1px solid var(--color-border-soft) !important;
  background-color: var(--color-surface-primary) !important;
  padding: 0 24px;
  box-sizing: border-box;
}

.header-tag {
  font-size: calc(0.75rem + 1px);
  font-weight: 600;
  text-transform: uppercase;
  background: rgba(59, 130, 246, 0.15);
  color: var(--color-primary);
  padding: 2px 8px;
  border-radius: 4px;
  margin-left: 8px;
  border: 1px solid rgba(59, 130, 246, 0.3);
  vertical-align: middle;
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}

/* Work Area Split (Deprecated but kept for safety) */
.desktop-main {
  flex: 1;
  display: flex;
  overflow: hidden;
  height: 100%;
}

/* Sidebar Styling */
.desktop-sidebar {
  position: relative;
  width: 320px;
  background-color: var(--color-surface-secondary);
  border-right: 1px solid var(--color-border-soft);
  display: flex;
  flex-direction: column;
  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1), padding 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s ease;
  padding: 24px;
  box-sizing: border-box;
  overflow: visible; /* Let toggle button hang outside */
  z-index: 50; /* Garante que o botão de toggle fique visível sobre o .im-content */
}

.desktop-sidebar.collapsed {
  width: 0px;
  padding-left: 0px;
  padding-right: 0px;
  border-right-color: transparent;
}

.sidebar-scroll-container {
  width: 272px; /* Fixed width to prevent content squishing */
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  flex-shrink: 0;
  opacity: 1;
  transition: opacity 0.2s ease;
}

.desktop-sidebar.collapsed .sidebar-scroll-container {
  opacity: 0;
  pointer-events: none;
  width: 0px;
  overflow: hidden;
}

.sidebar-toggle-btn {
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: var(--color-bg-surface);
  border: var(--border-light);
  box-shadow: var(--shadow-premium);
  color: var(--color-text-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  z-index: 100;
  font-size: calc(0.8rem + 1px);
  padding: 0;
  line-height: 1;
}

.sidebar-toggle-btn:hover {
  background-color: var(--color-primary);
  color: #ffffff;
  border-color: var(--color-primary);
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
  transform: translate(-50%, -50%) scale(1.15);
}

.sidebar-section h3 {
  font-family: 'Outfit', sans-serif;
  font-size: calc(1.1rem + 1px);
  font-weight: 600;
  margin-bottom: 8px;
  background: linear-gradient(135deg, var(--color-text-primary), var(--color-text-secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.sidebar-help {
  font-size: calc(0.8rem + 1px);
  color: var(--color-text-secondary);
  line-height: 1.4;
  margin-bottom: 20px;
}

.sidebar-links-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.sidebar-loading {
  text-align: center;
  padding: 20px;
  font-size: calc(0.8rem + 1px);
  color: var(--color-text-muted);
}

.sidebar-link-item {
  background: rgba(255, 255, 255, 0.8);
  border: var(--border-light);
  border-radius: var(--border-radius-sm);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: var(--transition-smooth);
}

.sidebar-link-item:hover {
  border-color: var(--color-primary);
  background: #ffffff;
}

.sidebar-link-item h5 {
  font-family: 'Outfit', sans-serif;
  font-size: calc(0.85rem + 1px);
  font-weight: 600;
  color: var(--color-text-primary);
  display: flex;
  justify-content: space-between;
}

.sidebar-link-item p {
  font-size: calc(0.75rem + 1px);
  color: var(--color-text-secondary);
  line-height: 1.3;
}

/* Sidebar Brand Section */
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--color-border-soft);
  margin-bottom: 16px;
}
.desktop-sidebar.collapsed .sidebar-brand {
  display: none !important;
}
.brand-icon {
  font-size: calc(1.6rem + 1px);
}
.brand-text h3 {
  font-family: 'Outfit', sans-serif;
  font-size: calc(1.15rem + 1px);
  font-weight: 700;
  color: var(--color-text-primary);
  line-height: 1.2;
}
.brand-badge {
  font-size: calc(0.62rem + 1px);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--color-primary);
  background-color: var(--color-primary-soft);
  padding: 2px 6px;
  border-radius: 4px;
  display: inline-block;
  margin-top: 2px;
}

/* Sidebar Menu Navigation */
.sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 20px;
}
.desktop-sidebar.collapsed .sidebar-nav {
  display: none !important;
}
.menu-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.menu-label {
  font-size: calc(0.7rem + 1px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--color-text-muted);
  margin-bottom: 4px;
  padding-left: 10px;
}
.menu-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  border-radius: var(--radius-md);
  color: var(--color-text-secondary);
  font-family: inherit;
  font-size: calc(0.85rem + 1px);
  font-weight: 600;
  text-decoration: none;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  transition: var(--transition-fast);
}
.menu-item:hover {
  background-color: var(--color-bg-app);
  color: var(--color-text-primary);
}
.menu-item.active {
  background-color: var(--color-primary-soft);
  color: var(--color-primary);
}
.menu-icon {
  font-size: calc(1rem + 1px);
}

/* Sidebar Footer (Sair) */
.sidebar-footer {
  margin-top: auto;
  border-top: 1px solid var(--color-border-soft);
  padding-top: 12px;
  margin-bottom: 8px;
}
.desktop-sidebar.collapsed .sidebar-footer {
  display: none !important;
}
.btn-logout {
  color: var(--color-danger) !important;
}
.btn-logout:hover {
  background-color: var(--color-danger-soft) !important;
}

/* SaaS Topbar adjustments */
.topbar-title-wrapper h2 {
  font-family: 'Outfit', sans-serif;
  font-size: calc(1.4rem + 1px);
  font-weight: 600;
  color: var(--color-text-primary);
}
.topbar-actions-wrapper {
  display: flex;
  align-items: center;
  gap: 16px;
}
.btn-new-property {
  background-color: var(--color-success) !important;
  color: var(--color-text-inverse) !important;
  font-weight: 600;
}
.btn-new-property:hover {
  background-color: var(--color-success-text) !important;
}

/* Kanban Dashboard content */
.desktop-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 24px;
  overflow: hidden;
  background-color: var(--color-bg-page);
}

.dashboard-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.dashboard-header-row h2 {
  font-family: 'Outfit', sans-serif;
  font-size: calc(1.6rem + 1px);
  font-weight: 600;
  color: var(--color-text-primary);
}

/* Kanban Board Columns Layout */
.kanban-board {
  flex: 1;
  display: flex;
  gap: 16px;
  height: 100%;
  overflow-y: hidden;
  overflow-x: auto;
  align-items: stretch;
}

.kanban-column {
  background-color: var(--color-bg-app);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-lg);
  display: flex;
  flex-direction: column;
  min-width: 200px;
  flex: 1 1 0%;
  max-height: 100%;
  overflow: hidden;
  transition: min-width var(--transition-base), width var(--transition-base), flex-basis var(--transition-base), background-color var(--transition-base), border-color var(--transition-base);
}

.column-header {
  padding: 12px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: var(--border-light);
  border-top: 4px solid var(--color-text-muted);
  cursor: pointer;
  user-select: none;
  transition: background-color 0.2s ease;
}

.column-header:hover {
  background-color: rgba(15, 23, 42, 0.02);
}

/* Collapsed Column State */
.kanban-column.collapsed {
  min-width: 48px !important;
  width: 48px !important;
  flex: 0 0 48px !important;
  background-color: rgba(15, 23, 42, 0.01);
}

.kanban-column.collapsed .column-cards-list {
  display: none !important;
}

.kanban-column.collapsed .column-header {
  padding: 16px 4px !important;
  flex-direction: column !important;
  gap: 16px !important;
  border-bottom: none !important;
  height: 100% !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.kanban-column.collapsed .column-header h4 {
  writing-mode: vertical-rl !important;
  text-orientation: mixed !important;
  transform: rotate(180deg) !important;
  margin: 12px 0 !important;
  white-space: nowrap !important;
  font-size: calc(0.8rem + 1px) !important;
}

.kanban-column.collapsed .column-header .column-count {
  margin: 0 !important;
  padding: 2px 6px !important;
  font-size: calc(0.7rem + 1px) !important;
}

.column-header h4 {
  font-family: 'Outfit', sans-serif;
  font-size: calc(0.85rem + 1px);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.column-count {
  font-size: calc(0.75rem + 1px);
  font-weight: 600;
  color: var(--color-text-secondary);
  background: rgba(15, 23, 42, 0.05);
  padding: 2px 8px;
  border-radius: 10px;
  border: var(--border-light);
}

.column-sort-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--color-border-soft);
  background: rgba(255, 255, 255, 0.58);
}

.column-sort-label {
  flex: 0 0 auto;
  color: #7b8799;
  font-size: 14px;
}

.column-sort-select {
  min-width: 0;
  flex: 1 1 auto;
  height: 30px;
  padding: 0 25px 0 8px;
  border: 1px solid #dbe2ec;
  border-radius: 7px;
  color: #4a5870;
  background-color: #fff;
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
}

.column-sort-select:focus-visible,
.column-sort-direction:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.25);
  outline-offset: 1px;
}

.column-sort-direction {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #dbe2ec;
  border-radius: 7px;
  color: #52627a;
  background: #fff;
  cursor: pointer;
}

.column-sort-direction:disabled {
  opacity: 0.42;
  cursor: default;
}

.kanban-column.collapsed .column-sort-bar {
  display: none;
}

/* Column top border color categorization */
.status-reagendar { border-top-color: var(--color-warning); }
.status-reagendar h4 { color: var(--color-warning-text); }

.status-tentativa-contato { border-top-color: #0f9f83; }
.status-tentativa-contato h4 { color: #0f766e; }

.status-agendando { border-top-color: var(--color-info); }
.status-agendando h4 { color: var(--color-info-text); }

.status-pendentes { border-top-color: var(--color-primary); }
.status-pendentes h4 { color: var(--color-primary); }

.status-links { border-top-color: var(--color-danger); }
.status-links h4 { color: var(--color-danger-text); }

.status-finalizado { border-top-color: var(--color-success); }
.status-finalizado h4 { color: var(--color-success-text); }

.status-pagamento { border-top-color: var(--color-purple); }
.status-pagamento h4 { color: var(--color-purple-text); }

.status-cancelado { border-top-color: var(--color-text-soft); }
.status-cancelado h4 { color: var(--color-text-muted); }

.kcard-cancellation-badge {
  font-size: calc(0.72rem + 1px);
  color: hsl(215, 16%, 35%);
  background-color: hsl(215, 16%, 93%);
  border: 1px solid hsl(215, 16%, 86%);
  padding: 6px 10px;
  border-radius: 6px;
  margin-top: 6px;
  line-height: 1.4;
  word-break: break-word;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 4px;
}

.kcard-price-badge {
  font-size: calc(0.75rem + 1px);
  color: hsl(271, 81%, 35%);
  background-color: hsl(271, 81%, 95%);
  border: 1px solid hsl(271, 81%, 90%);
  padding: 4px 8px;
  border-radius: 6px;
  margin-top: 6px;
  display: inline-block;
  font-weight: 500;
  width: fit-content;
}


/* Column Cards List scroll container */
.column-cards-list {
  flex: 1;
  overflow-y: auto;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100px;
}

/* Scrollbar customization for columns list */
.column-cards-list::-webkit-scrollbar {
  width: 6px;
}
.column-cards-list::-webkit-scrollbar-thumb {
  background-color: rgba(15, 23, 42, 0.05);
  border-radius: 4px;
}
.column-cards-list::-webkit-scrollbar-thumb:hover {
  background-color: rgba(15, 23, 42, 0.1);
}

/* Kanban card styles */
.kanban-card {
  background-color: var(--color-bg-surface);
  border: var(--border-light);
  border-radius: var(--border-radius-sm);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: var(--transition-smooth);
  cursor: pointer;
  position: relative;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.02);
}

.kanban-card:hover {
  border-color: var(--color-primary);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
  background-color: var(--color-bg-surface);
}

.kcard-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}

.kcard-entry-date {
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  font-size: calc(0.85rem - 1px); /* 2px smaller than standard card font-size (0.85rem) */
  color: var(--color-primary);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.kcard-broker-highlight {
  font-family: 'Outfit', sans-serif;
  font-size: calc(0.95rem + 1px);
  font-weight: 700;
  color: var(--color-text-primary);
  letter-spacing: -0.2px;
}

.card-code-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: calc(0.75rem + 1px);
}


.kcard-code {
  font-family: 'Outfit', sans-serif;
  font-weight: 600;
  color: var(--color-text-primary);
}

.btn-copy-folder-card {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-primary);
  font-size: calc(0.72rem + 1px);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px 6px;
  border-radius: 4px;
  transition: var(--transition-smooth);
  outline: none;
}

.btn-copy-folder-card:hover {
  background-color: rgba(59, 130, 246, 0.1);
  color: var(--color-primary-hover);
}

.kcard-footer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: calc(0.75rem + 1px);
  margin-top: 4px;
  border-top: 1px solid rgba(15, 23, 42, 0.05);
  padding-top: 6px;
}

.kcard-dynamic-date {
  font-size: calc(0.75rem + 1px);
  color: var(--color-text-muted);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.kcard-address {
  font-size: calc(0.85rem + 1px);
  line-height: 1.3;
  color: var(--color-text-secondary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-top: 2px;
}

.kcard-address-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}

.kcard-address-row .kcard-address {
  flex: 1;
  min-width: 0;
}

.kcard-address-validated {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 3px;
  color: #15803d;
  font-size: 15px;
  line-height: 1;
}

.kcard-owner-row {
  font-size: calc(0.75rem + 1px);
  color: var(--color-text-muted);
  border-top: 1px solid rgba(15, 23, 42, 0.05);
  padding-top: 6px;
  margin-top: 4px;
}

.kcard-owner-row strong {
  color: var(--color-text-secondary);
}

.kcard-alert-badge {
  font-size: calc(0.7rem + 1px);
  font-weight: 600;
  color: var(--color-error);
  background: var(--color-error-bg);
  border: 1px solid var(--color-error-border);
  padding: 2px 6px;
  border-radius: 4px;
  margin-top: 4px;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

/* General Desktop Overlay & Centered Modal Sheets */
.overlay {
  position: fixed;
  align-items: center;
  justify-content: center;
}

.overlay-sheet {
  width: 90%;
  max-width: 800px;
  border-radius: var(--border-radius-md);
  border: var(--border-light);
  margin: auto;
  align-self: center;
  transform: translateY(30px);
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.15);
}

.overlay.active .overlay-sheet {
  transform: translateY(0);
  opacity: 1;
}

/* Modal Desktop Specific Sheet Override & Split Layout */
.edit-modal-sheet {
  max-width: 1100px !important;
  width: 90% !important;
  height: 85% !important;
  border-radius: var(--border-radius-md) !important;
  margin: auto;
  align-self: center;
  transform: translateY(30px);
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  flex-direction: row !important;
  overflow: hidden !important;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.15) !important;
  border: var(--border-light);
}

.overlay.active .edit-modal-sheet {
  transform: translateY(0);
  opacity: 1;
}

/* Creation Mode override for the reusable edit modal */
.edit-modal-sheet.creation-mode {
  max-width: 600px !important;
}
.edit-modal-sheet.creation-mode .modal-split-right {
  display: none !important;
}
.edit-modal-sheet.creation-mode .modal-split-left {
  border-right: none !important;
  flex: 1 !important;
}
.edit-modal-sheet.creation-mode #btn-delete-session {
  display: none !important;
}

/* Premium Header Button "Novo Imóvel" */
#btn-create-session {
  background-color: var(--color-success);
  color: white;
  border: none;
  font-weight: bold;
}
#btn-create-session:hover {
  background-color: var(--color-success-hover) !important;
  box-shadow: 0 0 10px rgba(16, 185, 129, 0.35) !important;
}

.billing-modal-sheet {
  max-width: 96vw !important;
  width: 96vw !important;
  height: 92vh !important;
  max-height: 92vh !important;
  border-radius: var(--border-radius-md) !important;
  margin: auto;
  align-self: center;
  transform: translateY(30px);
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.15) !important;
  border: var(--border-light);
}

.overlay.active .billing-modal-sheet {
  transform: translateY(0);
  opacity: 1;
}


.modal-split-left {
  flex: 1.2;
  display: flex;
  flex-direction: column;
  height: 100%;
  border-right: var(--border-light);
  overflow: hidden;
  background-color: var(--color-bg-base);
}

.modal-split-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: hsl(210, 20%, 94%);
  overflow: hidden;
  position: relative;
}

.edit-modal-footer {
  display: flex;
  gap: 16px;
  padding: 16px 20px;
  border-top: var(--border-light);
  background-color: rgba(255, 255, 255, 0.85);
}

/* WhatsApp Simulator Header */
.simulator-header {
  padding: 16px 20px;
  background-color: hsl(210, 20%, 92%);
  border-bottom: var(--border-light);
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 10;
}

.simulator-owner-info {
  display: flex;
  align-items: center;
  gap: 12px;
}

.simulator-avatar {
  width: 36px;
  height: 36px;
  background-color: rgba(15, 23, 42, 0.05);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(1.1rem + 1px);
}

.simulator-meta h4 {
  font-family: 'Outfit', sans-serif;
  font-size: calc(0.9rem + 1px);
  font-weight: 600;
  color: var(--color-text-primary);
  margin: 0;
}

.simulator-meta span {
  display: block;
  font-size: calc(0.7rem + 1px);
  color: var(--color-text-muted);
}

.simulator-actions {
  display: flex;
  gap: 6px;
}

.simulator-actions .btn-chat-action {
  background: rgba(15, 23, 42, 0.05);
  border: var(--border-light);
  color: var(--color-text-secondary);
  padding: 6px 10px;
  font-size: calc(0.75rem + 1px);
  border-radius: 6px;
  cursor: pointer;
  transition: var(--transition-smooth);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.simulator-actions .btn-chat-action:hover {
  background: rgba(15, 23, 42, 0.1);
  color: var(--color-text-primary);
  border-color: rgba(15, 23, 42, 0.2);
}

.simulator-actions #btn-rescue-chat {
  background-color: hsl(35, 92%, 95%);
  color: hsl(35, 92%, 40%);
  border: 1px solid hsl(35, 92%, 85%);
}

.simulator-actions #btn-rescue-chat:hover {
  background-color: hsl(35, 92%, 90%);
  color: hsl(35, 92%, 35%);
  border-color: hsl(35, 92%, 80%);
}


/* Chat Messages Area */
.simulator-chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background-image: 
    radial-gradient(rgba(59, 130, 246, 0.04) 1px, transparent 1px),
    radial-gradient(rgba(15, 23, 42, 0.02) 1px, transparent 1px);
  background-size: 20px 20px;
  background-color: hsl(210, 20%, 96%);
}

/* Chat message bubbles */
.chat-bubble {
  max-width: 80%;
  padding: 10px 14px;
  font-size: calc(0.8rem + 1px);
  line-height: 1.45;
  border-radius: 12px;
  position: relative;
  word-break: break-word;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

/* Owner message bubble (Sent by property owner - Right side green) */
.chat-bubble.owner {
  align-self: flex-end;
  background-color: var(--color-whatsapp);
  color: #fff;
  border-bottom-right-radius: 2px;
}

/* Bot message bubble (Sent by bot assistant - Left side dark grey) */
.chat-bubble.bot {
  align-self: flex-start;
  background-color: var(--color-bg-surface);
  color: var(--color-text-primary);
  border-bottom-left-radius: 2px;
  border: var(--border-light);
}

/* System message bubble (Centered, warnings or errors) */
.chat-bubble.system {
  align-self: center;
  background-color: hsl(0, 50%, 98%);
  color: hsl(0, 70%, 45%);
  border-radius: 8px;
  font-size: calc(0.75rem + 1px);
  border: 1px solid hsl(0, 50%, 93%);
  max-width: 90%;
  text-align: center;
  margin: 6px 0;
  box-shadow: none;
}
.chat-bubble.system .chat-bubble-time {
  color: hsl(0, 30%, 65%);
}

.chat-bubble-time {
  display: block;
  font-size: calc(0.65rem + 1px);
  color: rgba(255, 255, 255, 0.6);
  text-align: right;
  margin-top: 4px;
}

.chat-bubble.bot .chat-bubble-time {
  color: var(--color-text-muted);
}

/* Chat Input Bar */
.simulator-input-area {
  padding: 12px 20px;
  background-color: hsl(210, 20%, 92%);
  border-top: var(--border-light);
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
}

.simulator-input-area input {
  flex: 1;
  background-color: var(--color-bg-surface);
  border: var(--border-light);
  border-radius: 20px;
  padding: 8px 16px;
  color: var(--color-text-primary);
  font-family: inherit;
  font-size: calc(0.8rem + 1px);
  transition: var(--transition-smooth);
}

.simulator-input-area input:focus {
  outline: none;
  border-color: var(--color-whatsapp);
  background-color: #ffffff;
}

.simulator-input-buttons {
  display: flex;
  gap: 6px;
  align-items: center;
}

.simulator-input-buttons .btn {
  padding: 8px 16px;
  font-size: calc(0.75rem + 1px);
  font-weight: 600;
  border-radius: 20px;
  border: none;
  cursor: pointer;
  transition: var(--transition-smooth);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.btn-simulate-owner {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: var(--border-light) !important;
  color: var(--color-text-secondary) !important;
}

.btn-simulate-owner:hover {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

.btn-send-human {
  background-color: var(--color-whatsapp) !important;
  color: #fff !important;
}

.btn-send-human:hover {
  background-color: var(--color-whatsapp-hover) !important;
}

/* Bot Status Banner */
.bot-status-banner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 20px;
  background: rgba(30, 41, 59, 0.5);
  border-bottom: var(--border-light);
  font-size: calc(0.8rem + 1px);
  transition: var(--transition-smooth);
}

.bot-status-banner.active {
  background: rgba(16, 185, 129, 0.08);
}

.bot-status-banner.inactive {
  background: rgba(245, 158, 11, 0.08);
}

.bot-status-info {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
}

.bot-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  transition: var(--transition-smooth);
}

.bot-status-banner.active .bot-status-dot {
  background-color: var(--color-success);
  box-shadow: 0 0 8px var(--color-success);
}

.bot-status-banner.inactive .bot-status-dot {
  background-color: hsl(38, 92%, 50%);
  box-shadow: 0 0 8px hsl(38, 92%, 50%);
}

.btn-toggle-bot {
  background: rgba(255, 255, 255, 0.05);
  border: var(--border-light);
  color: var(--color-text-secondary);
  padding: 4px 12px;
  font-size: calc(0.75rem + 1px);
  border-radius: 20px;
  cursor: pointer;
  font-weight: 600;
  transition: var(--transition-smooth);
}

.btn-toggle-bot:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

.bot-status-banner.active .btn-toggle-bot {
  border-color: rgba(239, 68, 68, 0.3);
}
.bot-status-banner.active .btn-toggle-bot:hover {
  background: var(--color-error-bg);
  border-color: var(--color-error);
  color: #fff;
}

.bot-status-banner.inactive .btn-toggle-bot {
  border-color: rgba(16, 185, 129, 0.3);
}
.bot-status-banner.inactive .btn-toggle-bot:hover {
  background: rgba(16, 185, 129, 0.15);
  border-color: var(--color-success);
  color: #fff;
}

/* Simulator Inactive State Placeholder */
.simulator-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 40px;
  text-align: center;
  color: var(--color-text-muted);
  background-color: hsl(222, 47%, 4%);
}

.sim-placeholder-icon {
  font-size: calc(3rem + 1px);
  margin-bottom: 16px;
  opacity: 0.3;
  animation: pulse 3s infinite;
}

.simulator-placeholder h4 {
  font-family: 'Outfit', sans-serif;
  color: var(--color-text-secondary);
  font-size: calc(1.05rem + 1px);
  margin-bottom: 8px;
}

.simulator-placeholder p {
  font-size: calc(0.8rem + 1px);
  max-width: 240px;
  line-height: 1.4;
}

@keyframes pulse {
  0% { transform: scale(1); opacity: 0.3; }
  50% { transform: scale(1.05); opacity: 0.5; }
  100% { transform: scale(1); opacity: 0.3; }
}

.btn-secondary {
  background-color: rgba(255, 255, 255, 0.05);
  border: var(--border-light);
  color: var(--color-text-secondary);
}

.btn-secondary:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: #fff;
}

.btn-danger {
  background-color: var(--color-error);
  color: #fff;
  border: none;
}

.btn-danger:hover {
  background-color: hsl(358, 80%, 45%);
}

/* Form Layout inside Modal */
.edit-form-grid {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.form-section-title {
  font-family: 'Outfit', sans-serif;
  font-size: calc(0.75rem + 1px);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--color-primary);
  letter-spacing: 1px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  padding-bottom: 4px;
  margin-top: 8px;
}

.form-group-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.form-group-triple {
  display: grid;
  grid-template-columns: 1.2fr 1fr 0.8fr;
  gap: 16px;
}

.textarea-short {
  height: 60px;
  resize: none;
  font-family: inherit;
  font-size: calc(0.9rem + 1px);
  line-height: 1.4;
}

.select-input {
  height: 42px;
  padding: 0 10px;
  background-color: var(--color-bg-surface);
  color: var(--color-text-primary);
  cursor: pointer;
}

.select-input option {
  background-color: var(--color-bg-surface);
  color: var(--color-text-primary);
}

.status-color-select {
  position: relative;
  width: 100%;
  min-width: 0;
}

.status-color-select .status-select-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
  clip-path: inset(50%);
}

.status-color-select .status-select-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-inline: 9px;
  text-align: left;
  appearance: none;
}

.status-select-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: var(--status-dot-color);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--status-dot-color) 16%, transparent);
}

.status-select-dot[hidden] {
  display: none;
}

.status-select-label {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.status-select-chevron {
  flex: 0 0 auto;
  color: var(--color-text-muted);
  font-size: 17px;
  transition: transform 150ms ease;
}

.status-color-select.open .status-select-chevron {
  transform: rotate(180deg);
}

.status-select-menu {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  z-index: 260;
  width: max(100%, 220px);
  max-height: 280px;
  overflow-y: auto;
  padding: 4px;
  border: 1px solid var(--color-border-soft);
  border-radius: 8px;
  background: var(--color-bg-surface);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
  font-family: inherit;
  font-size: calc(0.9rem + 1px);
}

.status-select-menu[hidden] {
  display: none;
}

.status-select-option {
  width: 100%;
  min-height: 34px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 9px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--color-text-primary);
  font: inherit;
  line-height: 1.25;
  text-align: left;
  cursor: pointer;
}

.status-select-option:hover,
.status-select-option:focus-visible {
  background: rgba(37, 99, 235, 0.08);
  outline: none;
}

.status-select-option.selected {
  background: rgba(37, 99, 235, 0.12);
  color: #1d4ed8;
  font-weight: 600;
}

/* Desktop Toast System */
#desktop-toast-container {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 320px;
  pointer-events: none;
}

/* WhatsApp Web buttons */
.btn-whatsapp {
  background-color: #25d366 !important;
  color: white !important;
  font-weight: 600;
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out, transform 0.2s ease-in-out;
  border: none;
  box-shadow: 0 2px 6px rgba(37, 211, 102, 0.15);
}
.btn-whatsapp:hover {
  background-color: #20ba5a !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
}
.btn-whatsapp:active {
  transform: translateY(0);
}

/* Billing modal table and scrolling styles */
.billing-table-wrapper {
  border: var(--border-light);
  border-radius: var(--border-radius-sm);
  background: #fff;
  box-shadow: var(--shadow-premium);
  overflow: auto; /* Enable both horizontal and vertical scrolling */
  flex: 1;
  min-height: 200px; /* Prevent being squished too much on small viewports */
}

.billing-table-wrapper table th {
  position: sticky;
  top: 0;
  background-color: hsl(210, 20%, 96%) !important;
  z-index: 10;
  box-shadow: inset 0 -1px 0 rgba(15, 23, 42, 0.08); /* Preserves table border under sticky th */
}
/* Print styles for Landscape PDF Export */
@media print {
  /* Set page to landscape orientation with margins */
  @page {
    size: landscape;
    margin: 1cm;
  }

  /* Hide everything on the page */
  body * {
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
  }

  /* Make sure the billing overlay and its children are visible */
  #billing-modal-overlay,
  #billing-modal-overlay * {
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
  }

  /* Reset overlay display to standard block layout for printing */
  #billing-modal-overlay {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: auto !important;
    background: #ffffff !important;
    padding: 0 !important;
    display: block !important;
    border: none !important;
  }

  /* Reset sheet styling for printing */
  #billing-modal-overlay .billing-modal-sheet {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    border: none !important;
    box-shadow: none !important;
    background: #ffffff !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
    overflow: visible !important;
    transform: none !important;
    opacity: 1 !important;
  }

  /* Reset body styling for print scrolling */
  #billing-modal-overlay .overlay-body {
    padding: 0 !important;
    overflow-y: visible !important;
    display: block !important;
    gap: 0 !important;
  }

  /* Reset table wrapper styling for print */
  #billing-modal-overlay .billing-table-wrapper {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    border: none !important;
    box-shadow: none !important;
    display: block !important;
  }

  /* Hide controls: header close button, description text, filter filters-row, and actions footer */
  #btn-close-billing,
  #billing-modal-overlay .overlay-body > p,
  #billing-filters-row,
  #billing-actions-footer {
    display: none !important;
  }

  /* Table style fixes for print */
  #billing-modal-overlay table {
    width: 100% !important;
    min-width: 100% !important;
    border-collapse: collapse !important;
    margin-top: 10px !important;
  }

  #billing-modal-overlay th,
  #billing-modal-overlay td {
    border: 1px solid #cbd5e1 !important;
    padding: 8px 10px !important;
    font-size: calc(0.8rem + 1px) !important;
    color: #000000 !important;
  }

  #billing-modal-overlay th {
    background-color: #f1f5f9 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Totals block style for print */
  #billing-totals-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border: 1px solid #cbd5e1 !important;
    background-color: #f8fafc !important;
    padding: 12px 16px !important;
    margin-top: 15px !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
}

.sortable-header {
  cursor: pointer;
  user-select: none;
  transition: background-color 0.2s ease;
}
.sortable-header:hover {
  background-color: rgba(15, 23, 42, 0.08) !important;
}
.sortable-header .sort-icon {
  display: inline-block;
  margin-left: 6px;
  font-size: calc(0.75rem + 1px);
  font-weight: bold;
}

/* ============================
   Annual Report Styles
   ============================ */

.annual-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.annual-kpi-card {
  background: var(--kpi-bg, rgba(59, 130, 246, 0.08));
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 12px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
  overflow: hidden;
}

.annual-kpi-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--kpi-color, hsl(215, 70%, 50%));
  border-radius: 12px 12px 0 0;
}

.annual-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}

.annual-kpi-icon {
  font-size: calc(1.4rem + 1px);
  line-height: 1;
}

.annual-kpi-label {
  font-size: calc(0.72rem + 1px);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--color-text-secondary);
}

.annual-kpi-value {
  font-family: 'Outfit', sans-serif;
  font-size: calc(1.4rem + 1px);
  font-weight: 700;
  color: var(--kpi-color, var(--color-text-primary));
  line-height: 1.1;
}

/* Annual table wrapper */
.annual-table-wrapper {
  overflow-x: auto;
  min-height: 100%;
}

.annual-table-wrapper table th {
  position: sticky;
  top: 0;
  background-color: hsl(210, 20%, 96%) !important;
  z-index: 10;
  box-shadow: inset 0 -1px 0 rgba(15, 23, 42, 0.08);
}

/* Quinzena data row */
.annual-row-quinzena td {
  padding: 11px 16px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.04);
  color: var(--color-text-secondary);
  font-size: calc(0.85rem + 1px);
  transition: background 0.15s ease;
}

.annual-row-quinzena:hover td {
  background: rgba(15, 23, 42, 0.02);
}

/* Month subtotal row */
.annual-row-month-total td {
  padding: 10px 16px;
  background: rgba(15, 23, 42, 0.035);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  border-bottom: 2px solid rgba(15, 23, 42, 0.10);
  font-weight: 700;
  font-size: calc(0.83rem + 1px);
  color: var(--color-text-primary);
}

/* Annual grand total row */
.annual-row-grand-total td {
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(16,185,129,0.07), rgba(59,130,246,0.05));
  border-top: 2px solid rgba(16, 185, 129, 0.3);
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  font-size: calc(0.95rem + 1px);
  color: var(--color-text-primary);
}

/* Month separator row */
.annual-row-month-header td {
  padding: 8px 16px 6px;
  background: rgba(15, 23, 42, 0.02);
  border-top: 1px solid rgba(15, 23, 42, 0.06);
  font-size: calc(0.7rem + 1px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--color-primary);
}

/* Badge pills for status column */
.annual-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: calc(0.72rem + 1px);
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 20px;
  white-space: nowrap;
}
.annual-badge.paid    { background: rgba(16,185,129,0.12); color: hsl(158,82%,35%); }
.annual-badge.pending { background: rgba(139,92,246,0.12); color: hsl(271,81%,56%); }
.annual-badge.partial { background: rgba(245,158,11,0.12); color: hsl(35,92%,40%); }
.annual-badge.empty   { background: rgba(100,116,139,0.1); color: hsl(215,16%,55%); }

/* Search inline next to header buttons */
.dashboard-header-search {
  width: 320px;
  margin-right: 8px;
}

.search-input-wrapper {
  position: relative;
  width: 100%;
  max-width: 450px;
  display: flex;
  align-items: center;
}

.search-input-wrapper .search-icon {
  position: absolute;
  left: 14px;
  color: var(--color-text-muted);
  font-size: calc(0.95rem + 1px);
  pointer-events: none;
  transition: color 0.2s ease;
}

.search-input-wrapper input {
  width: 100%;
  padding: 10px 38px 10px 38px;
  font-size: calc(0.9rem + 1px);
  border-radius: 8px;
  border: 1px solid rgba(15, 23, 42, 0.15);
  background-color: var(--color-bg-surface);
  color: var(--color-text-primary);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
  font-family: inherit;
}

.search-input-wrapper input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
  background-color: #ffffff;
}

.search-input-wrapper input:focus ~ .search-icon {
  color: var(--color-primary);
}

.search-input-wrapper #btn-clear-search {
  position: absolute;
  right: 14px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-text-muted);
  font-size: calc(0.9rem + 1px);
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s ease, transform 0.2s ease;
}

.search-input-wrapper #btn-clear-search:hover {
  color: var(--color-text-primary);
  transform: scale(1.15);
}

.kcard-whatsapp-badge {
  background-color: hsl(142, 70%, 93%);
  color: var(--color-success);
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 600;
  font-size: calc(0.72rem + 1px);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
}

.btn-icon-only {
  width: 32px;
  height: 32px;
  min-width: 32px;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.btn-icon-only svg {
  width: 16px;
  height: 16px;
  display: block;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.icon-spin {
  animation: spin 1s linear infinite;
}/* Typography & Font overrides (Inter-first styling) */
body, button, input, select, textarea, table, th, td, h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', sans-serif !important;
}

/* Sidebar Menu Font Weights (Finer typography) */
.sidebar-nav .menu-item {
  font-weight: 500 !important; /* Mais leve/regular conforme mockup */
  font-size: calc(0.85rem + 1px);
}
.sidebar-nav .menu-label {
  font-weight: 600 !important;
  color: var(--color-text-muted);
  font-size: calc(0.68rem + 1px);
  letter-spacing: 0.8px;
}
.sidebar-brand h3 {
  font-weight: 700 !important;
  font-size: calc(1.1rem + 1px);
}

/* SPA Overlay Panels */
.overlay.im-spa-panel {
  position: fixed;
  left: 320px; /* Largura da sidebar */
  top: 0;
  right: 0;
  bottom: 0;
  width: auto;
  height: 100vh;
  background-color: var(--color-bg-page) !important;
  backdrop-filter: none !important;
  z-index: 90;
  display: flex;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.overlay.im-spa-panel.active {
  opacity: 1;
  pointer-events: auto;
}

/* Responsivo para quando a sidebar estiver colapsada */
body:has(#desktop-sidebar.collapsed) .overlay.im-spa-panel {
  left: 0px !important;
}

/* SPA Overlay Sheet reset */
.overlay.im-spa-panel .overlay-sheet {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background-color: var(--color-bg-page) !important;
  transform: none !important; /* Remove efeito slide vertical */
  padding: 24px 32px;
}

/* Header style for SPA panels */
.overlay.im-spa-panel .overlay-header {
  padding: 16px 0 20px 0;
  border-bottom: 1px solid var(--color-border-soft);
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  gap: 20px;
  background: transparent;
  width: 100%;
}

.overlay.im-spa-panel .overlay-header h3 {
  font-family: 'Inter', sans-serif !important;
  font-size: calc(1.5rem + 1px) !important;
  font-weight: 700 !important;
  color: var(--color-text-primary);
  margin: 0 !important;
  order: 2;
}

.overlay.im-spa-panel .overlay-header .overlay-status-tag {
  order: 3;
  margin-left: 0;
}

/* Transformação do botão fechar para Voltar retangular */
.overlay.im-spa-panel .btn-close {
  order: 1;
  background-color: var(--color-surface-primary) !important;
  border: 1px solid var(--color-border-soft) !important;
  color: var(--color-text-secondary) !important;
  padding: 8px 16px !important;
  border-radius: var(--radius-md) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: calc(0.85rem + 1px) !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  height: auto !important;
  position: static !important;
  transform: none !important;
  box-shadow: var(--shadow-xs) !important;
  cursor: pointer;
  transition: var(--transition-fast);
}

.overlay.im-spa-panel .btn-close::before {
  content: "← Voltar";
}

.overlay.im-spa-panel .btn-close svg {
  display: none !important; /* Oculta o ícone X */
}

.overlay.im-spa-panel .btn-close:hover {
  background-color: var(--color-bg-app) !important;
  color: var(--color-text-primary) !important;
  border-color: var(--color-border-intense) !important;
}

/* Breadcrumbs */
.im-breadcrumb {
  font-family: 'Inter', sans-serif;
  font-size: calc(0.7rem + 1px);
  font-weight: 600;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-bottom: 2px;
}

/* Quadro Geral desktop — Kanban operacional */
:root {
  --desktop-sidebar-width: 240px;
  --desktop-border: #e3e7ef;
  --desktop-navy: #14213d;
  --desktop-muted: #667085;
  --desktop-blue: #1677ff;
  --desktop-shadow-card: 0 1px 2px rgba(16, 26, 54, 0.018), 0 3px 8px rgba(16, 26, 54, 0.022);
}

@media (min-width: 1024px) {
  body {
    background: #f7f9fc;
    color: var(--desktop-navy);
  }

  .desktop-container,
  .im-content {
    height: 100dvh;
    min-height: 0;
    background: #f7f9fc;
  }

  .desktop-sidebar {
    width: var(--desktop-sidebar-width);
    min-width: var(--desktop-sidebar-width);
    height: 100dvh;
    padding: 16px;
    overflow: visible;
    background: #fff;
    border-right: 1px solid var(--desktop-border);
    transition: width 180ms ease, min-width 180ms ease, padding 180ms ease, border-color 180ms ease;
  }

  .desktop-sidebar.collapsed {
    width: 0;
    min-width: 0;
  }

  .sidebar-brand {
    min-height: 48px;
    gap: 9px;
    padding: 2px 8px 14px;
    margin-bottom: 12px;
    border-bottom: 1px solid #eef1f5;
  }

  .brand-icon {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: #fff;
    background: var(--desktop-blue);
    font-size: 17px;
  }

  .sidebar-brand h3,
  .brand-text h3 {
    margin: 0;
    font-size: 15px !important;
    line-height: 1.2;
    color: var(--desktop-navy);
  }

  .brand-badge {
    display: none;
  }

  .sidebar-scroll-container {
    width: 208px;
    height: auto;
    min-height: 0;
    flex: 1 1 auto;
    scrollbar-width: thin;
    scrollbar-color: #d9dee8 transparent;
  }

  .sidebar-nav {
    gap: 20px;
    margin: 0;
  }

  .menu-group {
    gap: 2px;
  }

  .sidebar-nav .menu-label {
    padding: 0 10px;
    margin: 0 0 5px;
    color: #8a94a6;
    font-size: 11px;
    font-weight: 700 !important;
    letter-spacing: 0.07em;
  }

  .sidebar-nav .menu-item,
  .sidebar-footer .menu-item {
    min-height: 36px;
    padding: 8px 10px;
    gap: 10px;
    border-radius: 7px;
    color: #526077;
    font-size: 13px;
    font-weight: 500 !important;
    line-height: 1.2;
    transition: background-color 150ms ease, color 150ms ease;
  }

  .sidebar-nav .menu-item:hover,
  .sidebar-footer .menu-item:hover {
    background: #f4f7fb;
    color: #27364e;
  }

  .sidebar-nav .menu-item.active {
    color: #1677ff;
    background: #edf5ff;
    font-weight: 600 !important;
  }

  .menu-icon {
    width: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    flex: 0 0 18px;
  }

  .sidebar-footer {
    padding-top: 10px;
    margin: 10px 0 0;
    border-top: 1px solid #eef1f5;
  }

  .sidebar-online {
    min-height: 34px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 6px 11px;
    color: #526077;
    font-size: 13px;
    font-weight: 500;
  }

  .status-dot.online {
    width: 7px;
    height: 7px;
    background: #22c55e;
    box-shadow: 0 0 0 3px #e9f9ef;
  }

  .btn-logout {
    color: #e5484d !important;
  }

  .sidebar-toggle-btn {
    top: 82px;
    width: 24px;
    height: 32px;
    border-radius: 0 7px 7px 0;
    border: 1px solid var(--desktop-border);
    border-left: 0;
    box-shadow: none;
    color: #8490a3;
    font-size: 17px;
    transform: none;
  }

  .sidebar-toggle-btn:hover {
    color: #1677ff;
    background: #f4f8ff;
    border-color: #cfe2ff;
    box-shadow: none;
    transform: none;
  }

  .desktop-header {
    height: 84px;
    min-height: 84px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 20px;
    background: #fff !important;
    border-bottom: 1px solid var(--desktop-border) !important;
  }

  .topbar-title-wrapper {
    min-width: 235px;
    flex: 0 0 auto;
  }

  .topbar-title-wrapper h1 {
    margin: 0;
    color: var(--desktop-navy);
    font-size: 23px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.025em;
    white-space: nowrap;
  }

  .dashboard-header-search {
    flex: 1 1 420px;
    min-width: 240px;
    max-width: 560px;
    margin: 0;
  }

  .search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
  }

  .search-input-wrapper .search-icon {
    left: 14px;
    color: #8b95a7;
    font-size: 18px;
  }

  .search-input-wrapper input,
  .search-input-wrapper input.text-input {
    height: 44px;
    padding: 0 42px 0 40px;
    border: 1px solid var(--desktop-border);
    border-radius: 9px;
    background: #fff;
    box-shadow: none;
    color: #24324a;
    font-size: 14px;
    font-weight: 400;
    transition: border-color 150ms ease, box-shadow 150ms ease;
  }

  .search-input-wrapper input::placeholder {
    color: #98a2b3;
  }

  .search-input-wrapper input:focus {
    border-color: #79aefd;
    box-shadow: 0 0 0 3px rgba(22, 119, 255, 0.09);
  }

  .search-input-wrapper #btn-clear-search {
    right: 10px;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    color: #8792a4;
    background: transparent;
    font-size: 17px;
  }

  .search-input-wrapper #btn-clear-search:hover {
    color: #334155;
    background: #f3f5f8;
    transform: none;
  }

  .search-input-wrapper #btn-clear-search[hidden] {
    display: none;
  }

  .topbar-right-wrapper {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
  }

  .header-secondary-btn,
  .sync-status-btn,
  .header-icon-btn,
  #btn-create-session {
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 12px;
    border: 1px solid var(--desktop-border);
    border-radius: 8px;
    background: #fff;
    color: #44516a;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: none;
    transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease;
  }

  .header-secondary-btn:hover,
  .header-icon-btn:hover {
    border-color: #b9d3fa;
    color: #1677ff;
    background: #f7faff;
  }

  .header-secondary-btn.has-active-filters {
    color: #1677ff;
    border-color: #9fc5ff;
    background: #f3f8ff;
  }

  .filter-control {
    position: relative;
  }

  .filter-count {
    min-width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    border-radius: 999px;
    color: #fff;
    background: #1677ff;
    font-size: 11px;
    line-height: 1;
  }

  .filter-count[hidden] {
    display: none;
  }

  .filter-popover {
    position: absolute;
    top: calc(100% + 9px);
    right: 0;
    z-index: 120;
    width: 280px;
    padding: 15px;
    border: 1px solid var(--desktop-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(16, 26, 54, 0.12);
  }

  .filter-popover[hidden] {
    display: none;
  }

  .filter-popover-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 13px;
    color: var(--desktop-navy);
    font-size: 14px;
  }

  .filter-popover label {
    display: block;
    margin: 10px 0 5px;
    color: #68758a;
    font-size: 12px;
    font-weight: 600;
  }

  .filter-popover select.text-input,
  .filter-popover .status-select-trigger {
    width: 100%;
    height: 38px;
    padding: 0 9px;
    border: 1px solid var(--desktop-border);
    border-radius: 7px;
    background: #fff;
    color: #354259;
    font-size: 13px;
  }

  .filter-popover .status-select-menu {
    font-size: 13px;
  }

  .icon-button,
  .filter-reset-btn {
    border: 0;
    background: transparent;
    color: #6b778c;
    cursor: pointer;
  }

  .icon-button {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    font-size: 18px;
  }

  .filter-reset-btn {
    width: 100%;
    margin-top: 14px;
    padding: 9px 10px;
    border-radius: 7px;
    color: #1677ff;
    background: #f1f7ff;
    font-size: 13px;
    font-weight: 600;
  }

  .sync-status-btn {
    border-color: transparent;
    color: #269966;
    background: transparent;
    font-weight: 500;
  }

  .evolution-status-indicator {
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #7b8799;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: color 150ms ease, background-color 150ms ease;
  }

  .evolution-status-indicator:hover {
    background: #f7faff;
  }

  .evolution-status-indicator.is-checking {
    color: #64748b;
  }

  .evolution-status-indicator.is-checking i {
    animation: spin 900ms linear infinite;
  }

  .evolution-status-indicator.is-online {
    color: #159455;
  }

  .evolution-status-indicator.is-offline,
  .evolution-status-indicator.is-not-configured {
    color: #d14343;
  }

  .evolution-status-indicator i {
    font-size: 16px;
  }

  .sync-status-btn:hover {
    color: #1677ff;
    background: #f7faff;
  }

  .sync-status-btn.is-syncing i,
  .header-icon-btn.is-loading i {
    animation: spin 900ms linear infinite;
  }

  .sync-status-btn.has-sync-error {
    color: #e5484d;
  }

  .header-icon-btn {
    width: 42px;
    padding: 0;
    font-size: 18px;
  }

  #btn-create-session,
  #btn-create-session.btn-new-property {
    padding: 0 15px;
    border-color: #1677ff;
    background: #1677ff !important;
    color: #fff !important;
    font-weight: 600;
  }

  #btn-create-session:hover {
    border-color: #0868e0;
    background: #0868e0 !important;
    box-shadow: none !important;
  }

  .desktop-content {
    min-height: 0;
    padding: 16px 20px 20px;
    background: #f7f9fc;
  }

  .kanban-board {
    min-width: 0;
    min-height: 0;
    height: 100%;
    gap: 14px;
    align-items: stretch;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 2px 10px 0;
    scrollbar-width: thin;
    scrollbar-color: #cad2df transparent;
    scroll-snap-type: x proximity;
  }

  .kanban-board::-webkit-scrollbar {
    height: 8px;
  }

  .kanban-board::-webkit-scrollbar-thumb {
    border: 2px solid #f7f9fc;
    border-radius: 999px;
    background: #cbd3df;
  }

  .kanban-column {
    min-width: 300px;
    width: clamp(300px, 22vw, 326px);
    flex: 0 0 clamp(300px, 22vw, 326px);
    max-height: 100%;
    overflow: hidden;
    scroll-snap-align: start;
    border: 1px solid var(--desktop-border);
    border-radius: 14px;
    background: #f3f5f8;
    box-shadow: none;
    transition: border-color 150ms ease, background-color 150ms ease;
  }

  .kanban-column.is-filtered-out {
    display: none;
  }

  .column-header {
    position: relative;
    min-height: 50px;
    padding: 13px 13px 11px;
    border-top-width: 3px;
    border-bottom: 1px solid var(--desktop-border);
    background: rgba(255, 255, 255, 0.72);
    cursor: pointer;
  }

  .column-header:hover {
    background: rgba(255, 255, 255, 0.92);
  }

  .column-header h4 {
    margin: 0;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 0.035em;
  }

  .column-count {
    min-width: 24px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 7px;
    border: 1px solid #e2e7ef;
    border-radius: 999px;
    color: #657187;
    background: #f3f5f8;
    font-size: 12px;
    font-weight: 600;
  }

  .status-reagendar { border-top-color: #f59e0b; background: #fffaf0; }
  .status-reagendar h4 { color: #d97706; }
  .status-tentativa-contato { border-top-color: #0f9f83; background: #f0fdfa; }
  .status-tentativa-contato h4 { color: #0f766e; }
  .status-agendando { border-top-color: #2563eb; background: #f4f8ff; }
  .status-agendando h4 { color: #2563eb; }
  .status-pendentes { border-top-color: #1d4ed8; background: #f4f7ff; }
  .status-pendentes h4 { color: #1d4ed8; }
  .status-links { border-top-color: #ef4444; background: #fff7f7; }
  .status-links h4 { color: #ef4444; }
  .status-pagamento { border-top-color: #8b5cf6; background: #faf8ff; }
  .status-pagamento h4 { color: #7c3aed; }
  .status-finalizado { border-top-color: #16a34a; background: #f5fcf7; }
  .status-finalizado h4 { color: #16a34a; }
  .status-cancelado { border-top-color: #64748b; background: #f7f8fa; }
  .status-cancelado h4 { color: #64748b; }

  .column-cards-list {
    min-height: 0;
    padding: 10px;
    gap: 10px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #d5dbe5 transparent;
  }

  .column-cards-list::-webkit-scrollbar {
    width: 6px;
  }

  .column-cards-list::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: #d5dbe5;
  }

  .kanban-card {
    flex: 0 0 auto;
    gap: 0;
    padding: 13px;
    overflow: visible;
    border: 1px solid #e1e6ee;
    border-radius: 12px;
    background: #fff;
    box-shadow: var(--desktop-shadow-card);
    outline: none;
    transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
  }

  .kanban-card:hover,
  .kanban-card:focus-visible {
    border-color: #b9d3fa;
    background: #fff;
    box-shadow: 0 2px 10px rgba(16, 26, 54, 0.06);
    transform: translateY(-1px);
  }

  .kanban-card.reminder-active,
  .kanban-card.reminder-active:hover {
    border-color: #efc9c5;
    background: #fff;
    box-shadow: var(--desktop-shadow-card);
  }

  .kanban-card:focus-visible {
    box-shadow: 0 0 0 3px rgba(22, 119, 255, 0.12);
  }

  .kcard-header-row {
    min-height: 24px;
    margin: 0 0 1px;
    align-items: flex-start;
  }

  .kcard-time {
    color: #2f5ea8;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 700;
  }

  .kcard-menu-wrap {
    position: relative;
    margin: -5px -5px 0 0;
  }

  .kcard-menu-trigger,
  .kcard-action {
    border: 0;
    background: transparent;
    cursor: pointer;
  }

  .kcard-menu-trigger {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    color: #8a94a6;
    font-size: 18px;
  }

  .kcard-menu-trigger:hover {
    color: #3f4c62;
    background: #f1f4f8;
  }

  .kcard-actions-menu {
    position: absolute;
    top: 30px;
    right: 0;
    z-index: 20;
    min-width: 150px;
    padding: 5px;
    border: 1px solid var(--desktop-border);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(16, 26, 54, 0.13);
  }

  .kcard-actions-menu[hidden] {
    display: none;
  }

  .kcard-actions-menu button {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 9px;
    border: 0;
    border-radius: 6px;
    color: #3d4b62;
    background: transparent;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
  }

  .kcard-actions-menu button:hover {
    background: #f3f6fa;
  }

  .kcard-broker-highlight {
    display: block;
    margin: 0 0 11px;
    color: var(--desktop-navy);
    font-size: 16px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -0.01em;
  }

  .kcard-address {
    display: block;
    margin: 0 0 3px;
    overflow: visible;
    color: #4f5e74;
    font-size: 13px;
    line-height: 1.42;
    font-weight: 500;
    -webkit-line-clamp: unset;
  }

  .kcard-address-row {
    align-items: flex-start;
    margin: 0 0 3px;
  }

  .kcard-address-row .kcard-address {
    margin-bottom: 0;
  }

  .kcard-address-validated {
    margin-top: 2px;
    color: #15803d;
    font-size: 15px;
  }

  .kcard-complement {
    margin-bottom: 9px;
    color: #7a8699;
    font-size: 12px;
    line-height: 1.4;
  }

  .kcard-meta-row {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    color: #68758a;
    font-size: 12px;
    line-height: 1.35;
  }

  .kcard-code {
    flex: 0 0 auto;
    color: #5d6b80;
    font-size: 12px;
    font-weight: 600;
  }

  .meta-separator {
    color: #b5bdc9;
  }

  .kcard-owner-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .btn-copy-folder-card {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;
    justify-content: center;
    margin-left: auto;
    padding: 0;
    border-radius: 6px;
    color: #1677ff;
    font-size: 15px;
  }

  .btn-copy-folder-card:hover {
    color: #0868e0;
    background: #edf5ff;
  }

  .kcard-schedule-row {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 8px;
    color: #657187;
    font-size: 12px;
    line-height: 1.4;
  }

  .kcard-schedule-row > i {
    color: #4c8ee8;
    font-size: 14px;
  }

  .kcard-last-contact-row {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 6px;
    color: #52627a;
    font-size: 12px;
    line-height: 1.4;
  }

  .kcard-last-contact-row > i {
    color: #16a34a;
    font-size: 14px;
  }

  .kcard-last-contact-row strong {
    font-weight: 700;
  }

  .kcard-last-contact-row.is-empty {
    color: #8a94a6;
  }

  .kcard-inline-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
  }

  .kcard-inline-badges:empty {
    display: none;
  }

  .kcard-properties-badge,
  .kcard-price-badge,
  .kcard-whatsapp-badge,
  .kcard-bot-badge,
  .kcard-followup-badge {
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 7px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 600;
    white-space: nowrap;
  }

  .kcard-properties-badge {
    margin-top: 7px;
    color: #276b8b;
    background: #edf8fd;
    border-color: #d7edf7;
  }

  .kcard-price-badge {
    width: auto;
    margin: 7px 0 0;
    color: #7c3aed;
    background: #f5f0ff;
    border-color: #e9ddff;
  }

  .kcard-whatsapp-badge {
    min-height: 19px;
    margin: 0 0 0 auto;
    padding: 2px 6px;
    color: #168a4d;
    background: #eefbf4;
    border-color: #d9f3e4;
  }

  .kcard-alert-badge,
  .kcard-reminder-badge,
  .kcard-cancellation-badge,
  .kcard-followup-detail-badge {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 8px;
    padding: 7px 8px;
    overflow: hidden;
    border-radius: 7px;
    text-align: left;
    white-space: normal;
    color: #9a5b0b;
    background: #fff8e8;
    border: 1px solid #f7e5bb;
    font-size: 11.5px;
    line-height: 1.38;
    font-weight: 500;
  }

  .kcard-alert-badge span,
  .kcard-reminder-badge span,
  .kcard-cancellation-badge span,
  .kcard-followup-detail-badge span {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }

  .kcard-reminder-badge.active {
    color: #b44a42;
    background: #fff1f0;
    border-color: #f5d3d0;
  }

  .kcard-reminder-badge.pending,
  .kcard-followup-detail-badge {
    color: #8b6413;
    background: #fff9eb;
    border-color: #f3e3b5;
  }

  .kcard-cancellation-badge {
    color: #58677c;
    background: #f1f4f7;
    border-color: #e0e5eb;
  }

  .kcard-footer-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid #edf0f4;
    font-size: 12px;
  }

  .kcard-automation,
  .kcard-quick-actions {
    display: flex;
    align-items: center;
    gap: 5px;
  }

  .kcard-automation {
    min-width: 0;
    flex-wrap: wrap;
  }

  .kcard-bot-badge,
  .kcard-followup-badge {
    border: 0;
    cursor: pointer;
  }

  .kcard-bot-badge.active,
  .kcard-followup-badge.active {
    color: #168a4d;
    background: #eefbf4;
  }

  .kcard-bot-badge.inactive,
  .kcard-followup-badge.inactive {
    color: #d04a4f;
    background: #fff0f1;
  }

  .kcard-action {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    color: #20a568;
    background: #f0faf5;
    font-size: 16px;
    text-decoration: none;
  }

  .kcard-action:hover {
    color: #0b8751;
    background: #e2f7ec;
  }

  .column-state {
    min-height: 132px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    border: 1px dashed #d8dee8;
    border-radius: 10px;
    color: #8590a2;
    background: rgba(255, 255, 255, 0.44);
    font-size: 12px;
    line-height: 1.45;
    text-align: center;
  }

  .column-state i {
    font-size: 21px;
  }

  .column-state button {
    border: 0;
    color: #1677ff;
    background: transparent;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
  }

  .column-state-error {
    color: #b44a42;
    border-color: #f0ccc9;
    background: #fff8f7;
  }

  .card-skeleton {
    pointer-events: none;
  }

  .card-skeleton span {
    height: 10px;
    display: block;
    margin-bottom: 10px;
    border-radius: 5px;
    background: linear-gradient(90deg, #eef1f5 25%, #f7f8fa 50%, #eef1f5 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.3s ease-in-out infinite;
  }

  .card-skeleton span:nth-child(1) { width: 34%; }
  .card-skeleton span:nth-child(2) { width: 58%; height: 13px; }
  .card-skeleton span:nth-child(3) { width: 90%; }
  .card-skeleton span:nth-child(4) { width: 72%; }

  .kanban-column.collapsed {
    min-width: 48px;
    flex-basis: 48px;
  }

  .overlay.im-spa-panel {
    left: var(--desktop-sidebar-width);
  }

  body:has(#desktop-sidebar.collapsed) .overlay.im-spa-panel {
    left: 0;
  }
}

@keyframes skeleton-loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@media (min-width: 1024px) and (max-width: 1279px) {
  :root {
    --desktop-sidebar-width: 232px;
  }

  .desktop-sidebar {
    padding-inline: 14px;
  }

  .sidebar-scroll-container {
    width: 204px;
  }

  .desktop-header {
    gap: 10px;
    padding-inline: 16px;
  }

  .topbar-title-wrapper {
    min-width: 215px;
  }

  .topbar-title-wrapper h1 {
    font-size: 21px;
  }

  .dashboard-header-search {
    min-width: 210px;
  }

  .sync-status-btn span {
    max-width: 95px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .kanban-column {
    min-width: 292px;
    width: 292px;
    flex-basis: 292px;
  }
}

@media (min-width: 1024px) and (max-width: 1440px) {
  .topbar-title-wrapper {
    min-width: 0;
  }

  .topbar-title-wrapper h1 {
    font-size: 21px;
  }

  .header-icon-btn {
    display: none;
  }

  .evolution-status-indicator span {
    display: none;
  }
}

/* Session workspace: desktop-wide contract from the approved visual guide. */
.session-workspace-topbar {
  display: none;
}

.session-form-card {
  display: contents;
}

.session-generated-title {
  display: none;
}

#session-hidden-fields {
  display: none !important;
}

.session-message-progress {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.session-chat-note,
#bot-status-description {
  display: none;
}

@media (min-width: 1280px) {
  #edit-modal-overlay {
    position: fixed;
    inset: 0 0 0 var(--desktop-sidebar-width);
    width: auto;
    height: 100dvh;
    padding: 0;
    background: #fefeff;
    font-family: 'Inter', sans-serif;
    overflow: hidden;
    transition: opacity 180ms ease, left 180ms ease;
  }

  body:has(#desktop-sidebar.collapsed) #edit-modal-overlay {
    left: 0;
  }

  #edit-modal-overlay .edit-modal-sheet.session-workspace,
  #edit-modal-overlay .edit-modal-sheet.session-workspace.creation-mode {
    --session-navy: #101a36;
    --session-blue: #1267f4;
    --session-green: #10b94f;
    --session-orange: #f59a0a;
    --session-purple: #54208d;
    --session-border: #e3e7ef;
    --session-background: #fefeff;
    --session-blue-soft: #eaf3fe;
    --session-green-soft: #ecf8ec;
    --session-orange-soft: #fefaf2;
    width: 100% !important;
    max-width: 100% !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0;
    border: 0;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) clamp(420px, 31vw, 470px);
    grid-template-rows: 70px minmax(0, 1fr);
    transform: none;
    opacity: 1;
    overflow: hidden !important;
    background: var(--session-background);
    color: var(--session-navy);
  }

  #edit-modal-overlay .edit-modal-sheet.session-workspace.creation-mode {
    grid-template-columns: minmax(0, 1fr);
  }

  .session-workspace-topbar {
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(250px, 1fr) minmax(110px, auto) auto;
    align-items: center;
    height: 70px;
    background: #fff;
    border-bottom: 1px solid var(--session-border);
    z-index: 5;
  }

  .session-workspace-context {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 24px;
  }

  .evolution-status-indicator span {
    display: none;
  }

  .session-workspace-back {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--session-border);
    border-radius: 9px;
    background: #fff;
    color: #42506c;
    font-size: 19px;
    cursor: pointer;
  }

  .session-workspace-back:hover,
  .session-workspace-back:focus-visible {
    border-color: #9bbcff;
    background: var(--session-blue-soft);
    color: var(--session-blue);
    outline: 2px solid rgba(18, 103, 244, 0.18);
    outline-offset: 1px;
  }

  .session-workspace-context strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 20px;
    font-weight: 700;
  }

  .session-status-pill {
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 4px 8px;
    border: 1px solid #f7c975;
    border-radius: 999px;
    color: #b86700;
    background: var(--session-orange-soft);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
  }

  .session-status-pill[data-status="Finalizado"] {
    color: #087b35;
    border-color: #bfe9ca;
    background: var(--session-green-soft);
  }

  .session-status-pill[data-status="Cancelado"] {
    color: #c51e2b;
    border-color: #f4c3c7;
    background: #fff7f7;
  }

  .session-workspace-tabs {
    align-self: stretch;
    display: flex;
    align-items: stretch;
    gap: 18px;
    padding: 0 14px;
  }

  .session-workspace-tab {
    position: relative;
    min-width: 80px;
    border: 0;
    background: transparent;
    color: #68758e;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
  }

  .session-workspace-tab::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: transparent;
  }

  .session-workspace-tab.active {
    color: var(--session-blue);
  }

  .session-workspace-tab.active::after {
    background: var(--session-blue);
  }

  .session-workspace-save-state {
    color: #718096;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
  }

  .session-workspace-save-state.dirty {
    color: #b86700;
  }

  .session-workspace-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    padding: 0 18px 0 12px;
  }

  .session-workspace-actions button,
  .simulator-actions .btn-chat-action {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--session-border);
    border-radius: 8px;
    background: #fff;
    color: #42506c;
    cursor: pointer;
  }

  .session-workspace-actions button:hover,
  .session-workspace-actions button:focus-visible,
  .simulator-actions .btn-chat-action:hover,
  .simulator-actions .btn-chat-action:focus-visible {
    border-color: #9bbcff;
    background: var(--session-blue-soft);
    color: var(--session-blue);
    outline: 2px solid rgba(18, 103, 244, 0.18);
    outline-offset: 1px;
  }

  .session-workspace-actions #btn-close-workspace {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    font-size: 20px;
  }

  #edit-modal-overlay .modal-split-left {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    min-height: 0;
    height: auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-right: 0;
    background: #fbfcff;
  }

  #edit-modal-overlay .modal-split-left > .overlay-header {
    display: none;
  }

  #edit-modal-overlay .modal-split-left > .overlay-body {
    min-height: 0;
    flex: 1;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 16px 16px 24px;
    background: #fbfcff;
    scrollbar-gutter: stable;
  }

  #edit-modal-overlay .edit-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    align-items: start;
    gap: 12px;
  }

  #edit-modal-overlay .edit-form-grid > #edit-id {
    display: none;
  }

  #edit-modal-overlay .session-form-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 11px;
    padding: 16px;
    border: 1px solid var(--session-border);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16, 26, 54, .018), 0 3px 8px rgba(16, 26, 54, .022);
    scroll-margin-top: 16px;
  }

  #edit-modal-overlay .session-form-card[hidden] {
    display: none !important;
  }

  #edit-modal-overlay .session-form-card-full {
    grid-column: 1 / -1;
  }

  #edit-modal-overlay #session-primary-main-stack {
    grid-column: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    align-self: start;
  }

  #edit-modal-overlay #session-main-information,
  #edit-modal-overlay #session-broker {
    grid-column: 1;
    align-self: start;
  }

  #edit-modal-overlay #group-motivo-agendamento.session-scheduling-reason {
    grid-column: 1;
    min-width: 0;
    margin-top: 0 !important;
    padding: 16px;
    border: 1px solid var(--session-border);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16, 26, 54, .018), 0 3px 8px rgba(16, 26, 54, .022);
  }

  #edit-modal-overlay #session-primary-side-stack {
    grid-column: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    align-self: start;
  }

  #edit-modal-overlay #session-commercial,
  #edit-modal-overlay #session-owner {
    grid-column: auto;
    grid-row: auto;
    align-self: start;
  }

  #edit-modal-overlay #session-scheduling {
    grid-column: 2;
  }

  #edit-modal-overlay #session-automation {
    grid-column: 1 / -1;
  }

  #edit-modal-overlay .form-section-title {
    min-height: 22px;
    margin: 0 0 2px;
    padding: 0;
    border: 0;
    color: var(--session-blue);
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
  }

  #edit-modal-overlay .session-generated-title {
    display: block;
  }

  #edit-modal-overlay .input-group {
    min-width: 0;
    margin: 0;
  }

  #edit-modal-overlay .input-group label {
    margin-bottom: 5px;
    color: #667188;
    font-size: 12px;
    font-weight: 600;
  }

  #edit-modal-overlay .text-input,
  #edit-modal-overlay .select-input {
    width: 100%;
    min-width: 0;
    height: 40px;
    padding: 0 10px;
    border: 1px solid var(--session-border);
    border-radius: 7px;
    background: #fff;
    box-shadow: none;
    color: var(--session-navy);
    font-family: 'Inter', sans-serif;
    font-size: 13px;
  }

  #edit-modal-overlay textarea.text-input {
    height: 58px;
    min-height: 58px;
    padding: 9px 10px;
    line-height: 1.4;
    resize: vertical;
  }

  #edit-modal-overlay #edit-endereco-completo {
    height: 40px;
    min-height: 40px;
    padding: 10px;
    overflow: hidden;
    line-height: 18px;
    resize: none;
  }

  #edit-modal-overlay .text-input:focus,
  #edit-modal-overlay .select-input:focus {
    border-color: var(--session-blue);
    outline: 2px solid rgba(18, 103, 244, .14);
    outline-offset: 1px;
  }

  #edit-modal-overlay .status-select-menu {
    border-color: var(--session-border);
    font-family: 'Inter', sans-serif;
    font-size: 13px;
  }

  #edit-modal-overlay .status-select-trigger {
    gap: 10px;
    padding-inline: 9px;
  }

  #edit-modal-overlay .status-select-trigger .status-select-chevron {
    font-size: 12px;
  }

  #edit-modal-overlay .form-group-pair,
  #edit-modal-overlay .form-group-triple {
    min-width: 0;
    gap: 10px;
  }

  #edit-modal-overlay .form-group-triple {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, .8fr);
  }

  #session-commercial .form-group-pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px !important;
  }

  #session-commercial .form-group-pair > .input-group {
    display: contents !important;
  }

  #session-commercial .form-group-pair > .input-group > div {
    min-height: 42px;
    align-items: center !important;
    padding: 7px 9px;
    border: 1px solid var(--session-border);
    border-radius: 8px;
    background: #fff;
  }

  #session-commercial .form-group-pair > .input-group > div:has(input:checked) {
    border-color: var(--session-blue);
    background: var(--session-blue-soft);
  }

  #session-commercial input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    accent-color: var(--session-blue);
  }

  #session-commercial label {
    margin: 0 !important;
    color: var(--session-navy) !important;
    line-height: 1.35;
  }

  #edit-modal-overlay .session-message-progress {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  #edit-modal-overlay .creation-mode .session-message-progress {
    display: none;
  }

  #edit-modal-overlay .message-sequence-card {
    min-width: 0;
    overflow: visible;
    border: 1px solid var(--session-border);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16, 26, 54, .018), 0 3px 8px rgba(16, 26, 54, .022);
  }

  #edit-modal-overlay .message-sequence-header {
    min-height: 70px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 13px 15px;
    border-bottom: 1px solid var(--session-border);
    border-radius: 10px 10px 0 0;
  }

  #edit-modal-overlay .message-sequence-icon {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: var(--session-green-soft);
    color: #08a347;
    font-size: 19px;
  }

  #edit-modal-overlay [data-sequence="followup"] .message-sequence-icon {
    background: var(--session-blue-soft);
    color: var(--session-blue);
  }

  #edit-modal-overlay .message-sequence-header h3 {
    margin: 0;
    color: var(--session-navy);
    font-size: 14px;
    font-weight: 700;
  }

  #edit-modal-overlay .message-sequence-header p {
    margin: 3px 0 0;
    color: #788399;
    font-size: 11px;
    line-height: 1.35;
  }

  #edit-modal-overlay .message-sequence-summary {
    padding: 5px 8px;
    border-radius: 999px;
    background: #f3f6fa;
    color: #69758b;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
  }

  #edit-modal-overlay .message-sequence-list {
    position: relative;
    display: grid;
    gap: 0;
    margin: 0;
    padding: 7px 15px 9px;
    list-style: none;
  }

  #edit-modal-overlay .message-sequence-step {
    position: relative;
    min-width: 0;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 8px 0;
  }

  #edit-modal-overlay .message-sequence-step:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 14px;
    top: 44px;
    bottom: -14px;
    width: 1px;
    background: #dce3ed;
  }

  #edit-modal-overlay .message-step-number {
    position: relative;
    z-index: 1;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cdd6e2;
    border-radius: 50%;
    background: #fff;
    color: #7a879d;
    font-size: 12px;
    font-weight: 700;
  }

  #edit-modal-overlay .message-sequence-step.is-sent .message-step-number {
    border-color: #10b95a;
    background: #10b95a;
    color: #fff;
  }

  #edit-modal-overlay .message-sequence-step.is-scheduled .message-step-number {
    border-color: var(--session-blue);
    background: var(--session-blue);
    color: #fff;
  }

  #edit-modal-overlay .message-step-content {
    min-width: 0;
    display: grid;
    gap: 3px;
  }

  #edit-modal-overlay .message-step-content strong {
    color: var(--session-navy);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
  }

  #edit-modal-overlay .message-step-title {
    position: relative;
    display: inline-block;
    width: fit-content;
    max-width: 100%;
    border-radius: 4px;
    cursor: help;
  }

  #edit-modal-overlay .message-step-title:focus-visible {
    outline: 2px solid rgba(22, 119, 255, .28);
    outline-offset: 3px;
  }

  #edit-modal-overlay .message-preview-tooltip {
    position: absolute;
    right: 0;
    z-index: 80;
    width: min(360px, calc(100vw - 64px));
    max-height: 230px;
    overflow-y: auto;
    padding: 10px 12px;
    border: 1px solid #d8e0eb;
    border-radius: 9px;
    background: #17233a;
    box-shadow: 0 10px 28px rgba(16, 26, 54, .2);
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0;
    white-space: pre-wrap;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(3px);
    transition: opacity 120ms ease, visibility 120ms ease, transform 120ms ease;
  }

  #edit-modal-overlay .message-preview-tooltip.is-below {
    top: calc(100% + 8px);
  }

  #edit-modal-overlay .message-preview-tooltip.is-above {
    bottom: calc(100% + 8px);
  }

  #edit-modal-overlay .message-step-title:hover .message-preview-tooltip,
  #edit-modal-overlay .message-step-title:focus .message-preview-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  #edit-modal-overlay .message-step-content small {
    color: #8691a4;
    font-size: 10px;
    line-height: 1.35;
  }

  #edit-modal-overlay .message-step-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #8793a7;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
  }

  #edit-modal-overlay .message-step-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    min-width: 0;
  }

  #edit-modal-overlay .message-step-send-button {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 8px;
    background: #10b95a;
    box-shadow: 0 2px 5px rgba(16, 185, 90, .2);
  }

  #edit-modal-overlay .message-step-send-button:hover:not(:disabled) {
    background: #08a347;
    box-shadow: 0 4px 9px rgba(16, 185, 90, .24);
  }

  #edit-modal-overlay .message-step-send-button:disabled {
    background: #c8d0dc;
    color: #fff;
    opacity: 1;
  }

  #edit-modal-overlay .message-step-send-button i {
    font-size: 14px;
  }

  #edit-modal-overlay .message-sequence-step.is-sent .message-step-status {
    color: #08a347;
  }

  #edit-modal-overlay .message-sequence-step.is-scheduled .message-step-status {
    color: var(--session-blue);
  }

  #edit-modal-overlay .message-sequence-step.is-skipped .message-step-status {
    color: #a36b50;
  }

  #session-broker {
    display: grid !important;
    grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr);
    align-content: start;
  }

  #session-broker > .form-section-title {
    align-self: center;
  }

  #session-broker > .input-group {
    grid-column: 2;
  }

  #session-broker > .form-group-pair {
    grid-column: 1 / -1;
  }

  #session-automation > .input-group,
  #session-scheduling > .input-group {
    margin-top: 0 !important;
  }

  #session-automation #group-followup-sequence-panel,
  #session-automation #group-ai-followup-messages {
    padding: 12px !important;
    border: 1px solid var(--session-border) !important;
    border-radius: 8px !important;
    background: #fbfcff !important;
  }

  #session-automation #group-followup-sequence-panel > div:first-of-type {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px !important;
  }

  #session-automation .sequence-step-item {
    min-width: 0;
    min-height: 68px;
    flex-direction: column;
    justify-content: center !important;
    gap: 5px;
    padding: 7px 5px !important;
    text-align: center;
  }

  #session-automation .sequence-step-item > div {
    min-width: 0;
    flex-direction: column;
    gap: 4px !important;
  }

  #session-automation .sequence-step-item > div > span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 11px !important;
    line-height: 1.25;
  }

  #edit-modal-overlay .edit-modal-footer {
    position: relative;
    flex: 0 0 auto;
    min-height: 68px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-top: 1px solid var(--session-border);
    background: rgba(255, 255, 255, .98);
    z-index: 3;
  }

  #edit-modal-overlay .edit-modal-footer .btn {
    min-height: 40px;
    padding: 0 18px;
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 700;
  }

  #edit-modal-overlay #btn-delete-session {
    background: #df1e2d;
  }

  #edit-modal-overlay #btn-cancel-edit {
    border: 1px solid var(--session-border);
    background: #fff;
    color: #667188;
  }

  #edit-modal-overlay #btn-save-edit {
    min-width: 160px;
    background: var(--session-green);
  }

  #edit-modal-overlay #btn-save-edit:disabled {
    background: #dbe2eb;
    color: #8b96a8;
    cursor: not-allowed;
  }

  #edit-modal-overlay .modal-split-right {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    min-height: 0;
    height: auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-left: 1px solid var(--session-border);
    background: #fff;
  }

  #edit-modal-overlay .creation-mode .modal-split-right {
    display: none !important;
  }

  #edit-modal-overlay .simulator-header {
    min-height: 66px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--session-border);
    background: #fff;
  }

  #edit-modal-overlay .simulator-owner-info {
    min-width: 0;
    gap: 10px;
  }

  #edit-modal-overlay .simulator-avatar {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    background: #efe9fa;
    color: var(--session-purple);
    font-size: 19px;
  }

  #edit-modal-overlay .simulator-avatar i {
    display: block;
  }

  #edit-modal-overlay .simulator-meta {
    min-width: 0;
  }

  #edit-modal-overlay .simulator-meta h4 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--session-navy);
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
  }

  #edit-modal-overlay .simulator-meta span {
    color: #768197;
    font-size: 11px;
  }

  #edit-modal-overlay .simulator-actions {
    flex: 0 0 auto;
    gap: 6px !important;
  }

  #edit-modal-overlay .simulator-actions #btn-sync-chat {
    border-color: var(--session-blue);
    background: var(--session-blue) !important;
    color: #fff !important;
  }

  #edit-modal-overlay .bot-status-banner {
    min-height: 58px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--session-border);
    background: var(--session-green-soft);
    font-size: 12px;
  }

  #edit-modal-overlay .bot-status-banner.inactive {
    background: var(--session-orange-soft);
  }

  #edit-modal-overlay .bot-status-info {
    display: grid;
    grid-template-columns: 8px minmax(0, 1fr);
    column-gap: 8px;
    row-gap: 2px;
    color: var(--session-navy);
  }

  #edit-modal-overlay .bot-status-dot {
    grid-row: 1 / 3;
    align-self: center;
    box-shadow: none;
  }

  #edit-modal-overlay #bot-status-text {
    font-size: 13px;
    font-weight: 700;
  }

  #edit-modal-overlay #bot-status-description {
    display: block;
    grid-column: 2;
    color: #68758e;
    font-size: 11px;
    font-weight: 500;
  }

  #edit-modal-overlay .btn-toggle-bot {
    min-height: 30px;
    padding: 0 12px;
    border: 1px solid #bfe9ca;
    border-radius: 999px;
    background: #fff;
    color: #087b35;
    font-family: 'Inter', sans-serif;
    font-size: 11px;
  }

  #edit-modal-overlay .simulator-chat-messages {
    min-height: 0;
    overflow-y: auto;
    padding: 16px 14px;
    gap: 10px;
    background: #fbfcff;
    background-image: none;
  }

  #edit-modal-overlay .chat-bubble {
    max-width: 84%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 8px;
    padding: 10px 12px;
    border: 1px solid var(--session-border);
    border-radius: 10px;
    box-shadow: none;
    color: var(--session-navy);
    font-size: 13px;
    line-height: 1.42;
  }

  #edit-modal-overlay .chat-bubble.owner {
    align-self: flex-start;
    border-bottom-left-radius: 3px;
    border-color: #ddd4ee;
    background: #f7f5fb;
    color: var(--session-navy);
  }

  #edit-modal-overlay .chat-bubble.bot {
    align-self: flex-end;
    border-bottom-right-radius: 3px;
    border-color: #cce8cf;
    background: var(--session-green-soft);
    color: var(--session-navy);
  }

  #edit-modal-overlay .chat-bubble.manual {
    align-self: flex-end;
    border-bottom-right-radius: 3px;
    border-color: #c9defa;
    background: var(--session-blue-soft);
    color: var(--session-navy);
  }

  #edit-modal-overlay .chat-bubble.system {
    align-self: center;
    max-width: 92%;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-color: var(--session-border);
    border-radius: 999px;
    background: #f6f7f9;
    color: #6c778d;
    font-size: 11px;
    text-align: center;
  }

  #edit-modal-overlay .chat-message-label {
    grid-column: 1 / -1;
    color: #087b35;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
  }

  #edit-modal-overlay .chat-bubble.owner .chat-message-label {
    color: var(--session-purple);
  }

  #edit-modal-overlay .chat-bubble.manual .chat-message-label {
    color: var(--session-blue);
  }

  #edit-modal-overlay .chat-message-text {
    grid-column: 1 / -1;
  }

  #edit-modal-overlay .chat-audio-placeholder {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-weight: 600;
  }

  #edit-modal-overlay .chat-audio-placeholder i {
    font-size: 16px;
  }

  #edit-modal-overlay .chat-bubble-time {
    grid-column: 2;
    color: #758196;
    font-size: 10px;
    white-space: nowrap;
  }

  #edit-modal-overlay .chat-tick {
    margin-left: 3px;
    color: var(--session-blue);
  }

  .session-chat-note {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    border-top: 1px solid var(--session-border);
    background: var(--session-orange-soft);
    color: #86601f;
    font-size: 11px;
    line-height: 1.35;
  }

  #edit-modal-overlay .simulator-input-area {
    padding: 10px 12px;
    border-top: 1px solid var(--session-border);
    background: #fff;
  }

  #edit-modal-overlay .simulator-input-area input {
    height: 38px;
    padding: 0 13px;
    border: 1px solid var(--session-border);
    border-radius: 8px;
    background: #fff;
    color: var(--session-navy);
    font-family: 'Inter', sans-serif;
    font-size: 12px;
  }

  #edit-modal-overlay .simulator-input-area input:focus {
    border-color: var(--session-blue);
    outline: 2px solid rgba(18, 103, 244, .14);
  }

  #edit-modal-overlay .simulator-input-buttons .btn {
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 8px;
  }

  #edit-modal-overlay #btn-send-human {
    background: var(--session-blue) !important;
  }

  #edit-modal-overlay #btn-send-whatsapp-desktop {
    background: var(--session-green) !important;
  }

  #edit-modal-overlay .simulator-placeholder {
    height: 100%;
    background: #fbfcff;
    color: #738097;
  }

  #edit-modal-overlay .simulator-placeholder h4 {
    color: var(--session-navy);
    font-family: 'Inter', sans-serif;
  }

  #edit-modal-overlay #manual-whatsapp-container {
    padding: 16px !important;
    background: #fbfcff;
  }

  #edit-modal-overlay #manual-whatsapp-container h4,
  #edit-modal-overlay #manual-whatsapp-container h5 {
    color: var(--session-navy) !important;
    font-family: 'Inter', sans-serif !important;
  }

  #edit-modal-overlay button,
  #edit-modal-overlay input,
  #edit-modal-overlay select,
  #edit-modal-overlay textarea {
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, opacity .16s ease;
  }

  @media (prefers-reduced-motion: reduce) {
    #edit-modal-overlay button,
    #edit-modal-overlay input,
    #edit-modal-overlay select,
    #edit-modal-overlay textarea {
      transition: none;
    }
  }
}

/* Previa de leitura do WhatsApp nos cards do Kanban. */
.kcard-chat-hover-popup {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  width: min(340px, calc(100vw - 24px));
  max-height: min(400px, calc(100vh - 24px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #dfe5ee;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(15, 23, 42, .18), 0 3px 10px rgba(15, 23, 42, .08);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-4px) scale(.98);
  transform-origin: left center;
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
}

.kcard-chat-hover-popup.opens-left {
  transform-origin: right center;
}

.kcard-chat-hover-popup.visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0) scale(1);
}

.hover-chat-header {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border-bottom: 1px solid #e4e9f1;
  background: #fff;
}

.hover-chat-avatar {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #f0e8fb;
  color: #6b21a8;
  font-size: 12px;
  font-weight: 800;
}

.hover-chat-info {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.hover-chat-name {
  overflow: hidden;
  color: #17213a;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hover-chat-phone {
  color: #718096;
  font-size: 11px;
  font-weight: 500;
}

.hover-chat-body {
  min-height: 112px;
  max-height: 280px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow-y: auto;
  padding: 12px;
  background: #f7f8fb;
  scrollbar-width: thin;
  scrollbar-color: #b9c3d1 transparent;
}

.hover-chat-body::-webkit-scrollbar {
  width: 4px;
}

.hover-chat-body::-webkit-scrollbar-track {
  background: transparent;
}

.hover-chat-body::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #b9c3d1;
}

.hover-chat-bubble {
  max-width: 86%;
  display: grid;
  gap: 3px;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
  color: #17213a;
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.hover-chat-bubble.owner {
  align-self: flex-start;
  border-bottom-left-radius: 3px;
  border-color: #ded4ee;
  background: #fff;
}

.hover-chat-bubble.bot {
  align-self: flex-end;
  border-bottom-right-radius: 3px;
  border-color: #c7e5ca;
  background: #e9f7e9;
}

.hover-chat-bubble.manual {
  align-self: flex-end;
  border-bottom-right-radius: 3px;
  border-color: #c5dbf8;
  background: #eaf3ff;
}

.hover-chat-bubble.system {
  align-self: center;
  max-width: 94%;
  border-color: #e1e6ed;
  border-radius: 999px;
  background: #fff;
  box-shadow: none;
  color: #68758a;
  font-size: 10px;
  text-align: center;
}

.hover-chat-sender {
  color: #087b35;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
}

.hover-chat-bubble.owner .hover-chat-sender {
  color: #6b21a8;
}

.hover-chat-bubble.manual .hover-chat-sender {
  color: #1267d8;
}

.hover-chat-text {
  white-space: pre-wrap;
}

.hover-chat-time {
  justify-self: end;
  color: #7d899a;
  font-size: 9px;
  line-height: 1;
}

.hover-chat-media {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
}

.hover-chat-media i {
  font-size: 14px;
}

.hover-chat-loading,
.hover-chat-empty {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #718096;
  font-size: 11px;
  text-align: center;
}

.hover-chat-loading i {
  font-size: 15px;
  animation: spin 900ms linear infinite;
}

.hover-chat-empty.is-error {
  color: #c24141;
}

@media (prefers-reduced-motion: reduce) {
  .kcard-chat-hover-popup {
    transition: none;
  }

  .hover-chat-loading i {
    animation: none;
  }
}

/* Agenda integrada ao frame principal do painel ADM */
.admin-agenda-view {
  width: 100%;
  min-width: 0;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
  background: #f7f9fc;
}

.admin-agenda-frame {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
  background: #f7f9fc;
}

body.desktop-view-agenda .dashboard-header-search,
body.desktop-view-agenda .topbar-right-wrapper,
body.desktop-view-agenda .kanban-board {
  display: none !important;
}

body.desktop-view-agenda .topbar-title-wrapper {
  flex: 1 1 auto;
}

body.desktop-view-agenda .desktop-content {
  padding: 0;
}
/* Quadro independente para uma retomada manual, fora da regua automatica. */
#edit-modal-overlay .one-off-followup-card {
  grid-column: 1 / -1;
}

#edit-modal-overlay .one-off-followup-card .message-sequence-icon {
  background: #f2edff;
  color: #7457d9;
}

#edit-modal-overlay .one-off-followup-body {
  display: grid;
  gap: 8px;
  padding: 14px 15px 15px;
}

#edit-modal-overlay .one-off-followup-body label {
  color: var(--session-navy);
  font-size: 12px;
  font-weight: 700;
}

#edit-modal-overlay .one-off-followup-body textarea {
  width: 100%;
  min-height: 92px;
  resize: vertical;
  border: 1px solid var(--session-border);
  border-radius: 9px;
  padding: 11px 12px;
  color: var(--session-navy);
  font: inherit;
  font-size: 12px;
  line-height: 1.5;
}

#edit-modal-overlay .one-off-followup-body textarea:focus {
  outline: 2px solid rgba(33, 105, 255, .18);
  border-color: var(--session-blue);
}

#edit-modal-overlay .one-off-followup-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#edit-modal-overlay .one-off-followup-actions small {
  color: #788399;
  font-size: 11px;
}

#edit-modal-overlay #btn-send-one-off-followup {
  min-width: 164px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

#edit-modal-overlay #one-off-followup-status.is-sent {
  color: #08a347;
}

@media (max-width: 760px) {
  #edit-modal-overlay .one-off-followup-actions {
    align-items: stretch;
    flex-direction: column;
  }

  #edit-modal-overlay #btn-send-one-off-followup {
    width: 100%;
  }
}