/* ChinaHomeRent unified button system
   Roles: primary (blue) · secondary/outline · soft · danger · wechat · favorite
   Keep WeChat green only for WeChat actions. */
:root {
  --btn-radius: 10px;
  --btn-fw: 600;
  --btn-fs: 0.92rem;
  --btn-fs-sm: 0.82rem;
  --btn-pad-y: 11px;
  --btn-pad-x: 20px;
  --btn-pad-sm-y: 8px;
  --btn-pad-sm-x: 14px;
  --btn-primary: #3498db;
  --btn-primary-hover: #2980b9;
  --btn-primary-active: #1f6fa3;
  --btn-ink: #2c3e50;
  --btn-muted: #5f6d7e;
  --btn-line: #cfd8e3;
  --btn-soft: #eef6fc;
  --btn-soft-hover: #dceef9;
  --btn-success: #27ae60;
  --btn-success-hover: #219a52;
  --btn-danger: #c0392b;
  --btn-danger-soft: #fdf4f3;
  --btn-danger-line: #e8b4ae;
  --btn-fav: #8a6230;
  --btn-fav-bg: #fbf6ee;
  --btn-fav-line: #e4d2b3;
  --btn-fav-saved: #1e7a4d;
  --btn-fav-saved-bg: #eef8f2;
  --btn-fav-saved-line: #b7e0c6;
  --btn-shadow: 0 1px 2px rgba(44, 62, 80, 0.06);
  --btn-shadow-hover: 0 6px 16px rgba(52, 152, 219, 0.22);
}

.btn,
a.btn,
button.btn,
input.btn,
input[type="submit"].btn,
.search-button,
.btn-search-primary,
.btn-search-advance,
.btn-submit,
.btn-submit-enquiry,
.btn-action:not(.fullscreen-close):not(.fullscreen-prev):not(.fullscreen-next),
.btn-primary-pill,
.btn-secondary-pill,
.view-more-btn,
.agc-btn,
.panel-btn.apply,
.admin-login-btn,
.admin-logout-btn,
.btn-beike,
.btn-save,
.btn-del,
.bc-copy-btn,
.chr-ai-overlay-body button.primary,
.ll-actions .btn-action,
.btn-read,
.btn-edit,
.btn-go,
.btn-ai,
.btn-pub,
.btn-off {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: var(--btn-pad-y) var(--btn-pad-x);
  border-radius: var(--btn-radius);
  font-family: inherit;
  font-size: var(--btn-fs);
  font-weight: var(--btn-fw);
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-decoration: none !important;
  cursor: pointer;
  border: 1.5px solid transparent;
  box-shadow: var(--btn-shadow);
  transition: background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
  vertical-align: middle;
  box-sizing: border-box;
}

.btn:hover,
a.btn:hover,
button.btn:hover,
.search-button:hover,
.btn-search-primary:hover,
.btn-search-advance:hover,
.btn-submit:hover,
.btn-submit-enquiry:hover,
.btn-primary-pill:hover,
.btn-secondary-pill:hover,
.view-more-btn:hover,
.agc-btn:hover,
.bc-copy-btn:hover,
.chr-ai-overlay-body button.primary:hover {
  transform: translateY(-1px);
}

.btn:focus-visible,
.search-button:focus-visible,
.agc-btn:focus-visible,
.quick-fav-btn:focus-visible,
.view-property:focus-visible,
.view-compound-btn:focus-visible {
  outline: 3px solid var(--primary-focus-ring, rgba(52, 152, 219, 0.28));
  outline-offset: 2px;
}

.btn:active,
.search-button:active,
.agc-btn:active {
  transform: translateY(0);
}

.btn:disabled,
button:disabled.btn,
.search-button:disabled,
.agc-btn:disabled,
.bc-copy-btn:disabled {
  opacity: 0.58;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none;
}

.btn-sm,
.btn.btn-sm,
a.btn-sm,
.agc-btn {
  padding: var(--btn-pad-sm-y) var(--btn-pad-sm-x);
  font-size: var(--btn-fs-sm);
  min-height: 36px;
}

.btn-lg,
.btn.btn-lg {
  padding: 14px 26px;
  font-size: 1.02rem;
}

