/* Jianzen workspace: existing text/status colors remain authoritative. */
.phone-link { color: inherit; text-decoration: underline; text-underline-offset: 3px; display: inline-block; padding: 5px 0; }
.mobile-filter-toggle { display: none; }
.release-notice { position: fixed; bottom: 78px; right: 20px; z-index: 12000; max-width: min(420px, calc(100vw - 40px)); display: flex; align-items: center; gap: 12px; padding: 14px 18px; background: white; border: 1px solid #dfe7f2; border-radius: 12px; box-shadow: 0 8px 32px #19305c26; font-size: 14px; }
.release-notice button { flex-shrink: 0; padding: 10px; cursor: pointer; background: #edf4ff; border: 1px solid #dfe7f2; border-radius: 8px; color: inherit; }
.app-shell {
  background: linear-gradient(135deg, #f1f5fc 0%, #f7f9fc 42%, #f3f7fd 100%);
}
.app-shell .sidebar {
  background: #fff;
  border-right: 1px solid #e3e9f3;
}
.app-shell .side-main { background: transparent; }
.app-shell .brand {
  gap: 12px;
  padding-bottom: 18px;
  margin-bottom: 16px;
  border-bottom: 1px solid #edf1f7;
}
.app-shell .brand::before {
  content: "";
  display: block;
  flex: 0 0 26px;
  height: 28px;
  background: linear-gradient(145deg, #1d4ed8, #3b82f6);
  clip-path: polygon(50% 0, 100% 100%, 50% 94%, 0 100%);
}
.app-shell .brand > div { min-width: 0; overflow-wrap: anywhere; }
.app-shell .nav-item,
.app-shell .nav-group-header { border-radius: 9px; }
.app-shell .nav-item.active {
  background: #edf4ff;
  box-shadow: inset 3px 0 0 #2563eb;
}
.app-shell .nav-item:hover:not(.active),
.app-shell .nav-group-header:hover { background: #f4f7fc; }
.app-shell .side-status { background: #f7f9fd; border-color: #e3e9f3; border-radius: 12px; }
.app-shell .topbar {
  border-bottom: 1px solid #e3e9f3;
  background: linear-gradient(115deg, #fff 65%, #f2f7ff 100%);
  box-shadow: 0 3px 14px rgba(25, 48, 92, .025);
}
.app-shell .panel,
.app-shell .metric,
.app-shell .knowledge-card,
.app-shell .knowledge-document-card {
  border-radius: 13px;
  border-color: #e3e9f3;
  box-shadow: 0 2px 4px rgba(25, 48, 92, .02), 0 7px 20px rgba(25, 48, 92, .035);
}
.app-shell .panel-head { gap: 12px; }
.app-shell .crm-tabs {
  border-radius: 13px 13px 0 0;
  border-color: #e3e9f3;
  background: #fff;
}
.app-shell .filter-panel {
  border-radius: 0 0 13px 13px;
  border-color: #e3e9f3;
  box-shadow: 0 5px 16px rgba(25, 48, 92, .025);
}
.app-shell .filter-row:last-child .filter-label { border-bottom-left-radius: 13px; }
.app-shell .filter-label { background: #f7f9fd; }
.app-shell .filter-row { border-color: #e9eef6; }
.app-shell .table-wrap { border-radius: 10px; }
.app-shell th { background: #f3f6fb; border-bottom-color: #dfe7f2; }
.app-shell td { border-bottom-color: #edf1f6; }
.app-shell tbody tr:hover > td { background: #f7faff; }
.app-shell .table-pagination { padding-top: 14px; }
.app-shell .icon-button,
.app-shell .row-button,
.drawer .row-button,
.app-shell .account-button { border-radius: 8px; border-color: #dfe6f0; }
.app-shell .icon-button:hover,
.app-shell .row-button:hover,
.drawer .row-button:hover { background: #f5f8fd; }
.app-shell .primary-button,
.modal .primary-button {
  border-radius: 9px;
  box-shadow: 0 3px 8px rgba(37, 99, 235, .13);
}
.app-shell input:not([type="checkbox"]):not([type="radio"]),
.app-shell select,
.modal input:not([type="checkbox"]):not([type="radio"]),
.modal select,
.modal textarea { border-radius: 8px; }
.app-shell .knowledge-category-nav,
.app-shell .knowledge-document-panel { background: #f8faff; }
.app-shell .knowledge-guide { border: 1px solid #dce8fa; }
.app-shell .knowledge-card { box-shadow: none; }
.app-shell .settings-nav-new.active { background: #edf4ff; }
.app-shell .account-dropdown,
.app-shell .notif-dropdown { border-radius: 12px; box-shadow: 0 12px 32px rgba(25, 48, 92, .12); }
.drawer.customer-detail .drawer-panel { background: #f3f6fb; }
.drawer .customer-main-card,
.drawer .customer-side-card {
  border-radius: 13px;
  border-color: #e1e8f2;
  box-shadow: 0 3px 14px rgba(25, 48, 92, .035);
}
.drawer .customer-main-card > .customer-detail-hero {
  min-height: 80px;
  padding: 0 0 16px;
  border: 0;
  border-bottom: 1px solid #edf1f6;
  background: transparent;
}
.drawer .customer-info-table { border-radius: 8px; overflow: hidden; }
.modal .modal-panel {
  border: 1px solid #dfe7f2;
  border-radius: 16px;
  box-shadow: 0 24px 70px rgba(25, 48, 92, .18);
}
@media (max-width: 768px) {
  .app-shell .crm-tabs { gap: 16px; padding: 0 14px; min-height: 42px; overflow-x: auto; }
  .app-shell .crm-tabs button { font-size: 14px; min-height: 42px; height: auto; padding: 10px 0; white-space: nowrap; }
  .app-shell .mobile-compact-filters:not(.filters-expanded) .filter-row:not(:first-child) { display: none; }
  .mobile-filter-toggle { display: block; margin: 6px 12px 10px auto; padding: 8px 12px; border: 1px solid #dfe7f2; border-radius: 8px; background: #f7f9fd; color: inherit; font-size: 13px; }
  .app-shell .filter-row:first-child .filter-label { display: none; }
  .app-shell .filter-row:first-child { display: block; }
  .app-shell .filter-panel input, .app-shell .filter-panel select { font-size: 16px; min-width: 0; }
  .app-shell .filter-panel .filter-content { gap: 8px; padding: 10px 12px; }
  .app-shell .filter-panel .search-line { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; }
  .app-shell .filter-panel .search-line select, .app-shell .filter-panel .search-line input { width: 100%; padding: 0 8px; }
  .app-shell .table-wrap td { font-size: 14px; line-height: 1.5; padding: 12px 10px; }
  .app-shell .table-wrap th { font-size: 12px; padding: 10px; }
  .app-shell .table-wrap .link-button { font-size: 14px; min-height: 36px; }
  .app-shell .table-wrap .customer-name { font-size: 15px; }
  .app-shell .row-button { min-height: 36px; }
  .app-shell .brand { margin-bottom: 12px; padding-bottom: 14px; }
  .app-shell .panel,
  .app-shell .metric,
  .drawer .customer-main-card,
  .drawer .customer-side-card { border-radius: 11px; }
  .app-shell .topbar { box-shadow: 0 2px 10px rgba(25, 48, 92, .035); }
  .mobile-bottom-nav { border-top: 1px solid #e1e8f2; box-shadow: 0 -4px 18px rgba(25, 48, 92, .045); }
  .mobile-bottom-nav button.active { background: #edf4ff; border-radius: 9px; }
  .modal .modal-panel { border-radius: 12px; }
}
