/**
 * UI Readability Safe Patch v5 — additive only, loads LAST on all panels.
 * Live-safe: no legacy file deletion; overrides tiny mobile text + touch targets.
 * v3: dark-mode gradient sections + expanded brand-fill hero text.
 * v4: supplemental gradients, card-header dark-mode fix, labels, skip-link, attend QR.
 * v5: dark-mode check/radio, HRM shell nav, copy buttons, form unify.
 */

:root {
  --font-primary: 'Inter', 'Noto Sans Devanagari', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-heading: 'Plus Jakarta Sans', 'Noto Sans Devanagari', 'Inter', system-ui, sans-serif;
  --coop-focus-ring: 0 0 0 3px color-mix(in srgb, var(--primary-color, #1a5f2a) 35%, transparent);
}

body,
.mem-wrapper,
.admin-shell,
.main-content,
.auth-portal-page {
  font-family: var(--font-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.6;
}

html[lang="ne"] body,
html[lang="ne"] .mem-wrapper,
html[lang="ne"] .main-content {
  line-height: 1.65;
}

h1, h2, h3, h4, h5, h6,
.card-title,
.mem-card-title,
.section-title {
  font-family: var(--font-heading);
  line-height: 1.3;
}

/* Keyboard focus — visible ring (does not remove existing hover styles) */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary-color, #1a5f2a) 55%, #fff) !important;
  outline-offset: 2px;
  box-shadow: var(--coop-focus-ring);
}

/* ── Brand-fill / gradient sections — light text (beats ui-ux-enhancements dark h1–h6) ── */
:is(
  .page-banner,
  .page-banner-modern,
  .inner-banner,
  .page-header-banner,
  .hero-slider,
  .hero-slide-modern,
  .slider-content,
  .hero-content-modern,
  .hero-text-wrapper,
  .slider-section,
  .hero-section,
  .tracker-hero-section,
  .tracker-search-header,
  .cr-hero,
  .cp-hero,
  .page-hero,
  .auc2-hero-section,
  .auc2-hero,
  .auc2-hero-txt,
  .rates-header,
  .rates-header-modern,
  .rates-box-enhanced .rates-header,
  .cta-section,
  .cta-block,
  .cta-area,
  .call-to-action,
  .mobile-app-section,
  .app-download-section,
  .form-header,
  .home-ip-preview-head,
  .card-header.appt-form-card-head,
  .card > .card-header.bg-primary,
  .gradient-card-header,
  .card-header.bg-gradient-primary,
  .modal-header.bg-primary,
  .stat-card.bg-primary,
  .stat-card.bg-success
) {
  color: var(--text-on-primary, #fff) !important;
}

:is(
  .page-banner,
  .page-banner-modern,
  .inner-banner,
  .page-header-banner,
  .hero-slider,
  .hero-slide-modern,
  .slider-content,
  .hero-content-modern,
  .hero-text-wrapper,
  .slider-section,
  .hero-section,
  .tracker-hero-section,
  .tracker-search-header,
  .cr-hero,
  .cp-hero,
  .page-hero,
  .auc2-hero-section,
  .auc2-hero,
  .auc2-hero-txt,
  .rates-header,
  .rates-header-modern,
  .rates-box-enhanced .rates-header,
  .cta-section,
  .cta-block,
  .cta-area,
  .call-to-action,
  .mobile-app-section,
  .app-download-section,
  .form-header,
  .home-ip-preview-head,
  .card-header.appt-form-card-head,
  .card > .card-header.bg-primary,
  .gradient-card-header,
  .card-header.bg-gradient-primary,
  .modal-header.bg-primary,
  .stat-card.bg-primary,
  .stat-card.bg-success
) :is(
  h1, h2, h3, h4, h5, h6,
  p, span, li, label, small, div,
  .hero-title-modern, .hero-subtitle-modern,
  .breadcrumb-item, .breadcrumb-item a, .breadcrumb-item.active,
  .tracker-hero-title, .tracker-hero-sub,
  .tracker-search-title, .tracker-search-sub,
  .auc2-h, .auc2-sub, .page-title-modern
) {
  color: var(--text-on-primary, #fff) !important;
  -webkit-text-fill-color: var(--text-on-primary, #fff) !important;
}

:is(
  .page-banner,
  .page-banner-modern,
  .hero-content-modern,
  .hero-text-wrapper,
  .tracker-hero-section,
  .tracker-search-header,
  .cr-hero,
  .cp-hero,
  .auc2-hero-section,
  .auc2-hero-txt,
  .cta-section,
  .cta-block,
  .form-header,
  .gradient-card-header
) a:not(.btn):not(.hero-btn-modern):not(.btn-coop):not(.badge) {
  color: rgba(255, 255, 255, 0.92) !important;
}

:is(
  .page-banner,
  .page-banner-modern
) .breadcrumb-item + .breadcrumb-item::before {
  color: rgba(255, 255, 255, 0.65) !important;
}

/* Subtitles on brand panels — slightly softer white */
.hero-subtitle-modern,
.tracker-hero-sub,
.tracker-search-sub,
.cr-hero-text p,
.cp-hero-text p,
.auc2-sub,
.page-banner p,
.cta-content p {
  color: rgba(255, 255, 255, 0.9) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.9) !important;
}

/* ── Dark mode — beat public-shell-polish global h1–h6 / p / link overrides ── */
body.dark-mode :is(
  .page-banner,
  .page-banner-modern,
  .inner-banner,
  .page-header-banner,
  .hero-slider,
  .hero-slide-modern,
  .slider-content,
  .hero-content-modern,
  .hero-text-wrapper,
  .slider-section,
  .hero-section,
  .tracker-hero-section,
  .tracker-search-header,
  .cr-hero,
  .cp-hero,
  .page-hero,
  .auc2-hero-section,
  .auc2-hero,
  .auc2-hero-txt,
  .rates-header,
  .rates-header-modern,
  .rates-box-enhanced .rates-header,
  .cta-section,
  .cta-block,
  .cta-area,
  .call-to-action,
  .mobile-app-section,
  .app-download-section,
  .form-header,
  .home-ip-preview-head,
  .card-header.appt-form-card-head,
  .card > .card-header.bg-primary,
  .gradient-card-header,
  .card-header.bg-gradient-primary,
  .modal-header.bg-primary,
  .stat-card.bg-primary,
  .stat-card.bg-success,
  .sp-selday-hero,
  .scan-hero
) {
  color: var(--text-on-primary, #fff) !important;
}

body.dark-mode :is(
  .page-banner,
  .page-banner-modern,
  .inner-banner,
  .page-header-banner,
  .hero-slider,
  .hero-slide-modern,
  .slider-content,
  .hero-content-modern,
  .hero-text-wrapper,
  .slider-section,
  .hero-section,
  .tracker-hero-section,
  .tracker-search-header,
  .cr-hero,
  .cp-hero,
  .page-hero,
  .auc2-hero-section,
  .auc2-hero,
  .auc2-hero-txt,
  .rates-header,
  .rates-header-modern,
  .rates-box-enhanced .rates-header,
  .cta-section,
  .cta-block,
  .cta-area,
  .call-to-action,
  .mobile-app-section,
  .app-download-section,
  .form-header,
  .home-ip-preview-head,
  .card-header.appt-form-card-head,
  .card > .card-header.bg-primary,
  .gradient-card-header,
  .card-header.bg-gradient-primary,
  .modal-header.bg-primary,
  .stat-card.bg-primary,
  .stat-card.bg-success,
  .sp-selday-hero,
  .scan-hero
) :is(
  h1, h2, h3, h4, h5, h6,
  p, span, li, label, small, div, i, svg,
  .hero-title-modern, .hero-subtitle-modern,
  .breadcrumb-item, .breadcrumb-item a, .breadcrumb-item.active,
  .tracker-hero-title, .tracker-hero-sub,
  .tracker-search-title, .tracker-search-sub,
  .auc2-h, .auc2-sub, .auc2-title, .auc2-info-value,
  .page-title-modern, .lucide-icon
) {
  color: var(--text-on-primary, #fff) !important;
  -webkit-text-fill-color: var(--text-on-primary, #fff) !important;
}

body.dark-mode :is(
  .page-banner,
  .page-banner-modern,
  .hero-content-modern,
  .hero-text-wrapper,
  .tracker-hero-section,
  .tracker-search-header,
  .cr-hero,
  .cp-hero,
  .auc2-hero-section,
  .auc2-hero-txt,
  .cta-section,
  .cta-block,
  .form-header,
  .gradient-card-header,
  .mobile-app-section
) a:not(.btn):not(.hero-btn-modern):not(.btn-coop):not(.badge) {
  color: rgba(255, 255, 255, 0.92) !important;
}

body.dark-mode :is(
  .page-banner,
  .page-banner-modern,
  .tracker-hero-section
) .breadcrumb-item + .breadcrumb-item::before {
  color: rgba(255, 255, 255, 0.65) !important;
}

/* Keep brand gradient backgrounds visible in dark mode (not flattened to page bg) */
body.dark-mode :is(
  .page-banner,
  .page-banner-modern,
  .tracker-hero-section,
  .tracker-search-header,
  .cr-hero,
  .cp-hero,
  .auc2-hero-section,
  .rates-header,
  .rates-header-modern,
  .rates-box-enhanced .rates-header,
  .form-header,
  .gradient-card-header,
  .card-header.bg-gradient-primary,
  .card > .card-header.bg-primary
) {
  background-image: linear-gradient(
    135deg,
    var(--primary-dark, #14532d) 0%,
    var(--primary-color, #1a5f2a) 55%,
    var(--primary-light, #2d6b3a) 100%
  ) !important;
}

/* Hero slider keeps photo overlay — only fix text, not bg image */
body.dark-mode .hero-slide-modern .slider-bg,
body.dark-mode .hero-bg-modern {
  background-color: transparent !important;
}

/* v4 — supplemental gradient sections (cp cards, modals, admin headers) */
:is(
  .cp-card-head,
  .cr-sidebar-header,
  .ir-head-primary,
  .ct-modal-head,
  .card-header.svc-form-header-grad,
  .card-header.sl-form-header,
  .card-top
) {
  color: var(--text-on-primary, #fff) !important;
}

:is(
  .cp-card-head,
  .cr-sidebar-header,
  .ir-head-primary,
  .ct-modal-head,
  .card-header.svc-form-header-grad,
  .card-header.sl-form-header,
  .card-top
) :is(h1, h2, h3, h4, h5, h6, p, span, small, i, svg, .lucide-icon) {
  color: var(--text-on-primary, #fff) !important;
  -webkit-text-fill-color: var(--text-on-primary, #fff) !important;
}

body.dark-mode :is(
  .cp-card-head,
  .cr-sidebar-header,
  .ir-head-primary,
  .ct-modal-head,
  .card-header.svc-form-header-grad,
  .card-header.sl-form-header
) {
  background-image: linear-gradient(
    135deg,
    var(--primary-dark, #14532d) 0%,
    var(--primary-color, #1a5f2a) 55%,
    var(--primary-light, #2d6b3a) 100%
  ) !important;
  color: var(--text-on-primary, #fff) !important;
}

/* Beat public-shell body.dark-mode .card-header flattening gradient headers */
body.dark-mode :is(
  .gradient-card-header,
  .card-header.bg-gradient-primary,
  .card-header.bg-primary:not(.bg-light):not(.bg-white),
  .card-header.appt-form-card-head,
  .ir-head-primary,
  .svc-form-header-grad,
  .sl-form-header,
  .cp-card-head,
  .cr-sidebar-header,
  .ct-modal-head,
  .form-header
) {
  background-color: transparent !important;
  background-image: linear-gradient(
    135deg,
    var(--primary-dark, #14532d) 0%,
    var(--primary-color, #1a5f2a) 55%,
    var(--primary-light, #2d6b3a) 100%
  ) !important;
  color: var(--text-on-primary, #fff) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode :is(
  .gradient-card-header,
  .card-header.bg-gradient-primary,
  .card-header.bg-primary:not(.bg-light):not(.bg-white),
  .card-header.appt-form-card-head,
  .ir-head-primary,
  .svc-form-header-grad,
  .sl-form-header,
  .cp-card-head,
  .cr-sidebar-header,
  .ct-modal-head,
  .form-header
) :is(h1, h2, h3, h4, h5, h6, p, span, small, a:not(.btn), i, svg) {
  color: var(--text-on-primary, #fff) !important;
  -webkit-text-fill-color: var(--text-on-primary, #fff) !important;
}

/* Dark mode — form labels readable (patch v2 set light-mode color only) */
body.dark-mode .form-label,
body.dark-mode label.form-label {
  color: var(--text-primary, #e8eef2) !important;
}

/* Partner facilities intro title on dark page bg */
body.dark-mode .pf-hero-title {
  color: var(--primary-on-dark, #86efac) !important;
}

/* Skip link — visible above fixed header when focused */
.skip-link {
  z-index: 1000001;
}
.skip-link:focus {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1000001;
}

/* ── Mobile: consistent rem base (app-core has 14px then 16px conflict) ── */
@media (max-width: 991px) {
  html {
    font-size: 16px;
  }

  /* Public header — EN/slogan was ~11px */
  .pfl-brand-name-en,
  .pfl-brand-slogan {
    font-size: 0.72rem !important;
    line-height: 1.35 !important;
  }

  /* Top utility — compact width OK, touch height 44px */
  .pfl-top-right > li > a,
  .pfl-bell-btn,
  .pfl-dark-wrap > a,
  .pfl-top-right .pfl-lang-wrap a,
  .pfl-top-right .pfl-lang-wrap .pfl-lang-link {
    min-height: 44px !important;
    font-size: 12px !important;
  }

  .pfl-top-right .pfl-lang-wrap a {
    min-width: 36px !important;
    width: auto !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  /* Admin forms — touch-friendly controls */
  .admin-shell .form-control,
  .admin-shell .form-select,
  .admin-shell textarea.form-control,
  .admin-shell .btn:not(.btn-sm):not(.btn-xs) {
    min-height: 44px;
  }

  .admin-shell .btn-sm {
    min-height: 40px;
  }
}

/* Admin / public bottom nav labels */
.mob-bottomnav a.mob-bn-item {
  font-size: 11px;
  padding: 8px 4px;
}
.mob-bottomnav a.mob-bn-item span {
  font-size: 10.5px;
  line-height: 1.2;
}

/* Member portal chrome */
.mem-lang-code {
  font-size: 12px !important;
}
.bell-dd-time {
  font-size: 0.72rem !important;
}
.bell-dd-msg {
  font-size: 0.78rem !important;
}
.bell-dd-title {
  font-size: 0.86rem !important;
}

/* Footer / PWA install chip */
.pub-footer-pwa span,
.mem-footer-pwa span {
  font-size: 11px !important;
}

/* Helper / muted text floor */
.form-text,
.help-block,
small.text-muted,
.text-muted.small,
.form-label small {
  font-size: max(0.8125rem, 12px);
}

.form-label,
label.form-label {
  font-weight: 600;
  color: var(--text-primary, #1a2e1f);
}

/* Tables — readable cell text on mobile */
@media (max-width: 767px) {
  .table td,
  .table th,
  .admin-table-card .table td,
  .admin-table-card .table th {
    font-size: 0.875rem;
    vertical-align: middle;
  }
}

/* Auth cards — placeholder readability */
.auth-card input::placeholder,
.auth-card textarea::placeholder {
  opacity: 0.72;
}

/* Links — clearer default underline on hover/focus */
.main-content a:not(.btn):not(.nav-link):not(.dropdown-item):hover,
.mem-container a:not(.btn):not(.mem-nav-link):hover {
  text-decoration-thickness: 1px;
}

/* ── v5: Dark mode — checkbox / radio / switch readable ── */
body.dark-mode .form-check-input {
  background-color: var(--bg-soft, #1f2a3a);
  border-color: var(--border-color, #2a3a50);
}
body.dark-mode .form-check-input:checked {
  background-color: var(--primary-color, #1a5f2a);
  border-color: var(--primary-color, #1a5f2a);
}
body.dark-mode .form-check-input:focus {
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--primary-color, #1a5f2a) 28%, transparent);
}
body.dark-mode .form-check-label,
body.dark-mode .form-check-inline .form-check-label {
  color: var(--text-primary, #e8eef2) !important;
}
body.dark-mode .form-switch .form-check-input {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}

/* Auth password-reset channel radios */
body.dark-mode .channel-opt label {
  color: var(--text-primary, #e8eef2);
  border-color: var(--border-color, #2a3a50);
  background: var(--bg-soft, #1f2a3a);
}
body.dark-mode .channel-opt input:checked + label {
  border-color: var(--primary-on-dark, #86efac);
  background: color-mix(in srgb, var(--primary-color, #1a5f2a) 18%, #1f2a3a);
  color: var(--text-primary, #e8eef2);
}

/* HRM legacy partial shell — fonts + bottom nav touch targets */
.hp-search input {
  font-family: var(--font-primary) !important;
}
.admin-bottom-nav .admin-nav-item {
  font-size: max(0.75rem, 12px) !important;
  min-height: 44px;
  padding-top: 8px;
  padding-bottom: 8px;
}

/* Tracking ID copy buttons — readable + tappable */
button[onclick*="copyTrk"],
.btn[onclick*="copyTrk"],
.mem-topbar-btn[onclick*="copyTrk"] {
  font-size: max(12px, 0.75rem) !important;
  min-height: 40px;
  min-width: 40px;
}

/* Public / member / admin forms — unified control sizing on mobile */
@media (max-width: 991px) {
  .main-content .form-control,
  .main-content .form-select,
  .mem-container .form-control,
  .mem-container .form-select,
  .auth-portal-page .form-control,
  .auth-portal-page .form-select {
    min-height: 44px;
    font-size: 16px;
  }

  .main-content .form-check-input,
  .mem-container .form-check-input,
  .auth-portal-page .form-check-input {
    width: 1.15em;
    height: 1.15em;
    margin-top: 0.15em;
  }
}

/* Respect reduced-motion (accessibility) */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── v6: Quick Help + chat widgets — icon visibility & layout ── */

/* Uniform menu rows — ONLY when launcher is open (never force always-visible) */
.qh-menu {
  display: none !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 3px !important;
}

.qh-launcher.open .qh-menu {
  display: flex !important;
}

.qh-item,
button.qh-item {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  gap: 0.55rem !important;
  box-sizing: border-box !important;
  text-align: left !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  line-height: 1.25 !important;
}

.qh-item > span:last-child,
.qh-item > span:not(.qh-ic) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Icon wells — white glyphs on colored backgrounds (Lucide + FA) */
.qh-ic {
  flex: 0 0 26px !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

.qh-ic i,
.qh-ic .lucide-icon,
.qh-ic svg,
.qh-ic svg.lucide {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  stroke: #fff !important;
  fill: none !important;
  width: 13px !important;
  height: 13px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
  opacity: 1 !important;
}

.qh-item:hover .qh-ic i,
.qh-item:hover .qh-ic svg,
.qh-item:hover .qh-ic .lucide-icon {
  color: #fff !important;
  stroke: #fff !important;
}

.qh-section-label {
  padding: 4px 10px 2px !important;
  margin: 0 !important;
}

.qh-divider {
  margin: 4px 8px !important;
}

/* AI chat — give messages more room; compact ready-question chips */
#aiChatPanel {
  display: none;
  flex-direction: column !important;
  max-height: min(680px, calc(100dvh - 96px)) !important;
}

#aiChatPanel.open {
  display: flex !important;
}

#aiChatPanel .acp-messages {
  flex: 1 1 auto !important;
  min-height: min(280px, 42vh) !important;
  max-height: none !important;
  overflow-y: auto !important;
}

#aiChatPanel .acp-foot {
  flex: 0 0 auto !important;
  max-height: 38% !important;
  overflow: hidden !important;
  padding: 8px 10px 0 !important;
}

#aiChatPanel .acp-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  max-height: 72px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 0 6px !important;
  -webkit-overflow-scrolling: touch;
}

#aiChatPanel .acp-chip {
  flex: 0 1 auto !important;
  min-height: 32px !important;
  padding: 5px 9px !important;
  font-size: 11px !important;
  border-radius: 999px !important;
  line-height: 1.25 !important;
}

#aiChatPanel .acp-escalate {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 0 0 8px !important;
}

#aiChatPanel .acp-escalate button {
  flex: 1 1 calc(50% - 6px) !important;
  min-height: 36px !important;
  padding: 7px 8px !important;
  font-size: 11px !important;
  gap: 5px !important;
}

#aiChatPanel .acp-escalate button i {
  color: var(--primary-color, #1a5f2a) !important;
  font-size: 12px !important;
  opacity: 1 !important;
}

#aiChatPanel .acp-form {
  flex-shrink: 0 !important;
  padding: 10px 12px !important;
}

#aiChatPanel .acp-form input[type="text"]:not([name="website"]) {
  border-width: 1px !important;
  box-shadow: none !important;
}

#aiChatPanel .acp-form input[type="text"]:not([name="website"]):focus {
  outline: none !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color, #1a5f2a) 22%, transparent) !important;
}

/* Support center modal — single border, taller message area */
#publicChatPanel {
  display: none;
  flex-direction: column !important;
  max-height: min(560px, calc(100dvh - 100px)) !important;
}

#publicChatPanel.open {
  display: flex !important;
}

#publicChatPanel .pcp-h .lucide-icon,
#publicChatPanel .pcp-h svg.lucide,
#publicChatPanel .pcp-h > i {
  color: #fff !important;
  stroke: #fff !important;
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
}

#publicChatPanel .pcp-body {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 14px 14px 16px !important;
  overflow-y: auto !important;
  max-height: none !important;
}

#publicChatPanel .pcp-body label {
  margin-bottom: 0.35rem !important;
}

#publicChatPanel .pcp-body input,
#publicChatPanel .pcp-body textarea {
  width: 100% !important;
  border: 1px solid #d7e0db !important;
  border-radius: 10px !important;
  padding: 0.55rem 0.75rem !important;
  margin-bottom: 0.75rem !important;
  outline: none !important;
  box-shadow: none !important;
  background: #fff !important;
}

#publicChatPanel .pcp-body input:focus,
#publicChatPanel .pcp-body textarea:focus {
  border-color: var(--primary-color, #1a5f2a) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color, #1a5f2a) 20%, transparent) !important;
}

#publicChatPanel .pcp-body textarea {
  min-height: 112px !important;
  resize: vertical !important;
  margin-bottom: 0.85rem !important;
}

#publicChatPanel .pcp-body button[type="submit"] {
  margin-top: 0.25rem !important;
  min-height: 44px !important;
}

@media (max-width: 576px) {
  #aiChatPanel .acp-messages {
    min-height: min(220px, 36vh) !important;
  }

  #aiChatPanel .acp-foot {
    max-height: 34% !important;
  }

  #aiChatPanel .acp-chips {
    max-height: 64px !important;
  }
}