/* 1. Primary — brand blue */
.btn,
a.btn:not([class*="btn-"]),
.btn.btn-primary,
.btn-primary,
a.btn-primary,
button.btn-primary,
.search-button,
.btn-search-primary,
.btn-submit,
.btn-submit-enquiry,
.btn-primary-pill,
.agc-btn-primary,
.agc-btn-notes,
.panel-btn.apply,
.admin-login-btn,
.btn-beike,
.btn-save,
.bc-copy-btn,
.chr-ai-overlay-body button.primary,
.btn-read,
.btn-edit,
.btn-go,
.btn-ai,
.btn-pub {
  background: var(--btn-primary) !important;
  background-image: none !important;
  color: #fff !important;
  border-color: var(--btn-primary) !important;
}

.btn:hover,
a.btn:not([class*="btn-"]):hover,
.btn.btn-primary:hover,
.btn-primary:hover,
a.btn-primary:hover,
.search-button:hover,
.btn-search-primary:hover,
.btn-submit:hover,
.btn-submit-enquiry:hover,
.btn-primary-pill:hover,
.agc-btn-primary:hover,
.agc-btn-notes:hover,
.panel-btn.apply:hover,
.admin-login-btn:hover,
.btn-beike:hover,
.btn-save:hover,
.bc-copy-btn:hover,
.chr-ai-overlay-body button.primary:hover,
.btn-read:hover,
.btn-edit:hover,
.btn-go:hover,
.btn-ai:hover,
.btn-pub:hover {
  background: var(--btn-primary-hover) !important;
  border-color: var(--btn-primary-hover) !important;
  color: #fff !important;
  box-shadow: var(--btn-shadow-hover);
}

.btn:active,
.btn.btn-primary:active,
.search-button:active {
  background: var(--btn-primary-active) !important;
  border-color: var(--btn-primary-active) !important;
}

/* 2. Secondary / outline */
.btn.btn-secondary,
.btn-secondary,
a.btn-secondary,
.btn.btn-outline-primary,
.btn-outline-primary,
.btn.btn-outline-secondary,
.btn-outline-secondary,
.btn.btn-review,
.btn-review,
.search-button:last-child,
.btn-search-advance,
.btn-secondary-pill,
.agc-btn-outline,
.agc-btn-soft,
.agc-btn-accent,
.view-more-btn,
.admin-logout-btn,
.btn-off,
.agent-card-v2-actions .btn-card {
  background: #fff !important;
  color: var(--btn-ink) !important;
  border-color: var(--btn-line) !important;
  box-shadow: none;
}

.btn.btn-secondary:hover,
.btn-secondary:hover,
a.btn-secondary:hover,
.btn.btn-outline-primary:hover,
.btn-outline-primary:hover,
.btn.btn-outline-secondary:hover,
.btn-outline-secondary:hover,
.btn.btn-review:hover,
.btn-review:hover,
.search-button:last-child:hover,
.btn-search-advance:hover,
.btn-secondary-pill:hover,
.agc-btn-outline:hover,
.agc-btn-soft:hover,
.agc-btn-accent:hover,
.view-more-btn:hover,
.admin-logout-btn:hover,
.btn-off:hover,
.agent-card-v2-actions .btn-card:hover {
  background: var(--btn-soft) !important;
  color: var(--btn-primary-hover) !important;
  border-color: var(--btn-primary) !important;
  box-shadow: none;
}

.btn.btn-outline-secondary.pd-sort-active,
.pd-same-sortbar .btn-outline-secondary.pd-sort-active {
  background: var(--btn-primary) !important;
  color: #fff !important;
  border-color: var(--btn-primary) !important;
}

/* 3. Soft filled — tertiary */
.btn.btn-light,
.btn-light,
.quick-btn,
.panel-btn.clear {
  background: var(--btn-soft) !important;
  color: var(--btn-ink) !important;
  border-color: transparent !important;
  box-shadow: none;
}

.btn.btn-light:hover,
.quick-btn:hover,
.panel-btn.clear:hover {
  background: var(--btn-soft-hover) !important;
  color: var(--btn-primary-hover) !important;
}

/* 4. Success → brand blue (avoid extra green CTAs). Saved/WeChat keep green. */
.btn.btn-success,
.btn-success,
a.btn-success,
.btn.btn-warning,
.btn-warning {
  background: var(--btn-primary) !important;
  color: #fff !important;
  border-color: var(--btn-primary) !important;
}

