* {
  box-sizing: border-box;
}

:root {
  --bg: #f6f8fc;
  --panel: #ffffff;
  --panel-soft: #f8fafc;
  --text: #0f172a;
  --muted: #64748b;
  --line: #e5e7eb;

  --dark: #081225;
  --dark-2: #0f172a;
  --dark-3: #1e293b;

  --purple: #6d35f5;
  --purple-2: #8b5cf6;
  --purple-3: #4f46e5;
  --purple-soft: #f4f0ff;

  --blue: #2563eb;
  --blue-soft: #eff6ff;

  --green: #16a34a;
  --green-soft: #f0fdf4;

  --orange: #f59e0b;
  --orange-soft: #fffbeb;

  --red: #dc2626;
  --red-soft: #fef2f2;

  --shadow: 0 18px 45px rgba(15, 23, 42, 0.07);
  --shadow-2: 0 10px 24px rgba(15, 23, 42, 0.06);
  --radius: 18px;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Inter, Arial, Helvetica, sans-serif;
  background:
    radial-gradient(circle at top left, rgba(109, 53, 245, 0.06), transparent 32%),
    radial-gradient(circle at bottom right, rgba(37, 99, 235, 0.06), transparent 32%),
    var(--bg);
  color: var(--text);
}

.hidden {
  display: none !important;
}

button {
  border: 0;
  border-radius: 11px;
  padding: 10px 13px;
  cursor: pointer;
  background: var(--dark-2);
  color: white;
  font-weight: 850;
  transition: 0.15s ease;
}

button:hover {
  opacity: 0.95;
  transform: translateY(-1px);
}

input,
select,
textarea {
  outline: none;
  font-family: inherit;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #8b5cf6 !important;
  box-shadow: 0 0 0 3px rgba(109, 53, 245, 0.12);
}

.primary-gradient-btn {
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
  color: white;
  box-shadow: 0 10px 20px rgba(109, 53, 245, 0.22);
}

.dark-action-btn {
  background: var(--dark-2);
  color: white;
}

.light-action-btn {
  background: white;
  color: var(--dark);
  border: 1px solid var(--line);
}

/* LOGIN */

.login-screen {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at top left, rgba(139, 92, 246, 0.18), transparent 34%),
    radial-gradient(circle at bottom right, rgba(37, 99, 235, 0.15), transparent 34%),
    linear-gradient(135deg, #f8fafc, #eef2ff);
  padding: 22px;
}

.login-card {
  width: 410px;
  padding: 32px;
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.93);
  box-shadow: 0 30px 90px rgba(15, 23, 42, 0.16);
  border: 1px solid rgba(226, 232, 240, 0.95);
  backdrop-filter: blur(16px);
}

.login-logo {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
  color: white;
  display: grid;
  place-items: center;
  font-weight: 950;
  margin-bottom: 18px;
  box-shadow: 0 16px 30px rgba(109, 53, 245, 0.26);
}

.login-card h1 {
  margin: 0 0 8px;
  font-size: 31px;
  letter-spacing: -0.04em;
}

.login-card p {
  margin-top: 0;
  color: var(--muted);
  line-height: 1.45;
}

.login-label {
  display: grid;
  gap: 7px;
  font-size: 13px;
  font-weight: 850;
  color: #334155;
  margin-top: 14px;
}

.login-card input {
  width: 100%;
  padding: 14px;
  border: 1px solid #d1d5db;
  border-radius: 14px;
  font-size: 15px;
  background: white;
}

.login-card button {
  width: 100%;
  margin-top: 17px;
  padding: 14px;
  background: linear-gradient(135deg, var(--dark), #312e81);
}

.error-text {
  color: var(--red);
  font-size: 14px;
  margin-top: 12px;
  margin-bottom: 0;
}

/* APP LAYOUT */

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 230px 1fr;
}

.sidebar {
  height: 100vh;
  overflow-y: auto;
  background:
    radial-gradient(circle at top left, rgba(109, 53, 245, 0.22), transparent 34%),
    linear-gradient(180deg, #081225 0%, #0b1629 50%, #071122 100%);
  color: white;
  padding: 20px 14px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.brand-box {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 5px 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.brand-icon {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
  color: #8b5cf6;
  display: grid;
  place-items: center;
  font-weight: 950;
}

.brand-icon [data-lucide] {
  width: 24px;
  height: 24px;
  stroke-width: 2.4;
}

.brand-box h2 {
  margin: 0;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.05;
}

.brand-box p {
  margin: 2px 0 0;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 500;
}

.user-box {
  display: flex;
  align-items: center;
  gap: 11px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.10);
  padding: 12px;
  border-radius: 16px;
}

.user-avatar {
  width: 38px;
  height: 38px;
  border-radius: 13px;
  background: white;
  color: var(--dark);
  display: grid;
  place-items: center;
  font-weight: 950;
  font-size: 15px;
}

.user-box strong {
  display: block;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.015em;
}

.user-box span {
  display: block;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 500;
  margin-top: 2px;
  text-transform: capitalize;
}

.nav-menu {
  display: grid;
  gap: 5px;
}

.nav-btn {
  width: 100%;
  min-height: 42px;
  text-align: left;
  background: transparent;
  color: #cbd5e1;
  border-radius: 13px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  gap: 11px;
  position: relative;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.015em;
}

.nav-btn > span:last-child {
  line-height: 1;
}

.nav-icon {
  width: 25px;
  height: 25px;
  min-width: 25px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  color: #94a3b8;
  background: transparent;
}

.nav-icon [data-lucide] {
  width: 17px;
  height: 17px;
  stroke-width: 2.15;
}

.nav-btn:hover {
  background: rgba(255, 255, 255, 0.075);
  color: #ffffff;
  transform: none;
}

.nav-btn:hover .nav-icon {
  color: #c4b5fd;
}

.nav-btn.active-nav {
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(109, 53, 245, 0.28);
}

.nav-btn.active-nav .nav-icon {
  background: transparent;
  color: #ffffff;
}

.nav-btn.active-nav .nav-icon [data-lucide] {
  stroke-width: 2.3;
}

.nav-badge {
  margin-left: auto;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #ef4444;
  color: white;
  font-size: 10px;
  font-weight: 850;
  box-shadow: 0 5px 12px rgba(239, 68, 68, 0.28);
}

.nav-divider {
  height: 1px;
  margin: 10px 6px;
  background: rgba(255, 255, 255, 0.12);
}

.logout-btn {
  margin-top: auto;
  height: 40px;
  border-radius: 11px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.015em;
  background: rgba(255, 255, 255, 0.09);
  color: white;
}

/* GLOBAL INPUTS */

.search-input,
.note-section textarea,
.form-field input,
.form-field textarea,
.note-builder select,
.appointment-builder-fields input,
.settings-card input,
.settings-card select,
.today-log-textarea,
.intake-label input,
.intake-label select,
.add-lead-grid input,
.add-lead-grid select,
.quick-note-textarea,
.table-filter-row select {
  width: 100%;
  border: 1px solid #d8dee8;
  border-radius: 11px;
  padding: 9px 10px;
  font-size: 13px;
  background: white;
  font-weight: 400;
}

.search-input {
  margin-bottom: 12px;
}

/* MAIN */

.main-panel {
  height: 100vh;
  overflow-y: auto;
  padding: 24px;
}

.top-header {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.eyebrow {
  margin: 0 0 5px;
  color: #53657f;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 11px;
  font-weight: 850;
}

.top-header h1 {
  margin: 0;
  font-size: 31px;
  font-weight: 850;
  letter-spacing: -0.06em;
}

.top-header p,
.card-header p {
  color: #52637a;
  margin: 5px 0 0;
  font-size: 14px;
}

.top-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.notification-pill {
  width: 43px;
  height: 43px;
  border-radius: 15px;
  padding: 0;
  display: grid;
  place-items: center;
  background: #ffffff;
  color: #7c3aed;
  border: 1px solid #e6eaf2;
  position: relative;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.075);
}

.notification-pill [data-lucide] {
  width: 17px;
  height: 17px;
  stroke-width: 2.15;
}

.notification-pill small {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 999px;
  background: #6d35f5;
  color: white;
  border: 2px solid #ffffff;
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 900;
}

.top-pill,
.profile-pill {
  min-height: 43px;
  height: 43px;
  display: flex;
  align-items: center;
  gap: 9px;
  background: #ffffff;
  border: 1px solid #e6eaf2;
  border-radius: 15px;
  padding: 0 14px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.075);
}

.top-pill span {
  width: 28px;
  height: 28px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  color: #7c3aed;
  background: #f4f0ff;
}

.top-pill span [data-lucide] {
  width: 15px;
  height: 15px;
  stroke-width: 2.2;
}

.top-pill strong {
  font-size: 12px;
  font-weight: 750;
  color: #0f172a;
  letter-spacing: -0.015em;
}

.profile-pill {
  padding: 0 12px;
}

.top-profile-initial {
  width: 31px;
  height: 31px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: white;
  font-size: 13px;
  font-weight: 900;
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
}

.profile-pill strong {
  font-size: 12px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.015em;
  line-height: 1;
}

.profile-pill span {
  display: block;
  font-size: 10.5px;
  font-weight: 500;
  color: #64748b;
  line-height: 1;
  margin-top: 4px;
}

.header-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.page-section {
  animation: softFade 0.18s ease;
}

@keyframes softFade {
  from {
    opacity: 0;
    transform: translateY(5px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* STATS */

.today-dashboard {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 13px;
  margin-bottom: 16px;
}

.stat-card {
  background: white;
  border: 1px solid #e6eaf2;
  border-radius: 15px;
  padding: 14px 16px;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.055);
  display: flex;
  gap: 13px;
  align-items: flex-start;
  min-height: 92px;
}

.stat-icon {
  width: 35px;
  height: 35px;
  min-width: 35px;
  border-radius: 13px;
  display: grid;
  place-items: center;
}

.stat-icon [data-lucide] {
  width: 17px;
  height: 17px;
  stroke-width: 2.25;
}

.purple-stat {
  color: #7c3aed;
  background: #f3eefe;
}

.blue-stat {
  color: #2563eb;
  background: #eaf2ff;
}

.green-stat {
  color: #16a34a;
  background: #e8faef;
}

.red-stat {
  color: #dc2626;
  background: #feecec;
}

.orange-stat {
  color: #d97706;
  background: #fff3df;
}

.violet-stat {
  color: #7c3aed;
  background: #f2ecff;
}

.stat-card span {
  display: block;
  color: #52637a;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: -0.01em;
  margin-bottom: 4px;
}

.stat-card strong {
  display: block;
  font-size: 25px;
  font-weight: 800;
  letter-spacing: -0.055em;
  color: #0f172a;
  line-height: 1;
}

.stat-card small {
  color: #7b8aa2;
  font-size: 11px;
  font-weight: 500;
  display: block;
  margin-top: 7px;
  line-height: 1.25;
}

/* CARDS */

.dashboard-card,
.content-card {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 20px;
  padding: 18px;
  box-shadow: var(--shadow);
}

.card-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  align-items: flex-start;
}

.card-header h2 {
  margin: 0;
  letter-spacing: -0.04em;
  font-size: 23px;
}

.muted {
  color: var(--muted);
}

/* DASHBOARD PERFORMANCE UPDATE */


.dashboard-card-header {
  margin-bottom: 16px;
}

.dashboard-card-header h2 {

  font-weight: 850;
  letter-spacing: -0.045em;
}


.performance-card {
  overflow: hidden;
  position: relative;
}

.performance-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, #6d35f5, #4f46e5, #8b5cf6);
}

.performance-tabs {

  align-items: center;
  gap: 7px;


}

.performance-tab {
  height: 31px;


  font-size: 12px;

}

.performance-tab:hover {
  transform: none;
  background: #ffffff;
  color: #0f172a;
}


.money-card {
  position: relative;
  overflow: hidden;
}

.money-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, #16a34a, #22c55e);
}

.money-main {
  background:
    radial-gradient(circle at top right, rgba(22, 163, 74, 0.13), transparent 36%),
    #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 12px;
}

.money-main span {
  display: block;
  color: #166534;
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.money-main strong {
  display: block;
  color: #0f172a;
  font-size: 34px;
  line-height: 1;
  letter-spacing: -0.065em;
  margin-top: 8px;
}

.money-main small {
  display: block;
  color: #64748b;
  font-size: 12px;
  margin-top: 8px;
  line-height: 1.35;
}

.money-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.money-grid div {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 12px;
}

.money-grid span {
  display: block;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

.money-grid strong {
  display: block;
  color: #0f172a;
  font-size: 20px;
  font-weight: 850;
  letter-spacing: -0.05em;
  margin-top: 5px;
}


/* DASHBOARD WORKFLOW */


/* RECENT LEADS UPGRADE */


/* COACHING */


/* LEADS PAGE */

.lead-intake-card {
  margin-bottom: 16px;
  position: relative;
  overflow: visible;
  padding: 16px;
}

.lead-intake-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, var(--purple), var(--purple-3), var(--purple-2));
  border-radius: 20px 20px 0 0;
}

.intake-header {
  margin-bottom: 12px;
}

.intake-header h2 {
  font-size: 24px;
}

.intake-header p {
  font-size: 14px;
}


.intake-grid {
  display: grid;
  gap: 12px;
}


.intake-panel {
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px;
  display: grid;
  gap: 10px;
  align-content: start;
  min-height: 230px;
  position: relative;
}

.panel-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 1px;
}

.panel-title-row h3 {
  margin: 0;
  letter-spacing: -0.03em;
  font-size: 15px;
}

.panel-number {
  width: 25px;
  height: 25px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
  color: white;
  font-size: 12px;
  font-weight: 950;
}

.intake-label {
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

.intake-label span {
  font-weight: 700;
}

.intake-label input,
.intake-label select {
  font-weight: 400;
}

.custom-state-wrap {
  position: relative;
}

.custom-state-wrap input,
#newLeadCallsMadeSelect,
#newLeadCallResultSelect {
  padding-right: 40px;
}

#newLeadCallsMadeSelect,
#newLeadCallResultSelect {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: #ffffff;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 8L10 12L14 8' stroke='%2364748B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 13px center;
  background-size: 14px 14px;
}

.state-dropdown-button {
  position: absolute;
  right: 13px;
  top: 31px;
  width: 14px;
  height: 36px;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: transparent;
  font-size: 0;
  line-height: 1;
  z-index: 3;
  display: grid;
  place-items: center;
}

.state-dropdown-button::after {
  content: "";
  width: 14px;
  height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 8L10 12L14 8' stroke='%2364748B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.state-dropdown-button:hover {
  background: transparent;
  border: none;
  transform: none;
  opacity: 1;
}

.state-dropdown-list {
  position: absolute;
  left: 0;
  right: 0;
  top: 70px;
  max-height: 265px;
  overflow-y: auto;
  background: white;
  border: 1px solid #d8dee8;
  border-radius: 14px;
  box-shadow: 0 18px 35px rgba(15, 23, 42, 0.16);
  z-index: 40;
  padding: 7px;
  font-weight: 400;
}

.state-option {
  width: 100%;
  border-radius: 10px;
  padding: 9px 10px;
  background: white;
  color: #0f172a;
  font-size: 13px;
  font-weight: 400;
  text-align: left;
  display: block;
}

.state-option:hover,
.state-option.active-state-option {
  background: #f4f0ff;
  color: #4f46e5;
  transform: none;
  font-weight: 400;
}

.state-option-empty {
  padding: 10px;
  font-size: 13px;
  color: var(--muted);
}

.action-choice-list {
  display: grid;
  gap: 7px;
}

.action-choice {
  display: flex;
  align-items: center;
  gap: 8px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 9px 10px;
  cursor: pointer;
  transition: 0.15s ease;
  font-size: 12px;
  font-weight: 600;
}

.action-choice span {
  font-weight: 600;
}

.action-choice:hover,
.action-choice.active-choice {
  border-color: #c4b5fd;
  background: #faf5ff;
  box-shadow: 0 8px 18px rgba(109, 53, 245, 0.08);
}

.action-choice input {
  accent-color: var(--purple);
  width: 13px;
  height: 13px;
}

.dynamic-action-section {
  display: grid;
  gap: 9px;
}


#soldDetails input,
#newLeadMonthlyPremiumInput,
#newLeadAnnualPremiumInput {
  font-weight: 400;
  color: #0f172a;
}

#soldDetails input::placeholder {
  font-weight: 400;
  color: #94a3b8;
}

.empty-action-box {
  min-height: 128px;
  display: grid;
  place-items: center;
  text-align: center;
  border: 1px dashed #cbd5e1;
  border-radius: 14px;
  background: white;
  color: var(--muted);
  padding: 14px;
}

.empty-action-box span {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  color: var(--green);
  background: var(--green-soft);
  font-weight: 950;
  margin-bottom: 7px;
}

.empty-action-box p {
  margin: 0;
  line-height: 1.35;
  font-size: 12px;
}

.quick-note-textarea {
  min-height: 137px;
  resize: vertical;
  line-height: 1.45;
  font-weight: 400;
}

.quick-note-counter {
  display: flex;
  justify-content: flex-end;
  color: var(--muted);
  font-size: 11px;
}


.route-icon {
  width: 32px;
  height: 32px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  background: var(--green-soft);
  color: var(--green);
  font-weight: 950;
  flex-shrink: 0;
}


/* ALL LEADS TABLE */

.leads-list-card {
  padding: 0;
  overflow: hidden;
}

.all-leads-table-shell {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  overflow: hidden;
}

.all-leads-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  padding: 16px 16px 14px;
  border-bottom: 1px solid #e5e7eb;
  background: #ffffff;
}

.all-leads-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}

.all-leads-left h2 {
  margin: 0;
  font-size: 18px;
  letter-spacing: -0.03em;
  white-space: nowrap;
}

.all-leads-search-wrap {
  position: relative;
  width: 280px;
  max-width: 100%;
}

.all-leads-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 13px;
  pointer-events: none;
}

.all-leads-search-input {
  width: 100%;
  height: 36px;
  border: 1px solid #d8dee8;
  border-radius: 9px;
  background: #ffffff;
  padding: 8px 12px 8px 34px;
  font-size: 13px;
  font-weight: 400;
  color: #0f172a;
}

.all-leads-search-input::placeholder {
  color: #94a3b8;
}

.all-leads-filters {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 0;
}

.all-leads-filters select {
  height: 36px;
  min-width: 155px;
  border: 1px solid #d8dee8;
  border-radius: 9px;
  background-color: #ffffff;
  padding: 8px 36px 8px 12px;
  font-size: 13px;
  font-weight: 400;
  color: #0f172a;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 8L10 12L14 8' stroke='%2364748B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 14px 14px;
}


.all-leads-archived-filter {
  height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid #d8dee8;
  border-radius: 9px;
  padding: 8px 12px;
  color: #64748b;
  font-size: 13px;
  font-weight: 600;
  background: #ffffff;
}

.all-leads-table-area {
  padding: 0;
}

.all-leads-table-area .schedule-block {
  border: 0;
  border-radius: 0;
  background: #ffffff;
  padding: 0;
}

.all-leads-table-area .schedule-block h3 {
  display: none;
}

.all-leads-table-area .schedule-table-wrap {
  overflow-x: auto;
}

.all-leads-table-area .schedule-table {
  width: 100%;
  border-collapse: collapse;
  background: #ffffff;
  border-radius: 0;
}

.all-leads-table-area .schedule-table th {
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  padding: 11px 16px;
  border-bottom: 1px solid #e5e7eb;
}

.all-leads-table-area .schedule-table td {
  color: #334155;
  font-size: 12px;
  font-weight: 400;
  padding: 11px 16px;
  border-bottom: 1px solid #e5e7eb;
  vertical-align: middle;
}

.all-leads-table-area .schedule-table tbody tr:hover {
  background: #f8fafc;
}


.all-leads-table-area .result-pill,
.all-leads-table-area .age-pill {
  font-size: 11px;
  font-weight: 700;
  padding: 4px 9px;
}

.all-leads-table-area .mini-btn {
  height: 30px;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  margin: 0 5px 0 0;
}

.all-leads-table-area .success-mini-btn {
  background: #ffffff;
  color: #0f172a;
  border: 1px solid #d8dee8;
}

.all-leads-table-area .warning-mini-btn {
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  color: #ffffff;
  border: 1px solid transparent;
}

.all-leads-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  background: #ffffff;
}

.all-leads-footer p {
  margin: 0;
  color: #64748b;
  font-size: 12px;
}

.all-leads-pagination {
  display: flex;
  align-items: center;
  gap: 8px;
}

.all-leads-pagination select {
  height: 34px;
  border: 1px solid #d8dee8;
  border-radius: 9px;
  background-color: #ffffff;
  padding: 7px 32px 7px 10px;
  font-size: 12px;
  font-weight: 400;
  color: #0f172a;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 8L10 12L14 8' stroke='%2364748B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 14px 14px;
}

.pagination-arrow,
.leads-page-buttons button {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  padding: 0;
  display: grid;
  place-items: center;
  background: #ffffff;
  color: #334155;
  border: 1px solid #d8dee8;
  font-size: 13px;
  font-weight: 700;
}

.pagination-arrow:hover,
.leads-page-buttons button:hover {
  transform: none;
  background: #f8fafc;
}

.leads-page-buttons {
  display: flex;
  align-items: center;
  gap: 6px;
}

.leads-page-buttons button.active-page {
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  color: #ffffff;
  border-color: transparent;
}

.leads-page-ellipsis {
  color: #64748b;
  font-size: 13px;
  padding: 0 4px;
}

/* LEAD PROFILE — consolidated at end of file */

/* MODALS */

.modal {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.58);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 24px;
  z-index: 50;
}

.modal-content {
  width: min(1100px, 100%);
  max-height: 92vh;
  overflow-y: auto;
  background: white;
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 30px 70px rgba(15, 23, 42, 0.28);
}

.sticky-modal-header {
  position: sticky;
  top: -22px;
  background: white;
  z-index: 3;
  padding-top: 4px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}

.modal-header h2,
.modal-header h3 {
  margin: 0;
  letter-spacing: -0.03em;
}

.modal-header p {
  color: var(--muted);
  margin: 6px 0 0;
}

.modal-header-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.small-btn {
  padding: 9px 11px;
  font-size: 13px;
  background: #334155;
}

.form-tabs,
.schedule-tabs,
.unanswered-filters {
  display: flex;
  gap: 10px;
  margin: 18px 0;
  flex-wrap: wrap;
}

.form-tabs button,
.schedule-tabs button,
.unanswered-filters button {
  background: #e5e7eb;
  color: var(--text);
}

.form-tabs .active-tab,
.schedule-tabs .active-tab,
.unanswered-filters .active-tab {
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
  color: white;
}


/* TABLES / LISTS */

.schedule-list {
  display: grid;
  gap: 16px;
}

.schedule-block {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px;
  background: var(--panel-soft);
}

.schedule-block h3 {
  margin: 0 0 12px;
}

.schedule-table-wrap {
  overflow-x: auto;
}

.schedule-table {
  width: 100%;
  border-collapse: collapse;
  background: white;
  border-radius: 14px;
  overflow: hidden;
}

.schedule-table th,
.schedule-table td {
  border-bottom: 1px solid var(--line);
  text-align: left;
  padding: 10px 11px;
  font-size: 12px;
  vertical-align: top;
}

.schedule-table th {
  background: #f3f4f6;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
}

.schedule-table tbody tr:hover {
  background: #f8fafc;
}

.mini-btn {
  padding: 6px 8px;
  font-size: 11px;
  margin-right: 5px;
  margin-bottom: 5px;
  border-radius: 9px;
}

.danger-mini-btn {
  background: var(--red);
}

.warning-mini-btn {
  background: var(--orange);
}

.success-mini-btn {
  background: var(--green);
}


.slide-panel {
  margin-top: 22px;
  background: var(--panel-soft);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 16px;
}

.age-pill {
  display: inline-block;
  background: #e5e7eb;
  color: var(--text);
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 850;
}

.result-pill {
  display: inline-block;
  background: #dcfce7;
  color: #166534;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 950;
}

.result-pill.no-answer {
  background: var(--red-soft);
  color: #b91c1c;
}

.result-pill.answered {
  background: var(--green-soft);
  color: #166534;
}

.result-pill.appointment {
  background: var(--blue-soft);
  color: #1d4ed8;
}

.result-pill.not-interested {
  background: var(--red-soft);
  color: #991b1b;
}

.result-pill.sold {
  background: #dcfce7;
  color: #14532d;
}

.today-call-log-builder {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 16px;
}

.today-log-textarea {
  min-height: 120px;
  resize: vertical;
  margin-top: 12px;
}

.today-log-actions {
  margin-top: 12px;
  justify-content: flex-end;
}

#saveTodayCallLogButton {
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
}

#todayCallLogPanel {
  border-color: #ddd6fe;
  background: #faf5ff;
}


.last-note-preview {
  max-width: 420px;
  white-space: pre-wrap;
  line-height: 1.45;
}

/* SETTINGS */

.settings-grid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 18px;
  margin-top: 20px;
}

.settings-card {
  background: var(--panel-soft);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 18px;
  display: grid;
  gap: 13px;
  align-content: start;
}

.settings-card h3 {
  margin: 0 0 4px;
}

.settings-note {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
}

.users-list {
  display: grid;
  gap: 10px;
}

.user-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  background: white;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 13px;
}

.user-row strong {
  display: block;
}

.user-row span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-top: 3px;
}

.user-row-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* RESPONSIVE */

@media (max-width: 1550px) {


  .lead-summary-card {
    grid-template-columns: 1fr;
  }

  .lead-summary-divider {
    display: none;
  }

  .lead-summary-actions {
    flex-wrap: wrap;
  }
}

@media (max-width: 1500px) {


  .performance-card {
    grid-column: span 2;
  }

  .pipeline-card,
  .money-card {
    grid-column: span 1;
  }
}

@media (max-width: 1380px) {
  .today-dashboard {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lead-work-grid {
    grid-template-columns: 1fr;
  }

  .timeline-note-row {
    grid-template-columns: 120px 110px 70px 1fr;
  }

  .timeline-note-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-left: 24px;
  }
}

@media (max-width: 1280px) {

}

@media (max-width: 1200px) {


  .performance-card,
  .dashboard-bottom-grid .large-card,
  .pipeline-card,
  .money-card {
    grid-column: span 1;
  }


  .settings-grid {
    grid-template-columns: 1fr;
  }


}

@media (max-width: 1000px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    width: 100%;
    height: auto;
  }

  .main-panel {
    height: auto;
  }

  .note-builder,
  .today-call-log-builder {
    grid-template-columns: 1fr;
  }

  .appointment-builder-fields {
    grid-template-columns: 1fr;
  }

  .appointment-builder-fields p {
    grid-column: span 1;
  }


  .lead-log-fields,
  .lead-extra-fields {
    grid-template-columns: 1fr;
  }

  .timeline-note-row {
    grid-template-columns: 1fr;
    gap: 7px;
    padding-left: 42px;
  }

  .timeline-note-date {
    padding-left: 0;
  }

  .timeline-note-actions {
    padding-left: 0;
  }
}

@media (max-width: 980px) {
  .all-leads-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .all-leads-left {
    flex-direction: column;
    align-items: stretch;
  }

  .all-leads-search-wrap {
    width: 100%;
  }

  .all-leads-filters {
    flex-direction: column;
    align-items: stretch;
  }

  .all-leads-filters select,
  .all-leads-filter-btn,
  .all-leads-archived-filter {
    width: 100%;
  }

  .all-leads-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .all-leads-pagination {
    justify-content: center;
    flex-wrap: wrap;
  }
}

@media (max-width: 760px) {
  .main-panel {
    padding: 18px;
  }

  .top-header,
  .modal-header,
  .card-header {
    flex-direction: column;
    align-items: stretch;
  }

  .top-header-actions,
  .header-actions,
  .modal-header-actions {
    width: 100%;
    flex-direction: column;
  }

  .top-pill,
  .profile-pill,
  .notification-pill {
    width: 100%;
  }

  .today-dashboard {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }


  .modal {
    padding: 10px;
  }

  .modal-content {
    border-radius: 18px;
  }

  .user-row {
    grid-template-columns: 1fr;
  }


  .lead-summary-card {
    padding: 16px;
  }

  .lead-summary-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .lead-action-dark,
  .lead-action-gray,
  .lead-action-red {
    width: 100%;
  }
}

@media (max-width: 650px) {
  .performance-tabs {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .performance-tab {
    width: 100%;
  }

  .rate-grid,
  .performance-mini-metrics,
  .money-grid {
    grid-template-columns: 1fr;
  }


}

@media (max-width: 520px) {
  .today-dashboard {
    grid-template-columns: 1fr;
  }

  .sidebar {
    padding: 16px;
  }

  .top-header h1 {
    font-size: 28px;
  }

  .stat-card {
    align-items: center;
  }

  .lead-summary-stats {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
}
/* FIX ACTIVITY TIMELINE LONG INITIAL NOTES */

.timeline-note-row {
  min-height: 66px;
  grid-template-columns: 120px 120px 90px minmax(0, 1fr) auto;
}

.timeline-note-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  line-height: 1.4;
  align-self: center;
}

.timeline-note-actions {
  white-space: nowrap;
}

.timeline-note-date,
.timeline-note-result,
.timeline-note-calls {
  align-self: center;
}
/* SHARED LEADS UPDATE */

.shared-folder-create-card {
  margin-bottom: 16px;
  position: relative;
  overflow: hidden;
}

.shared-folder-create-card::before,
.shared-source-header-card::before,
.shared-lead-entry-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, #6d35f5, #4f46e5, #8b5cf6);
}

.shared-source-create-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: end;
}

.shared-source-create-row button {
  height: 39px;
  min-width: 150px;
}

.shared-source-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.shared-source-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  padding: 16px;
  cursor: pointer;
  transition: 0.15s ease;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.045);
}

.shared-source-card:hover {
  transform: translateY(-2px);
  border-color: #c4b5fd;
  box-shadow: 0 18px 40px rgba(109, 53, 245, 0.09);
}

.shared-source-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.shared-source-icon {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: #f4f0ff;
  color: #6d35f5;
  flex-shrink: 0;
}

.shared-source-icon [data-lucide] {
  width: 19px;
  height: 19px;
  stroke-width: 2.25;
}

.shared-source-card h3 {
  margin: 0;
  color: #0f172a;
  font-size: 18px;
  font-weight: 850;
  letter-spacing: -0.04em;
}

.shared-source-card p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
}

.shared-source-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.shared-source-stats div {
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 9px;
}

.shared-source-stats span {
  display: block;
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.shared-source-stats strong {
  display: block;
  color: #0f172a;
  font-size: 18px;
  font-weight: 850;
  letter-spacing: -0.04em;
  margin-top: 4px;
}

/* SHARED SOURCE FOLDER PAGE */

.shared-source-header-card {
  position: relative;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 20px;
  padding: 18px;
  box-shadow: var(--shadow);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}

.shared-source-header-card h2 {
  margin: 0;
  color: #0f172a;
  font-size: 28px;
  font-weight: 850;
  letter-spacing: -0.06em;
}

.shared-source-header-card p:not(.eyebrow) {
  margin: 5px 0 0;
  color: #64748b;
  font-size: 13px;
}

.shared-source-header-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.shared-tabs-card {
  margin-bottom: 16px;
  padding: 12px;
}

.shared-tabs {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
}

.shared-tab {
  height: 36px;
  border-radius: 10px;
  padding: 0 13px;
  background: #f1f5f9;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.shared-tab:hover {
  transform: none;
  background: #ffffff;
  color: #0f172a;
}

.shared-tab.active-tab {
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(109, 53, 245, 0.18);
}

.shared-panel {
  display: grid;
  gap: 16px;
}

.shared-lead-entry-card {
  position: relative;
  overflow: hidden;
}

.shared-add-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

.shared-add-grid button {
  height: 39px;
}

.shared-add-grid .intake-label input {
  height: 39px;
}

/* SHARED LEADS TABLE */

.shared-lead-name-cell strong {
  display: block;
  color: #0f172a;
  font-size: 13px;
  font-weight: 750;
  letter-spacing: -0.015em;
}

.shared-lead-name-cell span {
  display: block;
  color: #64748b;
  font-size: 11px;
  margin-top: 3px;
}

.shared-contact-small {
  display: grid;
  gap: 3px;
}

.shared-contact-small span {
  display: block;
  color: #334155;
  font-size: 12px;
  font-weight: 400;
}

.shared-reason-cell {
  max-width: 230px;
  color: #475569;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* SHARED DETAIL */

.shared-contact-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.055);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
}

.shared-contact-item {
  padding: 14px 18px;
  border-right: 1px solid #e5e7eb;
}

.shared-contact-item:last-child {
  border-right: 0;
}

.shared-contact-item span {
  display: block;
  color: #64748b;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.shared-contact-item strong {
  display: block;
  color: #0f172a;
  font-size: 14px;
  font-weight: 700;
  word-break: break-word;
}

/* SHARED TODAY CALLS */

#sharedTodayCallLogPanel {
  border-color: #ddd6fe;
  background: #faf5ff;
}

#sharedTodayCallLogTitle {
  color: #4c1d95;
}

#saveSharedTodayCallLogButton {
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
}


/* RESPONSIVE SHARED LEADS */

@media (max-width: 1400px) {
  .shared-source-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shared-add-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1000px) {
  .shared-source-header-card {
    flex-direction: column;
    align-items: stretch;
  }

  .shared-source-header-actions {
    width: 100%;
  }

  .shared-source-header-actions button {
    flex: 1;
  }

  .shared-add-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shared-contact-card {
    grid-template-columns: 1fr;
  }

  .shared-contact-item {
    border-right: 0;
    border-bottom: 1px solid #e5e7eb;
  }

  .shared-contact-item:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 760px) {
  .shared-source-create-row {
    grid-template-columns: 1fr;
  }

  .shared-source-grid {
    grid-template-columns: 1fr;
  }

  .shared-source-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shared-add-grid {
    grid-template-columns: 1fr;
  }

  .shared-tabs {
    display: grid;
    grid-template-columns: 1fr;
  }

  .shared-tab {
    width: 100%;
  }
}
/* AGENT TRACKER */

.tracker-hero-card,
.tracker-total-card,
.tracker-panel,
.tracker-agents-section {
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid #e6eaf2;
  border-radius: 24px;
  box-shadow: var(--shadow);
}

.tracker-hero-card {
  padding: 24px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  margin-bottom: 16px;
  background:
    radial-gradient(circle at top left, rgba(109, 53, 245, 0.13), transparent 32%),
    linear-gradient(135deg, #ffffff, #f8fafc);
}

.tracker-hero-card h2 {
  margin: 0;
  font-size: 28px;
  letter-spacing: -0.05em;
}

.tracker-hero-card p {
  margin: 6px 0 0;
  color: var(--muted);
}

.tracker-hero-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.tracker-range-btn {
  background: white;
  color: var(--dark);
  border: 1px solid #e6eaf2;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.tracker-range-btn.active-tab {
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
  color: white;
  border-color: transparent;
}

.tracker-week-wrap {
  margin-bottom: 16px;
  display: flex;
  justify-content: flex-end;
}

.tracker-week-wrap label {
  display: grid;
  gap: 7px;
  font-size: 12px;
  font-weight: 850;
  color: #334155;
}

.tracker-week-wrap select {
  min-width: 240px;
  border: 1px solid #d8dee8;
  border-radius: 12px;
  padding: 10px 12px;
  background: white;
  font-weight: 750;
}

.tracker-total-card {
  padding: 22px;
  margin-bottom: 18px;
  color: white;
  background:
    radial-gradient(circle at top right, rgba(139, 92, 246, 0.42), transparent 32%),
    linear-gradient(135deg, #081225, #1e1b4b);
  border-color: rgba(255, 255, 255, 0.08);
}

.tracker-total-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 18px;
}

.tracker-total-header span {
  color: #c4b5fd;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.tracker-total-header h2 {
  margin: 5px 0 0;
  font-size: 27px;
  letter-spacing: -0.05em;
}

.tracker-total-header p {
  color: #cbd5e1;
  margin: 5px 0 0;
}

.tracker-total-badge {
  border-radius: 999px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: white;
  font-size: 12px;
  font-weight: 850;
}

.tracker-total-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(105px, 1fr));
  gap: 10px;
}

.tracker-total-grid div {
  background: rgba(255, 255, 255, 0.11);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 18px;
  padding: 14px;
}

.tracker-total-grid span {
  display: block;
  color: #cbd5e1;
  font-size: 12px;
  font-weight: 750;
}

.tracker-total-grid strong {
  display: block;
  margin-top: 7px;
  font-size: 27px;
  letter-spacing: -0.04em;
}

.tracker-control-grid {
  display: grid;
  grid-template-columns: 0.8fr 1.6fr;
  gap: 16px;
  margin-bottom: 18px;
}

.tracker-panel,
.tracker-agents-section {
  padding: 20px;
}

.tracker-form-row {
  display: grid;
  gap: 12px;
}

.tracker-form-row label,
.tracker-entry-grid label,
.tracker-notes-label {
  display: grid;
  gap: 7px;
  font-size: 12px;
  font-weight: 850;
  color: #334155;
}

.tracker-form-row input,
.tracker-entry-grid input,
.tracker-entry-grid select,
.tracker-notes-label textarea {
  width: 100%;
  border: 1px solid #d8dee8;
  border-radius: 12px;
  padding: 10px 12px;
  font-size: 13px;
  background: white;
  font-weight: 650;
}


.tracker-agent-actions {


  justify-content: flex-end;
  margin-top: 14px;
}

.tracker-agent-actions button {
  padding: 8px 10px;
  font-size: 12px;
}


@media (max-width: 1180px) {
  .tracker-total-grid,
  .tracker-agent-metrics {
    grid-template-columns: repeat(2, 1fr);
  }

  .tracker-control-grid,
  .tracker-agents-grid {
    grid-template-columns: 1fr;
  }


}

@media (max-width: 720px) {
  .tracker-hero-card,
  .tracker-total-header {
    flex-direction: column;
    align-items: stretch;
  }

  .tracker-total-grid,
  .tracker-agent-metrics,
  .tracker-entry-grid {
    grid-template-columns: 1fr;
  }
}


/* TRACKER EDIT / DELETE CONTROLS */


/* Agent Tracker read-only connected cards */


/* BULK LEAD SELECTION */
.bulk-delete-btn {
  background: #dc2626;
  color: white;
  border: 1px solid #dc2626;
  font-weight: 850;
}

.bulk-delete-btn:hover {
  background: #b91c1c;
  border-color: #b91c1c;
}


body.tracker-user-mode .top-header,
body.tracker-user-mode #todayDashboard {
  display: none !important;
}

body.tracker-user-mode .main-panel {
  padding-top: 24px;
}

.tracker-add-agent-only {
  grid-template-columns: minmax(280px, 460px) 1fr;
}


.tracker-agent-search-wrap {
  min-width: 260px;
  max-width: 360px;
  flex: 1;
}

.tracker-agent-search-wrap input {
  width: 100%;
  border: 1px solid #d8dee8;
  border-radius: 13px;
  padding: 12px 14px;
  background: white;
  font-weight: 750;
}


.tracker-agent-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.tracker-agent-actions button {
  min-height: 38px;
}

@media (max-width: 1500px) and (min-width: 901px) {
  .tracker-agent-table {
    min-width: 1320px;
  }

  .tracker-agent-table th,
  .tracker-agent-table td {
    padding-left: 9px;
    padding-right: 9px;
  }

  .tracker-agent-name-cell {
    min-width: 205px;
  }

  .tracker-agent-table th {
    font-size: 10px;
    letter-spacing: 0.04em;
  }
}

@media (max-width: 900px) {

}


/* TRACKER REPORT VIEW */
.tracker-view-tabs {
  display: flex;
  gap: 10px;
  margin: 14px 0 16px;
  flex-wrap: wrap;
}

.tracker-view-tab {
  background: #ffffff;
  color: #0f172a;
  border: 1px solid #e5e7eb;
  border-radius: 13px;
  padding: 11px 18px;
  font-weight: 900;
}

.tracker-view-tab.active-tab {
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  color: white;
  box-shadow: 0 10px 24px rgba(109, 53, 245, 0.24);
}

.tracker-report-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 22px;
  padding: 22px;
  box-shadow: var(--shadow-2);
}

.tracker-report-header {
  align-items: center;
}

.tracker-report-textarea {
  width: 100%;
  min-height: 310px;
  resize: vertical;
  border: 1px solid #d8dee8;
  border-radius: 18px;
  padding: 18px;
  font-size: 18px;
  line-height: 1.8;
  font-weight: 750;
  background: #111827;
  color: #ffffff;
  white-space: pre-wrap;
}


/* LEADS TAB COMPACT INTAKE UPDATE - only changes the add-lead process */
.compact-lead-intake-card {
  padding: 16px;
}

.compact-intake-header {
  margin-bottom: 14px;
}

.compact-intake-grid {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(300px, 0.95fr) minmax(330px, 1fr);
  gap: 14px;
  align-items: stretch;
}

.compact-intake-panel {
  min-height: auto;
  padding: 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.035);
}

.compact-panel-title-row {
  margin-bottom: 10px;
}

.compact-panel-title-row h3 {
  font-size: 16px;
}

.compact-panel-icon {
  margin-left: auto;
  color: #64748b;
  display: grid;
  place-items: center;
}

.compact-panel-icon [data-lucide] {
  width: 17px;
  height: 17px;
  stroke-width: 2.1;
}

.compact-two-field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.quick-note-compact-box {
  margin-top: 4px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #ffffff;
  padding: 10px;
  display: grid;
  gap: 9px;
}

.quick-note-compact-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #334155;
}

.quick-note-compact-header > [data-lucide] {
  width: 15px;
  height: 15px;
  color: #64748b;
}

.quick-note-compact-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}

.quick-note-compact-title strong {
  font-size: 12px;
  font-weight: 850;
}

.quick-note-compact-title em {
  font-style: normal;
  color: #64748b;
  font-weight: 500;
}

.quick-note-small-icon {
  width: 18px;
  height: 18px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  color: var(--purple);
  background: var(--purple-soft);
}

.quick-note-small-icon [data-lucide] {
  width: 13px;
  height: 13px;
}

.compact-quick-note-textarea {
  min-height: 66px;
  border-radius: 12px;
  resize: vertical;
}

.compact-action-choice-list {
  gap: 9px;
}

.compact-action-choice-list .action-choice {
  min-height: 50px;
  padding: 11px 13px;
  align-items: center;
  gap: 11px;
}

.action-choice-text {
  display: grid;
  gap: 2px;
  line-height: 1.2;
}

.action-choice-text strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 850;
}

.action-choice-text small {
  color: #64748b;
  font-size: 12px;
  font-weight: 500;
}

.smart-routing-panel {
  gap: 12px;
}

.smart-routing-subtitle {
  margin: -2px 0 0;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.smart-routing-details {
  display: grid;
  gap: 8px;
}

.smart-route-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  background: #ffffff;
  border-radius: 13px;
  padding: 10px 12px;
}

.smart-route-row span {
  color: #334155;
  font-size: 12px;
  font-weight: 850;
}

.smart-route-row strong {
  color: #4f46e5;
  font-size: 12px;
  font-weight: 900;
  text-align: right;
}

.smart-route-row-stack {
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "label value"
    "small value";
}

.smart-route-row-stack span {
  grid-area: label;
}

.smart-route-row-stack strong {
  grid-area: value;
}

.smart-route-row-stack small {
  grid-area: small;
  color: #64748b;
  font-size: 11px;
  font-weight: 500;
}

.compact-schedule-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.compact-schedule-fields .smart-route-row {
  grid-column: 1 / -1;
}

.compact-empty-action-box {
  min-height: 132px;
}

.smart-routing-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
}

.smart-routing-note span {
  width: 17px;
  height: 17px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  color: white;
  background: #64748b;
  font-size: 11px;
  font-weight: 900;
  flex-shrink: 0;
  margin-top: 1px;
}

.smart-routing-note p {
  margin: 0;
}

.compact-save-lead-btn {
  width: 100%;
  margin-top: auto;
  padding: 13px 16px;
  border-radius: 12px;
  font-size: 14px;
}

.smart-routing-hidden-lines {
  display: none !important;
}

@media (max-width: 1350px) {
  .compact-intake-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .compact-two-field-row,
  .compact-schedule-fields {
    grid-template-columns: 1fr;
  }

  .smart-route-row {
    grid-template-columns: 1fr;
  }

  .smart-route-row strong {
    text-align: left;
  }
}


/* LEFT-REFERENCE LEADS TABLE — only affects the All Leads list */
.all-leads-table-area .leads-compact-table {
  min-width: 1180px;
  table-layout: auto;
}

.all-leads-table-area .leads-compact-table th,
.all-leads-table-area .leads-compact-table td {
  white-space: nowrap;
}

.all-leads-table-area .leads-compact-table th {
  padding-top: 12px;
  padding-bottom: 12px;
  font-size: 11px;
  color: #1f2937;
}

.all-leads-table-area .leads-compact-table td {
  padding-top: 12px;
  padding-bottom: 12px;
  font-size: 12px;
  color: #334155;
}

.all-leads-table-area .leads-table-name {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  font: inherit;
  font-weight: 700;
  color: #5b3df5;
  cursor: pointer;
  text-align: left;
}

.all-leads-table-area .leads-table-name:hover {
  color: #4325d8;
  text-decoration: underline;
}

.lead-active-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
}

.lead-active-status.active {
  color: #16a36a;
}

.lead-active-status.archived {
  color: #64748b;
}

.lead-status-dot {
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: currentColor;
  flex: 0 0 auto;
}

.lead-menu-heading,
.lead-menu-cell {
  width: 44px;
  min-width: 44px;
  text-align: right;
}

.lead-actions-menu {
  position: relative;
  display: inline-block;
}

.lead-actions-menu > summary {
  list-style: none;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  color: #64748b;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  user-select: none;
}

.lead-actions-menu > summary::-webkit-details-marker {
  display: none;
}

.lead-actions-menu > summary:hover,
.lead-actions-menu[open] > summary {
  background: #f1f5f9;
  color: #0f172a;
}

.lead-actions-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 40;
  min-width: 138px;
  padding: 6px;
  background: #ffffff;
  border: 1px solid #dbe2ea;
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.14);
}

.lead-actions-dropdown button {
  width: 100%;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #1e293b;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 650;
  text-align: left;
  cursor: pointer;
}

.lead-actions-dropdown button:hover {
  background: #f3f0ff;
  color: #5b3df5;
}

/* TODAY'S CALLS — compact LeadFlow theme */
#todayCallsPage .content-card {
  border-radius: 22px;
  padding: 20px;
}

#todayCallsPage .card-header {
  align-items: flex-start;
}

#todayCallsPage .card-header h2 {
  font-size: 26px;
  letter-spacing: -0.03em;
}

#todayCallsPage .card-header p {
  margin-top: 4px;
}

#todayCallsPage #refreshTodayCallsButton {
  background: white;
  color: #1e293b;
  border: 1px solid #d8deea;
  box-shadow: none;
}

#todayCallsPage #refreshTodayCallsButton:hover {
  border-color: #c4b5fd;
  color: var(--purple);
  background: #faf9ff;
}

#todayCallsPage .schedule-tabs,
#todayCallsPage .unanswered-filters {
  gap: 10px;
  margin: 18px 0;
}

#todayCallsPage .schedule-tabs button,
#todayCallsPage .unanswered-filters button {
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid #dce2ec;
  border-radius: 10px;
  background: #f7f8fb;
  color: #1e293b;
  font-weight: 800;
  box-shadow: none;
}

#todayCallsPage .schedule-tabs .active-tab,
#todayCallsPage .unanswered-filters .active-tab {
  border-color: transparent;
  color: white;
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
  box-shadow: 0 5px 12px rgba(91, 61, 245, 0.18);
}

#todayCallsPage #todayCallsSearchInput {
  min-height: 42px;
  border-radius: 10px;
  border-color: #d8deea;
}

.today-calls-block {
  margin-top: 6px;
  padding: 16px;
  border: 1px solid #dce2ec;
  border-radius: 18px;
  background: #fff;
}

.today-calls-block h3 {
  margin: 0 0 12px;
  font-size: 20px;
  color: #0f172a;
}

.today-calls-table-wrap {
  overflow: visible;
  border: 1px solid #e2e7ef;
  border-radius: 14px;
}

.today-calls-table {
  table-layout: auto;
  border-radius: 14px;
  overflow: visible;
}

.today-calls-table th {
  padding: 13px 15px;
  background: #f7f8fb;
  color: #334155;
  font-size: 12px;
  white-space: nowrap;
}

.today-calls-table td {
  padding: 12px 15px;
  color: #1e293b;
  font-size: 12px;
  vertical-align: middle;
}

.today-calls-table tbody tr:hover {
  background: #fbfaff;
}

.today-time-cell {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 112px;
}

.today-time-icon {
  color: var(--purple);
  font-size: 19px;
  line-height: 1;
}

.today-time-cell strong,
.today-client-time strong {
  display: block;
  color: #1e293b;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.today-time-cell small,
.today-client-time small {
  display: block;
  margin-top: 2px;
  color: #64748b;
  font-size: 11px;
  white-space: nowrap;
}

.today-lead-name {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--purple);
  font-size: 12px;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}

.today-lead-name:hover {
  text-decoration: underline;
}

.today-age-pill,
.today-result-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  background: #f1efff;
  color: #4f46e5;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.today-result-pill.no-answer,
.today-result-pill.answered,
.today-result-pill.appointment,
.today-result-pill.not-interested,
.today-result-pill.sold {
  background: #f1efff;
  color: #4f46e5;
}

.today-actions-cell {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 178px;
  white-space: nowrap;
}

.today-log-call-btn {
  min-height: 34px;
  padding: 0 13px;
  border: 0;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
  color: white;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(91, 61, 245, 0.16);
}

.today-log-call-btn:hover {
  filter: brightness(0.98);
}

.today-call-actions-menu {
  position: relative;
  display: inline-block;
}

.today-call-actions-menu > summary {
  list-style: none;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: #64748b;
  font-size: 21px;
  line-height: 1;
  cursor: pointer;
  user-select: none;
}

.today-call-actions-menu > summary::-webkit-details-marker {
  display: none;
}

.today-call-actions-menu > summary:hover,
.today-call-actions-menu[open] > summary {
  background: #f1efff;
  color: var(--purple);
}

.today-call-actions-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 7px);
  z-index: 120;
  min-width: 150px;
  padding: 6px;
  background: #fff;
  border: 1px solid #ddd6fe;
  border-radius: 11px;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.16);
}

.today-call-actions-dropdown button {
  width: 100%;
  border: 0;
  border-radius: 8px;
  padding: 9px 10px;
  background: transparent;
  color: #1e293b;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.today-call-actions-dropdown button:hover {
  background: #f3f0ff;
  color: var(--purple);
}

.today-calls-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 4px 0;
}

.today-calls-pagination p {
  margin: 0;
  color: #64748b;
  font-size: 11px;
}

.today-pagination-controls {
  display: flex;
  align-items: center;
  gap: 7px;
}

.today-pagination-controls select {
  min-height: 34px;
  border: 1px solid #dce2ec;
  border-radius: 9px;
  padding: 0 28px 0 10px;
  background: white;
  color: #334155;
  font-size: 11px;
}

.today-pagination-btn {
  width: 34px;
  height: 34px;
  border: 1px solid #dce2ec;
  border-radius: 9px;
  background: white;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.today-pagination-btn:hover:not(:disabled) {
  border-color: #c4b5fd;
  color: var(--purple);
  background: #faf9ff;
}

.today-pagination-btn.active {
  border-color: transparent;
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
  color: white;
}

.today-pagination-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.today-calls-empty {
  padding: 28px;
  border: 1px dashed #d8deea;
  border-radius: 14px;
  text-align: center;
}

@media (max-width: 900px) {
  .today-calls-table-wrap {
    overflow-x: auto;
  }

  .today-calls-table {
    min-width: 1040px;
  }

  .today-calls-pagination {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* THREE-DOT ACTION MENUS — professional shared styling (Leads + Today’s Calls) */
.lead-menu-cell,
.today-actions-cell {
  overflow: visible;
}

.lead-actions-menu,
.today-call-actions-menu {
  position: relative;
  display: inline-flex;
  vertical-align: middle;
}

.lead-actions-menu > summary,
.today-call-actions-menu > summary {
  box-sizing: border-box;
  list-style: none;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: #64748b;
  font-family: Arial, sans-serif;
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 1px;
  cursor: pointer;
  user-select: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.lead-actions-menu > summary::-webkit-details-marker,
.today-call-actions-menu > summary::-webkit-details-marker {
  display: none;
}

.lead-actions-menu > summary::marker,
.today-call-actions-menu > summary::marker {
  content: "";
}

.lead-actions-menu > summary:hover,
.lead-actions-menu[open] > summary,
.today-call-actions-menu > summary:hover,
.today-call-actions-menu[open] > summary {
  background: #f3f0ff;
  border-color: #ddd6fe;
  color: var(--purple, #5b3df5);
}

.lead-actions-dropdown,
.today-call-actions-dropdown {
  box-sizing: border-box;
  position: absolute;
  right: 0;
  top: calc(100% + 7px);
  z-index: 500;
  width: 168px;
  min-width: 168px;
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.16), 0 3px 10px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.lead-actions-dropdown .action-menu-item,
.today-call-actions-dropdown .action-menu-item {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 10px 11px;
  border: 0;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  background: transparent;
  color: #1e293b;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.lead-actions-dropdown .action-menu-item:hover,
.today-call-actions-dropdown .action-menu-item:hover {
  background: #f5f3ff;
  color: var(--purple, #5b3df5);
}

.lead-actions-dropdown .action-menu-item-danger,
.today-call-actions-dropdown .action-menu-item-danger {
  color: #475569;
}

.lead-actions-dropdown .action-menu-item-danger:hover,
.today-call-actions-dropdown .action-menu-item-danger:hover {
  background: #fff1f2;
  color: #be123c;
}

.action-menu-icon {
  width: 17px;
  min-width: 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  font-size: 14px;
  line-height: 1;
}

/* Prevent table wrappers from clipping the dropdowns. */
.leads-table-wrap,
.today-calls-table-wrap,
.schedule-table-wrap {
  overflow: visible;
}


/* Today’s Calls: centered Log Call / Move modal only */
body.today-call-modal-open {
  overflow: hidden;
}

#todayCallLogPanel.today-call-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(2px);
}

#todayCallLogPanel.today-call-modal-overlay.hidden {
  display: none;
}

.today-call-modal-card {
  width: min(760px, 100%);
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.28);
  padding: 22px;
}

.today-call-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

#todayCallLogTitle {
  margin: 0;
  color: #312e81;
  font-size: 20px;
  line-height: 1.3;
}

.today-call-modal-close {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #64748b;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.today-call-modal-close:hover {
  background: #f1f5f9;
  color: #0f172a;
}

.today-call-modal-summary {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr 1fr auto;
  border: 1px solid #dbe2ea;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 18px;
}

.today-call-summary-item {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 0 14px;
  border-right: 1px solid #e2e8f0;
}

.today-call-summary-item:first-child { padding-left: 0; }
.today-call-summary-item:last-child { border-right: 0; padding-right: 0; }


.today-call-summary-item span:last-child {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.today-call-summary-item small {
  color: #64748b;
  font-size: 11px;
}

.today-call-summary-item strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #0f172a;
  font-size: 13px;
}

.today-call-summary-item em {
  color: #64748b;
  font-size: 11px;
  font-style: normal;
}

.today-call-modal-age-pill {
  display: inline-flex;
  width: max-content;
  padding: 4px 9px;
  border-radius: 999px;
  background: #f1edff;
  color: var(--purple) !important;
}

.today-call-modal-form {
  display: grid;
  gap: 14px;
}

.today-call-modal-field {
  display: grid;
  gap: 7px;
}

.today-call-modal-field > span {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #334155;
  font-size: 13px;
  font-weight: 750;
}

.today-call-modal-field b {
  color: #ef4444;
}

.today-call-modal-field select,
.today-call-modal-field textarea {
  width: 100%;
  border: 1px solid #d8e0eb;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  padding: 11px 13px;
  outline: none;
}

.today-call-modal-field select:focus,
.today-call-modal-field textarea:focus {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px rgba(99, 62, 235, 0.12);
}

#todayCallLogPanel .today-log-textarea {
  min-height: 112px;
  margin-top: 0;
}

#todayCallLogPanel .appointment-builder-fields {
  margin: 0;
}

.today-call-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid #e5e7eb;
}

.today-call-modal-cancel {
  background: #ffffff;
  color: #0f172a;
  border: 1px solid #d8e0eb;
}

#todayCallLogPanel #saveTodayCallLogButton {
  background: linear-gradient(135deg, var(--purple), var(--purple-3));
}

@media (max-width: 760px) {
  #todayCallLogPanel.today-call-modal-overlay {
    align-items: flex-end;
    padding: 10px;
  }

  .today-call-modal-card {
    max-height: calc(100vh - 20px);
    border-radius: 16px;
    padding: 17px;
  }

  .today-call-modal-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .today-call-summary-item,
  .today-call-summary-item:first-child,
  .today-call-summary-item:last-child {
    padding: 0;
    border-right: 0;
  }

  .today-call-summary-age {
    grid-column: 1 / -1;
  }
}


/* Today’s Calls modal icon readability update only */
.today-call-summary-icon,
.today-call-field-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  color: var(--purple);
}

.today-call-summary-icon {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: #f3efff;
  margin-top: 1px;
}

.today-call-field-icon {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  background: #f3efff;
}

.today-call-summary-icon svg,
.today-call-field-icon svg {
  width: 15px;
  height: 15px;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.today-call-modal-field > span {
  min-height: 24px;
}

.today-call-summary-item small {
  font-weight: 650;
  letter-spacing: 0.01em;
}


/* Answered Leads merged workspace */
.answered-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 430px;
  gap: 16px;
  align-items: start;
}

.answered-main-card,
.answered-preview-card {
  min-width: 0;
}

.answered-toolbar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border-color, #e3e8f2);
}

.answered-view-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
}

.answered-view-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 15px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: #596579;
  font-weight: 700;
  cursor: pointer;
}

.answered-view-tab svg { width: 17px; height: 17px; }
.answered-view-tab:hover { background: #f6f3ff; color: #5b35f5; }
.answered-view-tab.active {
  color: #5b35f5;
  background: #f2edff;
  border-color: #d8ccff;
  box-shadow: inset 0 -2px 0 #6437f5;
}

.answered-toolbar-actions { display: flex; align-items: center; gap: 10px; }
.answered-date-control {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid #d9e0ec;
  border-radius: 10px;
  background: #fff;
  color: #4b5870;
  font-size: 13px;
  font-weight: 700;
}
.answered-date-control svg { width: 16px; height: 16px; color: #6a3df4; }
.answered-date-control input { border: 0; outline: 0; background: transparent; color: #17223b; font: inherit; }

.answered-search-row { padding: 14px 0 4px; }
.answered-search-wrap { position: relative; }
.answered-search-wrap > svg {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  width: 17px; height: 17px; color: #7d889b; pointer-events: none;
}
.answered-search-wrap .search-input { padding-left: 42px; margin: 0; }

.answered-list-heading {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 2px;
}
.answered-list-heading h3 { margin: 0; font-size: 18px; }
.answered-list-heading h3 span,
.answered-list-heading > span { color: #718096; font-size: 13px; font-weight: 700; }

.answered-table-block { margin-top: 8px; }
.answered-table { table-layout: fixed; }
.answered-table th:nth-child(1) { width: 105px; }
.answered-table th:nth-child(2) { width: 145px; }
.answered-table th:nth-child(3) { width: 100px; }
.answered-table th:nth-child(4) { width: 115px; }
.answered-table th:nth-child(5) { width: 80px; }
.answered-table th:nth-child(6) { width: 145px; }
.answered-table th:nth-child(8) { width: 125px; }
.answered-table td { vertical-align: middle; }
.answered-row { cursor: pointer; transition: background .15s ease, box-shadow .15s ease; }

.answered-row.selected { background: #f5f1ff; box-shadow: inset 3px 0 0 #6437f5; }
.answered-lead-name { border: 0; padding: 0; background: none; color: #5b35f5; font-weight: 700; cursor: pointer; text-align: left; }
.answered-next-action { font-weight: 600; color: #25324a; }
.answered-note-preview { max-width: 260px; color: #4f5d72; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }


.answered-preview-card {
  position: sticky;
  top: 16px;
  padding: 16px;
  min-height: 0;
  max-height: calc(100vh - 150px);
  overflow: hidden;
}
.answered-preview-empty {
  min-height: 390px; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 28px; color: #6d788b;
}
.answered-preview-empty-icon {
  display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px;
  background: #f1ebff; color: #6437f5; margin-bottom: 14px;
}
.answered-preview-empty-icon svg { width: 22px; height: 22px; }
.answered-preview-empty h3 { margin: 0 0 6px; color: #17223b; }
.answered-preview-empty p { max-width: 260px; margin: 0; line-height: 1.5; }

.answered-preview-header { padding-bottom: 16px; border-bottom: 1px solid #e5e9f1; }
.answered-preview-identity { display: flex; gap: 12px; align-items: center; }
.answered-preview-avatar { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg,#7147f7,#5428e8); color: #fff; font-weight: 900; }
.answered-preview-name-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.answered-preview-name-row h3 { margin: 0; font-size: 18px; }
.answered-preview-identity p { display: flex; align-items: center; gap: 5px; margin: 5px 0 0; color: #6d788b; font-size: 13px; }
.answered-preview-identity p svg { width: 14px; height: 14px; }

.answered-preview-overview { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 12px 0; }
.answered-preview-stat { display: flex; gap: 9px; align-items: center; padding: 12px; border: 1px solid #e5e9f1; border-radius: 12px; background: #fbfcff; }
.answered-preview-stat-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: #f0ebff; color: #6437f5; flex: 0 0 auto; }
.answered-preview-stat-icon svg { width: 16px; height: 16px; }
.answered-preview-stat small { display: block; color: #748096; font-size: 11px; }
.answered-preview-stat strong { display: block; margin-top: 2px; color: #19243b; font-size: 13px; }

.answered-preview-section { margin-top: 2px; padding: 11px 0; border-top: 1px solid #e7ebf2; }
.answered-preview-section-title { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; color: #27334a; font-weight: 800; }
.answered-preview-section-title svg { width: 16px; height: 16px; color: #6437f5; }
.answered-preview-note { padding: 12px; border: 1px solid #e3e7ef; border-radius: 11px; background: #fbfcff; }
.answered-preview-note strong { display: block; color: #202b42; }
.answered-preview-note p { margin: 7px 0; color: #4f5d72; line-height: 1.45; display: -webkit-box; line-clamp: 5; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.answered-preview-note small { color: #7a8598; }
.answered-preview-details { display: grid;
 margin: 0; }
.answered-preview-details div { display: grid;
 gap: 10px; }
.answered-preview-details dt { color: #778296; }
.answered-preview-details dd { margin: 0; color: #253149; font-weight: 700; }
.answered-preview-open-btn { display: flex; align-items: center; justify-content: space-between; width: 100%;
 padding: 12px 13px; border: 1px solid #ded5ff; border-radius: 11px; background: #f8f5ff; color: #5b35f5; font-weight: 800; cursor: pointer; }
.answered-preview-open-btn:hover { background: #efe8ff; }
.answered-preview-open-btn svg { width: 17px; height: 17px; }
.answered-empty-state { display: grid; place-items: center; gap: 8px; min-height: 240px; color: #778296; text-align: center; }
.answered-empty-state svg { width: 28px; height: 28px; color: #8d72f6; }

@media (max-width: 1200px) {
  .answered-workspace { grid-template-columns: 1fr; }
  .answered-preview-card { position: static; min-height: 0; }
  .answered-preview-empty { min-height: 220px; }
}
@media (max-width: 760px) {
  .answered-toolbar-top { align-items: stretch; flex-direction: column; }
  .answered-toolbar-actions { flex-wrap: wrap; }
  .answered-view-tabs { width: 100%; }
  .answered-view-tab { flex: 1; justify-content: center; }
}


/* Answered Leads final readability refinements */
.answered-preview-card > #answeredLeadPreviewContent { max-height: 100%; overflow: hidden; }
.answered-preview-details { gap: 6px; }
.answered-preview-details div { grid-template-columns: 112px minmax(0,1fr); }
.answered-preview-details dd { overflow-wrap: anywhere; }
.answered-preview-note { min-height: 0; }
.answered-preview-open-btn { margin-top: 8px; }
@media (max-height: 820px) and (min-width: 1201px) {
  .answered-preview-card { top: 8px; max-height: calc(100vh - 80px); }
  .answered-preview-header { padding-bottom: 10px; }
  .answered-preview-overview { padding: 9px 0; }
  .answered-preview-stat { padding: 9px; }
  .answered-preview-section { padding: 8px 0; }
  .answered-preview-note { padding: 10px; }
}


/* Answered Leads: closable preview panel */
.answered-workspace.preview-closed { grid-template-columns: minmax(0, 1fr); }
.answered-preview-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.answered-preview-close {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d8deea;
  border-radius: 12px;
  background: #f8f9fc;
  color: #4f5d73;
  cursor: pointer;

  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}
.answered-preview-close:hover {
  background: #f2efff;
  border-color: #bfb2ff;
  color: #5b35f5;
  transform: translateY(-1px);
}
.answered-preview-close:focus-visible {
  outline: 3px solid rgba(91, 53, 245, .18);
  outline-offset: 2px;
}
.answered-preview-close svg { width: 24px; height: 24px; stroke-width: 2.6; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


/* Answered Leads table refinements */
.answered-workspace.preview-closed .answered-table th:nth-child(1) { width: 105px; }
.answered-workspace.preview-closed .answered-table th:nth-child(2) { width: 145px; }
.answered-workspace.preview-closed .answered-table th:nth-child(3) { width: 100px; }
.answered-workspace.preview-closed .answered-table th:nth-child(4) { width: 115px; }
.answered-workspace.preview-closed .answered-table th:nth-child(5) { width: 72px; }
.answered-workspace.preview-closed .answered-table th:nth-child(6) { width: 145px; }
.answered-workspace.preview-closed .answered-table th:nth-child(8) { width: 105px; }
.answered-workspace.preview-closed .answered-note-preview {
  max-width: none;
  white-space: normal;
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.answered-row:hover { background: #f7f4ff; }
.answered-row:not(.selected):hover { box-shadow: inset 3px 0 0 rgba(100, 55, 245, .35); }
.answered-workspace.preview-closed .answered-row.selected {
  background: transparent;
  box-shadow: none;
}


/* Answered Leads: requested action-menu and close-button refinements only */
.answered-preview-header { padding-top: 4px; }
.answered-preview-close { margin-top: 1px; box-shadow: 0 0 0 1px rgba(91, 53, 245, .04), 0 2px 5px rgba(15, 23, 42, .07); }
.answered-preview-close:hover { box-shadow: 0 0 0 3px rgba(91, 53, 245, .10), 0 4px 10px rgba(91, 53, 245, .10); }

.answered-actions-cell { position: relative; overflow: visible; text-align: center; }
.answered-actions-menu { position: relative; display: inline-block; }
.answered-actions-menu > summary { list-style: none; }
.answered-actions-menu > summary::-webkit-details-marker { display: none; }
.answered-actions-menu .lead-actions-dropdown { right: 0; left: auto; }
.answered-table th:nth-child(8),
.answered-workspace.preview-closed .answered-table th:nth-child(8) { width: 64px; }
.answered-table .schedule-table-wrap,
.answered-table-block .schedule-table-wrap { overflow: visible; }

/* Answered Leads: keep the last-row action menu fully visible */
.answered-table tbody tr:last-child .answered-actions-dropdown {
  top: auto;
  bottom: calc(100% + 7px);
}

/* Answered Leads: keep action menus anchored consistently in both views */
.answered-actions-menu .answered-actions-dropdown,
.answered-table tbody tr:last-child .answered-actions-dropdown {
  top: calc(100% + 7px);
  right: 0;
  bottom: auto;
  left: auto;
}

/* Create space below a short Answered by Date table while its menu is open. */


/* Answered Leads action menu clipping fix
   The shared schedule table uses overflow:hidden, which clips menus in short date-result tables. */
.answered-table-block,
.answered-table-block .schedule-table-wrap,
.answered-table-block .answered-table,
.answered-table-block .answered-table tbody,
.answered-table-block .answered-table tr,
.answered-table-block .answered-actions-cell,
.answered-table-block .answered-actions-menu {
  overflow: visible;
}

.answered-table-block .answered-actions-menu[open] {
  z-index: 1200;
}

.answered-table-block .answered-actions-menu[open] .answered-actions-dropdown {
  display: flex;
  top: calc(100% + 7px);
  right: 0;
  bottom: auto;
  left: auto;
  z-index: 1300;
}

.answered-table-block .answered-row:has(.answered-actions-menu[open]) {
  position: relative;
  z-index: 1100;
}

/* No artificial blank space is needed once the dropdown is allowed to escape the table. */
.answered-table-block:has(.answered-actions-menu[open]),
.answered-list-card:has(.answered-actions-menu[open]) {
  padding-bottom: 14px;
}

/* Unanswered page — aligned with the current LeadFlow table theme */
#unansweredPage .content-card { overflow: visible; }
#unansweredPage .card-header { margin-bottom: 16px; }
#unansweredPage .search-input { margin-bottom: 16px; }
#unansweredPage .unanswered-filters { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 18px; }
#unansweredPage .unanswered-filters button {
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid #dfe4ef;
  border-radius: 11px;
  background: #f3f5f8;
  color: #111827;
  font-weight: 700;
}
#unansweredPage .unanswered-filters button.active-tab {
  border-color: #633bff;
  background: linear-gradient(135deg, #7148ff, #5530ed);
  color: #fff;
  box-shadow: 0 6px 14px rgba(92, 53, 238, .18);
}
.unanswered-table-block {
  position: relative;
  overflow: visible;
  padding: 16px;
  border: 1px solid #dde3ee;
  border-radius: 18px;
  background: #fff;
}
.unanswered-table-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 4px 12px; }
.unanswered-table-heading h3 { margin: 0; font-size: 20px; }
.unanswered-table-heading h3 span,
.unanswered-table-heading > span { color: #667085; font-size: 14px; font-weight: 600; }
.unanswered-table-wrap { overflow: visible; border: 1px solid #e2e7ef; border-radius: 14px; }
.unanswered-table { overflow: visible; border-collapse: separate; border-spacing: 0; }
.unanswered-table thead th { height: 52px; background: #f7f8fb; color: #172033; font-weight: 700; }
.unanswered-table tbody td { height: 58px; vertical-align: middle; border-top: 1px solid #e5e9f0; }
.unanswered-table tbody tr { transition: background-color .16s ease; }
.unanswered-table tbody tr:hover { background: #faf8ff; }
.unanswered-check-cell { width: 46px; text-align: center; }
.unanswered-check-cell input { width: 17px; height: 17px; accent-color: #633bff; }
.unanswered-lead-link { padding: 0; border: 0; background: transparent; color: #5633f4; font: inherit; font-weight: 700; cursor: pointer; text-align: left; }
.unanswered-lead-link:hover { text-decoration: underline; }
.unanswered-actions-heading,
.unanswered-actions-cell { width: 84px; text-align: center; }
.unanswered-actions-cell { position: relative; overflow: visible; }
.unanswered-actions-menu { position: relative; display: inline-block; }
.unanswered-actions-menu > summary { list-style: none; }
.unanswered-actions-menu > summary::-webkit-details-marker { display: none; }
.unanswered-kebab-btn {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 10px;
  background: #f5f2ff;
  color: #633bff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.unanswered-kebab-btn:hover,
.unanswered-actions-menu[open] .unanswered-kebab-btn { border-color: #cfc2ff; background: #eee9ff; }
.unanswered-actions-dropdown { right: 0; left: auto; top: calc(100% + 7px); z-index: 80; min-width: 170px; }
.unanswered-row:last-child .unanswered-actions-dropdown { top: auto; bottom: calc(100% + 7px); }
.unanswered-table-block:has(.unanswered-actions-menu[open]),
.unanswered-table-wrap:has(.unanswered-actions-menu[open]) { overflow: visible; z-index: 20; }
.unanswered-pagination { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; padding: 14px 4px 0; color: #475467; font-size: 14px; }
.unanswered-pagination label { display: flex; align-items: center; gap: 9px; }
.unanswered-pagination select { min-width: 68px; height: 38px; border: 1px solid #dce2ec; border-radius: 10px; background: #fff; padding: 0 10px; }
.unanswered-page-buttons { justify-self: end; display: flex; gap: 7px; }
.unanswered-page-buttons button { min-width: 38px; height: 38px; border: 1px solid #dce2ec; border-radius: 10px; background: #fff; color: #172033; font-weight: 700; }
.unanswered-page-buttons button.active { border-color: #633bff; background: #633bff; color: #fff; }
.unanswered-page-buttons button:disabled { opacity: .45; cursor: not-allowed; }
.unanswered-empty-state { min-height: 220px; display: grid; place-content: center; justify-items: center; gap: 10px; color: #667085; }
.unanswered-empty-icon { color: #7c5cff; font-size: 34px; }
@media (max-width: 900px) {
  .unanswered-pagination { grid-template-columns: 1fr; }
  .unanswered-page-buttons { justify-self: start; }
}


/* Schedule page: LeadFlow theme update only */
#schedulePage .content-card { overflow: visible; }
#schedulePage .card-header { padding-bottom: 4px; }
#schedulePage .schedule-tabs { margin: 14px 0 16px; }
#schedulePage .schedule-tabs button {
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid #dfe4ee;
  border-radius: 11px;
  background: #f5f6f9;
  color: #172033;
  box-shadow: none;
}
#schedulePage .schedule-tabs .active-tab {
  border-color: #6841ff;
  background: linear-gradient(135deg, #6d3cff, #5434e8);
  color: #fff;
  box-shadow: 0 6px 14px rgba(91, 61, 245, .18);
}
#schedulePage .schedule-list { gap: 0; }
#schedulePage .schedule-modern-block {
  padding: 12px;
  border: 1px solid #e1e6ef;
  border-radius: 16px;
  background: #fbfcfe;
  overflow: visible;
}
#schedulePage .schedule-table-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 4px 12px;
}
#schedulePage .schedule-table-heading h3 { margin: 0; font-size: 20px; }
#schedulePage .schedule-table-heading span { color: #667085; font-size: 13px; font-weight: 700; }
#schedulePage .schedule-modern-wrap {
  border: 1px solid #e3e7ef;
  border-radius: 14px;
  overflow: visible;
  background: #fff;
}
#schedulePage .schedule-modern-table {
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 14px;
  overflow: visible;
}
#schedulePage .schedule-modern-table thead th {
  height: 48px;
  padding: 10px 13px;
  background: #f6f7fa;
  color: #172033;
  font-size: 12px;
  font-weight: 800;
  vertical-align: middle;
}
#schedulePage .schedule-modern-table tbody td {
  height: 62px;
  padding: 9px 13px;
  vertical-align: middle;
  border-top: 1px solid #e7eaf0;
  border-bottom: 0;
  color: #172033;
}
#schedulePage .schedule-modern-row { transition: background-color .15s ease; }
#schedulePage .schedule-modern-row:hover { background: #faf8ff; }
#schedulePage .schedule-modern-table td strong { display: block; font-size: 12px; line-height: 1.25; }
#schedulePage .schedule-modern-table td small { display: block; margin-top: 2px; color: #667085; font-size: 11px; line-height: 1.2; }
#schedulePage .schedule-date-cell { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; white-space: nowrap; }
#schedulePage .schedule-date-icon {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: #f0ebff;
  color: #633bff;
}
#schedulePage .schedule-date-icon svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#schedulePage .schedule-lead-link {
  padding: 0;
  border: 0;
  background: transparent;
  color: #5633f4;
  font: inherit;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}
#schedulePage .schedule-lead-link:hover { text-decoration: underline; }
#schedulePage .schedule-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
}
#schedulePage .schedule-status-done { background: #e8f8ee; color: #16803d; }
#schedulePage .schedule-status-warning { background: #fff2dc; color: #b85d00; }
#schedulePage .schedule-status-upcoming { background: #f0ebff; color: #633bff; }
#schedulePage .schedule-note-preview {
  max-width: 520px;
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: #475467;
  line-height: 1.35;
}
#schedulePage .schedule-actions-heading,
#schedulePage .schedule-actions-cell { width: 76px; text-align: center; }
#schedulePage .schedule-actions-cell { position: relative; overflow: visible; }
#schedulePage .schedule-actions-menu { position: relative; display: inline-block; }
#schedulePage .schedule-actions-menu > summary { list-style: none; }
#schedulePage .schedule-actions-menu > summary::-webkit-details-marker { display: none; }
#schedulePage .schedule-actions-dropdown {
  right: 0;
  left: auto;
  top: calc(100% + 7px);
  z-index: 700;
  width: 184px;
  min-width: 184px;
}
#schedulePage .schedule-modern-row:last-child .schedule-actions-dropdown,
#schedulePage .schedule-modern-row:nth-last-child(2) .schedule-actions-dropdown {
  top: auto;
  bottom: calc(100% + 7px);
}
#schedulePage .schedule-menu-divider { height: 1px; margin: 3px 4px; background: #e7eaf0; }
.schedule-menu-icon { font-size: 0; }
.schedule-menu-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#schedulePage .schedule-reason-text {
  color: #344054;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
}
#schedulePage .schedule-empty-state {
  min-height: 240px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 10px;
  color: #667085;
}
#schedulePage .schedule-empty-state p { margin: 0; }
#schedulePage .schedule-empty-icon { color: #7657ff; font-size: 34px; }
#schedulePage .schedule-modern-block:has(.schedule-actions-menu[open]),
#schedulePage .schedule-modern-wrap:has(.schedule-actions-menu[open]) { overflow: visible; position: relative; z-index: 30; }
@media (max-width: 900px) {
  #schedulePage .schedule-modern-wrap { overflow-x: auto; }
  #schedulePage .schedule-note-preview { min-width: 220px; }
}


/* Dashboard analytics redesign */
#dashboardPage { padding-bottom: 18px; }
.dashboard-analytics-grid { display: grid;
 gap: 16px; align-items: stretch; }
.dashboard-card { background: #fff; border: 1px solid #e2e8f2; border-radius: 18px; box-shadow: 0 12px 30px rgba(31, 46, 80, .07); }
.dashboard-panel-accent-purple { border-top: 4px solid #6943f5; }
.dashboard-panel-accent-green { border-top: 4px solid #22b85a; }
.dashboard-card-header { padding: 18px 18px 10px; gap: 14px; }
.dashboard-card-header h2 { margin: 0 0 4px; font-size: 22px; color: #111b35; }
.dashboard-card-header p { margin: 0; color: #64718a; font-size: 13px; }
.dashboard-performance-header { align-items: flex-start; }
.dashboard-range-controls { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.performance-tabs { display: inline-flex; padding: 4px; border: 1px solid #dde3ed; border-radius: 12px; background: #f8f9fc; }
.performance-tab { border: 0; background: transparent; color: #5a6478; min-height: 34px; padding: 0 15px; border-radius: 9px; font-weight: 700; cursor: pointer; }
.performance-tab.active-tab { color: #fff; background: linear-gradient(135deg, #7047f7, #5835eb); box-shadow: 0 5px 13px rgba(96, 59, 238, .28); }


.performance-stat-strip { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 18px; border: 1px solid #e1e6ef; border-radius: 13px; overflow: hidden; }
.performance-stat { padding: 14px 14px 12px; border-right: 1px solid #e6eaf1; min-width: 0; }
.performance-stat:last-child { border-right: 0; }
.performance-stat span { display: block; color: #64718a; font-size: 12px; }
.performance-stat strong { display: block; margin: 5px 0 3px; color: #5e3ef2; font-size: 23px; }
.performance-stat:nth-child(2) strong { color: #1974e8; }
.performance-stat:nth-child(3) strong { color: #13a653; }
.performance-stat:nth-child(4) strong { color: #f0821d; }
.performance-stat small { display: block; color: #1ba55a; font-size: 11px; line-height: 1.35; }
.performance-stat small.negative { color: #e23b3b; }
.performance-chart-wrap { margin: 14px 18px 12px; border: 1px solid #e2e7ef; border-radius: 14px; padding: 14px; }
.performance-chart-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 8px; }
.performance-chart-head strong { display: block; color: #1c2741; font-size: 14px; }
.performance-chart-head > div > span { color: #7b869b; font-size: 11px; }
.performance-chart-legend { display: flex; flex-wrap: wrap; gap: 12px; color: #637087; font-size: 11px; }
.performance-chart-legend span { display: inline-flex; align-items: center; gap: 5px; }
.legend-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.calls-dot { background: #6c43f5; }.answered-line-dot { background: #2077e9; }.sold-line-dot { background: #15a95a; }

.performance-trend-chart { min-height: 210px; }
.performance-trend-chart svg { display: block; width: 100%; height: 210px; overflow: visible; }
.trend-grid-line { stroke: #e7ebf2; stroke-width: 1; }.trend-axis-text { fill: #7b879a; font-size: 9px; }
.trend-line { fill: none; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.trend-calls { stroke: #6c43f5; }.trend-answered { stroke: #2077e9; }.trend-sold { stroke: #15a95a; }
.performance-count-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 0 18px 18px; }
.performance-count-row div { border: 1px solid #e2e7ef; border-radius: 12px; padding: 10px 12px; }
.performance-count-row span { display: block; color: #758096; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.performance-count-row strong { color: #14203a; font-size: 19px; }
.dashboard-title-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; }
.dashboard-title-icon svg { width: 18px; height: 18px; stroke-width: 2; }
.dashboard-title-icon-green { color: #20aa56; background: #e8f8ee; }
.money-main-modern {
  margin: 0 16px 12px;
  min-height: 126px;
  border: 1px solid #bdebc9;
  border-radius: 16px;
  background: linear-gradient(135deg, #effcf3, #e8f9ee);
  padding: 22px;
}
.money-main-modern span {
  color: #168044;
  font-weight: 700;
}
.money-main-modern strong {
  display: block;
  margin: 8px 0 4px;
  color: #132039;
  font-size: 38px;
}
.money-main-modern small {
  color: #188b4a;
}
.money-grid-modern {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  padding: 0 16px 12px;
}
.money-grid-modern > div {
  border: 1px solid #e1e6ef;
  border-radius: 13px;
  padding: 14px;
}
.money-grid-modern span {
  display: block;
  color: #718099;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.money-grid-modern strong {
  color: #14203a;
  font-size: 20px;
}
.money-ap-chart-card {
  margin: 0 16px 16px;
  border: 1px solid #dfe7e3;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff, #fbfefc);
  padding: 12px;
}
.money-ap-chart-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
}
.money-ap-chart-head strong {
  display: block;
  color: #1c2741;
  font-size: 13px;
}
.money-ap-chart-head > div > span {
  color: #7b869b;
  font-size: 10px;
}
.money-ap-chart-total {
  flex: 0 0 auto;
  border-radius: 999px;
  background: #e8f8ee;
  color: #168044;
  padding: 5px 8px;
  font-size: 10px;
  font-weight: 800;
}
.money-ap-chart {
  min-height: 150px;
  overflow: hidden;
  cursor: grab;
  user-select: none;
  touch-action: none;
}
.money-ap-chart.is-dragging {
  cursor: grabbing;
}
.money-ap-zoom-hint {
  display: block;
  margin-top: 1px;
  color: #9aa3b4;
  font-size: 9px;
  font-weight: 600;
}
.money-ap-chart svg {
  display: block;
  width: 100%;
  height: 150px;
}
.money-ap-grid {
  stroke: #e7eee9;
  stroke-width: 1;
}
.money-ap-axis {
  fill: #7b879a;
  font-size: 8.5px;
}
.money-ap-area {
  fill: url(#moneyApAreaGradient);
}
.money-ap-line {
  fill: none;
  stroke: #21b75a;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.money-ap-point {
  fill: #21b75a;
  stroke: #ffffff;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}
.money-ap-empty {
  fill: #8a96a8;
  font-size: 10px;
  font-weight: 700;
}


.dashboard-insights-card { margin-top: 16px; display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; border: 1px solid #d8cffa; border-radius: 18px; background: linear-gradient(90deg, #fff, #fbf9ff); padding: 18px 22px; overflow: hidden; }
.dashboard-insights-icon { width: 62px; height: 62px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #8a5cff, #5734e9); }.dashboard-insights-icon svg { width: 30px; height: 30px; }
.dashboard-insights-copy h2 { margin: 0 0 5px; color: #16213a; }.dashboard-insights-text strong { display: block; color: #26314a; }.dashboard-insights-text p { margin: 3px 0 0; color: #6f7b91; }
.dashboard-insights-art { display: flex; align-items: flex-end; gap: 8px; color: #6a43f1; padding-right: 16px; }.dashboard-insights-art > svg { width: 68px; height: 68px; }.dashboard-insights-art span { width: 16px; border-radius: 4px 4px 0 0; background: #cbbcff; }.dashboard-insights-art span:nth-of-type(1){height:22px}.dashboard-insights-art span:nth-of-type(2){height:38px}.dashboard-insights-art span:nth-of-type(3){height:31px}.dashboard-insights-art span:nth-of-type(4){height:51px}.dashboard-insights-art span:nth-of-type(5){height:68px}
@media (max-width: 1380px) { .dashboard-analytics-grid { grid-template-columns: minmax(0, 1.45fr) minmax(280px, .9fr); }
 }
@media (max-width: 1050px) { .dashboard-analytics-grid { grid-template-columns: 1fr; }
.dashboard-performance-header { flex-direction: column; }.dashboard-range-controls { align-items: stretch; }
.performance-tabs { align-self: flex-start; } }
@media (max-width: 700px) { .performance-stat-strip,.performance-count-row { grid-template-columns: repeat(2, 1fr); }.performance-stat:nth-child(2) { border-right: 0; }.performance-stat:nth-child(-n+2) { border-bottom: 1px solid #e6eaf1; }
.dashboard-insights-art { display: none; }.dashboard-insights-card { grid-template-columns: auto 1fr; }.performance-chart-legend { display: none; } }

/* Dashboard interval and simplified layout */
.dashboard-analytics-grid { grid-template-columns: minmax(0, 1.65fr) minmax(320px, 0.85fr); }
.dashboard-analytics-grid .performance-card { min-width: 0; }
.dashboard-analytics-grid .money-card { min-width: 0; }
@media (max-width: 1100px) { .dashboard-analytics-grid { grid-template-columns: 1fr; } }


/* Dashboard reference-layout and interactive trend refinement */
#dashboardPage .dashboard-analytics-grid {
  grid-template-columns: minmax(0, 1.42fr) minmax(330px, .78fr);
  grid-template-areas:
    "goal money"
    "performance money";
  gap: 16px;
  align-items: stretch;
}
#dashboardPage .monthly-goal-card { grid-area: goal; }
#dashboardPage .performance-card { grid-area: performance; }
#dashboardPage .money-card { grid-area: money; }
#dashboardPage .dashboard-card {
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(31, 46, 80, .055);
}
#dashboardPage .dashboard-card-header {
  padding: 16px 18px 12px;
}
#dashboardPage .performance-card,
#dashboardPage .money-card {
  min-height: 430px;
  height: auto;
}
#dashboardPage .performance-stat-strip {
  margin: 0 16px;
}
#dashboardPage .performance-stat {
  padding: 11px 12px 10px;
}
#dashboardPage .performance-stat strong {
  font-size: 21px;
}
#dashboardPage .performance-chart-wrap {
  margin: 12px 16px 10px;
  padding: 12px;
}
#dashboardPage .performance-trend-chart {
  position: relative;
  min-height: 190px;
  overflow: hidden;
  cursor: grab;
  user-select: none;
  touch-action: none;
}
#dashboardPage .performance-trend-chart.is-dragging {
  cursor: grabbing;
}
#dashboardPage .performance-trend-chart svg {
  width: 100%;
  height: 190px;
  overflow: hidden;
}
#dashboardPage .performance-chart-head > div:first-child {
  display: grid;
  gap: 1px;
}
#dashboardPage .performance-zoom-hint {
  color: #9aa3b4;
  font-size: 10px;
  font-weight: 600;
}
#dashboardPage .trend-point {
  stroke: #fff;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}
#dashboardPage .trend-point-calls { fill: #6c43f5; }
#dashboardPage .trend-point-answered { fill: #2077e9; }
#dashboardPage .trend-point-sold { fill: #15a95a; }

#dashboardPage .trend-point-group { cursor: crosshair; }
#dashboardPage .performance-chart-tooltip {
  position: absolute;
  z-index: 5;
  min-width: 138px;
  pointer-events: none;
  border: 1px solid #dfe4ed;
  border-radius: 10px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 10px 28px rgba(22, 32, 58, .14);
  padding: 9px 10px;
  color: #28334a;
  font-size: 11px;
}
#dashboardPage .performance-chart-tooltip strong,
#dashboardPage .performance-chart-tooltip span {
  display: block;
}
#dashboardPage .performance-chart-tooltip strong {
  margin-bottom: 4px;
  color: #152039;
}
#dashboardPage .performance-count-row {
  margin: 0 16px 16px;
}
#dashboardPage .money-main-modern {
  min-height: 118px;
  margin: 0 16px 12px;
  padding: 18px;
}
#dashboardPage .money-main-modern strong {
  font-size: 34px;
}
#dashboardPage .money-grid-modern {
  gap: 9px;
  padding: 0 16px 12px;
}
#dashboardPage .money-grid-modern > div {
  padding: 12px;
}
#dashboardPage .money-grid-modern strong {
  font-size: 18px;
}
#dashboardPage .dashboard-insights-card {
  margin-top: 14px;
}
@media (max-width: 1100px) {
  #dashboardPage .dashboard-analytics-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "goal"
      "performance"
      "money";
  }
  #dashboardPage .performance-card,
  #dashboardPage .money-card { min-height: 0; }
}


/* Monthly AP goal */
#dashboardPage .monthly-goal-card {
  position: relative;
  overflow: hidden;
  min-width: 0;
  border: 1px solid #8b5cf6;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.08), transparent 34%),
    #ffffff;
}

#dashboardPage .monthly-goal-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, #6d35f5, #8b5cf6);
}

#dashboardPage .monthly-goal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid #e5e7eb;
}

#dashboardPage .monthly-goal-title-wrap {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  min-width: 0;
}

#dashboardPage .monthly-goal-icon {
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #ffffff;
  background: linear-gradient(135deg, #f43f5e, #e11d48);
  box-shadow: 0 8px 18px rgba(225, 29, 72, 0.22);
}

#dashboardPage .monthly-goal-icon [data-lucide] {
  width: 18px;
  height: 18px;
}

#dashboardPage .monthly-goal-title-wrap h2 {
  margin: 0 0 3px;
  color: #111b35;
  font-size: 21px;
  letter-spacing: -0.035em;
}

#dashboardPage .monthly-goal-title-wrap p {
  margin: 0;
  color: #64748b;
  font-size: 12px;
}

#dashboardPage .monthly-goal-month {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  padding: 0 12px;
  border: 1px solid #dde3ed;
  border-radius: 11px;
  color: #334155;
  background: #f8fafc;
  font-size: 12px;
  font-weight: 800;
}

#dashboardPage .monthly-goal-month [data-lucide] {
  width: 15px;
  height: 15px;
  color: #6d35f5;
}

#dashboardPage .monthly-goal-metrics {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.15fr) minmax(170px, .85fr);
  align-items: stretch;
  padding: 12px 18px 15px;
}

#dashboardPage .monthly-goal-metric {
  min-width: 0;
  padding: 2px 20px;
  border-left: 1px solid #e5e7eb;
}

#dashboardPage .monthly-goal-metric:first-child {
  padding-left: 0;
  border-left: 0;
}

#dashboardPage .monthly-goal-metric > span,
#dashboardPage .monthly-goal-days > div > span {
  display: block;
  margin-bottom: 5px;
  color: #64748b;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#dashboardPage .monthly-goal-value-row {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 34px;
}

#dashboardPage .monthly-goal-value-row strong,
#dashboardPage .monthly-goal-days strong {
  color: #0f172a;
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.045em;
}

#dashboardPage .monthly-goal-progress-value em {
  color: #16a34a;
  font-size: 14px;
  font-style: normal;
  font-weight: 900;
}

#dashboardPage .monthly-goal-metric small {
  display: block;
  margin-top: 5px;
  color: #64748b;
  font-size: 11px;
}

#dashboardPage .monthly-goal-edit-button {
  width: 30px;
  height: 30px;
  padding: 0;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: #ffffff;
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  box-shadow: 0 7px 15px rgba(109, 53, 245, 0.22);
}

#dashboardPage .monthly-goal-edit-button [data-lucide] {
  width: 14px;
  height: 14px;
}

#dashboardPage .monthly-goal-days {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-right: 0;
}

#dashboardPage .monthly-goal-days strong {
  display: block;
}

#dashboardPage .monthly-goal-progress-ring {
  --monthly-goal-progress-angle: 0deg;
  width: 68px;
  height: 68px;
  min-width: 68px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: conic-gradient(
    #22c55e 0 var(--monthly-goal-progress-angle),
    #e8edf5 var(--monthly-goal-progress-angle) 360deg
  );
  position: relative;
}

#dashboardPage .monthly-goal-progress-ring::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: #ffffff;
}

#dashboardPage .monthly-goal-progress-ring span {
  position: relative;
  z-index: 1;
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

#dashboardPage .monthly-goal-is-empty .monthly-goal-progress-ring {
  background: conic-gradient(#cbd5e1 0 360deg);
}

body.monthly-goal-modal-open {
  overflow: hidden;
}

.monthly-goal-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(2, 6, 23, 0.72);
  backdrop-filter: blur(8px);
}

.monthly-goal-dialog {
  position: relative;
  width: min(430px, 100%);
  padding: 28px;
  border: 1px solid #ddd6fe;
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.1), transparent 35%),
    #ffffff;
  box-shadow: 0 28px 90px rgba(15, 23, 42, 0.28);
}

.monthly-goal-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  padding: 0;
  display: grid;
  place-items: center;
  color: #64748b;
  background: #f1f5f9;
}

.monthly-goal-modal-close [data-lucide] {
  width: 17px;
  height: 17px;
}

.monthly-goal-dialog-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  margin-bottom: 15px;
  border-radius: 15px;
  color: #ffffff;
  background: linear-gradient(135deg, #f43f5e, #e11d48);
  box-shadow: 0 12px 24px rgba(225, 29, 72, 0.24);
}

.monthly-goal-dialog-icon [data-lucide] {
  width: 23px;
  height: 23px;
}

.monthly-goal-dialog h2 {
  margin: 0 0 7px;
  color: #0f172a;
  font-size: 24px;
}

.monthly-goal-dialog > p {
  margin: 0 0 20px;
  color: #64748b;
  line-height: 1.45;
}

.monthly-goal-input-label {
  display: grid;
  gap: 7px;
  color: #334155;
  font-size: 12px;
  font-weight: 850;
}

.monthly-goal-input-wrap {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
  border: 1px solid #d8dee8;
  border-radius: 12px;
  background: #ffffff;
}

.monthly-goal-input-wrap > span {
  color: #6d35f5;
  font-size: 20px;
  font-weight: 900;
}

.monthly-goal-input-wrap input {
  width: 100%;
  min-height: 48px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #0f172a;
  font-size: 22px;
  font-weight: 850;
}

.monthly-goal-error {
  min-height: 18px;
  margin: 8px 0 0;
  color: #dc2626;
  font-size: 12px;
  font-weight: 750;
}

.monthly-goal-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 12px;
}

.app-dark-mode #dashboardPage .monthly-goal-card {
  border-color: #8b5cf6;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.16), transparent 36%),
    #15102f;
}

.app-dark-mode #dashboardPage .monthly-goal-header,
.app-dark-mode #dashboardPage .monthly-goal-metric {
  border-color: #342b61;
}

.app-dark-mode #dashboardPage .monthly-goal-title-wrap h2,
.app-dark-mode #dashboardPage .monthly-goal-value-row strong,
.app-dark-mode #dashboardPage .monthly-goal-days strong,
.app-dark-mode #dashboardPage .monthly-goal-progress-ring span {
  color: #ffffff;
}

.app-dark-mode #dashboardPage .monthly-goal-title-wrap p,
.app-dark-mode #dashboardPage .monthly-goal-metric > span,
.app-dark-mode #dashboardPage .monthly-goal-days > div > span,
.app-dark-mode #dashboardPage .monthly-goal-metric small {
  color: #b9b2d8;
}

.app-dark-mode #dashboardPage .monthly-goal-month {
  border-color: #342b61;
  color: #ffffff;
  background: #100b25;
}

.app-dark-mode #dashboardPage .monthly-goal-progress-ring {
  background: conic-gradient(
    #22c55e 0 var(--monthly-goal-progress-angle),
    #292342 var(--monthly-goal-progress-angle) 360deg
  );
}

.app-dark-mode #dashboardPage .monthly-goal-progress-ring::after {
  background: #15102f;
}

.app-dark-mode #dashboardPage .monthly-goal-is-empty .monthly-goal-progress-ring {
  background: conic-gradient(#3b335c 0 360deg);
}

.app-dark-mode .monthly-goal-dialog {
  border-color: #433878;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.18), transparent 36%),
    #15102f;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.58);
}

.app-dark-mode .monthly-goal-modal-close {
  color: #c4b5fd;
  background: #251d48;
}

.app-dark-mode .monthly-goal-dialog h2,
.app-dark-mode .monthly-goal-input-wrap input {
  color: #ffffff;
}

.app-dark-mode .monthly-goal-dialog > p,
.app-dark-mode .monthly-goal-input-label {
  color: #b9b2d8;
}

.app-dark-mode .monthly-goal-input-wrap {
  border-color: #433878;
  background: #100b25;
}

.app-dark-mode .monthly-goal-modal-actions .light-action-btn {
  border-color: #433878;
  color: #ffffff;
  background: #251d48;
}

@media (max-width: 760px) {
  #dashboardPage .monthly-goal-header {
    flex-direction: column;
  }

  #dashboardPage .monthly-goal-metrics {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  #dashboardPage .monthly-goal-metric {
    padding: 12px 0 0;
    border-left: 0;
    border-top: 1px solid #e5e7eb;
  }

  #dashboardPage .monthly-goal-metric:first-child {
    padding-top: 0;
    border-top: 0;
  }

  .app-dark-mode #dashboardPage .monthly-goal-metric {
    border-color: #342b61;
  }
}


/* Dashboard graph refinement: Calls, Answered, and Sold only */
#dashboardPage .performance-count-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }


/* Leaderboard */
body.leaderboard-page-active #todayDashboard { display:none; }


.leaderboard-page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:18px; }
.leaderboard-page-title { display:flex; align-items:flex-start; gap:14px; }
.leaderboard-page-icon { width:54px; height:54px; display:grid; place-items:center; border-radius:16px; color:#6d35f5; background:#f1ebff; box-shadow:inset 0 0 0 1px rgba(109,53,245,.08); }
.leaderboard-page-icon svg { width:28px; height:28px; stroke-width:2.1; }
.leaderboard-page-title h1 { margin:0; font-size:30px; line-height:1.1; color:#081225; }
.leaderboard-page-title p { margin:8px 0 0; color:#64748b; font-size:15px; }

.leaderboard-hero-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:start; margin-bottom:16px; }
.leaderboard-summary-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; min-width:0; }
.leaderboard-summary-card { position:relative; display:flex; align-items:center; gap:13px; min-height:108px; padding:17px 18px; background:#fff; border:1px solid #e2e7ef; border-radius:15px; box-shadow:0 7px 22px rgba(25,36,66,.045); overflow:hidden; }
.leaderboard-summary-copy { min-width:0; display:grid; gap:2px; }
.leaderboard-summary-copy small { color:#5f6c84; font-size:12px; }
.leaderboard-summary-copy strong { color:#0b1731; font-size:23px; line-height:1.1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.leaderboard-summary-delta { font-size:12px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.leaderboard-summary-delta.positive { color:#16a34a; }
.leaderboard-summary-delta.negative { color:#dc2626; }
.leaderboard-summary-delta.neutral { color:#64748b; }
.leaderboard-summary-icon { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:14px; }
.leaderboard-summary-icon svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:2; }
.leaderboard-summary-icon.purple { color:#6738f5; background:#f0eaff; }
.leaderboard-summary-icon.blue { color:#1769e8; background:#e9f2ff; }
.leaderboard-summary-icon.green { color:#0da85b; background:#e6f8ed; }
.leaderboard-summary-icon.orange { color:#ef7b16; background:#fff0df; }
.leaderboard-mini-bars { position:absolute; right:14px; bottom:13px; width:15px; height:18px; opacity:.7; background:linear-gradient(to top,#6a42ef 0 100%) left bottom/3px 6px no-repeat,linear-gradient(to top,#6a42ef 0 100%) center bottom/3px 11px no-repeat,linear-gradient(to top,#6a42ef 0 100%) right bottom/3px 18px no-repeat; }

.leaderboard-period-control { display:flex; align-items:center; gap:8px; padding-top:4px; white-space:nowrap; }
.leaderboard-period-control > label { color:#56647c; font-size:12px; font-weight:700; }
.leaderboard-period-select-wrap { position:relative; min-width:126px; }
.leaderboard-period-select-wrap select { width:100%; height:42px; appearance:none; border:1px solid #a98cff; border-radius:12px; background:#fff; color:#4522b5; font-weight:800; padding:0 38px 0 14px; outline:none; cursor:pointer; box-shadow:0 2px 8px rgba(99,56,237,.08); }
.leaderboard-period-select-wrap svg { position:absolute; right:12px; top:50%; width:16px; height:16px; transform:translateY(-50%); pointer-events:none; color:#5e36df; }
.leaderboard-date-wrap { display:flex; align-items:center; gap:7px; height:42px; padding:0 11px; border:1px solid #d8dfeb; border-radius:12px; background:#fff; }
.leaderboard-date-wrap svg { width:16px; height:16px; color:#6738f5; }
.leaderboard-date-wrap input { border:0; background:transparent; color:#17233d; font-weight:700; outline:none; padding:0; }

.leaderboard-podium-stage { position:relative; margin-bottom:16px; padding:22px 26px 10px; background:#fff; border:1px solid #e2e7ef; border-radius:16px;
 box-shadow:0 8px 24px rgba(25,36,66,.045); }
.leaderboard-celebration { position:absolute; inset:0; pointer-events:none; overflow:hidden; }


.confetti { position:absolute; width:8px; height:8px; border-radius:2px; opacity:.55; }
.confetti-1 { left:22%; top:14%; background:#f6c05c; transform:rotate(45deg); }
.confetti-2 { left:31%; top:19%; width:7px; height:7px; background:#d7c6ff; border-radius:50%; }
.confetti-3 { right:25%; top:15%; background:#d7ebff; }
.confetti-4 { right:17%; top:20%; background:#ffd4cf; border-radius:50%; }
.confetti-5 { left:57%; top:11%; background:#efe1aa; transform:rotate(38deg); }
.confetti-6 { right:33%; top:13%; background:#d8f1de; transform:rotate(45deg); }
.leaderboard-podium { position:relative; z-index:1; display:grid; grid-template-columns:1fr 1.08fr 1fr;


 }
.leaderboard-podium-card {


 grid-template-columns:auto 1fr;


 }


.leaderboard-podium-card.empty { display:grid; place-items:center; color:#8692a8; }

.leaderboard-rank-medal { position:absolute; top:13px; left:13px; width:38px; height:38px;
 place-items:center; border-radius:50%; font-weight:900; color:#34415a; background:#dfe5ed; border:4px solid #f5f7fa; box-shadow:0 3px 8px rgba(20,30,50,.14); z-index:2; }
.rank-1 .leaderboard-rank-medal { color:#8b5900; background:#ffc933; border-color:#fff0a6; }
.rank-3 .leaderboard-rank-medal { color:#8a3e13; background:#e9a069; border-color:#ffe5d1; }
.leaderboard-crown { position:absolute; top:-32px; left:50%; transform:translateX(-50%); color:#f5b700; font-size:48px; filter:drop-shadow(0 4px 3px rgba(195,125,0,.18)); }


.leaderboard-panel { padding:0; background:#fff; border:1px solid #dde4ee; border-radius:16px; box-shadow:0 8px 24px rgba(25,36,66,.045); }
.leaderboard-table-panel { overflow:hidden; }
.leaderboard-table-wrap { overflow:hidden; }
.leaderboard-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.leaderboard-table th { padding:13px 18px; text-align:left; background:#f6f8fb; color:#27334b; font-size:12px; }
.leaderboard-table th:first-child { width:88px; }
.leaderboard-table th:nth-child(3),.leaderboard-table th:nth-child(4) { width:245px; text-align:center; }
.leaderboard-table td { padding:12px 18px; border-top:1px solid #e5e9f0; color:#1a253d; }
.leaderboard-table td:nth-child(3),.leaderboard-table td:nth-child(4) { text-align:center; font-weight:800; }
.leaderboard-table-rank { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; font-weight:900; color:#22304a; background:#eef2f7; }
.leaderboard-table-rank.rank-1 { background:#ffc933; color:#8b5900; }
.leaderboard-table-rank.rank-2 { background:#dfe4eb; }
.leaderboard-table-rank.rank-3 { background:#e9a069; color:#8a3e13; }
.leaderboard-table-agent { display:flex; align-items:center; gap:12px; min-width:0; }
.leaderboard-table-avatar { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg,#7546f7,#4f2fd2); color:#fff; font-size:13px; font-weight:900; flex:0 0 34px; }
.leaderboard-table-agent strong { display:block; color:#101a32; font-size:15px; }
.leaderboard-table-agent small { color:#6f7d93; font-size:12px; text-transform:capitalize; }
.leaderboard-ap-cell { color:#6236ed; }
.leaderboard-empty { padding:22px; text-align:center; color:#74839a; }
.leaderboard-view-all { width:100%; display:flex; align-items:center; justify-content:center; gap:7px; background:transparent; color:#5d6a82; border-top:1px solid #e5e9f0; border-radius:0; padding:14px 18px; font-weight:800; }
.leaderboard-view-all svg { width:16px; height:16px; }

@media (max-width: 1400px) {
  .leaderboard-summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1180px) {
  .leaderboard-hero-row { grid-template-columns:1fr; }
  .leaderboard-period-control { justify-content:flex-end; }
  .leaderboard-podium { gap:22px; padding:20px 20px 0; }
}
@media (max-width: 960px) {
  .leaderboard-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .leaderboard-podium { grid-template-columns:1fr; max-width:560px; }
  .leaderboard-podium-card,
  .leaderboard-podium-card.rank-1 { min-height:unset; }

}
@media (max-width: 680px) {
  .leaderboard-page-title h1 { font-size:25px; }
  .leaderboard-summary-grid { grid-template-columns:1fr; }
  .leaderboard-table th:nth-child(3), .leaderboard-table td:nth-child(3), .leaderboard-table th:nth-child(4), .leaderboard-table td:nth-child(4) { width:auto; }
}


/* LEADERBOARD PODIUM ALIGNMENT + RIBBON BADGES */
.leaderboard-podium {
  gap: 34px;
  max-width: 1060px;
  margin: 0 auto;
  padding: 20px 56px 0;
  align-items: end;
}

.leaderboard-podium-card {
  position: relative;
  min-height: 196px;
  padding: 28px 24px 26px;
  border: 1px solid #cfd7e4;
  border-radius: 18px 18px 8px 8px;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  text-align: center;
  box-shadow: 0 8px 20px rgba(24, 34, 55, 0.055);
}

.leaderboard-podium-card.rank-1 {
  min-height: 230px;
  padding-top: 40px;
  border: 2px solid #f2a600;
  background: linear-gradient(180deg, #fffdf6 0%, #fff 100%);
  box-shadow: 0 12px 28px rgba(236, 164, 19, 0.12);
}

.leaderboard-podium-card.rank-2 {
  border-color: #aeb8c7;
}

.leaderboard-podium-card.rank-3 {
  border-color: #e5b07e;
  background: linear-gradient(180deg, #fffaf6 0%, #fff 100%);
}

.leaderboard-podium-card.empty {
  justify-content: center;
}

.leaderboard-rank-medal {
  display: none !important;
}


.leaderboard-crown {
  display: none !important;
}


.leaderboard-agent-avatar {
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  font-weight: 900;
  font-size: 22px;
  background: linear-gradient(135deg, #7546f7, #4f2fd2);
  margin-top: 8px;
}

.rank-1 .leaderboard-agent-avatar {
  width: 70px;
  height: 70px;
  font-size: 25px;
  margin-top: 2px;
}

.leaderboard-agent-heading {
  min-width: 0;
  width: 100%;
  display: grid;
  gap: 3px;
  justify-items: center;
  text-align: center;
}

.leaderboard-agent-heading strong {
  color: #101a32;
  font-size: 18px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.rank-1 .leaderboard-agent-heading strong {
  font-size: 22px;
}

.leaderboard-agent-heading span {
  color: #68748b;
  font-size: 12px;
  text-transform: capitalize;
}

.leaderboard-agent-metrics {
  width: 100%;
  grid-column: auto;
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  border-top: 1px solid #e3e7ee;
  padding-top: 15px;
  margin-top: 2px;
}

.leaderboard-agent-metrics > div {
  text-align: center;
  padding: 0 10px;
}

.leaderboard-agent-metrics > div + div {
  border-left: 1px solid #dfe4ec;
}

.leaderboard-agent-metrics span {
  display: block;
  color: #68748b;
  font-size: 11px;
  margin-bottom: 5px;
}

.leaderboard-agent-metrics strong {
  color: #152039;
  font-size: 20px;
}

.leaderboard-agent-metrics > div:first-child strong {
  color: #6236ed;
}

.leaderboard-empty-agent {
  grid-column: auto;
  text-align: center;
  font-size: 18px;
  color: #8692a8;
  padding-top: 18px;
}


.leaderboard-rank-ribbon,
.leaderboard-rank-medal {
  display: none !important;
}

.leaderboard-rank-medal-svg {
  position: absolute;
  top: 10px;
  left: 13px;
  width: 48px;
  height: 54px;
  display: block;
  z-index: 5;
  pointer-events: none;
}

.leaderboard-rank-medal-svg svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.leaderboard-podium-stage {
  overflow: visible;
}

.leaderboard-podium-card.rank-1 {
  overflow: visible;
}

.leaderboard-crown-icon {
  position: absolute;

  left: 50%;
  transform: translateX(-50%);


  display: grid;
  place-items: center;
  color: #f5b700;
  z-index: 8;
  pointer-events: none;

}

.leaderboard-crown-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 3px;
  width: 44px;
  height: 8px;
  transform: translateX(-50%);
  background: #fffdf6;
  border-radius: 999px;
  z-index: -1;
}


/* Remove the first-place card border from behind the crown */
.leaderboard-crown-icon::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 29px;
  width: 64px;
  height: 12px;
  transform: translateX(-50%);
  background: #fffdf6;
  border-radius: 999px;
  z-index: 0;
}

.leaderboard-crown-icon::after {
  display: none;
}


/* PROFESSIONAL FIRST-PLACE CROWN BORDER GAP */
.leaderboard-podium-card.rank-1 {
  border-top-color: transparent !important;
}

.leaderboard-podium-card.rank-1::before,
.leaderboard-podium-card.rank-1::after {
  content: "";
  position: absolute;
  top: -2px;
  height: 2px;
  background: #f2a600;
  z-index: 2;
}

.leaderboard-podium-card.rank-1::before {
  left: -2px;
  right: calc(50% + 34px);
  border-top-left-radius: 18px;
}

.leaderboard-podium-card.rank-1::after {
  left: calc(50% + 34px);
  right: -2px;
  border-top-right-radius: 18px;
}

.leaderboard-crown-icon {
  top: -31px !important;
  width: 58px !important;
  height: 58px !important;
  background: transparent !important;
  filter: drop-shadow(0 4px 4px rgba(195, 125, 0, 0.18));
}

.leaderboard-crown-icon::before,
.leaderboard-crown-icon::after {
  content: none !important;
  display: none !important;
}

.leaderboard-crown-icon svg {
  position: relative;
  z-index: 4;
  width: 44px !important;
  height: 44px !important;
  background: transparent !important;
  stroke-width: 1.9;
}


body.leaderboard-page-active {
  background:#07051c;
}

body.leaderboard-page-active .main-panel {
  background:
    radial-gradient(circle at 51% 35%, rgba(91,45,221,.18), transparent 30%),
    radial-gradient(circle at 90% 8%, rgba(94,35,196,.13), transparent 25%),
    linear-gradient(135deg,#090622 0%,#0d0927 48%,#08061d 100%);
  color:#fff;
}

body.leaderboard-page-active .top-header {
  margin-bottom:20px;
}
body.leaderboard-page-active .top-header .eyebrow {
  color:#9b6cff;
  font-size:13px;
  letter-spacing:.18em;
}
body.leaderboard-page-active .top-header h1 {
  color:#fff;
  font-size:48px;
  line-height:1;
  letter-spacing:-.055em;
  text-shadow:0 8px 28px rgba(0,0,0,.24);
}
body.leaderboard-page-active .top-header h1::after {
  content:"✦";
  display:inline-block;
  margin-left:10px;
  color:#ffcf3f;
  font-size:22px;
  vertical-align:top;
  transform:translateY(-4px);
  filter:drop-shadow(0 0 8px rgba(255,199,52,.7));
}
body.leaderboard-page-active .top-header p {
  color:#b7b2d0;
  font-size:15px;
}
body.leaderboard-page-active .notification-pill,
body.leaderboard-page-active .top-pill,
body.leaderboard-page-active .profile-pill {
  background:rgba(17,13,49,.78);
  color:#fff;
  border:1px solid rgba(150,116,255,.2);
  box-shadow:0 14px 34px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(16px);
}
body.leaderboard-page-active .top-pill strong,
body.leaderboard-page-active .profile-pill strong { color:#fff; }
body.leaderboard-page-active .top-pill span,
body.leaderboard-page-active .profile-pill span { color:#aaa4c4; }
body.leaderboard-page-active .top-profile-initial {
  background:linear-gradient(135deg,#7547ff,#5128df);
  color:#fff;
  box-shadow:0 0 0 4px rgba(116,72,255,.12);
}

/* The global header already contains the page title, so remove the duplicate title card. */
body.leaderboard-page-active .leaderboard-page-header { display:none; }

body.leaderboard-page-active .leaderboard-hero-row {
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  margin-bottom:18px;
}
body.leaderboard-page-active .leaderboard-summary-grid { gap:14px; }
body.leaderboard-page-active .leaderboard-summary-card {
  min-height:118px;
  padding:18px 18px;
  border-radius:17px;
  color:#fff;
  background:
    linear-gradient(145deg,rgba(31,24,71,.94),rgba(15,13,43,.96));
  border:1px solid rgba(148,111,255,.24);
  box-shadow:0 16px 38px rgba(0,0,0,.23), inset 0 1px 0 rgba(255,255,255,.045);
}
body.leaderboard-page-active .leaderboard-summary-card::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,.045),transparent 30%,transparent 72%,rgba(126,76,255,.05));
}
body.leaderboard-page-active .leaderboard-summary-card:nth-child(2) { border-color:rgba(49,113,255,.34); }
body.leaderboard-page-active .leaderboard-summary-card:nth-child(3) { border-color:rgba(91,210,109,.3); }
body.leaderboard-page-active .leaderboard-summary-card:nth-child(4) {
  border-color:rgba(255,177,46,.38);
  background:linear-gradient(145deg,rgba(62,40,38,.93),rgba(20,16,42,.97));
}
body.leaderboard-page-active .leaderboard-summary-copy small { color:#d6d0e5; }
body.leaderboard-page-active .leaderboard-summary-copy strong { color:#fff; font-size:25px; }
body.leaderboard-page-active .leaderboard-summary-delta.positive { color:#50ed58; }
body.leaderboard-page-active .leaderboard-summary-delta.negative { color:#ff7585; }
body.leaderboard-page-active .leaderboard-summary-delta.neutral { color:#aaa4c0; }
body.leaderboard-page-active .leaderboard-summary-icon {
  width:54px;
  height:54px;
  flex-basis:54px;
  border-radius:50%;
  box-shadow:0 0 22px currentColor, inset 0 0 16px rgba(255,255,255,.08);
}
body.leaderboard-page-active .leaderboard-summary-icon svg { width:26px; height:26px; }
body.leaderboard-page-active .leaderboard-summary-icon.purple { color:#a769ff; background:rgba(115,55,236,.24); border:1px solid rgba(174,111,255,.45); }
body.leaderboard-page-active .leaderboard-summary-icon.blue { color:#3e8cff; background:rgba(28,91,232,.25); border:1px solid rgba(61,139,255,.5); }
body.leaderboard-page-active .leaderboard-summary-icon.green { color:#71ef62; background:rgba(48,181,65,.21); border:1px solid rgba(113,239,98,.42); }
body.leaderboard-page-active .leaderboard-summary-icon.orange { color:#ffbd3e; background:rgba(222,137,20,.2); border:1px solid rgba(255,189,62,.5); }
body.leaderboard-page-active .leaderboard-mini-bars { opacity:.95; filter:drop-shadow(0 0 5px #8f54ff); }
body.leaderboard-page-active .leaderboard-summary-card:nth-child(4) .leaderboard-mini-bars {
  background:linear-gradient(to top,#ffc340 0 100%) left bottom/3px 6px no-repeat,linear-gradient(to top,#ffc340 0 100%) center bottom/3px 11px no-repeat,linear-gradient(to top,#ffc340 0 100%) right bottom/3px 18px no-repeat;
  filter:drop-shadow(0 0 5px #ffb12e);
}

body.leaderboard-page-active .leaderboard-period-control > label { color:#c3bdd8; }
body.leaderboard-page-active .leaderboard-period-select-wrap select {
  height:46px;
  border-color:#7d45ff;

  background:linear-gradient(145deg,rgba(31,23,68,.97),rgba(13,10,39,.97));
  box-shadow:0 0 0 1px rgba(128,70,255,.08),0 10px 24px rgba(0,0,0,.22);
}
body.leaderboard-page-active .leaderboard-period-select-wrap svg { color:#a77dff; }
body.leaderboard-page-active .leaderboard-date-wrap {
  border-color:rgba(134,86,255,.42);
  background:#151035;
}
body.leaderboard-page-active .leaderboard-date-wrap input { color:#fff; color-scheme:dark; }

body.leaderboard-page-active .leaderboard-podium-stage {


  border-radius:20px;
  border:1px solid rgba(138,91,255,.28);


}


body.leaderboard-page-active .confetti {

 animation:leaderboardFloat 3.5s ease-in-out infinite alternate; }

body.leaderboard-page-active .confetti-2 {
 animation-delay:.3s; }
body.leaderboard-page-active .confetti-3 {
 animation-delay:.65s; }
body.leaderboard-page-active .confetti-4 {
 animation-delay:.9s; }
body.leaderboard-page-active .confetti-5 {
 animation-delay:1.15s; }
body.leaderboard-page-active .confetti-6 {
 animation-delay:1.4s; }
@keyframes leaderboardFloat { from { transform:translateY(-2px) rotate(12deg); } to { transform:translateY(9px) rotate(55deg); } }


body.leaderboard-page-active .leaderboard-podium-card {


  grid-template-columns:1fr;
  justify-items:center;
  text-align:center;

  color:#fff;
  border-radius:21px 21px 7px 7px;
  background:linear-gradient(160deg,rgba(35,29,73,.96),rgba(21,17,53,.97));
  border:2px solid #d8dced;
  box-shadow:0 20px 35px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.06);
}
body.leaderboard-page-active .leaderboard-podium-card.rank-1 {

  padding-top:48px;
  border:2px solid #ffc324;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,192,39,.13),transparent 42%),
    linear-gradient(160deg,rgba(51,36,69,.98),rgba(24,17,49,.98));

}
body.leaderboard-page-active .leaderboard-podium-card.rank-2 { border-color:#dce4ff; }
body.leaderboard-page-active .leaderboard-podium-card.rank-3 {
  border-color:#d78c59;
  background:linear-gradient(160deg,rgba(57,34,61,.97),rgba(30,20,49,.98));
}
body.leaderboard-page-active .leaderboard-podium-card.empty { color:#9992b1; }


body.leaderboard-page-active .leaderboard-crown-icon {

  color:#ffc41c;
  filter:drop-shadow(0 0 8px rgba(255,188,0,.72));
}
body.leaderboard-page-active .leaderboard-crown-icon svg {

 stroke-width:2.2; }
body.leaderboard-page-active .leaderboard-agent-avatar {
  width:72px;
  height:72px;
  font-size:24px;
  background:linear-gradient(135deg,#8859ff,#4f24df);
  border:2px solid rgba(255,255,255,.86);
  box-shadow:0 0 26px rgba(117,65,255,.45);
}
body.leaderboard-page-active .rank-1 .leaderboard-agent-avatar { width:82px; height:82px; font-size:28px; }
body.leaderboard-page-active .leaderboard-agent-heading { justify-items:center; }
body.leaderboard-page-active .leaderboard-agent-heading strong { color:#fff; font-size:21px; }
body.leaderboard-page-active .rank-1 .leaderboard-agent-heading strong { font-size:25px; }
body.leaderboard-page-active .leaderboard-agent-heading span { color:#bbb5ce; }
body.leaderboard-page-active .leaderboard-agent-metrics {
  width:100%;
  grid-column:auto;
  border-top:1px solid rgba(224,216,247,.2);
  padding-top:17px;
  margin-top:3px;
}
body.leaderboard-page-active .leaderboard-agent-metrics > div + div { border-left-color:rgba(224,216,247,.18); }
body.leaderboard-page-active .leaderboard-agent-metrics span { color:#c6bfd9; }
body.leaderboard-page-active .leaderboard-agent-metrics strong { color:#fff; }
body.leaderboard-page-active .leaderboard-agent-metrics > div:first-child strong {
  color:#b177ff;
  text-shadow:0 0 15px rgba(159,91,255,.35);
}


body.leaderboard-page-active .leaderboard-panel {
  border-radius:18px;
  background:linear-gradient(145deg,rgba(24,18,58,.98),rgba(12,10,38,.98));
  border:1px solid rgba(137,94,255,.28);
  box-shadow:0 20px 42px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.035);
}
body.leaderboard-page-active .leaderboard-table th {
  background:rgba(39,28,80,.84);
  color:#f1edff;
  border-bottom:1px solid rgba(176,142,255,.16);
}
body.leaderboard-page-active .leaderboard-table td {
  color:#fff;
  border-top-color:rgba(176,142,255,.15);
  background:transparent;
}
body.leaderboard-page-active .leaderboard-table tr:hover td { background:rgba(117,69,229,.08); }
body.leaderboard-page-active .leaderboard-table-agent strong { color:#fff; }
body.leaderboard-page-active .leaderboard-table-agent small { color:#aaa4c0; }
body.leaderboard-page-active .leaderboard-table-avatar {
  background:linear-gradient(135deg,#8150ff,#5127dd);
  color:#fff;
  box-shadow:0 0 16px rgba(111,61,240,.25);
}
body.leaderboard-page-active .leaderboard-table-rank {
  color:#10101d;
  background:#dce3f0;
}
body.leaderboard-page-active .leaderboard-table-rank.rank-1 { background:linear-gradient(135deg,#ffd854,#f2a800); color:#5e3900; }
body.leaderboard-page-active .leaderboard-table-rank.rank-2 { background:linear-gradient(135deg,#f5f7fb,#adb9ca); color:#233047; }
body.leaderboard-page-active .leaderboard-table-rank.rank-3 { background:linear-gradient(135deg,#f2ba8d,#bd6d37); color:#613014; }

body.leaderboard-page-active .leaderboard-empty { color:#aaa4c0; }
body.leaderboard-page-active .leaderboard-view-all {
  color:#d6c9ff;
  background:rgba(111,65,225,.12);
  border-top-color:rgba(176,142,255,.15);
}

@media (max-width:1400px) {
  body.leaderboard-page-active .top-header h1 { font-size:42px; }
  body.leaderboard-page-active .leaderboard-summary-card { padding:16px 14px; }
  body.leaderboard-page-active .leaderboard-summary-icon { width:46px; height:46px; flex-basis:46px; }
  body.leaderboard-page-active .leaderboard-summary-copy strong { font-size:22px; }
  body.leaderboard-page-active .leaderboard-podium { padding-left:35px; padding-right:35px; }
}

@media (max-width:1150px) {
  body.leaderboard-page-active .leaderboard-hero-row { grid-template-columns:1fr; }
  body.leaderboard-page-active .leaderboard-period-control { justify-content:flex-end; }
  body.leaderboard-page-active .leaderboard-summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width:820px) {
  body.leaderboard-page-active .top-header h1 { font-size:36px; }
  body.leaderboard-page-active .leaderboard-summary-grid { grid-template-columns:1fr; }
  body.leaderboard-page-active .leaderboard-podium {
    grid-template-columns:1fr;
    gap:38px;
    padding:40px 10px 10px;
  }
  body.leaderboard-page-active .leaderboard-podium-card.rank-1 { order:-1; }
  body.leaderboard-page-active .leaderboard-podium-card { min-height:230px; }
}


body.leaderboard-page-active .leaderboard-podium-card.rank-1 {
  position: relative;
  border-top-color: transparent !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1::before,
body.leaderboard-page-active .leaderboard-podium-card.rank-1::after {


  position: absolute;
  top: -2px;
  height: 2px;
  width: calc(50% - 36px);
  background: #ffc324;
  z-index: 3;
  pointer-events: none;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1::before {
  left: -2px;
  border-radius: 18px 0 0 0;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1::after {
  right: -2px;
  border-radius: 0 18px 0 0;
}

body.leaderboard-page-active .leaderboard-crown-icon {
  top: -40px !important;
  left: 50% !important;
  width: 72px !important;
  height: 62px !important;
  transform: translateX(-50%) !important;
  background: transparent !important;
  box-shadow: none !important;
  isolation: auto !important;
  z-index: 5 !important;
}

body.leaderboard-page-active .leaderboard-crown-icon::before,
body.leaderboard-page-active .leaderboard-crown-icon::after {
  content: none !important;
  display: none !important;
}

body.leaderboard-page-active .leaderboard-crown-icon svg {
  width: 58px !important;
  height: 58px !important;
  position: relative;
  z-index: 2;
}


body.leaderboard-page-active .leaderboard-podium-card.rank-1 {
  border-top: 2px solid #ffc324 !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1::before,
body.leaderboard-page-active .leaderboard-podium-card.rank-1::after {
  content: none !important;
  display: none !important;
}


/* =========================================================
   FIRST-PLACE CROWN — LEFT SIDE OF AVATAR / ATTACHED TO RING
   Places the crown like a tilted hat on the upper-left curve
   of the #1 avatar and overlaps the white avatar outline.
========================================================= */


body.leaderboard-page-active .leaderboard-period-select-wrap select {
  color: #ffffff !important;
  background-color: #171033 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

body.leaderboard-page-active .leaderboard-period-select-wrap select option {
  color: #171033 !important;
  background: #ffffff !important;
  font-weight: 700 !important;
}

body.leaderboard-page-active .leaderboard-period-select-wrap select option:checked {
  color: #ffffff !important;
  background: #5b2ee8 !important;
}

/* =========================================================
   LEADERBOARD TABLE — AP VALUE COLOR MATCH
   Matches the purple Annual Premium values used on the podium.
========================================================= */
body.leaderboard-page-active .leaderboard-ap-cell {
  color: #b56cff !important;
  font-weight: 900 !important;
  text-shadow: 0 0 10px rgba(181, 108, 255, 0.22) !important;
}


body.leaderboard-page-active .leaderboard-podium-stage {


  border-color: rgba(132, 83, 255, 0.42) !important;

  box-shadow:
    0 24px 58px rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    inset 0 0 70px rgba(91, 44, 221, 0.17) !important;
}

/* Bright crossing spotlights behind the podium cards */


/* Neon perspective floor and center glow */
body.leaderboard-page-active .leaderboard-podium-stage::after {
  content: "" !important;
  position: absolute !important;
  left: -4% !important;
  right: -4% !important;
  bottom: -20px !important;
  height: 175px !important;

  pointer-events: none !important;
  opacity: 0.9 !important;
  background:
    radial-gradient(ellipse at 50% 40%, rgba(103, 49, 255, 0.42), transparent 43%),
    repeating-linear-gradient(90deg, rgba(112, 67, 255, 0.22) 0 1px, transparent 1px 70px),
    repeating-linear-gradient(0deg, rgba(112, 67, 255, 0.19) 0 1px, transparent 1px 27px),
    linear-gradient(180deg, rgba(75, 31, 184, 0.02), rgba(54, 23, 143, 0.38)) !important;
  transform: perspective(520px) rotateX(59deg) !important;
  transform-origin: bottom !important;
  filter: drop-shadow(0 -8px 20px rgba(91, 45, 220, 0.20));
}


/* Brighter, more numerous-looking confetti using shadows as duplicates */
body.leaderboard-page-active .confetti {
  z-index: 2 !important;
  opacity: 1 !important;
  width: 9px !important;
  height: 12px !important;
  border-radius: 1px !important;
  box-shadow:
    130px 32px 0 currentColor,
    285px -8px 0 currentColor,
    475px 22px 0 currentColor,
    655px -2px 0 currentColor,
    820px 28px 0 currentColor !important;
  filter: drop-shadow(0 0 7px currentColor) !important;
}
body.leaderboard-page-active .confetti-1 {
  left: 12% !important;
  top: 11% !important;
  color: #ffc43d !important;
  background: currentColor !important;
  transform: rotate(32deg) !important;
}
body.leaderboard-page-active .confetti-2 {
  left: 19% !important;
  top: 21% !important;
  width: 8px !important;
  height: 8px !important;
  color: #9d5cff !important;
  background: currentColor !important;
  border-radius: 1px !important;
}
body.leaderboard-page-active .confetti-3 {
  left: 29% !important;
  top: 8% !important;
  color: #5e88ff !important;
  background: currentColor !important;
}
body.leaderboard-page-active .confetti-4 {
  right: 17% !important;
  top: 17% !important;
  width: 8px !important;
  height: 8px !important;
  color: #ff61af !important;
  background: currentColor !important;
  border-radius: 50% !important;
}
body.leaderboard-page-active .confetti-5 {
  left: 55% !important;
  top: 8% !important;
  color: #ffd347 !important;
  background: currentColor !important;
  transform: rotate(42deg) !important;
}
body.leaderboard-page-active .confetti-6 {
  right: 28% !important;
  top: 10% !important;
  color: #8f66ff !important;
  background: currentColor !important;
  transform: rotate(18deg) !important;
}

/* More luminous card edges while preserving the current card sizes/content */
body.leaderboard-page-active .leaderboard-podium-card.rank-2 {
  box-shadow:
    0 22px 38px rgba(0, 0, 0, 0.38),
    0 0 20px rgba(210, 218, 255, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 0.075) !important;
}
body.leaderboard-page-active .leaderboard-podium-card.rank-1 {
  box-shadow:
    0 0 0 1px rgba(255, 219, 85, 0.34),
    0 0 34px rgba(255, 181, 0, 0.28),
    0 28px 46px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;
}
body.leaderboard-page-active .leaderboard-podium-card.rank-3 {
  box-shadow:
    0 22px 38px rgba(0, 0, 0, 0.38),
    0 0 20px rgba(220, 126, 72, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}


/* =========================================================
   LEADERBOARD — CONTINUOUS FALLING CONFETTI + TRUE LAURELS
   Keeps the current layout/data untouched. Replaces the old
   static confetti look with falling particles and upgrades the
   side decorations to fuller pointed-leaf laurel branches.
========================================================= */
body.leaderboard-page-active .leaderboard-celebration > .confetti {
  display: none !important;
}


body.leaderboard-page-active .leaderboard-confetti-piece {
  --confetti-x: 50%;
  --confetti-drift: 0px;
  --confetti-rotation: 540deg;
  --confetti-duration: 7s;
  --confetti-delay: 0s;
  position: absolute;
  top: -28px;
  left: var(--confetti-x);
  width: 9px;
  height: 15px;
  border-radius: 2px;
  background: currentColor;
  opacity: 0;
  filter: drop-shadow(0 0 7px currentColor);
  transform-origin: center;
  animation: leaderboard-confetti-fall var(--confetti-duration) linear var(--confetti-delay) infinite;
  will-change: transform, opacity;
}

body.leaderboard-page-active .leaderboard-confetti-piece.is-round {
  width: 8px;
  height: 8px;
  border-radius: 999px;
}

body.leaderboard-page-active .leaderboard-confetti-piece.is-strip {
  width: 6px;
  height: 18px;
  border-radius: 1px;
}

@keyframes leaderboard-confetti-fall {
  0% {
    opacity: 0;
    transform: translate3d(0, -18px, 0) rotate(0deg) rotateY(0deg);
  }
  8% { opacity: 1; }
  50% {
    transform: translate3d(calc(var(--confetti-drift) * .55), 210px, 0)
      rotate(calc(var(--confetti-rotation) * .55)) rotateY(160deg);
  }
  92% { opacity: .95; }
  100% {
    opacity: 0;
    transform: translate3d(var(--confetti-drift), 470px, 0)
      rotate(var(--confetti-rotation)) rotateY(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.leaderboard-page-active .leaderboard-confetti-piece {
    animation-play-state: paused;
    opacity: .75;
    top: calc((var(--confetti-order, 1) * 21px) - 10px);
  }
}


/* Layer order: lighting behind, decorations above it, podium in front. */
body.leaderboard-page-active .leaderboard-podium-stage {


  background:
    radial-gradient(ellipse at 50% -7%, rgba(123, 69, 255, .78) 0%, rgba(92, 37, 224, .34) 25%, transparent 49%),
    radial-gradient(ellipse at 14% 34%, rgba(74, 50, 225, .36) 0%, transparent 34%),
    radial-gradient(ellipse at 86% 34%, rgba(74, 50, 225, .38) 0%, transparent 35%),
    linear-gradient(180deg, #1b0d50 0%, #12083c 54%, #0b0629 100%) !important;
}

/* Noticeable stage lights coming down from the top corners. */
body.leaderboard-page-active .leaderboard-podium-stage::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  opacity: 1 !important;
  background:
    radial-gradient(circle at 14% -1%, rgba(255,255,255,.95) 0 3px, rgba(166,151,255,.70) 4px 9px, transparent 22px),
    conic-gradient(from 151deg at 14% -8%, transparent 0deg 7deg, rgba(138,119,255,.08) 8deg 11deg, rgba(150,131,255,.44) 13deg, rgba(102,72,237,.22) 21deg, transparent 30deg 360deg),
    radial-gradient(circle at 86% -1%, rgba(255,255,255,.98) 0 3px, rgba(166,151,255,.72) 4px 9px, transparent 22px),
    conic-gradient(from 199deg at 86% -8%, transparent 0deg 7deg, rgba(138,119,255,.08) 8deg 11deg, rgba(150,131,255,.46) 13deg, rgba(102,72,237,.23) 21deg, transparent 30deg 360deg),
    radial-gradient(ellipse at 50% 45%, rgba(111,64,255,.20), transparent 56%) !important;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, rgba(0,0,0,.96) 58%, transparent 100%) !important;
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0,0,0,.96) 58%, transparent 100%) !important;
  filter: drop-shadow(0 0 18px rgba(132,112,255,.28)) !important;
}

/* Keep the neon floor behind every other stage element. */
body.leaderboard-page-active .leaderboard-podium-stage::after {
  z-index: 0 !important;
}


body.leaderboard-page-active .leaderboard-confetti-rain {
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

body.leaderboard-page-active .leaderboard-confetti-piece {
  z-index: 4 !important;
}


/* Compact illuminated podium platforms matching the reference shape. */


/* A subtle second gold step only for first place, not a large pancake. */


/* Curved half-wreath laurels: slimmer, angled, and opened toward the podium. */


/* Podium front face: compact rectangular riser with a thin curved top lip. */


/* First place uses a wider two-step gold champion platform. */


/* Bronze keeps the same platform geometry with its own metallic finish. */


body.leaderboard-page-active .leaderboard-podium-stage {
  min-height: 392px !important;
  height: 392px !important;
  padding: 16px 32px 44px !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

body.leaderboard-page-active .leaderboard-celebration {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

body.leaderboard-page-active .leaderboard-podium {
  position: relative !important;
  z-index: 3 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr) minmax(0, 1fr) !important;
  align-items: end !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 1080px !important;
  margin: 0 auto !important;
  padding: 24px 42px 0 !important;
  box-sizing: border-box !important;
}

body.leaderboard-page-active .leaderboard-podium-card {
  position: relative !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: 248px !important;
  padding: 28px 24px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  overflow: visible !important;
  isolation: isolate !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1 {
  height: 298px !important;
  min-height: 0 !important;
  padding: 38px 26px 18px !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-3 {
  height: 222px !important;
  min-height: 0 !important;
  padding: 45px 24px 18px !important;
}

body.leaderboard-page-active .leaderboard-podium-card > .leaderboard-agent-avatar,
body.leaderboard-page-active .leaderboard-podium-card > .leaderboard-agent-heading,
body.leaderboard-page-active .leaderboard-podium-card > .leaderboard-agent-metrics,
body.leaderboard-page-active .leaderboard-podium-card > .leaderboard-empty-avatar,
body.leaderboard-page-active .leaderboard-podium-card > .leaderboard-empty-agent {
  position: relative !important;
  z-index: 3 !important;
}

/* Medals and crown must stay out of document flow. */
body.leaderboard-page-active .leaderboard-rank-medal-svg {
  position: absolute !important;
  top: 10px !important;
  left: 13px !important;
  width: 48px !important;
  height: 54px !important;
  margin: 0 !important;
  z-index: 8 !important;
  pointer-events: none !important;
}

body.leaderboard-page-active .leaderboard-rank-medal-svg svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1 .leaderboard-crown-icon {
  position: absolute !important;


  margin: 0 !important;
  display: grid !important;
  place-items: center !important;

  transform-origin: center !important;
  color: #ffc52b !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 4px 4px rgba(75, 39, 0, .72))
    drop-shadow(0 0 7px rgba(255, 194, 39, .92))
    drop-shadow(0 0 17px rgba(255, 169, 0, .55)) !important;
  z-index: 9 !important;
  pointer-events: none !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1 .leaderboard-crown-icon::before,
body.leaderboard-page-active .leaderboard-podium-card.rank-1 .leaderboard-crown-icon::after {
  content: none !important;
  display: none !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1 .leaderboard-crown-icon svg {


  stroke-width: 2.25 !important;
  overflow: visible !important;
}


body.leaderboard-page-active .leaderboard-empty-avatar {
  width: 64px !important;
  height: 64px !important;
  flex: 0 0 64px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: #8d4d98 !important;
  border: 1px solid rgba(196, 99, 119, .42) !important;
  background: rgba(117, 56, 93, .16) !important;
  box-shadow:
    inset 0 0 20px rgba(126, 55, 103, .12),
    0 0 18px rgba(160, 75, 109, .08) !important;
}

body.leaderboard-page-active .leaderboard-empty-avatar svg {
  width: 31px !important;
  height: 31px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  stroke-width: 1.35 !important;
}

body.leaderboard-page-active .leaderboard-empty-agent {
  padding: 0 !important;
  margin-top: 2px !important;
  color: #938da9 !important;
  font-size: 20px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
}

/* Narrow single-branch laurels matching the reference silhouette. */


/* Dedicated platform SVGs: straight front faces with shallow curved top lips. */
body.leaderboard-page-active .leaderboard-reference-platform {
  position: absolute !important;
  pointer-events: none !important;
  z-index: 6 !important;
  overflow: visible !important;
}

body.leaderboard-page-active .leaderboard-reference-platform svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
}

body.leaderboard-page-active .leaderboard-reference-platform-rank-2,
body.leaderboard-page-active .leaderboard-reference-platform-rank-3 {
  left: -15px !important;
  right: -15px !important;
  bottom: -32px !important;
  height: 40px !important;
}

body.leaderboard-page-active .leaderboard-reference-platform-rank-1 {
  left: -43px !important;
  right: -43px !important;
  bottom: -41px !important;
  height: 52px !important;
}

body.leaderboard-page-active .leaderboard-reference-platform-shadow {
  fill: rgba(0, 0, 0, .50) !important;
  filter: blur(2.2px) !important;
}

body.leaderboard-page-active .leaderboard-reference-platform-face,
body.leaderboard-page-active .leaderboard-reference-platform-lower-face {
  stroke: rgba(255, 255, 255, .16) !important;
  stroke-width: 1 !important;
}

body.leaderboard-page-active .leaderboard-reference-platform-top,
body.leaderboard-page-active .leaderboard-reference-platform-lower-top {
  stroke: rgba(255, 255, 255, .54) !important;
  stroke-width: 1.05 !important;
}

body.leaderboard-page-active .leaderboard-reference-platform-highlight {
  fill: none !important;
  stroke: rgba(255, 255, 255, .82) !important;
  stroke-width: 1.2 !important;
  stroke-linecap: round !important;
}

body.leaderboard-page-active .leaderboard-reference-platform-front-line {
  fill: none !important;
  stroke: rgba(255, 255, 255, .18) !important;
  stroke-width: 1 !important;
  stroke-linecap: round !important;
}


@media (max-width: 1180px) {
  body.leaderboard-page-active .leaderboard-podium {
    padding-right: 22px !important;
    padding-left: 22px !important;
  }


  body.leaderboard-page-active .leaderboard-reference-platform-rank-1 {
    left: -32px !important;
    right: -32px !important;
  }
}

@media (max-width: 960px) {
  body.leaderboard-page-active .leaderboard-podium-stage {
    height: auto !important;
    min-height: 0 !important;
    padding: 28px 20px !important;
  }

  body.leaderboard-page-active .leaderboard-podium {
    grid-template-columns: 1fr !important;
    gap: 38px !important;
    max-width: 560px !important;
    padding: 30px 10px 10px !important;
  }

  body.leaderboard-page-active .leaderboard-podium-card,
  body.leaderboard-page-active .leaderboard-podium-card.rank-1,
  body.leaderboard-page-active .leaderboard-podium-card.rank-3 {
    height: auto !important;
    min-height: 238px !important;
  }

  body.leaderboard-page-active .leaderboard-reference-laurel,
  body.leaderboard-page-active .leaderboard-reference-platform {
    display: none !important;
  }
}


body.leaderboard-page-active .leaderboard-podium-card.rank-2 {
  z-index: 2 !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-3 {
  z-index: 3 !important;
}

body.leaderboard-page-active .leaderboard-podium-card.rank-1 {
  z-index: 5 !important;
}


body.leaderboard-page-active
  .leaderboard-podium-card.rank-1
  .leaderboard-reference-platform {
  z-index: 9 !important;
}

body.leaderboard-page-active
  .leaderboard-podium-card.rank-3
  .leaderboard-reference-platform {
  z-index: 6 !important;
}

/* =========================================================
   LEADERBOARD — REMOVE LAURELS + CROWN POSITION ONLY
   No podium, card, spacing, sizing, or table styles changed.
========================================================= */


body.leaderboard-page-active
  .leaderboard-podium-card.rank-1
  .leaderboard-crown-icon {
  top: 13px !important;
  left: 50% !important;
  width: 50px !important;
  height: 50px !important;
  transform: translateX(-110%) rotate(-12deg) !important;
}

body.leaderboard-page-active
  .leaderboard-podium-card.rank-1
  .leaderboard-crown-icon svg {
  width: 48px !important;
  height: 48px !important;
}

/* =========================================================
   ACCOUNT APPEARANCE CONTROL
   ========================================================= */

.appearance-settings-card {
  margin-top: 18px;
  padding: 16px 18px;
  border: 1px solid #ddd6fe;
  border-radius: 18px;
  background:
    radial-gradient(circle at top left, rgba(109, 53, 245, 0.08), transparent 34%),
    #ffffff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.appearance-settings-copy {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
}

.appearance-settings-icon {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: #6d35f5;
  background: #f1ebff;
  box-shadow: 0 8px 18px rgba(109, 53, 245, 0.12);
}

.appearance-settings-icon svg {
  width: 20px;
  height: 20px;
  stroke-width: 2.1;
}

.appearance-settings-copy h3 {
  margin: 0;
  font-size: 16px;
}

.appearance-settings-copy p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 13px;
}

.theme-toggle-control {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}

.theme-toggle-control input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.theme-toggle-track {
  position: relative;
  width: 50px;
  height: 28px;
  flex: 0 0 50px;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #e2e8f0;
  transition: 0.18s ease;
}

.theme-toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 3px 9px rgba(15, 23, 42, 0.24);
  transition: 0.18s ease;
}

.theme-toggle-control input:checked + .theme-toggle-track {
  border-color: #8b5cf6;
  background: linear-gradient(135deg, #7c3aed, #4f46e5);
  box-shadow: 0 0 0 3px rgba(109, 53, 245, 0.12);
}

.theme-toggle-control input:checked + .theme-toggle-track .theme-toggle-thumb {
  transform: translateX(22px);
}

.theme-toggle-control input:focus-visible + .theme-toggle-track {
  outline: 3px solid rgba(109, 53, 245, 0.22);
  outline-offset: 2px;
}

.theme-toggle-label {
  color: #172033;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .appearance-settings-card {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* =========================================================
   LEADFLOW DARK MODE
   Uses the approved Leaderboard palette everywhere except
   the sidebar and the Leaderboard page itself.
   ========================================================= */

body.app-dark-mode:not(.leaderboard-page-active) {
  --dm-bg: #07051c;
  --dm-bg-2: #0d0927;
  --dm-panel: rgba(24, 18, 58, 0.96);
  --dm-panel-strong: rgba(18, 13, 48, 0.98);
  --dm-panel-soft: rgba(31, 24, 70, 0.82);
  --dm-panel-hover: rgba(111, 69, 229, 0.12);
  --dm-border: rgba(151, 116, 255, 0.24);
  --dm-border-strong: rgba(164, 128, 255, 0.42);
  --dm-text: #f8f7ff;
  --dm-text-soft: #ddd8ed;
  --dm-muted: #aaa4c0;
  --dm-purple: #9b6cff;
  --dm-purple-strong: #7547ff;
  --dm-blue: #4b9bff;
  --dm-green: #71ef62;
  --dm-orange: #ffbd3e;
  --dm-red: #ff7188;
  color-scheme: dark;
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel {
  color: var(--dm-text);
  background:
    radial-gradient(circle at 50% 16%, rgba(91, 45, 221, 0.18), transparent 31%),
    radial-gradient(circle at 92% 8%, rgba(94, 35, 196, 0.14), transparent 25%),
    linear-gradient(135deg, var(--dm-bg) 0%, var(--dm-bg-2) 50%, #08061d 100%);
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel h1,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel h2,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel h3,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel h4,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel h5,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel h6 {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel p,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .muted,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .settings-note {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel .eyebrow {
  color: var(--dm-purple);
}

body.app-dark-mode:not(.leaderboard-page-active) .top-header p,
body.app-dark-mode:not(.leaderboard-page-active) .card-header p {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .notification-pill,
body.app-dark-mode:not(.leaderboard-page-active) .top-pill,
body.app-dark-mode:not(.leaderboard-page-active) .profile-pill {
  color: var(--dm-text);
  border-color: var(--dm-border);
  background: rgba(17, 13, 49, 0.88);
  box-shadow:
    0 14px 34px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(16px);
}

body.app-dark-mode:not(.leaderboard-page-active) .top-pill strong,
body.app-dark-mode:not(.leaderboard-page-active) .profile-pill strong {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .top-pill span,
body.app-dark-mode:not(.leaderboard-page-active) .profile-pill span {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .top-pill > span {
  color: #b998ff;
  background: rgba(117, 71, 255, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) .top-profile-initial {
  color: #ffffff;
  background: linear-gradient(135deg, #7547ff, #5128df);
  box-shadow: 0 0 0 4px rgba(116, 72, 255, 0.12);
}

/* Main surfaces */

body.app-dark-mode:not(.leaderboard-page-active) .stat-card,
body.app-dark-mode:not(.leaderboard-page-active) .content-card,
body.app-dark-mode:not(.leaderboard-page-active) .dashboard-card,
body.app-dark-mode:not(.leaderboard-page-active) .dashboard-insights-card,
body.app-dark-mode:not(.leaderboard-page-active) .settings-card,
body.app-dark-mode:not(.leaderboard-page-active) .user-row,
body.app-dark-mode:not(.leaderboard-page-active) .compact-lead-intake-card,
body.app-dark-mode:not(.leaderboard-page-active) .lead-intake-card,
body.app-dark-mode:not(.leaderboard-page-active) .leads-list-card,
body.app-dark-mode:not(.leaderboard-page-active) .lead-summary-card,
body.app-dark-mode:not(.leaderboard-page-active) .lead-log-card,
body.app-dark-mode:not(.leaderboard-page-active) .lead-next-action-card,
body.app-dark-mode:not(.leaderboard-page-active) .lead-timeline-card,
body.app-dark-mode:not(.leaderboard-page-active) .answered-main-card,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-card,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-hero-card,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-total-card,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-panel,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-report-card,
body.app-dark-mode:not(.leaderboard-page-active) .shared-contact-card,
body.app-dark-mode:not(.leaderboard-page-active) .shared-folder-create-card,
body.app-dark-mode:not(.leaderboard-page-active) .shared-lead-entry-card,
body.app-dark-mode:not(.leaderboard-page-active) .shared-source-header-card,
body.app-dark-mode:not(.leaderboard-page-active) .shared-tabs-card,
body.app-dark-mode:not(.leaderboard-page-active) .shared-panel {
  color: var(--dm-text);
  border-color: var(--dm-border);
  background:
    linear-gradient(145deg, rgba(25, 19, 60, 0.98), rgba(13, 10, 39, 0.98));
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

body.app-dark-mode:not(.leaderboard-page-active) .dashboard-panel-accent-purple {
  border-top-color: #7547ff;
}

body.app-dark-mode:not(.leaderboard-page-active) .dashboard-panel-accent-green {
  border-top-color: #2fbe69;
}

body.app-dark-mode:not(.leaderboard-page-active) .stat-card span {
  color: #c4bdd9;
}

body.app-dark-mode:not(.leaderboard-page-active) .stat-card strong {
  color: #ffffff;
}

body.app-dark-mode:not(.leaderboard-page-active) .stat-card small {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .purple-stat,
body.app-dark-mode:not(.leaderboard-page-active) .violet-stat {
  color: #b68bff;
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .blue-stat {
  color: #5ba5ff;
  background: rgba(43, 118, 255, 0.17);
}

body.app-dark-mode:not(.leaderboard-page-active) .green-stat {
  color: #71ef62;
  background: rgba(55, 198, 88, 0.15);
}

body.app-dark-mode:not(.leaderboard-page-active) .red-stat {
  color: #ff7188;
  background: rgba(244, 75, 104, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) .orange-stat {
  color: #ffbd3e;
  background: rgba(255, 168, 35, 0.16);
}

/* Nested cards and panels */

body.app-dark-mode:not(.leaderboard-page-active) .performance-stat-strip,
body.app-dark-mode:not(.leaderboard-page-active) .performance-chart-wrap,
body.app-dark-mode:not(.leaderboard-page-active) .performance-count-row > div,
body.app-dark-mode:not(.leaderboard-page-active) .money-main-modern,
body.app-dark-mode:not(.leaderboard-page-active) .money-grid > div,
body.app-dark-mode:not(.leaderboard-page-active) .money-ap-chart-card,
body.app-dark-mode:not(.leaderboard-page-active) .intake-panel,
body.app-dark-mode:not(.leaderboard-page-active) .compact-intake-panel,
body.app-dark-mode:not(.leaderboard-page-active) .action-compact-panel,
body.app-dark-mode:not(.leaderboard-page-active) .smart-routing-panel,
body.app-dark-mode:not(.leaderboard-page-active) .quick-note-compact-box,
body.app-dark-mode:not(.leaderboard-page-active) .all-leads-table-area,
body.app-dark-mode:not(.leaderboard-page-active) .all-leads-table-shell,
body.app-dark-mode:not(.leaderboard-page-active) .today-calls-block,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-table-block,
body.app-dark-mode:not(.leaderboard-page-active) .schedule-block,
body.app-dark-mode:not(.leaderboard-page-active) .next-action-preview-box,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-total-grid > div,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-week-wrap,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agents-section,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-section {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(14, 10, 42, 0.72);
}

body.app-dark-mode:not(.leaderboard-page-active) .money-main-modern {
  border-color: rgba(70, 220, 126, 0.30);
  background:
    linear-gradient(145deg, rgba(26, 80, 57, 0.42), rgba(13, 37, 42, 0.68));
}

body.app-dark-mode:not(.leaderboard-page-active) .money-main-modern span,
body.app-dark-mode:not(.leaderboard-page-active) .money-main-modern small {
  color: #9cebb7;
}

body.app-dark-mode:not(.leaderboard-page-active) .money-main-modern strong {
  color: #ffffff;
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-stat,
body.app-dark-mode:not(.leaderboard-page-active) .money-grid > div {
  border-color: var(--dm-border);
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-stat span,
body.app-dark-mode:not(.leaderboard-page-active) .performance-count-row span,
body.app-dark-mode:not(.leaderboard-page-active) .money-grid span,
body.app-dark-mode:not(.leaderboard-page-active) .money-ap-chart-head span,
body.app-dark-mode:not(.leaderboard-page-active) .performance-chart-head span,
body.app-dark-mode:not(.leaderboard-page-active) .performance-zoom-hint,
body.app-dark-mode:not(.leaderboard-page-active) .money-ap-zoom-hint {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-count-row strong,
body.app-dark-mode:not(.leaderboard-page-active) .money-grid strong,
body.app-dark-mode:not(.leaderboard-page-active) .money-ap-chart-head strong,
body.app-dark-mode:not(.leaderboard-page-active) .performance-chart-head strong {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .dashboard-title-icon {
  border-color: var(--dm-border);
  background: rgba(117, 71, 255, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) .dashboard-title-icon-green {
  color: #71ef62;
  background: rgba(55, 198, 88, 0.15);
}

/* Inputs */

body.app-dark-mode:not(.leaderboard-page-active) .main-panel input:not([type="checkbox"]):not([type="radio"]),
body.app-dark-mode:not(.leaderboard-page-active) .main-panel select,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel textarea {
  color: var(--dm-text);
  border-color: var(--dm-border);
  background: rgba(12, 9, 37, 0.92);
  color-scheme: dark;
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel input::placeholder,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel textarea::placeholder {
  color: #7f7897;
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel option {
  color: var(--dm-text);
  background: #151035;
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel input[type="checkbox"],
body.app-dark-mode:not(.leaderboard-page-active) .main-panel input[type="radio"] {
  accent-color: #7547ff;
}

/* Buttons, tabs, filters and menus */

body.app-dark-mode:not(.leaderboard-page-active) .main-panel .light-action-btn,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .dark-action-btn,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .small-btn,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .mini-btn,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .pagination-arrow,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .all-leads-filter-btn,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .all-leads-archived-filter,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .answered-open-btn {
  color: #f1edff;
  border-color: var(--dm-border);
  background: rgba(31, 24, 70, 0.86);
  box-shadow: none;
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel .light-action-btn:hover,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .dark-action-btn:hover,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .small-btn:hover,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .mini-btn:hover,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .pagination-arrow:hover,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .answered-open-btn:hover {
  color: #ffffff;
  border-color: var(--dm-border-strong);
  background: rgba(117, 71, 255, 0.22);
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel .primary-gradient-btn,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .active-tab,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .active-choice,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .compact-save-lead-btn,
body.app-dark-mode:not(.leaderboard-page-active) .main-panel .lead-save-activity-btn {
  color: #ffffff;
  border-color: transparent;
  background: linear-gradient(135deg, #7547ff, #5128df);
  box-shadow: 0 8px 20px rgba(95, 48, 225, 0.28);
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-tabs,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-view-tabs {
  border-color: var(--dm-border);
  background: rgba(12, 9, 37, 0.86);
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-tab,
body.app-dark-mode:not(.leaderboard-page-active) .answered-view-tab,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-range-btn,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-view-tab,
body.app-dark-mode:not(.leaderboard-page-active) #todayCallsPage .schedule-tabs button,
body.app-dark-mode:not(.leaderboard-page-active) #todayCallsPage .unanswered-filters button,
body.app-dark-mode:not(.leaderboard-page-active) #unansweredPage .unanswered-filters button,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-tabs button {
  color: #c9c3dc;
  border-color: var(--dm-border);
  background: rgba(31, 24, 70, 0.70);
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-tab:hover,
body.app-dark-mode:not(.leaderboard-page-active) .answered-view-tab:hover,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-range-btn:hover,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-view-tab:hover {
  color: #ffffff;
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-tab.active-tab,
body.app-dark-mode:not(.leaderboard-page-active) .answered-view-tab.active,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-range-btn.active-tab,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-view-tab.active-tab,
body.app-dark-mode:not(.leaderboard-page-active) #todayCallsPage .schedule-tabs .active-tab,
body.app-dark-mode:not(.leaderboard-page-active) #todayCallsPage .unanswered-filters .active-tab,
body.app-dark-mode:not(.leaderboard-page-active) #unansweredPage .unanswered-filters .active-tab,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-tabs .active-tab {
  color: #ffffff;
  border-color: #7547ff;
  background: linear-gradient(135deg, #7547ff, #5128df);
}

body.app-dark-mode:not(.leaderboard-page-active) .actions-dropdown,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-actions-dropdown,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-actions-dropdown,
body.app-dark-mode:not(.leaderboard-page-active) .schedule-actions-dropdown,
body.app-dark-mode:not(.leaderboard-page-active) .state-dropdown-list {
  color: var(--dm-text);
  border-color: var(--dm-border);
  background: #151035;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.42);
}

body.app-dark-mode:not(.leaderboard-page-active) .actions-dropdown button,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-actions-dropdown button,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-actions-dropdown button,
body.app-dark-mode:not(.leaderboard-page-active) .schedule-actions-dropdown button,
body.app-dark-mode:not(.leaderboard-page-active) .state-dropdown-list button {
  color: var(--dm-text-soft);
  background: transparent;
}

body.app-dark-mode:not(.leaderboard-page-active) .actions-dropdown button:hover,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-actions-dropdown button:hover,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-actions-dropdown button:hover,
body.app-dark-mode:not(.leaderboard-page-active) .schedule-actions-dropdown button:hover,
body.app-dark-mode:not(.leaderboard-page-active) .state-dropdown-list button:hover {
  color: #ffffff;
  background: rgba(117, 71, 255, 0.18);
}

/* Tables and list rows */

body.app-dark-mode:not(.leaderboard-page-active) .main-panel table {
  color: var(--dm-text-soft);
  background: transparent;
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel table thead th {
  color: #f1edff;
  border-color: var(--dm-border);
  background: rgba(39, 28, 80, 0.84);
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel table tbody td {
  color: #ded9ec;
  border-color: rgba(151, 116, 255, 0.16);
  background: transparent;
}

body.app-dark-mode:not(.leaderboard-page-active) .main-panel table tbody tr:hover {
  background: rgba(117, 69, 229, 0.08);
}

body.app-dark-mode:not(.leaderboard-page-active) .all-leads-table-shell,
body.app-dark-mode:not(.leaderboard-page-active) .today-calls-table-wrap,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-table-wrap,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-modern-wrap {
  border-color: var(--dm-border);
  background: rgba(12, 9, 37, 0.72);
}

body.app-dark-mode:not(.leaderboard-page-active) #todayCallsPage .today-calls-table th,
body.app-dark-mode:not(.leaderboard-page-active) #unansweredPage .unanswered-table thead th,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-modern-table thead th {
  color: #f1edff;
  border-color: var(--dm-border);
  background: rgba(39, 28, 80, 0.84);
}

body.app-dark-mode:not(.leaderboard-page-active) #todayCallsPage .today-calls-table td,
body.app-dark-mode:not(.leaderboard-page-active) #unansweredPage .unanswered-table tbody td,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-modern-table tbody td {
  color: #ded9ec;
  border-color: rgba(151, 116, 255, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) #todayCallsPage .today-calls-table tbody tr:hover,
body.app-dark-mode:not(.leaderboard-page-active) #unansweredPage .unanswered-table tbody tr:hover,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-modern-row:hover,
body.app-dark-mode:not(.leaderboard-page-active) .answered-row:hover,
body.app-dark-mode:not(.leaderboard-page-active) .answered-row.selected {
  background: rgba(117, 69, 229, 0.10);
}

body.app-dark-mode:not(.leaderboard-page-active) .all-leads-footer,
body.app-dark-mode:not(.leaderboard-page-active) .today-calls-pagination,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-pagination {
  color: var(--dm-muted);
  border-color: var(--dm-border);
}

body.app-dark-mode:not(.leaderboard-page-active) .leads-page-buttons button,
body.app-dark-mode:not(.leaderboard-page-active) .today-calls-page-buttons button,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-page-buttons button {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(31, 24, 70, 0.82);
}

body.app-dark-mode:not(.leaderboard-page-active) .leads-page-buttons button.active,
body.app-dark-mode:not(.leaderboard-page-active) .today-calls-page-buttons button.active,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-page-buttons button.active {
  color: #ffffff;
  border-color: #7547ff;
  background: #7547ff;
}

/* Links and semantic statuses */

body.app-dark-mode:not(.leaderboard-page-active) .today-lead-name,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-lead-link,
body.app-dark-mode:not(.leaderboard-page-active) .answered-lead-name,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-lead-link,
body.app-dark-mode:not(.leaderboard-page-active) .all-leads-name-button {
  color: #b998ff;
}

body.app-dark-mode:not(.leaderboard-page-active) .result-pill.no-answer,
body.app-dark-mode:not(.leaderboard-page-active) .today-result-pill.no-answer,
body.app-dark-mode:not(.leaderboard-page-active) .lead-summary-result-pill.no-answer {
  color: #ff9baa;
  border-color: rgba(255, 113, 136, 0.34);
  background: rgba(255, 81, 111, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) .result-pill.answered,
body.app-dark-mode:not(.leaderboard-page-active) .today-result-pill.answered,
body.app-dark-mode:not(.leaderboard-page-active) .lead-summary-result-pill.answered {
  color: #89f4a4;
  border-color: rgba(113, 239, 98, 0.34);
  background: rgba(55, 198, 88, 0.15);
}

body.app-dark-mode:not(.leaderboard-page-active) .result-pill.appointment,
body.app-dark-mode:not(.leaderboard-page-active) .today-result-pill.appointment,
body.app-dark-mode:not(.leaderboard-page-active) .lead-summary-result-pill.appointment,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-status-upcoming {
  color: #c7a8ff;
  border-color: rgba(155, 108, 255, 0.38);
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .result-pill.sold,
body.app-dark-mode:not(.leaderboard-page-active) .today-result-pill.sold,
body.app-dark-mode:not(.leaderboard-page-active) .lead-summary-result-pill.sold,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-status-done {
  color: #8ff0a6;
  border-color: rgba(113, 239, 98, 0.34);
  background: rgba(45, 190, 99, 0.17);
}

body.app-dark-mode:not(.leaderboard-page-active) .result-pill.not-interested,
body.app-dark-mode:not(.leaderboard-page-active) .today-result-pill.not-interested,
body.app-dark-mode:not(.leaderboard-page-active) .lead-summary-result-pill.not-interested,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-status-warning {
  color: #ffd07a;
  border-color: rgba(255, 189, 62, 0.34);
  background: rgba(255, 168, 35, 0.16);
}

/* Dashboard graphs */

body.app-dark-mode:not(.leaderboard-page-active) .performance-chart-wrap,
body.app-dark-mode:not(.leaderboard-page-active) .money-ap-chart-card {
  border-color: var(--dm-border);
  background: rgba(10, 7, 31, 0.62);
}

body.app-dark-mode:not(.leaderboard-page-active) .trend-grid-line,
body.app-dark-mode:not(.leaderboard-page-active) .money-ap-grid {
  stroke: rgba(187, 174, 224, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .trend-axis-text,
body.app-dark-mode:not(.leaderboard-page-active) .money-ap-axis {
  fill: #aaa4c0;
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-chart-tooltip {
  color: var(--dm-text);
  border-color: var(--dm-border-strong);
  background: #151035;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.42);
}

body.app-dark-mode:not(.leaderboard-page-active) .performance-chart-tooltip span {
  color: #c8c2dc;
}

body.app-dark-mode:not(.leaderboard-page-active) .money-ap-area {
  fill: rgba(47, 190, 105, 0.17);
}

body.app-dark-mode:not(.leaderboard-page-active) .money-ap-empty {
  fill: #aaa4c0;
}

body.app-dark-mode:not(.leaderboard-page-active) .dashboard-insights-card {
  border-color: rgba(151, 116, 255, 0.34);
  background:
    linear-gradient(135deg, rgba(34, 23, 79, 0.96), rgba(17, 12, 48, 0.96));
}

body.app-dark-mode:not(.leaderboard-page-active) .dashboard-insights-text,
body.app-dark-mode:not(.leaderboard-page-active) .dashboard-insights-copy p {
  color: var(--dm-muted);
}

/* Leads, activity and preview content */

body.app-dark-mode:not(.leaderboard-page-active) .action-choice,
body.app-dark-mode:not(.leaderboard-page-active) .compact-empty-action-box,
body.app-dark-mode:not(.leaderboard-page-active) .empty-action-box,
body.app-dark-mode:not(.leaderboard-page-active) .smart-route-row,
body.app-dark-mode:not(.leaderboard-page-active) .lead-meta-item,
body.app-dark-mode:not(.leaderboard-page-active) .timeline-note-row,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-empty,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-header,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-detail,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-note {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(14, 10, 42, 0.68);
}

body.app-dark-mode:not(.leaderboard-page-active) .action-choice:hover,
body.app-dark-mode:not(.leaderboard-page-active) .action-choice.active-choice {
  border-color: var(--dm-border-strong);
  background: rgba(117, 71, 255, 0.17);
}

body.app-dark-mode:not(.leaderboard-page-active) .lead-card-label,
body.app-dark-mode:not(.leaderboard-page-active) .lead-note-label,
body.app-dark-mode:not(.leaderboard-page-active) .lead-meta-item small,
body.app-dark-mode:not(.leaderboard-page-active) .lead-summary-stats small,
body.app-dark-mode:not(.leaderboard-page-active) .timeline-note-date,
body.app-dark-mode:not(.leaderboard-page-active) .timeline-note-meta,
body.app-dark-mode:not(.leaderboard-page-active) .answered-note-preview,
body.app-dark-mode:not(.leaderboard-page-active) .answered-next-action {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .lead-meta-item strong,
body.app-dark-mode:not(.leaderboard-page-active) .timeline-note-text,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-empty h3,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-name-row strong {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .lead-summary-divider,
body.app-dark-mode:not(.leaderboard-page-active) .answered-toolbar-top,
body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-header,
body.app-dark-mode:not(.leaderboard-page-active) .timeline-header {
  border-color: var(--dm-border);
}

body.app-dark-mode:not(.leaderboard-page-active) .lead-action-gray,
body.app-dark-mode:not(.leaderboard-page-active) .timeline-filter-btn {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(31, 24, 70, 0.78);
}

body.app-dark-mode:not(.leaderboard-page-active) .lead-action-dark {
  color: #ffffff;
  background: linear-gradient(135deg, #7547ff, #5128df);
}

body.app-dark-mode:not(.leaderboard-page-active) .lead-action-red,
body.app-dark-mode:not(.leaderboard-page-active) .danger-mini-btn,
body.app-dark-mode:not(.leaderboard-page-active) .bulk-delete-btn {
  color: #ffe6ea;
  border-color: rgba(255, 113, 136, 0.34);
  background: rgba(209, 44, 77, 0.86);
}

/* Today Calls, Answered, Unanswered and Schedule */

body.app-dark-mode:not(.leaderboard-page-active) #todayCallsPage #refreshTodayCallsButton {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(31, 24, 70, 0.82);
}

body.app-dark-mode:not(.leaderboard-page-active) .today-time-cell strong,
body.app-dark-mode:not(.leaderboard-page-active) .today-client-time strong,
body.app-dark-mode:not(.leaderboard-page-active) .today-calls-block h3,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-table-heading h3 {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .today-time-cell small,
body.app-dark-mode:not(.leaderboard-page-active) .today-client-time small,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-table-heading span,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-modern-table td small,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-note-preview,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-reason-text {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .today-age-pill,
body.app-dark-mode:not(.leaderboard-page-active) .today-result-pill {
  color: #c7a8ff;
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .today-call-actions-menu > summary,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-kebab-btn {
  color: #b998ff;
  border-color: var(--dm-border);
  background: rgba(117, 71, 255, 0.14);
}

body.app-dark-mode:not(.leaderboard-page-active) .answered-date-control {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(12, 9, 37, 0.86);
}

body.app-dark-mode:not(.leaderboard-page-active) .answered-date-control input {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .answered-preview-empty,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-empty-state,
body.app-dark-mode:not(.leaderboard-page-active) .unanswered-empty-state {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-modern-block,
body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-modern-wrap {
  border-color: var(--dm-border);
  background: rgba(14, 10, 42, 0.72);
}

body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-date-icon {
  color: #b998ff;
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) #schedulePage .schedule-menu-divider {
  background: var(--dm-border);
}

/* Settings */

body.app-dark-mode:not(.leaderboard-page-active) .appearance-settings-card {
  border-color: var(--dm-border-strong);
  background:
    radial-gradient(circle at top left, rgba(117, 71, 255, 0.20), transparent 35%),
    linear-gradient(145deg, rgba(30, 22, 72, 0.98), rgba(14, 10, 42, 0.98));
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

body.app-dark-mode:not(.leaderboard-page-active) .appearance-settings-icon {
  color: #c7a8ff;
  background: rgba(117, 71, 255, 0.20);
  box-shadow: 0 0 22px rgba(117, 71, 255, 0.24);
}

body.app-dark-mode:not(.leaderboard-page-active) .appearance-settings-copy p {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .theme-toggle-label {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .theme-toggle-track {
  border-color: var(--dm-border);
  background: rgba(72, 65, 99, 0.82);
}

body.app-dark-mode:not(.leaderboard-page-active) .user-row span {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .user-row strong {
  color: var(--dm-text);
}

/* Tracker and shared-lead workspaces */

body.app-dark-mode:not(.leaderboard-page-active) .tracker-total-header p,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-card-header p,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-total-grid span,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-report-header p {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-total-grid strong,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-card strong {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-total-badge {
  color: #c7a8ff;
  border-color: var(--dm-border-strong);
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-report-textarea {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(10, 7, 31, 0.76);
}

body.app-dark-mode:not(.leaderboard-page-active) [class*="shared-"][class*="-row"],
body.app-dark-mode:not(.leaderboard-page-active) [class*="shared-"][class*="-item"],
body.app-dark-mode:not(.leaderboard-page-active) [class*="shared-"][class*="-block"] {
  border-color: var(--dm-border);
}

/* Modals and slide panels */

body.app-dark-mode:not(.leaderboard-page-active) .modal,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-overlay {
  background: rgba(3, 2, 14, 0.72);
  backdrop-filter: blur(8px);
}

body.app-dark-mode:not(.leaderboard-page-active) .modal-content,
body.app-dark-mode:not(.leaderboard-page-active) .slide-panel,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card {
  color: var(--dm-text);
  border-color: var(--dm-border-strong);
  background:
    linear-gradient(145deg, rgba(25, 19, 60, 0.99), rgba(13, 10, 39, 0.99));
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.52);
}

body.app-dark-mode:not(.leaderboard-page-active) .modal-content h1,
body.app-dark-mode:not(.leaderboard-page-active) .modal-content h2,
body.app-dark-mode:not(.leaderboard-page-active) .modal-content h3,
body.app-dark-mode:not(.leaderboard-page-active) .slide-panel h1,
body.app-dark-mode:not(.leaderboard-page-active) .slide-panel h2,
body.app-dark-mode:not(.leaderboard-page-active) .slide-panel h3,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card h1,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card h2,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card h3 {
  color: var(--dm-text);
}

body.app-dark-mode:not(.leaderboard-page-active) .modal-content p,
body.app-dark-mode:not(.leaderboard-page-active) .slide-panel p,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card p,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card small {
  color: var(--dm-muted);
}

body.app-dark-mode:not(.leaderboard-page-active) .modal-content input,
body.app-dark-mode:not(.leaderboard-page-active) .modal-content select,
body.app-dark-mode:not(.leaderboard-page-active) .modal-content textarea,
body.app-dark-mode:not(.leaderboard-page-active) .slide-panel input,
body.app-dark-mode:not(.leaderboard-page-active) .slide-panel select,
body.app-dark-mode:not(.leaderboard-page-active) .slide-panel textarea,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card input,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card select,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-card textarea {
  color: var(--dm-text);
  border-color: var(--dm-border);
  background: rgba(12, 9, 37, 0.92);
  color-scheme: dark;
}

body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-summary,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-field,
body.app-dark-mode:not(.leaderboard-page-active) .form-field,
body.app-dark-mode:not(.leaderboard-page-active) .form-tabs {
  border-color: var(--dm-border);
  background: rgba(14, 10, 42, 0.70);
}

body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-cancel,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-modal-close {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(31, 24, 70, 0.82);
}

body.app-dark-mode:not(.leaderboard-page-active) ::selection {
  color: #ffffff;
  background: rgba(117, 71, 255, 0.62);
}

/* Complete remaining legacy light surfaces without changing layout. */

body.app-dark-mode:not(.leaderboard-page-active) .performance-mini-metrics > div,
body.app-dark-mode:not(.leaderboard-page-active) .rate-card,
body.app-dark-mode:not(.leaderboard-page-active) .pipeline-row,
body.app-dark-mode:not(.leaderboard-page-active) .enhanced-recent-row,
body.app-dark-mode:not(.leaderboard-page-active) .coaching-item,
body.app-dark-mode:not(.leaderboard-page-active) .route-preview,
body.app-dark-mode:not(.leaderboard-page-active) .all-leads-toolbar,
body.app-dark-mode:not(.leaderboard-page-active) .all-leads-table-area .schedule-block,
body.app-dark-mode:not(.leaderboard-page-active) .all-leads-table-area .schedule-table,
body.app-dark-mode:not(.leaderboard-page-active) .stat-row > div,
body.app-dark-mode:not(.leaderboard-page-active) .report-box,
body.app-dark-mode:not(.leaderboard-page-active) .shared-source-card,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-metric-edit,
body.app-dark-mode:not(.leaderboard-page-active) .dashboard-date-control,
body.app-dark-mode:not(.leaderboard-page-active) .dashboard-kpi-card {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(14, 10, 42, 0.72);
}

body.app-dark-mode:not(.leaderboard-page-active) .all-leads-toolbar,
body.app-dark-mode:not(.leaderboard-page-active) .all-leads-footer {
  border-color: var(--dm-border);
  background: rgba(19, 14, 49, 0.88);
}

body.app-dark-mode:not(.leaderboard-page-active) .all-leads-table-area .schedule-table th {
  color: #f1edff;
  border-color: var(--dm-border);
  background: rgba(39, 28, 80, 0.84);
}

body.app-dark-mode:not(.leaderboard-page-active) .all-leads-table-area .schedule-table td {
  color: var(--dm-text-soft);
  border-color: rgba(151, 116, 255, 0.16);
  background: transparent;
}

body.app-dark-mode:not(.leaderboard-page-active) .all-leads-pagination select,
body.app-dark-mode:not(.leaderboard-page-active) .today-pagination-controls select,
body.app-dark-mode:not(.leaderboard-page-active) .today-pagination-btn {
  color: var(--dm-text-soft);
  border-color: var(--dm-border);
  background: rgba(31, 24, 70, 0.82);
}

body.app-dark-mode:not(.leaderboard-page-active) .lead-actions-dropdown,
body.app-dark-mode:not(.leaderboard-page-active) .today-call-actions-dropdown {
  color: var(--dm-text);
  border-color: var(--dm-border);
  background: #151035;
}

body.app-dark-mode:not(.leaderboard-page-active) .shared-tab,
body.app-dark-mode:not(.leaderboard-page-active) .timeline-filter-btn,
body.app-dark-mode:not(.leaderboard-page-active) .dashboard-date-control {
  color: #c9c3dc;
}

body.app-dark-mode:not(.leaderboard-page-active) .shared-tab:hover,
body.app-dark-mode:not(.leaderboard-page-active) .shared-tab.active-tab,
body.app-dark-mode:not(.leaderboard-page-active) .timeline-filter-btn.active {
  color: #ffffff;
  border-color: var(--dm-border-strong);
  background: rgba(117, 71, 255, 0.20);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-metric-edit,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-search-wrap input,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-card-edit-top input,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-inline-metric input {
  color: var(--dm-text);
  border-color: var(--dm-border);
  background: rgba(12, 9, 37, 0.92);
}

body.app-dark-mode:not(.leaderboard-page-active) .timeline-note-row::before {
  border-color: #9b6cff;
  background: #151035;
}

body.app-dark-mode:not(.leaderboard-page-active) .timeline-edit-btn {
  color: #c7a8ff;
  border-color: var(--dm-border);
  background: rgba(117, 71, 255, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) .timeline-delete-btn {
  color: #ff9baa;
  border-color: rgba(255, 113, 136, 0.34);
  background: rgba(255, 81, 111, 0.14);
}

body.app-dark-mode:not(.leaderboard-page-active) .success-mini-btn {
  color: #9cf3ad;
  border-color: rgba(113, 239, 98, 0.30);
  background: rgba(45, 190, 99, 0.16);
}


/* AGENT TRACKER TABLE */
.tracker-agent-table-section {
  overflow: visible;
}

.tracker-agent-table-header {
  align-items: center;
  margin-bottom: 16px;
}

.tracker-agent-table-header h2 {
  margin: 0;
  font-size: 24px;
  letter-spacing: -0.035em;
}

.tracker-agent-table-header p {
  margin: 4px 0 0;
}

.tracker-agent-table-root {
  width: 100%;
}

.tracker-agent-table-shell {
  overflow: visible;
  border: 1px solid #e3e8f1;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}

.tracker-agent-table-scroll {
  overflow-x: auto;
  border-radius: 18px 18px 0 0;
}

.tracker-agent-table {
  width: 100%;
  min-width: 1410px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
}

.tracker-agent-table th,
.tracker-agent-table td {
  padding: 15px 11px;
  border-bottom: 1px solid #e9edf4;
  text-align: center;
  white-space: nowrap;
}

.tracker-agent-table th:first-child,
.tracker-agent-table td:first-child {
  text-align: left;
}

.tracker-agent-table th {
  color: #596579;
  background: #f7f8fc;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.tracker-agent-table th:first-child {
  border-top-left-radius: 17px;
}

.tracker-agent-table th:last-child {
  border-top-right-radius: 17px;
}

.tracker-agent-table td {
  color: #172033;
  background: #ffffff;
  font-size: 13px;
  font-weight: 750;
  transition:
    background 0.16s ease,
    color 0.16s ease;
}

.tracker-agent-table-row:last-child td {
  border-bottom: 0;
}

.tracker-agent-table-row:hover td {
  background: #faf9ff;
}

.tracker-agent-name-cell {
  min-width: 250px;
  display: flex;
  align-items: center;
  gap: 11px;
}

.tracker-agent-table-avatar {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #ffffff;
  background: linear-gradient(135deg, #7547ff, #5128df);
  box-shadow: 0 8px 18px rgba(109, 53, 245, 0.24);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: -0.02em;
}

.tracker-agent-table-identity {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.tracker-agent-table-identity strong {
  overflow: hidden;
  color: #111827;
  font-size: 14px;
  font-weight: 850;
  text-overflow: ellipsis;
}

.tracker-agent-table-identity small {
  color: #7a8699;
  font-size: 11px;
  font-weight: 650;
}

.tracker-agent-table-type {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 76px;
  padding: 6px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 850;
}

.tracker-agent-table-type.manual {
  color: #6841e8;
  border: 1px solid #ddd3ff;
  background: #f4f0ff;
}

.tracker-agent-table-type.connected {
  color: #1768c5;
  border: 1px solid #cce2ff;
  background: #edf6ff;
}

.tracker-agent-no-answer {
  color: #dc263c !important;
  font-weight: 900 !important;
}

.tracker-agent-demonstrations {
  color: #7c3aed !important;
  font-weight: 900 !important;
}

.tracker-agent-ap-value {
  color: #17a651 !important;
  font-weight: 900 !important;
}

.tracker-agent-actions-cell {
  width: 76px;
}

.tracker-agent-actions-button {
  width: 36px;
  height: 36px;
  padding: 0;
  display: inline-grid;
  place-items: center;
  color: #4f46e5;
  border: 1px solid #e0dcf8;
  border-radius: 11px;
  background: #f7f5ff;
  box-shadow: none;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
}

.tracker-agent-actions-button:hover,
.tracker-agent-actions-button[aria-expanded="true"] {
  color: #ffffff;
  border-color: #6d35f5;
  background: linear-gradient(135deg, #7547ff, #5128df);
  transform: translateY(-1px);
}

.tracker-agent-table-footer {
  min-height: 68px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  color: #6c7789;
  border-top: 1px solid #e8ecf3;
  font-size: 12px;
  font-weight: 700;
}

.tracker-agent-pagination {
  display: flex;
  align-items: center;
  gap: 6px;
}

.tracker-agent-page-button,
.tracker-agent-page-arrow {
  min-width: 34px;
  height: 34px;
  padding: 0 9px;
  display: grid;
  place-items: center;
  color: #4f5c70;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
  font-size: 12px;
  font-weight: 850;
}

.tracker-agent-page-button:hover,
.tracker-agent-page-arrow:hover:not(:disabled) {
  color: #6841e8;
  border-color: #ddd4ff;
  background: #f4f0ff;
  transform: none;
}

.tracker-agent-page-button.active {
  color: #ffffff;
  border-color: #6d35f5;
  background: linear-gradient(135deg, #7547ff, #5128df);
  box-shadow: 0 8px 18px rgba(109, 53, 245, 0.24);
}

.tracker-agent-page-arrow:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.tracker-agent-page-ellipsis {
  min-width: 24px;
  color: #8b95a6;
  text-align: center;
  font-weight: 850;
}

.tracker-table-empty {
  padding: 30px;
  color: #6b7688;
  border: 1px dashed #ccd4e0;
  border-radius: 18px;
  background: #f8fafc;
  text-align: center;
  font-size: 13px;
  font-weight: 750;
}

.tracker-agent-action-menu {
  position: fixed;
  z-index: 1500;
  width: 172px;
  padding: 7px;
  display: grid;
  gap: 4px;
  border: 1px solid rgba(113, 83, 191, 0.34);
  border-radius: 13px;
  background: #17122f;
  box-shadow: 0 18px 42px rgba(8, 5, 28, 0.42);
}

.tracker-agent-action-menu button {
  width: 100%;
  padding: 10px 11px;
  display: flex;
  align-items: center;
  gap: 9px;
  color: #e9e5f7;
  border: 0;
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
  text-align: left;
  font-size: 12px;
  font-weight: 800;
}

.tracker-agent-action-menu button [data-lucide] {
  width: 15px;
  height: 15px;
}

.tracker-agent-action-menu button:hover:not(:disabled) {
  transform: none;
}

.tracker-agent-menu-edit:hover:not(:disabled) {
  color: #ffffff;
  background: rgba(117, 71, 255, 0.24);
}

.tracker-agent-menu-delete {
  color: #ff7188 !important;
}

.tracker-agent-menu-delete:hover:not(:disabled) {
  color: #ffffff !important;
  background: rgba(225, 43, 73, 0.22);
}

.tracker-agent-action-menu button:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}

.tracker-agent-edit-overlay {
  position: fixed;
  inset: 0;
  z-index: 1600;
  padding: 24px;
  display: grid;
  place-items: center;
  background: rgba(5, 3, 20, 0.76);
  backdrop-filter: blur(10px);
}

.tracker-agent-edit-modal {
  width: min(820px, 100%);
  max-height: min(90vh, 820px);
  overflow-y: auto;
  color: #182033;
  border: 1px solid #e3e7ef;
  border-radius: 22px;
  background: #ffffff;
  box-shadow: 0 30px 80px rgba(5, 8, 22, 0.34);
}

.tracker-agent-edit-header {
  padding: 22px 24px 18px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid #e9edf3;
}

.tracker-agent-edit-header h2 {
  margin: 0;
  font-size: 24px;
  letter-spacing: -0.035em;
}

.tracker-agent-edit-header > div > p:last-child {
  margin: 5px 0 0;
  color: #6b7688;
  font-size: 13px;
}

.tracker-agent-edit-close {
  width: 38px;
  height: 38px;
  padding: 0;
  display: grid;
  place-items: center;
  color: #5d6879;
  border: 1px solid #e0e5ed;
  border-radius: 11px;
  background: #f8fafc;
  box-shadow: none;
}

.tracker-agent-edit-close [data-lucide] {
  width: 18px;
  height: 18px;
}

.tracker-agent-edit-main {
  padding: 22px 24px;
}

.tracker-agent-edit-primary,
.tracker-agent-edit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.tracker-agent-edit-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tracker-agent-edit-primary label,
.tracker-agent-edit-grid label {
  display: grid;
  gap: 7px;
}

.tracker-agent-edit-primary span,
.tracker-agent-edit-grid span {
  color: #5e6a7d;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.tracker-agent-edit-primary input,
.tracker-agent-edit-grid input {
  width: 100%;
  min-height: 42px;
  padding: 9px 11px;
  color: #182033;
  border: 1px solid #dce2eb;
  border-radius: 11px;
  background: #ffffff;
  font-size: 13px;
  font-weight: 750;
}

.tracker-agent-edit-wide {
  grid-column: span 2;
}

.tracker-agent-edit-full {
  grid-column: 1 / -1;
}

.tracker-agent-edit-note {
  margin: 16px 0;
  padding: 10px 12px;
  color: #5f3fd4;
  border: 1px solid #ddd3ff;
  border-radius: 11px;
  background: #f6f3ff;
  font-size: 12px;
  font-weight: 800;
}

.tracker-agent-edit-footer {
  padding: 16px 24px 22px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid #e9edf3;
}

body.tracker-agent-modal-open {
  overflow: hidden;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table-shell {
  border-color: rgba(124, 96, 196, 0.36);
  background: rgba(13, 10, 38, 0.94);
  box-shadow: 0 18px 38px rgba(2, 1, 14, 0.28);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table th {
  color: #c8c0df;
  border-color: rgba(124, 96, 196, 0.24);
  background: rgba(31, 24, 70, 0.78);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table td {
  color: #f3f0fb;
  border-color: rgba(124, 96, 196, 0.18);
  background: rgba(12, 9, 37, 0.78);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table-row:hover td {
  background: rgba(117, 71, 255, 0.12);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table-identity strong {
  color: #ffffff;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table-identity small {
  color: #a9a1bd;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table-type.manual {
  color: #c9b7ff;
  border-color: rgba(151, 116, 255, 0.36);
  background: rgba(117, 71, 255, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table-type.connected {
  color: #8ec8ff;
  border-color: rgba(61, 146, 255, 0.34);
  background: rgba(37, 99, 235, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-no-answer {
  color: #ff4d68 !important;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-ap-value {
  color: #39d867 !important;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-actions-button {
  color: #d9cfff;
  border-color: rgba(124, 96, 196, 0.34);
  background: rgba(31, 24, 70, 0.76);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-actions-button:hover,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-actions-button[aria-expanded="true"] {
  color: #ffffff;
  border-color: #7547ff;
  background: linear-gradient(135deg, #7547ff, #5128df);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-table-footer {
  color: #aaa2bf;
  border-color: rgba(124, 96, 196, 0.24);
  background: rgba(13, 10, 38, 0.92);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-page-button,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-page-arrow {
  color: #d2cbe4;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-page-button:hover,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-page-arrow:hover:not(:disabled) {
  color: #ffffff;
  border-color: rgba(151, 116, 255, 0.44);
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-page-button.active {
  border-color: #7547ff;
  background: linear-gradient(135deg, #7547ff, #5128df);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-page-ellipsis {
  color: #8f87a4;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-table-empty {
  color: #aaa2bf;
  border-color: rgba(124, 96, 196, 0.36);
  background: rgba(13, 10, 38, 0.72);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-modal {
  color: #f6f3ff;
  border-color: rgba(124, 96, 196, 0.42);
  background:
    linear-gradient(145deg, rgba(25, 19, 60, 0.99), rgba(13, 10, 39, 0.99));
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.58);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-header,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-footer {
  border-color: rgba(124, 96, 196, 0.24);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-header > div > p:last-child {
  color: #aaa2bf;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-close {
  color: #d7d0e7;
  border-color: rgba(124, 96, 196, 0.34);
  background: rgba(31, 24, 70, 0.78);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-primary span,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-grid span {
  color: #b7afca;
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-primary input,
body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-grid input {
  color: #ffffff;
  border-color: rgba(124, 96, 196, 0.34);
  background: rgba(12, 9, 37, 0.90);
}

body.app-dark-mode:not(.leaderboard-page-active) .tracker-agent-edit-note {
  color: #cbb9ff;
  border-color: rgba(151, 116, 255, 0.34);
  background: rgba(117, 71, 255, 0.14);
}

@media (max-width: 900px) {
  .tracker-agent-table-header,
  .tracker-agent-table-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .tracker-agent-search-wrap {
    width: 100%;
    max-width: none;
  }

  .tracker-agent-pagination {
    flex-wrap: wrap;
  }

  .tracker-agent-edit-primary,
  .tracker-agent-edit-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 620px) {
  .tracker-agent-edit-overlay {
    padding: 10px;
  }

  .tracker-agent-edit-header,
  .tracker-agent-edit-main,
  .tracker-agent-edit-footer {
    padding-left: 16px;
    padding-right: 16px;
  }

  .tracker-agent-edit-primary,
  .tracker-agent-edit-grid {
    grid-template-columns: 1fr;
  }

  .tracker-agent-edit-wide,
  .tracker-agent-edit-full {
    grid-column: auto;
  }

  .tracker-agent-edit-footer {
    flex-direction: column-reverse;
  }

  .tracker-agent-edit-footer button {
    width: 100%;
  }
}

/* =========================================================
   LEAD PROFILE — CONSOLIDATED
   One component shared by normal and shared Lead profiles.
========================================================= */

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-detail-redesign {
  display: grid;
  gap: 14px;
  padding-bottom: 18px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-card,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-card,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-current-place-card,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-timeline-card {
  color: #0f172a;
  border: 1px solid #dfe5ef;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.07);
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-card {
  position: relative;
  padding: 17px 20px 20px;
  border-left: 4px solid #6d35f5;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 9px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-card-label {
  margin: 0;
  color: #7447f7;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.085em;
  text-transform: uppercase;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-layout {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 1px auto;
  align-items: center;
  gap: 20px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-avatar {
  width: 66px;
  height: 66px;
  display: grid;
  place-items: center;
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 50%;
  background: linear-gradient(145deg, #7547ff, #5128df);
  box-shadow: 0 12px 28px rgba(91, 61, 245, 0.28);
  font-size: 21px;
  font-weight: 950;
  letter-spacing: -0.04em;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-main {
  min-width: 0;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-name-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 13px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-name-row h1 {
  margin: 0;
  overflow: hidden;
  color: #0f172a;
  font-size: 25px;
  font-weight: 900;
  letter-spacing: -0.045em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-status {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 0 10px;
  color: #147a43;
  border: 1px solid #bcebd0;
  border-radius: 999px;
  background: #e8f9ef;
  font-size: 11px;
  font-weight: 850;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-status.archived {
  color: #667085;
  border-color: #d8dee8;
  background: #eef1f5;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-meta {
  display: grid;
  grid-template-columns: repeat(5, minmax(105px, max-content));
  align-items: center;
  gap: 16px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-meta-item {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-meta-icon {
  width: 34px;
  height: 34px;
  min-width: 34px;
  display: grid;
  place-items: center;
  color: #6641e8;
  border: 1px solid #e1dbfb;
  border-radius: 12px;
  background: #f5f2ff;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-meta-icon svg {
  width: 16px;
  height: 16px;
  stroke-width: 2.1;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-meta-item small,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-stats small {
  display: block;
  margin-bottom: 3px;
  color: #778195;
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-meta-item strong {
  display: block;
  max-width: 170px;
  overflow: hidden;
  color: #263248;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: ellipsis;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-divider {
  width: 1px;
  height: 70px;
  background: #dfe5ef;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-stats {
  min-width: 235px;
  display: grid;
  grid-template-columns: repeat(2, minmax(96px, 1fr));
  gap: 18px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-result-pill,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-calls-pill {
  min-height: 37px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 86px;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 850;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-result-pill {
  color: #d73552;
  background: #ffedf1;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-result-pill.answered,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-result-pill.interested,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-result-pill.sold {
  color: #148047;
  background: #e7f9ef;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-result-pill.appointment {
  color: #6841e8;
  background: #efeaff;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-result-pill.new {
  color: #5f6b7c;
  background: #edf1f6;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-calls-pill {
  color: #245fc1;
  background: #e8f1ff;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu {
  position: relative;
  z-index: 20;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu > summary,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu > summary {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: #6540e8;
  border: 1px solid #ddd7f5;
  border-radius: 11px;
  background: #f8f6ff;
  cursor: pointer;
  list-style: none;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu > summary::-webkit-details-marker,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu > summary::-webkit-details-marker {
  display: none;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu > summary svg,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu > summary svg {
  width: 18px;
  height: 18px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu[open] > summary,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu[open] > summary {
  color: #ffffff;
  border-color: #6d35f5;
  background: linear-gradient(135deg, #7547ff, #5128df);
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 174px;
  overflow: hidden;
  padding: 7px;
  border: 1px solid #ddd7f5;
  border-radius: 13px;
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown button,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown button {
  width: 100%;
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 10px;
  color: #3d2b85;
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
  font-size: 12px;
  font-weight: 800;
  text-align: left;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown button:hover,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown button:hover {
  color: #5e35e5;
  background: #f3efff;
  transform: none;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown button.danger,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown button.danger {
  color: #df334f;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown button.danger:hover,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown button.danger:hover {
  background: #fff0f3;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown svg,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown svg {
  width: 15px;
  height: 15px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-work-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(420px, 1.05fr);
  gap: 14px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-card,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-current-place-card {
  min-width: 0;
  padding: 18px 20px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-section-title {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 15px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-section-title > span {
  width: 30px;
  height: 30px;
  min-width: 30px;
  display: grid;
  place-items: center;
  color: #6e42ee;
  border-radius: 10px;
  background: #efeaff;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-section-title > span svg {
  width: 16px;
  height: 16px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-section-title h2 {
  margin: 2px 0 0;
  color: #182238;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.025em;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-section-title p {
  margin: 3px 0 0;
  color: #7b8597;
  font-size: 11px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-fields,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-fields label,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields label,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-note-label {
  display: grid;
  gap: 6px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-fields label > span,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields label > span,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-note-label > span {
  color: #5f6b7d;
  font-size: 11px;
  font-weight: 750;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-note-label small {
  color: #9098a8;
  font-size: inherit;
  font-weight: 600;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-fields select,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields input,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-note-label textarea {
  width: 100%;
  color: #182238;
  border: 1px solid #d9e0eb;
  border-radius: 10px;
  background-color: #ffffff;
  font-size: 12px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-fields select,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields input {
  height: 39px;
  padding: 0 11px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-note-label textarea {
  min-height: 88px;
  padding: 10px 11px;
  resize: vertical;
  line-height: 1.45;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-save-activity-btn {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
  padding: 0 14px;
  color: #ffffff;
  border-radius: 9px;
  background: linear-gradient(135deg, #7547ff, #5128df);
  box-shadow: 0 10px 22px rgba(91, 61, 245, 0.25);
  font-size: 12px;
  font-weight: 850;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-save-activity-btn svg {
  width: 15px;
  height: 15px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-activity {
  min-height: 138px;
  overflow: hidden;
  border: 1px solid #dfe5ef;
  border-radius: 14px;
  background: #fbfcff;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-empty {
  min-height: 138px;
  display: grid;
  place-items: center;
  padding: 20px;
  color: #7b8597;
  font-size: 12px;
  text-align: center;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-result-head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 14px 16px;
  border-bottom: 1px solid #e2e7f0;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-result-icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  color: #df334f;
  border-radius: 13px;
  background: #ffedf1;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-result-icon svg {
  width: 19px;
  height: 19px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-result-head strong {
  display: block;
  color: #172033;
  font-size: 14px;
  font-weight: 850;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-result-head small {
  display: block;
  margin-top: 2px;
  color: #7a8496;
  font-size: 10.5px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-details {
  display: grid;
  grid-template-columns: 1.2fr 0.85fr 0.95fr 1.5fr;
  align-items: stretch;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-detail {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 13px 15px;
  border-right: 1px solid #e4e8f0;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-detail:last-child {
  border-right: 0;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-detail svg {
  width: 16px;
  height: 16px;
  min-width: 16px;
  color: #6d35f5;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-detail strong {
  display: block;
  overflow: hidden;
  color: #293449;
  font-size: 11.5px;
  font-weight: 750;
  line-height: 1.35;
  text-overflow: ellipsis;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-detail small {
  display: block;
  margin-top: 2px;
  color: #8a93a4;
  font-size: 9.5px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-timeline-card {
  overflow: visible;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header {
  min-height: 55px;
  display: flex;
  align-items: center;
  padding: 0 20px;
  border-bottom: 1px solid #e1e6ef;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header-icon {
  color: #6d35f5;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header-icon svg {
  width: 18px;
  height: 18px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header h2 {
  margin: 0;
  color: #172033;
  font-size: 15px;
  font-weight: 900;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header p {
  margin: 0 0 0 8px;
  color: #7e8798;
  font-size: 10.5px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-column-headings,
:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row {
  display: grid;
  grid-template-columns: 145px 125px 145px minmax(190px, 1fr) minmax(200px, 1.2fr) 42px;
  gap: 14px;
  align-items: center;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-column-headings {
  min-height: 38px;
  padding: 0 18px;
  color: #758094;
  border-bottom: 1px solid #e4e8f0;
  background: #f8f9fc;
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-timeline-list {
  display: grid;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row {
  position: relative;
  min-height: 66px;
  padding: 10px 18px;
  border-bottom: 1px solid #e5e9f1;
  background: #ffffff;
  transition: background 0.16s ease, transform 0.16s ease;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row:last-child {
  border-bottom: 0;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row:hover {
  z-index: 5;
  background: #fbfaff;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell-icon {
  width: 30px;
  height: 30px;
  min-width: 30px;
  display: grid;
  place-items: center;
  color: #6d35f5;
  border-radius: 10px;
  background: #f0ebff;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell-icon svg {
  width: 15px;
  height: 15px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell strong {
  display: block;
  overflow: hidden;
  color: #2a3448;
  font-size: 11.5px;
  font-weight: 750;
  line-height: 1.35;
  text-overflow: ellipsis;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell small {
  display: block;
  margin-top: 2px;
  color: #8790a1;
  font-size: 9.5px;
  line-height: 1.3;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-result-pill {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 0 10px;
  color: #d73552;
  border-radius: 999px;
  background: #ffedf1;
  font-size: 10.5px;
  font-weight: 850;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-result-pill.answered,
:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-result-pill.interested,
:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-result-pill.sold {
  color: #158147;
  background: #e7f9ef;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-result-pill.appointment {
  color: #6841e8;
  background: #efeaff;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-result-pill.empty {
  color: #7b8494;
  background: #eef1f5;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-manual strong {
  white-space: normal;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu {
  position: relative;
  justify-self: end;
  z-index: 10;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu > summary {
  width: 34px;
  height: 34px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown {
  top: auto;
  right: 0;
  bottom: calc(100% + 7px);
  min-width: 132px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-timeline-empty {
  padding: 28px 20px;
  color: #7b8597;
  font-size: 12px;
  text-align: center;
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-card,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-card,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-current-place-card,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-timeline-card {
  color: #f7f5ff;
  border-color: rgba(145, 112, 240, 0.28);
  background:
    linear-gradient(145deg, rgba(19, 15, 52, 0.98), rgba(10, 8, 34, 0.98));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.24);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-name-row h1,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-meta-item strong,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-section-title h2,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-result-head strong,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-detail strong,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header h2,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell strong {
  color: #f8f6ff;
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-meta-item small,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-stats small,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-section-title p,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-fields label > span,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields label > span,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-note-label > span,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-result-head small,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-detail small,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header p,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell small {
  color: #aaa4c0;
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-divider,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-result-head,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-detail,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-header,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-column-headings,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row {
  border-color: rgba(145, 112, 240, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-meta-icon,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-section-title > span,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell-icon {
  color: #b994ff;
  border-color: rgba(145, 112, 240, 0.24);
  background: rgba(117, 71, 255, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-fields select,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields input,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-note-label textarea {
  color: #f8f6ff;
  border-color: rgba(145, 112, 240, 0.28);
  background-color: rgba(9, 7, 30, 0.86);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .current-lead-activity,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-column-headings {
  border-color: rgba(145, 112, 240, 0.20);
  background: rgba(9, 7, 31, 0.72);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row {
  background: rgba(12, 9, 38, 0.72);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row:hover {
  background: rgba(117, 71, 255, 0.10);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu > summary,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu > summary {
  color: #b994ff;
  border-color: rgba(145, 112, 240, 0.28);
  background: rgba(117, 71, 255, 0.13);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown {
  border-color: rgba(145, 112, 240, 0.28);
  background: #17113d;
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.42);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown button,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown button {
  color: #d3c4ff;
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown button:hover,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown button:hover {
  color: #ffffff;
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-menu-dropdown button.danger,
body.app-dark-mode:not(.leaderboard-page-active) :is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-dropdown button.danger {
  color: #ff788d;
}

@media (max-width: 1320px) {
  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-meta {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-layout {
    grid-template-columns: 66px minmax(0, 1fr);
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-divider,
  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-stats {
    grid-column: 2;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-divider {
    display: none;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-stats {
    min-width: 0;
    grid-template-columns: repeat(2, 120px);
  }
}

@media (max-width: 1040px) {
  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-work-grid {
    grid-template-columns: 1fr;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-column-headings {
    display: none;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) 40px;
    align-items: start;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-manual {
    grid-column: 1 / 3;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu {
    grid-column: 3;
    grid-row: 1;
  }
}

@media (max-width: 720px) {
  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-layout {
    grid-template-columns: 1fr;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-avatar {
    width: 58px;
    height: 58px;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-meta {
    grid-template-columns: 1fr;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-stats {
    grid-column: 1;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-log-fields,
  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-extra-fields {
    grid-template-columns: 1fr;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row {
    grid-template-columns: 1fr 38px;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-cell,
  :is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-manual {
    grid-column: 1;
  }

  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-row-actions-menu {
    grid-column: 2;
    grid-row: 1;
  }
}

/* ACCOUNT SELF-SERVICE SETTINGS */
.account-settings-card {
  display: grid;
  gap: 20px;
  margin: 0 0 18px;
  padding: 20px;
  border: 1px solid #e1e6ef;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}

.account-settings-heading {
  display: flex;
  align-items: center;
  gap: 12px;
}

.account-settings-heading h3,
.account-password-section h4 {
  margin: 0;
  color: #172033;
}

.account-settings-heading p,
.account-password-section p {
  margin: 4px 0 0;
  color: #718096;
  font-size: 12px;
}

.account-settings-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: #6d35f5;
  border-radius: 13px;
  background: #f0ebff;
}

.account-settings-icon svg {
  width: 20px;
  height: 20px;
}

.account-settings-grid,
.account-password-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: 12px;
  align-items: end;
}

.account-settings-card label {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.account-settings-card label > span {
  color: #536176;
  font-size: 11px;
  font-weight: 800;
}

.account-settings-card input,
.account-settings-card select {
  width: 100%;
  min-height: 40px;
  padding: 0 11px;
  color: #172033;
  border: 1px solid #dce2ec;
  border-radius: 10px;
  background: #ffffff;
}

.account-settings-card input[readonly] {
  color: #68758a;
  background: #f7f9fc;
}

.account-language-action,
.account-password-action {
  display: flex;
  align-items: end;
}

.account-language-action button,
.account-password-action button {
  min-height: 40px;
  white-space: nowrap;
}

.account-password-section {
  display: grid;
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid #e6eaf1;
}

body:not(.app-dark-mode) .admin-settings-only.hidden,
.admin-settings-only.hidden {
  display: none !important;
}

body.app-dark-mode:not(.leaderboard-page-active) .account-settings-card {
  color: #f7f5ff;
  border-color: rgba(145, 112, 240, 0.28);
  background: linear-gradient(145deg, rgba(19, 15, 52, 0.98), rgba(10, 8, 34, 0.98));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.24);
}

body.app-dark-mode:not(.leaderboard-page-active) .account-settings-heading h3,
body.app-dark-mode:not(.leaderboard-page-active) .account-password-section h4 {
  color: #ffffff;
}

body.app-dark-mode:not(.leaderboard-page-active) .account-settings-heading p,
body.app-dark-mode:not(.leaderboard-page-active) .account-password-section p,
body.app-dark-mode:not(.leaderboard-page-active) .account-settings-card label > span {
  color: #b9b2d6;
}

body.app-dark-mode:not(.leaderboard-page-active) .account-settings-icon {
  color: #b596ff;
  background: rgba(117, 71, 255, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .account-settings-card input,
body.app-dark-mode:not(.leaderboard-page-active) .account-settings-card select {
  color: #f7f5ff;
  border-color: rgba(145, 112, 240, 0.30);
  background: rgba(10, 8, 34, 0.86);
}

body.app-dark-mode:not(.leaderboard-page-active) .account-settings-card input[readonly] {
  color: #aaa3c4;
  background: rgba(18, 14, 48, 0.70);
}

body.app-dark-mode:not(.leaderboard-page-active) .account-password-section {
  border-color: rgba(145, 112, 240, 0.22);
}

/* Long manual notes must wrap inside the Activity Timeline. */
:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-manual,
:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-manual > div {
  min-width: 0;
  max-width: 100%;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-manual strong {
  display: block;
  max-width: 100%;
  overflow: visible;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
  text-overflow: clip;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-note-row,
:is(#leadDetailPage, #sharedLeadDetailPage) .timeline-column-headings {
  grid-template-columns:
    minmax(120px, 145px)
    minmax(100px, 125px)
    minmax(115px, 145px)
    minmax(160px, 1fr)
    minmax(180px, 1.35fr)
    42px;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-timeline-card,
:is(#leadDetailPage, #sharedLeadDetailPage) .lead-timeline-list {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

@media (max-width: 1200px) {
  .account-settings-grid,
  .account-password-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-language-action,
  .account-password-action {
    align-items: stretch;
  }

  .account-language-action button,
  .account-password-action button {
    width: 100%;
  }
}

@media (max-width: 720px) {
  .account-settings-grid,
  .account-password-grid {
    grid-template-columns: 1fr;
  }
}

/* SETTINGS CENTER */
#settingsPage {
  padding-bottom: 24px;
}

.settings-center {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.settings-center-nav,
.settings-panel-card {
  border: 1px solid rgba(122, 92, 220, 0.24);
  border-radius: 18px;
  background: var(--panel);
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.08);
}

.settings-center-nav {
  position: sticky;
  top: 0;
  display: grid;
  gap: 6px;
  padding: 14px;
}

.settings-tab-button {
  width: 100%;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  color: var(--text);
  text-align: left;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  box-shadow: none;
}

.settings-tab-button:hover {
  opacity: 1;
  transform: none;
  color: var(--text);
  border-color: rgba(109, 53, 245, 0.20);
  background: rgba(109, 53, 245, 0.06);
}

.settings-tab-button.active {
  color: #ffffff;
  border-color: rgba(139, 92, 246, 0.32);
  background: linear-gradient(135deg, #5f2eea, #4323ad);
  box-shadow: 0 10px 24px rgba(91, 45, 218, 0.25);
}

.settings-tab-button > span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: rgba(109, 53, 245, 0.10);
}

.settings-tab-button.active > span {
  background: rgba(255, 255, 255, 0.14);
}

.settings-tab-button svg {
  width: 19px;
  height: 19px;
}

.settings-tab-button strong,
.settings-tab-button small {
  display: block;
  min-width: 0;
}

.settings-tab-button strong {
  margin-bottom: 3px;
  font-size: 13px;
}

.settings-tab-button small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.25;
}

.settings-tab-button.active small {
  color: rgba(255, 255, 255, 0.72);
}

.settings-center-content,
.settings-panel {
  min-width: 0;
}

.settings-panel {
  display: none;
}

.settings-panel.active {
  display: block;
  animation: softFade 0.16s ease;
}

.settings-panel-card {
  min-height: 300px;
  padding: 20px;
}

.settings-panel-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 20px;
}

.settings-panel-heading h2,
.settings-panel-heading p {
  margin: 0;
}

.settings-panel-heading h2 {
  color: var(--text);
  font-size: 18px;
}

.settings-panel-heading p {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
}

.settings-profile-layout {
  display: grid;
  grid-template-columns: 165px minmax(0, 1fr);
  gap: 26px;
}

.settings-profile-avatar-wrap {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 9px;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}

.settings-profile-avatar-wrap > span {
  justify-self: start;
  color: var(--text);
  font-weight: 800;
}

.settings-profile-avatar {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  color: #ffffff;
  font-size: 26px;
  font-weight: 900;
  border: 3px solid rgba(255, 255, 255, 0.18);
  border-radius: 50%;
  background: linear-gradient(135deg, #7c3aed, #4f46e5);
  box-shadow: 0 12px 28px rgba(79, 70, 229, 0.30);
}

.settings-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.settings-form-grid .full-width {
  grid-column: 1 / -1;
}

.settings-form-grid label,
.settings-preference-item {
  min-width: 0;
}

.settings-form-grid label {
  display: grid;
  gap: 7px;
}

.settings-form-grid label > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.settings-form-grid input,
.settings-form-grid select,
.settings-preference-item select {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.settings-form-grid input[readonly] {
  color: var(--muted);
  background: var(--panel-soft);
}

.settings-preference-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.settings-preference-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) minmax(150px, 210px);
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-soft);
}

.settings-preference-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: #8b5cf6;
  border-radius: 13px;
  background: rgba(109, 53, 245, 0.12);
}

.settings-preference-icon svg {
  width: 20px;
  height: 20px;
}

.settings-preference-item strong,
.settings-preference-item small {
  display: block;
}

.settings-preference-item strong {
  color: var(--text);
  font-size: 13px;
}

.settings-preference-item small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.settings-toggle-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-soft);
}

.settings-toggle-row strong,
.settings-toggle-row small {
  display: block;
}

.settings-toggle-row strong {
  color: var(--text);
}

.settings-toggle-row small {
  margin-top: 4px;
  color: var(--muted);
}

.settings-switch {
  position: relative;
  width: 50px;
  height: 28px;
}

.settings-switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.settings-switch i {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: #6b7280;
  transition: 0.18s ease;
}

.settings-switch i::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ffffff;
  transition: 0.18s ease;
}

.settings-switch input:checked + i {
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
}

.settings-switch input:checked + i::after {
  transform: translateX(22px);
}

.settings-information-list {
  display: grid;
  gap: 12px;
}

.settings-information-list article,
.settings-device-row,
.settings-about-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-soft);
}

.settings-information-list article > svg,
.settings-device-row > span,
.settings-about-card > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: #8b5cf6;
  border-radius: 12px;
  background: rgba(109, 53, 245, 0.12);
}

.settings-information-list article > svg {
  padding: 10px;
}

.settings-information-list strong,
.settings-information-list p,
.settings-device-row strong,
.settings-device-row small,
.settings-about-card strong,
.settings-about-card p,
.settings-about-card small {
  display: block;
  margin: 0;
}

.settings-information-list p,
.settings-device-row small,
.settings-about-card p,
.settings-about-card small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
}

.settings-device-row em {
  color: #22c55e;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.settings-empty-state {
  min-height: 240px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 10px;
  color: var(--muted);
  text-align: center;
}

.settings-empty-state > span {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  color: #8b5cf6;
  border-radius: 18px;
  background: rgba(109, 53, 245, 0.12);
}

.settings-empty-state strong {
  color: var(--text);
}

.settings-empty-state p {
  max-width: 420px;
  margin: 0;
  font-size: 12px;
}

.settings-about-card {
  grid-template-columns: 54px minmax(0, 1fr);
}

.settings-about-card > span {
  width: 54px;
  height: 54px;
}

body.app-dark-mode:not(.leaderboard-page-active) .settings-center-nav,
body.app-dark-mode:not(.leaderboard-page-active) .settings-panel-card {
  color: #f7f5ff;
  border-color: rgba(139, 92, 246, 0.24);
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.09), transparent 30%),
    linear-gradient(145deg, rgba(18, 14, 48, 0.98), rgba(8, 7, 28, 0.98));
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.28);
}

body.app-dark-mode:not(.leaderboard-page-active) .settings-tab-button,
body.app-dark-mode:not(.leaderboard-page-active) .settings-panel-heading h2,
body.app-dark-mode:not(.leaderboard-page-active) .settings-profile-avatar-wrap > span,
body.app-dark-mode:not(.leaderboard-page-active) .settings-preference-item strong,
body.app-dark-mode:not(.leaderboard-page-active) .settings-toggle-row strong,
body.app-dark-mode:not(.leaderboard-page-active) .settings-information-list strong,
body.app-dark-mode:not(.leaderboard-page-active) .settings-device-row strong,
body.app-dark-mode:not(.leaderboard-page-active) .settings-about-card strong,
body.app-dark-mode:not(.leaderboard-page-active) .settings-empty-state strong {
  color: #ffffff;
}

body.app-dark-mode:not(.leaderboard-page-active) .settings-tab-button small,
body.app-dark-mode:not(.leaderboard-page-active) .settings-panel-heading p,
body.app-dark-mode:not(.leaderboard-page-active) .settings-form-grid label > span,
body.app-dark-mode:not(.leaderboard-page-active) .settings-profile-avatar-wrap,
body.app-dark-mode:not(.leaderboard-page-active) .settings-preference-item small,
body.app-dark-mode:not(.leaderboard-page-active) .settings-toggle-row small,
body.app-dark-mode:not(.leaderboard-page-active) .settings-information-list p,
body.app-dark-mode:not(.leaderboard-page-active) .settings-device-row small,
body.app-dark-mode:not(.leaderboard-page-active) .settings-about-card p,
body.app-dark-mode:not(.leaderboard-page-active) .settings-about-card small {
  color: #aaa3c4;
}

body.app-dark-mode:not(.leaderboard-page-active) .settings-preference-item,
body.app-dark-mode:not(.leaderboard-page-active) .settings-toggle-row,
body.app-dark-mode:not(.leaderboard-page-active) .settings-information-list article,
body.app-dark-mode:not(.leaderboard-page-active) .settings-device-row,
body.app-dark-mode:not(.leaderboard-page-active) .settings-about-card {
  border-color: rgba(139, 92, 246, 0.18);
  background: rgba(8, 7, 28, 0.52);
}

body.app-dark-mode:not(.leaderboard-page-active) .settings-form-grid input,
body.app-dark-mode:not(.leaderboard-page-active) .settings-form-grid select,
body.app-dark-mode:not(.leaderboard-page-active) .settings-preference-item select {
  color: #ffffff;
  border-color: rgba(139, 92, 246, 0.28);
  background: rgba(8, 7, 28, 0.88);
}

body.app-dark-mode:not(.leaderboard-page-active) .settings-form-grid input[readonly] {
  color: #aaa3c4;
  background: rgba(18, 14, 48, 0.70);
}

body.app-density-compact .settings-panel-card {
  padding: 15px;
}

body.app-density-compact .settings-tab-button,
body.app-density-compact .settings-preference-item,
body.app-density-compact .settings-toggle-row {
  padding: 9px;
}

@media (max-width: 1100px) {
  .settings-center {
    grid-template-columns: 230px minmax(0, 1fr);
  }

  .settings-preference-grid {
    grid-template-columns: 1fr;
  }

  .settings-preference-item {
    grid-template-columns: 42px minmax(0, 1fr) minmax(135px, 180px);
  }
}

@media (max-width: 820px) {
  .settings-center {
    grid-template-columns: 1fr;
  }

  .settings-center-nav {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .settings-profile-layout,
  .settings-form-grid {
    grid-template-columns: 1fr;
  }

  .settings-profile-avatar-wrap {
    justify-items: start;
  }

  .settings-profile-avatar-wrap small {
    text-align: left;
  }
}

@media (max-width: 560px) {
  .settings-center-nav {
    grid-template-columns: 1fr;
  }

  .settings-panel-heading {
    display: grid;
  }

  .settings-panel-heading button {
    width: 100%;
  }

  .settings-preference-item {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .settings-preference-item select {
    grid-column: 1 / -1;
  }
}

/* DASHBOARD COACH */
#dashboardPage > .dashboard-coach-card {
  position: relative;
  min-width: 0;
  margin-bottom: 16px;
  overflow: hidden;
  color: #ffffff;
  border: 1px solid rgba(139, 92, 246, 0.48);
  border-radius: 18px;
  background:
    radial-gradient(circle at 88% 0%, rgba(124, 58, 237, 0.30), transparent 34%),
    linear-gradient(145deg, #20133f 0%, #17102f 48%, #100c26 100%);
  box-shadow: 0 16px 38px rgba(6, 4, 24, 0.22);
}

.dashboard-coach-header {
  min-height: 78px;
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding: 15px 18px 13px;
  border-bottom: 1px solid rgba(139, 92, 246, 0.26);
}

.dashboard-coach-title-wrap {
  min-width: 0;
  display: flex;
  gap: 12px;
  align-items: center;
}

.dashboard-coach-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: grid;
  place-items: center;
  color: #ffffff;
  border-radius: 13px;
  background: linear-gradient(135deg, #8b5cf6, #5b35e8);
  box-shadow: 0 9px 22px rgba(109, 53, 245, 0.34);
}

.dashboard-coach-icon svg {
  width: 21px;
  height: 21px;
}

.dashboard-coach-title-line {
  display: flex;
  gap: 9px;
  align-items: center;
}

.dashboard-coach-title-line h2,
.dashboard-coach-title-wrap p {
  margin: 0;
}

.dashboard-coach-title-line h2 {
  color: #ffffff;
  font-size: 20px;
  line-height: 1.05;
}

.dashboard-coach-title-line > span {
  padding: 3px 7px;
  color: #ffffff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.04em;
  border-radius: 5px;
  background: linear-gradient(135deg, #7c3aed, #5b35e8);
}

.dashboard-coach-title-wrap p {
  margin-top: 5px;
  color: #b9b0d3;
  font-size: 10px;
}

.dashboard-coach-trophy {
  width: 74px;
  height: 52px;
  flex: 0 0 74px;
  display: grid;
  place-items: center;
  color: #facc15;
}

.dashboard-coach-trophy svg {
  width: 48px;
  height: 48px;
  filter: drop-shadow(0 7px 14px rgba(250, 204, 21, 0.24));
}

.dashboard-coach-columns {
  display: grid;
  grid-template-columns: 1fr 1fr 0.95fr;
}

.dashboard-coach-column {
  min-width: 0;
  padding: 14px 16px 15px;
  border-right: 1px solid rgba(139, 92, 246, 0.22);
}

.dashboard-coach-column:last-child {
  border-right: 0;
}

.dashboard-coach-column h3 {
  display: flex;
  gap: 7px;
  align-items: center;
  margin: 0 0 11px;
  font-size: 11px;
  line-height: 1.2;
}

.dashboard-coach-column h3 svg {
  width: 14px;
  height: 14px;
}

.dashboard-coach-column.improved h3 {
  color: #32d66b;
}

.dashboard-coach-column.improvement h3 {
  color: #fbbf24;
}

.dashboard-coach-column.advice h3 {
  color: #60a5fa;
}

.dashboard-coach-list {
  display: grid;
  gap: 10px;
}

.dashboard-coach-item {
  display: grid;
  grid-template-columns: 17px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}

.dashboard-coach-item > i {
  width: 17px;
  height: 17px;
  display: grid;
  place-items: center;
  margin-top: 1px;
  color: #ffffff;
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  border-radius: 50%;
}

.dashboard-coach-column.improved .dashboard-coach-item > i {
  background: #22c55e;
}

.dashboard-coach-column.improvement .dashboard-coach-item > i {
  color: #261a00;
  border-radius: 4px;
  background: #fbbf24;
}

.dashboard-coach-item strong,
.dashboard-coach-item small {
  display: block;
  overflow-wrap: anywhere;
}

.dashboard-coach-item strong {
  color: #f8f7ff;
  font-size: 10px;
  line-height: 1.3;
}

.dashboard-coach-item small {
  margin-top: 2px;
  color: #aaa4c1;
  font-size: 9px;
  line-height: 1.38;
}

.dashboard-coach-column blockquote {
  margin: 0;
  color: #e5e1f2;
  font-size: 10px;
  line-height: 1.6;
}

.dashboard-coach-column.advice > strong {
  display: block;
  margin-top: 13px;
  color: #a78bfa;
  font-size: 10px;
  line-height: 1.35;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .dashboard-coach-columns {
    grid-template-columns: 1fr;
  }

  .dashboard-coach-column {
    border-right: 0;
    border-bottom: 1px solid rgba(139, 92, 246, 0.22);
  }

  .dashboard-coach-column:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 620px) {
  .dashboard-coach-trophy {
    display: none;
  }
}

/* MONTHLY GOAL COMPLETED STATE */
.monthly-goal-card.monthly-goal-completed {
  position: relative;
  overflow: hidden;
  border-color: rgba(250, 204, 21, 0.72);
  background:
    radial-gradient(circle at 88% 12%, rgba(250, 204, 21, 0.18), transparent 28%),
    radial-gradient(circle at 12% 100%, rgba(34, 197, 94, 0.13), transparent 34%),
    linear-gradient(145deg, #211742 0%, #17102f 48%, #100c26 100%);
  box-shadow:
    0 0 0 1px rgba(250, 204, 21, 0.12),
    0 18px 42px rgba(250, 204, 21, 0.12);
}

.monthly-goal-card.monthly-goal-completed::before {
  content: "";
  position: absolute;
  inset: -35%;
  pointer-events: none;
  background:
    conic-gradient(
      from 0deg,
      transparent 0deg,
      rgba(250, 204, 21, 0.08) 24deg,
      transparent 48deg,
      rgba(34, 197, 94, 0.07) 72deg,
      transparent 96deg
    );
  animation: monthlyGoalVictorySpin 16s linear infinite;
}

.monthly-goal-card.monthly-goal-completed > * {
  position: relative;
  z-index: 1;
}

.monthly-goal-card.monthly-goal-completed .monthly-goal-icon,
.monthly-goal-card.monthly-goal-completed .monthly-goal-progress-ring {
  animation: monthlyGoalVictoryPulse 2.2s ease-in-out infinite;
}

.monthly-goal-card.monthly-goal-completed .monthly-goal-progress-ring {
  background:
    radial-gradient(circle at center, #17102f 56%, transparent 58%),
    conic-gradient(#facc15 0deg, #22c55e 360deg);
  box-shadow:
    0 0 0 6px rgba(250, 204, 21, 0.08),
    0 0 24px rgba(250, 204, 21, 0.24);
}

.monthly-goal-completed-banner {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin: 0 18px 16px;
  padding: 12px 14px;
  color: #fffbea;
  border: 1px solid rgba(250, 204, 21, 0.38);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(126, 82, 8, 0.38), rgba(22, 101, 52, 0.24));
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16);
}

.monthly-goal-completed-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: #facc15;
  border-radius: 13px;
  background: rgba(250, 204, 21, 0.12);
}

.monthly-goal-completed-icon svg {
  width: 22px;
  height: 22px;
}

.monthly-goal-completed-banner strong,
.monthly-goal-completed-banner small {
  display: block;
}

.monthly-goal-completed-banner strong {
  color: #ffffff;
  font-size: 13px;
}

.monthly-goal-completed-banner small {
  margin-top: 3px;
  color: #ded8bd;
  font-size: 10px;
}

.monthly-goal-completed-stars {
  color: #facc15;
  font-size: 16px;
  letter-spacing: 0.12em;
  animation: monthlyGoalStarsGlow 1.8s ease-in-out infinite;
}

/* FULL-SCREEN FIREWORKS */
.monthly-goal-celebration-layer {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at center, rgba(35, 20, 74, 0.28), rgba(2, 3, 18, 0.16) 46%, rgba(2, 3, 18, 0.50)) !important;
  isolation: isolate;
}

.monthly-goal-fireworks-canvas {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
}

.monthly-goal-live-message {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  width: min(760px, calc(100vw - 36px));
  padding: 30px 28px 32px;
  color: #ffffff;
  text-align: center;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(250, 204, 21, 0.62);
  border-radius: 30px;
  background:
    radial-gradient(circle at 50% 0%, rgba(250, 204, 21, 0.28), transparent 35%),
    linear-gradient(145deg, rgba(40, 22, 78, 0.95), rgba(13, 9, 35, 0.96));
  box-shadow:
    0 0 0 1px rgba(250, 204, 21, 0.15),
    0 35px 110px rgba(0, 0, 0, 0.72),
    0 0 90px rgba(124, 58, 237, 0.30);
  backdrop-filter: blur(12px);
  animation: monthlyGoalLiveEntrance 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}

.monthly-goal-live-trophy {
  width: 112px;
  height: 112px;
  display: grid;
  place-items: center;
  margin: -78px auto 12px;
  color: #facc15;
  border: 2px solid rgba(250, 204, 21, 0.62);
  border-radius: 34px;
  background:
    radial-gradient(circle, rgba(250, 204, 21, 0.24), rgba(124, 58, 237, 0.20));
  box-shadow:
    0 0 46px rgba(250, 204, 21, 0.48),
    inset 0 0 30px rgba(250, 204, 21, 0.14);
  animation: monthlyGoalLiveTrophy 1.2s ease-in-out infinite;
}

.monthly-goal-live-trophy svg {
  width: 66px;
  height: 66px;
  stroke-width: 2.1;
}

.monthly-goal-live-eyebrow {
  margin: 10px 0 5px;
  color: #c4b5fd;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.monthly-goal-live-message h2 {
  margin: 0;
  color: #ffffff;
  font-size: clamp(42px, 6vw, 78px);
  font-weight: 1000;
  line-height: 0.98;
  letter-spacing: -0.055em;
  text-shadow:
    0 5px 0 rgba(146, 64, 14, 0.55),
    0 10px 34px rgba(250, 204, 21, 0.46);
}

.monthly-goal-live-message > strong {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 18px auto 0;
  padding: 10px 22px;
  color: #ffffff;
  font-size: clamp(15px, 2vw, 22px);
  border-radius: 999px;
  background: linear-gradient(135deg, #6d28d9, #4c1d95);
  box-shadow: 0 10px 32px rgba(91, 33, 182, 0.38);
}

.monthly-goal-live-message > p:not(.monthly-goal-live-eyebrow) {
  margin: 16px 0 0;
  color: #f7f3ff;
  font-size: clamp(16px, 2vw, 23px);
}

.monthly-goal-live-stars {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
  color: #facc15;
  font-size: 29px;
}

.monthly-goal-live-stars span {
  animation: monthlyGoalLiveStar 0.9s ease-in-out infinite alternate;
}

.monthly-goal-live-stars span:nth-child(2) {
  animation-delay: 0.12s;
}

.monthly-goal-live-stars span:nth-child(3) {
  animation-delay: 0.24s;
}

.monthly-goal-live-stars span:nth-child(4) {
  animation-delay: 0.36s;
}

.monthly-goal-live-stars span:nth-child(5) {
  animation-delay: 0.48s;
}

@keyframes monthlyGoalVictorySpin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes monthlyGoalVictoryPulse {
  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.08);
  }
}

@keyframes monthlyGoalStarsGlow {
  0%,
  100% {
    opacity: 0.55;
    transform: translateY(0);
  }

  50% {
    opacity: 1;
    transform: translateY(-2px);
  }
}

@keyframes monthlyGoalLiveEntrance {
  from {
    opacity: 0;
    transform: translate(-50%, -44%) scale(0.68);
  }

  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes monthlyGoalLiveTrophy {
  0%,
  100% {
    transform: translateY(0) rotate(-2deg) scale(1);
  }

  50% {
    transform: translateY(-8px) rotate(2deg) scale(1.05);
  }
}

@keyframes monthlyGoalLiveStar {
  from {
    opacity: 0.45;
    transform: translateY(3px) scale(0.86);
  }

  to {
    opacity: 1;
    transform: translateY(-3px) scale(1.12);
  }
}

@media (max-width: 620px) {
  .monthly-goal-completed-banner {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .monthly-goal-completed-stars {
    display: none;
  }

  .monthly-goal-live-message {
    padding: 24px 16px 24px;
  }

  .monthly-goal-live-trophy {
    width: 88px;
    height: 88px;
    margin-top: -64px;
    border-radius: 27px;
  }

  .monthly-goal-live-trophy svg {
    width: 52px;
    height: 52px;
  }

  .monthly-goal-live-stars {
    gap: 6px;
    font-size: 22px;
  }
}



/* REMOVE COMPLETED-GOAL DIAGONAL SWEEP */
.monthly-goal-card.monthly-goal-completed::before {
  content: none !important;
  display: none !important;
  animation: none !important;
}

/* HIERARCHY AND LEADERBOARD SCOPE */
.leaderboard-scope-control {
  display: grid;
  gap: 6px;
  min-width: 150px;
}

.leaderboard-scope-control > label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.user-hierarchy-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 5px;
}

.user-hierarchy-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-soft);
}

.user-hierarchy-chip.role {
  color: #8b5cf6;
  border-color: rgba(139, 92, 246, 0.24);
  background: rgba(139, 92, 246, 0.08);
}

body.app-dark-mode:not(.leaderboard-page-active) .user-hierarchy-chip {
  color: #bdb6d5;
  border-color: rgba(139, 92, 246, 0.18);
  background: rgba(255, 255, 255, 0.04);
}



/* LEADERBOARD FILTER ALIGNMENT */
body.leaderboard-page-active .leaderboard-hero-row {
  display: block;
}

body.leaderboard-page-active .leaderboard-summary-grid {
  width: 100%;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.leaderboard-page-active .leaderboard-filters-row {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 12px;
  width: 100%;
  margin-top: 16px;
}

body.leaderboard-page-active
  .leaderboard-filters-row
  .leaderboard-period-control,
body.leaderboard-page-active
  .leaderboard-filters-row
  .leaderboard-scope-control {
  min-width: 0;
}

body.leaderboard-page-active
  .leaderboard-filters-row
  .leaderboard-scope-control {
  width: 170px;
}

body.leaderboard-page-active .leaderboard-summary-copy {
  min-width: 0;
  overflow: visible;
}

body.leaderboard-page-active .leaderboard-summary-copy strong {
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
  font-size: clamp(22px, 1.7vw, 29px);
  font-variant-numeric: tabular-nums;
}

@media (max-width: 1400px) {
  body.leaderboard-page-active .leaderboard-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  body.leaderboard-page-active .leaderboard-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  body.leaderboard-page-active .leaderboard-summary-grid {
    grid-template-columns: 1fr;
  }

  body.leaderboard-page-active .leaderboard-filters-row {
    align-items: stretch;
    flex-direction: column;
  }

  body.leaderboard-page-active
    .leaderboard-filters-row
    .leaderboard-scope-control {
    width: 100%;
  }
}


/* INVITES, MANUAL AGENTS, AND LEADERBOARD AVATARS */
.invite-registration-card {
  width: min(520px, calc(100vw - 30px));
}

.invite-registration-name-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.secondary-login-button {
  margin-top: 8px;
  color: #6d35f5;
  border: 1px solid rgba(109, 53, 245, 0.25);
  background: transparent;
  box-shadow: none;
}

.invite-link-output-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
}

.invite-help-list {
  margin-top: 18px;
}

.manual-agent-management-card {
  margin-top: 18px;
}

.compact-heading {
  margin-bottom: 12px;
}

.manual-agent-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(170px, 0.8fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-soft);
}

.manual-agent-row + .manual-agent-row {
  margin-top: 8px;
}

.manual-agent-row strong,
.manual-agent-row small {
  display: block;
}

.manual-agent-row small {
  margin-top: 3px;
  color: var(--muted);
}

.leaderboard-agent-avatar,
.leaderboard-table-avatar {
  flex: 0 0 auto !important;
  aspect-ratio: 1 / 1 !important;
  min-width: 0;
  line-height: 1;
}

.leaderboard-podium-card.rank-3 .leaderboard-agent-avatar {
  width: 62px !important;
  height: 62px !important;
  border-radius: 50% !important;
}

@media (max-width: 620px) {
  .invite-registration-name-grid,
  .manual-agent-row,
  .invite-link-output-row {
    grid-template-columns: 1fr;
  }
}


/* LEADERBOARD THIRD-PLACE METRICS FIX */
body.leaderboard-page-active .leaderboard-podium-card.rank-3 {
  height: 258px !important;
  min-height: 258px !important;
  padding: 34px 24px 20px !important;
}

body.leaderboard-page-active
  .leaderboard-podium-card.rank-3
  .leaderboard-agent-metrics {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex: 0 0 auto !important;
  margin-top: 4px !important;
  padding-top: 14px !important;
}

body.leaderboard-page-active
  .leaderboard-podium-card.rank-3
  .leaderboard-agent-metrics span,
body.leaderboard-page-active
  .leaderboard-podium-card.rank-3
  .leaderboard-agent-metrics strong {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* COMPLETE USER EDITOR */
.user-editor-modal {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  place-items: center;
  padding: 22px;
}

.user-editor-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 3, 18, 0.74);
  backdrop-filter: blur(7px);
}

.user-editor-dialog {
  position: relative;
  width: min(760px, 100%);
  max-height: calc(100vh - 44px);
  overflow-y: auto;
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--panel);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.48);
}

.user-editor-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 22px 24px 18px;
  border-bottom: 1px solid var(--line);
}

.user-editor-header p,
.user-editor-header h2,
.user-editor-header span {
  margin: 0;
}

.user-editor-header p {
  color: #7c3aed;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.14em;
}

.user-editor-header h2 {
  margin-top: 5px;
  font-size: 24px;
}

.user-editor-header span {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 11px;
}

.user-editor-close-button {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: grid;
  place-items: center;
  padding: 0;
  color: var(--muted);
  border: 1px solid var(--line);
  background: var(--panel-soft);
  box-shadow: none;
}

.user-editor-form {
  padding: 22px 24px 24px;
}

.user-editor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
}

.user-editor-grid label {
  display: grid;
  gap: 7px;
}

.user-editor-grid label > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.user-editor-grid input,
.user-editor-grid select {
  width: 100%;
}

.user-editor-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 22px;
}

body.app-dark-mode .user-editor-dialog {
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.12), transparent 30%),
    #0f0b27;
  border-color: rgba(139, 92, 246, 0.26);
}

@media (max-width: 680px) {
  .user-editor-grid {
    grid-template-columns: 1fr;
  }

  .user-editor-actions {
    flex-direction: column-reverse;
  }

  .user-editor-actions button {
    width: 100%;
  }
}


/* USER MANAGEMENT AND MANUAL AGENTS DARK-MODE FIX */
body.app-dark-mode .manual-agent-management-card {
  color: #f8f7ff;
  border-color: rgba(139, 92, 246, 0.24);
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.10), transparent 32%),
    #100c29;
}

body.app-dark-mode .manual-agent-row {
  color: #f8f7ff;
  border-color: rgba(139, 92, 246, 0.24);
  background: rgba(255, 255, 255, 0.045);
}

body.app-dark-mode .manual-agent-row strong {
  color: #ffffff;
}

body.app-dark-mode .manual-agent-row small {
  color: #aaa4c1;
}

body.app-dark-mode .manual-agent-row select {
  color: #ffffff;
  border-color: rgba(139, 92, 246, 0.30);
  background: #17112f;
}

body.app-dark-mode .manual-agent-row select option {
  color: #ffffff;
  background: #17112f;
}

body.app-dark-mode .manual-agent-row .mini-btn {
  color: #ffffff;
  border-color: rgba(139, 92, 246, 0.28);
  background: #2a1c58;
}

body.app-dark-mode .user-editor-dialog,
body.app-dark-mode .user-editor-form,
body.app-dark-mode .user-editor-header {
  color: #f8f7ff;
}

body.app-dark-mode .user-editor-grid input,
body.app-dark-mode .user-editor-grid select {
  color: #ffffff;
  border-color: rgba(139, 92, 246, 0.30);
  background: #17112f;
}

body.app-dark-mode .user-editor-grid select option {
  color: #ffffff;
  background: #17112f;
}


/* LEADERBOARD CUSTOM PERIOD PICKER */
.leaderboard-custom-period-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}

.leaderboard-custom-type-wrap {
  min-width: 154px;
}

.leaderboard-custom-value-wrap {
  min-width: 155px;
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--panel);
}

.leaderboard-custom-value-wrap svg {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
}

.leaderboard-custom-value-wrap input {
  min-width: 0;
  width: 100%;
  padding: 0;
  color: var(--text);
  border: 0;
  outline: 0;
  background: transparent;
}

body.leaderboard-page-active .leaderboard-custom-value-wrap {
  color: #b7afd1;
  border-color: rgba(139, 92, 246, 0.42);
  background: rgba(15, 10, 39, 0.84);
}

body.leaderboard-page-active .leaderboard-custom-value-wrap input {
  color: #ffffff;
  color-scheme: dark;
}

@media (max-width: 900px) {
  .leaderboard-custom-period-wrap {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
  }

  .leaderboard-custom-type-wrap,
  .leaderboard-custom-value-wrap {
    width: 100%;
  }
}


/* LEAD INTAKE DARK-MODE READABILITY */
body.app-dark-mode .lead-intake-card,
body.app-dark-mode .compact-lead-intake-card,
body.app-dark-mode .compact-intake-panel,
body.app-dark-mode .smart-routing-panel {
  color: #f8f7ff;
  border-color: rgba(139, 92, 246, 0.28);
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.08), transparent 32%),
    #110c2c;
}

body.app-dark-mode .lead-intake-card h2,
body.app-dark-mode .lead-intake-card h3,
body.app-dark-mode .lead-intake-card strong,
body.app-dark-mode .lead-intake-card .action-choice-title,
body.app-dark-mode .lead-intake-card .smart-routing-subtitle {
  color: #ffffff;
}

body.app-dark-mode .lead-intake-card p,
body.app-dark-mode .lead-intake-card small,
body.app-dark-mode .lead-intake-card .intake-label > span,
body.app-dark-mode .lead-intake-card .action-choice-help,
body.app-dark-mode .lead-intake-card .smart-route-row > span,
body.app-dark-mode .lead-intake-card .quick-note-character-count {
  color: #b9b2d0;
}

body.app-dark-mode .lead-intake-card input,
body.app-dark-mode .lead-intake-card select,
body.app-dark-mode .lead-intake-card textarea {
  color: #ffffff;
  border-color: rgba(139, 92, 246, 0.34);
  background: #17112f;
  color-scheme: dark;
}

body.app-dark-mode .lead-intake-card input::placeholder,
body.app-dark-mode .lead-intake-card textarea::placeholder {
  color: #77708f;
  opacity: 1;
}

body.app-dark-mode .lead-intake-card select option {
  color: #ffffff;
  background: #17112f;
}

body.app-dark-mode .lead-intake-card .action-choice {
  color: #f5f2ff;
  border-color: rgba(139, 92, 246, 0.28);
  background: rgba(255, 255, 255, 0.025);
}

body.app-dark-mode .lead-intake-card .action-choice:hover,
body.app-dark-mode .lead-intake-card .action-choice.active-choice {
  border-color: rgba(139, 92, 246, 0.72);
  background: rgba(109, 53, 245, 0.17);
}

body.app-dark-mode .lead-intake-card .smart-route-row {
  color: #f8f7ff;
  border-color: rgba(139, 92, 246, 0.28);
  background: rgba(255, 255, 255, 0.035);
}

body.app-dark-mode .lead-intake-card .smart-route-row strong {
  color: #7c5cff;
}

body.app-dark-mode .lead-intake-card .route-preview-note {
  color: #d4cfea;
}

body.app-dark-mode .lead-intake-card input[type="radio"] {
  accent-color: #7c3aed;
}

.next-attempt-delay-row {
  align-items: center;
}

.next-attempt-delay-heading {
  display: grid;
  gap: 3px;
}

.next-attempt-delay-heading > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.next-attempt-delay-heading > small {
  color: var(--muted);
  font-size: 9px;
}

.next-attempt-delay-control {
  position: relative;
  min-width: 138px;
}

.next-attempt-delay-control select {
  width: 100%;
  min-height: 36px;
  padding: 0 34px 0 11px;
  font-weight: 850;
  appearance: none;
}

.next-attempt-delay-control svg {
  position: absolute;
  top: 50%;
  right: 10px;
  width: 14px;
  height: 14px;
  pointer-events: none;
  transform: translateY(-50%);
}

body.app-dark-mode .next-attempt-delay-control select {
  color: #ffffff;
  border-color: rgba(124, 92, 255, 0.58);
  background: #21164a;
}

body.app-dark-mode .next-attempt-delay-control svg {
  color: #a78bfa;
}

@media (max-width: 620px) {
  .next-attempt-delay-row {
    align-items: stretch;
    flex-direction: column;
  }

  .next-attempt-delay-control {
    width: 100%;
  }
}


/* LEAD INTAKE SELECT AND NEXT-ATTEMPT FIX */
body.app-dark-mode #newLeadCallsMadeSelect,
body.app-dark-mode #newLeadCallResultSelect {
  color: #ffffff !important;
  border-color: rgba(139, 92, 246, 0.42) !important;
  background-color: #17112f !important;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 8L10 12L14 8' stroke='%23A78BFA' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #ffffff !important;
  color-scheme: dark;
}

body.app-dark-mode #newLeadCallsMadeSelect option,
body.app-dark-mode #newLeadCallResultSelect option {
  color: #ffffff !important;
  background: #17112f !important;
}

body.app-dark-mode #newLeadCallsMadeSelect:disabled,
body.app-dark-mode #newLeadCallResultSelect:disabled {
  color: #aaa4c1 !important;
  background-color: #141027 !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #aaa4c1 !important;
}

body.app-dark-mode
  #newLeadCallsMadeSelect:invalid,
body.app-dark-mode
  #newLeadCallResultSelect:invalid {
  color: #aaa4c1 !important;
  -webkit-text-fill-color: #aaa4c1 !important;
}

.next-attempt-delay-row.smart-route-row-stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  grid-template-areas: none;
  align-items: center;
  gap: 14px;
}

.next-attempt-delay-row.smart-route-row-stack
  .next-attempt-delay-heading {
  grid-area: auto;
  min-width: 0;
  align-content: center;
}

.next-attempt-delay-row.smart-route-row-stack
  .next-attempt-delay-heading > span,
.next-attempt-delay-row.smart-route-row-stack
  .next-attempt-delay-heading > small {
  grid-area: auto;
  display: block;
  position: static;
  margin: 0;
  transform: none;
  text-align: left;
}

.next-attempt-delay-row.smart-route-row-stack
  .next-attempt-delay-heading > span {
  color: #334155;
  font-size: 11px;
  font-weight: 850;
}

.next-attempt-delay-row.smart-route-row-stack
  .next-attempt-delay-heading > small {
  margin-top: 3px;
  color: #64748b;
  font-size: 10px;
  font-weight: 600;
}

.next-attempt-delay-row.smart-route-row-stack
  .next-attempt-delay-control {
  grid-area: auto;
  width: 150px;
  min-width: 150px;
}

body.app-dark-mode
  .next-attempt-delay-row.smart-route-row-stack
  .next-attempt-delay-heading > span {
  color: #ffffff;
}

body.app-dark-mode
  .next-attempt-delay-row.smart-route-row-stack
  .next-attempt-delay-heading > small {
  color: #aaa4c1;
}

body.app-dark-mode #newLeadBlockTwoDelaySelect {
  color: #ffffff !important;
  border: 1px solid rgba(124, 92, 255, 0.58) !important;
  background: #21164a !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #ffffff !important;
  color-scheme: dark;
}

body.app-dark-mode #newLeadBlockTwoDelaySelect option {
  color: #ffffff !important;
  background: #17112f !important;
}

@media (max-width: 620px) {
  .next-attempt-delay-row.smart-route-row-stack {
    grid-template-columns: 1fr;
  }

  .next-attempt-delay-row.smart-route-row-stack
    .next-attempt-delay-control {
    width: 100%;
    min-width: 0;
  }
}


/* LOGIN PAGE REDESIGN */
#loginScreen.login-screen {
  position: relative;
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(420px, 1fr) minmax(430px, 560px);
  gap: clamp(56px, 8vw, 130px);
  align-items: center;
  padding: clamp(40px, 6vw, 90px) clamp(36px, 8vw, 130px);
  overflow: hidden;
  color: #f8f7ff;
  background:
    radial-gradient(circle at 82% 10%, rgba(91, 33, 182, 0.20), transparent 25%),
    radial-gradient(circle at 18% 72%, rgba(76, 29, 149, 0.18), transparent 32%),
    linear-gradient(135deg, #07091d 0%, #090923 42%, #08071e 100%);
}

#loginScreen.login-screen::before,
#loginScreen.login-screen::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

#loginScreen.login-screen::before {
  inset: 0;
  opacity: 0.55;
  background-image:
    radial-gradient(circle at 9% 14%, rgba(139, 92, 246, 0.92) 0 1px, transparent 2px),
    radial-gradient(circle at 78% 7%, rgba(124, 58, 237, 0.72) 0 1px, transparent 2px),
    radial-gradient(circle at 91% 24%, rgba(168, 85, 247, 0.75) 0 1px, transparent 2px),
    radial-gradient(circle at 16% 84%, rgba(99, 102, 241, 0.82) 0 1px, transparent 2px),
    radial-gradient(circle at 67% 69%, rgba(139, 92, 246, 0.78) 0 1px, transparent 2px);
}

#loginScreen.login-screen::after {
  width: 470px;
  height: 470px;
  right: -190px;
  top: -180px;
  border-radius: 50%;
  border: 1px solid rgba(124, 58, 237, 0.13);
  box-shadow:
    0 0 0 80px rgba(124, 58, 237, 0.025),
    0 0 0 160px rgba(124, 58, 237, 0.018);
}

.login-showcase,
.login-access-card {
  position: relative;
  z-index: 1;
}

.login-showcase {
  max-width: 560px;
  align-self: center;
}

.login-showcase-brand {
  max-width: 480px;
}

.login-showcase-logo {
  width: 84px;
  height: 84px;
  display: grid;
  place-items: center;
  margin-bottom: 20px;
  color: #ffffff;
  font-size: 28px;
  font-weight: 950;
  border-radius: 18px;
  background: linear-gradient(145deg, #7c3aed, #4f27d8);
  box-shadow:
    0 18px 42px rgba(91, 33, 182, 0.36),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.login-showcase h1 {
  margin: 0;
  color: #f8f7ff;
  font-size: clamp(46px, 4.5vw, 68px);
  line-height: 0.98;
  letter-spacing: -0.055em;
}

.login-showcase h1 strong {
  color: #7c4dff;
  font-weight: inherit;
}

.login-showcase-brand > p {
  max-width: 470px;
  margin: 22px 0 0;
  color: #b8b6ca;
  font-size: clamp(17px, 1.5vw, 22px);
  line-height: 1.55;
}

.login-feature-list {
  display: grid;
  gap: 22px;
  margin-top: 46px;
}

.login-feature-list article {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}

.login-feature-list article > span {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  color: #9b6cff;
  border: 1px solid rgba(139, 92, 246, 0.22);
  border-radius: 13px;
  background:
    linear-gradient(145deg, rgba(124, 58, 237, 0.16), rgba(21, 17, 58, 0.76));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.login-feature-list article > span svg {
  width: 25px;
  height: 25px;
}

.login-feature-list strong,
.login-feature-list p {
  display: block;
  margin: 0;
}

.login-feature-list strong {
  color: #ffffff;
  font-size: 17px;
}

.login-feature-list p {
  margin-top: 5px;
  color: #9e9bb1;
  font-size: 14px;
}

.login-wave {
  position: absolute;
  left: -160px;
  bottom: -190px;
  width: 760px;
  height: 300px;
  opacity: 0.62;
  transform: rotate(-5deg);
  pointer-events: none;
}

.login-wave span {
  position: absolute;
  inset: 0;
  border-top: 2px solid rgba(124, 58, 237, 0.45);
  border-radius: 50%;
  transform: skewX(-28deg);
}

.login-wave span:nth-child(2) {
  top: 24px;
  opacity: 0.64;
}

.login-wave span:nth-child(3) {
  top: 48px;
  opacity: 0.38;
}

#loginScreen .login-access-card {
  width: 100%;
  max-width: 560px;
  margin: 0;
  padding: 48px 48px 42px;
  text-align: left;
  color: #f8f7ff;
  border: 1px solid rgba(139, 92, 246, 0.30);
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 0%, rgba(76, 29, 149, 0.13), transparent 34%),
    linear-gradient(145deg, rgba(11, 15, 46, 0.96), rgba(10, 12, 39, 0.94));
  box-shadow:
    0 30px 90px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.035);
  backdrop-filter: blur(14px);
}

.login-access-logo {
  width: 88px;
  height: 88px;
  display: grid;
  place-items: center;
  margin: 0 auto 28px;
  color: #ffffff;
  font-size: 29px;
  font-weight: 950;
  border: 2px solid #6d35f5;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 30%, rgba(124, 58, 237, 0.20), transparent 45%),
    #0b0e2a;
  box-shadow: 0 0 28px rgba(109, 53, 245, 0.14);
}

#loginScreen .login-access-card > h1 {
  margin: 0;
  color: #ffffff;
  text-align: center;
  font-size: 32px;
  letter-spacing: -0.035em;
}

#loginScreen .login-access-card > h1 + p {
  margin: 10px 0 34px;
  color: #aaa8bd;
  text-align: center;
  font-size: 15px;
}

.login-field {
  display: grid;
  gap: 9px;
  margin-top: 18px;
}

.login-field > span {
  color: #f8f7ff;
  font-size: 13px;
  font-weight: 800;
}

.login-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 58px;
  overflow: hidden;
  border: 1px solid rgba(139, 92, 246, 0.42);
  border-radius: 10px;
  background: rgba(10, 15, 48, 0.82);
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background 0.2s ease;
}

.login-input-wrap:focus-within {
  border-color: #8b5cf6;
  background: rgba(17, 20, 59, 0.96);
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.13);
}

.login-input-wrap > svg {
  width: 19px;
  height: 19px;
  margin-left: 19px;
  color: #a7a3ba;
  flex: 0 0 19px;
}

#loginScreen .login-input-wrap input {
  width: 100%;
  min-width: 0;
  height: 56px;
  padding: 0 16px;
  color: #ffffff;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
}

#loginScreen .login-input-wrap input::placeholder {
  color: #8f8ca2;
  opacity: 1;
}

.login-password-toggle {
  width: 48px;
  height: 56px;
  flex: 0 0 48px;
  display: grid;
  place-items: center;
  padding: 0;
  color: #aaa7bd;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.login-password-toggle:hover {
  color: #ffffff;
  background: rgba(124, 58, 237, 0.10);
}

.login-password-toggle svg {
  width: 19px;
  height: 19px;
}

.login-options-row {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  margin-top: 18px;
}

.login-remember-option {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  color: #b5b2c8;
  font-size: 13px;
  cursor: pointer;
}

.login-remember-option input {
  width: 17px;
  height: 17px;
  accent-color: #7c3aed;
}

.forgot-password-button {
  padding: 0;
  color: #9b6cff;
  font-size: 13px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.forgot-password-button:hover {
  color: #b794ff;
  text-decoration: underline;
}

#loginScreen .login-submit-button {
  width: 100%;
  min-height: 58px;
  display: flex;
  justify-content: center;
  gap: 10px;
  align-items: center;
  margin-top: 28px;
  color: #ffffff;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(135deg, #7242ff, #6435ee);
  box-shadow: 0 16px 34px rgba(91, 33, 182, 0.30);
}

#loginScreen .login-submit-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 38px rgba(91, 33, 182, 0.38);
}

.login-submit-button svg {
  width: 19px;
  height: 19px;
}

.login-error-text {
  min-height: 20px;
  margin: 12px 0 0;
  text-align: center;
}

.login-admin-help {
  margin: 28px 0 0;
  color: #aaa8bd;
  text-align: center;
  font-size: 13px;
}

.login-admin-help span {
  color: #9b6cff;
}

#loginScreen .invite-registration-card {
  position: relative;
  z-index: 2;
  grid-column: 1 / -1;
  justify-self: center;
}

@media (max-width: 1080px) {
  #loginScreen.login-screen {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 54px 28px;
  }

  .login-showcase {
    max-width: 620px;
    justify-self: center;
    text-align: center;
  }

  .login-showcase-brand,
  .login-showcase-brand > p {
    margin-left: auto;
    margin-right: auto;
  }

  .login-showcase-logo {
    margin-left: auto;
    margin-right: auto;
  }

  .login-feature-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    text-align: left;
  }

  #loginScreen .login-access-card {
    justify-self: center;
  }

  .login-wave {
    display: none;
  }
}

@media (max-width: 680px) {
  #loginScreen.login-screen {
    padding: 34px 16px;
  }

  .login-showcase h1 {
    font-size: 45px;
  }

  .login-feature-list {
    grid-template-columns: 1fr;
    margin-top: 34px;
  }

  #loginScreen .login-access-card {
    padding: 34px 22px 30px;
  }

  .login-options-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }
}


/* LOGIN PAGE PRECISION AND ICON FIX */
#loginScreen.login-screen {
  grid-template-columns: minmax(470px, 610px) minmax(500px, 575px);
  justify-content: center;
  column-gap: clamp(72px, 9vw, 150px);
  padding: 76px clamp(54px, 7vw, 118px);
}

#loginScreen .login-showcase {
  width: 100%;
  max-width: 590px;
  transform: translateY(-2px);
}

#loginScreen .login-showcase-brand {
  max-width: 500px;
}

#loginScreen .login-showcase-logo {
  width: 84px;
  height: 84px;
  margin-bottom: 22px;
  border-radius: 18px;
}

#loginScreen .login-showcase h1 {
  font-size: clamp(48px, 4vw, 64px);
  line-height: 1;
}

#loginScreen .login-showcase-brand > p {
  max-width: 485px;
  margin-top: 19px;
  font-size: 19px;
  line-height: 1.58;
}

#loginScreen .login-feature-list {
  gap: 23px;
  margin-top: 42px;
}

#loginScreen .login-feature-list article {
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 17px;
}

#loginScreen .login-feature-list article > span {
  width: 54px;
  height: 54px;
  border-radius: 13px;
}

#loginScreen .login-feature-list article > span svg {
  display: block;
  width: 25px;
  height: 25px;
  stroke: currentColor;
}

#loginScreen .login-feature-list strong {
  font-size: 16px;
}

#loginScreen .login-feature-list p {
  margin-top: 5px;
  font-size: 13px;
  line-height: 1.45;
}

#loginScreen .login-access-card {
  width: 575px;
  max-width: 100%;
  min-height: 690px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 44px 48px 38px;
  border-radius: 21px;
}

#loginScreen .login-access-logo {
  width: 88px;
  height: 88px;
  margin-bottom: 27px;
}

#loginScreen .login-access-card > h1 {
  font-size: 31px;
  line-height: 1.08;
}

#loginScreen .login-access-card > h1 + p {
  margin: 10px 0 30px;
  font-size: 15px;
}

#loginScreen .login-field {
  gap: 9px;
  margin-top: 17px;
}

#loginScreen .login-field > span {
  font-size: 13px;
}

#loginScreen .login-input-wrap {
  min-height: 58px;
  border-radius: 10px;
}

#loginScreen .login-input-wrap > svg {
  display: block;
  width: 19px;
  height: 19px;
  margin-left: 18px;
  stroke: currentColor;
}

#loginScreen .login-password-toggle {
  width: 52px !important;
  min-width: 52px !important;
  max-width: 52px !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 9px 9px 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#loginScreen .login-password-toggle svg {
  display: block;
  width: 19px;
  height: 19px;
  stroke: currentColor;
}

#loginScreen .login-options-row {
  min-height: 24px;
  margin-top: 18px;
}

#loginScreen .login-remember-option {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 9px;
  min-width: max-content;
  font-size: 13px;
  line-height: 1;
}

#loginScreen .login-remember-option input {
  flex: 0 0 17px;
  width: 17px;
  height: 17px;
  margin: 0;
}

#loginScreen .login-remember-option span {
  white-space: nowrap;
}

#loginScreen .forgot-password-button {
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 2px 0 !important;
  color: #9b6cff !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px !important;
  line-height: 1.2;
}

#loginScreen .login-submit-button {
  min-height: 58px;
  margin-top: 27px;
}

#loginScreen .login-submit-button svg {
  display: block;
  width: 19px;
  height: 19px;
  stroke: currentColor;
}

#loginScreen .login-error-text {
  min-height: 18px;
  margin-top: 10px;
}

#loginScreen .login-admin-help {
  margin-top: 18px;
  font-size: 13px;
}

@media (max-width: 1180px) {
  #loginScreen.login-screen {
    grid-template-columns: minmax(390px, 520px) minmax(440px, 540px);
    column-gap: 54px;
    padding: 54px 36px;
  }

  #loginScreen .login-access-card {
    width: 100%;
  }
}

@media (max-width: 980px) {
  #loginScreen.login-screen {
    grid-template-columns: 1fr;
    row-gap: 44px;
  }

  #loginScreen .login-showcase {
    justify-self: center;
  }

  #loginScreen .login-access-card {
    justify-self: center;
    width: min(575px, 100%);
  }
}

@media (max-width: 620px) {
  #loginScreen.login-screen {
    padding: 28px 15px;
  }

  #loginScreen .login-access-card {
    min-height: 0;
    padding: 34px 22px 30px;
  }

  #loginScreen .login-options-row {
    flex-direction: row;
    align-items: center;
  }
}


/* =========================================================
   GLOBAL RESPONSIVE LAYOUT
   ========================================================= */

html,
body {
  min-width: 0;
  overflow-x: hidden;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
svg,
canvas,
video {
  max-width: 100%;
}

input,
select,
textarea,
button {
  max-width: 100%;
}

#appScreen,
.app-shell,
.main-content,
.page,
.page-content,
.dashboard-page,
.leaderboard-page,
.agent-tracker-page,
.settings-page,
.leads-page,
.lead-detail-page {
  min-width: 0;
}

.main-content,
.page-content {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

@media (max-width: 1600px) {
  .main-content {
    padding-left: clamp(18px, 2vw, 28px);
    padding-right: clamp(18px, 2vw, 28px);
  }

  .dashboard-top-stats,
  .dashboard-stat-grid,
  .summary-grid,
  .leaderboard-summary-grid {
    gap: 12px;
  }

  .dashboard-layout,
  .dashboard-main-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.42fr);
  }

  .monthly-goal-card,
  .monthly-business-tracker,
  .performance-overview-card,
  .coach-card {
    min-width: 0;
  }

  .settings-shell,
  .settings-layout {
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  }
}

@media (max-width: 1366px) {
  .sidebar {
    width: 190px;
    min-width: 190px;
  }

  .main-content {
    margin-left: 190px;
  }

  .dashboard-top-stats,
  .dashboard-stat-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dashboard-layout,
  .dashboard-main-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .monthly-business-tracker {
    grid-column: 1;
  }

  .leaderboard-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .leaderboard-podium {
    padding-left: 18px;
    padding-right: 18px;
  }

  .tracker-table-wrap,
  .leaderboard-table-wrap,
  .users-table-wrap,
  .leads-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .tracker-table,
  .leaderboard-table,
  .users-table,
  .leads-table {
    min-width: 1040px;
  }
}

@media (max-width: 1100px) {
  .sidebar {
    position: fixed;
    z-index: 4000;
    width: 210px;
    min-width: 210px;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
  }

  body.sidebar-open .sidebar {
    transform: translateX(0);
  }

  .main-content {
    width: 100%;
    margin-left: 0;
    padding: 18px;
  }

  .mobile-menu-button,
  .sidebar-toggle-button {
    display: inline-flex;
  }

  .top-header,
  .page-header,
  .dashboard-header,
  .leaderboard-header,
  .settings-header {
    gap: 14px;
  }

  .dashboard-top-stats,
  .dashboard-stat-grid,
  .leaderboard-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .coach-content-grid,
  .coach-columns {
    grid-template-columns: 1fr;
  }

  .coach-column + .coach-column {
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .monthly-goal-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .monthly-goal-progress-ring {
    grid-column: 1 / -1;
    justify-self: center;
  }

  .performance-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .settings-shell,
  .settings-layout {
    grid-template-columns: 1fr;
  }

  .settings-navigation,
  .settings-sidebar {
    position: static;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 6px;
    border-right: 0;
    -webkit-overflow-scrolling: touch;
  }

  .settings-tab-button {
    flex: 0 0 auto;
    min-width: 190px;
  }

  .lead-detail-top-stats,
  .lead-summary-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lead-detail-main-grid,
  .lead-profile-main-grid,
  .compact-lead-intake-grid,
  .lead-intake-grid {
    grid-template-columns: 1fr;
  }

  .leaderboard-podium {
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: 12px;
  }

  .leaderboard-podium-card {
    width: 100% !important;
    min-width: 0 !important;
  }

  .leaderboard-podium-card.rank-1,
  .leaderboard-podium-card.rank-2,
  .leaderboard-podium-card.rank-3 {
    transform: none !important;
  }

  #loginScreen.login-screen {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 44px 24px;
  }

  #loginScreen .login-showcase,
  #loginScreen .login-access-card {
    width: min(590px, 100%);
    justify-self: center;
  }

  #loginScreen .login-showcase {
    text-align: center;
  }

  #loginScreen .login-showcase-logo,
  #loginScreen .login-showcase-brand > p {
    margin-left: auto;
    margin-right: auto;
  }

  #loginScreen .login-feature-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    text-align: left;
  }
}

@media (max-width: 820px) {
  .main-content {
    padding: 14px;
  }

  .page-header,
  .dashboard-header,
  .leaderboard-header,
  .settings-header,
  .tracker-header,
  .leads-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .header-actions,
  .top-header-actions,
  .leaderboard-filters-row,
  .tracker-period-controls {
    width: 100%;
    flex-wrap: wrap;
  }

  .dashboard-top-stats,
  .dashboard-stat-grid,
  .leaderboard-summary-grid,
  .performance-metric-grid,
  .lead-detail-top-stats,
  .lead-summary-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .monthly-goal-metrics {
    grid-template-columns: 1fr;
  }

  .monthly-goal-metric {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding-bottom: 12px;
  }

  .monthly-goal-metric:last-of-type {
    border-bottom: 0;
  }

  .leaderboard-podium {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .leaderboard-podium-card.rank-1 {
    order: 1;
  }

  .leaderboard-podium-card.rank-2 {
    order: 2;
  }

  .leaderboard-podium-card.rank-3 {
    order: 3;
  }

  .leaderboard-podium-card {
    min-height: 220px !important;
    height: auto !important;
  }

  .tracker-toolbar,
  .agents-toolbar,
  .leads-toolbar,
  .users-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .tracker-toolbar > *,
  .agents-toolbar > *,
  .leads-toolbar > *,
  .users-toolbar > * {
    width: 100%;
  }

  .settings-form-grid,
  .user-editor-grid,
  .invite-registration-name-grid,
  .manual-agent-row {
    grid-template-columns: 1fr;
  }

  .activity-timeline-table,
  .lead-activity-table {
    min-width: 880px;
  }

  .user-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .user-row-actions {
    width: 100%;
    flex-wrap: wrap;
  }

  .user-row-actions button {
    flex: 1 1 140px;
  }

  #loginScreen .login-feature-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .main-content {
    padding: 10px;
  }

  .page-title,
  .dashboard-title,
  .leaderboard-title,
  .settings-title {
    font-size: clamp(28px, 9vw, 38px);
    line-height: 1;
  }

  .dashboard-top-stats,
  .dashboard-stat-grid,
  .leaderboard-summary-grid,
  .performance-metric-grid,
  .lead-detail-top-stats,
  .lead-summary-stats {
    grid-template-columns: 1fr !important;
  }

  .dashboard-card,
  .monthly-goal-card,
  .monthly-business-tracker,
  .performance-overview-card,
  .coach-card,
  .leaderboard-section,
  .tracker-section,
  .settings-panel-card,
  .lead-intake-card,
  .lead-detail-card {
    border-radius: 14px;
    padding: 14px;
  }

  .leaderboard-filters-row,
  .leaderboard-custom-period-wrap,
  .tracker-period-controls,
  .date-range-controls {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  .leaderboard-filters-row > *,
  .leaderboard-custom-period-wrap > *,
  .tracker-period-controls > *,
  .date-range-controls > * {
    width: 100% !important;
  }

  .leaderboard-period-select-wrap,
  .leaderboard-scope-control,
  .leaderboard-period-control {
    width: 100% !important;
  }

  .chart-container,
  .performance-chart,
  .annual-premium-chart {
    min-height: 280px;
    overflow-x: auto;
  }

  .chart-container canvas,
  .performance-chart canvas,
  .annual-premium-chart canvas {
    min-width: 560px;
  }

  .settings-tab-button {
    min-width: 170px;
  }

  .user-editor-modal {
    padding: 8px;
  }

  .user-editor-dialog {
    max-height: calc(100vh - 16px);
    border-radius: 14px;
  }

  .user-editor-header,
  .user-editor-form {
    padding-left: 16px;
    padding-right: 16px;
  }

  .user-editor-actions {
    flex-direction: column-reverse;
  }

  .user-editor-actions button {
    width: 100%;
  }

  .lead-intake-card input,
  .lead-intake-card select,
  .lead-intake-card textarea,
  .settings-panel input,
  .settings-panel select,
  .settings-panel textarea {
    font-size: 16px;
  }

  .smart-route-row,
  .next-attempt-delay-row.smart-route-row-stack {
    grid-template-columns: 1fr;
  }

  .next-attempt-delay-control {
    width: 100% !important;
    min-width: 0 !important;
  }

  .lead-summary-primary,
  .lead-summary-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .lead-summary-meta,
  .lead-metadata-row {
    grid-template-columns: 1fr;
  }

  .login-showcase {
    display: none;
  }

  #loginScreen.login-screen {
    min-height: 100svh;
    display: grid;
    grid-template-columns: 1fr;
    padding: 16px;
  }

  #loginScreen .login-access-card {
    width: 100%;
    min-height: 0;
    padding: 30px 20px 26px;
  }

  #loginScreen .login-access-logo {
    width: 72px;
    height: 72px;
    margin-bottom: 20px;
  }

  #loginScreen .login-access-card > h1 {
    font-size: 27px;
  }

  #loginScreen .login-options-row {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
  }

  #loginScreen .forgot-password-button {
    margin-left: auto !important;
  }
}

@media (max-width: 390px) {
  .main-content {
    padding: 8px;
  }

  .page-title,
  .dashboard-title,
  .leaderboard-title,
  .settings-title {
    font-size: 28px;
  }

  .dashboard-card,
  .monthly-goal-card,
  .monthly-business-tracker,
  .performance-overview-card,
  .coach-card,
  .settings-panel-card,
  .lead-intake-card,
  .lead-detail-card {
    padding: 12px;
  }

  .login-options-row {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  #loginScreen .forgot-password-button {
    margin-left: 0 !important;
  }
}

@media (max-height: 560px) and (orientation: landscape) {
  #loginScreen.login-screen {
    min-height: 100vh;
    align-items: start;
    padding-top: 18px;
    padding-bottom: 18px;
  }

  #loginScreen .login-access-card {
    min-height: 0;
    padding-top: 24px;
    padding-bottom: 24px;
  }

  #loginScreen .login-access-logo {
    width: 62px;
    height: 62px;
    margin-bottom: 14px;
  }

  #loginScreen .login-access-card > h1 + p {
    margin-bottom: 18px;
  }

  #loginScreen .login-field {
    margin-top: 12px;
  }

  #loginScreen .login-submit-button {
    margin-top: 18px;
  }
}


/* =========================================================
   PHONE READABILITY AND TOUCH LAYOUT
   ========================================================= */

@media (max-width: 620px) {
  html {
    font-size: 16px;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
  }

  body {
    font-size: 16px;
    line-height: 1.45;
  }

  .main-content,
  .page-content {
    overflow-x: hidden;
  }

  .page,
  .dashboard-page,
  .leaderboard-page,
  .agent-tracker-page,
  .settings-page,
  .leads-page,
  .lead-detail-page {
    width: 100%;
    max-width: 100%;
  }

  .page-header,
  .dashboard-header,
  .leaderboard-header,
  .settings-header,
  .tracker-header,
  .leads-header {
    width: 100%;
    gap: 10px;
    margin-bottom: 14px;
  }

  .page-header p,
  .dashboard-header p,
  .leaderboard-header p,
  .settings-header p,
  .tracker-header p,
  .leads-header p {
    font-size: 14px;
    line-height: 1.5;
  }

  .top-header,
  .app-topbar {
    min-height: 58px;
    padding: 8px 10px;
  }

  .top-header-actions,
  .header-actions {
    width: 100%;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 2px;
    -webkit-overflow-scrolling: touch;
  }

  .top-header-actions > *,
  .header-actions > * {
    flex: 0 0 auto;
  }

  .dashboard-card,
  .monthly-goal-card,
  .monthly-business-tracker,
  .performance-overview-card,
  .coach-card,
  .leaderboard-section,
  .tracker-section,
  .settings-panel-card,
  .settings-card,
  .lead-intake-card,
  .lead-detail-card,
  .lead-summary-card,
  .user-row,
  .manual-agent-row {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  .dashboard-card h2,
  .monthly-goal-card h2,
  .monthly-business-tracker h2,
  .performance-overview-card h2,
  .coach-card h2,
  .tracker-section h2,
  .settings-panel-card h2,
  .lead-intake-card h2,
  .lead-detail-card h2 {
    font-size: 20px;
    line-height: 1.2;
  }

  .dashboard-card p,
  .monthly-goal-card p,
  .monthly-business-tracker p,
  .performance-overview-card p,
  .coach-card p,
  .tracker-section p,
  .settings-panel-card p,
  .lead-intake-card p,
  .lead-detail-card p {
    font-size: 13px;
    line-height: 1.5;
  }

  .dashboard-stat-card,
  .leaderboard-summary-card,
  .summary-card,
  .metric-card {
    min-height: 108px;
    padding: 14px;
  }

  .dashboard-stat-card strong,
  .leaderboard-summary-card strong,
  .summary-card strong,
  .metric-card strong {
    font-size: 26px !important;
    line-height: 1.05;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  .monthly-goal-card {
    padding: 14px !important;
  }

  .monthly-goal-header,
  .monthly-business-header,
  .performance-overview-header,
  .coach-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .monthly-goal-metrics,
  .monthly-business-metrics {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 0;
  }

  .monthly-goal-metric,
  .monthly-business-metric {
    width: 100%;
    padding: 12px 0;
  }

  .monthly-goal-metric strong,
  .monthly-business-metric strong {
    font-size: 28px;
    overflow-wrap: anywhere;
  }

  .monthly-goal-progress-ring {
    width: 92px;
    height: 92px;
    margin: 14px auto 0;
  }

  .coach-columns,
  .coach-content-grid {
    display: grid;
    grid-template-columns: 1fr !important;
  }

  .coach-column {
    padding: 14px 0;
  }

  .coach-column li,
  .coach-column p {
    font-size: 13px;
    line-height: 1.5;
  }

  .performance-tabs,
  .tracker-tabs,
  .settings-navigation,
  .settings-sidebar {
    display: flex;
    width: 100%;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 6px;
    -webkit-overflow-scrolling: touch;
  }

  .performance-tabs button,
  .tracker-tabs button,
  .settings-tab-button {
    min-width: max-content;
    min-height: 44px;
    padding: 10px 14px;
    white-space: nowrap;
  }

  .leaderboard-summary-grid {
    gap: 10px;
  }

  .leaderboard-podium {
    gap: 12px;
    padding: 12px;
  }

  .leaderboard-podium-card {
    min-height: 0 !important;
    padding: 20px 14px !important;
  }

  .leaderboard-agent-avatar {
    width: 64px !important;
    height: 64px !important;
  }

  .leaderboard-agent-name {
    font-size: 20px !important;
    line-height: 1.2;
    overflow-wrap: anywhere;
  }

  .leaderboard-agent-role {
    font-size: 12px;
  }

  .leaderboard-agent-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .leaderboard-agent-metrics strong {
    font-size: 20px;
    overflow-wrap: anywhere;
  }

  .leaderboard-table-wrap,
  .tracker-table-wrap,
  .leads-table-wrap,
  .users-table-wrap,
  .activity-timeline-wrap {
    width: 100%;
    overflow-x: auto;
    border-radius: 12px;
    -webkit-overflow-scrolling: touch;
  }

  .leaderboard-table,
  .tracker-table,
  .leads-table,
  .users-table,
  .activity-timeline-table {
    min-width: 820px;
    font-size: 13px;
  }

  .leaderboard-table th,
  .leaderboard-table td,
  .tracker-table th,
  .tracker-table td,
  .leads-table th,
  .leads-table td,
  .users-table th,
  .users-table td,
  .activity-timeline-table th,
  .activity-timeline-table td {
    padding: 12px 10px;
    white-space: nowrap;
  }

  .tracker-toolbar,
  .agents-toolbar,
  .leads-toolbar,
  .users-toolbar,
  .leaderboard-filters-row,
  .tracker-period-controls,
  .date-range-controls {
    gap: 10px;
  }

  .tracker-toolbar input,
  .agents-toolbar input,
  .leads-toolbar input,
  .users-toolbar input,
  .leaderboard-filters-row select,
  .tracker-period-controls select,
  .date-range-controls input,
  .date-range-controls select {
    width: 100%;
    min-height: 46px;
    font-size: 16px;
  }

  .settings-panel,
  .settings-panel-card,
  .settings-card {
    padding: 14px;
  }

  .settings-form-grid {
    gap: 14px;
  }

  .settings-form-grid label,
  .user-editor-grid label,
  .lead-intake-card label {
    gap: 7px;
  }

  .settings-form-grid label > span,
  .user-editor-grid label > span,
  .lead-intake-card label > span {
    font-size: 12px;
    line-height: 1.3;
  }

  .settings-form-grid input,
  .settings-form-grid select,
  .settings-form-grid textarea,
  .user-editor-grid input,
  .user-editor-grid select,
  .lead-intake-card input,
  .lead-intake-card select,
  .lead-intake-card textarea {
    width: 100%;
    min-height: 46px;
    padding: 11px 12px;
    font-size: 16px;
  }

  .lead-intake-card textarea {
    min-height: 110px;
  }

  .action-choice {
    min-height: 64px;
    padding: 12px;
  }

  .action-choice-title {
    font-size: 15px;
  }

  .action-choice-help {
    font-size: 12px;
    line-height: 1.4;
  }

  .smart-route-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    align-items: stretch;
    padding: 12px;
  }

  .smart-route-row > span,
  .smart-route-row > strong,
  .smart-route-row > small {
    width: 100%;
    text-align: left;
  }

  .next-attempt-delay-row.smart-route-row-stack {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 10px;
  }

  .next-attempt-delay-control,
  .next-attempt-delay-control select {
    width: 100% !important;
  }

  .lead-summary-header,
  .lead-summary-primary,
  .lead-profile-header {
    gap: 12px;
  }

  .lead-summary-name,
  .lead-profile-name {
    font-size: 24px !important;
    line-height: 1.15;
    overflow-wrap: anywhere;
  }

  .lead-summary-meta,
  .lead-metadata-row {
    gap: 8px;
  }

  .lead-summary-meta-item,
  .lead-metadata-item {
    width: 100%;
    min-width: 0;
    padding: 10px;
  }

  .lead-summary-meta-item strong,
  .lead-metadata-item strong {
    overflow-wrap: anywhere;
  }

  .lead-detail-top-stats,
  .lead-summary-stats {
    gap: 10px;
  }

  .activity-timeline-card,
  .lead-activity-card {
    overflow: hidden;
  }

  .user-row {
    padding: 14px;
  }

  .user-row strong {
    font-size: 16px;
  }

  .user-row span,
  .user-row small {
    font-size: 12px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  .user-row-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .user-row-actions button,
  .manual-agent-row button,
  .settings-panel button,
  .lead-intake-card button {
    min-height: 44px;
    font-size: 14px;
  }

  .manual-agent-row select {
    width: 100%;
    min-height: 46px;
    font-size: 16px;
  }

  .monthly-goal-live-message {
    top: 50%;
    width: calc(100vw - 16px);
    max-height: calc(100vh - 24px);
    overflow-y: auto;
    padding: 24px 14px 20px;
  }

  .monthly-goal-live-trophy {
    width: 76px;
    height: 76px;
    margin-top: -52px;
  }

  .monthly-goal-live-message h2 {
    font-size: 36px;
    line-height: 1;
  }

  .monthly-goal-live-message > strong {
    font-size: 15px;
    line-height: 1.35;
  }

  #loginScreen.login-screen {
    overflow-y: auto;
  }

  #loginScreen .login-access-card {
    align-self: center;
    justify-content: flex-start;
    padding-top: 28px;
  }

  #loginScreen .login-field {
    width: 100%;
  }

  #loginScreen .login-input-wrap {
    width: 100%;
    min-height: 54px;
  }

  #loginScreen .login-input-wrap input {
    min-width: 0;
    font-size: 16px;
  }

  #loginScreen .login-options-row {
    width: 100%;
    gap: 10px;
  }

  #loginScreen .login-submit-button {
    width: 100%;
    min-height: 52px;
  }
}

@media (max-width: 430px) {
  .page-title,
  .dashboard-title,
  .leaderboard-title,
  .settings-title {
    font-size: 28px !important;
  }

  .dashboard-stat-card strong,
  .leaderboard-summary-card strong,
  .summary-card strong,
  .metric-card strong {
    font-size: 24px !important;
  }

  .leaderboard-agent-name {
    font-size: 18px !important;
  }

  .leaderboard-agent-metrics {
    grid-template-columns: 1fr;
  }

  .monthly-goal-completed-banner {
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 10px;
  }

  .monthly-goal-completed-stars {
    display: none;
  }

  #loginScreen .login-access-card {
    padding-left: 16px;
    padding-right: 16px;
  }
}



/* REQUESTED WORKFLOW AND READABILITY UPDATES */
.performance-stat-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dashboard-coach-title-line > span {
  display: none !important;
}

.dashboard-coach-column h3 {
  font-size: 13px !important;
  line-height: 1.35;
  letter-spacing: -0.01em;
}

.dashboard-coach-list {
  gap: 13px !important;
}

.dashboard-coach-list strong {
  font-size: 13px !important;
  line-height: 1.4 !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.dashboard-coach-list p,
.dashboard-coach-column blockquote {
  font-size: 12px !important;
  line-height: 1.55 !important;
  opacity: 1 !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.sold-builder-fields {
  margin-top: 12px;
}

.sold-builder-fields input,
#newLeadMonthlyPremiumInput,
#newLeadAnnualPremiumInput,
#scheduleActivityMonthlyPremiumInput,
#scheduleActivityAnnualPremiumInput {
  color: #0f172a !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums;
  opacity: 1 !important;
  -webkit-text-fill-color: currentColor !important;
}

body.app-dark-mode .sold-builder-fields input,
body.app-dark-mode #newLeadMonthlyPremiumInput,
body.app-dark-mode #newLeadAnnualPremiumInput,
body.app-dark-mode #scheduleActivityMonthlyPremiumInput,
body.app-dark-mode #scheduleActivityAnnualPremiumInput {
  color: #ffffff !important;
  border-color: rgba(139, 92, 246, 0.48) !important;
  background: #17112f !important;
  -webkit-text-fill-color: #ffffff !important;
}

.filter-select-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-width: 150px;
}

.filter-select-wrap select {
  width: 100%;
  padding-right: 34px !important;
  appearance: none;
}

.filter-select-wrap > svg {
  position: absolute;
  right: 11px;
  width: 15px;
  height: 15px;
  color: #7c3aed;
  pointer-events: none;
}

body.schedule-activity-modal-open {
  overflow: hidden;
}

.schedule-activity-modal {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(4, 6, 24, 0.72);
  backdrop-filter: blur(7px);
}

.schedule-activity-dialog {
  width: min(620px, 100%);
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  padding: 22px;
  color: #f8f7ff;
  border: 1px solid rgba(139, 92, 246, 0.38);
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.16), transparent 34%),
    linear-gradient(145deg, #151033, #0d0b25);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.48);
}

.schedule-activity-header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}

.schedule-activity-header > div {
  display: flex;
  gap: 12px;
  align-items: center;
}

.schedule-activity-icon {
  width: 42px;
  height: 42px;
  display: grid;
  flex: 0 0 42px;
  place-items: center;
  color: #c4b5fd;
  border-radius: 13px;
  background: rgba(109, 53, 245, 0.24);
}

.schedule-activity-header h2 {
  margin: 0;
  color: #ffffff;
  font-size: 21px;
}

.schedule-activity-header p {
  margin: 5px 0 0;
  color: #aaa4c1;
  font-size: 13px;
  line-height: 1.45;
}

#scheduleActivityCloseButton {
  width: 38px;
  height: 38px;
  display: grid;
  flex: 0 0 38px;
  place-items: center;
  padding: 0;
  color: #c4bdd8;
  border: 1px solid rgba(139, 92, 246, 0.24);
  background: rgba(255, 255, 255, 0.04);
}

.schedule-activity-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.schedule-activity-grid label,
.schedule-activity-note {
  display: grid;
  gap: 7px;
}

.schedule-activity-grid label > span,
.schedule-activity-note > span {
  color: #d9d4e8;
  font-size: 12px;
  font-weight: 800;
}

.schedule-activity-grid input,
.schedule-activity-grid select,
.schedule-activity-note textarea {
  width: 100%;
  min-height: 46px;
  padding: 11px 12px;
  color: #ffffff;
  border: 1px solid rgba(139, 92, 246, 0.34);
  border-radius: 11px;
  background: #17112f;
  color-scheme: dark;
}

.schedule-activity-note {
  margin-top: 13px;
}

.schedule-activity-note textarea {
  min-height: 110px;
  resize: vertical;
}

.schedule-activity-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
}

.schedule-activity-actions button {
  min-width: 132px;
  min-height: 44px;
}

@media (max-width: 720px) {
  .performance-stat-strip,
  .schedule-activity-grid {
    grid-template-columns: 1fr;
  }

  .filter-select-wrap {
    width: 100%;
  }

  .schedule-activity-modal {
    padding: 10px;
  }

  .schedule-activity-dialog {
    max-height: calc(100vh - 20px);
    padding: 17px;
  }

  .schedule-activity-actions {
    flex-direction: column-reverse;
  }

  .schedule-activity-actions button {
    width: 100%;
  }
}


/* MENU, SCHEDULE, CURRENCY, AND DARK-THEME FIXES */
.currency-input,
#newLeadMonthlyPremiumInput,
#newLeadAnnualPremiumInput,
#builderMonthlyPremiumInput,
#builderAnnualPremiumInput,
#scheduleActivityMonthlyPremiumInput,
#scheduleActivityAnnualPremiumInput {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}

body.app-dark-mode #newLeadMonthlyPremiumInput,
body.app-dark-mode #newLeadAnnualPremiumInput,
body.app-dark-mode #builderMonthlyPremiumInput,
body.app-dark-mode #builderAnnualPremiumInput,
body.app-dark-mode #scheduleActivityMonthlyPremiumInput,
body.app-dark-mode #scheduleActivityAnnualPremiumInput {
  color: #ffffff !important;
  background: linear-gradient(180deg, #1c1540, #15102f) !important;
  border: 1px solid rgba(139, 92, 246, 0.62) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  -webkit-text-fill-color: #ffffff !important;
}

body.app-dark-mode .lead-summary-result-pill.no-answer,
body.app-dark-mode .result-pill.no-answer,
body.app-dark-mode .call-result-pill.no-answer,
body.app-dark-mode .activity-result-pill.no-answer,
body.app-dark-mode [class*="result-pill"].red,
body.app-dark-mode [class*="result-pill"].no-answer {
  color: #ff6b81 !important;
  background: rgba(244, 63, 94, 0.16) !important;
  border: 1px solid rgba(244, 63, 94, 0.30) !important;
  box-shadow: none !important;
}

body.app-dark-mode .lead-actions-dropdown,
body.app-dark-mode .lead-row-actions-dropdown,
body.app-dark-mode .lead-summary-menu-dropdown {
  color: #f8f7ff !important;
  border: 1px solid rgba(139, 92, 246, 0.48) !important;
  background: linear-gradient(180deg, #21184a, #171131) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.50) !important;
  opacity: 1 !important;
}

body.app-dark-mode .lead-actions-dropdown button,
body.app-dark-mode .lead-row-actions-dropdown button,
body.app-dark-mode .lead-summary-menu-dropdown button {
  color: #f8f7ff !important;
  background: transparent !important;
  opacity: 1 !important;
}

body.app-dark-mode .lead-actions-dropdown button:hover,
body.app-dark-mode .lead-row-actions-dropdown button:hover,
body.app-dark-mode .lead-summary-menu-dropdown button:hover {
  color: #ffffff !important;
  background: rgba(124, 58, 237, 0.32) !important;
}

body.app-dark-mode .lead-actions-dropdown button.danger,
body.app-dark-mode .lead-row-actions-dropdown button.danger,
body.app-dark-mode .lead-summary-menu-dropdown button.danger {
  color: #ff6680 !important;
}

body.app-dark-mode .answered-preview-card,
body.app-dark-mode .answered-preview-card *,
body.app-dark-mode .answered-preview-content {
  --preview-panel: #15102f;
}

body.app-dark-mode .answered-preview-stat,
body.app-dark-mode .answered-preview-summary-card,
body.app-dark-mode .answered-preview-info-card,
body.app-dark-mode .answered-preview-latest-note,
body.app-dark-mode .answered-preview-card .preview-stat {
  color: #f8f7ff !important;
  border-color: rgba(139, 92, 246, 0.28) !important;
  background: #17112f !important;
}

body.app-dark-mode .answered-preview-stat strong,
body.app-dark-mode .answered-preview-summary-card strong,
body.app-dark-mode .answered-preview-info-card strong,
body.app-dark-mode .answered-preview-latest-note strong {
  color: #ffffff !important;
}

body.app-dark-mode .answered-preview-stat span,
body.app-dark-mode .answered-preview-summary-card span,
body.app-dark-mode .answered-preview-info-card span,
body.app-dark-mode .answered-preview-latest-note p {
  color: #b8b1cd !important;
}

body.app-dark-mode .answered-preview-footer-button,
body.app-dark-mode .answered-preview-card > button:last-child {
  color: #ffffff !important;
  border: 1px solid rgba(139, 92, 246, 0.48) !important;
  background: linear-gradient(135deg, #6d35f5, #4f46e5) !important;
}

body.app-dark-mode .shared-folder-card,
body.app-dark-mode .shared-lead-folder-card {
  color: #f8f7ff !important;
  border-color: rgba(139, 92, 246, 0.34) !important;
  background: linear-gradient(180deg, #17112f, #120d29) !important;
}

body.app-dark-mode .shared-folder-stat,
body.app-dark-mode .shared-folder-card .folder-stat,
body.app-dark-mode .shared-lead-folder-card .folder-stat,
body.app-dark-mode .shared-lead-folder-card [class*="stat"] {
  color: #f8f7ff !important;
  border: 1px solid rgba(139, 92, 246, 0.25) !important;
  background: #21184a !important;
}

body.app-dark-mode .shared-folder-stat strong,
body.app-dark-mode .shared-folder-card .folder-stat strong,
body.app-dark-mode .shared-lead-folder-card strong {
  color: #ffffff !important;
}

body.app-dark-mode .shared-folder-stat span,
body.app-dark-mode .shared-folder-card .folder-stat span {
  color: #b8b1cd !important;
}

.schedule-activity-modal:not(.hidden) {
  display: grid !important;
}

@media (max-width: 620px) {
  #newLeadMonthlyPremiumInput,
  #newLeadAnnualPremiumInput,
  #builderMonthlyPremiumInput,
  #builderAnnualPremiumInput,
  #scheduleActivityMonthlyPremiumInput,
  #scheduleActivityAnnualPremiumInput {
    min-height: 48px;
    font-size: 17px !important;
  }
}


/* MANUAL NOTE AND SHARED FOLDER THEME FIX */
body.app-dark-mode .shared-source-card {
  color: #f8f7ff !important;
  border: 1px solid rgba(139, 92, 246, 0.38) !important;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.12), transparent 36%),
    linear-gradient(180deg, #17112f 0%, #120d29 100%) !important;
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

body.app-dark-mode .shared-source-card h3 {
  color: #ffffff !important;
}

body.app-dark-mode .shared-source-card p {
  color: #b9b2d0 !important;
}

body.app-dark-mode .shared-source-icon {
  color: #c4b5fd !important;
  border: 1px solid rgba(139, 92, 246, 0.34) !important;
  background: rgba(109, 53, 245, 0.20) !important;
}

body.app-dark-mode .shared-source-stats > div {
  color: #f8f7ff !important;
  border: 1px solid rgba(139, 92, 246, 0.30) !important;
  background:
    linear-gradient(180deg, rgba(41, 31, 87, 0.96), rgba(29, 22, 63, 0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

body.app-dark-mode .shared-source-stats span {
  color: #aaa4c1 !important;
}

body.app-dark-mode .shared-source-stats strong {
  color: #ffffff !important;
}

body.app-dark-mode .shared-source-card:hover {
  border-color: rgba(139, 92, 246, 0.66) !important;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.18), transparent 38%),
    linear-gradient(180deg, #1b1438 0%, #15102e 100%) !important;
}


/* RESULT, SHARED TAB, AND ANSWERED PREVIEW THEME FIX */
body.app-dark-mode .age-pill,
body.app-dark-mode .unanswered-age-pill,
body.app-dark-mode .lead-age-pill {
  color: #ddd6fe !important;
  border: 1px solid rgba(139, 92, 246, 0.38) !important;
  background: rgba(109, 53, 245, 0.18) !important;
  box-shadow: none !important;
}

body.app-dark-mode .result-pill {
  border: 1px solid transparent !important;
  box-shadow: none !important;
}

body.app-dark-mode .result-pill.answered {
  color: #6ee7a8 !important;
  border-color: rgba(34, 197, 94, 0.30) !important;
  background: rgba(34, 197, 94, 0.16) !important;
}

body.app-dark-mode .result-pill.no-answer {
  color: #ff6b81 !important;
  border-color: rgba(244, 63, 94, 0.32) !important;
  background: rgba(244, 63, 94, 0.16) !important;
}

body.app-dark-mode .result-pill.appointment {
  color: #c4b5fd !important;
  border-color: rgba(139, 92, 246, 0.38) !important;
  background: rgba(109, 53, 245, 0.22) !important;
}

body.app-dark-mode .result-pill.sold {
  color: #67e8f9 !important;
  border-color: rgba(6, 182, 212, 0.34) !important;
  background: rgba(6, 182, 212, 0.16) !important;
}

body.app-dark-mode .result-pill.not-interested {
  color: #fbbf24 !important;
  border-color: rgba(245, 158, 11, 0.34) !important;
  background: rgba(245, 158, 11, 0.16) !important;
}

body.app-dark-mode .shared-tabs-card {
  border-color: rgba(139, 92, 246, 0.30) !important;
  background: linear-gradient(180deg, #17112f, #120d29) !important;
}

body.app-dark-mode .shared-tab {
  color: #cfc8df !important;
  border: 1px solid rgba(139, 92, 246, 0.32) !important;
  background: #181130 !important;
  opacity: 1 !important;
}

body.app-dark-mode .shared-tab:hover {
  color: #ffffff !important;
  border-color: rgba(139, 92, 246, 0.58) !important;
  background: #24194d !important;
}

body.app-dark-mode .shared-tab.active-tab {
  color: #ffffff !important;
  border-color: transparent !important;
  background: linear-gradient(135deg, #7242ff, #5730e8) !important;
  box-shadow: 0 10px 22px rgba(91, 33, 182, 0.28) !important;
}

body.app-dark-mode .shared-lead-entry-card,
body.app-dark-mode .shared-source-header-card,
body.app-dark-mode .shared-panel .card,
body.app-dark-mode .shared-panel .schedule-block {
  color: #f8f7ff !important;
  border-color: rgba(139, 92, 246, 0.30) !important;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.08), transparent 35%),
    linear-gradient(180deg, #17112f, #120d29) !important;
}

body.app-dark-mode .shared-load-error {
  margin: 0;
  padding: 18px;
  color: #fca5a5;
  border: 1px solid rgba(244, 63, 94, 0.24);
  border-radius: 12px;
  background: rgba(244, 63, 94, 0.08);
}

body.app-dark-mode .answered-preview-card {
  color: #f8f7ff !important;
  border-color: rgba(139, 92, 246, 0.38) !important;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.12), transparent 34%),
    linear-gradient(180deg, #17112f, #100c26) !important;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.30) !important;
}

body.app-dark-mode .answered-preview-header {
  border-bottom-color: rgba(139, 92, 246, 0.24) !important;
}

body.app-dark-mode .answered-preview-header h3,
body.app-dark-mode .answered-preview-section-title,
body.app-dark-mode .answered-preview-note strong,
body.app-dark-mode .answered-preview-details dd {
  color: #ffffff !important;
}

body.app-dark-mode .answered-preview-header p,
body.app-dark-mode .answered-preview-note p,
body.app-dark-mode .answered-preview-note small,
body.app-dark-mode .answered-preview-details dt {
  color: #b9b2d0 !important;
}

body.app-dark-mode .answered-preview-close {
  color: #d8d1e8 !important;
  border: 1px solid rgba(139, 92, 246, 0.32) !important;
  background: #21184a !important;
}

body.app-dark-mode .answered-preview-stat {
  color: #f8f7ff !important;
  border: 1px solid rgba(139, 92, 246, 0.30) !important;
  background: linear-gradient(180deg, #21184a, #191236) !important;
}

body.app-dark-mode .answered-preview-stat-icon {
  color: #c4b5fd !important;
  background: rgba(109, 53, 245, 0.22) !important;
}

body.app-dark-mode .answered-preview-stat small {
  color: #aaa4c1 !important;
}

body.app-dark-mode .answered-preview-stat strong {
  color: #ffffff !important;
}

body.app-dark-mode .answered-preview-section {
  border-top-color: rgba(139, 92, 246, 0.24) !important;
}

body.app-dark-mode .answered-preview-note {
  color: #f8f7ff !important;
  border: 1px solid rgba(139, 92, 246, 0.28) !important;
  background: #15102f !important;
}

body.app-dark-mode .answered-preview-details div {
  border-bottom-color: rgba(139, 92, 246, 0.18) !important;
}

body.app-dark-mode .answered-preview-open-btn {
  color: #ffffff !important;
  border: 1px solid rgba(139, 92, 246, 0.52) !important;
  background: linear-gradient(135deg, #7242ff, #5730e8) !important;
  box-shadow: 0 12px 26px rgba(91, 33, 182, 0.24) !important;
}

@media (max-width: 720px) {
  .shared-tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
  }

  .shared-tab {
    flex: 0 0 auto;
  }

  .answered-preview-overview {
    grid-template-columns: 1fr;
  }
}


/* SHARED LEADS TABLE AND PROFILE REDESIGN */
body.app-dark-mode .shared-lead-name-cell strong {
  color: #ffffff !important;
  font-size: 13px;
  line-height: 1.35;
}

body.app-dark-mode .shared-lead-name-cell span,
body.app-dark-mode .shared-contact-small span,
body.app-dark-mode .shared-reason-cell {
  color: #b9b2d0 !important;
  opacity: 1 !important;
}

body.app-dark-mode .shared-contact-small span:first-child {
  color: #f4f0ff !important;
}

body.app-dark-mode .shared-reason-cell {
  font-weight: 650;
  line-height: 1.4;
}

.shared-lead-actions-cell {
  position: relative;
  width: 62px;
  text-align: center;
}

.shared-lead-row-actions-menu {
  position: relative;
  display: inline-block;
}

.shared-lead-row-actions-menu > summary {
  list-style: none;
}

.shared-lead-row-actions-menu > summary::-webkit-details-marker {
  display: none;
}

.shared-lead-row-actions-menu .lead-row-menu-trigger {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  padding: 0;
  color: #c4b5fd;
  border: 1px solid rgba(139, 92, 246, 0.34);
  border-radius: 10px;
  background: rgba(109, 53, 245, 0.16);
  cursor: pointer;
}

.shared-lead-row-actions-menu .lead-row-menu-trigger:hover {
  color: #ffffff;
  border-color: rgba(139, 92, 246, 0.62);
  background: rgba(109, 53, 245, 0.28);
}

.shared-lead-actions-dropdown {
  position: absolute;
  z-index: 7000;
  top: calc(100% + 7px);
  right: 0;
  width: 168px;
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid rgba(139, 92, 246, 0.48);
  border-radius: 12px;
  background: linear-gradient(180deg, #21184a, #171131);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.48);
}

.shared-lead-actions-dropdown button {
  width: 100%;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 11px;
  color: #f8f7ff;
  border-radius: 9px;
  background: transparent;
  text-align: left;
}

.shared-lead-actions-dropdown button:hover {
  background: rgba(124, 58, 237, 0.30);
}

.shared-lead-actions-dropdown button svg {
  width: 16px;
  height: 16px;
  color: #c4b5fd;
}

/* SHARED CALL BLOCKS: MATCH NORMAL LEADS */
body.app-dark-mode .shared-lead-name-cell strong,
body.app-dark-mode .shared-call-lead-link {
  color: #9b6cff !important;
  font-weight: 850 !important;
  opacity: 1 !important;
}

body.app-dark-mode .shared-call-lead-link {
  padding: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left;
}

body.app-dark-mode .shared-call-lead-link:hover {
  color: #c4b5fd !important;
  text-decoration: underline;
  transform: none;
}

body.app-dark-mode .shared-contact-small span,
body.app-dark-mode .shared-reason-cell {
  color: #d3cde2 !important;
  opacity: 1 !important;
}

body.app-dark-mode [data-shared-block] {
  color: #d8d1e8 !important;
  border: 1px solid rgba(139, 92, 246, 0.36) !important;
  background: #181130 !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

body.app-dark-mode [data-shared-block]:hover {
  color: #ffffff !important;
  border-color: rgba(139, 92, 246, 0.62) !important;
  background: #24194d !important;
}

body.app-dark-mode [data-shared-block].active-tab {
  color: #ffffff !important;
  border-color: transparent !important;
  background: linear-gradient(135deg, #7242ff, #5730e8) !important;
  box-shadow: 0 10px 22px rgba(91, 33, 182, 0.28) !important;
}

body.app-dark-mode #sharedTodayCallsPanel,
body.app-dark-mode #sharedTodayCallsPanel .content-card,
body.app-dark-mode #sharedTodayCallsPanel .schedule-block,
body.app-dark-mode #sharedTodayCallsPanel .schedule-table-wrap {
  color: #f8f7ff !important;
  border-color: rgba(139, 92, 246, 0.30) !important;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.08), transparent 35%),
    linear-gradient(180deg, #17112f, #120d29) !important;
}

body.app-dark-mode #sharedTodayCallsPanel .schedule-table thead {
  background: #281c55 !important;
}

body.app-dark-mode #sharedTodayCallsPanel .schedule-table th {
  color: #ffffff !important;
}

body.app-dark-mode #sharedTodayCallsPanel .schedule-table td {
  color: #f3efff !important;
  border-color: rgba(139, 92, 246, 0.20) !important;
  background: #110d29 !important;
}

.shared-call-log-button {
  min-height: 38px;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 8px 12px;
  color: #ffffff;
  border: 1px solid rgba(139, 92, 246, 0.48);
  background: linear-gradient(135deg, #7242ff, #5730e8);
}

.shared-call-log-button svg {
  width: 16px;
  height: 16px;
}

body.app-dark-mode #sharedTodayCallLogPanel {
  color: #f8f7ff !important;
  border: 1px solid rgba(139, 92, 246, 0.42) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.14), transparent 35%),
    linear-gradient(180deg, #17112f, #100c26) !important;
  box-shadow: 0 24px 72px rgba(0, 0, 0, 0.42) !important;
}

body.app-dark-mode #sharedTodayCallLogPanel select,
body.app-dark-mode #sharedTodayCallLogPanel input,
body.app-dark-mode #sharedTodayCallLogPanel textarea {
  color: #ffffff !important;
  border: 1px solid rgba(139, 92, 246, 0.38) !important;
  background: #17112f !important;
  -webkit-text-fill-color: #ffffff !important;
  color-scheme: dark;
}

body.app-dark-mode #sharedTodayCallLogPanel .appointment-builder-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

body.app-dark-mode #sharedTodayCallLogPanel .appointment-builder-fields.hidden {
  display: none !important;
}

@media (max-width: 720px) {
  body.app-dark-mode #sharedTodayCallLogPanel .appointment-builder-fields {
    grid-template-columns: 1fr;
  }
}

/* CONNECTED CRM LEAD SHARING */
.connected-sharing-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(330px, 0.55fr);
  gap: 16px;
  margin-bottom: 16px;
}

.connected-share-card,
.outgoing-shares-card,
.manual-shared-folder-card,
.shared-folders-card {
  position: relative;
  overflow: hidden;
  overflow: clip;
}

.connected-share-card::before,
.outgoing-shares-card::before,
.manual-shared-folder-card::before,
.shared-folders-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, #6d35f5, #4f46e5, #8b5cf6);
}

.connected-share-header {
  align-items: flex-start;
}

.connected-share-lock {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid #ddd6fe;
  border-radius: 999px;
  background: #f5f3ff;
  color: #5b21b6;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.connected-share-lock svg {
  width: 15px;
  height: 15px;
}

.connected-share-controls {
  display: grid;
  grid-template-columns: minmax(220px, 0.45fr) minmax(280px, 1fr);
  gap: 12px;
  margin-top: 2px;
}

.connected-share-controls select,
.connected-share-controls input {
  width: 100%;
  min-height: 44px;
  border: 1px solid #d8dee8;
  border-radius: 12px;
  background: #ffffff;
  color: #0f172a;
  padding: 0 12px;
  font: inherit;
  font-size: 13px;
}

.connected-share-search-wrap {
  position: relative;
}

.connected-share-search-wrap svg {
  position: absolute;
  left: 12px;
  top: 50%;
  width: 16px;
  height: 16px;
  color: #7c3aed;
  transform: translateY(-50%);
  pointer-events: none;
}

.connected-share-search-wrap input {
  padding-left: 38px;
}

.connected-share-selection-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 16px 0 10px;
}

.connected-share-selection-toolbar > div {
  display: grid;
  gap: 2px;
}

.connected-share-selection-toolbar strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 850;
}

.connected-share-selection-toolbar span {
  color: #64748b;
  font-size: 11px;
}

.connected-share-selection-toolbar button {
  min-height: 34px;
  padding: 0 11px;
  font-size: 11px;
}

.connected-share-lead-list {
  display: grid;
  gap: 8px;
  max-height: 360px;
  overflow-y: auto;
  padding: 4px;
  border: 1px solid #e5e7eb;
  border-radius: 15px;
  background: #f8fafc;
}

.connected-share-lead-row {
  position: relative;
  display: grid;
  grid-template-columns: 22px 36px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  min-height: 62px;
  padding: 9px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
  cursor: pointer;
  transition: 0.15s ease;
}

.connected-share-lead-row:hover {
  border-color: #c4b5fd;
  box-shadow: 0 8px 20px rgba(109, 53, 245, 0.07);
}

.connected-share-lead-row.selected {
  border-color: #8b5cf6;
  background: #faf8ff;
  box-shadow: 0 0 0 2px rgba(109, 53, 245, 0.08);
}

.connected-share-lead-row > input {
  position: absolute;
  left: 10px;
  top: 50%;
  z-index: 2;
  width: 21px;
  height: 21px;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  transform: translateY(-50%);
}

.connected-share-checkbox {
  width: 21px;
  height: 21px;
  display: grid;
  place-items: center;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #ffffff;
  color: transparent;
}

.connected-share-checkbox svg {
  width: 13px;
  height: 13px;
  stroke-width: 3;
}

.connected-share-lead-row.selected .connected-share-checkbox {
  border-color: #6d35f5;
  background: #6d35f5;
  color: #ffffff;
}

.connected-share-lead-avatar,
.connected-shared-lead-avatar {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  color: #ffffff;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: -0.03em;
}

.connected-share-lead-copy {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.connected-share-lead-copy strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.connected-share-lead-copy small {
  overflow: hidden;
  color: #64748b;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.connected-share-lead-result {
  white-space: nowrap;
}

.connected-share-count-badge {
  min-width: 58px;
  padding: 5px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: 9px;
  font-weight: 850;
  text-align: center;
  white-space: nowrap;
}

.connected-share-submit-row {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
}

.connected-share-submit-row button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  min-width: 190px;
}

.connected-share-submit-row button svg {
  width: 16px;
  height: 16px;
}

.connected-share-submit-row button:disabled {
  cursor: wait;
  opacity: 0.65;
  transform: none;
}

.connected-share-status {
  margin: 0;
  color: #5b21b6;
  font-size: 12px;
  font-weight: 750;
}

.connected-share-empty {
  min-height: 150px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  padding: 18px;
  color: #64748b;
  text-align: center;
}

.connected-share-empty.compact {
  min-height: 210px;
}

.connected-share-empty svg {
  width: 28px;
  height: 28px;
  color: #8b5cf6;
}

.connected-share-empty strong {
  color: #334155;
  font-size: 13px;
  font-weight: 850;
}

.connected-share-empty span {
  max-width: 360px;
  font-size: 11px;
  line-height: 1.45;
}

.shared-folder-empty,
.shared-leads-empty {
  grid-column: 1 / -1;
  border: 1px dashed #cbd5e1;
  border-radius: 14px;
  background: #f8fafc;
}

.outgoing-share-list {
  display: grid;
  gap: 9px;
  max-height: 520px;
  overflow-y: auto;
}

.outgoing-share-row {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 11px;
  border: 1px solid #e5e7eb;
  border-radius: 13px;
  background: #ffffff;
}

.outgoing-share-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #f4f0ff;
  color: #6d35f5;
}

.outgoing-share-icon svg {
  width: 17px;
  height: 17px;
}

.outgoing-share-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.outgoing-share-copy strong,
.outgoing-share-copy span,
.outgoing-share-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.outgoing-share-copy strong {
  color: #0f172a;
  font-size: 12px;
  font-weight: 850;
}

.outgoing-share-copy span {
  color: #475569;
  font-size: 11px;
  font-weight: 700;
}

.outgoing-share-copy small {
  color: #94a3b8;
  font-size: 9px;
}

.outgoing-share-remove {
  min-height: 32px;
  padding: 0 9px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #fecdd3;
  background: #fff1f2;
  color: #be123c;
  font-size: 10px;
}

.outgoing-share-remove svg {
  width: 14px;
  height: 14px;
}

.shared-source-card-badge,
.shared-source-type-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.shared-source-card-badge {
  margin-bottom: 8px;
  padding: 5px 8px;
}

.shared-source-card-badge svg {
  width: 12px;
  height: 12px;
}

.shared-source-card-badge.connected,
.shared-source-type-badge.connected {
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
  color: #15803d;
}

.shared-source-card-badge.manual,
.shared-source-type-badge.manual {
  border: 1px solid #ddd6fe;
  background: #f5f3ff;
  color: #6d28d9;
}

.shared-source-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.shared-source-type-badge {
  padding: 5px 8px;
}

.shared-source-icon.connected {
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
  color: #16a34a;
}

.connected-source-card {
  border-color: #d8b4fe;
}

.connected-shared-lead-link {
  width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  box-shadow: none;
}

.connected-shared-lead-link:hover {
  transform: none;
  opacity: 1;
}

.connected-shared-lead-link > span:last-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.connected-shared-lead-link strong,
.connected-shared-lead-link small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.connected-shared-lead-link strong {
  color: #6d35f5;
  font-size: 12px;
  font-weight: 850;
}

.connected-shared-lead-link small {
  color: #64748b;
  font-size: 9px;
}

.connected-total-calls {
  min-width: 40px;
  display: inline-grid;
  place-items: center;
  padding: 6px 9px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 900;
}

.lead-summary-status.connected {
  border-color: #bbf7d0 !important;
  background: #f0fdf4 !important;
  color: #15803d !important;
}

/* CONNECTED LEAD FULL DATA MODAL */
.connected-lead-data-modal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(2, 6, 23, 0.72);
  backdrop-filter: blur(8px);
}

.connected-lead-data-dialog {
  width: min(1080px, 100%);
  max-height: calc(100vh - 48px);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr;
  border: 1px solid #ddd6fe;
  border-radius: 22px;
  background: #ffffff;
  box-shadow: 0 35px 120px rgba(15, 23, 42, 0.35);
}

.connected-lead-data-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 22px;
  border-bottom: 1px solid #e5e7eb;
  background: linear-gradient(135deg, #faf8ff, #f8fafc);
}

.connected-lead-data-header h2 {
  margin: 0;
  color: #0f172a;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.05em;
}

.connected-lead-data-header span {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: 12px;
}

.connected-lead-data-close {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
  color: #475569;
}

.connected-lead-data-close svg {
  width: 18px;
  height: 18px;
}

.connected-lead-data-content {
  overflow-y: auto;
  display: grid;
  gap: 14px;
  padding: 18px;
  background: #f8fafc;
}

.connected-data-section {
  padding: 16px;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  background: #ffffff;
}

.connected-data-section-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.connected-data-section-title > span {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #f4f0ff;
  color: #6d35f5;
}

.connected-data-section-title svg {
  width: 17px;
  height: 17px;
}

.connected-data-section-title h3 {
  margin: 0;
  color: #0f172a;
  font-size: 14px;
  font-weight: 850;
}

.connected-data-section-title p {
  margin: 2px 0 0;
  color: #64748b;
  font-size: 10px;
}

.connected-data-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.connected-data-field {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid #e5e7eb;
  border-radius: 11px;
  background: #f8fafc;
}

.connected-data-field span {
  color: #64748b;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.connected-data-field strong {
  overflow-wrap: anywhere;
  color: #0f172a;
  font-size: 11px;
  font-weight: 750;
}

.connected-data-empty {
  margin: 0;
  padding: 14px;
  border: 1px dashed #cbd5e1;
  border-radius: 11px;
  color: #64748b;
  background: #f8fafc;
  font-size: 11px;
  text-align: center;
}

.connected-data-table-wrap {
  overflow-x: auto;
  border: 1px solid #e5e7eb;
  border-radius: 11px;
}

.connected-data-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
}

.connected-data-table th,
.connected-data-table td {
  padding: 10px;
  border-bottom: 1px solid #e5e7eb;
  color: #334155;
  font-size: 10px;
  text-align: left;
  vertical-align: top;
}

.connected-data-table th {
  background: #f8fafc;
  color: #64748b;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.connected-data-table tr:last-child td {
  border-bottom: 0;
}

/* CONNECTED SHARING DARK MODE */
body.app-dark-mode .connected-share-card,
body.app-dark-mode .outgoing-shares-card,
body.app-dark-mode .manual-shared-folder-card,
body.app-dark-mode .shared-folders-card {
  color: #f8f7ff !important;
  border-color: rgba(139, 92, 246, 0.32) !important;
  background:
    radial-gradient(circle at top right, rgba(109, 53, 245, 0.10), transparent 35%),
    linear-gradient(180deg, #17112f, #120d29) !important;
}

body.app-dark-mode .connected-share-lock {
  border-color: rgba(139, 92, 246, 0.38);
  background: rgba(109, 53, 245, 0.18);
  color: #ddd6fe;
}

body.app-dark-mode .connected-share-controls select,
body.app-dark-mode .connected-share-controls input {
  border-color: rgba(139, 92, 246, 0.36);
  background: #17112f;
  color: #ffffff;
  color-scheme: dark;
}

body.app-dark-mode .connected-share-selection-toolbar strong,
body.app-dark-mode .connected-share-lead-copy strong,
body.app-dark-mode .outgoing-share-copy strong,
body.app-dark-mode .connected-share-empty strong {
  color: #ffffff;
}

body.app-dark-mode .connected-share-selection-toolbar span,
body.app-dark-mode .connected-share-lead-copy small,
body.app-dark-mode .outgoing-share-copy span,
body.app-dark-mode .connected-share-empty,
body.app-dark-mode .connected-share-empty span {
  color: #b9b2d0;
}

body.app-dark-mode .connected-share-lead-list,
body.app-dark-mode .shared-folder-empty,
body.app-dark-mode .shared-leads-empty {
  border-color: rgba(139, 92, 246, 0.25);
  background: #100c26;
}

body.app-dark-mode .connected-share-lead-row,
body.app-dark-mode .outgoing-share-row {
  border-color: rgba(139, 92, 246, 0.28);
  background: #181130;
}

body.app-dark-mode .connected-share-lead-row:hover,
body.app-dark-mode .connected-share-lead-row.selected {
  border-color: rgba(139, 92, 246, 0.72);
  background: #21184a;
}

body.app-dark-mode .connected-share-checkbox {
  border-color: rgba(139, 92, 246, 0.52);
  background: #100c26;
}

body.app-dark-mode .connected-share-count-badge {
  border-color: rgba(139, 92, 246, 0.28);
  background: #21184a;
  color: #cfc8df;
}

body.app-dark-mode .outgoing-share-icon,
body.app-dark-mode .connected-data-section-title > span {
  background: rgba(109, 53, 245, 0.22);
  color: #c4b5fd;
}

body.app-dark-mode .outgoing-share-copy small {
  color: #8f87a8;
}

body.app-dark-mode .outgoing-share-remove {
  border-color: rgba(244, 63, 94, 0.32);
  background: rgba(244, 63, 94, 0.14);
  color: #fda4af;
}

body.app-dark-mode .shared-source-card-badge.connected,
body.app-dark-mode .shared-source-type-badge.connected {
  border-color: rgba(34, 197, 94, 0.35);
  background: rgba(34, 197, 94, 0.14);
  color: #86efac;
}

body.app-dark-mode .shared-source-card-badge.manual,
body.app-dark-mode .shared-source-type-badge.manual {
  border-color: rgba(139, 92, 246, 0.40);
  background: rgba(109, 53, 245, 0.18);
  color: #ddd6fe;
}

body.app-dark-mode .shared-source-icon.connected {
  border-color: rgba(34, 197, 94, 0.32) !important;
  background: rgba(34, 197, 94, 0.14) !important;
  color: #86efac !important;
}

body.app-dark-mode .connected-shared-lead-link strong {
  color: #a78bfa;
}

body.app-dark-mode .connected-shared-lead-link small {
  color: #aaa4c1;
}

body.app-dark-mode .connected-total-calls {
  border-color: rgba(59, 130, 246, 0.32);
  background: rgba(59, 130, 246, 0.15);
  color: #93c5fd;
}

body.app-dark-mode .lead-summary-status.connected {
  border-color: rgba(34, 197, 94, 0.34) !important;
  background: rgba(34, 197, 94, 0.14) !important;
  color: #86efac !important;
}

body.app-dark-mode .connected-lead-data-dialog {
  border-color: rgba(139, 92, 246, 0.40);
  background: #120d29;
  box-shadow: 0 35px 120px rgba(0, 0, 0, 0.62);
}

body.app-dark-mode .connected-lead-data-header {
  border-bottom-color: rgba(139, 92, 246, 0.28);
  background: linear-gradient(135deg, #1b1438, #120d29);
}

body.app-dark-mode .connected-lead-data-header h2,
body.app-dark-mode .connected-data-section-title h3,
body.app-dark-mode .connected-data-field strong {
  color: #ffffff;
}

body.app-dark-mode .connected-lead-data-header span,
body.app-dark-mode .connected-data-section-title p,
body.app-dark-mode .connected-data-field span,
body.app-dark-mode .connected-data-empty {
  color: #b9b2d0;
}

body.app-dark-mode .connected-lead-data-close {
  border-color: rgba(139, 92, 246, 0.34);
  background: #21184a;
  color: #ffffff;
}

body.app-dark-mode .connected-lead-data-content {
  background: #0d091f;
}

body.app-dark-mode .connected-data-section,
body.app-dark-mode .connected-data-field,
body.app-dark-mode .connected-data-empty {
  border-color: rgba(139, 92, 246, 0.26);
  background: #17112f;
}

body.app-dark-mode .connected-data-table-wrap {
  border-color: rgba(139, 92, 246, 0.28);
}

body.app-dark-mode .connected-data-table th {
  background: #21184a;
  color: #c4b5fd;
}

body.app-dark-mode .connected-data-table td {
  border-bottom-color: rgba(139, 92, 246, 0.20);
  background: #17112f;
  color: #f3efff;
}

@media (max-width: 1180px) {
  .connected-sharing-layout {
    grid-template-columns: 1fr;
  }

  .outgoing-share-list {
    max-height: 360px;
  }
}

@media (max-width: 820px) {
  .connected-share-controls {
    grid-template-columns: 1fr;
  }

  .connected-share-lead-row {
    grid-template-columns: 22px 36px minmax(0, 1fr);
  }

  .connected-share-lead-result,
  .connected-share-count-badge {
    grid-column: 3;
    justify-self: start;
  }

  .connected-data-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .connected-share-header,
  .connected-share-selection-toolbar,
  .connected-share-submit-row,
  .connected-lead-data-header {
    align-items: stretch;
    flex-direction: column;
  }

  .connected-share-submit-row button {
    width: 100%;
  }

  .outgoing-share-row {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .outgoing-share-remove {
    grid-column: 1 / -1;
    justify-content: center;
  }

  .connected-data-grid {
    grid-template-columns: 1fr;
  }

  .connected-lead-data-modal {
    padding: 10px;
  }

  .connected-lead-data-dialog {
    max-height: calc(100vh - 20px);
    border-radius: 16px;
  }
}

/* SHARED LEAD THREE-DOT MENU VISIBILITY FIX
   The Shared Leads table shell used overflow:hidden for rounded corners.
   That clipped the action dropdown, especially when the selected Lead was
   the last visible row directly above pagination. */
#sharedAllPanel .leads-list-card,
#sharedAllPanel .all-leads-table-shell,
#sharedAllPanel .all-leads-table-area,
#sharedAllPanel .all-leads-table-area .schedule-block,
#sharedAllPanel .all-leads-table-area .schedule-table-wrap,
#sharedAllPanel .all-leads-table-area .connected-aware-shared-table,
#sharedAllPanel .all-leads-table-area .connected-aware-shared-table tbody,
#sharedAllPanel .all-leads-table-area .connected-aware-shared-table tr,
#sharedAllPanel .all-leads-table-area .connected-aware-shared-table td {
  overflow: visible !important;
}

#sharedAllPanel .all-leads-table-shell {
  position: relative;
}

/* Preserve the rounded card appearance after allowing the menu to escape. */
#sharedAllPanel .all-leads-toolbar {
  border-radius: 18px 18px 0 0;
}

#sharedAllPanel .all-leads-footer {
  position: relative;
  z-index: 1;
  border-radius: 0 0 18px 18px;
}

#sharedAllPanel .connected-aware-shared-table {
  position: relative;
  z-index: 2;
}

#sharedAllPanel .connected-aware-shared-table tr.shared-actions-row-open,
#sharedAllPanel .connected-aware-shared-table td.shared-actions-cell-open {
  position: relative;
  z-index: 9000;
}

#sharedAllPanel .shared-lead-row-actions-menu[open] {
  z-index: 9100;
}

#sharedAllPanel .shared-lead-actions-dropdown {
  z-index: 9200;
}


/* CONNECTED SHARED LEAD SALE SPLIT */
.shared-sale-split-block {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(109, 53, 245, 0.22);
  border-radius: 12px;
  background: rgba(109, 53, 245, 0.055);
}

.shared-sale-split-block.hidden {
  display: none !important;
}

.shared-sale-split-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.shared-sale-split-heading strong {
  font-size: 12px;
  font-weight: 900;
}

.shared-sale-split-heading span {
  color: #748096;
  font-size: 10px;
  font-weight: 650;
  text-align: right;
}

.shared-sale-split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.shared-sale-split-grid label {
  display: grid;
  gap: 6px;
}

.shared-sale-split-grid label > span {
  color: #5f6b7d;
  font-size: 11px;
  font-weight: 750;
}

.shared-percent-input {
  position: relative;
}

.shared-percent-input input {
  width: 100%;
  min-height: 39px;
  padding-right: 34px !important;
  font-variant-numeric: tabular-nums;
  font-weight: 850 !important;
}

.shared-percent-input small {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  color: #7c3aed;
  font-size: 12px;
  font-weight: 900;
  pointer-events: none;
}

body.app-dark-mode .shared-sale-split-block {
  border-color: rgba(139, 92, 246, 0.38);
  background: rgba(109, 53, 245, 0.10);
}

body.app-dark-mode .shared-sale-split-heading strong,
body.app-dark-mode .shared-sale-split-grid label > span {
  color: #f8f7ff;
}

body.app-dark-mode .shared-sale-split-heading span {
  color: #b9b2d0;
}

body.app-dark-mode .shared-percent-input small {
  color: #c4b5fd;
}

@media (max-width: 720px) {
  .shared-sale-split-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .shared-sale-split-heading span {
    text-align: left;
  }

  .shared-sale-split-grid {
    grid-template-columns: 1fr;
  }
}

/* WORKFLOW STANDARDIZATION: GLOBAL SAVE STATUS */
.global-save-status {
  position: fixed;
  z-index: 100000;
  top: 18px;
  right: 20px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 10px 15px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 13px;
  background: rgba(15, 23, 42, 0.96);
  color: #ffffff;
  box-shadow: 0 18px 50px rgba(2, 6, 23, 0.28);
  backdrop-filter: blur(12px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.global-save-status.hidden {
  display: none !important;
}

.global-save-status-icon {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #8b5cf6;
  box-shadow: 0 0 0 5px rgba(139, 92, 246, 0.14);
}

.global-save-status.saving .global-save-status-icon {
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #ffffff;
  background: transparent;
  box-shadow: none;
  animation: leadflow-save-spin 0.75s linear infinite;
}

.global-save-status.saved .global-save-status-icon {
  background: #22c55e;
  box-shadow: 0 0 0 5px rgba(34, 197, 94, 0.14);
}

.global-save-status.error .global-save-status-icon {
  background: #ef4444;
  box-shadow: 0 0 0 5px rgba(239, 68, 68, 0.14);
}

.global-save-status-text {
  font-size: 13px;
  font-weight: 850;
  letter-spacing: -0.01em;
}

button.is-saving {
  cursor: wait;
  opacity: 0.82;
}

@keyframes leadflow-save-spin {
  to { transform: rotate(360deg); }
}

/* SHARED LEADS: THREE CLEAR WORKSPACES */
.shared-root-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 7px;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: var(--shadow-2);
}

.shared-root-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 10px 15px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: #64748b;
  box-shadow: none;
}

.shared-root-tab svg {
  width: 16px;
  height: 16px;
}

.shared-root-tab:hover {
  color: #4f46e5;
  background: #f5f3ff;
  transform: none;
}

.shared-root-tab.active-tab {
  color: #ffffff;
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  box-shadow: 0 10px 22px rgba(109, 53, 245, 0.23);
}

.shared-root-panel {
  display: grid;
  gap: 14px;
}

body.app-dark-mode .shared-root-tabs {
  border-color: rgba(139, 92, 246, 0.30);
  background: linear-gradient(180deg, #17112f, #120d29);
}

body.app-dark-mode .shared-root-tab {
  color: #c6bfd8;
}

body.app-dark-mode .shared-root-tab:hover {
  color: #ffffff;
  background: rgba(139, 92, 246, 0.13);
}

body.app-dark-mode .shared-root-tab.active-tab {
  color: #ffffff;
  background: linear-gradient(135deg, #7242ff, #5730e8);
}

@media (max-width: 760px) {
  .global-save-status {
    top: 12px;
    right: 12px;
    left: 12px;
    justify-content: center;
  }

  .shared-root-tabs {
    display: grid;
    grid-template-columns: 1fr;
  }

  .shared-root-tab {
    width: 100%;
  }
}

/* STRUCTURED SALE DETAILS: ONLY ACTUAL SOLD ACTIVITIES */
.timeline-sale-details,
.timeline-sale-split {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-top: 5px;
  padding: 4px 8px;
  border: 1px solid rgba(109, 53, 245, 0.18);
  border-radius: 8px;
  background: #f5f3ff;
  color: #5b21b6;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

body.app-dark-mode .timeline-sale-details,
body.app-dark-mode .timeline-sale-split {
  border-color: rgba(139, 92, 246, 0.28);
  background: rgba(109, 53, 245, 0.13);
  color: #ddd6fe;
}


/* ALL LEADS THREE-DOT MENU — keep the last rows visible above pagination */
#leadsTableList .lead-actions-row-open,
#leadsTableList .lead-actions-cell-open,
#leadsTableList .lead-actions-menu[open] {
  position: relative;
  z-index: 9000;
}

#leadsTableList .lead-actions-dropdown.all-leads-floating-action-menu {
  position: fixed !important;
  z-index: 20000 !important;
  margin: 0 !important;
}

/* SHARED BY ME — GROUP ACTIVE SHARES BY CONNECTED USER */
.outgoing-recipient-grid {
  display: grid;
  gap: 10px;
}

.outgoing-recipient-card {
  width: 100%;
  min-height: 82px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto 18px;
  align-items: center;
  gap: 11px;
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 15px;
  background: #ffffff;
  color: #0f172a;
  text-align: left;
  box-shadow: none;
}

.outgoing-recipient-card:hover {
  opacity: 1;
  transform: none;
  border-color: #c4b5fd;
  background: #faf8ff;
  box-shadow: 0 10px 24px rgba(109, 53, 245, 0.09);
}

.outgoing-recipient-avatar {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(135deg, #6d35f5, #4f46e5);
  color: #ffffff;
  font-size: 13px;
  font-weight: 950;
  letter-spacing: -0.02em;
  box-shadow: 0 9px 18px rgba(109, 53, 245, 0.22);
}

.outgoing-recipient-avatar.large {
  width: 48px;
  height: 48px;
  border-radius: 15px;
  font-size: 14px;
}

.outgoing-recipient-main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.outgoing-recipient-main strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.outgoing-recipient-main small {
  overflow: hidden;
  color: #64748b;
  font-size: 9px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.outgoing-recipient-preview {
  overflow: hidden;
  color: #7c6f92;
  font-size: 9px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.outgoing-recipient-count {
  min-width: 48px;
  min-height: 44px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 1px;
  padding: 5px 8px;
  border: 1px solid #ddd6fe;
  border-radius: 12px;
  background: #f5f3ff;
  color: #5b21b6;
}

.outgoing-recipient-count strong {
  font-size: 14px;
  font-weight: 950;
  line-height: 1;
}

.outgoing-recipient-count small {
  font-size: 8px;
  font-weight: 850;
  text-transform: uppercase;
}

.outgoing-recipient-chevron {
  width: 17px;
  height: 17px;
  color: #8b5cf6;
}

.outgoing-recipient-detail {
  display: grid;
  gap: 12px;
}

.outgoing-recipient-detail-header {
  display: grid;
  grid-template-columns: 36px 48px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e5e7eb;
}

.outgoing-recipient-detail-header h3,
.outgoing-recipient-detail-header p,
.outgoing-recipient-detail-header span {
  margin: 0;
}

.outgoing-recipient-detail-header h3 {
  overflow: hidden;
  color: #0f172a;
  font-size: 15px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.outgoing-recipient-detail-header > div > span {
  display: block;
  overflow: hidden;
  margin-top: 3px;
  color: #64748b;
  font-size: 10px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.outgoing-recipient-back {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #ddd6fe;
  border-radius: 11px;
  background: #f5f3ff;
  color: #6d35f5;
}

.outgoing-recipient-back:hover {
  opacity: 1;
  transform: none;
  background: #ede9fe;
}

.outgoing-recipient-back svg {
  width: 16px;
  height: 16px;
}

.outgoing-recipient-search {
  position: relative;
  display: block;
}

.outgoing-recipient-search svg {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 15px;
  height: 15px;
  color: #8b5cf6;
  transform: translateY(-50%);
  pointer-events: none;
}

.outgoing-recipient-search input {
  width: 100%;
  min-height: 40px;
  padding: 9px 12px 9px 36px;
  border: 1px solid #d8dee8;
  border-radius: 12px;
  background: #ffffff;
  color: #0f172a;
  font: inherit;
  font-size: 11px;
}

.outgoing-recipient-leads {
  display: grid;
  gap: 8px;
}

.outgoing-recipient-lead-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  align-items: center;
  gap: 7px;
  padding: 7px;
  border: 1px solid #e5e7eb;
  border-radius: 13px;
  background: #ffffff;
}

.outgoing-recipient-lead-open {
  min-width: 0;
  display: grid;
  grid-template-columns: 35px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 9px;
  padding: 3px;
  border: 0;
  background: transparent;
  color: #0f172a;
  text-align: left;
  box-shadow: none;
}

.outgoing-recipient-lead-open:hover {
  opacity: 1;
  transform: none;
}

.outgoing-recipient-lead-open > svg {
  width: 15px;
  height: 15px;
  color: #8b5cf6;
}

.outgoing-recipient-lead-avatar {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #f4f0ff;
  color: #6d35f5;
  font-size: 10px;
  font-weight: 950;
}

.outgoing-recipient-lead-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.outgoing-recipient-lead-copy strong,
.outgoing-recipient-lead-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.outgoing-recipient-lead-copy strong {
  color: #0f172a;
  font-size: 11px;
  font-weight: 850;
}

.outgoing-recipient-lead-copy small {
  color: #64748b;
  font-size: 8px;
  font-weight: 650;
}

.outgoing-recipient-lead-remove {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #fecdd3;
  border-radius: 10px;
  background: #fff1f2;
  color: #be123c;
}

.outgoing-recipient-lead-remove:hover {
  opacity: 1;
  transform: none;
  background: #ffe4e6;
}

.outgoing-recipient-lead-remove svg {
  width: 14px;
  height: 14px;
}

.connected-share-empty.recipient-empty {
  min-height: 170px;
}

body.app-dark-mode .outgoing-recipient-card,
body.app-dark-mode .outgoing-recipient-lead-row {
  border-color: rgba(139, 92, 246, 0.30);
  background: #17112f;
}

body.app-dark-mode .outgoing-recipient-card:hover {
  border-color: rgba(139, 92, 246, 0.58);
  background: #201743;
}

body.app-dark-mode .outgoing-recipient-main strong,
body.app-dark-mode .outgoing-recipient-detail-header h3,
body.app-dark-mode .outgoing-recipient-lead-copy strong,
body.app-dark-mode .outgoing-recipient-lead-open {
  color: #ffffff;
}

body.app-dark-mode .outgoing-recipient-main small,
body.app-dark-mode .outgoing-recipient-main .outgoing-recipient-preview,
body.app-dark-mode .outgoing-recipient-detail-header > div > span,
body.app-dark-mode .outgoing-recipient-lead-copy small {
  color: #b9b2d0;
}

body.app-dark-mode .outgoing-recipient-count,
body.app-dark-mode .outgoing-recipient-back,
body.app-dark-mode .outgoing-recipient-lead-avatar {
  border-color: rgba(139, 92, 246, 0.36);
  background: #21184a;
  color: #c4b5fd;
}

body.app-dark-mode .outgoing-recipient-detail-header {
  border-bottom-color: rgba(139, 92, 246, 0.25);
}

body.app-dark-mode .outgoing-recipient-search input {
  border-color: rgba(139, 92, 246, 0.36);
  background: #100c26;
  color: #ffffff;
  -webkit-text-fill-color: #ffffff;
  color-scheme: dark;
}

body.app-dark-mode .outgoing-recipient-lead-remove {
  border-color: rgba(244, 63, 94, 0.45);
  background: rgba(190, 18, 60, 0.16);
  color: #fb7185;
}

@media (max-width: 560px) {
  .outgoing-recipient-card {
    grid-template-columns: 40px minmax(0, 1fr) auto;
  }

  .outgoing-recipient-avatar {
    width: 40px;
    height: 40px;
  }

  .outgoing-recipient-chevron {
    display: none;
  }

  .outgoing-recipient-preview {
    display: none;
  }
}

/* =========================================================
   LEADFLOW IN-APP ALERT / CONFIRM / PROMPT DIALOGS
   ========================================================= */

body.leadflow-dialog-open {
  overflow: hidden;
}

.leadflow-dialog-overlay {
  position: fixed;
  inset: 0;
  z-index: 30000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(3, 6, 23, 0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  animation: leadflowDialogFade 0.16s ease both;
}

.leadflow-dialog-overlay.hidden {
  display: none !important;
}

.leadflow-dialog-card {
  width: min(520px, calc(100vw - 32px));
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  border: 1px solid rgba(139, 92, 246, 0.44);
  border-radius: 22px;
  padding: 24px;
  color: #f8f7ff;
  background:
    radial-gradient(circle at top right, rgba(124, 58, 237, 0.22), transparent 40%),
    linear-gradient(180deg, #181132 0%, #100b25 100%);
  box-shadow: 0 34px 110px rgba(0, 0, 0, 0.58);
  animation: leadflowDialogRise 0.19s ease both;
}

.leadflow-dialog-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  margin-bottom: 17px;
  border: 1px solid rgba(139, 92, 246, 0.40);
  border-radius: 15px;
  color: #c4b5fd;
  background: rgba(109, 53, 245, 0.17);
  box-shadow: 0 12px 28px rgba(79, 70, 229, 0.18);
}

.leadflow-dialog-icon svg {
  width: 23px;
  height: 23px;
  stroke-width: 2.2;
}

.leadflow-dialog-card.tone-danger .leadflow-dialog-icon {
  color: #fb7185;
  border-color: rgba(244, 63, 94, 0.40);
  background: rgba(159, 18, 57, 0.20);
}

.leadflow-dialog-card.tone-success .leadflow-dialog-icon {
  color: #4ade80;
  border-color: rgba(34, 197, 94, 0.36);
  background: rgba(21, 128, 61, 0.18);
}

.leadflow-dialog-card.tone-warning .leadflow-dialog-icon,
.leadflow-dialog-card.tone-prompt .leadflow-dialog-icon {
  color: #fbbf24;
  border-color: rgba(245, 158, 11, 0.34);
  background: rgba(146, 64, 14, 0.18);
}

.leadflow-dialog-eyebrow {
  margin: 0 0 7px;
  color: #a78bfa;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.16em;
}

.leadflow-dialog-card h2 {
  margin: 0;
  color: #ffffff;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.035em;
}

.leadflow-dialog-message {
  margin: 10px 0 0;
  color: #c5bfd5;
  font-size: 14px;
  line-height: 1.58;
  white-space: pre-line;
}

.leadflow-dialog-input-wrap {
  display: grid;
  gap: 8px;
  margin-top: 20px;
}

.leadflow-dialog-input-wrap.hidden,
.leadflow-dialog-input-wrap .hidden,
.leadflow-dialog-actions .hidden {
  display: none !important;
}

.leadflow-dialog-input-wrap > span {
  color: #ddd6fe;
  font-size: 12px;
  font-weight: 850;
}

.leadflow-dialog-input-wrap input,
.leadflow-dialog-input-wrap textarea {
  width: 100%;
  color: #ffffff;
  border: 1px solid rgba(139, 92, 246, 0.42);
  border-radius: 12px;
  padding: 12px 13px;
  background: #0d0920;
  font: inherit;
  resize: vertical;
}

.leadflow-dialog-input-wrap input:focus,
.leadflow-dialog-input-wrap textarea:focus {
  border-color: #8b5cf6;
  box-shadow: 0 0 0 3px rgba(109, 53, 245, 0.18);
}

.leadflow-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 24px;
}

.leadflow-dialog-actions button {
  min-width: 104px;
  min-height: 43px;
  border-radius: 12px;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 900;
}

.leadflow-dialog-cancel {
  color: #e9e5f5;
  border: 1px solid rgba(139, 92, 246, 0.30);
  background: rgba(255, 255, 255, 0.055);
}

.leadflow-dialog-confirm {
  color: #ffffff;
  background: linear-gradient(135deg, #7c3aed, #4f46e5);
  box-shadow: 0 12px 26px rgba(91, 33, 182, 0.30);
}

.leadflow-dialog-confirm.danger {
  background: linear-gradient(135deg, #e11d48, #be123c);
  box-shadow: 0 12px 26px rgba(190, 18, 60, 0.28);
}

body:not(.app-dark-mode) .leadflow-dialog-overlay {
  background: rgba(15, 23, 42, 0.46);
}

body:not(.app-dark-mode) .leadflow-dialog-card {
  color: #0f172a;
  border-color: rgba(109, 53, 245, 0.26);
  background:
    radial-gradient(circle at top right, rgba(124, 58, 237, 0.10), transparent 42%),
    #ffffff;
  box-shadow: 0 34px 100px rgba(15, 23, 42, 0.25);
}

body:not(.app-dark-mode) .leadflow-dialog-card h2 {
  color: #0f172a;
}

body:not(.app-dark-mode) .leadflow-dialog-message {
  color: #52637a;
}

body:not(.app-dark-mode) .leadflow-dialog-input-wrap > span {
  color: #334155;
}

body:not(.app-dark-mode) .leadflow-dialog-input-wrap input,
body:not(.app-dark-mode) .leadflow-dialog-input-wrap textarea {
  color: #0f172a;
  border-color: #d8dee8;
  background: #ffffff;
}

body:not(.app-dark-mode) .leadflow-dialog-cancel {
  color: #334155;
  border-color: #d8dee8;
  background: #f8fafc;
}

@keyframes leadflowDialogFade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes leadflowDialogRise {
  from { opacity: 0; transform: translateY(12px) scale(0.975); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 600px) {
  .leadflow-dialog-overlay {
    align-items: end;
    padding: 12px;
  }

  .leadflow-dialog-card {
    width: 100%;
    border-radius: 20px;
    padding: 21px;
  }

  .leadflow-dialog-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .leadflow-dialog-actions button {
    width: 100%;
  }
}


/* LEADS INNER TABS + OPTIONAL CONTACT FIELDS */
.leads-root-tabs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  margin-bottom: 14px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
}

.leads-root-tab {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px;
  color: var(--muted);
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  font-weight: 850;
  cursor: pointer;
}

.leads-root-tab svg {
  width: 17px;
  height: 17px;
}

.leads-root-tab.active-tab {
  color: #ffffff;
  border-color: transparent;
  background: linear-gradient(135deg, #7042ff, #5b31ed);
  box-shadow: 0 10px 24px rgba(91, 49, 237, 0.28);
}

.leads-tab-panel {
  min-width: 0;
}

.lead-contact-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 110px;
  gap: 10px 12px;
}

.lead-email-field {
  grid-column: 1 / -1;
}

.all-leads-refresh-btn {
  min-height: 36px;
  white-space: nowrap;
}

:is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-meta {
  grid-template-columns: repeat(auto-fit, minmax(125px, max-content));
  row-gap: 14px;
}

.newly-created-lead-row {
  animation: leadflow-new-lead-highlight 2.6s ease both;
}

@keyframes leadflow-new-lead-highlight {
  0%, 55% {
    background: rgba(111, 66, 255, 0.24);
    box-shadow: inset 4px 0 0 #7c4dff;
  }
  100% {
    background: transparent;
    box-shadow: inset 0 0 0 transparent;
  }
}

body.app-dark-mode .leads-root-tabs {
  border-color: rgba(139, 92, 246, 0.32);
  background: #17112f;
}

body.app-dark-mode .leads-root-tab {
  color: #c9c1dc;
}

body.app-dark-mode .leads-root-tab:hover:not(.active-tab) {
  color: #ffffff;
  background: rgba(124, 77, 255, 0.12);
}

@media (max-width: 1320px) {
  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-meta {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }
}

@media (max-width: 720px) {
  :is(#leadDetailPage, #sharedLeadDetailPage) .lead-summary-meta {
    grid-template-columns: 1fr;
  }

  .leads-root-tabs {
    width: 100%;
  }

  .leads-root-tab {
    flex: 1;
    padding-inline: 10px;
  }

  .lead-contact-fields {
    grid-template-columns: 1fr;
  }

  .lead-email-field {
    grid-column: auto;
  }
}

/* LEADFLOW UPLINE / DOWNLINE ORGANIZATION HIERARCHY */
.organization-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 18px;
}

.organization-stats article {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel-soft);
}

.organization-stats article > span,
.organization-agency-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 12px;
  color: #6d35f5;
  background: rgba(109, 53, 245, 0.1);
}

.organization-stats strong,
.organization-stats small {
  display: block;
}

.organization-stats strong {
  font-size: 21px;
  line-height: 1;
}

.organization-stats small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.agency-create-card,
.organization-tree-card {
  margin-bottom: 18px;
}

.agency-create-card .primary-gradient-btn {
  margin-top: 14px;
}

.organization-tree {
  display: grid;
  gap: 14px;
}

.organization-empty-state {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px;
  border: 1px dashed rgba(109, 53, 245, 0.3);
  border-radius: 16px;
  background: rgba(109, 53, 245, 0.04);
}

.organization-empty-state > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 13px;
  color: #6d35f5;
  background: rgba(109, 53, 245, 0.12);
}

.organization-empty-state strong,
.organization-empty-state p {
  display: block;
  margin: 0;
}

.organization-empty-state p {
  margin-top: 4px;
  color: var(--muted);
}

.organization-agency-node {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
}

.organization-agency-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 15px 16px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, rgba(109, 53, 245, 0.09), rgba(139, 92, 246, 0.025));
}

.organization-agency-header > div:first-child {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.organization-agency-header p,
.organization-agency-header h4,
.organization-agency-header small {
  margin: 0;
}

.organization-agency-header p {
  margin-bottom: 2px;
  color: #6d35f5;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.09em;
}

.organization-agency-header h4 {
  font-size: 15px;
}

.organization-agency-header small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.organization-agency-count {
  flex: 0 0 auto;
  padding: 6px 9px;
  color: #6d35f5;
  font-size: 10px;
  font-weight: 850;
  border: 1px solid rgba(109, 53, 245, 0.22);
  border-radius: 999px;
  background: rgba(109, 53, 245, 0.07);
}

.organization-agency-users {
  padding: 14px;
}

.organization-user-branch {
  position: relative;
}

.organization-user-branch + .organization-user-branch {
  margin-top: 9px;
}

.organization-user-node {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-soft);
}

.organization-user-node-main {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}

.organization-user-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  border-radius: 50%;
  background: linear-gradient(135deg, #6d35f5, #9b5cf6);
  box-shadow: 0 6px 18px rgba(109, 53, 245, 0.16);
}

.organization-user-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}

.organization-user-node p,
.organization-user-node small {
  display: block;
  margin: 0;
  color: var(--muted);
}

.organization-user-node p {
  margin-top: 3px;
  font-size: 11px;
}

.organization-user-node small {
  margin-top: 3px;
  font-size: 10px;
}

.organization-role-badge {
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  padding: 0 7px;
  color: #6d35f5;
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border: 1px solid rgba(109, 53, 245, 0.22);
  border-radius: 999px;
  background: rgba(109, 53, 245, 0.08);
}

.organization-user-node.role-manager .organization-role-badge {
  color: #2563eb;
  border-color: rgba(37, 99, 235, 0.2);
  background: rgba(37, 99, 235, 0.07);
}

.organization-user-node.role-agent .organization-role-badge {
  color: var(--muted);
  border-color: var(--line);
  background: rgba(127, 127, 127, 0.06);
}

.organization-user-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  flex: 0 0 auto;
}

.organization-agency-action {
  color: #6d35f5 !important;
}

.organization-user-children {
  position: relative;
  display: grid;
  gap: 8px;
  margin: 8px 0 0 26px;
  padding-left: 18px;
  border-left: 2px solid rgba(109, 53, 245, 0.15);
}

.organization-user-children > .organization-user-branch::before {
  content: "";
  position: absolute;
  top: 25px;
  left: -18px;
  width: 16px;
  border-top: 2px solid rgba(109, 53, 245, 0.15);
}

.organization-child-agencies {
  display: grid;
  gap: 12px;
  margin: 0 14px 14px 32px;
  padding-left: 16px;
  border-left: 2px solid rgba(109, 53, 245, 0.18);
}

.organization-child-agencies .organization-agency-node {
  box-shadow: none;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-stats article,
body.app-dark-mode:not(.leaderboard-page-active) .organization-user-node,
body.app-dark-mode:not(.leaderboard-page-active) .organization-agency-node {
  border-color: rgba(139, 92, 246, 0.16);
  background: rgba(255, 255, 255, 0.035);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-agency-header {
  border-bottom-color: rgba(139, 92, 246, 0.16);
  background: linear-gradient(135deg, rgba(109, 53, 245, 0.13), rgba(255, 255, 255, 0.018));
}

@media (max-width: 980px) {
  .organization-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .organization-user-node,
  .organization-agency-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .organization-user-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 620px) {
  .organization-stats {
    grid-template-columns: 1fr;
  }

  .organization-user-children,
  .organization-child-agencies {
    margin-left: 12px;
    padding-left: 10px;
  }
}


/* PERSONAL INVITE + INDEPENDENT AGENCY PRIVACY MODEL */
.invite-registration-routing {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid rgba(124, 78, 255, 0.28);
  border-radius: 14px;
  background: rgba(124, 78, 255, 0.08);
  margin: 4px 0 14px;
}

.invite-registration-routing > span,
.personal-invite-routing-grid article > span,
.agency-privacy-boundary-heading > span {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  background: rgba(111, 66, 255, 0.14);
}

.invite-registration-routing svg,
.personal-invite-routing-grid svg,
.agency-privacy-boundary-heading svg {
  width: 18px;
  height: 18px;
}

.invite-registration-routing strong,
.invite-registration-routing p {
  display: block;
  margin: 0;
}

.invite-registration-routing p {
  margin-top: 4px;
  opacity: 0.72;
  line-height: 1.45;
}

.personal-invite-routing-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.personal-invite-routing-grid article {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--border-color, rgba(124, 78, 255, 0.22));
  border-radius: 16px;
  background: rgba(124, 78, 255, 0.045);
}

.personal-invite-routing-grid small,
.personal-invite-routing-grid strong {
  display: block;
}

.personal-invite-routing-grid small {
  opacity: 0.62;
  margin-bottom: 3px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.personal-invite-routing-grid strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.personal-invite-link-field {
  display: block;
  margin-bottom: 18px;
}

.personal-invite-link-field > span {
  display: block;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 8px;
}

.aggregate-only-agency {
  border-style: solid;
  border-color: rgba(126, 86, 255, 0.34);
}

.agency-privacy-boundary {
  padding: 18px;
  border-top: 1px solid rgba(124, 78, 255, 0.16);
  background: rgba(40, 24, 88, 0.045);
}

.agency-privacy-boundary-heading {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 15px;
}

.agency-privacy-boundary-heading strong,
.agency-privacy-boundary-heading p {
  display: block;
  margin: 0;
}

.agency-privacy-boundary-heading p {
  margin-top: 4px;
  opacity: 0.68;
  line-height: 1.45;
  max-width: 900px;
}

.agency-rollup-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.agency-rollup-grid article {
  padding: 12px 13px;
  border: 1px solid rgba(124, 78, 255, 0.18);
  border-radius: 13px;
  background: rgba(124, 78, 255, 0.055);
  min-width: 0;
}

.agency-rollup-grid span,
.agency-rollup-grid strong {
  display: block;
}

.agency-rollup-grid span {
  font-size: 10px;
  opacity: 0.62;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.agency-rollup-grid strong {
  margin-top: 5px;
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.app-dark-mode:not(.leaderboard-page-active) .personal-invite-routing-grid article,
body.app-dark-mode:not(.leaderboard-page-active) .invite-registration-routing,
body.app-dark-mode:not(.leaderboard-page-active) .agency-privacy-boundary,
body.app-dark-mode:not(.leaderboard-page-active) .agency-rollup-grid article {
  background: rgba(111, 66, 255, 0.08);
}

@media (max-width: 1100px) {
  .agency-rollup-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .personal-invite-routing-grid,
  .agency-rollup-grid {
    grid-template-columns: 1fr;
  }
}

/* INVITE REGISTRATION REDESIGN + REQUIRED RECOVERY EMAIL */
#loginScreen.login-screen.invite-mode {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  place-items: center;
  padding: clamp(28px, 5vw, 72px);
}

#loginScreen.login-screen.invite-mode .login-showcase,
#loginScreen.login-screen.invite-mode .login-access-card:not(.invite-registration-card) {
  display: none !important;
}

#loginScreen .invite-registration-card {
  width: min(1080px, 100%);
  max-width: 1080px;
  min-height: 650px;
  display: grid;
  grid-template-columns: minmax(320px, 0.82fr) minmax(470px, 1.18fr);
  grid-column: 1;
  justify-self: center;
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-align: left;
  color: #f8f7ff;
  border: 1px solid rgba(139, 92, 246, 0.30);
  border-radius: 28px;
  background: #0a0d29;
  box-shadow:
    0 42px 120px rgba(0, 0, 0, 0.52),
    0 0 0 1px rgba(255, 255, 255, 0.025) inset;
  backdrop-filter: blur(18px);
}

.invite-registration-welcome {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(34px, 4vw, 54px);
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 10%, rgba(139, 92, 246, 0.30), transparent 32%),
    radial-gradient(circle at 94% 88%, rgba(79, 70, 229, 0.22), transparent 30%),
    linear-gradient(160deg, #11113b 0%, #0b0d2c 54%, #090b24 100%);
  border-right: 1px solid rgba(139, 92, 246, 0.18);
}

.invite-registration-welcome::after {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  right: -190px;
  bottom: -190px;
  border-radius: 50%;
  border: 1px solid rgba(139, 92, 246, 0.22);
  box-shadow:
    0 0 0 55px rgba(124, 58, 237, 0.035),
    0 0 0 110px rgba(124, 58, 237, 0.02);
  pointer-events: none;
}

.invite-registration-brand {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 54px;
}

.invite-registration-brand-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: #ffffff;
  font-weight: 950;
  letter-spacing: -0.04em;
  border-radius: 14px;
  background: linear-gradient(145deg, #7c3aed, #5633e8);
  box-shadow: 0 14px 32px rgba(91, 33, 182, 0.34);
}

.invite-registration-brand strong,
.invite-registration-brand small {
  display: block;
}

.invite-registration-brand strong {
  color: #ffffff;
  font-size: 19px;
  line-height: 1.05;
}

.invite-registration-brand small {
  margin-top: 3px;
  color: #9e9ab5;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.14em;
}

.invite-registration-kicker {
  position: relative;
  z-index: 1;
  width: fit-content;
  padding: 7px 10px;
  color: #bda7ff;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0.16em;
  border: 1px solid rgba(139, 92, 246, 0.24);
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.10);
}

#loginScreen .invite-registration-welcome h1 {
  position: relative;
  z-index: 1;
  margin: 22px 0 14px;
  color: #ffffff;
  font-size: clamp(36px, 3.4vw, 50px);
  line-height: 1.03;
  letter-spacing: -0.052em;
}

#loginScreen .invite-registration-welcome h1 strong {
  color: #8f69ff;
}

#loginScreen .invite-registration-welcome > p {
  position: relative;
  z-index: 1;
  max-width: 380px;
  margin: 0;
  color: #aaa8bd;
  font-size: 15px;
  line-height: 1.6;
}

#loginScreen .invite-registration-routing {
  position: relative;
  z-index: 1;
  margin: 34px 0 0;
  padding: 16px;
  color: #f8f7ff;
  border-color: rgba(139, 92, 246, 0.28);
  background: rgba(139, 92, 246, 0.08);
}

#loginScreen .invite-registration-routing > span {
  color: #a98cff;
  background: rgba(139, 92, 246, 0.14);
}

#loginScreen .invite-registration-routing strong {
  color: #ffffff;
  font-size: 13px;
}

#loginScreen .invite-registration-routing p {
  color: #aaa8bd;
  font-size: 12px;
}

.invite-registration-assurance {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: auto;
  padding-top: 30px;
  color: #9290a7;
  font-size: 12px;
  line-height: 1.5;
}

.invite-registration-assurance svg {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  color: #8f69ff;
}

.invite-registration-form-panel {
  padding: clamp(34px, 4vw, 54px);
  background:
    radial-gradient(circle at 100% 0%, rgba(109, 53, 245, 0.10), transparent 30%),
    linear-gradient(160deg, rgba(12, 16, 48, 0.98), rgba(9, 12, 38, 0.99));
}

.invite-registration-form-heading > span {
  display: block;
  color: #9c7cff;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0.15em;
}

.invite-registration-form-heading h2 {
  margin: 8px 0 8px;
  color: #ffffff;
  font-size: 30px;
  letter-spacing: -0.035em;
}

#loginScreen .invite-registration-form-heading p {
  max-width: 560px;
  margin: 0 0 26px;
  color: #9794aa;
  font-size: 13px;
  line-height: 1.55;
}

.invite-registration-name-grid,
.invite-registration-password-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.invite-form-field {
  display: grid;
  gap: 8px;
  margin-top: 15px;
}

.invite-form-field > span {
  color: #eeecf8;
  font-size: 12px;
  font-weight: 850;
}

.invite-form-field > small {
  margin-top: -2px;
  color: #7f7c91;
  font-size: 10px;
  line-height: 1.4;
}

.invite-input-wrap {
  display: flex;
  align-items: center;
  min-height: 52px;
  overflow: hidden;
  border: 1px solid rgba(139, 92, 246, 0.26);
  border-radius: 12px;
  background: rgba(6, 10, 34, 0.72);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.invite-input-wrap:focus-within {
  border-color: #8b5cf6;
  background: rgba(12, 15, 46, 0.98);
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.12);
}

.invite-input-wrap > svg {
  width: 17px;
  height: 17px;
  margin-left: 16px;
  color: #858198;
  flex: 0 0 17px;
}

#loginScreen .invite-registration-card .invite-input-wrap input {
  width: 100%;
  min-width: 0;
  height: 50px;
  padding: 0 14px;
  color: #ffffff;
  font-size: 14px;
  border: 0 !important;
  border-radius: 0;
  outline: 0;
  background: transparent !important;
  box-shadow: none !important;
}

#loginScreen .invite-registration-card .invite-input-wrap input::placeholder {
  color: #6f6c80;
  opacity: 1;
}

.invite-registration-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  margin-top: 28px;
}

#loginScreen .invite-registration-card .invite-create-account-button,
#loginScreen .invite-registration-card .invite-back-login-button {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin: 0;
  border-radius: 12px;
}

#loginScreen .invite-registration-card .invite-create-account-button {
  padding: 0 22px;
  color: #ffffff;
  border: 0;
  background: linear-gradient(135deg, #7443ff, #5f35e8);
  box-shadow: 0 14px 30px rgba(91, 33, 182, 0.28);
}

#loginScreen .invite-registration-card .invite-back-login-button {
  width: auto;
  padding: 0 18px;
  color: #b7b3c8;
  border: 1px solid rgba(139, 92, 246, 0.20);
  background: rgba(255, 255, 255, 0.025);
  box-shadow: none;
}

#loginScreen .invite-registration-card .invite-create-account-button svg,
#loginScreen .invite-registration-card .invite-back-login-button svg {
  width: 17px;
  height: 17px;
}

.invite-registration-error {
  min-height: 20px;
  margin: 12px 0 0;
  color: #ff8798;
  text-align: left;
}

@media (max-width: 900px) {
  #loginScreen .invite-registration-card {
    grid-template-columns: 1fr;
    max-width: 680px;
  }

  .invite-registration-welcome {
    padding: 34px;
    border-right: 0;
    border-bottom: 1px solid rgba(139, 92, 246, 0.18);
  }

  .invite-registration-brand {
    margin-bottom: 30px;
  }

  .invite-registration-assurance {
    margin-top: 24px;
  }
}

@media (max-width: 620px) {
  #loginScreen.login-screen.invite-mode {
    padding: 18px 12px;
  }

  #loginScreen .invite-registration-card {
    border-radius: 22px;
  }

  .invite-registration-welcome,
  .invite-registration-form-panel {
    padding: 28px 22px;
  }

  .invite-registration-name-grid,
  .invite-registration-password-grid,
  .invite-registration-actions {
    grid-template-columns: 1fr;
  }

  #loginScreen .invite-registration-card .invite-back-login-button {
    width: 100%;
  }
}

/* Agency Owner configurable invite routing */
.personal-invite-config-card label {
  display: block;
  min-width: 0;
  flex: 1;
}

.personal-invite-config-card select {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 34px 0 10px;
  border: 1px solid rgba(124, 78, 255, 0.28);
  border-radius: 10px;
  background: rgba(12, 9, 38, 0.72);
  color: var(--text-color, #ffffff);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  outline: none;
}

.personal-invite-config-card select:focus {
  border-color: rgba(124, 78, 255, 0.72);
  box-shadow: 0 0 0 3px rgba(124, 78, 255, 0.12);
}

.personal-invite-config-card select:disabled {
  cursor: default;
  opacity: 0.78;
}

.personal-invite-routing-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: -2px 0 18px;
  padding: 12px 14px;
  border: 1px solid rgba(124, 78, 255, 0.18);
  border-radius: 14px;
  background: rgba(124, 78, 255, 0.055);
}

.personal-invite-routing-notice svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  margin-top: 1px;
  color: #8b63ff;
}

.personal-invite-routing-notice p {
  margin: 0;
  line-height: 1.5;
  opacity: 0.78;
}

body:not(.app-dark-mode) .personal-invite-config-card select {
  background: #ffffff;
  color: #201840;
}

@media (max-width: 900px) {
  .personal-invite-config-card select {
    height: 40px;
  }
}

/* =========================================================
   USER MANAGEMENT — ORGANIZATION-FIRST REDESIGN
   ========================================================= */
.organization-management-card {
  position: relative;
  overflow: visible;
}

.organization-management-heading {
  align-items: center;
  gap: 18px;
}

.organization-management-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 18px 0 20px;
  flex-wrap: wrap;
}

.organization-search-box {
  min-width: min(100%, 380px);
  flex: 1 1 360px;
  height: 46px;
  border: 1px solid rgba(108, 92, 231, 0.24);
  border-radius: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 8px 24px rgba(26, 20, 70, 0.05);
}

.organization-search-box svg {
  width: 18px;
  height: 18px;
  color: #7165db;
  flex: 0 0 auto;
}

.organization-search-box input {
  width: 100%;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  color: inherit;
  font: inherit;
}

.organization-filter-row {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px;
  border: 1px solid rgba(108, 92, 231, 0.18);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.58);
  overflow-x: auto;
  max-width: 100%;
}

.organization-filter-btn {
  border: 0;
  border-radius: 10px;
  padding: 9px 12px;
  font-weight: 800;
  font-size: 12px;
  color: #6f6b82;
  background: transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: 160ms ease;
}

.organization-filter-btn:hover {
  color: #493bd1;
  background: rgba(108, 92, 231, 0.08);
}

.organization-filter-btn.active {
  color: #fff;
  background: linear-gradient(135deg, #7153ee, #5a3ee7);
  box-shadow: 0 8px 18px rgba(98, 70, 229, 0.24);
}

.organization-user-node {
  cursor: pointer;
  transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
}

.organization-user-node:hover,
.organization-user-node:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(112, 83, 239, 0.42);
  box-shadow: 0 12px 30px rgba(44, 31, 104, 0.09);
  outline: none;
}

.organization-user-node.context-only-user {
  opacity: 0.72;
}

.organization-user-node.inactive-user {
  opacity: 0.66;
  border-style: dashed;
}

.organization-user-node-main {
  min-width: 0;
  flex: 1;
}

.organization-user-copy {
  min-width: 0;
}

.organization-user-copy p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.organization-branch-toggle,
.organization-row-menu,
.organization-drawer-close {
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.organization-branch-toggle {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border: 1px solid rgba(109, 53, 245, 0.42);
  border-radius: 11px;
  background: rgba(109, 53, 245, 0.15);
  color: #6538e9;
  margin-right: 6px;
  box-shadow: 0 4px 14px rgba(79, 46, 180, 0.10);
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.organization-branch-toggle:hover {
  background: rgba(109, 53, 245, 0.24);
  border-color: rgba(109, 53, 245, 0.70);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(79, 46, 180, 0.16);
}

.organization-branch-toggle:focus-visible {
  outline: 3px solid rgba(124, 92, 255, 0.26);
  outline-offset: 2px;
}

.organization-branch-toggle svg {
  width: 21px;
  height: 21px;
  stroke-width: 2.6;
}

.organization-row-menu svg,
.organization-drawer-close svg {
  width: 17px;
  height: 17px;
}

.organization-branch-toggle-spacer {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  margin-right: 6px;
}

.organization-row-menu {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 11px;
  background: rgba(112, 83, 239, 0.07);
  color: #6b55d9;
}

.organization-row-menu:hover {
  background: rgba(112, 83, 239, 0.15);
}

.organization-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.organization-status-pill.active {
  color: #157447;
  background: rgba(42, 184, 112, 0.12);
  border: 1px solid rgba(42, 184, 112, 0.2);
}

.organization-status-pill.inactive {
  color: #b34154;
  background: rgba(221, 69, 91, 0.10);
  border: 1px solid rgba(221, 69, 91, 0.18);
}

.organization-filter-empty {
  min-height: 86px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px dashed rgba(112, 83, 239, 0.24);
  border-radius: 14px;
  color: #777189;
  padding: 18px;
  text-align: center;
}

.organization-filter-empty svg {
  width: 20px;
  height: 20px;
  color: #7257e7;
}

.organization-filter-empty-large {
  min-height: 150px;
  flex-direction: column;
}

.organization-filter-empty-large svg {
  width: 28px;
  height: 28px;
}

.organization-user-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2090;
  background: rgba(8, 6, 28, 0.42);
  backdrop-filter: blur(2px);
}

.organization-user-drawer {
  position: fixed;
  z-index: 2100;
  top: 0;
  right: 0;
  width: min(430px, 94vw);
  height: 100dvh;
  display: flex;
  flex-direction: column;
  background: #fbfaff;
  border-left: 1px solid rgba(111, 83, 232, 0.24);
  box-shadow: -22px 0 60px rgba(24, 14, 70, 0.22);
  animation: organizationDrawerIn 180ms ease-out;
}

@keyframes organizationDrawerIn {
  from { transform: translateX(24px); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

.organization-user-drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 26px 24px 20px;
  border-bottom: 1px solid rgba(108, 92, 231, 0.14);
  background: linear-gradient(145deg, rgba(108, 92, 231, 0.09), rgba(255, 255, 255, 0.2));
}

.organization-user-drawer-header p,
.organization-user-drawer-header h3 {
  margin: 0;
}

.organization-user-drawer-header p {
  color: #765de8;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .15em;
}

.organization-user-drawer-header h3 {
  margin: 6px 0 9px;
  font-size: 25px;
  line-height: 1.1;
  color: #1f1837;
}

.organization-drawer-close {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  color: #6e6683;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(108, 92, 231, 0.14);
}

.organization-drawer-close:hover {
  color: #4f38d4;
  background: #fff;
}

.organization-user-drawer-body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 22px 24px;
}

.organization-drawer-profile {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border-radius: 16px;
  background: rgba(108, 92, 231, 0.07);
  border: 1px solid rgba(108, 92, 231, 0.13);
}

.organization-drawer-avatar {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 900;
  background: linear-gradient(145deg, #7958ef, #5f42df);
  box-shadow: 0 10px 22px rgba(91, 62, 216, 0.24);
}

.organization-drawer-profile strong,
.organization-drawer-profile p {
  display: block;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.organization-drawer-profile strong {
  color: #241b3d;
  font-size: 15px;
}

.organization-drawer-profile p {
  margin-top: 3px;
  color: #817a91;
  font-size: 12px;
}

.organization-drawer-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 18px;
}

.organization-drawer-info-grid article {
  min-width: 0;
  border-radius: 14px;
  padding: 13px 14px;
  background: #fff;
  border: 1px solid rgba(88, 73, 142, 0.12);
  box-shadow: 0 6px 18px rgba(28, 19, 69, 0.04);
}

.organization-drawer-info-grid span,
.organization-drawer-info-grid strong {
  display: block;
  min-width: 0;
}

.organization-drawer-info-grid span {
  color: #8c8599;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.organization-drawer-info-grid strong {
  margin-top: 6px;
  color: #27203c;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.organization-drawer-note {
  display: flex;
  gap: 11px;
  margin-top: 16px;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(181, 132, 27, 0.20);
  background: rgba(255, 192, 66, 0.08);
}

.organization-drawer-note > svg {
  width: 19px;
  height: 19px;
  color: #a46f08;
  flex: 0 0 auto;
  margin-top: 2px;
}

.organization-drawer-note strong,
.organization-drawer-note p {
  display: block;
  margin: 0;
}

.organization-drawer-note strong {
  color: #6f4d0e;
  font-size: 12px;
}

.organization-drawer-note p {
  margin-top: 4px;
  color: #8a744f;
  font-size: 11px;
  line-height: 1.45;
}

.organization-user-drawer-actions {
  flex: 0 0 auto;
  padding: 16px 24px 22px;
  display: grid;
  gap: 9px;
  border-top: 1px solid rgba(108, 92, 231, 0.14);
  background: rgba(250, 249, 255, 0.96);
}

.organization-drawer-action {
  width: 100%;
  min-height: 44px;
  border-radius: 12px;
  border: 1px solid rgba(108, 92, 231, 0.15);
  background: #fff;
  color: #342c4a;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 13px;
  font-weight: 850;
  font-size: 12px;
  cursor: pointer;
  text-align: left;
}

.organization-drawer-action svg {
  width: 17px;
  height: 17px;
  color: #7257e7;
}

.organization-drawer-action:hover {
  border-color: rgba(108, 92, 231, 0.34);
  background: rgba(108, 92, 231, 0.05);
}

.organization-drawer-action.primary {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, #7153ee, #5b3fe3);
}

.organization-drawer-action.primary svg,
.organization-drawer-action.owner svg {
  color: currentColor;
}

.organization-drawer-action.owner {
  color: #6d3dd4;
  border-color: rgba(119, 74, 221, 0.24);
  background: rgba(119, 74, 221, 0.07);
}

.organization-drawer-action.danger {
  color: #bd3d52;
  border-color: rgba(210, 64, 87, 0.22);
  background: rgba(210, 64, 87, 0.06);
}

.organization-drawer-action.danger svg {
  color: #bd3d52;
}

.organization-drawer-action.success {
  color: #13734a;
  border-color: rgba(35, 163, 102, 0.22);
  background: rgba(35, 163, 102, 0.07);
}

.organization-drawer-action.success svg {
  color: #13734a;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-search-box,
body.app-dark-mode:not(.leaderboard-page-active) .organization-filter-row {
  background: rgba(20, 15, 61, 0.72);
  border-color: rgba(126, 99, 239, 0.24);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-filter-btn {
  color: #aaa1c3;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-filter-btn:hover {
  color: #fff;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-user-drawer {
  background: #0f0a2d;
  border-left-color: rgba(131, 99, 244, 0.27);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-user-drawer-header {
  background: linear-gradient(145deg, rgba(102, 70, 224, 0.20), rgba(15, 10, 45, 0.2));
  border-bottom-color: rgba(131, 99, 244, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-user-drawer-header h3,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-profile strong,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-info-grid strong {
  color: #f7f4ff;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-close,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-profile,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-info-grid article,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-action {
  background: rgba(28, 20, 73, 0.78);
  border-color: rgba(128, 98, 236, 0.20);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-profile p,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-info-grid span {
  color: #9c92bc;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-user-drawer-actions {
  background: rgba(12, 8, 38, 0.96);
  border-top-color: rgba(131, 99, 244, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-action {
  color: #ddd7f3;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-action.primary {
  color: #fff;
  background: linear-gradient(135deg, #7652ef, #5c3ce2);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-action.owner {
  color: #bda6ff;
  background: rgba(123, 80, 224, 0.12);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-action.danger {
  color: #ff98a8;
  background: rgba(203, 60, 83, 0.10);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-action.success {
  color: #88e5b8;
  background: rgba(40, 175, 107, 0.10);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-filter-empty {
  color: #9c93b9;
  border-color: rgba(126, 99, 239, 0.22);
}

@media (max-width: 920px) {
  .organization-management-toolbar {
    align-items: stretch;
  }

  .organization-search-box,
  .organization-filter-row {
    flex-basis: 100%;
  }

  .organization-drawer-info-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .organization-management-heading {
    align-items: stretch;
  }

  .agency-owner-invite-shortcut {
    width: 100%;
    justify-content: center;
  }

  .organization-user-drawer {
    width: 100vw;
  }

  .organization-user-node {
    align-items: flex-start;
  }

  .organization-user-title-row {
    flex-wrap: wrap;
  }
}

/* =========================================================
   PASSWORD RECOVERY / RESET
   ========================================================= */
#loginScreen .password-recovery-card {
  min-height: 620px;
}

#loginScreen .password-recovery-card .login-access-logo {
  display: grid;
  place-items: center;
  color: #ffffff;
}

#loginScreen .password-recovery-card .login-access-logo svg {
  width: 34px;
  height: 34px;
  stroke: currentColor;
}

.password-recovery-kicker {
  display: block;
  margin: -6px 0 10px;
  color: #9b6cff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.7px;
}

#loginScreen .password-recovery-card > h1 {
  margin-top: 0;
}

#loginScreen .password-recovery-card > h1 + p {
  margin: 10px 0 22px;
  color: #aaa7bd;
  font-size: 14px;
  line-height: 1.6;
}

.password-recovery-note {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  margin-top: 18px;
  padding: 13px 14px;
  color: #b8b3ca;
  border: 1px solid rgba(124, 58, 237, 0.24);
  border-radius: 10px;
  background: rgba(124, 58, 237, 0.08);
  font-size: 12px;
  line-height: 1.5;
}

.password-recovery-note svg {
  width: 19px;
  height: 19px;
  margin-top: 1px;
  color: #9b6cff;
  stroke: currentColor;
}

.password-recovery-message {
  min-height: 40px;
  margin: 13px 0 0;
  color: #aaa7bd;
  text-align: center;
  font-size: 12px;
  line-height: 1.45;
}

.password-recovery-message.is-success,
#loginScreen .login-error-text.is-success {
  color: #6ee7a8;
}

.password-recovery-message.is-error {
  color: #ff7f9b;
}

#loginScreen .password-recovery-back {
  width: 100%;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 2px;
  padding: 0 14px;
  color: #aaa7bd;
  border: 0;
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
  font-size: 13px;
}

#loginScreen .password-recovery-back:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.045);
}

#loginScreen .password-recovery-back svg {
  width: 17px;
  height: 17px;
}

#loginScreen .password-recovery-card .login-submit-button:disabled {
  cursor: wait;
  opacity: 0.58;
  transform: none;
  box-shadow: none;
}

@media (max-width: 620px) {
  #loginScreen .password-recovery-card {
    min-height: 0;
  }
}

/* =========================================================
   AGENCY ORGANIZATION V2 — SCALABLE HIERARCHY / PEOPLE / AGENCIES
   ========================================================= */

.organization-v2-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.organization-v2-stats article {
  min-width: 0;
  align-items: center;
}

.organization-v2-stats article > div {
  min-width: 0;
}

.organization-v2-stats strong {
  display: block;
  line-height: 1;
}

.organization-v2-stats small {
  display: block;
  margin-top: 5px;
  font-weight: 850;
}

.organization-v2-stats em {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.organization-v2-card {
  padding: 0;
  overflow: hidden;
}

.organization-v2-heading {
  padding: 20px 22px 12px;
  margin: 0;
}

.organization-v2-primary-toolbar {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 0 22px 12px;
}

.organization-v2-search {
  width: 100%;
  min-width: 0;
}

.organization-view-tabs {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-soft);
}

.organization-view-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 36px;
  padding: 8px 14px;
  color: var(--muted);
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
}

.organization-view-tab svg {
  width: 15px;
  height: 15px;
}

.organization-view-tab.active {
  color: #fff;
  background: linear-gradient(135deg, #7652ef, #5c3ce2);
  box-shadow: 0 8px 18px rgba(109, 53, 245, 0.2);
}

.organization-v2-invite {
  white-space: nowrap;
}

.organization-v2-filterbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 12px 22px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(109, 53, 245, 0.055);
}

.organization-v2-filter-select {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 42px;
  padding: 0 10px 0 13px;
  border: 1px solid rgba(109, 53, 245, 0.22);
  border-radius: 11px;
  background: rgba(109, 53, 245, 0.075);
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
}

.organization-v2-filter-select select {
  min-width: 150px;
  max-width: 260px;
  border: 0;
  padding: 9px 32px 9px 4px;
  background: transparent;
  color: var(--text);
  font-weight: 900;
  box-shadow: none !important;
}

.organization-status-dot i {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.10);
}

.organization-v2-clear {
  padding: 8px 4px;
  color: var(--purple);
  background: transparent;
  box-shadow: none;
  font-size: 12px;
}

.organization-v2-tree {
  padding: 16px 18px 20px;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.organization-v2-shell {
  display: grid;
  gap: 12px;
}

.organization-v2-context-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  color: var(--muted);
  background: var(--panel-soft);
  font-size: 12px;
}

.organization-v2-context-strip svg {
  width: 14px;
  height: 14px;
}

.organization-v2-context-strip strong {
  color: var(--text);
}

.organization-v2-agency-branch {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.035);
}

.organization-v2-agency-branch.secondary {
  margin-top: 10px;
  box-shadow: none;
}

.organization-v2-agency-branch.secondary[data-agency-depth="1"] {
  margin-left: 30px;
}

.organization-v2-agency-branch.secondary[data-agency-depth="2"] {
  margin-left: 54px;
}

.organization-v2-agency-branch.secondary[data-agency-depth="3"] {
  margin-left: 78px;
}

.organization-v2-agency-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 68px;
  padding: 12px 14px;
  cursor: pointer;
  border-bottom: 1px solid transparent;
}

.organization-v2-agency-branch:not(.collapsed) > .organization-v2-agency-bar {
  border-bottom-color: var(--line);
}

.organization-v2-agency-branch.main > .organization-v2-agency-bar {
  background: linear-gradient(135deg, rgba(109, 53, 245, 0.07), rgba(79, 70, 229, 0.025));
}

.organization-v2-agency-main,
.organization-v2-user-main,
.organization-v2-person-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.organization-v2-agency-icon {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  color: var(--purple);
  background: rgba(109, 53, 245, 0.10);
  border: 1px solid rgba(109, 53, 245, 0.12);
}

.organization-v2-agency-icon svg {
  width: 18px;
  height: 18px;
}

.organization-v2-agency-copy,
.organization-v2-user-copy,
.organization-v2-person-cell > div {
  min-width: 0;
}

.organization-v2-agency-copy > div,
.organization-v2-user-copy > div {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.organization-v2-agency-copy strong,
.organization-v2-user-copy strong,
.organization-v2-person-cell strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 900;
}

.organization-v2-agency-copy > div > span {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 999px;
  color: var(--purple);
  background: rgba(109, 53, 245, 0.09);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.organization-v2-agency-copy p,
.organization-v2-user-copy p,
.organization-v2-person-cell small {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.organization-v2-agency-metrics {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.organization-v2-agency-metrics > span:not(.organization-v2-private-pill) {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--muted);
  background: var(--panel-soft);
  font-size: 10px;
  font-weight: 800;
}

.organization-v2-agency-metrics strong {
  color: var(--text);
  font-size: 12px;
}

.organization-v2-private-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 8px;
  border-radius: 999px;
  color: #7c3aed;
  background: rgba(124, 58, 237, 0.08);
  font-size: 10px;
  font-weight: 900;
}

.organization-v2-private-pill svg {
  width: 11px;
  height: 11px;
}

.organization-v2-agency-body {
  padding: 10px 12px 12px;
}

.organization-v2-user-tree {
  display: grid;
  gap: 4px;
}

.organization-v2-user-branch {
  position: relative;
}

.organization-v2-user-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 54px;
  padding: 7px 8px;
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  transition: 0.14s ease;
}

.organization-v2-user-row:hover {
  border-color: rgba(109, 53, 245, 0.16);
  background: rgba(109, 53, 245, 0.045);
}

.organization-v2-user-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.organization-status-dot {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
}

.organization-v2-user-children {
  position: relative;
  display: grid;
  gap: 3px;
  margin-left: 25px;
  padding-left: 18px;
}

.organization-v2-user-children::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 10px;
  left: 6px;
  width: 1px;
  background: rgba(109, 53, 245, 0.20);
}

.organization-v2-agency-children {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.organization-v2-more-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  margin: 3px 0 4px 5px;
  padding: 7px 10px;
  color: var(--muted);
  background: transparent;
  border: 1px dashed var(--line);
  box-shadow: none;
  font-size: 11px;
}

.organization-v2-more-row svg {
  width: 13px;
  height: 13px;
}

.organization-v2-view-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 4px 4px 14px;
}

.organization-v2-view-header > div span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.organization-v2-view-header > div strong {
  display: block;
  margin-top: 3px;
  color: var(--text);
  font-size: 16px;
}

.organization-v2-view-header p {
  display: flex;
  align-items: center;
  gap: 6px;
  max-width: 470px;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.organization-v2-view-header p svg {
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
}

.organization-v2-table {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}

.organization-v2-table-head,
.organization-v2-table-row {
  display: grid;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
}


.organization-v2-agency-table .organization-v2-table-head,
.organization-v2-agency-table .organization-v2-table-row {
  grid-template-columns: minmax(260px, 1.55fr) minmax(180px, 1fr) 110px 100px 38px;
}

.organization-v2-table-head {
  color: var(--muted);
  background: var(--panel-soft);
  border-bottom: 1px solid var(--line);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.organization-v2-table-row {
  min-height: 58px;
  color: var(--muted);
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  font-size: 11px;
  transition: 0.14s ease;
}

.organization-v2-table-row:last-child {
  border-bottom: 0;
}

.organization-v2-table-row:hover {
  background: rgba(109, 53, 245, 0.04);
}

.organization-v2-person-cell .organization-user-avatar {
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
}

.organization-drawer-section {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.organization-drawer-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 2px;
}

.organization-drawer-section-heading span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.organization-drawer-section-heading strong {
  display: block;
  margin-top: 2px;
  color: var(--text);
  font-size: 12px;
}

.organization-drawer-section-heading svg {
  width: 15px;
  height: 15px;
  color: var(--purple);
}

.organization-drawer-agency-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.organization-drawer-agency-summary-grid article {
  display: grid;
  gap: 4px;
  min-height: 66px;
  align-content: center;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--panel-soft);
}

.organization-drawer-agency-summary-grid span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.organization-drawer-agency-summary-grid strong {
  color: var(--text);
  font-size: 16px;
}

.organization-drawer-agency-profile .organization-drawer-avatar svg {
  width: 20px;
  height: 20px;
}

.organization-drawer-info-grid-compact {
  grid-template-columns: 1fr;
}

.organization-drawer-note-privacy {
  border-color: rgba(109, 53, 245, 0.14);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-stats em,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-agency-copy p,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-user-copy p,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-person-cell small,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-user-meta,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-view-header p,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-section-heading span,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-agency-summary-grid span {
  color: #9c93b9;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-view-tabs,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-context-strip,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-agency-branch,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-table,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-agency-summary-grid article {
  background: rgba(18, 12, 53, 0.72);
  border-color: rgba(129, 98, 235, 0.18);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-filterbar,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-table-head,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-agency-metrics > span:not(.organization-v2-private-pill) {
  background: rgba(31, 22, 76, 0.62);
  border-color: rgba(129, 98, 235, 0.16);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-agency-branch.main > .organization-v2-agency-bar {
  background: linear-gradient(135deg, rgba(106, 73, 226, 0.15), rgba(27, 17, 68, 0.28));
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-agency-copy strong,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-user-copy strong,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-person-cell strong,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-agency-metrics strong,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-view-header > div strong,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-section-heading strong,
body.app-dark-mode:not(.leaderboard-page-active) .organization-drawer-agency-summary-grid strong {
  color: #f7f4ff;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-filter-select {
  background: linear-gradient(135deg, rgba(88, 58, 176, 0.22), rgba(48, 31, 105, 0.34));
  border-color: rgba(137, 105, 245, 0.32);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-filter-select select {
  color: #f7f3ff;
  background-color: transparent;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-filter-select select option {
  color: #f7f3ff;
  background: #211750;
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-branch-toggle {
  color: #f1ebff;
  background: linear-gradient(145deg, rgba(119, 78, 244, 0.34), rgba(83, 51, 190, 0.24));
  border-color: rgba(155, 125, 255, 0.58);
  box-shadow: 0 0 0 1px rgba(112, 78, 228, 0.08), 0 6px 18px rgba(38, 20, 96, 0.28);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-branch-toggle:hover {
  color: #ffffff;
  background: linear-gradient(145deg, rgba(137, 94, 255, 0.48), rgba(94, 59, 207, 0.34));
  border-color: rgba(184, 160, 255, 0.88);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-table-row {
  border-bottom-color: rgba(129, 98, 235, 0.12);
}

body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-user-row:hover,
body.app-dark-mode:not(.leaderboard-page-active) .organization-v2-table-row:hover {
  background: rgba(111, 77, 228, 0.08);
}

@media (max-width: 1280px) {
  .organization-v2-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .organization-v2-primary-toolbar {
    grid-template-columns: 1fr auto;
  }

  .organization-view-tabs {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
  }

  .organization-view-tab {
    flex: 1;
  }

  .organization-v2-table {
    overflow-x: auto;
  }

  .organization-v2-table-head,
  .organization-v2-table-row {
    min-width: 940px;
  }
}

@media (max-width: 760px) {
  .organization-v2-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .organization-v2-primary-toolbar {
    grid-template-columns: 1fr;
  }

  .organization-v2-invite,
  .organization-view-tabs {
    width: 100%;
  }

  .organization-v2-agency-bar,
  .organization-v2-user-row,
  .organization-v2-view-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .organization-v2-agency-metrics,
  .organization-v2-user-meta {
    width: 100%;
    justify-content: flex-start;
  }

  .organization-v2-agency-branch.secondary[data-agency-depth] {
    margin-left: 14px;
  }
}


.organization-v2-filter-select.organization-v2-view-hidden {
  display: none;
}


/* AGENCY ORGANIZATION V4 — simplified stats + clearer hierarchy controls */
.organization-v2-heading h3 {
  font-size: 19px;
  letter-spacing: -0.01em;
}

.organization-v2-heading p {
  max-width: 760px;
  line-height: 1.5;
}

.organization-v2-agency-copy strong,
.organization-v2-user-copy strong {
  font-size: 13px;
}

.organization-v2-agency-copy p,
.organization-v2-user-copy p {
  margin-top: 3px;
  line-height: 1.35;
}

.organization-v2-filter-select:first-child select {
  min-width: 140px;
}

.organization-v2-filter-select:nth-child(2) select {
  min-width: 210px;
}

@media (max-width: 760px) {
  .organization-v2-filter-select,
  .organization-v2-filter-select select {
    width: 100%;
    max-width: none;
  }
}


/* =========================================================
   LEADFLOW VISUAL SYSTEM V5 — GLOBAL READABILITY + THEMES
   One typography system, one accent family, consistent light
   and dark surfaces, and stronger contrast across the CRM.
   ========================================================= */

:root {
  --lf-font: "Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
  --lf-radius-sm: 10px;
  --lf-radius-md: 14px;
  --lf-radius-lg: 18px;
  --lf-accent: #6842ed;
  --lf-accent-strong: #5731dc;
  --lf-accent-soft: #f0ecff;
  --lf-success: #168a52;
  --lf-warning: #b76a00;
  --lf-danger: #d13a54;
  --lf-info: #306ee8;
  --lf-shadow-light: 0 10px 28px rgba(15, 23, 42, 0.065);
  --lf-shadow-dark: 0 14px 34px rgba(0, 0, 0, 0.24);
}

html,
body,
button,
input,
select,
textarea {
  font-family: var(--lf-font) !important;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: -0.006em;
}

button,
input,
select,
textarea {
  font-size: 14px;
  line-height: 1.35;
}

button,
strong,
b,
label,
th {
  font-weight: 650;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  text-wrap: balance;
}

p,
small,
span,
td,
th,
label,
button,
input,
select,
textarea {
  text-shadow: none !important;
}

.main-panel small,
.sidebar small,
.settings-center small,
.organization-v2-user-meta,
.organization-v2-view-header > div span,
.organization-v2-table-head,
.organization-summary-card span,
.organization-v2-agency-copy p,
.organization-v2-user-copy p {
  font-size: 12px !important;
  line-height: 1.4 !important;
  letter-spacing: -0.005em !important;
}

.eyebrow,
[class*="-eyebrow"] {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.main-panel table th,
.main-panel [class*="table-head"] {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.035em !important;
}

.main-panel table td,
.main-panel [class*="table-row"] {
  font-size: 13px;
}

/* ---------- LIGHT THEME ---------- */
body:not(.app-dark-mode) {
  --lf-bg: #f5f7fb;
  --lf-surface: #ffffff;
  --lf-surface-raised: #ffffff;
  --lf-surface-soft: #f8fafc;
  --lf-surface-muted: #f1f4f9;
  --lf-border: #dfe5ee;
  --lf-border-strong: #cfd7e4;
  --lf-text: #101828;
  --lf-text-soft: #344054;
  --lf-muted: #667085;
  --lf-placeholder: #8a94a6;
  --bg: var(--lf-bg);
  --panel: var(--lf-surface);
  --panel-soft: var(--lf-surface-soft);
  --text: var(--lf-text);
  --muted: var(--lf-muted);
  --line: var(--lf-border);
  color: var(--lf-text);
  background: var(--lf-bg);
  color-scheme: light;
}

body:not(.app-dark-mode) .main-panel {
  color: var(--lf-text);
  background:
    radial-gradient(circle at 52% 0%, rgba(104, 66, 237, 0.045), transparent 29%),
    linear-gradient(180deg, #fbfcfe 0%, var(--lf-bg) 42%, #f3f6fb 100%) !important;
}

body:not(.app-dark-mode) .sidebar {
  color: var(--lf-text);
  background: #ffffff !important;
  border-right: 1px solid var(--lf-border) !important;
  box-shadow: 8px 0 30px rgba(15, 23, 42, 0.035);
}

body:not(.app-dark-mode) .brand-box {
  border-bottom-color: var(--lf-border) !important;
}

body:not(.app-dark-mode) .brand-box h2,
body:not(.app-dark-mode) .user-box strong {
  color: var(--lf-text) !important;
}

body:not(.app-dark-mode) .brand-box p,
body:not(.app-dark-mode) .user-box span {
  color: var(--lf-muted) !important;
}

body:not(.app-dark-mode) .user-box {
  background: #f8f9fc !important;
  border-color: var(--lf-border) !important;
  box-shadow: none !important;
}

body:not(.app-dark-mode) .user-avatar {
  color: var(--lf-accent-strong) !important;
  background: var(--lf-accent-soft) !important;
  border: 1px solid #dfd6ff;
}

body:not(.app-dark-mode) .nav-btn {
  color: #475467 !important;
}

body:not(.app-dark-mode) .nav-icon {
  color: #667085 !important;
}

body:not(.app-dark-mode) .nav-btn:hover {
  color: var(--lf-text) !important;
  background: #f4f1ff !important;
}

body:not(.app-dark-mode) .nav-btn.active-nav {
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--lf-accent), var(--lf-accent-strong)) !important;
  box-shadow: 0 8px 20px rgba(104, 66, 237, 0.20) !important;
}

body:not(.app-dark-mode) .nav-btn.active-nav .nav-icon {
  color: #ffffff !important;
}

body:not(.app-dark-mode) .nav-divider {
  background: var(--lf-border) !important;
}

body:not(.app-dark-mode) .logout-btn {
  color: #344054 !important;
  background: #f2f4f7 !important;
  border: 1px solid var(--lf-border) !important;
}

body:not(.app-dark-mode) :is(
  .stat-card,.content-card,.dashboard-card,.dashboard-insights-card,.settings-card,.settings-center-nav,.settings-panel-card,
  .leads-list-card,.lead-summary-card,.lead-log-card,.lead-next-action-card,.lead-timeline-card,.answered-main-card,.answered-preview-card,
  .tracker-hero-card,.tracker-total-card,.tracker-panel,.tracker-report-card,.shared-contact-card,.shared-folder-create-card,.shared-lead-entry-card,
  .schedule-block,.organization-v2-shell,.organization-v2-agency-branch,.organization-v2-table,.organization-user-drawer,.leadflow-dialog-card,
  .monthly-goal-card,.leaderboard-summary-card,.leaderboard-podium-stage,.leaderboard-panel
) {
  color: var(--lf-text);
  background-color: var(--lf-surface) !important;
  border-color: var(--lf-border) !important;
  box-shadow: var(--lf-shadow-light) !important;
}

body:not(.app-dark-mode) :is(
  .table-filter-row,.organization-management-toolbar,.organization-v2-filter-bar,.organization-v2-agency-bar,.organization-v2-table-head,
  .settings-tab-button,.lead-row-actions-dropdown,.lead-actions-dropdown,.today-call-actions-dropdown,.shared-lead-actions-dropdown
) {
  border-color: var(--lf-border) !important;
}

body:not(.app-dark-mode) :is(input,select,textarea,.search-input,.organization-search-box,.organization-v2-filter-select) {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  border-color: var(--lf-border-strong) !important;
  box-shadow: none !important;
}

body:not(.app-dark-mode) :is(input,textarea)::placeholder {
  color: var(--lf-placeholder) !important;
  opacity: 1;
}

body:not(.app-dark-mode) :is(.main-panel,.sidebar) :is(p,small,.muted,[class*="-meta"],[class*="-help"],[class*="-subtext"]) {
  color: var(--lf-muted);
}

body:not(.app-dark-mode) :is(.main-panel,.sidebar) :is(h1,h2,h3,h4,strong) {
  color: var(--lf-text);
}

/* ---------- DARK THEME ---------- */
body.app-dark-mode {
  --lf-bg: #08061c;
  --lf-surface: #15102f;
  --lf-surface-raised: #1b143a;
  --lf-surface-soft: #201842;
  --lf-surface-muted: #251c4c;
  --lf-border: rgba(153, 119, 242, 0.22);
  --lf-border-strong: rgba(164, 129, 255, 0.36);
  --lf-text: #f7f5ff;
  --lf-text-soft: #ded9ec;
  --lf-muted: #aaa3bf;
  --lf-placeholder: #7f7897;
  --dm-bg: var(--lf-bg);
  --dm-panel: var(--lf-surface);
  --dm-panel-strong: var(--lf-surface-raised);
  --dm-panel-soft: var(--lf-surface-soft);
  --dm-border: var(--lf-border);
  --dm-border-strong: var(--lf-border-strong);
  --dm-text: var(--lf-text);
  --dm-text-soft: var(--lf-text-soft);
  --dm-muted: var(--lf-muted);
  --dm-purple: #9a72ff;
  --dm-purple-strong: #7e55f6;
  color: var(--lf-text);
  background: var(--lf-bg);
  color-scheme: dark;
}

body.app-dark-mode .main-panel {
  color: var(--lf-text) !important;
  background:
    radial-gradient(circle at 52% 0%, rgba(119, 78, 242, 0.15), transparent 31%),
    radial-gradient(circle at 92% 10%, rgba(80, 48, 180, 0.10), transparent 25%),
    linear-gradient(160deg, #09071f 0%, #0d0927 52%, #08061d 100%) !important;
}

body.app-dark-mode .sidebar {
  color: var(--lf-text);
  background:
    radial-gradient(circle at top left, rgba(113, 72, 238, 0.16), transparent 34%),
    linear-gradient(180deg, #0b1023 0%, #0a1224 55%, #07101f 100%) !important;
  border-right-color: rgba(151, 116, 255, 0.14) !important;
}

body.app-dark-mode :is(
  .stat-card,.content-card,.dashboard-card,.dashboard-insights-card,.settings-card,.settings-center-nav,.settings-panel-card,
  .leads-list-card,.lead-summary-card,.lead-log-card,.lead-next-action-card,.lead-timeline-card,.answered-main-card,.answered-preview-card,
  .tracker-hero-card,.tracker-total-card,.tracker-panel,.tracker-report-card,.shared-contact-card,.shared-folder-create-card,.shared-lead-entry-card,
  .schedule-block,.organization-v2-shell,.organization-v2-agency-branch,.organization-v2-table,.leadflow-dialog-card,.monthly-goal-card,
  .leaderboard-summary-card,.leaderboard-podium-stage,.leaderboard-panel
) {
  color: var(--lf-text) !important;
  background-color: var(--lf-surface) !important;
  border-color: var(--lf-border) !important;
  box-shadow: var(--lf-shadow-dark) !important;
}

body.app-dark-mode :is(
  .organization-v2-agency-bar,.organization-v2-table-head,.table-filter-row,.organization-management-toolbar,.organization-v2-filter-bar,
  .lead-row-actions-dropdown,.lead-actions-dropdown,.today-call-actions-dropdown,.shared-lead-actions-dropdown,.settings-tab-button
) {
  background-color: var(--lf-surface-raised) !important;
  border-color: var(--lf-border) !important;
}

body.app-dark-mode :is(input,select,textarea,.search-input,.organization-search-box,.organization-v2-filter-select) {
  color: var(--lf-text) !important;
  background: #120d2b !important;
  border-color: var(--lf-border-strong) !important;
  box-shadow: none !important;
}

body.app-dark-mode :is(input,textarea)::placeholder {
  color: var(--lf-placeholder) !important;
  opacity: 1;
}

body.app-dark-mode :is(.main-panel,.sidebar,.organization-user-drawer) :is(p,small,.muted,[class*="-meta"],[class*="-help"],[class*="-subtext"]) {
  color: var(--lf-muted) !important;
}

body.app-dark-mode :is(.main-panel,.sidebar,.organization-user-drawer) :is(h1,h2,h3,h4,strong) {
  color: var(--lf-text) !important;
}

body.app-dark-mode .organization-user-drawer {
  background: #0f0b27 !important;
  border-left: 1px solid var(--lf-border) !important;
}

/* ---------- SHARED CONTROLS ---------- */
:is(.primary-gradient-btn,.nav-btn.active-nav,.organization-v2-view-tab.active,.organization-drawer-action.primary,.agency-owner-invite-shortcut) {
  background: linear-gradient(135deg, var(--lf-accent), var(--lf-accent-strong)) !important;
  color: #ffffff !important;
}

:is(button,input,select,textarea,[tabindex]):focus-visible {
  outline: 2px solid #8a66f7 !important;
  outline-offset: 2px;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #8a66f7 !important;
  box-shadow: 0 0 0 3px rgba(104, 66, 237, 0.14) !important;
}

button {
  font-weight: 650 !important;
  letter-spacing: -0.008em;
}

.nav-btn,
.logout-btn,
.settings-tab-button,
.organization-v2-view-tab,
.organization-filter-btn {
  font-size: 13.5px !important;
  font-weight: 650 !important;
}

.organization-branch-toggle {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(130, 91, 242, 0.50) !important;
  background: rgba(104, 66, 237, 0.14) !important;
  color: #8c65f8 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.025) !important;
}

.organization-branch-toggle:hover {
  background: rgba(104, 66, 237, 0.24) !important;
  border-color: #8c65f8 !important;
}

.organization-branch-toggle svg {
  width: 19px !important;
  height: 19px !important;
  stroke-width: 2.6 !important;
}

.organization-v2-user-row,
.organization-v2-table-row {
  min-height: 58px;
}

.organization-v2-user-copy strong,
.organization-v2-agency-copy strong,
.organization-v2-table-row strong {
  font-size: 13.5px !important;
  font-weight: 680 !important;
}

.organization-summary-card strong {
  font-size: 20px !important;
  font-weight: 700 !important;
}

.organization-summary-card span,
.organization-summary-card small {
  font-size: 11.5px !important;
  font-weight: 650 !important;
}

/* Readable menus, dialogs, drawers and forms */
.lead-row-actions-dropdown,
.lead-actions-dropdown,
.today-call-actions-dropdown,
.shared-lead-actions-dropdown {
  font-size: 13px !important;
}

.leadflow-dialog-card,
.organization-user-drawer {
  font-size: 14px;
}

.leadflow-dialog-message,
.organization-user-drawer p,
.organization-drawer-info-grid span,
.organization-drawer-info-grid strong {
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.organization-drawer-info-grid strong {
  font-weight: 650 !important;
}

/* Leaderboard follows the same theme instead of becoming a separate visual system. */
body.app-dark-mode .leaderboard-page-title h1,
body.app-dark-mode .leaderboard-summary-copy strong,
body.app-dark-mode .leaderboard-table-agent strong,
body.app-dark-mode .leaderboard-table td,
body.app-dark-mode .leaderboard-table th {
  color: var(--lf-text) !important;
}

body.app-dark-mode .leaderboard-page-title p,
body.app-dark-mode .leaderboard-summary-copy small,
body.app-dark-mode .leaderboard-table-agent small,
body.app-dark-mode .leaderboard-empty,
body.app-dark-mode .leaderboard-period-control > label {
  color: var(--lf-muted) !important;
}

body.app-dark-mode .leaderboard-table th {
  background: var(--lf-surface-raised) !important;
  border-color: var(--lf-border) !important;
}

body.app-dark-mode .leaderboard-table td,
body.app-dark-mode .leaderboard-view-all {
  border-color: var(--lf-border) !important;
}

body.app-dark-mode .leaderboard-period-select-wrap select,
body.app-dark-mode .leaderboard-date-wrap {
  color: var(--lf-text) !important;
  background: #120d2b !important;
  border-color: var(--lf-border-strong) !important;
}

body:not(.app-dark-mode) .leaderboard-page-title h1,
body:not(.app-dark-mode) .leaderboard-summary-copy strong,
body:not(.app-dark-mode) .leaderboard-table-agent strong,
body:not(.app-dark-mode) .leaderboard-table td,
body:not(.app-dark-mode) .leaderboard-table th {
  color: var(--lf-text) !important;
}

/* Scrollbars match the active theme. */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(122, 91, 214, 0.55) transparent;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background: rgba(122, 91, 214, 0.52);
  background-clip: padding-box;
}

::-webkit-scrollbar-track {
  background: transparent;
}

@media (max-width: 900px) {
  body { font-size: 13.5px; }
  .main-panel small,
  .sidebar small { font-size: 11.5px !important; }
}


/* =========================================================
   LEADFLOW VISUAL SYSTEM V6 — READABILITY + TRUE THEME PASS
   Fixes discovered during live browser review:
   - login inputs no longer inherit the authenticated light theme
   - leaderboard podium values stay above the decorative platforms
   - light mode clears legacy dark gradients instead of only changing
     background-color beneath them
   - light/dark controls, dialogs, dropdowns and tables use one surface
     family with stronger text contrast
   ========================================================= */

/* ---------- CRISPER, EASIER-TO-READ TYPE ---------- */
body {
  letter-spacing: 0 !important;
  font-kerning: normal;
  font-feature-settings: "kern" 1, "liga" 1;
}

#appScreen {
  font-size: 14.5px;
  line-height: 1.5;
}

#appScreen :is(p, small, .muted, [class*="-meta"], [class*="-help"], [class*="-subtext"]) {
  line-height: 1.48 !important;
}

#appScreen :is(button, input, select, textarea) {
  font-size: 14px;
}

#appScreen :is(.main-panel small, .sidebar small, .settings-center small, .organization-v2-user-meta,
  .organization-v2-view-header > div span, .organization-v2-table-head, .organization-summary-card span,
  .organization-v2-agency-copy p, .organization-v2-user-copy p) {
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}

#appScreen table td {
  font-size: 13.5px;
}

#appScreen table th,
#appScreen [class*="table-head"] {
  font-size: 12px !important;
  line-height: 1.35 !important;
}

/* ---------- LOGIN IS ITS OWN DARK EXPERIENCE ----------
   The login page intentionally does not use the signed-in user's theme.
   V5's light-theme input rule was leaking into it and making the fields
   white inside the dark sign-in card. */
#loginScreen .login-input-wrap {
  background: rgba(10, 15, 48, 0.82) !important;
  border-color: rgba(139, 92, 246, 0.42) !important;
}

#loginScreen .login-input-wrap:focus-within {
  background: rgba(17, 20, 59, 0.96) !important;
  border-color: #8b5cf6 !important;
}

#loginScreen .login-input-wrap input {
  color: #ffffff !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color-scheme: dark !important;
}

#loginScreen .login-input-wrap input::placeholder {
  color: #9a96ae !important;
  opacity: 1 !important;
}

#loginScreen .login-password-toggle {
  color: #b6b1c8 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#loginScreen .login-field > span,
#loginScreen .login-feature-list strong,
#loginScreen .login-access-card > h1 {
  color: #ffffff !important;
}

/* Invitation / reset controls shown inside the login surface follow the
   same deliberate dark-login palette, regardless of account theme. */
#loginScreen :is(.invite-input-wrap, .password-reset-input-wrap) {
  background: rgba(8, 12, 40, 0.86) !important;
  border-color: rgba(139, 92, 246, 0.34) !important;
}

#loginScreen :is(.invite-input-wrap input, .invite-input-wrap select,
  .password-reset-input-wrap input, .password-reset-input-wrap textarea) {
  color: #ffffff !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color-scheme: dark !important;
}

/* ---------- LEADERBOARD PODIUM CONTENT MUST NEVER BE COVERED ---------- */
body.leaderboard-page-active .leaderboard-agent-metrics {
  position: relative !important;
  z-index: 12 !important;
  margin-top: auto !important;
  padding-top: 13px !important;
  padding-bottom: 2px !important;
  min-height: 72px !important;
}

body.leaderboard-page-active .leaderboard-agent-metrics strong {
  position: relative !important;
  z-index: 13 !important;
  line-height: 1.15 !important;
}

/* Put the metallic platform immediately BELOW the card instead of over
   the metrics. This fixes #2 AP / Policies Sold being visually covered. */
body.leaderboard-page-active .leaderboard-reference-platform-rank-2,
body.leaderboard-page-active .leaderboard-reference-platform-rank-3 {
  bottom: -39px !important;
}

body.leaderboard-page-active .leaderboard-reference-platform-rank-1 {
  bottom: -51px !important;
}

/* ---------- TRUE LIGHT THEME ---------- */
body:not(.app-dark-mode) {
  --lf-bg: #f4f6fa;
  --lf-surface: #ffffff;
  --lf-surface-raised: #ffffff;
  --lf-surface-soft: #f8f9fc;
  --lf-surface-muted: #f1f3f8;
  --lf-border: #dce2eb;
  --lf-border-strong: #cbd4e1;
  --lf-text: #0f1728;
  --lf-text-soft: #344054;
  --lf-muted: #596579;
  --lf-placeholder: #778397;
}

body:not(.app-dark-mode) #appScreen {
  color: var(--lf-text) !important;
  background: var(--lf-bg) !important;
}

body:not(.app-dark-mode) #appScreen .main-panel {
  color: var(--lf-text) !important;
  background:
    radial-gradient(circle at 55% -8%, rgba(104,66,237,.055), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #f7f8fb 36%, #f3f5f9 100%) !important;
}

body:not(.app-dark-mode) #appScreen .sidebar {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  border-right-color: var(--lf-border) !important;
}

/* Clear legacy dark gradients from actual content surfaces. Using the
   background shorthand is intentional: background-color alone leaves an
   older background-image visible. */
body:not(.app-dark-mode) #appScreen :is(
  .stat-card,
  .content-card,
  .dashboard-card,
  .dashboard-insights-card,
  .settings-card,
  .settings-center-nav,
  .settings-panel-card,
  .leads-list-card,
  .lead-summary-card,
  .lead-log-card,
  .lead-next-action-card,
  .lead-timeline-card,
  .answered-main-card,
  .answered-preview-card,
  .tracker-hero-card,
  .tracker-total-card,
  .tracker-panel,
  .tracker-report-card,
  .shared-contact-card,
  .shared-folder-create-card,
  .shared-lead-entry-card,
  .shared-source-card,
  .schedule-block,
  .organization-v2-shell,
  .organization-v2-agency-branch,
  .organization-v2-table,
  .organization-user-drawer,
  .organization-drawer-profile,
  .leadflow-dialog-card,
  .monthly-goal-card,
  .modal-content,
  .today-call-modal-card,
  .schedule-activity-dialog,
  .connected-lead-data-dialog,
  .user-editor-dialog,
  .personal-invite-config-card
) {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  border-color: var(--lf-border) !important;
  box-shadow: var(--lf-shadow-light) !important;
}

/* Special content cards can still have personality, but stay inside the
   same light system instead of switching to a dark surface. */
body:not(.app-dark-mode) #appScreen #dashboardPage > .dashboard-coach-card {
  color: var(--lf-text) !important;
  background:
    radial-gradient(circle at 92% 0%, rgba(104,66,237,.10), transparent 34%),
    linear-gradient(145deg, #ffffff, #faf9ff) !important;
  border-color: #ded5ff !important;
  box-shadow: var(--lf-shadow-light) !important;
}

body:not(.app-dark-mode) #appScreen #dashboardPage > .dashboard-coach-card :is(h1,h2,h3,h4,strong) {
  color: var(--lf-text) !important;
}

body:not(.app-dark-mode) #appScreen #dashboardPage > .dashboard-coach-card :is(p,small,span) {
  color: var(--lf-muted) !important;
}

body:not(.app-dark-mode) #appScreen .monthly-goal-card.monthly-goal-completed {
  color: var(--lf-text) !important;
  background:
    radial-gradient(circle at 90% 8%, rgba(250,204,21,.11), transparent 30%),
    radial-gradient(circle at 8% 100%, rgba(34,197,94,.07), transparent 30%),
    #ffffff !important;
}

/* Common secondary controls / dropdowns / editing surfaces. */
body:not(.app-dark-mode) #appScreen :is(
  .state-dropdown-list,
  .state-option,
  .tracker-range-btn,
  .tracker-view-tab,
  .tracker-report-textarea,
  .lead-actions-dropdown,
  .today-call-actions-dropdown,
  .shared-lead-actions-dropdown,
  .lead-row-actions-dropdown,
  .organization-v2-filter-select,
  .organization-search-box,
  .leaderboard-custom-value-wrap,
  .global-save-status
) {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  border-color: var(--lf-border-strong) !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.07) !important;
}

body:not(.app-dark-mode) #appScreen .tracker-report-textarea {
  color: var(--lf-text) !important;
  caret-color: var(--lf-accent) !important;
}

body:not(.app-dark-mode) #appScreen :is(
  .table-filter-row,
  .organization-management-toolbar,
  .organization-v2-filter-bar,
  .organization-v2-agency-bar,
  .organization-v2-table-head,
  .settings-tab-button:not(.active),
  .performance-tab:not(.active),
  .schedule-tabs button:not(.active),
  .unanswered-filters button:not(.active)
) {
  color: var(--lf-text-soft) !important;
  background: var(--lf-surface-soft) !important;
  border-color: var(--lf-border) !important;
}

body:not(.app-dark-mode) #appScreen :is(input,select,textarea) {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  border-color: var(--lf-border-strong) !important;
  color-scheme: light !important;
}

body:not(.app-dark-mode) #appScreen :is(input,textarea)::placeholder {
  color: var(--lf-placeholder) !important;
  opacity: 1 !important;
}

body:not(.app-dark-mode) #appScreen :is(h1,h2,h3,h4,h5,h6,strong,.table-title,.card-title) {
  color: var(--lf-text) !important;
}

body:not(.app-dark-mode) #appScreen :is(p,small,.muted,[class*="-meta"],[class*="-help"],[class*="-subtext"]) {
  color: var(--lf-muted) !important;
}

body:not(.app-dark-mode) #appScreen table :is(td,th) {
  color: var(--lf-text-soft) !important;
  border-color: var(--lf-border) !important;
}

body:not(.app-dark-mode) #appScreen table thead th {
  color: #344054 !important;
  background: #f6f8fb !important;
}

/* ---------- LIGHT LEADERBOARD: NO DARK THEME LEAKAGE ---------- */
body:not(.app-dark-mode).leaderboard-page-active,
body:not(.app-dark-mode).leaderboard-page-active #appScreen,
body:not(.app-dark-mode).leaderboard-page-active .main-panel {
  color: var(--lf-text) !important;
  background: var(--lf-bg) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .top-header .eyebrow {
  color: var(--lf-accent-strong) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .top-header h1 {
  color: var(--lf-text) !important;
  text-shadow: none !important;
}

body:not(.app-dark-mode).leaderboard-page-active .top-header p {
  color: var(--lf-muted) !important;
}

body:not(.app-dark-mode).leaderboard-page-active :is(.notification-pill,.top-pill,.profile-pill) {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  border-color: var(--lf-border) !important;
  box-shadow: var(--lf-shadow-light) !important;
  backdrop-filter: none !important;
}

body:not(.app-dark-mode).leaderboard-page-active :is(.top-pill strong,.profile-pill strong) {
  color: var(--lf-text) !important;
}

body:not(.app-dark-mode).leaderboard-page-active :is(.top-pill span,.profile-pill span) {
  color: var(--lf-muted) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-summary-card {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  border-color: var(--lf-border) !important;
  box-shadow: var(--lf-shadow-light) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-summary-copy small,
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-period-control > label {
  color: var(--lf-muted) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-summary-copy strong {
  color: var(--lf-text) !important;
  text-shadow: none !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-period-select-wrap select,
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-date-wrap,
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-custom-value-wrap {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  border-color: var(--lf-border-strong) !important;
  box-shadow: none !important;
  color-scheme: light !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-date-wrap input {
  color: var(--lf-text) !important;
  color-scheme: light !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-stage {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(104,66,237,.09), transparent 45%),
    linear-gradient(180deg, #ffffff, #faf9ff) !important;
  border-color: #ddd5f8 !important;
  box-shadow: var(--lf-shadow-light) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-stage::before {
  opacity: .12 !important;
  filter: none !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-stage::after {
  opacity: .12 !important;
  filter: none !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-card,
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-card.rank-1,
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-card.rank-3 {
  color: var(--lf-text) !important;
  background: #ffffff !important;
  box-shadow: 0 14px 30px rgba(15,23,42,.09) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-card.rank-1 {
  background: linear-gradient(180deg, #fffdf7, #ffffff) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-card.rank-3 {
  background: linear-gradient(180deg, #fffaf7, #ffffff) !important;
}

body:not(.app-dark-mode).leaderboard-page-active :is(
  .leaderboard-agent-heading strong,
  .leaderboard-agent-metrics strong,
  .leaderboard-table-agent strong,
  .leaderboard-table td,
  .leaderboard-table th
) {
  color: var(--lf-text) !important;
  text-shadow: none !important;
}

body:not(.app-dark-mode).leaderboard-page-active :is(
  .leaderboard-agent-heading span,
  .leaderboard-agent-metrics span,
  .leaderboard-table-agent small,
  .leaderboard-empty
) {
  color: var(--lf-muted) !important;
  text-shadow: none !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-agent-metrics,
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-agent-metrics > div + div {
  border-color: var(--lf-border) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-panel {
  background: #ffffff !important;
  border-color: var(--lf-border) !important;
  box-shadow: var(--lf-shadow-light) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-table th {
  background: #f6f8fb !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-table td {
  background: #ffffff !important;
  border-color: var(--lf-border) !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-table tr:hover td {
  background: #f8f6ff !important;
}

body:not(.app-dark-mode).leaderboard-page-active .leaderboard-view-all {
  color: var(--lf-accent-strong) !important;
  background: #faf9ff !important;
  border-color: var(--lf-border) !important;
}

/* ---------- CONNECTED DARK THEME ---------- */
body.app-dark-mode {
  --lf-muted: #bbb5cc;
  --lf-placeholder: #938ca8;
}

body.app-dark-mode #appScreen :is(
  .state-dropdown-list,
  .state-option,
  .tracker-range-btn,
  .tracker-view-tab,
  .tracker-report-textarea,
  .modal-content,
  .today-call-modal-card,
  .schedule-activity-dialog,
  .connected-lead-data-dialog,
  .user-editor-dialog,
  .shared-lead-actions-dropdown,
  .lead-row-actions-dropdown,
  .lead-actions-dropdown,
  .today-call-actions-dropdown,
  .personal-invite-config-card,
  .global-save-status
) {
  color: var(--lf-text) !important;
  background: var(--lf-surface-raised) !important;
  border-color: var(--lf-border) !important;
  box-shadow: var(--lf-shadow-dark) !important;
}

body.app-dark-mode #appScreen :is(
  .tracker-report-textarea,
  .today-call-modal-field select,
  .today-call-modal-field textarea,
  .schedule-activity-grid input,
  .schedule-activity-grid select,
  .schedule-activity-note textarea,
  .connected-share-controls select,
  .connected-share-controls input,
  .personal-invite-config-card select
) {
  color: var(--lf-text) !important;
  background: #120d2b !important;
  border-color: var(--lf-border-strong) !important;
  color-scheme: dark !important;
}

body.app-dark-mode #appScreen :is(
  .state-option,
  .tracker-range-btn,
  .tracker-view-tab,
  .lead-actions-dropdown button,
  .today-call-actions-dropdown button,
  .shared-lead-actions-dropdown button,
  .lead-row-actions-dropdown button
) {
  color: var(--lf-text-soft) !important;
}

body.app-dark-mode #appScreen :is(
  .state-option:hover,
  .tracker-range-btn:hover,
  .tracker-view-tab:hover,
  .lead-actions-dropdown button:hover,
  .today-call-actions-dropdown button:hover,
  .shared-lead-actions-dropdown button:hover,
  .lead-row-actions-dropdown button:hover
) {
  color: #ffffff !important;
  background: var(--lf-surface-muted) !important;
}

/* Keep semantic colors purposeful and consistent across both themes. */
#appScreen :is(.status-active,.organization-status-pill.active,.result-pill.sold,.schedule-status-done) {
  --lf-semantic: var(--lf-success);
}

#appScreen :is(.danger,.status-error,.result-pill.declined) {
  --lf-semantic: var(--lf-danger);
}

@media (max-width: 900px) {
  #appScreen { font-size: 14px; }
  #appScreen :is(.main-panel small,.sidebar small) { font-size: 12px !important; }
}

/* =========================================================
   LEADFLOW VISUAL SYSTEM V7 — LIGHT SELECTION + METRIC ALIGNMENT
   Live-browser fixes:
   - active/selected controls remain clearly readable in light mode
   - leaderboard metric values stay on one aligned baseline even when
     Spanish labels wrap to two lines
   - Agent Tracker total metrics get visible card outlines and readable
     labels in the white theme
   ========================================================= */

/* ---------- LIGHT THEME: OBVIOUS, READABLE SELECTED STATES ---------- */
body:not(.app-dark-mode) #appScreen :is(
  .settings-tab-button.active,
  .tracker-range-btn.active-tab,
  .tracker-view-tab.active-tab,
  .performance-tab.active-tab,
  #todayCallsPage .schedule-tabs .active-tab,
  #schedulePage .schedule-tabs .active-tab,
  .organization-v2-view-tab.active,
  .organization-filter-btn.active
) {
  color: #ffffff !important;
  background: linear-gradient(135deg, #7047f7 0%, #5b35e8 100%) !important;
  border-color: #6840ef !important;
  box-shadow:
    0 8px 18px rgba(91, 53, 232, 0.22),
    inset 0 0 0 1px rgba(255,255,255,0.14) !important;
}

body:not(.app-dark-mode) #appScreen :is(
  .settings-tab-button.active,
  .tracker-range-btn.active-tab,
  .tracker-view-tab.active-tab,
  .performance-tab.active-tab,
  #todayCallsPage .schedule-tabs .active-tab,
  #schedulePage .schedule-tabs .active-tab,
  .organization-v2-view-tab.active,
  .organization-filter-btn.active
) :is(strong,span,small,svg,i) {
  color: #ffffff !important;
  stroke: currentColor;
}

body:not(.app-dark-mode) #appScreen .settings-tab-button.active small {
  color: #eeeaff !important;
  opacity: 0.94 !important;
}

body:not(.app-dark-mode) #appScreen .settings-tab-button.active > span {
  color: #ffffff !important;
  background: rgba(255,255,255,0.15) !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
}

/* Give non-selected settings choices a stronger white-card identity so
   the selected purple item reads as intentional instead of blending in. */
body:not(.app-dark-mode) #appScreen .settings-tab-button:not(.active) {
  color: #25324a !important;
  background: #f8f9fc !important;
  border-color: #d9e0ea !important;
  box-shadow: 0 1px 0 rgba(15,23,42,.02) !important;
}

body:not(.app-dark-mode) #appScreen .settings-tab-button:not(.active):hover {
  color: #1d153c !important;
  background: #f3efff !important;
  border-color: #cfc2fb !important;
}

body:not(.app-dark-mode) #appScreen .settings-tab-button:not(.active) strong {
  color: #1f2937 !important;
}

body:not(.app-dark-mode) #appScreen .settings-tab-button:not(.active) small {
  color: #526176 !important;
}

/* Native selects/filters: stronger edge, less washed-out text. */
body:not(.app-dark-mode) #appScreen :is(
  .leaderboard-period-select-wrap,
  .organization-v2-filter-select,
  .tracker-week-wrap select,
  .settings-preference-item select,
  .settings-form-grid select
) {
  border-color: #c8d1df !important;
}

body:not(.app-dark-mode) #appScreen :is(
  .leaderboard-period-select-wrap select,
  .organization-v2-filter-select,
  .tracker-week-wrap select,
  .settings-preference-item select,
  .settings-form-grid select
) {
  color: #172033 !important;
  font-weight: 650 !important;
  background: #ffffff !important;
}

/* ---------- LEADERBOARD: LANGUAGE-INDEPENDENT METRIC ALIGNMENT ----------
   Spanish "Pólizas Vendidas" uses two lines. Both metric labels reserve
   the same two-line label area, so AP and sold-policy numbers always sit
   on the same baseline and never get pushed down by translation length. */
body.leaderboard-page-active .leaderboard-agent-metrics {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) !important;
  align-items: stretch !important;
  min-height: 84px !important;
  padding-top: 12px !important;
  padding-bottom: 5px !important;
}

body.leaderboard-page-active .leaderboard-agent-metrics > div {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 0 9px !important;
}

body.leaderboard-page-active .leaderboard-agent-metrics span {
  width: 100% !important;
  min-height: 30px !important;
  margin: 0 0 4px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1.25 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

body.leaderboard-page-active .leaderboard-agent-metrics strong {
  margin-top: 0 !important;
  flex: 0 0 auto !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

/* ---------- AGENT TRACKER: VISIBLE LIGHT-THEME METRIC CARDS ---------- */
body:not(.app-dark-mode) #appScreen .tracker-total-card {
  background:
    radial-gradient(circle at 96% 0%, rgba(104,66,237,.07), transparent 31%),
    #ffffff !important;
  border: 1px solid #d7deea !important;
  box-shadow: 0 12px 28px rgba(15,23,42,.065) !important;
}

body:not(.app-dark-mode) #appScreen .tracker-total-header span {
  color: #7652ef !important;
}

body:not(.app-dark-mode) #appScreen .tracker-total-header h2 {
  color: #111827 !important;
}

body:not(.app-dark-mode) #appScreen .tracker-total-header p {
  color: #526176 !important;
}

body:not(.app-dark-mode) #appScreen .tracker-total-badge {
  color: #4b2fc6 !important;
  background: #f1edff !important;
  border: 1px solid #d9ceff !important;
}

body:not(.app-dark-mode) #appScreen .tracker-total-grid > div {
  min-height: 82px !important;
  background: linear-gradient(180deg, #fbfcff 0%, #f7f8fc 100%) !important;
  border: 1px solid #d7deea !important;
  border-radius: 14px !important;
  box-shadow:
    0 2px 7px rgba(15,23,42,.035),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}

body:not(.app-dark-mode) #appScreen .tracker-total-grid > div:hover {
  border-color: #c7b9f7 !important;
  background: #faf8ff !important;
}

body:not(.app-dark-mode) #appScreen .tracker-total-grid span {
  color: #526176 !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
}

body:not(.app-dark-mode) #appScreen .tracker-total-grid strong {
  color: #101828 !important;
  font-size: 25px !important;
  font-weight: 720 !important;
}

/* Tracker secondary tab selection gets the same clear selected language. */
body:not(.app-dark-mode) #appScreen .tracker-view-tab:not(.active-tab),
body:not(.app-dark-mode) #appScreen .tracker-range-btn:not(.active-tab) {
  color: #344054 !important;
  background: #ffffff !important;
  border-color: #ccd5e2 !important;
}

body:not(.app-dark-mode) #appScreen .tracker-view-tab:not(.active-tab):hover,
body:not(.app-dark-mode) #appScreen .tracker-range-btn:not(.active-tab):hover {
  color: #4b2fc6 !important;
  background: #f7f4ff !important;
  border-color: #c9bbf8 !important;
}

/* =========================================================
   LEADFLOW VISUAL SYSTEM V8 — LEADERBOARD REFERENCE LOCK
   Live reference: restore the podium geometry that matched the
   approved dark-theme screenshot, and keep that exact geometry
   identical in English/Spanish and light/dark themes.

   Important:
   - Theme may change colors only; never podium dimensions/position.
   - Translation may change text only; never metric/card geometry.
   - Third place is intentionally a little smaller than second.
   ========================================================= */

/* Lock the desktop stage and grid back to the approved proportions. */
@media (min-width: 961px) {
  body.leaderboard-page-active .leaderboard-podium-stage {
    min-height: 392px !important;
    height: 392px !important;
    padding: 16px 32px 44px !important;
    overflow: hidden !important;
  }

  body.leaderboard-page-active .leaderboard-podium {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr) minmax(0, 1fr) !important;
    align-items: end !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 1080px !important;
    margin: 0 auto !important;
    padding: 24px 42px 0 !important;
    box-sizing: border-box !important;
  }

  /* #2 — approved reference size. */
  body.leaderboard-page-active .leaderboard-podium-card.rank-2 {
    height: 248px !important;
    min-height: 248px !important;
    padding: 28px 24px 20px !important;
  }

  /* #1 — approved champion size. */
  body.leaderboard-page-active .leaderboard-podium-card.rank-1 {
    height: 298px !important;
    min-height: 298px !important;
    padding: 38px 26px 18px !important;
  }

  /* #3 — intentionally a little smaller than #2. */
  body.leaderboard-page-active .leaderboard-podium-card.rank-3 {
    height: 240px !important;
    min-height: 240px !important;
    padding: 30px 24px 18px !important;
  }

  /* Restore the approved platform relationship to the card border.
     V6/V7 pushed these farther down while compensating for taller metrics;
     that made the card outline appear to creep upward. */
  body.leaderboard-page-active .leaderboard-reference-platform-rank-2,
  body.leaderboard-page-active .leaderboard-reference-platform-rank-3 {
    bottom: -32px !important;
    height: 40px !important;
  }

  body.leaderboard-page-active .leaderboard-reference-platform-rank-1 {
    bottom: -41px !important;
    height: 52px !important;
  }
}

/* Restore the original compact metric block. No auto-push, no artificial
   minimum height, and no translation-dependent movement. */
body.leaderboard-page-active .leaderboard-agent-metrics {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 1.5fr 1fr !important;
  align-items: start !important;
  border-top-width: 1px !important;
  margin-top: 3px !important;
  padding-top: 17px !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  flex: 0 0 auto !important;
}

body.leaderboard-page-active .leaderboard-agent-metrics > div {
  min-width: 0 !important;
  display: block !important;
  padding: 0 10px !important;
  text-align: center !important;
}

body.leaderboard-page-active .leaderboard-agent-metrics span {
  display: block !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 0 5px !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

/* Spanish is slightly longer, so reduce only the label font a fraction.
   The text remains one line and the values never move vertically. */
html[lang="es"] body.leaderboard-page-active .leaderboard-agent-metrics span {
  font-size: 10.4px !important;
  letter-spacing: -0.08px !important;
}

body.leaderboard-page-active .leaderboard-agent-metrics strong {
  display: block !important;
  margin-top: 0 !important;
  font-size: 20px !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  position: relative !important;
  z-index: 13 !important;
}

/* The third-place metrics use the same compact metric geometry. */
body.leaderboard-page-active .leaderboard-podium-card.rank-3 .leaderboard-agent-metrics {
  margin-top: 3px !important;
  padding-top: 15px !important;
  min-height: 0 !important;
}

/* The light theme changes color only. Geometry above is shared verbatim. */
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-card.rank-2,
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-card.rank-1,
body:not(.app-dark-mode).leaderboard-page-active .leaderboard-podium-card.rank-3 {
  transform: none !important;
}

/* =========================================================
   LEADFLOW VISUAL SYSTEM V9 — SIDE PODIUM METRIC CLEARANCE
   Keep the approved V8 podium card/platform geometry untouched.
   Only tighten internal spacing for #2 and #3 so AP / Policies Sold
   sit safely above the metallic platform like the #1 card.
   ========================================================= */
@media (min-width: 961px) {
  body.leaderboard-page-active .leaderboard-podium-card.rank-2,
  body.leaderboard-page-active .leaderboard-podium-card.rank-3 {
    gap: 6px !important;
  }

  body.leaderboard-page-active .leaderboard-podium-card.rank-2 .leaderboard-agent-metrics,
  body.leaderboard-page-active .leaderboard-podium-card.rank-3 .leaderboard-agent-metrics {
    margin-top: 0 !important;
    transform: translateY(-4px) !important;
  }
}


/* =========================================================
   LEADFLOW VISUAL SYSTEM V10 — CLEAN LOGIN FOCUS
   Keep the login field as one single control. The input itself
   never draws a second outline/glow inside the wrapper, and the
   primary sign-in fields opt out of browser/password-manager
   suggestion styling as much as browsers allow.
   ========================================================= */

#loginScreen .login-input-wrap,
#loginScreen .login-input-wrap:focus,
#loginScreen .login-input-wrap:focus-within {
  outline: none !important;
}

#loginScreen .login-input-wrap:focus-within {
  border-color: rgba(139, 92, 246, 0.78) !important;
  box-shadow: none !important;
}

#loginScreen .login-input-wrap input,
#loginScreen .login-input-wrap input:focus,
#loginScreen .login-input-wrap input:focus-visible,
#loginScreen .login-input-wrap input:active {
  appearance: none !important;
  -webkit-appearance: none !important;
  outline: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

#loginScreen .login-input-wrap input:-webkit-autofill,
#loginScreen .login-input-wrap input:-webkit-autofill:hover,
#loginScreen .login-input-wrap input:-webkit-autofill:focus,
#loginScreen .login-input-wrap input:-webkit-autofill:active {
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ffffff !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: 0 0 0 1000px rgba(10, 15, 48, 0.98) inset !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(10, 15, 48, 0.98) inset !important;
}

#loginScreen input::-ms-reveal,
#loginScreen input::-ms-clear {
  display: none;
}


/* CSP-safe reusable spacing for empty/error messages */
.csp-padded-message {
  padding: 16px;
}

/* CSP-SAFE MONTHLY GOAL CELEBRATION
   Moved from a dynamically injected <style> element so strict style-src can remain enabled. */
#leadflowGoalCelebration {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow: hidden !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at center, rgba(45, 24, 90, 0.34), rgba(2, 3, 18, 0.18) 46%, rgba(2, 3, 18, 0.54)) !important;
}

#leadflowGoalCelebration[hidden] {
  display: none !important;
}

#leadflowGoalFireworksCanvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

#leadflowGoalCelebration .leadflow-goal-message {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(760px, calc(100vw - 36px));
  padding: 30px 28px 32px;
  color: #fff;
  text-align: center;
  transform: translate(-50%, -50%);
  border: 2px solid rgba(250, 204, 21, .72);
  border-radius: 30px;
  background:
    radial-gradient(circle at 50% 0%, rgba(250, 204, 21, .30), transparent 35%),
    linear-gradient(145deg, rgba(48, 24, 92, .96), rgba(13, 9, 35, .97));
  box-shadow:
    0 0 0 1px rgba(250, 204, 21, .16),
    0 35px 110px rgba(0, 0, 0, .74),
    0 0 100px rgba(124, 58, 237, .34);
  animation: leadflowGoalEnter .55s cubic-bezier(.16, 1, .3, 1);
}

#leadflowGoalCelebration .leadflow-goal-trophy {
  width: 116px;
  height: 116px;
  display: grid;
  place-items: center;
  margin: -82px auto 12px;
  font-size: 72px;
  border: 2px solid rgba(250, 204, 21, .66);
  border-radius: 36px;
  background: radial-gradient(circle, rgba(250, 204, 21, .26), rgba(124, 58, 237, .22));
  box-shadow: 0 0 52px rgba(250, 204, 21, .50);
  animation: leadflowGoalTrophy 1.2s ease-in-out infinite;
}

#leadflowGoalCelebration .leadflow-goal-eyebrow {
  margin: 10px 0 5px;
  color: #c4b5fd;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .22em;
}

#leadflowGoalCelebration h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(42px, 6vw, 78px);
  font-weight: 1000;
  line-height: .98;
  letter-spacing: -.055em;
  text-shadow:
    0 5px 0 rgba(146, 64, 14, .55),
    0 10px 34px rgba(250, 204, 21, .48);
}

#leadflowGoalCelebration strong {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 18px auto 0;
  padding: 10px 22px;
  color: #fff;
  font-size: clamp(15px, 2vw, 22px);
  border-radius: 999px;
  background: linear-gradient(135deg, #6d28d9, #4c1d95);
}

#leadflowGoalCelebration #leadflowGoalMessage {
  margin: 16px 0 0;
  color: #f7f3ff;
  font-size: clamp(16px, 2vw, 23px);
}

#leadflowGoalCelebration .leadflow-goal-stars {
  margin-top: 18px;
  color: #facc15;
  font-size: 30px;
  letter-spacing: .12em;
  animation: leadflowGoalStars .75s ease-in-out infinite alternate;
}

@keyframes leadflowGoalEnter {
  from {
    opacity: 0;
    transform: translate(-50%, -43%) scale(.65);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes leadflowGoalTrophy {
  0%, 100% { transform: translateY(0) rotate(-2deg) scale(1); }
  50% { transform: translateY(-9px) rotate(2deg) scale(1.06); }
}

@keyframes leadflowGoalStars {
  from { opacity: .55; transform: scale(.94); }
  to { opacity: 1; transform: scale(1.08); }
}