/**
 * Customer journeys — login, dashboard, composer, chatbox, CRM.
 * Prompt 149: 320 / 375 / 390 / 768 + touch targets + empty-state honesty.
 */

/* Touch-friendly controls (practical minimum ~44px) */
.dashboard-page .btn,
.auth-form .btn,
.fp-admin-main .btn,
.inbox-shell .btn,
.posts-page .btn {
  min-height: 44px;
}

.dashboard-page .form-check-input,
.auth-form .form-check-input {
  width: 1.25rem;
  height: 1.25rem;
}

.dashboard-page .nav-link,
.fp-admin-sidebar .nav-link {
  min-height: 44px;
  display: flex;
  align-items: center;
}

/* Empty-state kinds — theme-aware, no fake “campaign journey” chrome by default */
.empty-state {
  background: var(--bs-body-bg, #fff);
}
.empty-state .text-body {
  color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .empty-state {
  background: var(--bs-secondary-bg, #1e1e1e);
}
[data-bs-theme="dark"] .empty-state .avatar-circle.bg-light {
  background: var(--bs-tertiary-bg, #2a2a2a) !important;
}
.empty-state--error {
  border-inline-start: 3px solid var(--bs-danger, #dc3545);
}
.empty-state--not_configured,
.empty-state--not_entitled {
  border-inline-start: 3px solid var(--bs-warning, #ffc107);
}
.empty-state--not_implemented {
  border-inline-start: 3px solid var(--bs-secondary, #6c757d);
}

@media (max-width: 320px) {
  .auth-wrapper { padding: 0.5rem; }
  .auth-card { max-width: 100%; border-radius: 0.5rem; }
  .auth-card .card-body { padding: 0.85rem !important; }
  .dashboard-page { padding-left: 0.35rem !important; padding-right: 0.35rem !important; }
  .post-content-input { min-height: 7rem; }
  .table-responsive { margin-left: -0.25rem; margin-right: -0.25rem; }
  #composerAiToolbar .btn { font-size: 0.7rem; padding-left: 0.5rem; padding-right: 0.5rem; }
}

@media (max-width: 360px) {
  .auth-wrapper { padding: 0.75rem; }
  .auth-card { max-width: 100%; border-radius: 0.75rem; }
  .auth-card .card-body { padding: 1rem !important; }
  .dashboard-page { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
  .post-content-input { min-height: 8rem; }
  #composerAiToolbar .btn { font-size: 0.75rem; }
}

@media (max-width: 375px) {
  .auth-title { font-size: 1.25rem; }
  .dashboard-page .card-header { flex-wrap: wrap; gap: 0.5rem; }
}

@media (max-width: 390px) {
  .auth-form .d-flex.justify-content-between { flex-wrap: wrap; gap: 0.5rem; }
  .dashboard-page .btn { min-height: 44px; }
  .post-live-preview { max-height: 40vh; overflow: auto; }
}

@media (max-width: 767.98px) {
  .admin-main,
  .fp-admin-main { min-width: 0; }
  .dashboard-page .card { overflow: hidden; }
  #composerAiToolbar { overflow-x: auto; flex-wrap: nowrap; }
  #composerAiToolbar .btn { flex: 0 0 auto; }
  .table-responsive table { font-size: 0.875rem; }
  .modal-dialog { margin: 0.5rem; }
}

@media (min-width: 768px) {
  .auth-card { max-width: 420px; }
  #composerAiToolbar { flex-wrap: wrap; }
}