.btn.btn-success:hover,
.btn-success:hover,
.btn.btn-warning:hover,
.btn-warning:hover {
  background: var(--btn-primary-hover) !important;
  border-color: var(--btn-primary-hover) !important;
  color: #fff !important;
}

/* 5. Danger — logout / remove / delete only */
.btn.btn-danger,
.btn-danger,
.btn.btn-outline-danger,
.btn-outline-danger,
.btn-del {
  background: #fff !important;
  color: var(--btn-danger) !important;
  border: 1.5px solid var(--btn-danger-line) !important;
  box-shadow: none;
}

.btn.btn-danger:hover,
.btn-danger:hover,
.btn.btn-outline-danger:hover,
.btn-outline-danger:hover,
.btn-del:hover {
  background: var(--btn-danger-soft) !important;
  color: var(--btn-danger) !important;
  border-color: var(--btn-danger) !important;
}

/* Listing card actions — one family, not a rainbow */
.view-property,
.view-compound-btn,
.view-property-admin,
.btn-view,
.quick-fav-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 9px 12px !important;
  border-radius: 8px !important;
  font-size: 0.82rem !important;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
  cursor: pointer;
  box-sizing: border-box;
  white-space: nowrap;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}

.view-property,
.view-compound-btn,
.view-property-admin,
.btn-view {
  background: #fff !important;
  color: var(--btn-primary) !important;
  border: 1.5px solid #b9d8ef !important;
}

.view-property:hover,
.view-compound-btn:hover,
.view-property-admin:hover,
.btn-view:hover {
  background: var(--btn-soft) !important;
  color: var(--btn-primary-hover) !important;
  border-color: var(--btn-primary) !important;
}

.quick-fav-btn {
  background: var(--btn-fav-bg) !important;
  color: var(--btn-fav) !important;
  border: 1.5px solid var(--btn-fav-line) !important;
}

.quick-fav-btn:hover {
  background: #f4ead8 !important;
  border-color: #d4b88a !important;
  color: #744c1e !important;
}

.quick-fav-btn--saved,
.quick-fav-btn--saved:hover,
.agc-btn-soft.is-ok,
.agc-btn-soft.is-ok:hover {
  background: var(--btn-fav-saved-bg) !important;
  color: var(--btn-fav-saved) !important;
  border-color: var(--btn-fav-saved-line) !important;
}

/* Links that act as buttons */
.agc-btn-link,
.agc-btn-link-notes,
.btn-readmore {
  color: var(--btn-primary) !important;
  font-weight: 600;
  text-decoration: none;
}

.agc-btn-link:hover,
.agc-btn-link-notes:hover,
.btn-readmore:hover {
  color: var(--btn-primary-hover) !important;
  text-decoration: underline;
}

/* WeChat-only exception */
.wechat-copy-btn,
.chr-ai-linkbtn.wx,
.chr-ai-copy {
  color: #07C160;
}

/* Filter chips stay compact but share the palette */
.filter-btn:hover:not(.disabled) {
  border-color: var(--btn-primary);
  color: var(--btn-primary);
}

.filter-btn.active {
  background: var(--btn-ink);
  border-color: var(--btn-ink);
  color: #fff;
}

.custom-dropdown-btn.active-filter {
  border-color: var(--btn-primary) !important;
  background: var(--btn-soft) !important;
  color: var(--btn-ink);
}

/* Agent / account full-width stacks */
.agent-card .btn,
.agent-card .quick-fav-btn,
.w-100.btn,
.btn.w-100 {
  width: 100%;
}

.bc-modal-close:hover {
  color: var(--btn-primary);
}

.footer-component .btn,
.footer-component .btn-submit {
  background: var(--btn-primary) !important;
  color: #fff !important;
  border-color: var(--btn-primary) !important;
}

.footer-component .btn:hover,
.footer-component .btn-submit:hover {
  background: var(--btn-primary-hover) !important;
  border-color: var(--btn-primary-hover) !important;
  color: #fff !important;
}

.footer-component .btn-secondary {
  background: #fff !important;
  color: var(--btn-ink) !important;
  border-color: var(--btn-line) !important;
}

.footer-component .btn-secondary:hover {
  background: var(--btn-soft) !important;
  color: var(--btn-primary-hover) !important;
  border-color: var(--btn-primary) !important;
}