/*
 * This software is designed by Dr Anna.
 * SLIMS - Suno Listeners Interaction Management System 
 * Version: V1
 */

:root {
  --sims-sidebar-width: 280px;
  --sims-sidebar-collapsed: 88px;
  --sims-header-height: 68px;
  --sims-bg: var(--slims-bg);
  --sims-panel: #ffffff;
  --sims-border: var(--slims-border);
  --sims-text: var(--slims-text);
  --sims-muted: var(--slims-muted);
  --sims-blue: var(--slims-blue);
  --sims-green: #16a34a;
  --sims-amber: #d97706;
  --sims-danger: #dc2626;
  --app-font-size: var(--slims-font-size);
  --menu-font-size: var(--slims-menu-font-size);
  --submenu-font-size: var(--slims-submenu-font-size);
  --header-title-size: var(--slims-header-title-size);
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
  overflow-x: hidden;
}

body {
  margin: 0;
  background: var(--sims-bg);
  color: var(--sims-text);
  font-family: var(--slims-font-family);
  font-size: var(--app-font-size);
  font-weight: var(--slims-body-weight);
  letter-spacing: 0;
}

body.font-size-small {
  --app-font-size: 14px;
  --menu-font-size: 15px;
  --submenu-font-size: 14px;
  --header-title-size: 18px;
}

body.font-size-normal {
  --app-font-size: 15px;
  --menu-font-size: 16px;
  --submenu-font-size: 15px;
  --header-title-size: 19px;
}

body.font-size-large {
  --app-font-size: 17px;
  --menu-font-size: 18px;
  --submenu-font-size: 16px;
  --header-title-size: 21px;
}

a,
a:hover {
  text-decoration: none;
}

#header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--sims-header-height);
  z-index: 1100;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid var(--sims-border);
  box-shadow: 0 8px 22px rgba(31,47,70,.08);
}

.header-content {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 18px;
}

.brand-wrap,
.header-actions,
.user-info {
  display: flex;
  align-items: center;
  gap: 12px;
}

.brand-wrap {
  flex: 1 1 auto;
  min-width: 0;
}

.header-actions {
  flex: 0 0 auto;
}

.header-toggle-btn {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--sims-border);
  border-radius: 8px;
  background: #fff;
  color: var(--sims-blue);
  cursor: pointer;
}

.header-toggle-btn:hover {
  background: #eef5ff;
  border-color: #bdd3ff;
}

.logo {
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1.12;
  min-width: 0;
  flex: 1 1 auto;
}

.logo-mark {
  width: 112px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #dbe7f4;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(37,99,235,.10);
}

.logo-mark img {
  width: 104px;
  max-height: 36px;
  object-fit: contain;
}

.logo-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1 1 auto;
}

.logo strong {
  font-size: var(--header-title-size);
  color: #172033;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.logo span {
  font-size: 11px;
  color: var(--sims-muted);
  font-weight: 700;
  text-transform: uppercase;
}

.date-chip,
.notification-chip {
  height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--sims-border);
  border-radius: 999px;
  padding: 0 12px;
  background: #fff;
  color: #44546a;
  font-size: 12px;
  font-weight: 700;
}

.notification-chip {
  color: var(--sims-amber);
}

.notification-chip:hover {
  background: #fff7ed;
  color: var(--sims-amber);
}

.font-tools {
  height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  border: 1px solid var(--sims-border);
  border-radius: 999px;
  background: #fff;
  padding: 3px;
}

.font-tools button {
  min-width: 34px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #44546a;
  font-weight: 800;
  line-height: 1;
  padding: 0 8px;
}

.font-tools button:hover {
  background: #eef5ff;
  color: var(--sims-blue);
}

.font-tools button.is-active {
  background: #eef5ff;
  color: var(--sims-blue);
}

.font-tools .font-large {
  font-size: 16px;
}

.font-tools .font-small {
  font-size: 12px;
  font-weight: 700;
}

#notifCount {
  min-width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 11px;
  padding: 0 5px;
}

.user-dropdown {
  position: relative;
  cursor: pointer;
}

.user-info {
  height: 42px;
  border: 1px solid var(--sims-border);
  border-radius: 999px;
  background: #fff;
  padding: 4px 10px 4px 4px;
}

.avatar-circle {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eef5ff;
  color: var(--sims-blue);
  font-weight: 400;
  overflow: hidden;
  border: 1px solid #dbeafe;
}

.avatar-circle img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  display: block;
}

.user-info span:last-of-type {
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 800;
}

.user-menu {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 190px;
  padding: 7px;
  border: 1px solid var(--sims-border);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(31,47,70,.18);
  z-index: 1300;
}

.user-dropdown.active .user-menu {
  display: block;
}

.user-menu a {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 7px;
  color: #334155;
  font-size: 13px;
  font-weight: 800;
}

.user-menu a:hover {
  background: #eef5ff;
  color: var(--sims-blue);
}

.user-menu a.logout-link {
  color: var(--sims-danger);
}

.header-logout-btn {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--sims-border);
  border-radius: 999px;
  background: #fff;
  color: var(--sims-danger);
  font-size: 15px;
}

.header-logout-btn:hover {
  background: #fff1f2;
  color: var(--sims-danger);
  border-color: #fecdd3;
}

.sidebar {
  width: var(--sims-sidebar-width);
  position: fixed;
  top: var(--sims-header-height);
  left: 0;
  height: calc(100vh - var(--sims-header-height));
  background: #fff;
  border-right: 1px solid var(--sims-border);
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 1000;
  transition: width .25s ease, transform .25s ease;
  padding: 14px 12px 18px;
  box-shadow: 10px 0 28px rgba(31,47,70,.05);
}

.sidebar.collapsed {
  width: var(--sims-sidebar-collapsed);
  padding: 14px 8px 18px;
}

.sidebar ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sidebar a {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 4px 0;
  padding: 9px 14px;
  border-radius: 8px;
  color: #334155;
  font-size: var(--menu-font-size);
  font-weight: 400;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}

.sidebar a:hover {
  background: #eef5ff;
  color: var(--sims-blue);
  transform: translateX(2px);
}

.sidebar a.active {
  background: linear-gradient(135deg,#e8f1ff,#f7fbff);
  color: var(--sims-blue);
  font-weight: 400;
  box-shadow: inset 3px 0 0 var(--sims-blue);
}

.sidebar i {
  width: 22px;
  min-width: 22px;
  text-align: center;
  font-size: 15px;
  color: inherit;
}

.submenu {
  display: none;
  padding: 2px 0 6px 16px;
}

.submenu.open {
  display: block;
}

.submenu a {
  min-height: 38px;
  font-size: var(--submenu-font-size);
  font-weight: 400;
  color: #526174;
}

.submenu-arrow {
  margin-left: auto;
  width: 16px !important;
  min-width: 16px !important;
  opacity: .62;
  text-align: center;
  font-size: 11px !important;
}

.nav-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar.collapsed li {
  display: flex;
  justify-content: center;
}

.sidebar.collapsed a {
  width: 56px;
  height: 56px;
  min-height: 56px;
  justify-content: center;
  margin: 6px auto;
  padding: 0;
}

.sidebar.collapsed .nav-label {
  display: none;
}

.sidebar.collapsed .submenu,
.sidebar.collapsed .submenu-arrow {
  display: none !important;
}

.sidebar.collapsed a:hover::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 68px;
  top: 50%;
  transform: translateY(-50%);
  min-width: max-content;
  padding: 8px 11px;
  border-radius: 8px;
  background: #172033;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 8px 20px rgba(15,23,42,.22);
  z-index: 1200;
}

.main-content {
  margin-left: var(--sims-sidebar-width);
  margin-top: var(--sims-header-height);
  padding: 14px;
  min-height: calc(100vh - var(--sims-header-height));
  transition: margin-left .25s ease;
}

.main-content.expanded {
  margin-left: var(--sims-sidebar-collapsed);
}

.approval-hero {
  min-height: var(--slims-hero-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 12px 18px;
  margin-bottom: 14px;
  background: linear-gradient(90deg, #f8fbff, #f2fffb);
  border: 1px solid #cfe0f6;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(31,47,70,.05);
}

.approval-hero-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.approval-hero-title span {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #e8f1ff;
  color: #2563eb;
  font-size: 20px;
}

.approval-hero-title h2 {
  margin: 0;
  color: #183153;
  font-size: 24px;
  font-weight: 400;
}

.compact-section-strip {
  min-height: var(--slims-strip-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: var(--slims-strip-padding-y) var(--slims-strip-padding-x);
  margin-bottom: 14px;
  background: linear-gradient(90deg, #f8fbff, #f2fffb);
  border: 1px solid #cfe0f6;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(31,47,70,.05);
}

.compact-strip-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.compact-strip-title span {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #e8f1ff;
  color: var(--sims-blue);
  font-size: 19px;
}

.compact-strip-title h2 {
  margin: 0;
  color: #183153;
  font-size: 24px;
  font-weight: 400;
}

.approval-hero-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.approval-hero-actions .btn {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 13px;
}

.approval-summary-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

.approval-summary-card {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: var(--slims-card-min-height);
  padding: var(--slims-card-padding-y) var(--slims-card-padding-x);
  background: #fff;
  border: 1px solid #dfe7f2;
  border-top: 4px solid #8aa0b8;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(31,47,70,.05);
}

.approval-summary-card.is-teal { border-top-color: #0f766e; }
.approval-summary-card.is-purple { border-top-color: #7c3aed; }
.approval-summary-card.is-blue { border-top-color: #64748b; }
.approval-summary-card.is-orange { border-top-color: #d97706; }

.return-chain-strip {
  padding: 16px 18px;
  margin-bottom: 16px;
  background: #eef7ff;
  border: 1px solid #cfe0f6;
  border-radius: 8px;
}

.return-chain-strip label {
  display: block;
  color: #60748b;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.return-chain-strip > div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.return-chain-strip .form-select {
  max-width: 350px;
}

.return-count {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #e8f1ff;
  border: 1px solid #bdd3ff;
  color: #2563eb;
}

.return-btn {
  background: #e8a85f;
  color: #fff;
}

.pending-approval-table table {
  font-size: 13px;
}

.approval-remarks {
  min-width: 290px;
  height: 40px;
}

.view-action-btn {
  background: #0891b2;
  border-color: #0891b2;
  color: #fff;
}

.page-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

.page-title-row h1 {
  margin: 0;
  color: #172033;
  font-size: 24px;
  font-weight: 900;
}

.page-title-row p {
  margin: 3px 0 0;
  color: var(--sims-muted);
  font-size: 13px;
  font-weight: 400;
}

.panel,
.stat-card {
  background: #fff;
  border: 1px solid var(--sims-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(31,47,70,.06);
}

.panel-header {
  padding: 14px 16px;
  border-bottom: 1px solid var(--sims-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.panel-header h2 {
  margin: 0;
  color: #183153;
  font-size: 16px;
  font-weight: 400;
}

.panel-header h2 i {
  color: var(--sims-blue);
  margin-right: 8px;
}

.module-form-panel,
.module-table-panel {
  margin-bottom: 18px;
}

.module-form-grid {
  align-items: end;
}

.form-label {
  color: #26384f;
  font-size: 13px;
  font-weight: 400;
}

.form-actions {
  display: flex;
  justify-content: flex-end;
  padding-top: 4px;
}

.stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 22px;
}

.sims-metric-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: var(--slims-card-min-height);
  padding: var(--slims-card-padding-y) var(--slims-card-padding-x);
  background: #fff;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(31,47,70,.05);
}

.sims-metric-main {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.sims-metric-icon {
  width: var(--slims-icon-size);
  height: var(--slims-icon-size);
  flex: 0 0 var(--slims-icon-size);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eef5ff;
  color: var(--sims-blue);
  font-size: 18px;
}

.sims-metric-label {
  color: #60748b;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.25;
  text-transform: uppercase;
}

.sims-metric-value {
  color: #1e3a8a;
  font-size: 26px;
  font-weight: 500;
  line-height: 1;
  text-align: right;
  white-space: nowrap;
}

.sims-metric-card.is-green .sims-metric-icon { background: #dcfce7; color: #16a34a; }
.sims-metric-card.is-red .sims-metric-icon { background: #fee2e2; color: #dc2626; }
.sims-metric-card.is-orange .sims-metric-icon { background: #ffedd5; color: #ea580c; }
.sims-metric-card.is-purple .sims-metric-icon { background: #ede9fe; color: #7c3aed; }
.sims-metric-card.is-teal .sims-metric-icon { background: #ccfbf1; color: #0f766e; }
.sims-metric-card.is-slate .sims-metric-icon { background: #f1f5f9; color: #475569; }
.sims-metric-card.is-blue .sims-metric-icon { background: #dbeafe; color: #2563eb; }

.dashboard-overview-heading {
  margin: 0 0 12px;
}

.dashboard-overview-heading h1 {
  margin: 0;
  color: var(--slims-heading);
  font-size: 26px;
  font-weight: 400;
  line-height: 1.2;
}

.dashboard-overview-sections {
  display: grid;
  gap: 14px;
}

.dashboard-overview-box {
  padding: 12px;
  border: 1px solid var(--slims-border);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--slims-shadow);
}

.overview-box-head {
  display: flex;
  align-items: center;
  min-height: 34px;
  margin-bottom: 10px;
  border-bottom: 1px solid #e6eef8;
}

.overview-box-head h2 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--slims-heading);
  font-size: 18px;
  font-weight: 400;
}

.overview-box-head i {
  color: var(--slims-blue);
}

.dashboard-overview-box .stat-grid,
.overview-box-grid {
  margin-bottom: 0;
}

.active-users-card {
  position: relative;
}

.region-upload-card {
  position: relative;
}

.category-summary-card {
  position: relative;
}

.active-users-popover {
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 280px;
  padding: 12px;
  background: #fff;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(31,47,70,.18);
  z-index: 50;
}

.active-users-card:hover .active-users-popover {
  display: block;
}

.region-upload-popover {
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 300px;
  max-height: 320px;
  overflow: auto;
  padding: 12px;
  background: #fff;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(31,47,70,.18);
  z-index: 60;
}

.region-upload-card:hover .region-upload-popover {
  display: block;
}

.category-summary-popover {
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 280px;
  padding: 12px;
  background: #fff;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(31,47,70,.18);
  z-index: 60;
}

.category-summary-card:hover .category-summary-popover {
  display: block;
}

.region-upload-popover > strong {
  display: block;
  color: #183153;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
}

.category-summary-popover > strong {
  display: block;
  color: #183153;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
}

.region-upload-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px;
  border-radius: 7px;
  background: #fbfdff;
  color: #183153;
  font-size: 13px;
  margin-top: 6px;
}

.category-summary-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px;
  border-radius: 7px;
  background: #fbfdff;
  color: #183153;
  font-size: 13px;
  margin-top: 6px;
}

.region-upload-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.region-upload-row b {
  color: #1e3a8a;
  font-weight: 500;
}

.category-summary-row b {
  color: #1e3a8a;
  font-weight: 500;
}

.active-users-popover > strong {
  display: block;
  color: #183153;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
}

.active-user-row {
  display: grid;
  gap: 2px;
  padding: 8px;
  border-radius: 7px;
  background: #fbfdff;
  margin-top: 6px;
}

.active-user-row span {
  color: #183153;
  font-size: 13px;
}

.active-user-row small {
  color: #60748b;
  font-size: 11px;
}

.stat-card {
  min-height: 82px;
  padding: 14px 16px;
}

.stat-card span {
  color: #60748b;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.stat-card strong {
  display: block;
  color: #1e3a8a;
  font-size: 30px;
  font-weight: 500;
  line-height: 1;
  margin-top: 10px;
}

.admin-shortcuts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.admin-shortcut {
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px;
  background: #fff;
  border: 1px solid var(--sims-border);
  border-radius: 8px;
  color: #334155;
  box-shadow: 0 8px 24px rgba(31,47,70,.06);
  font-weight: 900;
}

.admin-shortcut i {
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eef5ff;
  color: var(--sims-blue);
  font-size: 20px;
}

.admin-shortcut:hover {
  color: var(--sims-blue);
  border-color: #bdd3ff;
}

.sims-center-hero {
  min-height: var(--slims-hero-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 10px 18px;
  margin-bottom: 14px;
  background: rgba(255,255,255,.78);
  border: 1px solid #cfe0f6;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(31,47,70,.05);
}

.sims-center-hero.compact {
  min-height: 92px;
}

.sims-center-title {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #183153;
  font-size: 24px;
  font-weight: 400;
}

.sims-center-title i {
  color: #183153;
}

.sims-center-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sims-counter {
  min-width: 118px;
  padding: 9px 13px;
  background: #fff;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
}

.sims-counter span {
  display: block;
  color: #60748b;
  font-size: 12px;
  text-transform: uppercase;
}

.sims-counter strong {
  display: block;
  color: #183153;
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
  margin-top: 5px;
}

.sims-hero-icon {
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #e8f1ff;
  color: #2563eb;
  font-size: 22px;
}

.sims-feed {
  display: grid;
  gap: 10px;
  padding: 10px;
  background: #fff;
  border: 1px solid #d8e6fb;
  border-radius: 8px;
}

.sims-feed-item {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) auto;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid #d9e7fb;
  border-radius: 8px;
  background: #fff;
}

.sims-feed-item.is-unread {
  border-color: #9fc3ff;
  box-shadow: inset 4px 0 0 #2563eb;
}

.sims-feed-icon {
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #dcfce7;
  color: #15803d;
  font-size: 17px;
}

.sims-feed-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 6px;
}

.sims-feed-title strong {
  color: #183153;
  font-size: 18px;
  font-weight: 400;
}

.sims-feed-main p,
.notice-card p {
  color: #334968;
  font-size: 15px;
  line-height: 1.45;
  margin: 0 0 10px;
}

.sims-status {
  display: inline-flex;
  align-items: center;
  padding: 7px 13px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
}

.sims-status.is-unread {
  background: #eef5ff;
  color: #1d4ed8;
}

.sims-status.is-read {
  background: #dcfce7;
  color: #15803d;
}

.sims-feed-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.sims-feed-tags span,
.sims-time {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px;
  border: 1px solid #d8e6fb;
  border-radius: 999px;
  color: #315072;
  background: #fbfdff;
  font-size: 13px;
}

.sims-feed-tags i,
.sims-time i {
  color: #2563eb;
}

.sims-feed-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.announcement-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(360px, .55fr);
  gap: 18px;
}

.notice-list {
  display: grid;
  gap: 14px;
}

.notice-card {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 20px;
  background: #fff;
  border: 1px solid #d8e6fb;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(31,47,70,.05);
}

.notice-card h3 {
  margin: 0 0 10px;
  color: #183153;
  font-size: 21px;
  font-weight: 400;
}

.compose-panel .panel .panel {
  border: 0 !important;
  box-shadow: none !important;
  margin: 0;
}

.compose-panel .panel .panel-header:first-child + .panel {
  border-radius: 0;
}

.sims-empty {
  padding: 24px;
  text-align: center;
  color: var(--sims-muted);
}

.sims-management-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  margin-bottom: 18px;
  background: #fff;
  border: 1px solid var(--sims-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(31,47,70,.06);
}

.panel,
.admin-shortcut,
.notice-card,
.sims-management-head,
.approval-step,
.sims-feed-item {
  border-radius: 8px !important;
  border: 1px solid #dfe7f2 !important;
  box-shadow: 0 8px 22px rgba(31,47,70,.05) !important;
}

.panel-header {
  background: #fbfdff;
}

.sims-management-head h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: #183153;
  font-size: 22px;
  font-weight: 400;
}

.sims-management-head h2 i {
  color: var(--sims-blue);
}

.sims-management-head p {
  margin: 4px 0 0;
  color: var(--sims-muted);
  font-size: 13px;
}

.sims-user-layout {
  display: grid;
  gap: 18px;
}

.sims-user-form .panel-header,
.sims-users-table .panel-header {
  background: #fbfdff;
}

.sims-user-form .form-control,
.sims-user-form .form-select {
  min-height: 36px;
  font-size: 13px;
}

.sims-users-table table {
  font-size: 13px;
}

.sims-users-table .btn-sm {
  min-height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  box-shadow: none;
}

.table > thead > tr > th,
table thead th {
  background: #f0f5fb;
  color: #26384f;
  font-weight: 900;
  text-transform: uppercase;
  border-bottom: 1px solid var(--sims-border);
}

.btn {
  min-height: 32px;
  padding: 6px 13px;
  border-radius: 7px;
  border-width: 1px;
  font-size: var(--slims-menu-font-size);
  font-weight: 500;
  line-height: 1.15;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  box-shadow: 0 7px 16px rgba(37, 99, 235, .10);
  transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(37, 99, 235, .14);
}

.btn-primary,
.btn-success {
  background: var(--sims-blue);
  border-color: var(--sims-blue);
  color: #fff;
}

.btn-primary:hover,
.btn-success:hover {
  background: #1d4ed8;
  border-color: #1d4ed8;
  color: #fff;
}

.btn-light {
  background: #f8fbff;
  border-color: #cfe0f5;
  color: var(--slims-text);
}

.btn-light:hover {
  background: #eaf2ff;
  border-color: #b9d2f3;
  color: var(--slims-blue);
}

.btn-danger {
  background: #dc2626;
  border-color: #dc2626;
  color: #fff;
}

.btn-danger:hover {
  background: #b91c1c;
  border-color: #b91c1c;
  color: #fff;
}

.p-3 {
  padding: 16px;
}

.mb-0 {
  margin-bottom: 0;
}

.mb-3 {
  margin-bottom: 16px;
}

.mt-3 {
  margin-top: 16px;
}

.me-2 {
  margin-right: 8px;
}

.small {
  font-size: 12px;
}

.text-secondary {
  color: var(--sims-muted);
}

.text-success {
  color: var(--sims-green);
}

.text-center {
  text-align: center;
}

.form-select {
  display: block;
  width: 100%;
  height: 38px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
}

.row.g-3 {
  margin-left: -8px;
  margin-right: -8px;
}

.row.g-3 > [class*="col-"] {
  padding-left: 8px;
  padding-right: 8px;
  margin-bottom: 16px;
}

.form-control,
.form-select,
select.form-control {
  border: 1px solid #d8e3f2;
  border-radius: 8px;
  box-shadow: none;
  min-height: 38px;
}

.login-wrapper {
  display: flex;
  min-height: 100vh;
  background: #eef3fb;
}

.login-info {
  width: 55%;
  padding: 60px;
}

.login-info h1 {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 15px;
}

.login-info p.subtext {
  color: #555;
  max-width: 520px;
  margin-bottom: 40px;
}

.info-item {
  display: flex;
  margin-bottom: 30px;
}

.info-icon {
  min-width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  background: #e0e7ff;
  color: #1d4ed8;
  border-radius: 10px;
  margin-right: 15px;
}

.info-item h4 {
  margin: 0;
  font-size: 17px;
  font-weight: 600;
}

.info-item p {
  margin: 4px 0 0;
  color: #555;
  font-size: 14px;
}

.login-panel {
  width: 45%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.login-card {
  background: #fff;
  padding: 40px;
  width: 100%;
  max-width: 420px;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0,0,0,.08);
}

.login-card h2 {
  font-weight: 700;
  margin-bottom: 10px;
}

.login-card p {
  color: #666;
  margin-bottom: 25px;
}

.password-field {
  position: relative;
}

.password-field .form-control {
  padding-right: 48px;
}

.password-toggle {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #64748b;
}

@media (max-width: 991px) {
  .header-actions .date-chip,
  .notification-chip {
    display: none;
  }

  .sidebar {
    transform: translateX(-100%);
  }

  .sidebar.collapsed {
    transform: translateX(0);
    width: var(--sims-sidebar-width);
  }

  .sidebar.collapsed .nav-label {
    display: inline;
  }

  .main-content,
  .main-content.expanded {
    margin-left: 0;
    padding: 16px;
  }

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

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

  .login-wrapper {
    flex-direction: column;
  }

  .login-info,
  .login-panel {
    width: 100%;
  }
}

@media (max-width: 560px) {
  .logo-text {
    display: none;
  }

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

  .admin-shortcuts {
    grid-template-columns: 1fr;
  }

  .login-info {
    padding: 32px 24px;
  }

  .login-card {
    padding: 28px;
  }
}

/* Executive typography polish matching SIMS */
.main-content,
.panel,
.table,
.form-control,
.form-select,
.btn,
.sims-feed,
.notice-card,
.admin-shortcut,
.sims-management-head {
  font-family: "Poppins", Arial, sans-serif;
  letter-spacing: 0;
}

.table > thead > tr > th,
table thead th {
  font-size: 12px;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

.table > tbody > tr > td,
table tbody td {
  color: #334968;
  font-size: 13px;
  font-weight: 400;
}

.form-control,
.form-select,
select.form-control {
  font-size: 13px;
  font-weight: 400;
}

.btn {
  font-weight: 500 !important;
}

.sidebar a,
.sidebar .nav-label,
.date-chip,
.notification-chip,
.font-tools button,
.user-info span:last-of-type,
.sims-feed-title strong,
.notice-card h3,
.sims-management-head h2,
.login-info h1,
.login-card h2,
.info-item h4 {
  font-weight: 400 !important;
}

.sims-feed-main p,
.notice-card p,
.login-card p,
.info-item p,
.login-info p.subtext {
  font-weight: 400;
}

.approval-chain {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.approval-step {
  min-height: 112px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 16px;
  background: #fff;
  border: 1px solid var(--sims-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(31,47,70,.06);
}

.approval-step i {
  color: var(--sims-blue);
  font-size: 22px;
}

.approval-step span {
  color: #334968;
  font-size: 14px;
}

.approval-step strong {
  color: #1e3a8a;
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
}

.activity-stat-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.activity-stat-grid .sims-metric-card {
  min-height: 72px;
}

.activity-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 22px 0 12px;
}

.activity-section-title h2 {
  margin: 0;
  color: #183153;
  font-size: 22px;
  font-weight: 400;
}

.activity-section-title span {
  color: #60748b;
  font-size: 13px;
}

.online-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 13px;
  border-radius: 999px;
  background: #dcfce7;
  color: #15803d;
}

.online-pill i {
  font-size: 9px;
}

.role-activity-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.role-activity-card {
  padding: 18px;
  background: #fff;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(31,47,70,.05);
}

.role-card-head {
  display: flex;
  align-items: center;
  gap: 12px;
}

.role-card-head i {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #eef5ff;
  color: var(--sims-blue);
}

.role-card-head strong,
.role-card-head span {
  display: block;
}

.role-card-head strong {
  color: #183153;
  font-size: 17px;
  font-weight: 400;
}

.role-card-head span {
  color: #60748b;
  font-size: 12px;
}

.role-card-value {
  float: right;
  color: #172033;
  font-size: 30px;
  line-height: 1;
}

.role-mini-grid {
  clear: both;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 20px;
}

.role-mini-grid div {
  padding: 10px;
  border: 1px solid #e6eef8;
  border-radius: 8px;
  background: #fbfdff;
}

.role-mini-grid span,
.role-mini-grid strong {
  display: block;
}

.role-mini-grid span {
  color: #60748b;
  font-size: 11px;
  text-transform: uppercase;
}

.role-mini-grid strong {
  color: #183153;
  font-size: 18px;
  font-weight: 400;
}

/* Global slick card look */
.panel,
.sims-center-hero,
.compact-section-strip,
.approval-hero,
.sims-feed,
.sims-feed-item,
.notice-card,
.compose-panel > .panel,
.admin-shortcut,
.sims-management-head,
.role-activity-card,
.approval-summary-card,
.return-chain-strip {
  border-radius: 8px !important;
  border: 1px solid var(--slims-border) !important;
  box-shadow: var(--slims-shadow) !important;
}

.panel-header {
  min-height: var(--slims-panel-header-height) !important;
  padding: 10px 14px !important;
  background: #fbfdff !important;
}

.panel-header h2 {
  font-size: 20px !important;
  font-weight: 400 !important;
}

.record-count-pill {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eaf2ff;
  color: var(--slims-blue);
  font-size: 12px;
  font-weight: 500;
  vertical-align: middle;
}

.panel form.p-3,
.table-responsive.p-3 {
  padding: 12px !important;
}

.table {
  margin-bottom: 0 !important;
}

.table > thead > tr > th,
table thead th {
  padding: 10px !important;
  background: #eef4fb !important;
}

.table > tbody > tr > td,
table tbody td {
  padding: var(--slims-table-cell-padding) !important;
  vertical-align: middle !important;
}

.form-control,
.form-select,
select.form-control {
  min-height: var(--slims-form-control-height) !important;
  border-radius: var(--slims-radius) !important;
  border-color: var(--slims-border) !important;
}

textarea.form-control {
  min-height: 58px !important;
}

.notice-card {
  align-items: center !important;
  padding: 16px 24px !important;
}

.notice-card h3 {
  font-size: 24px !important;
}

.compose-panel > .panel {
  overflow: hidden;
}

.compose-panel .panel .panel {
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}

.compose-panel .panel .panel-header {
  min-height: 54px !important;
  background: #fff !important;
}

.compose-panel .panel .panel-header h2 {
  font-size: 22px !important;
}

.compose-panel .row.g-3 {
  display: grid !important;
  grid-template-columns: .75fr 1.25fr .8fr .55fr;
  gap: 12px;
  margin: 0 !important;
}

.compose-panel .row.g-3 > [class*="col-"] {
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}

.compose-panel .form-actions {
  justify-content: flex-start !important;
  padding-top: 12px !important;
}

.compose-panel .btn-success {
  background: #2563eb !important;
  border-color: #2563eb !important;
  min-height: 40px;
  font-size: 15px;
}

.announcement-layout {
  grid-template-columns: minmax(0, 1fr) 450px !important;
  align-items: start;
}

.compose-panel > .panel {
  background: #fff;
}

.announcement-form-panel {
  margin: 0 !important;
}

.announcement-form-panel .panel-header {
  min-height: 46px !important;
  background: #fbfdff !important;
}

.announcement-form {
  padding: 14px !important;
}

.compose-panel .announcement-form-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 0 !important;
}

.compose-panel .announcement-form-grid > [class*="col-"] {
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}

.compose-panel .announcement-form-grid > [class*="col-"]:nth-child(2) {
  grid-column: 1 / -1;
}

.compose-panel .announcement-form-grid textarea.form-control {
  min-height: 76px !important;
}

.announcement-form-actions {
  display: flex;
  justify-content: flex-start;
  padding-top: 14px;
}

.announcement-form-actions .btn {
  min-height: 40px;
  min-width: 220px;
}

.inline-actions {
  display: inline-flex;
  gap: 6px;
  margin: 0;
}

.sms-tabs {
  display: inline-flex;
  gap: 8px;
  margin: 0 0 10px;
  padding: 4px;
  border: 1px solid var(--slims-border);
  border-radius: var(--slims-radius);
  background: #fff;
  box-shadow: var(--slims-shadow);
}

.sms-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 6px 12px;
  border-radius: 7px;
  color: var(--slims-text);
  font-size: 14px;
  text-decoration: none;
}

.sms-tabs a.active {
  background: #eaf2ff;
  color: var(--slims-blue);
}

.module-form-grid {
  align-items: end;
}

.module-form-grid .btn {
  min-height: var(--slims-form-control-height);
  padding: 5px 12px;
}

.sta-mgmt-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.82fr) minmax(520px, 2.18fr);
  gap: 16px;
  align-items: start;
}

.sta-form-panel,
.sta-table-panel {
  margin-bottom: 0;
}

.sta-form-stack {
  display: grid;
  gap: 12px;
}

.sta-form-stack .btn {
  justify-self: start;
  min-width: 108px;
}

.sta-table-panel .table-responsive {
  max-height: calc(100vh - 190px);
  overflow-y: auto;
}

.rj-mgmt-layout .sta-table-panel .table-responsive {
  max-height: clamp(360px, calc(100vh - 170px), 760px);
}

.program-mgmt-layout .sta-table-panel .table-responsive {
  max-height: clamp(360px, calc(100vh - 170px), 760px);
}

.program-mgmt-layout {
  grid-template-columns: minmax(220px, 20%) minmax(0, 80%);
}

.program-content-panel .program-name-col {
  width: 22%;
  max-width: 220px;
}

.program-content-panel .program-timing-col {
  width: 120px;
  white-space: nowrap;
}

.program-row-actions,
.program-form-actions {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}

.program-row-actions .inline-actions {
  display: inline-flex;
  margin: 0;
}

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

.program-tabs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
  padding: 7px;
  border: 1px solid #dbe7f5;
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #f4f8fd 100%);
  box-shadow: 0 12px 28px rgba(31, 47, 70, .08);
}

.program-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 42px;
  padding: 10px 18px;
  border-radius: 12px;
  color: #526985;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  transition: color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.program-tab:hover {
  color: #0f5fb8;
  background: #eef6ff;
  transform: translateY(-1px);
}

.program-tab.active {
  color: #fff;
  background: linear-gradient(135deg, #0f3d73 0%, #1565c0 55%, #20a4f3 100%);
  box-shadow: 0 10px 22px rgba(21, 101, 192, .24);
}

.program-content-panel {
  overflow: hidden;
}

.program-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.program-panel-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.program-panel-tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 34px;
  padding: 7px 12px;
  border-radius: 10px;
  color: #526985;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: color .16s ease, background .16s ease;
}

.program-panel-tab:hover {
  color: #0f5fb8;
  background: #eef6ff;
}

.program-panel-tab.active {
  color: #052c65;
  background: #fff;
}

.program-panel-tab.active::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: -10px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, #0b5cff, #20a4f3);
}

.program-region-filter {
  width: min(260px, 100%);
  margin-left: auto;
}

.program-region-filter .form-select {
  min-height: 36px !important;
  font-size: 13px;
}

.fpc-panel {
  margin-top: 18px;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(37, 99, 235, .12), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border: 1px solid #dbe7f5 !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 45px rgba(15, 23, 42, .08) !important;
}

.fpc-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 74px !important;
  padding: 18px 20px !important;
  background: linear-gradient(135deg, #0f3d73 0%, #1565c0 52%, #20a4f3 100%) !important;
  color: #fff;
}

.fpc-panel-header h2 {
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  letter-spacing: 0;
}

.fpc-panel-header h2 i {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .16);
  color: #fff;
}

.fpc-filter {
  width: min(280px, 100%);
}

.fpc-filter .form-select {
  min-height: 42px !important;
  border: 1px solid rgba(255, 255, 255, .42) !important;
  background-color: rgba(255, 255, 255, .96);
  color: #12345a;
  font-size: 13px;
  font-weight: 500;
  box-shadow: 0 10px 22px rgba(8, 47, 92, .18);
}

.fpc-panel-embedded {
  background: #fff;
}

.fpc-panel-embedded .fpc-scroll {
  padding: 14px;
}

.fpc-embedded-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border-bottom: 1px solid #e1eaf6;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.fpc-embedded-tools.is-hidden {
  display: none;
}

.fpc-embedded-tools h3 {
  margin: 0;
  color: #052c65;
  font-size: 15px;
  font-weight: 400;
}

.fpc-panel-embedded .fpc-filter .form-select {
  box-shadow: none;
  border-color: #d5e3f5 !important;
}

.fpc-scroll {
  overflow-x: auto;
  padding: 16px;
}

.fpc-table {
  width: 100%;
  min-width: 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  overflow: hidden;
  border: 1px solid #dde8f6;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(31, 47, 70, .06);
}

.fpc-table th,
.fpc-table td {
  border: 0;
  border-right: 1px solid #e1eaf6;
  border-bottom: 1px solid #e1eaf6;
  vertical-align: top;
}

.fpc-table th {
  height: 44px;
  padding: 10px 8px;
  background: linear-gradient(180deg, #f3f7fc 0%, #eaf1f9 100%);
  color: #526985;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.fpc-table th:first-child,
.fpc-slot {
  width: 120px;
  text-align: left;
}

.fpc-table td {
  min-height: 92px;
  padding: 8px;
  color: #0f172a;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.fpc-slot {
  position: sticky;
  left: 0;
  z-index: 1;
  background: #f8fbff !important;
  color: #0b1f3a;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 500;
  white-space: normal;
  box-shadow: 8px 0 18px rgba(15, 23, 42, .03);
}

.fpc-card {
  display: grid;
  gap: 4px;
  min-height: 54px;
  margin-bottom: 7px;
  padding: 8px 9px;
  border: 1px solid rgba(37, 99, 235, .10);
  border-left: 5px solid rgba(37, 99, 235, .55);
  border-radius: 12px;
  box-shadow: 0 10px 20px rgba(31, 47, 70, .09);
  transition: transform .16s ease, box-shadow .16s ease;
}

.fpc-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 28px rgba(31, 47, 70, .14);
}

.fpc-card strong {
  color: #075ee8;
  font-size: 11.5px;
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -.01em;
}

.fpc-card span {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .58);
  color: #48627f;
  font-size: 10.5px;
  font-weight: 500;
  line-height: 1.3;
}

.fpc-card-1 { background: linear-gradient(135deg, #e7fbdc 0%, #d8f5cb 100%); border-left-color: #57c956; }
.fpc-card-2 { background: linear-gradient(135deg, #deecff 0%, #cfe2ff 100%); border-left-color: #4f8ef7; }
.fpc-card-3 { background: linear-gradient(135deg, #dcf8fb 0%, #c8eff5 100%); border-left-color: #22b8cf; }
.fpc-card-4 { background: linear-gradient(135deg, #ffe2e2 0%, #f8d1d1 100%); border-left-color: #fb7185; }
.fpc-card-5 { background: linear-gradient(135deg, #eee1ff 0%, #dfcff8 100%); border-left-color: #9b6be8; }
.fpc-card-6 { background: linear-gradient(135deg, #f6fbdb 0%, #edf8c5 100%); border-left-color: #b6d743; }

.fpc-empty {
  display: block;
  text-align: center;
  padding-top: 12px;
  color: #94a3b8;
  font-size: 20px;
  font-weight: 700;
}

.call-record-panel {
  overflow: hidden;
}

.call-record-panel:not(.call-entry-panel) > .panel-header {
  background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 100%) !important;
  border-bottom-color: #1d4ed8 !important;
}

.call-record-panel:not(.call-entry-panel) > .panel-header h2,
.call-record-panel:not(.call-entry-panel) > .panel-header h2 i {
  color: #fff !important;
}

.call-entry-panel > .panel-header {
  background: linear-gradient(135deg, #16a34a 0%, #22c55e 100%) !important;
  border-bottom-color: #16a34a !important;
}

.call-entry-panel > .panel-header h2,
.call-entry-panel > .panel-header h2 i {
  color: #fff !important;
}

.call-summary-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
}

.call-fetch-box {
  grid-column: 1 / -1;
  justify-self: start;
  width: auto;
  max-width: 100%;
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(260px, 350px) minmax(520px, 1fr);
  gap: 12px;
  align-items: end;
  padding: 14px;
  border: 1px solid #d6e5f7;
  border-radius: 14px;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  box-shadow: 0 10px 24px rgba(31, 47, 70, .06);
}

.call-program-info-box {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-self: stretch;
  padding: 12px;
  border: 1px solid #dbe7f5;
  border-radius: 12px;
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.call-program-info-box div {
  padding: 8px 10px;
  border-radius: 10px;
  background: #eef6ff;
}

.call-program-info-box span,
.call-program-info-box strong {
  display: block;
}

.call-program-info-box span {
  color: #60748b;
  font-size: 11px;
  text-transform: uppercase;
}

.call-program-info-box strong {
  color: #052c65;
  font-size: 13px;
  font-weight: 500;
}

.call-entry-box {
  display: grid;
  grid-template-columns: minmax(0, 60%) minmax(260px, 40%);
  gap: 12px;
  align-items: stretch;
  padding: 16px;
  border: 1px solid #d6e5f7;
  border-radius: 14px;
  background: linear-gradient(180deg, #f0fdf4 0%, #dcfce7 100%);
  box-shadow: 0 10px 24px rgba(31, 47, 70, .05);
}

.call-entry-panel {
  margin-top: 14px;
}

.call-tabs {
  display: inline-flex;
  gap: 8px;
  margin-bottom: 12px;
  padding: 6px;
  border: 1px solid #d6e5f7;
  border-radius: 12px;
  background: #f8fbff;
}

.call-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 14px;
  border-radius: 9px;
  color: #425b78;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
}

.call-tabs a.active {
  color: #fff;
  background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 100%);
  box-shadow: 0 8px 18px rgba(37, 99, 235, .22);
}

.call-category-layout {
  display: grid;
  grid-template-columns: minmax(260px, 30%) minmax(0, 70%);
  gap: 14px;
  align-items: start;
}

.call-category-form-box {
  grid-template-columns: 1fr;
}

.call-category-table-box {
  border: 1px solid #d6e5f7;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(31, 47, 70, .05);
}

.call-records-detail-table {
  border: 1px solid #cbdaf0;
  border-collapse: collapse;
}

.call-records-detail-table th,
.call-records-detail-table td {
  border: 1px solid #cbdaf0 !important;
}

.call-record-group-row td {
  background: inherit !important;
  color: inherit;
  font-size: 14px;
  letter-spacing: .1px;
}

.region-color-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  border: 1px solid;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.user-group-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.protected-role-badge {
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
}

.user-group-assign-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) minmax(360px, 2fr) auto;
  gap: 12px;
  align-items: end;
}

.user-group-checks {
  max-height: 130px;
  overflow-y: auto;
  padding: 9px 10px;
  border: 1px solid #d6e5f7;
  border-radius: 10px;
  background: #fff;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
}

.user-group-checks label {
  display: flex;
  gap: 6px;
  align-items: center;
  font-size: 12px;
  color: #183153;
}

.user-group-checks small {
  color: #64748b;
}

.user-member-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 2px 4px 2px 0;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef6ff;
  color: #183153;
  font-size: 12px;
  font-weight: 500;
}

.call-records-header {
  justify-content: space-between;
  gap: 12px;
}

.call-record-date-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}

.call-record-date-filter label {
  margin: 0;
  color: #183153;
  font-size: 12px;
}

.call-record-date-filter .form-control {
  width: 155px;
  min-height: 34px;
  font-size: 12px;
}

.call-record-date-filter .btn {
  min-height: 34px;
  padding: 6px 10px;
  font-size: 12px;
}

.call-entry-title {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #052c65;
  font-size: 15px;
  font-weight: 500;
}

.call-content-field {
  grid-column: 1;
  grid-row: 2;
}

.call-editor-toolbar {
  display: flex;
  gap: 6px;
  padding: 6px;
  border: 1px solid #d6e5f7;
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
  background: #f8fbff;
}

.call-editor-toolbar button {
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid #cbdaf0;
  border-radius: 7px;
  background: #fff;
  color: #183153;
  font-size: 12px;
}

.call-html-editor {
  min-height: 122px;
  max-height: 220px;
  overflow-y: auto;
  padding: 10px 12px;
  border: 1px solid #d6e5f7;
  border-radius: 0 0 10px 10px;
  background: #fff;
  font-size: 13px;
  outline: none;
  direction: rtl;
  text-align: right;
}

.call-html-editor:empty::before {
  content: attr(data-placeholder);
  color: #94a3b8;
}

.call-urdu-preview {
  margin-top: 8px;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid #bbf7d0;
  border-radius: 10px;
  background: #f0fdf4;
  color: #064e3b;
  direction: rtl;
  text-align: right;
  font-size: 14px;
}

.call-urdu-preview span {
  color: #64748b;
}

.call-entry-left-fields {
  grid-column: 1;
  grid-row: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 12px;
  align-content: start;
}

.call-category-checks {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: flex;
  flex-direction: column;
}

.call-checkbox-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 6px 10px;
  min-height: var(--slims-form-control-height);
  flex: 1;
  overflow-y: auto;
  padding: 8px 10px;
  border: 1px solid #d6e5f7;
  border-radius: 10px;
  background: #fff;
  font-size: 12px;
}

.call-checkbox-list label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 0;
  color: #183153;
}

.call-checkbox-list label:last-child {
  margin-bottom: 0;
}

.call-notes-field {
  grid-column: span 3;
}

.call-submit-field {
  grid-column: 1 / -1;
  display: flex;
  align-items: end;
}

.call-submit-field .btn {
  min-height: var(--slims-form-control-height);
}

.call-filter-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
}

.call-filter-grid .form-label,
.call-summary-grid .form-label,
.call-entry-box .form-label {
  margin-bottom: 4px;
  font-size: 12px;
}

.call-filter-grid .form-control,
.call-filter-grid .form-select,
.call-summary-grid .form-control,
.call-summary-grid .form-select,
.call-entry-box .form-control,
.call-entry-box .form-select {
  min-height: var(--slims-form-control-height);
  font-size: 12px;
}

.call-filter-actions {
  grid-column: span 2;
}

.call-summary-table {
  table-layout: fixed;
  font-size: 12px;
}

.call-summary-table th,
.call-summary-table td {
  text-align: center;
  vertical-align: middle !important;
  padding: 7px 6px !important;
}

.call-summary-table th:first-child,
.call-summary-table td:first-child {
  text-align: left;
}

.call-summary-table tfoot td {
  text-align: left;
  font-weight: 600;
  padding: 14px 10px !important;
}

.icon-only-btn {
  min-width: 30px;
  min-height: 30px;
  padding: 5px 8px !important;
  box-shadow: none;
}

@media (max-width: 1200px) {
  .call-summary-grid,
  .call-filter-grid,
  .call-entry-box {
    grid-template-columns: 1fr;
  }

  .call-notes-field,
  .call-content-field {
    grid-column: auto;
  }
}

@media (max-width: 768px) {
  .call-summary-grid,
  .call-filter-grid,
  .call-entry-box {
    grid-template-columns: 1fr;
  }

  .call-notes-field,
  .call-content-field {
    grid-column: auto;
  }

  .call-entry-left-fields {
    grid-template-columns: 1fr;
  }

  .call-category-checks {
    grid-column: auto;
    grid-row: auto;
  }

  .call-category-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 992px) {
  .sta-mgmt-layout {
    grid-template-columns: 1fr;
  }
}

.autosubmit-select {
  min-width: 132px;
  font-size: 13px;
}

.sms-filter-panel {
  margin-bottom: 12px;
  overflow: hidden;
  border-color: #bfdbfe !important;
  background: #eef7ff !important;
}

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

.sms-filter-panel .panel-header {
  background: #e0f2fe !important;
  border-bottom: 1px solid #bfdbfe;
}

.sms-filter-panel form.p-3 {
  background: #f0f9ff;
}

.sms-filter-note {
  margin: 0 0 10px;
  color: var(--slims-muted);
  font-size: var(--slims-menu-font-size);
  line-height: 1.25;
}

.sms-filter-grid .form-label {
  margin-bottom: 4px;
  color: var(--slims-heading);
  font-size: 12px;
}

.sms-filter-grid .form-control,
.sms-filter-grid .form-select {
  background-color: #fff;
}

.sms-filter-actions {
  display: flex;
  gap: 8px;
  grid-column: span 2;
}

.sms-unique-filter {
  min-height: var(--slims-form-control-height);
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  margin: 0;
  border: 1px solid #cfe0f5;
  border-radius: 8px;
  background: #fff;
  color: var(--slims-heading);
  font-size: 12px;
  font-weight: 500;
}

.sms-unique-filter input {
  margin: 0;
}

.sms-filter-actions .btn {
  min-height: var(--slims-form-control-height);
  padding: 5px 12px;
}

.sms-manage-table-wrap {
  width: 100%;
  overflow-x: hidden;
}

.sms-manage-table {
  width: 100%;
  table-layout: fixed;
  font-size: 11px;
}

.sms-manage-table th,
.sms-manage-table td {
  padding: 7px 6px !important;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.2;
}

.sms-manage-table th:nth-child(1),
.sms-manage-table td:nth-child(1) {
  width: 8%;
}

.sms-manage-table th:nth-child(2),
.sms-manage-table td:nth-child(2) {
  width: 12%;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}

.sms-manage-table th:nth-child(3),
.sms-manage-table td:nth-child(3) {
  width: 13%;
}

.sms-manage-table th:nth-child(4),
.sms-manage-table td:nth-child(4),
.sms-manage-table th:nth-child(5),
.sms-manage-table td:nth-child(5) {
  width: 10%;
}

.sms-manage-table th:nth-child(6),
.sms-manage-table td:nth-child(6) {
  width: 32%;
}

.sms-manage-table th:nth-child(7),
.sms-manage-table td:nth-child(7) {
  width: 15%;
}

.sms-manage-table .form-select {
  min-width: 0;
  width: 100%;
  height: 32px;
  padding: 4px 24px 4px 8px;
  font-size: 12px;
}

.sms-manage-table td {
  font-size: 11px !important;
}

.sms-manage-table td:nth-child(7) form {
  margin: 0;
}

.sms-more-wrap {
  display: flex;
  justify-content: center;
  padding: 0 12px 12px;
}

.sms-more-wrap .btn {
  min-width: 110px;
}

.sms-upload-panel {
  overflow: hidden;
  border-color: #bfdbfe !important;
  background: #eef7ff !important;
}

.sms-upload-panel .panel-header {
  background: #e0f2fe !important;
  border-bottom: 1px solid #bfdbfe;
}

.sms-upload-panel form.p-3 {
  background: #f0f9ff;
}

.sms-upload-panel .form-control,
.sms-upload-panel .form-select {
  background-color: #fff;
}

.sms-category-panel .module-form-grid {
  display: flex !important;
  gap: 16px;
  align-items: flex-end;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin: 0 !important;
}

.sms-category-panel .module-form-grid > [class*="col-"] {
  width: auto !important;
  float: none !important;
  padding: 0 !important;
}

.sms-category-panel .module-form-grid > [class*="col-"]:nth-child(1) {
  flex: 0 1 420px;
}

.sms-category-panel .module-form-grid > [class*="col-"]:nth-child(2) {
  flex: 0 0 170px;
}

.sms-category-panel .panel-header h2 {
  font-size: 20px !important;
  line-height: 1.2;
}

.sms-category-actions {
  display: flex;
  align-items: end;
  justify-content: flex-start;
  flex: 0 0 185px;
}

.sms-category-actions .btn {
  min-width: 170px;
  min-height: 38px;
  font-size: var(--slims-menu-font-size) !important;
  font-weight: 500 !important;
}

.slims-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(16, 32, 58, .34);
}

.slims-modal {
  width: min(1120px, 96vw);
  max-height: 86vh;
  overflow: hidden;
  border: 1px solid var(--slims-border);
  border-radius: var(--slims-radius);
  background: #fff;
  box-shadow: 0 18px 50px rgba(16, 32, 58, .18);
}

.slims-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  padding: 8px 14px;
  border-bottom: 1px solid var(--slims-border);
  background: #fbfdff;
  color: var(--slims-heading);
}

.slims-modal-head a {
  color: var(--slims-text);
  font-size: 24px;
  line-height: 1;
  text-decoration: none;
}

.slims-modal .table-responsive {
  max-height: calc(86vh - 45px);
  overflow: auto;
}

.permission-cards-panel {
  overflow: hidden;
}

.permission-roles-wrap {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.permission-role-selector {
  display: flex;
  gap: 14px;
  align-items: flex-end;
  padding: 14px 18px;
  border-bottom: 1px solid #e6eef8;
  background: #f8fbff;
}

.permission-role-selector .form-label {
  margin: 0 0 5px;
}

.permission-role-select {
  flex: 0 1 460px;
}

.permission-role-select .form-select {
  min-height: 42px !important;
}

.permission-stat-chip {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid var(--slims-border);
  border-radius: 999px;
  background: #fff;
  color: var(--slims-text);
  font-size: var(--slims-menu-font-size);
  white-space: nowrap;
}

.permission-stat-chip i {
  color: #16a34a;
}

.permission-stat-chip span {
  color: var(--slims-muted);
}

.permission-mode-toggle {
  margin-left: auto;
  min-height: 42px;
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--slims-border);
  border-radius: 9px;
  background: #eef4fb;
}

.permission-mode-toggle button {
  min-height: 34px;
  padding: 6px 13px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--slims-text);
  font-size: var(--slims-menu-font-size);
  font-weight: 500;
}

.permission-mode-toggle button.active {
  background: var(--slims-blue);
  color: #fff;
  box-shadow: 0 6px 14px rgba(37, 99, 235, .18);
}

.permission-role-section {
  border: 1px solid var(--slims-border);
  border-radius: 8px;
  background: #f8fbff;
  overflow: hidden;
}

.permission-role-head {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid #e6eef8;
  background: #fff;
}

.permission-roles-wrap.mode-view .permission-toggle-row.is-edit,
.permission-roles-wrap.mode-edit .permission-toggle-row.is-view {
  display: none;
}

.permission-role-head h3 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--slims-heading);
  font-size: var(--slims-title-size);
  font-weight: 400;
}

.permission-role-head h3 i {
  color: var(--slims-blue);
}

.permission-role-head span {
  color: var(--slims-muted);
  font-size: 12px;
}

.permission-role-pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #eaf2ff;
  color: var(--slims-blue);
  font-size: 12px;
  font-weight: 500;
}

.permission-role-pill.is-locked {
  background: #dcfce7;
  color: #15803d;
}

.permission-module-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(210px, 1fr));
  gap: 12px;
  padding: 12px;
}

.permission-module-card {
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--slims-shadow);
  overflow: hidden;
}

.permission-module-title {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 10px 12px;
  border-bottom: 1px solid #eef4fb;
}

.permission-module-title span {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #eef5ff;
  color: var(--slims-blue);
}

.permission-module-title strong {
  color: var(--slims-heading);
  font-size: var(--slims-menu-font-size);
  font-weight: 400;
  line-height: 1.25;
}

.permission-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  color: var(--slims-text);
  font-size: 13px;
  border-top: 1px solid #f4f7fb;
}

.permission-toggle-row > span {
  color: #42566f;
}

.permission-toggle-row em {
  color: #8aa0b8;
  font-style: normal;
  font-size: 12px;
}

.permission-switch {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  cursor: pointer;
}

.permission-switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.permission-switch i {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eef2f7;
  color: #8aa0b8;
  font-style: normal;
}

.permission-switch i::before {
  content: "-";
  font-size: 14px;
  line-height: 1;
}

.permission-switch input:checked + i {
  background: #dcfce7;
  color: #15803d;
}

.permission-switch input:checked + i::before {
  content: "\2713";
}

.permission-switch b {
  min-width: 58px;
  color: #64748b;
  font-size: 12px;
  font-weight: 500;
}

.permission-switch input:checked + i + b {
  color: #15803d;
}

.panel-header h2,
.compact-strip-title h2,
.sims-center-title,
.overview-box-head h2,
.activity-section-title h2,
.sims-management-head h2,
.notice-card h3,
.compose-panel .panel .panel-header h2,
.sms-category-panel .panel-header h2 {
  font-size: var(--slims-title-size) !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
}

.panel-header h2 i,
.compact-strip-title h2 i,
.sims-center-title i,
.overview-box-head h2 i {
  font-size: var(--slims-title-size) !important;
}

@media (max-width: 991px) {
  .approval-chain {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Video-matched Add Call Record layout */
.video-call-record-form {
  display: grid;
  gap: 28px;
}

.call-fetch-panel,
.call-details-panel {
  background: #f5f8fb;
  border: 1px solid #dfe7ef;
  border-radius: 4px;
  overflow: hidden;
}

.call-section-title {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 18px;
  color: #fff;
  font-size: 17px;
  font-weight: 600;
}

.call-section-title.is-blue {
  background: #0744a8;
}

.call-section-title.is-green {
  background: #23751f;
}

.call-fetch-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) minmax(280px, 1.45fr) minmax(120px, .58fr) minmax(110px, .52fr) minmax(110px, .52fr) minmax(110px, .52fr);
  gap: 28px;
  padding: 44px 32px 54px;
  align-items: start;
}

.call-details-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) minmax(220px, 1fr) minmax(360px, 1.35fr);
  grid-template-areas:
    "caller topic location category"
    "content content content category"
    "save save save category";
  gap: 26px 34px;
  padding: 38px 36px 34px;
  align-items: start;
}

.call-details-grid > .field-wrap:nth-of-type(1) { grid-area: caller; }
.call-details-grid > .field-wrap:nth-of-type(2) { grid-area: topic; }
.call-details-grid > .field-wrap:nth-of-type(3) { grid-area: location; }
.video-call-record-form .category-wrap { grid-area: category; }
.video-call-record-form .call-content-wrap { grid-area: content; }
.video-call-record-form .call-save-wrap { grid-area: save; }

.video-call-record-form .form-label,
.detail-wrap span {
  display: block;
  margin-bottom: 12px;
  color: #263340;
  font-size: 15px;
  font-weight: 700;
}

.video-call-record-form .form-control,
.video-call-record-form .form-select {
  min-height: 42px;
  border: 0;
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
  font-size: 14px;
}

.video-call-record-form textarea.form-control {
  min-height: 155px;
  resize: vertical;
}

.detail-wrap strong {
  display: block;
  min-height: 42px;
  padding: 10px 2px;
  color: #111827;
  font-size: 15px;
  font-weight: 700;
}

.call-category-checks {
  columns: 2;
  column-gap: 34px;
}

.call-category-checks label {
  break-inside: avoid;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 13px;
  color: #111827;
  font-size: 15px;
  font-weight: 700;
}

.call-category-checks input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.call-save-wrap .btn {
  min-height: 44px;
  padding: 10px 22px;
  border-radius: 3px;
  background: #064aad;
  border-color: #064aad;
  font-size: 15px;
  font-weight: 700;
}

@media (max-width: 1200px) {
  .call-fetch-grid,
  .call-details-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    grid-template-areas: none;
  }

  .video-call-record-form .field-wrap,
  .video-call-record-form .category-wrap,
  .video-call-record-form .call-content-wrap,
  .video-call-record-form .call-save-wrap {
    grid-area: auto !important;
  }
}

@media (max-width: 760px) {
  .call-fetch-grid,
  .call-details-grid {
    grid-template-columns: 1fr;
    padding: 24px 18px;
  }

  .call-category-checks {
    columns: 1;
  }
}

/* Sleek SLIMS Add Call Record polish */
.video-call-record-form {
  gap: 18px;
  color: var(--sims-text);
}

.call-fetch-panel,
.call-details-panel {
  background: #fff;
  border: 1px solid var(--sims-border);
  border-radius: 8px;
  box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
}

.call-section-title {
  min-height: 44px;
  gap: 10px;
  padding: 10px 18px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
}

.call-section-title i {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  background: rgba(255, 255, 255, .16);
  font-size: 13px;
}

.call-section-title.is-blue { background: linear-gradient(90deg, #06459e 0%, #0d63c7 100%); }
.call-section-title.is-green { background: linear-gradient(90deg, #1f7a24 0%, #2f8d2f 100%); }

.call-fetch-grid {
  grid-template-columns: minmax(220px, 1.1fr) minmax(280px, 1.45fr) minmax(120px, .58fr) minmax(110px, .52fr) minmax(110px, .52fr) minmax(110px, .52fr);
  gap: 18px;
  padding: 28px 28px 32px;
  background: #f7fafc;
}

.call-details-grid {
  grid-template-columns: minmax(0, 60%) minmax(340px, 40%);
  grid-template-areas:
    "fields category"
    "content category"
    "save category";
  gap: 20px 32px;
  padding: 26px 28px 28px;
  background: #fff;
}

.call-details-grid > .field-wrap:nth-of-type(1),
.call-details-grid > .field-wrap:nth-of-type(2),
.call-details-grid > .field-wrap:nth-of-type(3) {
  grid-area: auto;
}

.call-details-grid > .field-wrap:nth-of-type(1) {
  grid-column: 1;
  grid-row: 1;
}

.call-details-grid > .field-wrap:nth-of-type(2) {
  grid-column: 1;
  grid-row: 1;
  margin-left: calc(33.333% + 14px);
  width: calc(33.333% - 14px);
}

.call-details-grid > .field-wrap:nth-of-type(3) {
  grid-column: 1;
  grid-row: 1;
  margin-left: calc(66.666% + 14px);
  width: calc(33.333% - 14px);
}

.call-details-grid > .field-wrap:nth-of-type(1) {
  width: calc(33.333% - 14px);
}

.video-call-record-form .form-label,
.detail-wrap span {
  margin-bottom: 8px;
  color: #334155;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.25;
}

.video-call-record-form .form-control,
.video-call-record-form .form-select {
  min-height: 38px;
  border: 1px solid #dbe4ee;
  border-radius: 6px;
  color: #1f2937;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
}

.video-call-record-form .form-control:focus,
.video-call-record-form .form-select:focus {
  border-color: #6aa7e8;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.video-call-record-form textarea.form-control { min-height: 150px; }

.detail-wrap strong {
  min-height: 38px;
  padding: 8px 0;
  color: #111827;
  font-size: 13px;
  font-weight: 600;
}

.call-category-checks {
  columns: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(190px, 1fr));
  gap: 11px 20px;
  padding-top: 2px;
}

.call-category-checks label {
  gap: 8px;
  margin: 0;
  min-width: 0;
  color: #1f2937;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.call-category-checks input {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  accent-color: #0b5fb8;
}

.call-category-checks span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.call-content-wrap {
  max-width: 100%;
}

.call-content-box {
  overflow: hidden;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  background: #f8fbff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .05);
}

.call-editor-toolbar {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border-bottom: 1px solid #e3edf8;
  background: linear-gradient(180deg, #ffffff 0%, #f2f7fd 100%);
}

.call-editor-toolbar button {
  min-height: 30px;
  padding: 6px 11px;
  border: 1px solid #cfe0f2;
  border-radius: 7px;
  background: #fff;
  color: #17406d;
  font-size: 12px;
  font-weight: 700;
}

.call-editor-toolbar button:hover {
  border-color: #8eb9e8;
  background: #edf6ff;
}

.call-content-mode {
  min-height: 30px;
  margin-left: auto;
  padding: 5px 10px;
  border: 1px solid #cfe0f2;
  border-radius: 7px;
  background: #fff;
  color: #17406d;
  font-size: 12px;
  font-weight: 700;
  outline: 0;
}

.call-content-mode:focus {
  border-color: #8eb9e8;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .10);
}

.call-html-editor {
  min-height: 92px;
  padding: 12px 14px;
  outline: 0;
  background: #fff;
  color: #142033;
  font-size: 14px;
  line-height: 1.55;
}

.call-html-editor:empty::before {
  content: attr(data-placeholder);
  color: #8aa0b8;
}

.call-html-editor:focus {
  box-shadow: inset 0 0 0 3px rgba(37, 99, 235, .10);
}

.call-urdu-preview {
  min-height: 48px;
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid #bdebcf;
  border-radius: 10px;
  background: #effdf4;
  color: #166345;
  font-size: 14px;
  line-height: 1.45;
  text-align: right;
}

.call-save-wrap .btn {
  min-height: 40px;
  padding: 9px 18px;
  border-radius: 6px;
  background: #0b5fb8;
  border-color: #0b5fb8;
  font-size: 13px;
  font-weight: 600;
  box-shadow: 0 8px 18px rgba(11, 95, 184, .18);
}

.call-save-wrap .btn:hover {
  background: #094f99;
  border-color: #094f99;
}

@media (max-width: 760px) {
  .call-category-checks { grid-template-columns: 1fr; }
}

@media (max-width: 1200px) {
  .call-details-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "fields"
      "category"
      "content"
      "save";
  }

  .call-details-grid > .field-wrap:nth-of-type(1),
  .call-details-grid > .field-wrap:nth-of-type(2),
  .call-details-grid > .field-wrap:nth-of-type(3) {
    grid-column: auto;
    grid-row: auto;
    width: 100%;
    margin-left: 0;
  }

  .call-category-checks {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }
}

@media (max-width: 760px) {
  .call-category-checks {
    grid-template-columns: 1fr;
  }
}

.call-record-list-panel {
  margin-top: 18px;
  border-radius: 8px;
  overflow: hidden;
}

.call-record-list-table {
  min-width: 1250px;
  font-size: 12px;
}

.call-record-list-table th {
  white-space: nowrap;
  color: #334155;
  font-weight: 700;
  background: #f8fafc;
}

.call-record-list-table td {
  vertical-align: top;
  color: #1f2937;
}

.call-record-list-table td:nth-child(10),
.call-record-list-table td:nth-child(11) {
  min-width: 180px;
  white-space: normal;
}

.sms-category-form-colored {
    background: linear-gradient(135deg, #eff6ff 0%, #e0f2fe 100%);
    border-color: #bfdbfe;
}
.sms-category-form-colored .panel-header {
    background: rgba(37, 99, 235, 0.08);
}
/* Soft call record panel colors */
.video-call-record-form .call-fetch-panel {
    background: linear-gradient(135deg, #f8fbff 0%, #eef6ff 100%) !important;
    border-color: #cfe3ff !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.08) !important;
}
.video-call-record-form .call-details-panel {
    background: linear-gradient(135deg, #fbfffd 0%, #ecfdf5 100%) !important;
    border-color: #c9f3dd !important;
    box-shadow: 0 12px 26px rgba(22, 163, 74, 0.08) !important;
}
.video-call-record-form .call-section-title.is-blue {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%) !important;
    color: #1e3a8a !important;
    border-bottom: 1px solid #bfdbfe !important;
}
.video-call-record-form .call-section-title.is-green {
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%) !important;
    color: #14532d !important;
    border-bottom: 1px solid #bbf7d0 !important;
}
.video-call-record-form .call-section-title i {
    background: rgba(255, 255, 255, 0.7) !important;
    color: inherit !important;
}
.video-call-record-form .call-fetch-grid,
.video-call-record-form .call-details-grid,
.video-call-record-form .call-details-split,
.video-call-record-form .call-category-panel,
.video-call-record-form .call-content-wrap {
    background: rgba(255, 255, 255, 0.58) !important;
}

/* Category 30/70 layout */
.category-two-col-layout {
    display: grid;
    grid-template-columns: minmax(260px, 30%) 1fr;
    gap: 22px;
    align-items: start;
}
.category-two-col-layout .module-form-panel,
.category-two-col-layout .module-table-panel {
    margin-bottom: 0;
}
.category-form-stack {
    display: grid;
    gap: 16px;
}
.call-category-panel-colored {
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    border-color: #bbf7d0;
}
.call-category-panel-colored .panel-header {
    background: rgba(22, 163, 74, 0.09);
}
@media (max-width: 992px) {
    .category-two-col-layout { grid-template-columns: 1fr; }
}
/* SMS upload 30/70 layout polish */
.sms-upload-two-col-layout {
    grid-template-columns: minmax(260px, 30%) 1fr;
}
.sms-upload-form-colored {
    background: linear-gradient(135deg, #f8fbff 0%, #eaf4ff 100%);
    border-color: #cfe3ff;
}
.sms-upload-form-colored .panel-header {
    background: rgba(37, 99, 235, 0.08);
}
.sms-upload-form-colored .btn {
    width: 100%;
    justify-content: center;
}
/* Call record table compact no-scroll layout */
.call-record-list-panel .table-responsive {
    overflow-x: hidden !important;
}
.call-record-list-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
}
.call-record-list-table th,
.call-record-list-table td {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    padding: 10px 10px !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
    vertical-align: middle !important;
}
.call-record-list-table th:nth-child(1),
.call-record-list-table td:nth-child(1) { width: 9%; }
.call-record-list-table th:nth-child(2),
.call-record-list-table td:nth-child(2) { width: 8%; }
.call-record-list-table th:nth-child(3),
.call-record-list-table td:nth-child(3) { width: 9%; }
.call-record-list-table th:nth-child(4),
.call-record-list-table td:nth-child(4) { width: 8%; }
.call-record-list-table th:nth-child(5),
.call-record-list-table td:nth-child(5) { width: 8%; }
.call-record-list-table th:nth-child(6),
.call-record-list-table td:nth-child(6) { width: 10%; }
.call-record-list-table th:nth-child(7),
.call-record-list-table td:nth-child(7) { width: 10%; }
.call-record-list-table th:nth-child(8),
.call-record-list-table td:nth-child(8) { width: 12%; }
.call-record-list-table th:nth-child(9),
.call-record-list-table td:nth-child(9) { width: 26%; }
.call-record-list-table .call-record-group-row td,
.call-record-group-row td {
    background: var(--region-bg, #e5e7eb) !important;
    color: var(--region-fg, #334155) !important;
    font-weight: 800 !important;
    padding: 10px 14px !important;
    border-color: rgba(15, 23, 42, 0.08) !important;
}
.call-record-list-table .call-record-group-row strong {
    color: inherit !important;
}
.call-record-list-table .call-record-detail-row td {
    background: #ffffff !important;
}
/* Users page 30/70 layout */
.sims-user-layout {
    grid-template-columns: minmax(280px, 30%) 1fr !important;
    align-items: start !important;
    gap: 22px !important;
}
.sims-user-layout > div:first-child,
.sims-user-layout > div:last-child {
    min-width: 0;
}
.sims-user-form {
    background: linear-gradient(135deg, #f8fbff 0%, #eef6ff 100%);
    border-color: #cfe3ff;
}
.sims-user-form .panel-header {
    background: rgba(37, 99, 235, 0.08) !important;
}
.sims-user-form .row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
}
.sims-user-form .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}
.sims-user-form .btn-success {
    width: 100%;
    justify-content: center;
    margin-top: 14px;
}
.sims-users-table .table-responsive {
    overflow-x: auto;
}
@media (max-width: 992px) {
    .sims-user-layout { grid-template-columns: 1fr !important; }
}
/* Users Add User/Add Group tabs */
.sims-user-left-panel {
    min-width: 0;
}
.user-inline-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 8px;
    margin-bottom: 12px;
    background: #eef6ff;
    border: 1px solid #cfe3ff;
    border-radius: 16px;
}
.user-inline-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    border-radius: 12px;
    color: #274060;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
}
.user-inline-tab.active {
    background: linear-gradient(135deg, #2563eb, #1d9bf0);
    color: #fff;
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.18);
}
.sims-user-left-panel .sims-user-form,
.sims-user-left-panel .panel.mb-3 {
    margin-bottom: 0 !important;
}
.sims-user-left-panel .panel .row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
}
.sims-user-left-panel .panel .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}
.sims-user-left-panel .panel .btn-success {
    width: 100%;
    justify-content: center;
}
/* Move user tabs down into the left card visually */
.sims-user-left-panel {
    padding-top: 0 !important;
}
.sims-user-left-panel .user-inline-tabs {
    margin: 0 0 -1px 0 !important;
    border-radius: 16px 16px 0 0 !important;
    border-bottom: 0 !important;
    background: #f8fbff !important;
    position: relative;
    z-index: 2;
}
.sims-user-left-panel > .panel {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}
.sims-user-left-panel .panel-header {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}
/* Hide duplicate inner headers under Users tabs */
.sims-user-left-panel > .sims-user-form > .panel-header,
.sims-user-left-panel > .panel > .panel-header {
    display: none !important;
}
.sims-user-left-panel > .panel,
.sims-user-left-panel > .sims-user-form {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}
/* Station manager readonly region display */
.call-region-readonly {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border: 1px solid #cfe3ff;
    border-radius: 12px;
    background: #eef6ff;
    color: #14315c;
    font-weight: 800;
}
/* Program Schedule / View FPC tabs */
.program-page-tabs {
    display: inline-flex;
    gap: 10px;
    padding: 8px;
    margin: 0 0 18px 0;
    background: #eef6ff;
    border: 1px solid #cfe3ff;
    border-radius: 16px;
}
.program-page-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 22px;
    border-radius: 12px;
    color: #274060;
    text-decoration: none;
    font-weight: 800;
}
.program-page-tab.active {
    background: linear-gradient(135deg, #2563eb, #1d9bf0);
    color: #fff;
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.18);
}
/* Program schedule region filter */
.program-schedule-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.program-schedule-region-filter {
    margin: 0;
    min-width: 260px;
}
.program-schedule-region-filter .form-select {
    min-height: 42px;
    border-radius: 12px;
}
@media (max-width: 768px) {
    .program-schedule-header { align-items: stretch; flex-direction: column; }
    .program-schedule-region-filter { min-width: 0; width: 100%; }
}
/* Make Program Schedule region dropdown prominent */
.program-schedule-header .program-schedule-region-filter {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    min-width: 360px;
}
.program-region-label {
    font-weight: 400;
    color: #14315c;
    white-space: nowrap;
}
.program-schedule-region-filter .form-select {
    min-width: 240px;
    background-color: #fff;
    border: 1px solid #bfdbfe;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.08);
}
/* Program header inline tabs */
.program-inline-tabs {
    display: inline-flex;
    gap: 8px;
    padding: 4px;
    background: #eef6ff;
    border: 1px solid #cfe3ff;
    border-radius: 13px;
}
.program-inline-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 16px;
    border-radius: 10px;
    color: #274060;
    text-decoration: none;
    font-weight: 400;
    white-space: nowrap;
}
.program-inline-tab.active {
    background: linear-gradient(135deg, #2563eb, #1d9bf0);
    color: #fff;
    font-weight: 400;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.16);
}
.program-schedule-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.embedded-fpc-scroll {
    padding: 16px;
}

/* Call form topic moved to fetch panel */
.video-call-record-form .call-fetch-grid {
  grid-template-columns: minmax(130px, .7fr) minmax(190px, .9fr) minmax(230px, 1.05fr) repeat(4, minmax(96px, .45fr)) !important;
  gap: 10px !important;
  align-items: end !important;
}
.video-call-record-form .call-topic-wrap {
  min-width: 0;
}
.video-call-record-form .call-details-grid > .field-wrap:nth-of-type(1) {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: calc(50% - 12px) !important;
  margin-left: 0 !important;
}
.video-call-record-form .call-details-grid > .field-wrap:nth-of-type(2) {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: calc(50% - 12px) !important;
  margin-left: calc(50% + 12px) !important;
}
.video-call-record-form .call-details-grid > .field-wrap:nth-of-type(3) {
  grid-column: auto !important;
  grid-row: auto !important;
  width: auto !important;
  margin-left: 0 !important;
}
@media(max-width: 1200px) {
  .video-call-record-form .call-fetch-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
  }
}
@media(max-width: 900px) {
  .video-call-record-form .call-details-grid > .field-wrap:nth-of-type(1),
  .video-call-record-form .call-details-grid > .field-wrap:nth-of-type(2) {
    grid-column: auto !important;
    grid-row: auto !important;
    width: 100% !important;
    margin-left: 0 !important;
  }
}
.video-call-record-form .call-fetch-grid .field-wrap,
.video-call-record-form .call-fetch-grid .detail-wrap {
  min-width: 0;
}
.video-call-record-form .call-fetch-grid .form-select,
.video-call-record-form .call-fetch-grid .form-control {
  min-width: 0;
  height: 42px;
}
.video-call-record-form .call-fetch-grid .detail-wrap {
  padding: 10px 12px !important;
  min-height: 42px !important;
}
.video-call-record-form .call-fetch-grid .detail-wrap strong {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.call-topic-heading {
  color: #c2410c;
  font-weight: 500;
}
/* Call category labels normal text */
.video-call-record-form .call-category-checks label,
.video-call-record-form .call-category-checks label span {
  font-weight: 400 !important;
}
/* Force call category checkbox text normal */
.video-call-record-form .category-wrap .call-category-checks,
.video-call-record-form .category-wrap .call-category-checks *,
.video-call-record-form .category-wrap label,
.video-call-record-form .category-wrap span {
  font-weight: 400 !important;
}
/* Manage SMS card layout restore */
.sms-manage-card-panel .panel-header h2 {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.sms-record-card-list {
    display: grid;
    gap: 14px;
}

.sms-record-card {
    border: 1px solid #d7e2f2;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.sms-record-card.is-edited {
    background: #fff8db;
    border-color: #f3d36b;
}

.sms-record-card-head {
    display: grid;
    grid-template-columns: 72px 96px 150px 120px 96px minmax(140px, 1fr) minmax(130px, 1fr);
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    background: #f4f8ff;
    border-bottom: 1px solid #dbe7f7;
    color: #10233f;
    font-size: 13px;
    font-weight: 700;
}

.sms-record-card.is-edited .sms-record-card-head {
    background: #ffefaa;
    border-bottom-color: #edcf67;
}

.sms-record-card-head span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.sms-record-card-head .sms-short-code {
    color: #138a3d;
    font-weight: 900;
}

.sms-record-card-labels,
.sms-record-card-body {
    display: grid;
    grid-template-columns: minmax(95px, 0.55fr) minmax(210px, 1.05fr) minmax(430px, 1.8fr) 72px;
    gap: 12px;
    align-items: start;
}

.sms-record-card-labels {
    padding: 10px 12px 0;
    color: #10233f;
    font-size: 12px;
    text-transform: uppercase;
}

.sms-record-card-body {
    padding: 8px 12px 12px;
}

.sms-record-card .sms-name-cell,
.sms-record-card .sms-message-cell {
    min-height: 42px;
    padding: 10px;
    border: 1px solid #e1eaf7;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.78);
    color: #17243a;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.sms-record-card .sms-category-check-form {
    margin: 0;
    padding: 10px;
    border: 1px solid #d9e9ff;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.82);
}

.sms-record-card .sms-category-checks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 10px;
}

.sms-record-card .sms-category-checks label {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    gap: 7px;
    align-items: start;
    margin: 0;
    padding: 7px 8px;
    border: 1px solid #e2ebf8;
    border-radius: 8px;
    background: #ffffff;
    cursor: pointer;
}

.sms-record-card .sms-category-checks input {
    width: 14px;
    height: 14px;
    margin: 2px 0 0;
}

.sms-record-card .sms-category-checks span {
    color: #12233d;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.sms-record-card .sms-category-save {
    margin-top: 10px;
    float: right;
}

.sms-record-card .sms-category-chips {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.sms-record-card .sms-category-chips span,
.sms-record-card .sms-category-chips em {
    padding: 5px 8px;
    border-radius: 999px;
    background: #eaf2ff;
    color: #18396b;
    font-size: 12px;
    font-weight: 700;
}

@media (max-width: 1100px) {
    .sms-record-card-head,
    .sms-record-card-labels,
    .sms-record-card-body {
        grid-template-columns: 1fr;
    }

    .sms-record-card-labels {
        display: none;
    }

    .sms-record-card-head {
        gap: 6px;
    }
}

/* Manage SMS action column and width correction */
.sms-record-card-labels,
.sms-record-card-body {
    grid-template-columns: minmax(95px, 0.55fr) minmax(210px, 1.05fr) minmax(430px, 1.8fr) 72px !important;
}

.sms-record-card .sms-name-cell {
    max-width: 100%;
}

.sms-record-card .sms-message-cell {
    max-height: 118px;
    overflow: auto;
}

.sms-action-cell {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 42px;
    padding-top: 8px;
}

.sms-action-cell .sms-audit-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid #bfd4f5;
    border-radius: 8px;
    background: #f4f8ff;
    color: #2563eb;
    cursor: help;
    font-size: 16px;
}

.sms-action-cell .sms-audit-info:hover,
.sms-action-cell .sms-audit-info:focus {
    background: #eaf2ff;
    border-color: #2563eb;
    outline: none;
}

@media (max-width: 1100px) {
    .sms-record-card-labels,
    .sms-record-card-body {
        grid-template-columns: 1fr !important;
    }

    .sms-action-cell {
        justify-content: flex-start;
    }
}

/* Manage SMS city/province header labels */
.sms-record-card-head b {
    color: #5a6b85;
    font-weight: 800;
    margin-right: 3px;
}

.sms-record-card:not(.is-edited) {
    background: #ffffff !important;
    border-color: #d7e2f2 !important;
}

.sms-record-card:not(.is-edited) .sms-record-card-head {
    background: #f4f8ff !important;
    border-bottom-color: #dbe7f7 !important;
}

.sms-record-card.is-edited {
    background: #fff8db !important;
    border-color: #f3d36b !important;
}

.sms-record-card.is-edited .sms-record-card-head {
    background: #ffefaa !important;
    border-bottom-color: #edcf67 !important;
}

/* Manage SMS blue header and city/province badges */
.sms-record-card-head {
    color: #1d4ed8 !important;
}

.sms-record-card-head span:not(.sms-short-code) {
    color: #1d4ed8 !important;
}

.sms-record-card-head .sms-location-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    padding: 5px 9px;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8 !important;
    font-weight: 800;
    line-height: 1.1;
}

.sms-record-card-head .sms-location-badge.is-province {
    border-color: #c7d2fe;
    background: #eef2ff;
    color: #3730a3 !important;
}

.sms-record-card-head .sms-location-badge b {
    color: inherit !important;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0;
}

/* Manage SMS header spacing refinement */
.sms-record-card-head {
    grid-template-columns: 52px 78px 150px 112px 86px auto auto !important;
    justify-content: start !important;
    gap: 14px !important;
    padding: 9px 12px !important;
}

.sms-record-card-head .sms-location-badge {
    justify-self: start !important;
    min-width: 0 !important;
    padding: 4px 10px !important;
}

.sms-record-card-head .sms-location-badge b {
    margin-right: 2px !important;
}

@media (min-width: 1200px) {
    .sms-record-card-head {
        grid-template-columns: 52px 78px 150px 112px 86px max-content max-content !important;
    }
}

/* Manage SMS audit tooltip */
.sms-action-cell .sms-audit-info {
    position: relative;
}

.sms-action-cell .sms-audit-info::after {
    content: attr(data-audit);
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 50;
    min-width: 220px;
    max-width: 320px;
    padding: 10px 12px;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
    color: #0f2f66;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.55;
    white-space: pre-line;
    text-align: left;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    pointer-events: none;
}

.sms-action-cell .sms-audit-info:hover::after,
.sms-action-cell .sms-audit-info:focus::after {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
/* Manage SMS audit tooltip markup */
.sms-record-card,
.sms-record-card-body {
    overflow: visible !important;
}

.sms-action-cell .sms-audit-info {
    position: relative;
}

.sms-action-cell .sms-audit-info::after {
    display: none !important;
}

.sms-audit-tooltip {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 100;
    min-width: 240px;
    padding: 10px 12px;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
    color: #0f2f66;
    text-align: left;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    pointer-events: none;
}

.sms-audit-tooltip span {
    display: block;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.65;
    color: #0f2f66;
}

.sms-audit-tooltip b {
    color: #1d4ed8;
    margin-right: 4px;
}

.sms-action-cell .sms-audit-info:hover .sms-audit-tooltip,
.sms-action-cell .sms-audit-info:focus .sms-audit-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
/* View SMS Records layout */
.view-sms-records-page {
    overflow: visible !important;
}

.view-sms-records-page .panel-header {
    align-items: center;
}

.view-sms-filter-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(150px, 1fr)) auto;
    gap: 12px;
    align-items: end;
}

.view-sms-filter-grid .form-label {
    margin-bottom: 5px;
    color: #10233f;
    font-weight: 700;
}

.view-sms-filter-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    white-space: nowrap;
}

.view-sms-table-wrap {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
}

.view-sms-table {
    width: 100%;
    min-width: 1040px;
    border-collapse: collapse;
    table-layout: fixed;
}

.view-sms-table th,
.view-sms-table td {
    padding: 12px 14px;
    border-bottom: 1px solid #e2ebf7;
    color: #10233f;
    vertical-align: top;
}

.view-sms-table th {
    background: #edf5ff;
    color: #0f2f66;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.view-sms-table th:nth-child(1),
.view-sms-table td:nth-child(1) { width: 88px; }
.view-sms-table th:nth-child(2),
.view-sms-table td:nth-child(2) { width: 82px; }
.view-sms-table th:nth-child(3),
.view-sms-table td:nth-child(3) { width: 170px; }
.view-sms-table th:nth-child(4),
.view-sms-table td:nth-child(4) { width: 170px; }
.view-sms-table th:nth-child(6),
.view-sms-table td:nth-child(6) { width: 150px; }
.view-sms-table th:nth-child(7),
.view-sms-table td:nth-child(7) { width: 80px; }

.view-sms-message {
    width: auto;
    white-space: normal;
    overflow-wrap: anywhere;
}

.view-sms-audit {
    position: relative;
    overflow: visible;
}

.view-sms-audit .sms-audit-info {
    position: relative;
}

@media (max-width: 1200px) {
    .view-sms-filter-grid {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }

    .view-sms-filter-actions {
        grid-column: 1 / -1;
    }
}
/* Manage SMS compact card layout */
.sms-record-card-list {
    gap: 8px !important;
}

.sms-record-card {
    border-radius: 6px !important;
}

.sms-record-card-head {
    min-height: 30px !important;
    padding: 6px 10px !important;
    gap: 10px !important;
    font-size: 12px !important;
}

.sms-record-card-head .sms-location-badge {
    padding: 2px 8px !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
}

.sms-record-card-labels {
    padding: 6px 10px 0 !important;
    font-size: 11px !important;
}

.sms-record-card-body {
    padding: 5px 10px 8px !important;
    gap: 8px !important;
    grid-template-columns: minmax(105px, 0.55fr) minmax(260px, 1.05fr) minmax(520px, 1.7fr) 58px !important;
}

.sms-record-card .sms-name-cell,
.sms-record-card .sms-message-cell {
    min-height: 32px !important;
    max-height: 56px !important;
    padding: 6px 8px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    overflow: auto !important;
}

.sms-record-card .sms-category-check-form {
    padding: 6px !important;
}

.sms-record-card .sms-category-checks {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px 6px !important;
}

.sms-record-card .sms-category-checks label {
    min-height: 24px !important;
    padding: 3px 6px !important;
    gap: 5px !important;
    grid-template-columns: 13px minmax(0, 1fr) !important;
    border-radius: 5px !important;
}

.sms-record-card .sms-category-checks input {
    width: 12px !important;
    height: 12px !important;
    margin-top: 2px !important;
}

.sms-record-card .sms-category-checks span {
    font-size: 10.5px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sms-record-card .sms-category-save {
    margin-top: 5px !important;
    padding: 5px 12px !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
}

.sms-action-cell .sms-audit-info {
    width: 28px !important;
    height: 28px !important;
}

@media (min-width: 1500px) {
    .sms-record-card-body {
        grid-template-columns: minmax(95px, 0.45fr) minmax(300px, 1fr) minmax(620px, 1.8fr) 58px !important;
    }

    .sms-record-card .sms-category-checks {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}
/* Manage SMS message as plain label */
.sms-record-card .sms-message-cell {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 4px 0 !important;
    min-height: 0 !important;
    max-height: 64px !important;
    color: #10233f !important;
    line-height: 1.3 !important;
}
/* Manage SMS name as plain label */
.sms-record-card .sms-name-cell {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 4px 0 !important;
    min-height: 0 !important;
    max-height: 48px !important;
    color: #10233f !important;
    line-height: 1.3 !important;
}
/* Call Add: keep Caller Number and Caller Location visible in first row */
.video-call-record-form .call-details-grid > .call-caller-location {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

@media (min-width: 901px) {
  .video-call-record-form .call-details-grid > .call-caller-name,
  .video-call-record-form .call-details-grid > .call-caller-phone,
  .video-call-record-form .call-details-grid > .call-caller-location {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: calc(33.333% - 12px) !important;
    max-width: calc(33.333% - 12px) !important;
  }
  .video-call-record-form .call-details-grid > .call-caller-name { margin-left: 0 !important; }
  .video-call-record-form .call-details-grid > .call-caller-phone { margin-left: calc(33.333% + 6px) !important; }
  .video-call-record-form .call-details-grid > .call-caller-location { margin-left: calc(66.666% + 12px) !important; }
}

@media (max-width: 900px) {
  .video-call-record-form .call-details-grid > .call-caller-name,
  .video-call-record-form .call-details-grid > .call-caller-phone,
  .video-call-record-form .call-details-grid > .call-caller-location {
    grid-column: auto !important;
    grid-row: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
  }
}

/* Call Add final top-fields layout */
.video-call-record-form .call-details-grid {
  align-items: start !important;
}
.video-call-record-form .call-details-grid > .call-top-field {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: start !important;
}
.video-call-record-form .call-details-grid > .call-caller-name.call-top-field {
  width: calc(33.333% - 12px) !important;
  max-width: calc(33.333% - 12px) !important;
  margin-left: 0 !important;
}
.video-call-record-form .call-details-grid > .call-caller-phone.call-top-field {
  width: calc(33.333% - 12px) !important;
  max-width: calc(33.333% - 12px) !important;
  margin-left: calc(33.333% + 6px) !important;
}
.video-call-record-form .call-details-grid > .call-caller-location.call-top-field {
  width: calc(33.333% - 12px) !important;
  max-width: calc(33.333% - 12px) !important;
  margin-left: calc(66.666% + 12px) !important;
}
.video-call-record-form .call-details-grid > .call-content-wrap {
  grid-column: 1 !important;
  grid-row: 2 !important;
}
.video-call-record-form .call-details-grid > .call-save-wrap {
  grid-column: 1 !important;
  grid-row: 3 !important;
}
.video-call-record-form .call-details-grid > .category-wrap {
  grid-column: 2 !important;
  grid-row: 1 / span 3 !important;
}
@media (max-width: 900px) {
  .video-call-record-form .call-details-grid > .call-top-field,
  .video-call-record-form .call-details-grid > .call-caller-name.call-top-field,
  .video-call-record-form .call-details-grid > .call-caller-phone.call-top-field,
  .video-call-record-form .call-details-grid > .call-caller-location.call-top-field {
    grid-column: auto !important;
    grid-row: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
  }
  .video-call-record-form .call-details-grid > .call-content-wrap,
  .video-call-record-form .call-details-grid > .call-save-wrap,
  .video-call-record-form .call-details-grid > .category-wrap {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

/* Call Add compact top-fields row */
.video-call-record-form .call-details-grid > .call-left-top-fields {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  align-items: start !important;
}
.video-call-record-form .call-left-top-fields > .field-wrap {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  grid-column: auto !important;
  grid-row: auto !important;
}
.video-call-record-form .call-left-top-fields .form-control {
  height: 38px !important;
  min-height: 38px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
}
.video-call-record-form .call-left-top-fields .form-label {
  margin-bottom: 6px !important;
  font-size: 13px !important;
}
.video-call-record-form .call-details-grid > .call-content-wrap {
  grid-column: 1 !important;
  grid-row: 2 !important;
}
.video-call-record-form .call-details-grid > .call-save-wrap {
  grid-column: 1 !important;
  grid-row: 3 !important;
}
.video-call-record-form .call-details-grid > .category-wrap {
  grid-column: 2 !important;
  grid-row: 1 / span 3 !important;
}
@media (max-width: 900px) {
  .video-call-record-form .call-details-grid > .call-left-top-fields {
    grid-template-columns: 1fr !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }
}
`r`n/* Urdu keyboard hidden unless Urdu mode selected */`r`n.video-call-record-form .urdu-keyboard { display: none; }`r`n
/* Proper Urdu keyboard panel */
.video-call-record-form .urdu-keyboard {
  direction: rtl;
  flex-direction: column !important;
  gap: 7px !important;
  padding: 12px !important;
  margin: 10px 0 0 !important;
  border: 1px solid #cfe0f2 !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 8px 20px rgba(15, 67, 120, .08) !important;
}
.video-call-record-form .urdu-keyboard-row {
  display: flex !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
}
.video-call-record-form .urdu-key-btn {
  min-width: 42px !important;
  height: 38px !important;
  padding: 0 10px !important;
  border: 1px solid #bdd4ee !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #0f2f58 !important;
  font-family: "Jameel Noori Nastaleeq", "Noto Nastaliq Urdu", "Noto Naskh Arabic", "Urdu Typesetting", serif !important;
  font-size: 18px !important;
  line-height: 1 !important;
  box-shadow: 0 2px 0 #d6e6f7, 0 4px 10px rgba(23, 75, 130, .08) !important;
  cursor: pointer !important;
}
.video-call-record-form .urdu-key-btn:hover {
  background: #eaf4ff !important;
  border-color: #8cb9ea !important;
  transform: translateY(-1px);
}
.video-call-record-form .urdu-key-btn:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 4px rgba(15, 47, 88, .12) !important;
}
.video-call-record-form .urdu-keyboard-actions {
  direction: ltr;
  margin-top: 2px !important;
}
.video-call-record-form .urdu-key-space {
  min-width: 220px !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
.video-call-record-form .urdu-key-back {
  min-width: 120px !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background: #fff5f5 !important;
  border-color: #f2b8b8 !important;
  color: #8a1f1f !important;
}
@media (max-width: 900px) {
  .video-call-record-form .urdu-keyboard-row {
    flex-wrap: wrap !important;
  }
  .video-call-record-form .urdu-key-btn {
    min-width: 38px !important;
    height: 36px !important;
  }
  .video-call-record-form .urdu-key-space {
    min-width: 160px !important;
  }
}

/* Urdu keyboard modal */
.video-call-record-form .urdu-keyboard-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  background: rgba(8, 22, 48, .42) !important;
  backdrop-filter: blur(3px) !important;
}
.video-call-record-form .urdu-keyboard-dialog {
  width: min(760px, 96vw) !important;
  border-radius: 22px !important;
  background: #ffffff !important;
  border: 1px solid #d7e6f7 !important;
  box-shadow: 0 24px 70px rgba(8, 22, 48, .24) !important;
  overflow: hidden !important;
}
.video-call-record-form .urdu-keyboard-modal-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 18px !important;
  background: linear-gradient(135deg, #eaf4ff, #f5fbff) !important;
  color: #10233f !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  border-bottom: 1px solid #d7e6f7 !important;
}
.video-call-record-form .urdu-keyboard-close {
  width: 34px !important;
  height: 34px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #e7f0fb !important;
  color: #17365f !important;
  font-size: 24px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
.video-call-record-form .urdu-keyboard-close:hover {
  background: #d7e8fb !important;
}
.video-call-record-form .urdu-keyboard-modal .urdu-keyboard {
  display: flex !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 18px !important;
}

/* Call Add: stable top row for caller fields */
.video-call-record-form .call-details-grid > .call-left-top-fields {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  align-items: start !important;
}
.video-call-record-form .call-left-top-fields > .field-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  grid-column: auto !important;
  grid-row: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.video-call-record-form .call-left-top-fields .form-control {
  height: 38px !important;
  min-height: 38px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
}
.video-call-record-form .call-left-top-fields .form-label {
  margin-bottom: 6px !important;
  font-size: 13px !important;
}
.video-call-record-form .call-details-grid > .call-content-wrap { grid-column: 1 !important; grid-row: 2 !important; }
.video-call-record-form .call-details-grid > .call-save-wrap { grid-column: 1 !important; grid-row: 3 !important; }
.video-call-record-form .call-details-grid > .category-wrap { grid-column: 2 !important; grid-row: 1 / span 3 !important; }
@media (max-width: 900px) {
  .video-call-record-form .call-details-grid > .call-left-top-fields { grid-template-columns: 1fr !important; grid-column: auto !important; grid-row: auto !important; }
}

/* Urdu keyboard opens under Category area, not as page modal */
.video-call-record-form .urdu-keyboard-side-panel {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  display: none;
  padding: 0 !important;
  margin: 18px 0 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
}
.video-call-record-form .urdu-keyboard-side-panel .urdu-keyboard-dialog {
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  border: 1px solid #cfe0f2 !important;
  box-shadow: 0 12px 28px rgba(15, 67, 120, .10) !important;
  overflow: hidden !important;
}
.video-call-record-form .urdu-keyboard-side-panel .urdu-keyboard-modal-head {
  padding: 10px 12px !important;
  font-size: 14px !important;
  background: #edf7ff !important;
}
.video-call-record-form .urdu-keyboard-side-panel .urdu-keyboard {
  display: flex !important;
  padding: 12px !important;
  gap: 6px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.video-call-record-form .urdu-keyboard-side-panel .urdu-keyboard-row {
  gap: 4px !important;
  flex-wrap: wrap !important;
}
.video-call-record-form .urdu-keyboard-side-panel .urdu-key-btn {
  min-width: 34px !important;
  height: 34px !important;
  font-size: 16px !important;
  border-radius: 8px !important;
}
.video-call-record-form .urdu-keyboard-side-panel .urdu-key-space {
  min-width: 150px !important;
}
.video-call-record-form .urdu-keyboard-side-panel .urdu-key-back {
  min-width: 92px !important;
}
.video-call-record-form .urdu-keyboard-modal:not(.urdu-keyboard-side-panel) {
  display: none !important;
}
`r`n/* Call record collapsible groups */`r`n.call-record-group-row.is-collapsible{cursor:pointer}`r`n.call-group-toggle{border:0;background:rgba(255,255,255,.75);color:var(--region-fg);width:28px;height:28px;border-radius:8px;margin-right:8px;display:inline-flex;align-items:center;justify-content:center}`r`n.call-record-group-row strong{font-weight:600;display:inline-flex;flex-wrap:wrap;gap:8px;align-items:center}`r`n.call-record-group-row strong span:not(:last-child)::after{content:" -";color:#64748b;margin-left:8px}`r`n`r`n/* Call edit modal polish */`r`n.call-category-modal-backdrop{position:fixed;inset:0;z-index:10000;background:rgba(15,23,42,.38);display:flex;align-items:center;justify-content:center;padding:24px}`r`n.call-category-modal{width:min(720px,96vw);max-height:88vh;overflow:auto;background:#fff;border:1px solid #d7e6f7;border-radius:18px;box-shadow:0 24px 70px rgba(15,23,42,.22)}`r`n.call-category-modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:#edf7ff;border-bottom:1px solid #d7e6f7}`r`n.call-category-modal-head button{border:0;background:#e2edf9;border-radius:10px;width:34px;height:34px;font-size:22px;line-height:1}`r`n.call-category-modal-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;padding:18px}`r`n.call-category-modal-list label{display:flex;gap:8px;align-items:center;font-weight:400}`r`n.call-category-modal-actions{display:flex;justify-content:flex-end;gap:10px;padding:14px 18px;border-top:1px solid #e7eef8}`r`n.call-content-modal-body{padding:18px}`r`n.call-content-edit-modal textarea{min-height:190px;font-size:14px;line-height:1.5}`r`n@media(max-width:700px){.call-category-modal-list{grid-template-columns:1fr}}`r`n

/* Cleaner call record group title + compact edit modals */
.call-record-list-table .call-record-group-row td,
.call-record-group-row td {
    font-weight: 600 !important;
    padding: 9px 12px !important;
}
.call-record-group-row .call-group-title {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}
.call-record-group-row .call-group-title span::after,
.call-record-group-row strong span:not(:last-child)::after {
    content: none !important;
}
.call-record-group-row .call-title-sep {
    color: #64748b !important;
    margin: 0 2px !important;
    font-weight: 500 !important;
}
.call-record-group-row .call-group-topic {
    color: #7c3aed !important;
    font-weight: 600 !important;
}
.call-category-modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10000 !important;
    background: rgba(15, 23, 42, .28) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 18px !important;
}
.call-category-modal {
    width: min(560px, 92vw) !important;
    max-height: 78vh !important;
    overflow: auto !important;
    background: #fff !important;
    border: 1px solid #d7e6f7 !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .18) !important;
}
.call-content-edit-modal {
    width: min(540px, 92vw) !important;
}
.call-category-modal-head {
    padding: 11px 14px !important;
    background: #f1f7ff !important;
}
.call-category-modal-head strong {
    font-size: 15px !important;
    font-weight: 600 !important;
}
.call-category-modal-head button {
    width: 30px !important;
    height: 30px !important;
    border-radius: 8px !important;
}
.call-category-modal-list {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px 14px !important;
    padding: 14px !important;
}
.call-category-modal-list label {
    font-size: 14px !important;
    font-weight: 400 !important;
}
.call-category-modal-actions {
    padding: 11px 14px !important;
}
.call-content-modal-body {
    padding: 14px !important;
}
.call-content-edit-modal textarea {
    min-height: 140px !important;
    font-size: 14px !important;
}


/* Category edit modal: neat two-column layout */
.call-category-modal .call-category-modal-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 24px !important;
    row-gap: 10px !important;
    padding: 16px !important;
}
.call-category-modal .call-category-modal-list label {
    display: grid !important;
    grid-template-columns: 18px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
}
.call-category-modal .call-category-modal-list input[type="checkbox"] {
    width: 15px !important;
    height: 15px !important;
    margin: 2px 0 0 0 !important;
}
.call-category-modal .call-category-modal-list span {
    display: block !important;
    min-width: 0 !important;
}
.call-category-modal:not(.call-content-edit-modal) {
    width: min(640px, 94vw) !important;
}
@media (max-width: 620px) {
    .call-category-modal .call-category-modal-list {
        grid-template-columns: 1fr !important;
    }
}


/* Call record audit icon/user label */
.call-editable-cell .call-audit-hover {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background: #eff6ff !important;
    color: #2563eb !important;
    margin-right: 5px !important;
    vertical-align: middle !important;
    cursor: help !important;
}
.call-editable-cell .call-audit-hover i {
    font-size: 12px !important;
}
.call-editable-cell .call-audit-by {
    display: inline-block !important;
    color: #64748b !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    margin: 0 6px 3px 0 !important;
    vertical-align: middle !important;
}
.call-field-editor-badge {
    display: block !important;
    margin-top: 4px !important;
    font-size: 11px !important;
    color: #64748b !important;
    font-weight: 400 !important;
}


/* Total calls badge in call record group heading */
.call-record-group-row .call-total-badge {
    display: inline-flex !important;
    align-items: center !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .78) !important;
    color: var(--region-fg, #1e40af) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    margin-left: 8px !important;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .08) !important;
}
.call-record-group-row .call-total-badge::after {
    content: none !important;
}


/* Compact edit icons in call record table */
.call-record-list-table .call-cell-edit-form {
    display: inline-flex !important;
    margin: 0 0 0 5px !important;
    vertical-align: middle !important;
}
.call-record-list-table .cell-edit-btn {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    padding: 0 !important;
    border-radius: 6px !important;
    border: 1px solid #cbd5e1 !important;
    background: #f8fafc !important;
    color: #2563eb !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    line-height: 1 !important;
}
.call-record-list-table .cell-edit-btn i {
    font-size: 11px !important;
    line-height: 1 !important;
}
.call-record-list-table .cell-edit-btn:hover {
    background: #eaf2ff !important;
    border-color: #93c5fd !important;
}


/* Cleaner compact audit/edit controls in call table */
.call-record-list-table .call-editable-cell {
    vertical-align: top !important;
}
.call-record-list-table .call-audit-hover {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    margin-right: 4px !important;
    background: #eaf2ff !important;
    color: #2563eb !important;
}
.call-record-list-table .call-audit-hover i {
    font-size: 9px !important;
}
.call-record-list-table .call-audit-by {
    font-size: 10px !important;
    margin-right: 4px !important;
}
.call-record-list-table .call-cell-edit-form {
    margin: 2px 0 0 0 !important;
}
.call-record-list-table .cell-edit-btn {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    border-radius: 4px !important;
    border: 1px solid #cbd5e1 !important;
    background: #f8fafc !important;
    color: #1d4ed8 !important;
}
.call-record-list-table .cell-edit-btn i {
    font-size: 9px !important;
}


/* Keep call info icon beside edit icon */
.call-record-list-table .call-cell-actions {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-left: 5px !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}
.call-record-list-table .call-cell-actions .call-cell-edit-form {
    margin: 0 !important;
}
.call-record-list-table .call-cell-actions .call-audit-hover {
    margin: 0 !important;
}


/* Call record header filters in one row */
.call-record-filter-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    min-height: auto !important;
}
.call-record-filter-header h2 {
    margin: 0 !important;
    white-space: nowrap !important;
}
.call-record-inline-filters {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin: 0 !important;
    flex-wrap: nowrap !important;
}
.call-record-inline-filters .form-control,
.call-record-inline-filters .form-select {
    width: 180px !important;
    min-width: 180px !important;
    height: 40px !important;
}
@media (max-width: 760px) {
    .call-record-filter-header {
        align-items: flex-start !important;
        flex-direction: column !important;
    }
    .call-record-inline-filters {
        width: 100% !important;
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
    }
}


/* Producer lock reminder modal */
.producer-lock-modal {
    width: min(460px, 92vw) !important;
}
.producer-lock-body {
    padding: 16px 18px 6px !important;
    color: #334155 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}
.producer-lock-body p {
    margin: 0 !important;
}


/* Beautiful compact call group headers */
.call-record-list-table .call-record-group-row td,
.call-record-group-row td {
    background: linear-gradient(90deg, var(--region-bg, #dbeafe), #f8fbff) !important;
    color: #12345b !important;
    padding: 8px 12px !important;
    border-top: 1px solid rgba(37, 99, 235, .18) !important;
    border-bottom: 1px solid rgba(37, 99, 235, .14) !important;
}
.call-record-group-row .call-group-toggle {
    width: 26px !important;
    height: 26px !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #2563eb !important;
    border: 1px solid rgba(37, 99, 235, .25) !important;
    box-shadow: 0 3px 10px rgba(37, 99, 235, .08) !important;
    margin-right: 8px !important;
}
.call-record-group-row .call-group-toggle i {
    font-size: 12px !important;
}
.call-record-group-row .call-group-title {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    color: #1e3a5f !important;
}
.call-record-group-row .call-group-title > span:not(.call-title-sep):not(.call-total-badge) {
    display: inline-flex !important;
    align-items: center !important;
    padding: 2px 0 !important;
}
.call-record-group-row .call-group-title > span:first-child {
    background: rgba(255,255,255,.72) !important;
    color: var(--region-fg, #1d4ed8) !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    box-shadow: inset 0 0 0 1px rgba(37,99,235,.12) !important;
    font-weight: 600 !important;
}
.call-record-group-row .call-group-topic {
    color: #7c3aed !important;
    font-weight: 500 !important;
}
.call-record-group-row .call-title-sep {
    color: #94a3b8 !important;
    font-weight: 400 !important;
    margin: 0 1px !important;
}
.call-record-group-row .call-total-badge {
    background: #ffffff !important;
    color: #0f62fe !important;
    border: 1px solid rgba(37, 99, 235, .14) !important;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .05) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 5px 11px !important;
    margin-left: 8px !important;
}


/* Search call records: date badges in program groups */
.call-record-group-row .call-date-badge {
    display: inline-flex !important;
    align-items: center !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    background: #eef2ff !important;
    color: #4338ca !important;
    border: 1px solid rgba(67, 56, 202, .16) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    margin-left: 4px !important;
}
.call-record-group-row .call-date-badge.is-alt {
    background: #ecfdf5 !important;
    color: #047857 !important;
    border-color: rgba(4, 120, 87, .18) !important;
}
.call-record-group-row .call-date-badge::after {
    content: none !important;
}


/* Urdu call content display */
.call-content-display-cell .call-content-text {
    display: inline-block !important;
    max-width: calc(100% - 56px) !important;
    vertical-align: top !important;
}
.call-content-display-cell .call-content-text.is-urdu {
    direction: rtl !important;
    text-align: right !important;
    unicode-bidi: plaintext !important;
    font-family: 'Noto Nastaliq Urdu','Jameel Noori Nastaleeq','Noto Naskh Arabic','Segoe UI',Tahoma,Arial,sans-serif !important;
    font-size: 16px !important;
    line-height: 2 !important;
    letter-spacing: 0 !important;
    word-spacing: 2px !important;
}


/* View Records simplified filters */
.call-view-records-filter-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    align-items: end !important;
}
.call-view-records-filter-grid .call-filter-actions {
    align-self: end !important;
}
@media (max-width: 1100px) {
    .call-view-records-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 640px) {
    .call-view-records-filter-grid {
        grid-template-columns: 1fr !important;
    }
}


/* View Records filters: keep action buttons on same row */
.call-view-records-filter-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    align-items: end !important;
}
.call-view-records-filter-grid .call-filter-actions {
    align-self: end !important;
    display: flex !important;
    gap: 8px !important;
    justify-content: flex-start !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    white-space: nowrap !important;
}
.call-view-records-filter-grid .call-filter-actions .btn {
    height: 39px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
@media (max-width: 1180px) {
    .call-view-records-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 760px) {
    .call-view-records-filter-grid {
        grid-template-columns: 1fr !important;
    }
}


/* Bigger readable right-aligned call content */
.call-content-display-cell {
    text-align: right !important;
}
.call-content-display-cell .call-content-text {
    display: block !important;
    max-width: 100% !important;
    text-align: right !important;
    margin-left: auto !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
}
.call-content-display-cell .call-content-text.is-urdu {
    direction: rtl !important;
    text-align: right !important;
    unicode-bidi: plaintext !important;
    font-family: 'Noto Nastaliq Urdu','Jameel Noori Nastaleeq','Noto Naskh Arabic','Segoe UI',Tahoma,Arial,sans-serif !important;
    font-size: 18px !important;
    line-height: 2.15 !important;
    letter-spacing: 0 !important;
    word-spacing: 3px !important;
}
.call-content-display-cell .call-cell-actions {
    float: right !important;
    margin-left: 8px !important;
    margin-right: 0 !important;
}

.program-day-checks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.program-day-checks label {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #cfe3ff;
  border-radius: 8px;
  display: inline-flex;
  gap: 7px;
  min-height: 36px;
  padding: 7px 9px;
}

.program-day-checks input {
  accent-color: #2563eb;
}

.program-day-checks span {
  color: #14315c;
  font-size: 13px;
  font-weight: 600;
}

.program-action-col {
  width: 112px;
  text-align: center;
}

.program-row-actions {
  justify-content: center;
  gap: 6px;
  white-space: nowrap;
}

.program-row-actions .icon-only-btn,
.program-audit-icon {
  align-items: center;
  border-radius: 8px;
  display: inline-flex;
  height: 28px;
  justify-content: center;
  min-height: 28px;
  min-width: 28px;
  padding: 0 !important;
  width: 28px;
}

.program-audit-icon {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #2563eb;
  cursor: help;
}
/* Dashboard SMS/Calls 50-50 overview layout */
.dashboard-overview-sections {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: start !important;
}
.dashboard-overview-box {
  min-width: 0 !important;
}
.dashboard-overview-box .overview-box-grid,
.dashboard-overview-box .dashboard-sms-summary-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.sims-metric-card.is-clickable {
  display: flex !important;
  color: inherit !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
.sims-metric-card.is-clickable:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .12) !important;
  border-color: #9ec5fe !important;
}
.dashboard-category-table-card {
  grid-column: 1 / -1 !important;
  background: #fff !important;
  border: 1px solid #d7e6f7 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06) !important;
}
.dashboard-category-head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 14px !important;
  background: #fff4f4 !important;
  color: #0f2a4a !important;
  border-bottom: 1px solid #f5d2d2 !important;
  font-weight: 500 !important;
}
.dashboard-category-head span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.dashboard-category-head b {
  background: #ef4444 !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  font-weight: 600 !important;
}
.dashboard-category-table-wrap {
  max-height: 230px !important;
  overflow: auto !important;
}
.dashboard-category-table th,
.dashboard-category-table td {
  padding: 9px 12px !important;
  border-color: #e5edf7 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}
.dashboard-category-table th {
  background: #f3f8ff !important;
  color: #0f2a4a !important;
  font-weight: 500 !important;
}
.dashboard-category-table td:last-child,
.dashboard-category-table th:last-child {
  text-align: right !important;
  width: 90px !important;
}
@media (max-width: 1100px) {
  .dashboard-overview-sections {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 700px) {
  .dashboard-overview-box .overview-box-grid,
  .dashboard-overview-box .dashboard-sms-summary-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Dashboard complaint category count: two-column tabular layout */
.dashboard-category-two-col-wrap {
  max-height: 260px !important;
  padding: 10px !important;
}
.dashboard-category-two-col {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px 10px !important;
}
.dashboard-category-mini-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 10px !important;
  background: #f8fbff !important;
  border: 1px solid #dceaf8 !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  color: #0f2a4a !important;
}
.dashboard-category-mini-row span {
  overflow-wrap: anywhere !important;
  font-weight: 400 !important;
}
.dashboard-category-mini-row b {
  min-width: 34px !important;
  text-align: center !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  background: #eaf2ff !important;
  color: #0b5ed7 !important;
  font-weight: 600 !important;
}
@media (max-width: 700px) {
  .dashboard-category-two-col {
    grid-template-columns: 1fr !important;
  }
}

/* Dashboard complaint category count: cleaner two-column table */
.dashboard-category-table-card {
  border-radius: 14px !important;
  border-color: #cfe0f4 !important;
  background: #ffffff !important;
}
.dashboard-category-head {
  background: linear-gradient(90deg, #f8fbff, #fff7f7) !important;
  border-bottom: 1px solid #dbe8f8 !important;
  min-height: 48px !important;
}
.dashboard-category-head b {
  background: #2563eb !important;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .18) !important;
}
.dashboard-category-two-col-wrap {
  padding: 10px 12px 12px !important;
  max-height: 245px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.dashboard-category-two-col-table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 8px !important;
  table-layout: fixed !important;
}
.dashboard-category-two-col-table td {
  background: #f8fbff !important;
  border-top: 1px solid #dbe8f8 !important;
  border-bottom: 1px solid #dbe8f8 !important;
  padding: 9px 10px !important;
  color: #0f2a4a !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  vertical-align: middle !important;
}
.dashboard-category-two-col-table .category-name {
  width: 40% !important;
  border-left: 1px solid #dbe8f8 !important;
  border-radius: 10px 0 0 10px !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
.dashboard-category-two-col-table .category-count {
  width: 10% !important;
  border-right: 1px solid #dbe8f8 !important;
  border-radius: 0 10px 10px 0 !important;
  text-align: right !important;
  color: #0b5ed7 !important;
  font-weight: 600 !important;
}
.dashboard-category-two-col-table .category-count::before {
  content: '' !important;
  display: inline-block !important;
}
.dashboard-category-two-col-table .is-empty {
  visibility: hidden !important;
  border: 0 !important;
  background: transparent !important;
}
@media (max-width: 700px) {
  .dashboard-category-two-col-table,
  .dashboard-category-two-col-table tbody,
  .dashboard-category-two-col-table tr,
  .dashboard-category-two-col-table td {
    display: block !important;
    width: 100% !important;
  }
  .dashboard-category-two-col-table tr {
    margin-bottom: 8px !important;
  }
  .dashboard-category-two-col-table .category-name,
  .dashboard-category-two-col-table .category-count {
    border: 1px solid #dbe8f8 !important;
    border-radius: 10px !important;
    text-align: left !important;
  }
  .dashboard-category-two-col-table .category-count {
    margin-bottom: 6px !important;
  }
}

/* Dashboard calls overview tabular summaries */
.dashboard-call-overview-tables {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  margin-top: 14px !important;
}
.dashboard-call-table-card {
  box-shadow: 0 8px 18px rgba(15, 23, 42, .05) !important;
}
.dashboard-call-table-card .dashboard-category-head {
  background: linear-gradient(90deg, #f4fbff, #f8fbff) !important;
}
.dashboard-call-table-card .dashboard-category-head b {
  background: #0ea5e9 !important;
  box-shadow: 0 6px 16px rgba(14, 165, 233, .18) !important;
}
.dashboard-call-table-card .dashboard-category-two-col-wrap {
  max-height: 220px !important;
}

/* Dashboard production polish: compact 3-column category tables */
.dashboard-category-two-col-table {
  border-spacing: 0 7px !important;
}
.dashboard-category-two-col-table tr {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1fr) 56px minmax(0, 1fr) 56px !important;
  gap: 8px !important;
  margin-bottom: 0 !important;
}
.dashboard-category-two-col-table td {
  display: flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 7px 9px !important;
  border: 1px solid #dbe8f8 !important;
  border-radius: 9px !important;
  background: #f8fbff !important;
}
.dashboard-category-two-col-table .category-name {
  width: auto !important;
  border-radius: 9px !important;
  border-left: 1px solid #dbe8f8 !important;
}
.dashboard-category-two-col-table .category-count {
  width: auto !important;
  justify-content: center !important;
  text-align: center !important;
  border-radius: 9px !important;
  border-right: 1px solid #dbe8f8 !important;
  background: #edf5ff !important;
}
.dashboard-category-two-col-table .is-empty {
  visibility: hidden !important;
  border: 0 !important;
  background: transparent !important;
}
.dashboard-category-two-col-wrap {
  max-height: 210px !important;
}
.dashboard-overview-sections {
  align-items: start !important;
}
.dashboard-overview-box {
  height: auto !important;
}
@media (max-width: 1200px) {
  .dashboard-category-two-col-table tr {
    grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1fr) 56px !important;
  }
}
@media (max-width: 700px) {
  .dashboard-category-two-col-table tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 56px !important;
  }
  .dashboard-category-two-col-table td {
    width: auto !important;
  }
}

/* Final dashboard overview packing fix */
.dashboard-overview-sections {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 18px !important;
  width: 100% !important;
}
.dashboard-overview-box .dashboard-sms-summary-grid,
.dashboard-overview-box .overview-box-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.dashboard-overview-box .dashboard-sms-summary-grid > .dashboard-category-table-card,
.dashboard-overview-box .overview-box-grid > .dashboard-category-table-card {
  grid-column: 1 / -1 !important;
}
.dashboard-category-three-col-wrap {
  padding: 12px !important;
  max-height: 210px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.dashboard-category-three-col-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px 10px !important;
  width: 100% !important;
}
.dashboard-category-pair {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 34px !important;
  padding: 7px 8px !important;
  border: 1px solid #dbe8f8 !important;
  border-radius: 9px !important;
  background: #f8fbff !important;
  color: #0f2a4a !important;
  box-sizing: border-box !important;
}
.dashboard-category-pair span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
}
.dashboard-category-pair b {
  min-width: 34px !important;
  padding: 3px 8px !important;
  border-radius: 8px !important;
  background: #edf5ff !important;
  color: #0b5ed7 !important;
  text-align: center !important;
  font-weight: 600 !important;
  font-size: 12.5px !important;
}
.dashboard-category-two-col-table { display: none !important; }
@media (max-width: 1200px) {
  .dashboard-category-three-col-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 900px) {
  .dashboard-overview-sections { grid-template-columns: 1fr !important; }
}
@media (max-width: 650px) {
  .dashboard-overview-box .dashboard-sms-summary-grid,
  .dashboard-overview-box .overview-box-grid,
  .dashboard-category-three-col-list { grid-template-columns: 1fr !important; }
}

/* Dashboard final alignment fix - remove empty gaps and keep SMS/Calls side by side */
body .main-content > .dashboard-overview-heading,
body .content > .dashboard-overview-heading {
  margin: 0 0 12px !important;
  padding: 0 !important;
  min-height: 0 !important;
}
body .main-content > .stat-grid,
body .content > .stat-grid {
  margin: 0 0 16px !important;
}
body .main-content > .dashboard-overview-sections,
body .content > .dashboard-overview-sections {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  clear: both !important;
}
body .main-content > .dashboard-overview-sections > .dashboard-overview-box,
body .content > .dashboard-overview-sections > .dashboard-overview-box {
  margin: 0 !important;
  padding: 12px !important;
  min-height: 0 !important;
  height: auto !important;
  width: auto !important;
  align-self: start !important;
  box-sizing: border-box !important;
}
.dashboard-overview-sections::before,
.dashboard-overview-sections::after,
.dashboard-overview-box::before,
.dashboard-overview-box::after {
  content: none !important;
  display: none !important;
}
.dashboard-overview-box .overview-box-head {
  margin: 0 0 10px !important;
  min-height: 44px !important;
}
.dashboard-overview-box .dashboard-sms-summary-grid,
.dashboard-overview-box .overview-box-grid {
  margin: 0 !important;
}
@media (max-width: 900px) {
  body .main-content > .dashboard-overview-sections,
  body .content > .dashboard-overview-sections {
    grid-template-columns: 1fr !important;
  }
}

/* Dashboard category count links */
a.dashboard-category-pair,
a.dashboard-category-pair:visited {
  text-decoration: none !important;
  color: #0f2a4a !important;
}
a.dashboard-category-pair.is-clickable {
  cursor: pointer !important;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease !important;
}
a.dashboard-category-pair.is-clickable:hover {
  transform: translateY(-1px) !important;
  border-color: #93c5fd !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, .12) !important;
  background: #f0f7ff !important;
}

/* Manage SMS: remove inner message scrollbars */
.sms-record-card .sms-message-cell {
  max-height: none !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  overflow-y: visible !important;
  overflow-x: visible !important;
  white-space: normal !important;
  display: block !important;
}
.sms-record-card .sms-record-card-body {
  align-items: stretch !important;
}

/* Final SMS summary fit: no cut, no horizontal overflow */
.dashboard-sms-summary-grid .dashboard-category-table-card,
.dashboard-sms-summary-grid .dashboard-category-three-col-wrap {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}
.dashboard-sms-summary-grid .dashboard-category-three-col-list {
  grid-auto-flow: row !important;
  grid-template-rows: none !important;
  grid-auto-columns: auto !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}
.dashboard-sms-summary-grid .dashboard-category-pair {
  min-width: 0 !important;
  max-width: 100% !important;
}
.dashboard-sms-summary-grid .dashboard-category-pair span {
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
@media (max-width: 1200px) {
  .dashboard-sms-summary-grid .dashboard-category-three-col-list {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 900px) {
  .dashboard-sms-summary-grid .dashboard-category-three-col-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 650px) {
  .dashboard-sms-summary-grid .dashboard-category-three-col-list {
    grid-template-columns: 1fr !important;
  }
}

/* Manage SMS: keep one batch save button after current page records */
.sms-record-card .sms-category-save {
  display: none !important;
}
.sms-batch-save-bar {
  position: relative !important;
  clear: both !important;
  width: 100% !important;
  margin-top: 8px !important;
  border-top: 1px solid #dbe8f8 !important;
  background: #f8fbff !important;
}

/* SMS Categories Summary: three categories per row */
.dashboard-sms-summary-grid .dashboard-category-three-col-list {
  grid-auto-flow: row !important;
  grid-template-rows: none !important;
  grid-auto-columns: auto !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
@media (max-width: 900px) {
  .dashboard-sms-summary-grid .dashboard-category-three-col-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 650px) {
  .dashboard-sms-summary-grid .dashboard-category-three-col-list {
    grid-template-columns: 1fr !important;
  }
}

/* Force SMS category summary to 3 items per row on desktop */
body .dashboard-overview-box .dashboard-sms-summary-grid .dashboard-category-three-col-list,
body .dashboard-sms-summary-grid .dashboard-category-table-card .dashboard-category-three-col-list,
body .dashboard-category-table-card .dashboard-category-three-col-wrap .dashboard-category-three-col-list {
  display: grid !important;
  grid-auto-flow: row !important;
  grid-template-rows: none !important;
  grid-auto-columns: auto !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  width: 100% !important;
  max-width: 100% !important;
}
@media (max-width: 900px) {
  body .dashboard-overview-box .dashboard-sms-summary-grid .dashboard-category-three-col-list,
  body .dashboard-sms-summary-grid .dashboard-category-table-card .dashboard-category-three-col-list,
  body .dashboard-category-table-card .dashboard-category-three-col-wrap .dashboard-category-three-col-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 650px) {
  body .dashboard-overview-box .dashboard-sms-summary-grid .dashboard-category-three-col-list,
  body .dashboard-sms-summary-grid .dashboard-category-table-card .dashboard-category-three-col-list,
  body .dashboard-category-table-card .dashboard-category-three-col-wrap .dashboard-category-three-col-list {
    grid-template-columns: 1fr !important;
  }
}

/* Call records admin delete action */
.call-record-action-cell {
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
.call-delete-form {
  display: inline-flex !important;
  margin: 0 !important;
}
.cell-delete-btn {
  width: 30px !important;
  height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid #fecaca !important;
  border-radius: 8px !important;
  background: #fee2e2 !important;
  color: #dc2626 !important;
  box-shadow: none !important;
}
.cell-delete-btn:hover {
  background: #dc2626 !important;
  border-color: #dc2626 !important;
  color: #ffffff !important;
}

/* Global edit icons: plain pen only, no surrounding box */
a.icon-only-btn[title="Edit"],
button.icon-only-btn[title="Edit"],
.inline-actions a.icon-only-btn[title="Edit"],
.program-row-actions a.icon-only-btn[title="Edit"],
.call-record-list-table .cell-edit-btn,
.call-topic-edit-form .cell-edit-btn {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #2563eb !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}
a.icon-only-btn[title="Edit"]:hover,
button.icon-only-btn[title="Edit"]:hover,
.inline-actions a.icon-only-btn[title="Edit"]:hover,
.program-row-actions a.icon-only-btn[title="Edit"]:hover,
.call-record-list-table .cell-edit-btn:hover,
.call-topic-edit-form .cell-edit-btn:hover {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #1d4ed8 !important;
  transform: none !important;
}
a.icon-only-btn[title="Edit"] i,
button.icon-only-btn[title="Edit"] i,
.inline-actions a.icon-only-btn[title="Edit"] i,
.program-row-actions a.icon-only-btn[title="Edit"] i,
.call-record-list-table .cell-edit-btn i,
.call-topic-edit-form .cell-edit-btn i {
  font-size: 14px !important;
  line-height: 1 !important;
}

/* Global action icons: sleek info/delete without background boxes */
.management-audit-hover,
.category-audit-info,
.program-audit-icon,
.call-audit-hover,
.sms-audit-info,
.call-record-list-table .call-audit-hover,
button.icon-only-btn[title*="Delete"],
button.icon-only-btn[title="Delete"],
.inline-actions button.icon-only-btn[title*="Delete"],
.program-row-actions button.icon-only-btn[title*="Delete"],
.cell-delete-btn {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  transform: none !important;
}
.management-audit-hover,
.category-audit-info,
.program-audit-icon,
.call-audit-hover,
.sms-audit-info,
.call-record-list-table .call-audit-hover {
  color: #2563eb !important;
}
button.icon-only-btn[title*="Delete"],
button.icon-only-btn[title="Delete"],
.inline-actions button.icon-only-btn[title*="Delete"],
.program-row-actions button.icon-only-btn[title*="Delete"],
.cell-delete-btn {
  color: #dc2626 !important;
}
.management-audit-hover:hover,
.category-audit-info:hover,
.program-audit-icon:hover,
.call-audit-hover:hover,
.sms-audit-info:hover,
.call-record-list-table .call-audit-hover:hover,
button.icon-only-btn[title*="Delete"]:hover,
button.icon-only-btn[title="Delete"]:hover,
.inline-actions button.icon-only-btn[title*="Delete"]:hover,
.program-row-actions button.icon-only-btn[title*="Delete"]:hover,
.cell-delete-btn:hover {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
.management-audit-hover:hover,
.category-audit-info:hover,
.program-audit-icon:hover,
.call-audit-hover:hover,
.sms-audit-info:hover,
.call-record-list-table .call-audit-hover:hover {
  color: #1d4ed8 !important;
}
button.icon-only-btn[title*="Delete"]:hover,
button.icon-only-btn[title="Delete"]:hover,
.inline-actions button.icon-only-btn[title*="Delete"]:hover,
.program-row-actions button.icon-only-btn[title*="Delete"]:hover,
.cell-delete-btn:hover {
  color: #b91c1c !important;
}
.management-audit-hover i,
.category-audit-info i,
.program-audit-icon i,
.call-audit-hover i,
.sms-audit-info i,
.call-record-list-table .call-audit-hover i,
button.icon-only-btn[title*="Delete"] i,
button.icon-only-btn[title="Delete"] i,
.inline-actions button.icon-only-btn[title*="Delete"] i,
.program-row-actions button.icon-only-btn[title*="Delete"] i,
.cell-delete-btn i {
  font-size: 14px !important;
  line-height: 1 !important;
}

/* Reports analytics tabs */
.reports-analytics-page {
  display: grid;
  gap: 16px;
}

.reports-tabs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px;
  width: max-content;
  max-width: 100%;
  background: #edf6ff;
  border: 1px solid #cfe2ff;
  border-radius: 8px;
}

.reports-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 7px;
  color: #002855;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.reports-tab:hover,
.reports-tab.is-active {
  color: #fff;
  background: #2563eb;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.18);
}

.reports-tab-panel {
  display: grid;
  gap: 14px;
}

.reports-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.reports-metric-card {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 72px;
  padding: 14px 16px;
  border: 1px solid #cfe2ff;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.04);
}

.reports-metric-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #dbeafe;
  color: #2563eb;
  font-size: 18px;
}

.reports-metric-card.is-teal .reports-metric-icon { background: #ccfbf1; color: #0f766e; }
.reports-metric-card.is-purple .reports-metric-icon { background: #ede9fe; color: #7c3aed; }
.reports-metric-card.is-orange .reports-metric-icon { background: #ffedd5; color: #ea580c; }
.reports-metric-card.is-red .reports-metric-icon { background: #fee2e2; color: #dc2626; }

.reports-metric-label {
  color: #3f5f89;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.reports-metric-card strong {
  color: #14358f;
  font-size: 28px;
  line-height: 1;
}

.reports-summary-panel,
.reports-table-panel {
  overflow: hidden;
  border: 1px solid #cfe2ff;
  border-radius: 8px;
  background: #fff;
}

.reports-summary-head,
.reports-table-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid #d8e8ff;
  background: #f4f9ff;
}

.reports-summary-head h3,
.reports-table-head h3 {
  margin: 0;
  color: #002855;
  font-size: 16px;
  font-weight: 900;
}

.reports-summary-head span {
  min-width: 52px;
  padding: 7px 14px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-weight: 900;
  text-align: center;
}

.reports-count-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 14px 16px;
}

.reports-count-pill {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid #cfe2ff;
  border-radius: 7px;
  background: #f8fbff;
}

.reports-count-pill span {
  overflow: hidden;
  color: #002855;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.reports-count-pill b {
  min-width: 38px;
  padding: 5px 9px;
  border-radius: 8px;
  background: #eaf4ff;
  color: #0866d8;
  font-weight: 900;
  text-align: center;
}

.reports-empty {
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px dashed #cfe2ff;
  border-radius: 8px;
  color: #64748b;
  text-align: center;
}

.reports-table th {
  color: #002855;
  font-size: 13px;
  text-transform: uppercase;
}

.reports-table td {
  color: #0f2346;
  font-size: 14px;
}

@media (max-width: 1100px) {
  .reports-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .reports-tabs { width: 100%; }
  .reports-tab { flex: 1; justify-content: center; padding-inline: 10px; }
  .reports-metric-grid,
  .reports-count-grid { grid-template-columns: 1fr; }
}

/* Call Analytics graphs */
.call-analytics-graphs {
  display: grid;
  gap: 22px;
  margin-top: 16px;
}

.call-sector-chart,
.call-percentage-chart {
  padding: 18px 22px;
  border: 1px solid #cfe2ff;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.05);
}

.analytics-title-block,
.call-percentage-head {
  text-align: center;
}

.analytics-title-block h2,
.call-percentage-head h2 {
  margin: 0;
  color: #08245c;
  font-size: 30px;
  font-weight: 900;
  text-transform: uppercase;
}

.analytics-title-block p,
.call-percentage-head p {
  margin: 2px 0 12px;
  color: #08245c;
  font-size: 17px;
  font-weight: 800;
}

.call-percentage-head {
  margin: -18px -22px 16px;
  padding: 12px 16px;
  border-radius: 8px 8px 0 0;
  background: #08245c;
}

.call-percentage-head h2,
.call-percentage-head p {
  color: #fff;
}

.call-region-legend {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 36px;
  margin: 10px 0 16px;
  color: #08245c;
  font-size: 18px;
  font-weight: 900;
}

.call-region-legend span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.call-region-legend i {
  width: 28px;
  height: 22px;
  border-radius: 4px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.25);
}

.call-total-strip {
  display: grid;
  grid-template-columns: 240px repeat(auto-fit, minmax(160px, 1fr));
  align-items: stretch;
  overflow: hidden;
  max-width: 980px;
  margin: 0 auto 22px;
  border: 1px solid #a8b2c7;
  border-radius: 8px;
  background: #fff;
}

.call-total-box {
  display: grid;
  place-items: center;
  padding: 14px 12px;
  background: #08245c;
  color: #fff;
  text-align: center;
}

.call-total-box span {
  font-size: 16px;
  font-weight: 900;
  text-transform: uppercase;
}

.call-total-box strong {
  font-size: 48px;
  line-height: 1;
}

.call-region-total {
  display: grid;
  place-items: center;
  padding: 14px 10px;
  border-left: 1px solid #a8b2c7;
  color: var(--region-color);
  text-align: center;
}

.call-region-total b {
  font-size: 20px;
}

.call-region-total strong {
  font-size: 34px;
  line-height: 1;
}

.call-region-total span {
  color: #08245c;
  font-weight: 800;
}

.call-bar-chart-wrap {
  display: grid;
  grid-template-columns: 56px 1fr;
  align-items: end;
  gap: 12px;
  min-height: 390px;
}

.call-y-axis {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 320px;
  padding-bottom: 42px;
  color: #08245c;
  font-size: 18px;
  font-weight: 800;
  text-align: right;
}

.call-bar-chart {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  align-items: end;
  gap: 18px;
  min-height: 340px;
  padding: 0 8px 0;
  background: repeating-linear-gradient(to top, transparent 0, transparent 62px, #e5e7eb 63px);
  border-bottom: 2px solid #a8b2c7;
}

.call-bar-item {
  display: grid;
  grid-template-rows: 30px 260px auto;
  justify-items: center;
  align-items: end;
  min-width: 0;
}

.call-bar-total {
  align-self: end;
  color: #111827;
  font-size: 22px;
  font-weight: 900;
}

.call-stacked-bar {
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-start;
  width: 56px;
  min-height: 18px;
  overflow: hidden;
  border-radius: 4px 4px 0 0;
}

.call-stacked-bar span {
  display: grid;
  place-items: center;
  min-height: 12px;
  color: #fff;
  font-size: 15px;
  font-weight: 900;
}

.call-bar-item em {
  display: -webkit-box;
  min-height: 44px;
  margin-top: 8px;
  overflow: hidden;
  color: #08245c;
  font-style: normal;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.15;
  text-align: center;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.call-category-total-row {
  display: grid;
  grid-template-columns: 90px repeat(auto-fit, minmax(92px, 1fr)) 70px;
  align-items: center;
  margin-top: 14px;
  border: 1px solid #a8b2c7;
  color: #08245c;
  font-size: 18px;
  font-weight: 900;
  text-align: center;
}

.call-category-total-row b,
.call-category-total-row strong {
  padding: 10px;
  background: #08245c;
  color: #fff;
  text-transform: uppercase;
}

.call-category-total-row span {
  padding: 10px;
  border-left: 1px solid #a8b2c7;
}

.call-donut-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 16px;
}

.call-donut-card {
  display: grid;
  justify-items: center;
  gap: 4px;
  min-height: 220px;
  padding: 12px;
  border: 1px solid #d8dee9;
  border-radius: 8px;
  background: #fff;
  text-align: center;
}

.call-donut-card h3 {
  margin: 0;
  color: var(--donut-color);
  font-size: 19px;
  font-weight: 900;
}

.call-donut-card strong {
  color: var(--donut-color);
  font-size: 30px;
  line-height: 1;
}

.call-donut {
  width: 104px;
  height: 104px;
  border-radius: 50%;
  background: conic-gradient(var(--donut-color) 0 var(--donut-pct), #e8edf8 var(--donut-pct) 100%);
  position: relative;
}

.call-donut::after {
  content: '';
  position: absolute;
  inset: 30px;
  border-radius: 50%;
  background: #fff;
}

.call-donut-card p {
  margin: 0;
  color: #08245c;
  font-size: 15px;
  font-weight: 800;
}

@media (max-width: 1100px) {
  .analytics-title-block h2,
  .call-percentage-head h2 { font-size: 24px; }
  .call-donut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .call-sector-chart,
  .call-percentage-chart { padding: 14px; }
  .call-percentage-head { margin: -14px -14px 14px; }
  .call-total-strip { grid-template-columns: 1fr; }
  .call-region-total { border-left: 0; border-top: 1px solid #a8b2c7; }
  .call-bar-chart-wrap { grid-template-columns: 1fr; }
  .call-y-axis { display: none; }
  .call-bar-chart { overflow-x: auto; grid-auto-flow: column; grid-auto-columns: 96px; grid-template-columns: none; }
  .call-donut-grid { grid-template-columns: 1fr; }
}

/* Call Analytics sub tabs and 4-up cards */
.call-analytics-subtabs {
  display: inline-flex;
  gap: 8px;
  width: max-content;
  max-width: 100%;
  margin-top: 14px;
  padding: 6px;
  border: 1px solid #cfe2ff;
  border-radius: 8px;
  background: #f4f9ff;
}

.reports-subtab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 130px;
  padding: 9px 16px;
  border-radius: 7px;
  color: #08245c;
  font-weight: 900;
  text-decoration: none;
}

.reports-subtab.is-active,
.reports-subtab:hover {
  background: #08245c;
  color: #fff;
}

.call-donut-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.call-region-legend {
  row-gap: 10px;
}

.call-bar-chart.is-district-chart {
  grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
  gap: 12px;
}

.call-bar-chart.is-district-chart .call-stacked-bar {
  width: 44px;
}

.call-bar-chart.is-district-chart .call-bar-item em {
  min-height: 58px;
  transform: rotate(-42deg);
  transform-origin: top center;
  overflow: visible;
  font-size: 12px;
  -webkit-line-clamp: 3;
}

@media (max-width: 1250px) {
  .call-donut-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 920px) {
  .call-donut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .call-analytics-subtabs { width: 100%; }
  .reports-subtab { flex: 1; min-width: 0; }
  .call-donut-grid { grid-template-columns: 1fr; }
}

/* Analytics typography polish and colored region tabs */
.call-sector-chart,
.call-percentage-chart,
.call-analytics-graphs,
.call-analytics-subtabs {
  font-family: 'Poppins', sans-serif;
}

.analytics-title-block h2,
.call-percentage-head h2 {
  letter-spacing: 0;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.18;
}

.analytics-title-block p,
.call-percentage-head p {
  font-size: 14px;
  font-weight: 700;
}

.call-region-legend {
  font-size: 13px;
  font-weight: 700;
}

.call-region-legend i {
  width: 18px;
  height: 14px;
  border-radius: 3px;
}

.call-total-box span {
  font-size: 12px;
  font-weight: 800;
}

.call-total-box strong {
  font-size: 34px;
  font-weight: 800;
}

.call-region-total b {
  font-size: 15px;
  font-weight: 800;
}

.call-region-total strong {
  font-size: 25px;
  font-weight: 800;
}

.call-region-total span,
.call-y-axis,
.call-category-total-row {
  font-size: 13px;
  font-weight: 700;
}

.call-bar-total {
  font-size: 16px;
  font-weight: 800;
}

.call-stacked-bar span {
  font-size: 11px;
  font-weight: 800;
}

.call-bar-item em {
  font-size: 12px;
  font-weight: 700;
}

.call-donut-card h3 {
  font-size: 15px;
  font-weight: 800;
}

.call-donut-card strong {
  font-size: 24px;
  font-weight: 800;
}

.call-donut-card p {
  font-size: 12px;
  font-weight: 700;
}

.call-analytics-subtabs {
  background: transparent;
  border: 0;
  padding: 0;
}

.reports-subtab {
  min-width: 118px;
  border: 1px solid transparent;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.reports-subtab[href*="call_analytics_tab=region"] {
  background: #eaf4ff;
  border-color: #bfdbfe;
  color: #0759c8;
}

.reports-subtab[href*="call_analytics_tab=kp"] {
  background: #e7f8ef;
  border-color: #bbf7d0;
  color: #0b8f24;
}

.reports-subtab[href*="call_analytics_tab=bln"] {
  background: #fff3e4;
  border-color: #fed7aa;
  color: #c45a00;
}

.reports-subtab[href*="call_analytics_tab=gb"] {
  background: #f0eaff;
  border-color: #ddd6fe;
  color: #6d28d9;
}

.reports-subtab.is-active,
.reports-subtab:hover {
  color: #fff;
  transform: translateY(-1px);
}

.reports-subtab[href*="call_analytics_tab=region"].is-active,
.reports-subtab[href*="call_analytics_tab=region"]:hover {
  background: #0759c8;
  border-color: #0759c8;
}

.reports-subtab[href*="call_analytics_tab=kp"].is-active,
.reports-subtab[href*="call_analytics_tab=kp"]:hover {
  background: #0b8f24;
  border-color: #0b8f24;
}

.reports-subtab[href*="call_analytics_tab=bln"].is-active,
.reports-subtab[href*="call_analytics_tab=bln"]:hover {
  background: #f07a00;
  border-color: #f07a00;
}

.reports-subtab[href*="call_analytics_tab=gb"].is-active,
.reports-subtab[href*="call_analytics_tab=gb"]:hover {
  background: #6d28d9;
  border-color: #6d28d9;
}

/* Punjab analytics tab color */
.reports-subtab[href*="call_analytics_tab=punjab"] {
  background: #ffeaf0;
  border-color: #fecdd3;
  color: #be123c;
}

.reports-subtab[href*="call_analytics_tab=punjab"].is-active,
.reports-subtab[href*="call_analytics_tab=punjab"]:hover {
  background: #be123c;
  border-color: #be123c;
  color: #fff;
}

/* Region Wise 50/50 layout, date filter, and graph modal */
.call-analytics-filter {
  display: grid;
  grid-template-columns: minmax(180px, 220px) minmax(180px, 220px) auto;
  align-items: end;
  gap: 12px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #cfe2ff;
  border-radius: 8px;
  background: #f8fbff;
}

.call-analytics-filter .form-label {
  color: #08245c;
  font-size: 12px;
  font-weight: 800;
}

.call-analytics-filter-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.call-analytics-graphs.is-region-50 {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: stretch;
}

.call-analytics-graphs.is-region-50 .call-sector-chart,
.call-analytics-graphs.is-region-50 .call-percentage-chart {
  min-width: 0;
}

.call-analytics-graphs.is-region-50 .analytics-title-block h2,
.call-analytics-graphs.is-region-50 .call-percentage-head h2 {
  font-size: 17px;
}

.call-analytics-graphs.is-region-50 .call-total-strip {
  grid-template-columns: 1fr;
}

.call-analytics-graphs.is-region-50 .call-region-total {
  border-left: 0;
  border-top: 1px solid #a8b2c7;
}

.call-analytics-graphs.is-region-50 .call-bar-chart-wrap {
  grid-template-columns: 34px 1fr;
  min-height: 300px;
}

.call-analytics-graphs.is-region-50 .call-y-axis {
  height: 250px;
  font-size: 11px;
}

.call-analytics-graphs.is-region-50 .call-bar-chart {
  gap: 9px;
  min-height: 270px;
  grid-template-columns: repeat(auto-fit, minmax(58px, 1fr));
}

.call-analytics-graphs.is-region-50 .call-bar-item {
  grid-template-rows: 24px 190px auto;
}

.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: 34px;
}

.call-analytics-graphs.is-region-50 .call-donut-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.analytics-fullscreen-panel {
  position: relative;
}

.analytics-full-btn {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 2;
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: #eaf4ff;
  color: #0759c8;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
  cursor: pointer;
}

.analytics-full-btn:hover {
  background: #0759c8;
  color: #fff;
}

.analytics-modal-open {
  overflow: hidden;
}

.analytics-graph-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(8, 36, 92, 0.62);
}

.analytics-graph-modal-card {
  position: relative;
  width: min(1180px, 96vw);
  max-height: 92vh;
  overflow: auto;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.24);
}

.analytics-graph-modal-close {
  position: sticky;
  top: 12px;
  left: calc(100% - 48px);
  z-index: 3;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin: 12px 12px -48px auto;
  border: 0;
  border-radius: 50%;
  background: #fee2e2;
  color: #dc2626;
  cursor: pointer;
}

.analytics-graph-modal-body {
  padding: 18px;
}

.analytics-graph-modal-body .analytics-fullscreen-panel {
  box-shadow: none;
  border: 0;
}

.analytics-graph-modal-body .call-sector-chart,
.analytics-graph-modal-body .call-percentage-chart {
  min-height: auto;
}

.analytics-graph-modal-body .call-donut-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1100px) {
  .call-analytics-graphs.is-region-50 { grid-template-columns: 1fr; }
  .call-analytics-graphs.is-region-50 .call-donut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .call-analytics-filter { grid-template-columns: 1fr; }
  .call-analytics-filter-actions { flex-wrap: wrap; }
  .analytics-graph-modal { padding: 10px; }
  .analytics-graph-modal-body .call-donut-grid { grid-template-columns: 1fr; }
}

/* Compact analytics graphs */
.call-analytics-graphs {
  gap: 14px;
}

.call-sector-chart,
.call-percentage-chart {
  padding: 12px 14px;
}

.analytics-title-block h2,
.call-percentage-head h2 {
  font-size: 18px;
  line-height: 1.12;
}

.analytics-title-block p,
.call-percentage-head p {
  margin-bottom: 8px;
  font-size: 12px;
}

.call-percentage-head {
  margin: -12px -14px 10px;
  padding: 9px 12px;
}

.call-region-legend {
  gap: 14px;
  margin: 8px 0 10px;
  font-size: 11px;
}

.call-total-strip {
  margin-bottom: 12px;
}

.call-total-box {
  padding: 8px;
}

.call-total-box strong {
  font-size: 28px;
}

.call-region-total {
  padding: 8px;
}

.call-region-total strong {
  font-size: 20px;
}

.call-bar-chart-wrap {
  min-height: 280px;
}

.call-y-axis {
  height: 230px;
  padding-bottom: 34px;
}

.call-bar-chart {
  min-height: 250px;
  gap: 10px;
}

.call-bar-item {
  grid-template-rows: 22px 175px auto;
}

.call-stacked-bar {
  width: 42px;
}

.call-bar-total {
  font-size: 14px;
}

.call-bar-item em {
  min-height: 34px;
  margin-top: 5px;
  font-size: 10px;
}

.call-category-total-row {
  margin-top: 8px;
  font-size: 11px;
}

.call-category-total-row b,
.call-category-total-row strong,
.call-category-total-row span {
  padding: 7px;
}

.call-donut-grid {
  gap: 8px;
}

.call-donut-card {
  min-height: 156px;
  padding: 8px;
}

.call-donut-card h3 {
  font-size: 12px;
}

.call-donut-card strong {
  font-size: 19px;
}

.call-donut {
  width: 74px;
  height: 74px;
}

.call-donut::after {
  inset: 22px;
}

.call-donut-card p {
  font-size: 10px;
}

.call-analytics-filter {
  gap: 10px;
  margin-top: 10px;
  padding: 10px 12px;
}

.call-analytics-subtabs {
  margin-top: 10px;
}

.reports-subtab {
  min-width: 104px;
  padding: 8px 12px;
}

.call-analytics-graphs.is-region-50 .call-bar-chart-wrap {
  min-height: 240px;
}

.call-analytics-graphs.is-region-50 .call-bar-chart {
  min-height: 220px;
}

.call-analytics-graphs.is-region-50 .call-bar-item {
  grid-template-rows: 20px 150px auto;
}

.call-analytics-graphs.is-region-50 .call-donut-card {
  min-height: 138px;
}

.call-analytics-graphs.is-region-50 .call-donut {
  width: 62px;
  height: 62px;
}

.call-analytics-graphs.is-region-50 .call-donut::after {
  inset: 18px;
}

/* Region Wise compact summary table and cleaner graph fit */
.call-analytics-graphs.is-region-50 .call-sector-chart {
  padding-top: 14px;
}

.call-analytics-graphs.is-region-50 .call-total-strip {
  display: grid;
  grid-template-columns: 1.05fr repeat(4, minmax(88px, 1fr));
  width: 100%;
  max-width: none;
  margin: 8px 0 12px;
  border-radius: 6px;
}

.call-analytics-graphs.is-region-50 .call-total-box,
.call-analytics-graphs.is-region-50 .call-region-total {
  min-height: 54px;
  padding: 6px 8px;
}

.call-analytics-graphs.is-region-50 .call-total-box span {
  font-size: 9px;
  line-height: 1.1;
}

.call-analytics-graphs.is-region-50 .call-total-box strong {
  font-size: 20px;
  line-height: 1;
}

.call-analytics-graphs.is-region-50 .call-region-total {
  border-top: 0;
  border-left: 1px solid #a8b2c7;
}

.call-analytics-graphs.is-region-50 .call-region-total b {
  font-size: 10px;
  line-height: 1.1;
}

.call-analytics-graphs.is-region-50 .call-region-total strong {
  font-size: 18px;
  line-height: 1;
}

.call-analytics-graphs.is-region-50 .call-region-total span {
  font-size: 9px;
  line-height: 1.1;
}

.call-analytics-graphs.is-region-50 .call-bar-chart-wrap {
  grid-template-columns: 30px 1fr;
  min-height: 260px;
  gap: 8px;
}

.call-analytics-graphs.is-region-50 .call-y-axis {
  height: 190px;
  padding-bottom: 34px;
  font-size: 10px;
}

.call-analytics-graphs.is-region-50 .call-bar-chart {
  min-height: 226px;
  gap: 8px;
  padding-inline: 4px;
  grid-template-columns: repeat(auto-fit, minmax(52px, 1fr));
}

.call-analytics-graphs.is-region-50 .call-bar-item {
  grid-template-rows: 18px 150px auto;
}

.call-analytics-graphs.is-region-50 .call-bar-total {
  font-size: 12px;
}

.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: 30px;
}

.call-analytics-graphs.is-region-50 .call-stacked-bar span {
  font-size: 9px;
}

.call-analytics-graphs.is-region-50 .call-bar-item em {
  min-height: 30px;
  font-size: 9px;
  line-height: 1.1;
}

@media (max-width: 1250px) {
  .call-analytics-graphs.is-region-50 .call-total-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .call-analytics-graphs.is-region-50 .call-region-total:nth-child(2n + 1) {
    border-left: 0;
  }
  .call-analytics-graphs.is-region-50 .call-region-total {
    border-top: 1px solid #a8b2c7;
  }
}

/* SLIMS soothing shaded graph theme */
.call-sector-chart,
.call-percentage-chart {
  border-color: #d8e8ff;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.call-bar-chart {
  background: repeating-linear-gradient(to top, transparent 0, transparent 56px, rgba(15, 60, 120, 0.08) 57px);
  border-bottom-color: #9fb5d6;
}

.call-stacked-bar {
  width: 38px;
  border-radius: 7px 7px 2px 2px;
  box-shadow: 0 8px 18px rgba(8, 36, 92, 0.12);
}

.call-stacked-bar span {
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
}

.call-stacked-bar span:first-child {
  border-radius: 7px 7px 0 0;
}

.call-bar-total {
  color: #001f54;
}

.call-bar-item em {
  color: #002855;
}

.call-donut-card {
  border-color: #d8e8ff;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  box-shadow: 0 8px 18px rgba(8, 36, 92, 0.05);
}

.call-donut {
  box-shadow: inset 0 0 0 1px rgba(8, 36, 92, 0.05), 0 8px 18px rgba(8, 36, 92, 0.08);
}

.call-donut::after {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: inset 0 0 0 1px rgba(8, 36, 92, 0.04);
}

.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: 34px;
}

.call-region-legend i {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.35), 0 3px 8px rgba(8,36,92,0.12);
}

.call-total-strip {
  background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
  box-shadow: 0 6px 15px rgba(8, 36, 92, 0.05);
}

.call-total-box {
  background: linear-gradient(180deg, #0b3a7a 0%, #08245c 100%);
}

/* Keep analytics bar graphs in one horizontal line */
.call-bar-chart,
.call-bar-chart.is-district-chart,
.call-analytics-graphs.is-region-50 .call-bar-chart {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(58px, 1fr);
  grid-template-columns: none !important;
  align-items: end;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

.call-bar-chart.is-district-chart {
  grid-auto-columns: minmax(54px, 1fr);
}

.call-analytics-graphs.is-region-50 .call-bar-chart {
  grid-auto-columns: minmax(48px, 1fr);
}

.call-bar-chart::-webkit-scrollbar {
  height: 6px;
}

.call-bar-chart::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #bfd7f6;
}

.analytics-graph-modal-body .call-bar-chart {
  grid-auto-columns: minmax(72px, 1fr);
}

/* Slimmer analytics bars */
.call-stacked-bar {
  width: 26px;
}

.call-bar-chart.is-district-chart .call-stacked-bar,
.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: 24px;
}

.call-bar-chart,
.call-bar-chart.is-district-chart {
  grid-auto-columns: minmax(48px, 1fr);
}

.call-analytics-graphs.is-region-50 .call-bar-chart {
  grid-auto-columns: minmax(42px, 1fr);
}

.analytics-graph-modal-body .call-stacked-bar {
  width: 30px;
}

/* Fit analytics bars without horizontal scroll */
.call-bar-chart,
.call-bar-chart.is-district-chart,
.call-analytics-graphs.is-region-50 .call-bar-chart {
  grid-auto-flow: unset;
  grid-auto-columns: unset;
  grid-template-columns: repeat(auto-fit, minmax(34px, 1fr)) !important;
  overflow-x: hidden;
}

.call-stacked-bar {
  width: min(22px, 70%);
}

.call-bar-chart.is-district-chart .call-stacked-bar,
.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: min(20px, 70%);
}

.call-bar-chart {
  gap: 5px;
}

.call-bar-item em {
  max-width: 52px;
  font-size: 8px;
  line-height: 1.05;
}

.call-analytics-graphs.is-region-50 .call-bar-item em {
  max-width: 44px;
  font-size: 7.5px;
}

.call-stacked-bar span {
  font-size: 8px;
}

.analytics-graph-modal-body .call-bar-chart {
  grid-template-columns: repeat(auto-fit, minmax(46px, 1fr)) !important;
  overflow-x: hidden;
}

.analytics-graph-modal-body .call-stacked-bar {
  width: 24px;
}

/* Square analytics bars */
.call-stacked-bar,
.call-stacked-bar span,
.call-stacked-bar span:first-child {
  border-radius: 0 !important;
}

/* Vertical category labels and sleek square bars */
.call-stacked-bar,
.call-bar-chart.is-district-chart .call-stacked-bar,
.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: 18px !important;
  border-radius: 0 !important;
  box-shadow: 0 4px 10px rgba(8, 36, 92, 0.10);
}

.call-stacked-bar span,
.call-stacked-bar span:first-child {
  border-radius: 0 !important;
}

.call-bar-item {
  grid-template-rows: 18px 150px 76px;
}

.call-bar-item em,
.call-analytics-graphs.is-region-50 .call-bar-item em,
.call-bar-chart.is-district-chart .call-bar-item em {
  display: block;
  width: 72px;
  max-width: 72px;
  min-height: 72px;
  margin-top: 6px;
  overflow: hidden;
  color: #002855;
  font-size: 8.5px;
  font-weight: 800;
  line-height: 1.05;
  text-align: left;
  text-overflow: ellipsis;
  white-space: normal;
  transform: rotate(-90deg);
  transform-origin: center center;
  -webkit-line-clamp: unset;
  -webkit-box-orient: unset;
}

.call-analytics-graphs.is-region-50 .call-bar-item {
  grid-template-rows: 18px 145px 72px;
}

.call-analytics-graphs.is-region-50 .call-bar-chart,
.call-bar-chart {
  grid-template-columns: repeat(auto-fit, minmax(32px, 1fr)) !important;
}

.call-stacked-bar span {
  font-size: 7px;
}

/* Align vertical labels directly under bars */
.call-bar-item {
  align-items: center;
  justify-items: center;
}

.call-bar-item em,
.call-analytics-graphs.is-region-50 .call-bar-item em,
.call-bar-chart.is-district-chart .call-bar-item em {
  align-self: start;
  justify-self: center;
  width: 66px;
  max-width: 66px;
  min-height: 66px;
  margin-top: -2px;
  text-align: center;
  transform: rotate(-90deg) translateX(-20px);
  transform-origin: center center;
}

.call-analytics-graphs.is-region-50 .call-bar-item {
  grid-template-rows: 18px 145px 58px;
}

.call-bar-item {
  grid-template-rows: 18px 150px 62px;
}

/* Polished reference-style analytics bar chart */
.call-bar-chart,
.call-bar-chart.is-district-chart,
.call-analytics-graphs.is-region-50 .call-bar-chart {
  grid-auto-flow: unset !important;
  grid-auto-columns: unset !important;
  grid-template-columns: repeat(auto-fit, minmax(64px, 1fr)) !important;
  align-items: end;
  gap: 14px;
  min-height: 270px;
  padding: 0 10px 0;
  overflow: hidden !important;
  background: repeating-linear-gradient(to top, transparent 0, transparent 52px, rgba(8, 36, 92, 0.10) 53px);
  border-bottom: 2px solid #8aa8cf;
}

.call-bar-item,
.call-analytics-graphs.is-region-50 .call-bar-item,
.call-bar-chart.is-district-chart .call-bar-item {
  display: grid;
  grid-template-rows: 24px 190px 44px;
  justify-items: center;
  align-items: end;
  min-width: 0;
}

.call-stacked-bar,
.call-bar-chart.is-district-chart .call-stacked-bar,
.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: 34px !important;
  min-height: 10px;
  border-radius: 0 !important;
  box-shadow: 0 7px 14px rgba(8, 36, 92, 0.10);
}

.call-stacked-bar span,
.call-stacked-bar span:first-child {
  border-radius: 0 !important;
}

.call-bar-total {
  align-self: end;
  color: #061d4f;
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
}

.call-stacked-bar span {
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.call-bar-item em,
.call-analytics-graphs.is-region-50 .call-bar-item em,
.call-bar-chart.is-district-chart .call-bar-item em {
  display: -webkit-box;
  width: auto;
  max-width: 74px;
  min-height: 34px;
  margin-top: 7px;
  overflow: hidden;
  color: #061d4f;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.08;
  text-align: center;
  text-overflow: ellipsis;
  white-space: normal;
  transform: none !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.call-y-axis {
  height: 236px;
  padding-bottom: 44px;
  color: #061d4f;
  font-size: 12px;
  font-weight: 800;
}

.call-category-total-row {
  display: grid;
  grid-template-columns: 72px repeat(auto-fit, minmax(64px, 1fr)) 56px;
  align-items: center;
  margin-top: 10px;
  overflow: hidden;
  border: 1px solid #8aa8cf;
  border-radius: 4px;
  background: #fff;
  color: #061d4f;
  font-size: 13px;
  font-weight: 900;
  text-align: center;
}

.call-category-total-row b,
.call-category-total-row strong {
  padding: 9px 8px;
  background: linear-gradient(180deg, #0b3a7a 0%, #061d4f 100%);
  color: #fff;
  text-transform: uppercase;
}

.call-category-total-row span {
  padding: 9px 6px;
  border-left: 1px solid #8aa8cf;
}

.call-analytics-graphs.is-region-50 .call-bar-chart {
  grid-template-columns: repeat(auto-fit, minmax(52px, 1fr)) !important;
  gap: 9px;
  min-height: 250px;
}

.call-analytics-graphs.is-region-50 .call-bar-item {
  grid-template-rows: 22px 172px 42px;
}

.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: 28px !important;
}

.call-analytics-graphs.is-region-50 .call-category-total-row {
  grid-template-columns: 58px repeat(auto-fit, minmax(52px, 1fr)) 48px;
  font-size: 11px;
}

/* Sindh analytics tab color */
.reports-subtab[href*="call_analytics_tab=sindh"] {
  background: #e7fbf8;
  border-color: #99f6e4;
  color: #0f766e;
}

.reports-subtab[href*="call_analytics_tab=sindh"].is-active,
.reports-subtab[href*="call_analytics_tab=sindh"]:hover {
  background: #0f766e;
  border-color: #0f766e;
  color: #fff;
}

/* Force bar charts to fit in one row cleanly */
.call-bar-chart,
.call-bar-chart.is-district-chart,
.call-analytics-graphs.is-region-50 .call-bar-chart,
.analytics-graph-modal-body .call-bar-chart {
  display: flex !important;
  align-items: end;
  justify-content: space-around;
  gap: clamp(2px, 0.45vw, 8px);
  overflow: hidden !important;
}

.call-bar-item,
.call-analytics-graphs.is-region-50 .call-bar-item,
.call-bar-chart.is-district-chart .call-bar-item {
  flex: 1 1 0;
  min-width: 0;
  max-width: 92px;
}

.call-stacked-bar,
.call-bar-chart.is-district-chart .call-stacked-bar,
.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: clamp(14px, 2.2vw, 30px) !important;
}

.call-analytics-graphs.is-region-50 .call-stacked-bar {
  width: clamp(12px, 1.7vw, 24px) !important;
}

.call-bar-item em,
.call-analytics-graphs.is-region-50 .call-bar-item em,
.call-bar-chart.is-district-chart .call-bar-item em {
  max-width: 100%;
  font-size: clamp(7px, 0.62vw, 10px);
}

.call-stacked-bar span {
  font-size: clamp(6px, 0.62vw, 10px);
}

.call-category-total-row {
  grid-template-columns: 56px repeat(auto-fit, minmax(0, 1fr)) 44px;
}

/* Keep TOTAL bar in one row */
.call-category-total-row,
.call-analytics-graphs.is-region-50 .call-category-total-row {
  display: flex !important;
  align-items: stretch;
  width: 100%;
  min-width: 0;
}

.call-category-total-row b,
.call-category-total-row strong {
  flex: 0 0 58px;
  display: grid;
  place-items: center;
  white-space: nowrap;
}

.call-category-total-row span {
  flex: 1 1 0;
  min-width: 0;
  display: grid;
  place-items: center;
  white-space: nowrap;
}

.call-analytics-graphs.is-region-50 .call-category-total-row b,
.call-analytics-graphs.is-region-50 .call-category-total-row strong {
  flex-basis: 46px;
}

/* Region caller detail report table */
.call-detail-report-panel {
  grid-column: 1 / -1;
  margin-top: 16px;
  overflow-x: auto;
  border: 1px solid #6b7280;
  background: #fff;
}

.call-detail-region-title {
  padding: 4px 10px;
  background: #06285f;
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
}

.call-detail-report-table {
  width: 100%;
  min-width: 920px;
  border-collapse: collapse;
  color: #000;
  font-family: 'Poppins', sans-serif;
  table-layout: fixed;
}

.call-detail-report-table th,
.call-detail-report-table td {
  border: 1px solid #6b7280;
  padding: 5px 7px;
  vertical-align: top;
}

.call-detail-main-head th,
.call-detail-sub-head th {
  background: #e9f4df;
  color: #000;
  font-size: 14px;
  font-weight: 900;
  text-align: center;
}

.call-detail-sub-head th {
  padding-top: 2px;
  padding-bottom: 2px;
}

.call-detail-category-row td {
  background: #465568;
  color: #ffd21f;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
}

.call-detail-text {
  width: 56%;
  font-size: 13px;
  line-height: 1.75;
  text-align: right;
  direction: rtl;
  unicode-bidi: plaintext;
}

.call-detail-date {
  width: 12%;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}

.call-detail-name,
.call-detail-dist {
  width: 12%;
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
}

.call-detail-ser {
  width: 6%;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

/* Caller detail table fixed column widths like reference */
.call-detail-report-table col.call-detail-col-text { width: 58%; }
.call-detail-report-table col.call-detail-col-date { width: 13%; }
.call-detail-report-table col.call-detail-col-name { width: 13%; }
.call-detail-report-table col.call-detail-col-dist { width: 11%; }
.call-detail-report-table col.call-detail-col-ser { width: 5%; }

.call-detail-text { width: auto; }
.call-detail-date { width: auto; }
.call-detail-name,
.call-detail-dist { width: auto; }
.call-detail-ser { width: auto; }

/* Region Wise graphs full width */
.call-analytics-graphs.is-region-50 {
  grid-template-columns: 1fr !important;
}

/* Remove horizontal scroll from caller detail table */
.call-detail-report-panel {
  overflow-x: hidden !important;
}

.call-detail-report-table {
  min-width: 0 !important;
  width: 100% !important;
  table-layout: fixed;
}

.call-detail-report-table th,
.call-detail-report-table td {
  word-break: break-word;
  overflow-wrap: anywhere;
}

.call-detail-date,
.call-detail-ser {
  white-space: normal;
}

/* Fix analytics region summary strip: one clean row */
.call-total-strip,
.call-analytics-graphs .call-total-strip,
.call-analytics-graphs.is-region-50 .call-total-strip {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  width: min(100%, 1220px) !important;
  max-width: 1220px !important;
  margin: 8px auto 18px !important;
  overflow: hidden !important;
  border: 1px solid #9fb5d6 !important;
  border-radius: 7px !important;
  background: #fff !important;
}

.call-total-strip .call-total-box,
.call-analytics-graphs.is-region-50 .call-total-strip .call-total-box {
  flex: 0 0 220px !important;
  min-height: 78px !important;
  padding: 10px 12px !important;
  border: 0 !important;
}

.call-total-strip .call-region-total,
.call-analytics-graphs.is-region-50 .call-total-strip .call-region-total {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  min-height: 78px !important;
  padding: 9px 8px !important;
  border-top: 0 !important;
  border-left: 1px solid #9fb5d6 !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 2px !important;
  text-align: center !important;
}

.call-total-strip .call-total-box span,
.call-analytics-graphs.is-region-50 .call-total-strip .call-total-box span {
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
}

.call-total-strip .call-total-box strong,
.call-analytics-graphs.is-region-50 .call-total-strip .call-total-box strong {
  font-size: 32px !important;
  line-height: 1 !important;
}

.call-total-strip .call-region-total b,
.call-analytics-graphs.is-region-50 .call-total-strip .call-region-total b {
  font-size: 14px !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

.call-total-strip .call-region-total strong,
.call-analytics-graphs.is-region-50 .call-total-strip .call-region-total strong {
  font-size: 24px !important;
  line-height: 1 !important;
}

.call-total-strip .call-region-total span,
.call-analytics-graphs.is-region-50 .call-total-strip .call-region-total span {
  font-size: 12px !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

@media (max-width: 980px) {
  .call-total-strip,
  .call-analytics-graphs .call-total-strip,
  .call-analytics-graphs.is-region-50 .call-total-strip {
    overflow-x: auto !important;
  }
  .call-total-strip .call-total-box,
  .call-total-strip .call-region-total {
    flex-basis: 140px !important;
  }
}

/* SMS Analytics graph layout */
.sms-analytics-graphs {
  grid-template-columns: 1fr;
}

.sms-analytics-filter {
  margin-top: 14px;
}

/* SMS analytics region tabs: match Calls colored tabs */
.reports-subtab[href*="sms_analytics_tab=region"] {
  background: #eaf4ff;
  border-color: #bfdbfe;
  color: #0759c8;
}
.reports-subtab[href*="sms_analytics_tab=kp"] {
  background: #e7f8ef;
  border-color: #bbf7d0;
  color: #0b8f24;
}
.reports-subtab[href*="sms_analytics_tab=bln"] {
  background: #fff3e4;
  border-color: #fed7aa;
  color: #f07a00;
}
.reports-subtab[href*="sms_analytics_tab=gb"] {
  background: #f0eaff;
  border-color: #ddd6fe;
  color: #6d28d9;
}
.reports-subtab[href*="sms_analytics_tab=islamabad"] {
  background: #e6fffb;
  border-color: #99f6e4;
  color: #0f766e;
}
.reports-subtab[href*="sms_analytics_tab=punjab"] {
  background: #ffeaf0;
  border-color: #fecdd3;
  color: #be123c;
}
.reports-subtab[href*="sms_analytics_tab=sindh"] {
  background: #e7fbf8;
  border-color: #99f6e4;
  color: #0f766e;
}
.reports-subtab[href*="sms_analytics_tab=unknown"] {
  background: #f1f5f9;
  border-color: #cbd5e1;
  color: #475569;
}
.reports-subtab[href*="sms_analytics_tab=region"].is-active,
.reports-subtab[href*="sms_analytics_tab=region"]:hover { background: #0759c8; border-color: #0759c8; color: #fff; }
.reports-subtab[href*="sms_analytics_tab=kp"].is-active,
.reports-subtab[href*="sms_analytics_tab=kp"]:hover { background: #0b8f24; border-color: #0b8f24; color: #fff; }
.reports-subtab[href*="sms_analytics_tab=bln"].is-active,
.reports-subtab[href*="sms_analytics_tab=bln"]:hover { background: #f07a00; border-color: #f07a00; color: #fff; }
.reports-subtab[href*="sms_analytics_tab=gb"].is-active,
.reports-subtab[href*="sms_analytics_tab=gb"]:hover { background: #6d28d9; border-color: #6d28d9; color: #fff; }
.reports-subtab[href*="sms_analytics_tab=islamabad"].is-active,
.reports-subtab[href*="sms_analytics_tab=islamabad"]:hover { background: #0f766e; border-color: #0f766e; color: #fff; }
.reports-subtab[href*="sms_analytics_tab=punjab"].is-active,
.reports-subtab[href*="sms_analytics_tab=punjab"]:hover { background: #be123c; border-color: #be123c; color: #fff; }
.reports-subtab[href*="sms_analytics_tab=sindh"].is-active,
.reports-subtab[href*="sms_analytics_tab=sindh"]:hover { background: #0f766e; border-color: #0f766e; color: #fff; }
.reports-subtab[href*="sms_analytics_tab=unknown"].is-active,
.reports-subtab[href*="sms_analytics_tab=unknown"]:hover { background: #475569; border-color: #475569; color: #fff; }

/* Call Analytics caller detail rows: keep all data visible */
.call-detail-report-table tbody tr.call-detail-data-row td {
  display: table-cell !important;
  min-height: 34px;
  color: #061b3f !important;
  background: #fff !important;
  font-size: 13px;
  line-height: 1.55;
  opacity: 1 !important;
  visibility: visible !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-text {
  text-align: right;
  direction: rtl;
  white-space: normal;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-date,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-name,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser {
  text-align: center;
  direction: auto;
  white-space: normal;
}

/* Polished Call Analytics caller detail table */
.call-detail-report-panel {
  border: 1px solid #bdd7ff !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 10px 28px rgba(15, 35, 75, 0.08) !important;
}
.call-detail-region-title {
  background: linear-gradient(90deg, #082a64, #0d4f9f) !important;
  color: #fff !important;
  padding: 8px 12px !important;
  letter-spacing: 0 !important;
}
.call-detail-report-table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: #071c3f !important;
  background: #fff !important;
}
.call-detail-report-table th,
.call-detail-report-table td {
  border: 0 !important;
  border-right: 1px solid #cbdcf4 !important;
  border-bottom: 1px solid #d7e5f7 !important;
  padding: 9px 10px !important;
}
.call-detail-report-table th:last-child,
.call-detail-report-table td:last-child { border-right: 0 !important; }
.call-detail-main-head th,
.call-detail-sub-head th {
  background: #edf6ff !important;
  color: #06285f !important;
  font-size: 12px !important;
  text-transform: uppercase;
}
.call-detail-category-row td {
  background: linear-gradient(90deg, #334760, #4e6075) !important;
  color: #ffd21f !important;
  font-size: 13px !important;
  padding: 7px 12px !important;
}
.call-detail-data-row:nth-child(even) td { background: #fbfdff !important; }
.call-detail-data-row:hover td { background: #f2f8ff !important; }
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-text {
  font-family: 'Jameel Noori Nastaleeq', 'Noto Nastaliq Urdu', 'Noto Naskh Arabic', 'Urdu Typesetting', 'Poppins', sans-serif !important;
  font-size: 16px !important;
  line-height: 1.85 !important;
  color: #06285f !important;
  text-align: right !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-name,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  font-family: 'Jameel Noori Nastaleeq', 'Noto Nastaliq Urdu', 'Noto Naskh Arabic', 'Urdu Typesetting', 'Poppins', sans-serif !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: #06285f !important;
  font-weight: 700 !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-date,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser {
  color: #083277 !important;
  font-weight: 800 !important;
}
.call-detail-report-table col.call-detail-col-text { width: 58% !important; }
.call-detail-report-table col.call-detail-col-date { width: 13% !important; }
.call-detail-report-table col.call-detail-col-name { width: 13% !important; }
.call-detail-report-table col.call-detail-col-dist { width: 11% !important; }
.call-detail-report-table col.call-detail-col-ser { width: 5% !important; }

/* Executive report look for Call Analytics detail table */
.call-detail-report-panel {
  border: 1px solid #b7d5ff !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
  box-shadow: 0 14px 34px rgba(8, 42, 100, 0.12) !important;
}
.call-detail-region-title {
  background: linear-gradient(90deg, #06285f 0%, #0d62bd 58%, #0f766e 100%) !important;
  color: #fff !important;
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  text-transform: uppercase;
}
.call-detail-report-table {
  font-family: 'Poppins', 'Jameel Noori Nastaleeq', 'Noto Nastaliq Urdu', sans-serif !important;
}
.call-detail-main-head th {
  background: linear-gradient(180deg, #eef7ff, #e4f0ff) !important;
  color: #06285f !important;
  font-size: 12px !important;
  padding: 11px 10px !important;
}
.call-detail-sub-head th {
  background: #f7fbff !important;
  color: #16447f !important;
  font-size: 11px !important;
  padding: 8px 10px !important;
}
.call-detail-category-row td {
  background: #ffffff !important;
  padding: 8px 10px !important;
  text-align: center !important;
}
.call-detail-category-row td::before {
  content: attr(data-label);
}
.call-detail-category-row td {
  color: transparent !important;
}
.call-detail-category-row td > * { color: inherit; }
.call-detail-category-row td {
  position: relative;
}
.call-detail-category-row td::after {
  content: attr(data-category);
}
.call-detail-category-row td:not([data-category])::after {
  content: '';
}
.call-detail-category-row td {
  --cat-text: #ffd21f;
}
.call-detail-category-row td::after {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;
  max-width: 88%;
  padding: 6px 16px;
  border-radius: 999px;
  background: linear-gradient(90deg, #06285f, #0d62bd);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  box-shadow: 0 7px 18px rgba(8, 42, 100, 0.18);
}
.call-detail-data-row td {
  padding: 12px 12px !important;
  border-bottom: 1px solid #d9e7f8 !important;
}
.call-detail-data-row:nth-of-type(odd) td { background: #ffffff !important; }
.call-detail-data-row:nth-of-type(even) td { background: #f8fbff !important; }
.call-detail-data-row:hover td {
  background: #eef7ff !important;
  transition: background 140ms ease;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-text {
  background: linear-gradient(180deg, #ffffff, #f6fbff) !important;
  border-right: 4px solid #2f80ed !important;
  color: #06285f !important;
  font-size: 17px !important;
  line-height: 1.9 !important;
  padding: 12px 14px !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-date {
  vertical-align: middle !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-date::before {
  content: none !important;
  display: none !important;
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
  margin-right: 6px;
  color: #0d62bd;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-date {
  color: #083277 !important;
  font-size: 12px !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-name,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  vertical-align: middle !important;
  color: #06285f !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-name {
  font-size: 16px !important;
  font-weight: 900 !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  font-size: 15px !important;
  color: #0f766e !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser {
  vertical-align: middle !important;
  color: transparent !important;
  position: relative;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser::after {
  content: attr(data-ser);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2563eb, #0f766e);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 7px 16px rgba(37, 99, 235, 0.24);
}

/* Center Call Analytics category pill headings */
.call-detail-category-row td {
  text-align: center !important;
  vertical-align: middle !important;
  padding: 10px 12px !important;
}
.call-detail-category-row td::after {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  width: fit-content !important;
  min-width: 180px !important;
}

/* Right align Call Analytics category pill headings */
.call-detail-category-row td {
  text-align: right !important;
  padding-right: 18px !important;
}
.call-detail-category-row td::after {
  margin-left: auto !important;
  margin-right: 0 !important;
}

/* Call records: keep caller city and province badge on separate lines. */
.call-location-cell {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-width: 120px;
    max-width: 170px;
    line-height: 1.35;
    white-space: normal;
}

.call-location-cell .call-location-city {
    display: block;
    max-width: 100%;
    overflow-wrap: break-word;
    word-break: normal;
}

.call-location-cell .call-province-badge {
    display: inline-flex;
    align-items: center;
    width: auto;
    max-width: 100%;
    padding: 2px 8px;
    border-radius: 999px;
    border: 1px solid #facc15;
    background: #fef3c7;
    color: #dc2626;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

/* Manage Call Records: keep table cells normal; city above province badge without extra row lines. */
.call-record-list-table th:nth-child(1),
.call-record-list-table td:nth-child(1) { width: 9% !important; }
.call-record-list-table th:nth-child(2),
.call-record-list-table td:nth-child(2) { width: 12% !important; }
.call-record-list-table th:nth-child(3),
.call-record-list-table td:nth-child(3) { width: 14% !important; }
.call-record-list-table th:nth-child(4),
.call-record-list-table td:nth-child(4) { width: 59% !important; }
.call-record-list-table th:nth-child(5),
.call-record-list-table td:nth-child(5) { width: 6% !important; }
.call-record-list-table td.call-location-cell {
    display: table-cell !important;
    min-width: 130px !important;
    max-width: none !important;
    white-space: normal !important;
    vertical-align: top !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    line-height: 1.35 !important;
}
.call-record-list-table .call-location-city {
    display: block !important;
    max-width: 100% !important;
    margin-bottom: 4px !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
}
.call-record-list-table .call-province-badge {
    display: inline-block !important;
    width: auto !important;
    max-width: 100% !important;
    padding: 2px 8px !important;
    border-radius: 999px !important;
    border: 1px solid #facc15 !important;
    background: #fef3c7 !important;
    color: #dc2626 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
}

/* Add Call Record: keep Program Topic compact so DATE calendar field fits. */
.video-call-record-form .call-fetch-grid {
  grid-template-columns: minmax(150px, .75fr) minmax(210px, .95fr) minmax(160px, .7fr) minmax(90px, .35fr) minmax(90px, .35fr) minmax(80px, .3fr) minmax(160px, .55fr) !important;
  gap: 10px !important;
  align-items: end !important;
}
.video-call-record-form .call-topic-wrap {
  min-width: 0 !important;
}
.video-call-record-form .call-date-edit-wrap {
  min-width: 160px !important;
}
.video-call-record-form .call-date-edit-wrap .call-date-input {
  min-width: 155px !important;
  width: 100% !important;
}
@media (max-width: 1200px) {
  .video-call-record-form .call-fetch-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
  }
}

/* Manage Calls: briefly highlight the row that was just edited and restored. */
.call-record-list-table .call-record-just-edited > td {
  background: #fff7ed !important;
  box-shadow: inset 0 0 0 2px #fb923c !important;
}

/* Call Analytics top controls: Pakistan, date filters and reports */
.call-analytics-control-row {
  display: grid;
  grid-template-columns: minmax(430px, 1.35fr) minmax(420px, 1fr) minmax(190px, .45fr);
  gap: 14px;
  align-items: stretch;
  margin: 12px 0 16px;
}
.call-analytics-control-card {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  border: 1px solid #cfe2ff;
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(8, 36, 92, 0.07);
  padding: 12px;
  min-width: 0;
}
.call-control-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: #06285f;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
}
.call-control-title i {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #eaf4ff;
  color: #2563eb;
}
.call-region-card .call-analytics-subtabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(96px, 1fr));
  gap: 8px;
  width: 100% !important;
  margin-top: 0 !important;
}
.call-region-card .reports-subtab {
  min-width: 0 !important;
  width: 100%;
  height: 38px;
  padding: 8px 10px !important;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 900;
}
.call-filter-card .call-analytics-filter {
  display: grid !important;
  grid-template-columns: minmax(145px, 1fr) minmax(145px, 1fr) auto;
  gap: 10px;
  align-items: end;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.call-filter-card .form-label {
  margin-bottom: 5px;
  color: #06285f;
  font-size: 11px;
  font-weight: 900;
}
.call-filter-card .form-control {
  min-height: 38px;
  border-radius: 8px;
  border-color: #cfe2ff;
  font-weight: 700;
}
.call-filter-card .call-analytics-filter-actions {
  display: flex;
  gap: 7px;
  align-items: center;
  flex-wrap: nowrap;
}
.call-filter-card .btn {
  min-height: 38px;
  border-radius: 8px;
  font-weight: 900;
  white-space: nowrap;
}
.call-report-card {
  background: linear-gradient(135deg, #06285f 0%, #0d62bd 58%, #0f766e 100%);
  color: #fff;
}
.call-report-card .call-control-title {
  color: #fff;
}
.call-report-card .call-control-title i {
  background: rgba(255,255,255,.16);
  color: #fff;
}
.call-report-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.call-report-chip {
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 8px;
  background: rgba(255,255,255,.12);
  color: #fff;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-weight: 900;
  cursor: pointer;
}
.call-report-chip:hover {
  background: rgba(255,255,255,.22);
}
@media (max-width: 1180px) {
  .call-analytics-control-row { grid-template-columns: 1fr; }
  .call-report-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .call-region-card .call-analytics-subtabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .call-filter-card .call-analytics-filter { grid-template-columns: 1fr; }
  .call-filter-card .call-analytics-filter-actions { flex-wrap: wrap; }
}

/* Rebalance Call Analytics controls: compact Pakistan buttons, wider date filters */
.call-analytics-control-row {
  grid-template-columns: minmax(330px, .9fr) minmax(520px, 1.25fr) minmax(180px, .42fr) !important;
  gap: 12px !important;
}
.call-region-card .call-analytics-subtabs {
  grid-template-columns: repeat(3, minmax(74px, 1fr)) !important;
  gap: 7px !important;
}
.call-region-card .reports-subtab {
  height: 34px !important;
  min-width: 0 !important;
  padding: 6px 8px !important;
  font-size: 12px !important;
}
.call-filter-card .call-analytics-filter {
  grid-template-columns: minmax(170px, 1fr) minmax(170px, 1fr) auto !important;
  gap: 10px !important;
}
.call-filter-card .call-analytics-filter-actions {
  min-width: 190px;
}
.call-filter-card .btn {
  padding-inline: 14px !important;
}
.call-report-card {
  padding: 12px !important;
}
@media (max-width: 1280px) {
  .call-analytics-control-row {
    grid-template-columns: minmax(300px, .85fr) minmax(480px, 1.25fr) minmax(170px, .42fr) !important;
  }
  .call-filter-card .call-analytics-filter {
    grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) auto !important;
  }
}
@media (max-width: 1120px) {
  .call-analytics-control-row { grid-template-columns: 1fr !important; }
}

/* Production-safe Call Analytics controls: no overlap */
.call-analytics-control-row {
  display: grid !important;
  grid-template-columns: minmax(360px, 0.9fr) minmax(560px, 1.35fr) minmax(170px, 0.34fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
  width: 100% !important;
  overflow: visible !important;
}
.call-analytics-control-card {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.call-filter-card {
  overflow: visible !important;
}
.call-filter-card .call-analytics-filter {
  grid-template-columns: minmax(170px, 1fr) minmax(170px, 1fr) minmax(190px, auto) !important;
  width: 100% !important;
}
.call-filter-card .call-analytics-filter-actions {
  min-width: 0 !important;
  width: auto !important;
  display: flex !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
}
.call-filter-card .btn {
  min-width: 82px !important;
  padding-inline: 12px !important;
}
.call-report-card {
  width: 100% !important;
  min-width: 0 !important;
  padding: 12px !important;
  align-self: stretch !important;
}
.call-report-card .call-control-title {
  margin-bottom: 8px !important;
  white-space: nowrap !important;
}
.call-report-actions {
  gap: 8px !important;
}
.call-report-chip {
  width: 100% !important;
  min-width: 0 !important;
  height: 40px !important;
  padding: 8px 10px !important;
  white-space: nowrap !important;
}
@media (max-width: 1500px) {
  .call-analytics-control-row {
    grid-template-columns: minmax(330px, 0.85fr) minmax(520px, 1.35fr) minmax(150px, 0.32fr) !important;
  }
  .call-region-card .reports-subtab { font-size: 11.5px !important; }
  .call-filter-card .call-analytics-filter {
    grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) minmax(176px, auto) !important;
  }
  .call-filter-card .btn { min-width: 78px !important; padding-inline: 10px !important; }
}
@media (max-width: 1280px) {
  .call-analytics-control-row {
    grid-template-columns: 1fr 1fr !important;
  }
  .call-report-card {
    grid-column: 1 / -1 !important;
  }
  .call-report-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 900px) {
  .call-analytics-control-row { grid-template-columns: 1fr !important; }
  .call-report-card { grid-column: auto !important; }
}

/* SMS Analytics top controls: same arrangement as Call Analytics */
.sms-analytics-control-row {
  grid-template-columns: minmax(380px, .95fr) minmax(560px, 1.35fr) minmax(170px, .34fr) !important;
}
.sms-region-card .sms-analytics-subtabs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(74px, 1fr)) !important;
  gap: 7px !important;
  width: 100% !important;
  margin-top: 0 !important;
}
.sms-region-card .reports-subtab {
  height: 34px !important;
  min-width: 0 !important;
  width: 100% !important;
  padding: 6px 8px !important;
  font-size: 11.5px !important;
  font-weight: 900 !important;
  border-radius: 8px !important;
}
.sms-filter-card .sms-analytics-filter {
  display: grid !important;
  grid-template-columns: minmax(170px, 1fr) minmax(170px, 1fr) minmax(190px, auto) !important;
  gap: 10px !important;
  align-items: end !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.sms-filter-card .form-label {
  margin-bottom: 5px;
  color: #06285f;
  font-size: 11px;
  font-weight: 900;
}
.sms-filter-card .form-control {
  min-height: 38px;
  border-radius: 8px;
  border-color: #cfe2ff;
  font-weight: 700;
}
.sms-report-card .call-report-chip {
  height: 40px !important;
}
@media (max-width: 1500px) {
  .sms-analytics-control-row {
    grid-template-columns: minmax(360px, .95fr) minmax(520px, 1.35fr) minmax(150px, .32fr) !important;
  }
  .sms-region-card .reports-subtab { font-size: 11px !important; }
  .sms-filter-card .sms-analytics-filter {
    grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) minmax(176px, auto) !important;
  }
}
@media (max-width: 1280px) {
  .sms-analytics-control-row { grid-template-columns: 1fr 1fr !important; }
  .sms-report-card { grid-column: 1 / -1 !important; }
  .sms-report-card .call-report-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 900px) {
  .sms-analytics-control-row { grid-template-columns: 1fr !important; }
  .sms-report-card { grid-column: auto !important; }
  .sms-region-card .sms-analytics-subtabs { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .sms-filter-card .sms-analytics-filter { grid-template-columns: 1fr !important; }
}

/* Compact Call/SMS Analytics control area */
.reports-tabs {
  padding: 6px !important;
  gap: 6px !important;
  margin-bottom: 8px !important;
}
.reports-tab {
  min-height: 42px !important;
  padding: 9px 18px !important;
  font-size: 15px !important;
  border-radius: 8px !important;
}
.call-analytics-control-row {
  margin: 8px 0 12px !important;
  gap: 10px !important;
  align-items: start !important;
}
.call-analytics-control-card {
  padding: 10px !important;
  border-radius: 9px !important;
  box-shadow: 0 8px 18px rgba(8, 36, 92, 0.055) !important;
}
.call-control-title {
  margin-bottom: 8px !important;
  font-size: 13px !important;
}
.call-control-title i {
  width: 26px !important;
  height: 26px !important;
  border-radius: 7px !important;
  font-size: 13px !important;
}
.call-region-card .call-analytics-subtabs,
.sms-region-card .sms-analytics-subtabs {
  gap: 6px !important;
}
.call-region-card .reports-subtab,
.sms-region-card .reports-subtab {
  height: 31px !important;
  padding: 5px 8px !important;
  font-size: 11.5px !important;
  border-radius: 7px !important;
}
.call-filter-card .call-analytics-filter,
.sms-filter-card .sms-analytics-filter {
  gap: 8px !important;
}
.call-filter-card .form-label,
.sms-filter-card .form-label {
  margin-bottom: 4px !important;
  font-size: 10.5px !important;
}
.call-filter-card .form-control,
.sms-filter-card .form-control {
  min-height: 34px !important;
  height: 34px !important;
  border-radius: 7px !important;
  font-size: 14px !important;
  padding: 6px 10px !important;
}
.call-filter-card .btn,
.sms-filter-card .btn {
  min-height: 34px !important;
  height: 34px !important;
  border-radius: 7px !important;
  padding: 6px 11px !important;
  font-size: 13px !important;
}
.call-report-card,
.sms-report-card {
  padding: 10px !important;
}
.call-report-card .call-control-title,
.sms-report-card .call-control-title {
  margin-bottom: 7px !important;
}
.call-report-actions {
  gap: 6px !important;
}
.call-report-chip {
  height: 34px !important;
  min-height: 34px !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  font-size: 13px !important;
}

/* Realtime animated analytics graphs with assigned province palette */
.call-region-legend i {
  background-size: 100% 140% !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35), 0 4px 10px rgba(8,36,92,.14) !important;
}
.call-stacked-bar {
  overflow: hidden !important;
  background: linear-gradient(180deg, rgba(236,245,255,.94), rgba(248,250,252,.72)) !important;
  box-shadow: 0 6px 14px rgba(8,36,92,.11) !important;
}
.call-stacked-bar span {
  position: relative !important;
  background-size: 100% 135% !important;
  transform-origin: bottom center !important;
  animation: slimsBarGrow .72s cubic-bezier(.2,.75,.25,1) both, slimsBarShade 3.8s ease-in-out infinite !important;
}
.call-stacked-bar span::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,0) 42%, rgba(0,0,0,.08));
  pointer-events: none;
}
.call-bar-item:nth-child(2n) .call-stacked-bar span { animation-delay: .06s, .06s !important; }
.call-bar-item:nth-child(3n) .call-stacked-bar span { animation-delay: .12s, .12s !important; }
.call-region-total {
  border-top: 3px solid var(--region-color) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
}
.reports-subtab[href*="call_analytics_tab=kp"],
.reports-subtab[href*="sms_analytics_tab=kp"] { color: #0b8f24 !important; }
.reports-subtab[href*="call_analytics_tab=bln"],
.reports-subtab[href*="sms_analytics_tab=bln"] { color: #c45a00 !important; }
.reports-subtab[href*="call_analytics_tab=gb"],
.reports-subtab[href*="sms_analytics_tab=gb"] { color: #6d28d9 !important; }
.reports-subtab[href*="call_analytics_tab=punjab"],
.reports-subtab[href*="sms_analytics_tab=punjab"] { color: #be123c !important; }
.reports-subtab[href*="call_analytics_tab=sindh"],
.reports-subtab[href*="sms_analytics_tab=sindh"] { color: #0f766e !important; }
.reports-subtab[href*="call_analytics_tab=kp"].is-active,
.reports-subtab[href*="call_analytics_tab=kp"]:hover,
.reports-subtab[href*="sms_analytics_tab=kp"].is-active,
.reports-subtab[href*="sms_analytics_tab=kp"]:hover { background: linear-gradient(135deg, #34d399, #0b8f24) !important; border-color:#0b8f24 !important; color:#fff !important; }
.reports-subtab[href*="call_analytics_tab=bln"].is-active,
.reports-subtab[href*="call_analytics_tab=bln"]:hover,
.reports-subtab[href*="sms_analytics_tab=bln"].is-active,
.reports-subtab[href*="sms_analytics_tab=bln"]:hover { background: linear-gradient(135deg, #fbbf24, #f07a00) !important; border-color:#f07a00 !important; color:#fff !important; }
.reports-subtab[href*="call_analytics_tab=gb"].is-active,
.reports-subtab[href*="call_analytics_tab=gb"]:hover,
.reports-subtab[href*="sms_analytics_tab=gb"].is-active,
.reports-subtab[href*="sms_analytics_tab=gb"]:hover { background: linear-gradient(135deg, #a78bfa, #6d28d9) !important; border-color:#6d28d9 !important; color:#fff !important; }
.reports-subtab[href*="call_analytics_tab=punjab"].is-active,
.reports-subtab[href*="call_analytics_tab=punjab"]:hover,
.reports-subtab[href*="sms_analytics_tab=punjab"].is-active,
.reports-subtab[href*="sms_analytics_tab=punjab"]:hover { background: linear-gradient(135deg, #fb7185, #be123c) !important; border-color:#be123c !important; color:#fff !important; }
.reports-subtab[href*="call_analytics_tab=sindh"].is-active,
.reports-subtab[href*="call_analytics_tab=sindh"]:hover,
.reports-subtab[href*="sms_analytics_tab=sindh"].is-active,
.reports-subtab[href*="sms_analytics_tab=sindh"]:hover { background: linear-gradient(135deg, #2dd4bf, #0f766e) !important; border-color:#0f766e !important; color:#fff !important; }
@keyframes slimsBarGrow {
  from { transform: scaleY(.08); opacity: .45; }
  to { transform: scaleY(1); opacity: 1; }
}
@keyframes slimsBarShade {
  0%, 100% { background-position: 0 0; filter: saturate(1); }
  50% { background-position: 0 100%; filter: saturate(1.08); }
}

/* Analytics title range label */
.analytics-title-range {
  display: inline-block;
  margin-left: 6px;
  font-size: 12px;
  font-weight: 800;
  color: #2563eb;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  padding: 3px 8px;
  vertical-align: middle;
  text-transform: none;
}

/* Call Analytics combined pie charts */
.call-combined-pies-panel {
  margin: 10px 0 14px !important;
}
.call-sector-select-form {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 8px;
}
.call-sector-dropdown {
  position: relative;
  z-index: 5;
}
.call-sector-dropdown summary {
  list-style: none;
  cursor: pointer;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: linear-gradient(135deg, #eff6ff, #ffffff);
  color: #08245c;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(8,36,92,.07);
}
.call-sector-dropdown summary::-webkit-details-marker { display: none; }
.call-sector-dropdown summary i { color: #2563eb; }
.call-sector-dropdown summary b {
  min-width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: 11px;
}
.call-sector-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  width: min(520px, 86vw);
  max-height: 360px;
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 12px;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(8,36,92,.16);
}
.call-sector-menu label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid #dbeafe;
  border-radius: 7px;
  background: #f8fbff;
  color: #08245c;
  font-size: 12px;
  font-weight: 800;
}
.call-sector-menu label span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.call-sector-menu .btn {
  grid-column: 1 / -1;
  min-height: 34px;
}
.call-combined-pies-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.call-combined-pie-card {
  position: relative;
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid #cfe3ff;
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 14px 30px rgba(8,36,92,.07);
}
.call-combined-pie-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  padding-right: 34px;
}
.call-combined-pie-head h2 {
  margin: 0;
  color: #08245c;
  font-size: 16px;
  font-weight: 950;
  letter-spacing: 0;
}
.call-combined-pie-head span {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 4px 10px;
  background: #eff6ff;
  color: #2563eb;
  font-size: 12px;
  font-weight: 950;
}
.call-combined-pie-body {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}
.call-combined-pie {
  width: 142px;
  aspect-ratio: 1;
  border-radius: 50%;
  display: grid;
  place-items: center;
  position: relative;
  animation: slimsPieSpinIn .75s cubic-bezier(.2,.75,.25,1) both;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.7), 0 12px 24px rgba(8,36,92,.12);
}
.call-combined-pie::before {
  content: "";
  position: absolute;
  inset: 31px;
  border-radius: 50%;
  background: #fff;
  box-shadow: inset 0 0 0 1px #e5edf8;
}
.call-combined-pie span {
  position: relative;
  z-index: 1;
  color: #08245c;
  font-size: 22px;
  font-weight: 950;
}
.call-combined-pie-list {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.call-combined-pie-row {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid #dbeafe;
  border-radius: 7px;
  background: #f8fbff;
  color: #08245c;
}
.call-combined-pie-row i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}
.call-combined-pie-row b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 850;
}
.call-combined-pie-row strong,
.call-combined-pie-row span {
  font-size: 12px;
  font-weight: 950;
  color: #2563eb;
}
.call-combined-pie-row span { color: #0f766e; }
.analytics-graph-modal-body .call-combined-pies-grid { grid-template-columns: 1fr !important; }
.analytics-graph-modal-body .call-combined-pie-body { grid-template-columns: 220px 1fr; }
.analytics-graph-modal-body .call-combined-pie { width: 210px; }
@keyframes slimsPieSpinIn {
  from { transform: rotate(-28deg) scale(.88); opacity: .45; }
  to { transform: rotate(0deg) scale(1); opacity: 1; }
}
@media (max-width: 980px) {
  .call-combined-pies-grid { grid-template-columns: 1fr; }
  .call-combined-pie-body { grid-template-columns: 128px minmax(0, 1fr); }
  .call-combined-pie { width: 124px; }
}
@media (max-width: 640px) {
  .call-sector-menu { grid-template-columns: 1fr; }
  .call-combined-pie-body { grid-template-columns: 1fr; justify-items: center; }
  .call-combined-pie-list { width: 100%; }
}

/* Combined charts as solid pie charts, not donuts */
.call-combined-pie::before {
  display: none !important;
}
.call-combined-pie span {
  display: none !important;
}
.call-combined-pie {
  border-radius: 50% !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.65), 0 12px 24px rgba(8,36,92,.12) !important;
}

/* Direct labels for combined pie charts */
.call-combined-pie-wrap {
  position: relative;
  width: 220px;
  height: 220px;
  display: grid;
  place-items: center;
  margin: 0 auto;
}
.call-combined-pie-wrap .call-combined-pie {
  width: 136px !important;
}
.call-pie-callouts {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.call-pie-label {
  --label-radius: 92px;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 86px;
  min-height: 34px;
  transform: translate(-50%, -50%) rotate(var(--pie-angle)) translateY(calc(var(--label-radius) * -1)) rotate(calc(var(--pie-angle) * -1));
  display: grid;
  align-content: center;
  gap: 1px;
  padding: 4px 6px;
  border-radius: 7px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 8px 18px rgba(8, 36, 92, .12);
  text-align: center;
}
.call-pie-label b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #08245c;
  font-size: 9.5px;
  font-weight: 950;
  line-height: 1.05;
}
.call-pie-label em {
  color: var(--pie-color);
  font-size: 9px;
  font-style: normal;
  font-weight: 950;
  line-height: 1;
}
.analytics-graph-modal-body .call-combined-pie-wrap {
  width: 300px;
  height: 300px;
}
.analytics-graph-modal-body .call-combined-pie-wrap .call-combined-pie {
  width: 190px !important;
}
.analytics-graph-modal-body .call-pie-label {
  --label-radius: 130px;
  width: 108px;
  min-height: 40px;
}
@media (max-width: 1180px) {
  .call-combined-pie-body { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .call-combined-pie-wrap { width: 190px; height: 190px; }
  .call-combined-pie-wrap .call-combined-pie { width: 118px !important; }
  .call-pie-label { --label-radius: 80px; width: 74px; }
}

/* Keep combined pie charts clean: use side legend, no crowded overlay labels */
.call-pie-callouts {
  display: none !important;
}
.call-combined-pie-body {
  grid-template-columns: 170px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: center !important;
}
.call-combined-pie-wrap {
  width: 170px !important;
  height: 170px !important;
}
.call-combined-pie-wrap .call-combined-pie,
.call-combined-pie {
  width: 158px !important;
  height: 158px !important;
}
.call-combined-pie-list {
  gap: 7px !important;
}
.call-combined-pie-row {
  grid-template-columns: 12px minmax(0, 1fr) 42px 58px !important;
  min-height: 34px !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #f8fbff, #ffffff) !important;
}
.call-combined-pie-row b {
  font-size: 12.5px !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}
.call-combined-pie-row strong,
.call-combined-pie-row span {
  text-align: right !important;
  font-size: 12px !important;
}
.call-combined-pie-head h2 {
  font-size: 15.5px !important;
}
@media (max-width: 1180px) {
  .call-combined-pie-body { grid-template-columns: 150px minmax(0, 1fr) !important; }
  .call-combined-pie-wrap { width: 150px !important; height: 150px !important; }
  .call-combined-pie-wrap .call-combined-pie,
  .call-combined-pie { width: 138px !important; height: 138px !important; }
}
@media (max-width: 720px) {
  .call-combined-pie-body { grid-template-columns: 1fr !important; justify-items: center !important; }
  .call-combined-pie-list { width: 100% !important; }
}

/* Compact combined pie spacing and larger pie */
.call-combined-pie-body {
  grid-template-columns: 210px minmax(0, 1fr) !important;
  gap: 14px !important;
}
.call-combined-pie-wrap {
  width: 210px !important;
  height: 190px !important;
  justify-self: start !important;
}
.call-combined-pie-wrap .call-combined-pie,
.call-combined-pie {
  width: 184px !important;
  height: 184px !important;
}
.call-combined-pie-row {
  grid-template-columns: 12px minmax(0, 1fr) auto auto !important;
  gap: 8px !important;
}
.call-combined-pie-row strong {
  min-width: 22px !important;
  text-align: right !important;
}
.call-combined-pie-row span {
  min-width: 52px !important;
  text-align: right !important;
}
.call-combined-pie-list {
  align-content: center !important;
}
@media (max-width: 1180px) {
  .call-combined-pie-body { grid-template-columns: 180px minmax(0, 1fr) !important; }
  .call-combined-pie-wrap { width: 180px !important; height: 170px !important; }
  .call-combined-pie-wrap .call-combined-pie,
  .call-combined-pie { width: 160px !important; height: 160px !important; }
}

/* Make pie category dropdown clearly visible */
.call-combined-pies-panel {
  position: relative !important;
  padding-top: 46px !important;
}
.call-sector-select-form {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  margin: 0 !important;
  z-index: 20 !important;
}
.call-sector-dropdown summary {
  min-width: 210px !important;
  justify-content: space-between !important;
  background: linear-gradient(135deg, #2563eb, #0f766e) !important;
  border-color: #2563eb !important;
  color: #fff !important;
  box-shadow: 0 12px 26px rgba(37, 99, 235, .22) !important;
}
.call-sector-dropdown summary::after {
  content: "\f078";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 11px;
  margin-left: 6px;
}
.call-sector-dropdown summary i,
.call-sector-dropdown summary span {
  color: #fff !important;
}
.call-sector-dropdown summary b {
  background: rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.35) !important;
}
.call-sector-menu::before {
  content: "Add / remove pie chart categories";
  grid-column: 1 / -1;
  color: #08245c;
  font-weight: 950;
  font-size: 12px;
  padding-bottom: 4px;
}
@media (max-width: 720px) {
  .call-combined-pies-panel { padding-top: 52px !important; }
  .call-sector-select-form { left: 0 !important; right: auto !important; }
  .call-sector-dropdown summary { min-width: 100% !important; }
}

/* Compact full-view pie modal layout */
.analytics-graph-modal-body .call-combined-pie-card {
  padding: 18px 22px !important;
}
.analytics-graph-modal-body .call-combined-pie-body {
  grid-template-columns: 260px minmax(320px, 620px) !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 28px !important;
}
.analytics-graph-modal-body .call-combined-pie-wrap {
  width: 260px !important;
  height: 240px !important;
  justify-self: center !important;
}
.analytics-graph-modal-body .call-combined-pie-wrap .call-combined-pie,
.analytics-graph-modal-body .call-combined-pie {
  width: 220px !important;
  height: 220px !important;
}
.analytics-graph-modal-body .call-combined-pie-list {
  width: min(620px, 100%) !important;
  justify-self: start !important;
}
.analytics-graph-modal-body .call-combined-pie-row {
  grid-template-columns: 12px minmax(190px, 1fr) 34px 58px !important;
  width: 100% !important;
  max-width: 620px !important;
}
@media (max-width: 900px) {
  .analytics-graph-modal-body .call-combined-pie-body {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .analytics-graph-modal-body .call-combined-pie-list {
    justify-self: center !important;
  }
}

/* Province badges in call detail table */
.call-detail-col-province {
  width: 9%;
}
.call-detail-province {
  text-align: center !important;
  vertical-align: middle !important;
}
.call-detail-province-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 76px;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  color: var(--province-color);
  font-size: 12px;
  font-weight: 950;
  line-height: 1;
  box-shadow: 0 6px 14px rgba(8,36,92,.08);
}
.call-detail-report-table thead th:nth-child(3),
.call-detail-report-table tbody td.call-detail-province {
  background: #f8fbff;
}

/* Province-wise call report table without date column */
.call-detail-province-table .call-detail-col-text { width: 58% !important; }
.call-detail-province-table .call-detail-col-name { width: 16% !important; }
.call-detail-province-table .call-detail-col-dist { width: 16% !important; }
.call-detail-province-table .call-detail-col-ser { width: 10% !important; }
.call-detail-province-row td {
  padding: 0 !important;
  border: 0 !important;
  text-align: center !important;
}
.call-detail-province-row span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 170px;
  min-height: 34px;
  margin: 6px auto;
  padding: 6px 22px;
  border-radius: 999px;
  background: rgba(255,255,255,.95);
  color: var(--province-color);
  font-size: 16px;
  font-weight: 950;
  letter-spacing: 0;
  box-shadow: 0 8px 18px rgba(8,36,92,.18);
}
.call-detail-province-table .call-detail-category-row td {
  text-align: right !important;
  padding-right: 20px !important;
}
.call-detail-province-table .call-detail-data-row td {
  vertical-align: middle !important;
}

/* Professional SLIMS-style call analytics report table */
.call-detail-report-panel {
  border: 1px solid #cfe0f6 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 12px 28px rgba(8, 36, 92, .07) !important;
}
.call-detail-region-title {
  min-height: 38px !important;
  padding: 8px 14px !important;
  background: linear-gradient(90deg, #082a64 0%, #0759c8 100%) !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  text-align: center !important;
  letter-spacing: 0 !important;
}
.call-detail-report-table,
.call-detail-province-table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #ffffff !important;
  color: #08245c !important;
}
.call-detail-report-table th,
.call-detail-report-table td {
  border: 0 !important;
  border-right: 1px solid #d7e5f7 !important;
  border-bottom: 1px solid #e2ecf8 !important;
}
.call-detail-report-table th:last-child,
.call-detail-report-table td:last-child {
  border-right: 0 !important;
}
.call-detail-main-head th,
.call-detail-sub-head th {
  background: #edf6ff !important;
  color: #08245c !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  padding: 9px 10px !important;
  text-align: center !important;
}
.call-detail-sub-head th {
  background: #f8fbff !important;
  font-size: 11px !important;
  color: #315178 !important;
}
.call-detail-province-row td {
  padding: 8px 12px !important;
  border-right: 0 !important;
  text-align: left !important;
}
.call-detail-province-row span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 116px !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 5px 14px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: var(--province-color) !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  box-shadow: 0 6px 14px rgba(8,36,92,.08) !important;
}
.call-detail-category-row td {
  position: relative !important;
  padding: 7px 14px !important;
  background: #fbfdff !important;
  color: transparent !important;
  text-align: right !important;
  border-bottom: 1px solid #dbeafe !important;
}
.call-detail-category-row td::after {
  content: attr(data-category) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: min(520px, 92%) !important;
  min-height: 25px !important;
  padding: 4px 14px !important;
  border-radius: 999px !important;
  background: #eaf4ff !important;
  border: 1px solid #bfdbfe !important;
  color: #0759c8 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  white-space: normal !important;
  box-shadow: none !important;
}
.call-detail-report-table tbody tr.call-detail-data-row td {
  background: #ffffff !important;
  color: #08245c !important;
  padding: 10px 12px !important;
  vertical-align: middle !important;
}
.call-detail-report-table tbody tr.call-detail-data-row:nth-of-type(even) td {
  background: #fbfdff !important;
}
.call-detail-report-table tbody tr.call-detail-data-row:hover td {
  background: #f3f8ff !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-text {
  border-right: 1px solid #d7e5f7 !important;
  background: inherit !important;
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: #08245c !important;
  text-align: right !important;
  direction: rtl !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-name,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  background: inherit !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  font-weight: 850 !important;
  text-align: center !important;
  color: #08245c !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  color: #0f766e !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser {
  background: inherit !important;
  color: transparent !important;
  text-align: center !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser::after {
  content: attr(data-ser) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 999px !important;
  background: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
  color: #0759c8 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
}
.call-detail-province-table .call-detail-col-text { width: 62% !important; }
.call-detail-province-table .call-detail-col-name { width: 15% !important; }
.call-detail-province-table .call-detail-col-dist { width: 15% !important; }
.call-detail-province-table .call-detail-col-ser { width: 8% !important; }

/* Improve call detail report readability and center province strip */
.call-detail-province-row td {
  text-align: center !important;
  padding: 10px 12px !important;
}
.call-detail-province-row span {
  margin-left: auto !important;
  margin-right: auto !important;
  min-width: 150px !important;
  min-height: 32px !important;
  font-size: 15px !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-text {
  font-size: 18px !important;
  line-height: 2.05 !important;
  font-weight: 650 !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-name,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  font-size: 17px !important;
  line-height: 1.9 !important;
  font-weight: 850 !important;
}
.call-detail-category-row td::after {
  font-size: 12.5px !important;
  min-height: 28px !important;
  padding: 5px 16px !important;
}
.call-detail-report-table tbody tr.call-detail-data-row td {
  padding: 12px 14px !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser::after {
  width: 30px !important;
  height: 30px !important;
  font-size: 13px !important;
}

/* Prominent pie on top, labels below */
.call-combined-pie-body {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  align-items: start !important;
  gap: 12px !important;
}
.call-combined-pie-wrap {
  width: 250px !important;
  height: 230px !important;
  justify-self: center !important;
}
.call-combined-pie-wrap .call-combined-pie,
.call-combined-pie {
  width: 220px !important;
  height: 220px !important;
}
.call-combined-pie-list {
  width: 100% !important;
  max-width: 620px !important;
  justify-self: center !important;
}
.call-combined-pie-row {
  grid-template-columns: 12px minmax(0, 1fr) auto auto !important;
  width: 100% !important;
}
.call-combined-pie-card {
  min-height: 360px !important;
}
.analytics-graph-modal-body .call-combined-pie-wrap {
  width: 330px !important;
  height: 310px !important;
}
.analytics-graph-modal-body .call-combined-pie-wrap .call-combined-pie,
.analytics-graph-modal-body .call-combined-pie {
  width: 290px !important;
  height: 290px !important;
}
.analytics-graph-modal-body .call-combined-pie-list {
  max-width: 760px !important;
}
@media (max-width: 1180px) {
  .call-combined-pie-wrap { width: 220px !important; height: 205px !important; }
  .call-combined-pie-wrap .call-combined-pie,
  .call-combined-pie { width: 195px !important; height: 195px !important; }
}

/* Collapsible province sections in call report table */
.call-detail-province-row td {
  text-align: center !important;
}
.call-province-toggle {
  appearance: none;
  background: #ffffff;
  color: var(--province-color);
  border-radius: 999px;
  min-height: 34px;
  min-width: 230px;
  padding: 6px 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font: inherit;
  font-size: 14px;
  font-weight: 950;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(8,36,92,.08);
}
.call-province-toggle i {
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  transition: transform .18s ease;
}
.call-province-toggle b {
  color: #0759c8;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  padding: 3px 8px;
  font-size: 11px;
  line-height: 1;
}
.call-detail-province-row:not(.is-open) .call-province-toggle i {
  transform: rotate(-90deg);
}
.call-province-toggle:hover {
}
.call-detail-province-row span {
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* 3D glossy interactive analytics graphics */
.analytics-title-block h2,
.call-percentage-head h2,
.call-combined-pie-head h2 {
  text-transform: capitalize !important;
  letter-spacing: 0 !important;
  font-weight: 900 !important;
  color: #08245c !important;
  font-family: 'Poppins', Arial, sans-serif !important;
}
.analytics-title-block p,
.call-percentage-head p {
  text-transform: none !important;
  font-weight: 800 !important;
  color: #315178 !important;
}
.call-sector-chart,
.call-percentage-chart,
.call-combined-pie-card {
  perspective: 1100px !important;
  transform-style: preserve-3d !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
.call-sector-chart:hover,
.call-percentage-chart:hover,
.call-combined-pie-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 22px 46px rgba(8, 36, 92, .14) !important;
  border-color: #bfdbfe !important;
}
.call-combined-pie,
.call-donut,
.call-stacked-bar {
  transform-style: preserve-3d !important;
  transition: transform .22s ease, filter .22s ease, box-shadow .22s ease !important;
}
.call-combined-pie {
  position: relative !important;
  border: 1px solid rgba(255,255,255,.75) !important;
  filter: saturate(1.12) contrast(1.03) !important;
  box-shadow:
    inset -18px -22px 34px rgba(8, 36, 92, .16),
    inset 14px 16px 22px rgba(255,255,255,.36),
    0 18px 34px rgba(8,36,92,.20) !important;
}
.call-combined-pie::after {
  content: "" !important;
  position: absolute !important;
  inset: 8% 12% 48% 16% !important;
  display: block !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, rgba(255,255,255,.70), rgba(255,255,255,.08) 62%, rgba(255,255,255,0)) !important;
  filter: blur(.1px) !important;
  pointer-events: none !important;
}
.call-combined-pie-card:hover .call-combined-pie {
  transform: rotateX(10deg) rotateY(-12deg) scale(1.035) !important;
  box-shadow:
    inset -22px -26px 38px rgba(8, 36, 92, .19),
    inset 16px 18px 24px rgba(255,255,255,.42),
    0 24px 44px rgba(8,36,92,.24) !important;
}
.call-donut {
  filter: saturate(1.08) contrast(1.02) !important;
  box-shadow:
    inset -12px -14px 24px rgba(8,36,92,.12),
    inset 10px 12px 18px rgba(255,255,255,.35),
    0 14px 24px rgba(8,36,92,.14) !important;
}
.call-donut-card:hover .call-donut {
  transform: rotateX(11deg) rotateY(-10deg) scale(1.06) !important;
}
.call-stacked-bar {
  position: relative !important;
  overflow: visible !important;
  transform: rotateX(0deg) translateZ(0) !important;
  box-shadow: 8px 12px 20px rgba(8,36,92,.15) !important;
}
.call-stacked-bar::before {
  content: "";
  position: absolute;
  left: 100%;
  top: 4px;
  width: 8px;
  height: calc(100% - 4px);
  background: linear-gradient(180deg, rgba(8,36,92,.20), rgba(8,36,92,.05));
  transform: skewY(-28deg);
  transform-origin: left top;
  opacity: .45;
  pointer-events: none;
}
.call-stacked-bar::after {
  content: "";
  position: absolute;
  left: 4px;
  right: -4px;
  bottom: -8px;
  height: 8px;
  background: linear-gradient(90deg, rgba(8,36,92,.18), rgba(8,36,92,.05));
  transform: skewX(-38deg);
  opacity: .42;
  pointer-events: none;
}
.call-bar-item:hover .call-stacked-bar {
  transform: translateY(-5px) rotateX(8deg) rotateY(-6deg) !important;
  filter: saturate(1.12) brightness(1.04) !important;
  box-shadow: 12px 18px 28px rgba(8,36,92,.20) !important;
}
.call-stacked-bar span {
  position: relative !important;
  overflow: hidden !important;
  box-shadow: inset -8px 0 12px rgba(8,36,92,.12), inset 7px 0 10px rgba(255,255,255,.16) !important;
}
.call-stacked-bar span::after {
  background: linear-gradient(90deg, rgba(255,255,255,.36), rgba(255,255,255,.08) 48%, rgba(0,0,0,.10)) !important;
}
.call-region-legend span,
.call-combined-pie-row,
.call-donut-card h3,
.call-donut-card p,
.call-bar-item em {
  font-family: 'Poppins', Arial, sans-serif !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.call-combined-pie-row {
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease !important;
}
.call-combined-pie-row:hover {
  transform: translateX(3px) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(8,36,92,.10) !important;
}
.call-donut-card {
  transition: transform .2s ease, box-shadow .2s ease !important;
}
.call-donut-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 16px 30px rgba(8,36,92,.13) !important;
}

/* Left align uppercase province collapsible strips */
.call-detail-province-row td {
  text-align: left !important;
  padding-left: 18px !important;
}
.call-province-toggle {
  justify-content: flex-start !important;
  min-width: 260px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.call-province-toggle span {
  text-transform: uppercase !important;
  letter-spacing: .3px !important;
}

/* Replace glossy graph effect with clean embossed 3D style */
.call-sector-chart,
.call-percentage-chart,
.call-combined-pie-card {
  background: linear-gradient(145deg, #f8fbff, #ffffff) !important;
  border: 1px solid #cfe0f6 !important;
  box-shadow: 8px 8px 18px rgba(8,36,92,.10), -8px -8px 18px rgba(255,255,255,.88) !important;
  transform: none !important;
}
.call-sector-chart:hover,
.call-percentage-chart:hover,
.call-combined-pie-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 10px 10px 22px rgba(8,36,92,.12), -8px -8px 18px rgba(255,255,255,.95) !important;
}
.call-combined-pie,
.call-donut {
  filter: none !important;
  border: 1px solid rgba(203,220,244,.9) !important;
  box-shadow: inset 8px 8px 18px rgba(8,36,92,.14), inset -8px -8px 18px rgba(255,255,255,.72), 7px 7px 16px rgba(8,36,92,.10) !important;
}
.call-combined-pie::after {
  display: none !important;
}
.call-combined-pie-card:hover .call-combined-pie,
.call-donut-card:hover .call-donut {
  transform: scale(1.025) !important;
  box-shadow: inset 9px 9px 20px rgba(8,36,92,.15), inset -9px -9px 20px rgba(255,255,255,.78), 9px 9px 18px rgba(8,36,92,.12) !important;
}
.call-stacked-bar {
  overflow: hidden !important;
  background: #f1f6fd !important;
  border: 1px solid #cfe0f6 !important;
  box-shadow: inset 4px 4px 9px rgba(8,36,92,.10), inset -4px -4px 9px rgba(255,255,255,.85), 5px 5px 12px rgba(8,36,92,.10) !important;
}
.call-stacked-bar::before,
.call-stacked-bar::after {
  display: none !important;
}
.call-bar-item:hover .call-stacked-bar {
  transform: translateY(-3px) !important;
  filter: none !important;
  box-shadow: inset 4px 4px 9px rgba(8,36,92,.11), inset -4px -4px 9px rgba(255,255,255,.9), 7px 9px 16px rgba(8,36,92,.14) !important;
}
.call-stacked-bar span {
  box-shadow: inset 5px 0 10px rgba(255,255,255,.18), inset -5px 0 10px rgba(8,36,92,.14) !important;
}
.call-stacked-bar span::after {
  display: none !important;
}
.call-combined-pie-row,
.call-donut-card {
  box-shadow: inset 2px 2px 5px rgba(8,36,92,.05), inset -2px -2px 5px rgba(255,255,255,.8) !important;
}
.call-combined-pie-row:hover,
.call-donut-card:hover {
  transform: translateY(-1px) !important;
  box-shadow: inset 2px 2px 5px rgba(8,36,92,.05), inset -2px -2px 5px rgba(255,255,255,.88), 4px 6px 12px rgba(8,36,92,.09) !important;
}

/* Graph hover tooltip: count and percentage */
.call-stacked-bar span[data-tip],
.call-donut-card[data-tip],
.call-combined-pie-row[data-tip] {
  position: relative !important;
}
.call-stacked-bar span[data-tip]::before,
.call-donut-card[data-tip]::before,
.call-combined-pie-row[data-tip]::before {
  content: attr(data-tip);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  transform: translateX(-50%) translateY(4px);
  z-index: 50;
  min-width: 150px;
  max-width: 260px;
  padding: 7px 10px;
  border-radius: 8px;
  background: #08245c;
  color: #ffffff;
  font-family: 'Poppins', Arial, sans-serif;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.25;
  text-align: center;
  white-space: normal;
  box-shadow: 0 12px 26px rgba(8,36,92,.22);
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}
.call-stacked-bar span[data-tip]::after,
.call-donut-card[data-tip]::after,
.call-combined-pie-row[data-tip]::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: calc(100% + 2px) !important;
  transform: translateX(-50%) !important;
  border: 6px solid transparent !important;
  border-top-color: #08245c !important;
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease;
  background: transparent !important;
  inset: auto auto calc(100% + 2px) 50% !important;
  width: 0 !important;
  height: 0 !important;
}
.call-stacked-bar span[data-tip]:hover::before,
.call-stacked-bar span[data-tip]:hover::after,
.call-donut-card[data-tip]:hover::before,
.call-donut-card[data-tip]:hover::after,
.call-combined-pie-row[data-tip]:hover::before,
.call-combined-pie-row[data-tip]:hover::after {
  opacity: 1;
}
.call-stacked-bar span[data-tip]:hover::before,
.call-donut-card[data-tip]:hover::before,
.call-combined-pie-row[data-tip]:hover::before {
  transform: translateX(-50%) translateY(0);
}
.call-combined-pie-row[data-tip]::before {
  left: auto;
  right: 8px;
  transform: translateY(4px);
}
.call-combined-pie-row[data-tip]:hover::before {
  transform: translateY(0);
}
.call-combined-pie-row[data-tip]::after {
  left: auto !important;
  right: 24px !important;
  transform: none !important;
}

/* Fix full-view pie modal overlap */
.analytics-graph-modal-body .call-combined-pie-body {
  grid-template-columns: 300px minmax(420px, 620px) !important;
  gap: 36px !important;
  justify-content: center !important;
  align-items: center !important;
}
.analytics-graph-modal-body .call-combined-pie-wrap {
  width: 300px !important;
  height: 280px !important;
  justify-self: center !important;
}
.analytics-graph-modal-body .call-combined-pie-wrap .call-combined-pie,
.analytics-graph-modal-body .call-combined-pie {
  width: 250px !important;
  height: 250px !important;
}
.analytics-graph-modal-body .call-combined-pie-list {
  width: 100% !important;
  max-width: 620px !important;
  justify-self: start !important;
}
@media (max-width: 980px) {
  .analytics-graph-modal-body .call-combined-pie-body {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .analytics-graph-modal-body .call-combined-pie-list {
    justify-self: center !important;
  }
}

/* Proper left-corner Expand All button in report header */
.call-detail-region-title {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.call-detail-region-title > span {
  display: block !important;
  text-align: center !important;
}
.call-expand-all-btn {
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  min-height: 26px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.45) !important;
  background: rgba(255,255,255,.12) !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  box-shadow: none !important;
}
.call-expand-all-btn:hover {
  background: rgba(255,255,255,.22) !important;
  border-color: rgba(255,255,255,.7) !important;
}

/* Full-view graph hover tooltip: normal SLIMS text */
.analytics-graph-modal-body [data-tip]::before {
  font-family: 'Poppins', Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  color: #08245c !important;
  background: #ffffff !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 26px rgba(8,36,92,.16) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.analytics-graph-modal-body [data-tip]::after {
  border-top-color: #ffffff !important;
  filter: drop-shadow(0 2px 1px rgba(8,36,92,.12)) !important;
}
.analytics-graph-modal-body .call-combined-pie-row[data-tip]::before,
.analytics-graph-modal-body .call-donut-card[data-tip]::before,
.analytics-graph-modal-body .call-stacked-bar span[data-tip]::before {
  min-width: 170px !important;
  max-width: 280px !important;
  font-weight: 500 !important;
}

/* Uniform dark-blue graph headers like report table */
.call-sector-chart .analytics-title-block,
.call-percentage-chart .call-percentage-head,
.call-combined-pie-card .call-combined-pie-head {
  position: relative !important;
  min-height: 42px !important;
  margin: -14px -16px 14px !important;
  padding: 9px 54px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  gap: 1px !important;
  background: linear-gradient(90deg, #082a64 0%, #0759c8 100%) !important;
  border-radius: 10px 10px 0 0 !important;
  color: #ffffff !important;
}
.call-sector-chart .analytics-title-block h2,
.call-percentage-chart .call-percentage-head h2,
.call-combined-pie-card .call-combined-pie-head h2 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  text-transform: uppercase !important;
}
.call-sector-chart .analytics-title-block p,
.call-percentage-chart .call-percentage-head p,
.call-combined-pie-card .call-combined-pie-head > span {
  margin: 0 !important;
  color: rgba(255,255,255,.92) !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  box-shadow: none !important;
}
.call-sector-chart .analytics-title-range {
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.28) !important;
  color: #ffffff !important;
  font-size: 10.5px !important;
  padding: 2px 7px !important;
}
.call-sector-chart .analytics-full-btn,
.call-percentage-chart .analytics-full-btn,
.call-combined-pie-card .analytics-full-btn {
  top: 8px !important;
  left: 12px !important;
  right: auto !important;
  z-index: 4 !important;
  width: auto !important;
  min-width: 34px !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.45) !important;
  background: rgba(255,255,255,.12) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
.call-sector-chart .analytics-full-btn:hover,
.call-percentage-chart .analytics-full-btn:hover,
.call-combined-pie-card .analytics-full-btn:hover {
  background: rgba(255,255,255,.22) !important;
  border-color: rgba(255,255,255,.75) !important;
}
.call-sector-chart .analytics-full-btn i,
.call-percentage-chart .analytics-full-btn i,
.call-combined-pie-card .analytics-full-btn i {
  font-size: 12px !important;
}
.analytics-graph-modal-body .call-sector-chart .analytics-title-block,
.analytics-graph-modal-body .call-percentage-chart .call-percentage-head,
.analytics-graph-modal-body .call-combined-pie-card .call-combined-pie-head {
  margin: -18px -22px 18px !important;
}

/* Increase call detail report data font by 3px */
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-text {
  font-size: 21px !important;
  line-height: 2.15 !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-name,
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  font-size: 20px !important;
  line-height: 2 !important;
}
.call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser::after {
  font-size: 16px !important;
  width: 34px !important;
  height: 34px !important;
}

/* Strong embossed 3D analytics graph view */
.call-sector-chart,
.call-percentage-chart,
.call-combined-pie-card {
  background: #f4f8fe !important;
  border: 1px solid #c9dcf5 !important;
  box-shadow:
    10px 10px 22px rgba(8,36,92,.14),
    -10px -10px 22px rgba(255,255,255,.95),
    inset 1px 1px 0 rgba(255,255,255,.95),
    inset -1px -1px 0 rgba(8,36,92,.05) !important;
}
.call-sector-chart::before,
.call-percentage-chart::before,
.call-combined-pie-card::before {
  content: "";
  position: absolute;
  inset: 52px 12px 12px;
  border-radius: 10px;
  background: linear-gradient(145deg, #eef5ff, #ffffff);
  box-shadow:
    inset 7px 7px 16px rgba(8,36,92,.09),
    inset -7px -7px 16px rgba(255,255,255,.9) !important;
  pointer-events: none;
  z-index: 0;
}
.call-sector-chart > *,
.call-percentage-chart > *,
.call-combined-pie-card > * {
  position: relative;
  z-index: 1;
}
.call-bar-chart-wrap,
.call-donut-grid,
.call-combined-pie-body {
  border-radius: 12px !important;
  padding: 12px !important;
  background: transparent !important;
}
.call-stacked-bar {
  border: 1px solid rgba(8,36,92,.16) !important;
  box-shadow:
    inset 5px 5px 10px rgba(255,255,255,.20),
    inset -6px -6px 12px rgba(8,36,92,.18),
    7px 9px 16px rgba(8,36,92,.18) !important;
}
.call-stacked-bar span {
  border-top: 1px solid rgba(255,255,255,.32) !important;
  box-shadow:
    inset 6px 0 12px rgba(255,255,255,.20),
    inset -7px 0 12px rgba(8,36,92,.20) !important;
}
.call-bar-item:hover .call-stacked-bar {
  transform: translateY(-4px) scale(1.03) !important;
  box-shadow:
    inset 5px 5px 10px rgba(255,255,255,.22),
    inset -7px -7px 13px rgba(8,36,92,.20),
    10px 14px 22px rgba(8,36,92,.22) !important;
}
.call-combined-pie,
.call-donut {
  box-shadow:
    inset 12px 12px 24px rgba(255,255,255,.22),
    inset -18px -20px 30px rgba(8,36,92,.24),
    10px 14px 26px rgba(8,36,92,.20) !important;
  border: 1px solid rgba(8,36,92,.14) !important;
}
.call-combined-pie-card:hover .call-combined-pie,
.call-donut-card:hover .call-donut {
  transform: translateY(-3px) scale(1.04) !important;
}
.call-combined-pie-row,
.call-donut-card,
.call-region-legend span,
.call-category-total-row span,
.call-category-total-row strong,
.call-category-total-row b {
  background: linear-gradient(145deg, #f1f7ff, #ffffff) !important;
  box-shadow:
    4px 4px 9px rgba(8,36,92,.08),
    -4px -4px 9px rgba(255,255,255,.92),
    inset 1px 1px 0 rgba(255,255,255,.9) !important;
  border-color: #cfe0f6 !important;
}
.call-y-axis span,
.call-bar-total,
.call-bar-item em {
  text-shadow: 1px 1px 0 rgba(255,255,255,.85) !important;
}

/* Fix graph header icon placement and robust hover tooltip */
.call-sector-chart,
.call-percentage-chart,
.call-combined-pie-card {
  overflow: hidden !important;
}
.call-sector-chart .analytics-full-btn,
.call-percentage-chart .analytics-full-btn,
.call-combined-pie-card .analytics-full-btn {
  top: 9px !important;
  left: 14px !important;
  right: auto !important;
  transform: none !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 8px !important;
  background: rgba(255,255,255,.14) !important;
  border: 1px solid rgba(255,255,255,.34) !important;
  color: #fff !important;
  z-index: 8 !important;
}
.call-sector-chart .analytics-title-block,
.call-percentage-chart .call-percentage-head,
.call-combined-pie-card .call-combined-pie-head {
  overflow: hidden !important;
}
.slims-graph-hover-tip {
  position: fixed;
  z-index: 999999;
  display: none;
  max-width: 280px;
  padding: 8px 11px;
  border-radius: 8px;
  border: 1px solid #bfdbfe;
  background: #ffffff;
  color: #08245c;
  font-family: 'Poppins', Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  text-align: center;
  box-shadow: 0 14px 32px rgba(8,36,92,.20);
  pointer-events: none;
  text-transform: none;
  letter-spacing: 0;
}
.slims-graph-hover-tip.is-visible {
  display: block;
}

/* Precise graph header alignment */
.call-sector-chart .analytics-title-block,
.call-percentage-chart .call-percentage-head,
.call-combined-pie-card .call-combined-pie-head {
  min-height: 54px !important;
  padding: 8px 56px !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}
.call-sector-chart .analytics-full-btn,
.call-percentage-chart .analytics-full-btn,
.call-combined-pie-card .analytics-full-btn {
  top: 15px !important;
  left: 14px !important;
  width: 32px !important;
  height: 26px !important;
  min-width: 32px !important;
  min-height: 26px !important;
  line-height: 1 !important;
  align-items: center !important;
  justify-content: center !important;
}
.call-sector-chart .analytics-full-btn i,
.call-percentage-chart .analytics-full-btn i,
.call-combined-pie-card .analytics-full-btn i {
  display: block !important;
  line-height: 1 !important;
  margin: 0 !important;
}
.call-sector-chart .analytics-title-block h2,
.call-percentage-chart .call-percentage-head h2,
.call-combined-pie-card .call-combined-pie-head h2 {
  display: block !important;
  width: 100% !important;
  line-height: 1.15 !important;
}
.call-sector-chart .analytics-title-block p,
.call-percentage-chart .call-percentage-head p,
.call-combined-pie-card .call-combined-pie-head > span {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
}

/* Tooltip color swatch for graph segment */
.slims-graph-hover-tip {
  display: none;
  align-items: center;
  gap: 8px;
  text-align: left !important;
}
.slims-graph-hover-tip.is-visible {
  display: inline-flex !important;
}
.slims-tip-color {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  border-radius: 4px;
  border: 1px solid rgba(8,36,92,.16);
  box-shadow: inset 1px 1px 2px rgba(255,255,255,.55), 0 2px 5px rgba(8,36,92,.14);
}
.slims-tip-text {
  display: block;
  min-width: 0;
  font-weight: 500;
  line-height: 1.35;
}

/* Province tabs: two graphs 50/50, detail table below */
.call-analytics-graphs.is-province-selected {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  align-items: start !important;
}
.call-analytics-graphs.is-province-selected .call-sector-chart,
.call-analytics-graphs.is-province-selected .call-percentage-chart {
  grid-column: auto !important;
  width: 100% !important;
  min-width: 0 !important;
}
.call-analytics-graphs.is-province-selected .call-detail-report-panel {
  grid-column: 1 / -1 !important;
  width: 100% !important;
}
@media (max-width: 1100px) {
  .call-analytics-graphs.is-province-selected {
    grid-template-columns: 1fr !important;
  }
}

/* Province call strip for individual analytics tabs */
.call-detail-province-row .call-province-static-title {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-height: 32px !important;
  padding: 5px 14px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--province-color) !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08) !important;
  text-transform: uppercase !important;
}
.call-detail-province-row .call-province-static-title > span {
  color: var(--province-color) !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.call-detail-province-row .call-province-static-title > b {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 26px !important;
  height: 22px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  color: #0b57d0 !important;
  border: 1px solid #bfdbfe !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

/* Individual province analytics: designated gradient headers, no extra province strip */
.call-analytics-graphs.is-province-selected.province-tab-kp {
  --analytics-province-from: #16a34a;
  --analytics-province-to: #0b8f24;
  --analytics-province-soft: #e8f8ee;
  --analytics-province-border: #9be7b0;
}
.call-analytics-graphs.is-province-selected.province-tab-bln {
  --analytics-province-from: #f59e0b;
  --analytics-province-to: #f07a00;
  --analytics-province-soft: #fff4df;
  --analytics-province-border: #fed7aa;
}
.call-analytics-graphs.is-province-selected.province-tab-gb {
  --analytics-province-from: #8b5cf6;
  --analytics-province-to: #6d28d9;
  --analytics-province-soft: #f2ecff;
  --analytics-province-border: #ddd6fe;
}
.call-analytics-graphs.is-province-selected.province-tab-punjab {
  --analytics-province-from: #f43f5e;
  --analytics-province-to: #be123c;
  --analytics-province-soft: #fff1f5;
  --analytics-province-border: #fecdd3;
}
.call-analytics-graphs.is-province-selected.province-tab-sindh {
  --analytics-province-from: #14b8a6;
  --analytics-province-to: #0f766e;
  --analytics-province-soft: #e7fbf7;
  --analytics-province-border: #99f6e4;
}
.call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-block,
.call-analytics-graphs.is-province-selected .call-percentage-chart .call-percentage-head,
.call-analytics-graphs.is-province-selected .call-detail-region-title {
  background: linear-gradient(100deg, var(--analytics-province-from), var(--analytics-province-to)) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
.call-analytics-graphs.is-province-selected .call-sector-chart,
.call-analytics-graphs.is-province-selected .call-percentage-chart,
.call-analytics-graphs.is-province-selected .call-detail-report-panel {
  border-color: var(--analytics-province-border) !important;
  background: linear-gradient(145deg, #ffffff, var(--analytics-province-soft)) !important;
}
.call-analytics-graphs.is-province-selected .analytics-title-block h2,
.call-analytics-graphs.is-province-selected .analytics-title-block p,
.call-analytics-graphs.is-province-selected .call-percentage-head h2,
.call-analytics-graphs.is-province-selected .call-percentage-head p,
.call-analytics-graphs.is-province-selected .call-detail-region-title span {
  color: #ffffff !important;
}
.call-analytics-graphs.is-province-selected .call-detail-main-head th,
.call-analytics-graphs.is-province-selected .call-detail-sub-head th {
  color: #08245c !important;
  border-bottom-color: var(--analytics-province-border) !important;
}
.call-analytics-graphs.is-province-selected .call-detail-province-row {
  display: none !important;
}

/* Softer province analytics styling: calm SLIMS report cards */
.call-analytics-graphs.is-province-selected.province-tab-kp {
  --analytics-province-from: #f7fff9;
  --analytics-province-to: #e7f8ed;
  --analytics-province-accent: #0b8f24;
  --analytics-province-soft: #fbfffc;
  --analytics-province-border: #bfe8ca;
}
.call-analytics-graphs.is-province-selected.province-tab-bln {
  --analytics-province-from: #fffaf1;
  --analytics-province-to: #fff0d7;
  --analytics-province-accent: #d46b00;
  --analytics-province-soft: #fffdf8;
  --analytics-province-border: #f6d7aa;
}
.call-analytics-graphs.is-province-selected.province-tab-gb {
  --analytics-province-from: #fbf8ff;
  --analytics-province-to: #f1ebff;
  --analytics-province-accent: #6d28d9;
  --analytics-province-soft: #fdfbff;
  --analytics-province-border: #d9ccfb;
}
.call-analytics-graphs.is-province-selected.province-tab-punjab {
  --analytics-province-from: #fff8fa;
  --analytics-province-to: #ffeaf0;
  --analytics-province-accent: #be123c;
  --analytics-province-soft: #fffbfd;
  --analytics-province-border: #f3c1cc;
}
.call-analytics-graphs.is-province-selected.province-tab-sindh {
  --analytics-province-from: #f3fffc;
  --analytics-province-to: #def8f3;
  --analytics-province-accent: #0f766e;
  --analytics-province-soft: #fbfffe;
  --analytics-province-border: #b6ebe2;
}
.call-analytics-graphs.is-province-selected .call-sector-chart,
.call-analytics-graphs.is-province-selected .call-percentage-chart,
.call-analytics-graphs.is-province-selected .call-detail-report-panel {
  border: 1px solid var(--analytics-province-border) !important;
  background: linear-gradient(145deg, #ffffff 0%, var(--analytics-province-soft) 100%) !important;
  box-shadow: 0 12px 28px rgba(8, 36, 92, 0.07) !important;
}
.call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-block,
.call-analytics-graphs.is-province-selected .call-percentage-chart .call-percentage-head,
.call-analytics-graphs.is-province-selected .call-detail-region-title {
  background: linear-gradient(100deg, var(--analytics-province-from) 0%, var(--analytics-province-to) 100%) !important;
  color: #08245c !important;
  border-bottom: 1px solid var(--analytics-province-border) !important;
  box-shadow: inset 4px 0 0 var(--analytics-province-accent) !important;
}
.call-analytics-graphs.is-province-selected .analytics-title-block h2,
.call-analytics-graphs.is-province-selected .analytics-title-block p,
.call-analytics-graphs.is-province-selected .call-percentage-head h2,
.call-analytics-graphs.is-province-selected .call-percentage-head p,
.call-analytics-graphs.is-province-selected .call-detail-region-title span {
  color: #08245c !important;
}
.call-analytics-graphs.is-province-selected .analytics-title-block h2,
.call-analytics-graphs.is-province-selected .call-percentage-head h2,
.call-analytics-graphs.is-province-selected .call-detail-region-title span {
  font-weight: 900 !important;
}
.call-analytics-graphs.is-province-selected .analytics-title-block p,
.call-analytics-graphs.is-province-selected .call-percentage-head p {
  color: var(--analytics-province-accent) !important;
  font-weight: 750 !important;
}
.call-analytics-graphs.is-province-selected .analytics-full-btn {
  background: rgba(255, 255, 255, 0.85) !important;
  border: 1px solid var(--analytics-province-border) !important;
  color: var(--analytics-province-accent) !important;
  box-shadow: 0 8px 18px rgba(8, 36, 92, 0.08) !important;
}
.call-analytics-graphs.is-province-selected .call-detail-main-head th,
.call-analytics-graphs.is-province-selected .call-detail-sub-head th {
  background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%) !important;
  color: #08245c !important;
  border-bottom: 1px solid #d7e5f7 !important;
}
.call-analytics-graphs.is-province-selected .call-detail-category-row td::before,
.call-analytics-graphs.is-province-selected .call-detail-category-row td {
  border-color: var(--analytics-province-border) !important;
}
.call-analytics-graphs.is-province-selected .call-detail-category-row td::before {
  color: var(--analytics-province-accent) !important;
}

/* Simple call category rows in analytics detail table */
.call-detail-category-row td {
  background: #f7fbff !important;
  border-top: 1px solid #d7e5f7 !important;
  border-bottom: 1px solid #d7e5f7 !important;
  padding: 8px 14px !important;
  text-align: left !important;
}
.call-detail-category-row td::before {
  display: inline !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #0b57d0 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
  text-transform: uppercase !important;
}
.call-analytics-graphs.is-province-selected .call-detail-category-row td::before {
  background: transparent !important;
  color: var(--analytics-province-accent) !important;
  border: 0 !important;
}

/* Call Analytics drag and drop report builder */
.report-builder-modal {
  position: fixed;
  inset: 0;
  z-index: 10040;
  display: flex;
  align-items: stretch;
  justify-content: center;
  padding: 22px;
  background: rgba(8, 22, 48, 0.54);
  backdrop-filter: blur(4px);
}
.report-builder-card {
  position: relative;
  width: min(1500px, 96vw);
  max-height: 94vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff, #f5f9ff);
  border: 1px solid #cfe0f6;
  box-shadow: 0 26px 70px rgba(8, 36, 92, 0.28);
}
.report-builder-close {
  position: absolute;
  top: 12px;
  right: 14px;
  z-index: 2;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: #ffe2e2;
  color: #dc2626;
  cursor: pointer;
}
.report-builder-top {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 18px 64px 16px 22px;
  border-bottom: 1px solid #d8e8ff;
  background: linear-gradient(90deg, #f8fbff, #ffffff);
}
.report-builder-top h2 {
  margin: 0;
  color: #08245c;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0;
}
.report-builder-top p {
  margin: 3px 0 0;
  color: #496583;
  font-size: 13px;
  font-weight: 600;
}
.report-export-box {
  display: grid;
  grid-template-columns: repeat(5, minmax(74px, 1fr));
  gap: 8px;
  padding: 8px;
  border: 1px solid #cfe0f6;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(8, 36, 92, 0.08);
}
.report-export-icon {
  min-height: 58px;
  border: 1px solid #d8e8ff;
  border-radius: 10px;
  background: #f8fbff;
  color: #08245c;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-size: 11px;
  font-weight: 800;
}
.report-export-icon i { font-size: 18px; color: #1d64d8; }
.report-export-icon.is-bw i { color: #111827; }
.report-export-icon.is-color i { color: #0f766e; }
.report-builder-list {
  overflow: auto;
  padding: 18px 22px 24px;
  display: grid;
  gap: 14px;
}
.report-builder-item {
  border: 1px solid #d8e8ff;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 12px 26px rgba(8, 36, 92, 0.08);
  overflow: hidden;
}
.report-builder-item.is-dragging { opacity: .62; transform: scale(.995); }
.report-builder-item-head {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 9px 14px;
  background: linear-gradient(90deg, #eef6ff, #f8fbff);
  border-bottom: 1px solid #d8e8ff;
  color: #08245c;
}
.report-builder-item-head strong {
  font-size: 14px;
  font-weight: 900;
}
.drag-handle {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #ffffff;
  color: #1d64d8;
  border: 1px solid #d8e8ff;
  cursor: grab;
}
.report-builder-item-body { padding: 12px; }
.report-builder-clone {
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  box-shadow: none !important;
}
.report-builder-audit-table col.call-detail-col-ser { width: 5% !important; }
.report-builder-audit-table .report-audit-head,
.report-builder-audit-table .report-audit-cell {
  width: 86px;
  text-align: center !important;
  vertical-align: middle !important;
}
.report-audit-cell {
  white-space: nowrap;
  background: inherit !important;
}
.report-audit-btn {
  width: 30px;
  height: 30px;
  margin: 0 2px;
  border: 0;
  background: transparent;
  cursor: pointer;
  color: #94a3b8;
  font-size: 15px;
}
.report-audit-btn.is-included { color: #16a34a; }
.report-audit-btn.is-excluded { color: #dc2626; }
.report-builder-audit-table tr.is-report-excluded td:not(.report-audit-cell) {
  opacity: .36;
  text-decoration: line-through;
}
.report-builder-audit-table tr.is-report-excluded {
  background: #fff7f7 !important;
}
@media (max-width: 1000px) {
  .report-builder-top { grid-template-columns: 1fr; padding-right: 58px; }
  .report-export-box { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media print {
  body.report-print-bw .report-builder-card,
  body.report-print-bw .report-builder-card * {
    color: #111 !important;
    background: #fff !important;
    box-shadow: none !important;
    border-color: #999 !important;
  }
  .report-builder-modal {
    position: static !important;
    padding: 0 !important;
    background: #fff !important;
  }
  .report-builder-card {
    width: 100% !important;
    max-height: none !important;
    overflow: visible !important;
    box-shadow: none !important;
    border: 0 !important;
  }
  .report-builder-close,
  .report-export-box,
  .report-builder-top p,
  .drag-handle,
  .report-builder-item-head,
  .report-audit-cell,
  .report-audit-head {
    display: none !important;
  }
  .report-builder-list { overflow: visible !important; padding: 0 !important; }
  .report-builder-item { break-inside: avoid; box-shadow: none !important; border: 0 !important; }
  .report-builder-audit-table tr.is-report-excluded { display: none !important; }
}

/* Call analytics report table headers: simple uppercase, not heavy bold */
.call-detail-report-table thead th,
.call-detail-main-head th,
.call-detail-sub-head th,
.report-builder-audit-table .report-audit-head {
  text-transform: uppercase !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  font-size: 13px !important;
  color: #08245c !important;
}
.call-detail-region-title span {
  text-transform: uppercase !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

/* FINAL override: report table headers simple caps, no heavy bold */
.reports-analytics-page .call-detail-report-panel .call-detail-report-table thead th,
.reports-analytics-page .call-detail-report-panel .call-detail-report-table thead tr th,
.reports-analytics-page .report-builder-audit-table thead th,
.report-builder-modal .call-detail-report-table thead th,
.report-builder-modal .report-builder-audit-table thead th {
  font-family: 'Poppins', Arial, sans-serif !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  color: #08245c !important;
}
.reports-analytics-page .call-detail-region-title span,
.report-builder-modal .call-detail-region-title span {
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  font-size: 14px !important;
}
.reports-analytics-page .call-detail-category-row td::before,
.report-builder-modal .call-detail-category-row td::before {
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  font-size: 12px !important;
}

/* ABSOLUTE FINAL: analytics table headers regular weight */
html body .reports-analytics-page table.call-detail-report-table thead tr.call-detail-main-head > th,
html body .reports-analytics-page table.call-detail-report-table thead tr.call-detail-sub-head > th,
html body .report-builder-modal table.call-detail-report-table thead tr.call-detail-main-head > th,
html body .report-builder-modal table.call-detail-report-table thead tr.call-detail-sub-head > th,
html body .report-builder-modal table.call-detail-report-table thead th.report-audit-head {
  font-family: 'Poppins', Arial, sans-serif !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
html body .reports-analytics-page .call-detail-category-row > td,
html body .reports-analytics-page .call-detail-category-row > td::before,
html body .report-builder-modal .call-detail-category-row > td,
html body .report-builder-modal .call-detail-category-row > td::before {
  font-family: 'Poppins', Arial, sans-serif !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  font-size: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
html body .reports-analytics-page .call-detail-region-title span,
html body .report-builder-modal .call-detail-region-title span {
  font-weight: 400 !important;
  text-transform: uppercase !important;
}

/* Report builder: individual province graphs 50/50, Pakistan layout unchanged */
.report-builder-modal.is-province-builder .report-builder-list {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
}
.report-builder-modal.is-province-builder .report-builder-item:nth-child(1),
.report-builder-modal.is-province-builder .report-builder-item:nth-child(2) {
  grid-column: auto !important;
}
.report-builder-modal.is-province-builder .report-builder-item:nth-child(n+3) {
  grid-column: 1 / -1 !important;
}
.report-builder-modal.is-province-builder .report-builder-item-body {
  min-height: 0 !important;
  overflow: visible !important;
}
.report-builder-modal.is-province-builder .report-builder-clone.call-sector-chart,
.report-builder-modal.is-province-builder .report-builder-clone.call-percentage-chart {
  min-height: 360px !important;
  max-height: none !important;
  overflow: visible !important;
}
.report-builder-modal.is-province-builder .call-bar-chart-wrap {
  min-height: 250px !important;
  overflow: visible !important;
}
.report-builder-modal.is-province-builder .call-donut-grid {
  max-height: none !important;
  overflow: visible !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.report-builder-modal.is-province-builder .call-donut-card {
  min-height: 150px !important;
}
.report-builder-modal.is-province-builder .report-builder-item-head strong {
  white-space: normal !important;
}
.report-builder-modal.is-province-builder .call-detail-report-panel {
  max-height: none !important;
  overflow: visible !important;
}
.report-builder-modal.is-pakistan-builder .report-builder-list {
  grid-template-columns: 1fr !important;
}
@media (max-width: 1100px) {
  .report-builder-modal.is-province-builder .report-builder-list {
    grid-template-columns: 1fr !important;
  }
}

/* Report builder 25/75 split workspace */
.report-builder-workspace {
  display: grid !important;
  grid-template-columns: minmax(220px, 25%) minmax(0, 75%) !important;
  gap: 14px !important;
  min-height: 0 !important;
}
.report-builder-palette {
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  max-height: calc(94vh - 145px) !important;
  overflow: auto !important;
  border: 1px solid #d8e8ff !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, #f8fbff, #ffffff) !important;
  padding: 12px !important;
  box-shadow: 0 12px 26px rgba(8, 36, 92, .08) !important;
}
.report-builder-palette-title {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #08245c !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  margin-bottom: 10px !important;
  text-transform: uppercase !important;
}
.report-builder-palette-list {
  display: grid !important;
  gap: 8px !important;
}
.report-builder-palette-item {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 26px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 44px !important;
  padding: 8px 10px !important;
  border: 1px solid #d8e8ff !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #08245c !important;
  text-align: left !important;
  cursor: grab !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
.report-builder-palette-item span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
  line-height: 1.25 !important;
}
.report-builder-palette-item i {
  color: #1d64d8 !important;
}
.report-builder-modal .report-builder-list.report-builder-preview {
  min-height: calc(94vh - 145px) !important;
  max-height: calc(94vh - 145px) !important;
  overflow: auto !important;
  padding: 14px !important;
  border: 1px dashed #bdd7ff !important;
  border-radius: 12px !important;
  background: #fbfdff !important;
  grid-template-columns: 1fr !important;
}
.report-builder-list.report-builder-preview::before {
  content: 'Preview Canvas' !important;
  display: block !important;
  color: #496583 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  margin-bottom: 10px !important;
}
.report-builder-modal .report-builder-item {
  min-height: auto !important;
}
.report-builder-modal .report-builder-item.is-preview-focus {
  outline: 2px solid #2f6fed !important;
  box-shadow: 0 0 0 6px rgba(47,111,237,.12), 0 12px 26px rgba(8,36,92,.1) !important;
}
.report-builder-modal .report-builder-clone.call-sector-chart,
.report-builder-modal .report-builder-clone.call-percentage-chart,
.report-builder-modal .report-builder-clone.call-combined-pie-card {
  max-height: none !important;
  overflow: visible !important;
}
.report-builder-modal .report-builder-clone .call-combined-pie-body,
.report-builder-modal .report-builder-clone .call-bar-chart-wrap,
.report-builder-modal .report-builder-clone .call-donut-grid {
  max-height: none !important;
  overflow: visible !important;
}
@media (max-width: 1100px) {
  .report-builder-workspace { grid-template-columns: 1fr !important; }
  .report-builder-palette { position: static !important; max-height: none !important; }
  .report-builder-modal .report-builder-list.report-builder-preview { max-height: none !important; }
}

/* Permanent server-rendered report builder layout */
.report-builder-modal.is-server-rendered .report-builder-card {
  width: min(1720px, 98vw) !important;
}
.report-builder-modal.is-server-rendered .report-builder-workspace {
  display: grid !important;
  grid-template-columns: minmax(230px, 25%) minmax(0, 75%) !important;
  gap: 14px !important;
  padding: 16px !important;
  overflow: hidden !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette {
  max-height: calc(94vh - 142px) !important;
  overflow: auto !important;
}
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
  max-height: calc(94vh - 142px) !important;
  overflow: auto !important;
  padding: 14px !important;
}
.report-builder-modal.is-server-rendered.is-province-builder .report-builder-list.report-builder-preview {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.report-builder-modal.is-server-rendered.is-province-builder .report-builder-item:nth-child(1),
.report-builder-modal.is-server-rendered.is-province-builder .report-builder-item:nth-child(2) {
  grid-column: auto !important;
}
.report-builder-modal.is-server-rendered.is-province-builder .report-builder-item:nth-child(n+3) {
  grid-column: 1 / -1 !important;
}
.report-builder-modal.is-server-rendered.is-pakistan-builder .report-builder-list.report-builder-preview {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
}
.report-builder-modal.is-server-rendered .analytics-full-btn {
  display: none !important;
}
.report-builder-modal.is-server-rendered .report-builder-item-body,
.report-builder-modal.is-server-rendered .report-builder-clone,
.report-builder-modal.is-server-rendered .call-sector-chart,
.report-builder-modal.is-server-rendered .call-percentage-chart,
.report-builder-modal.is-server-rendered .call-combined-pie-card,
.report-builder-modal.is-server-rendered .call-detail-report-panel {
  max-height: none !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .call-bar-chart-wrap,
.report-builder-modal.is-server-rendered .call-combined-pie-body,
.report-builder-modal.is-server-rendered .call-donut-grid {
  max-height: none !important;
  overflow: visible !important;
}
@media (max-width: 1100px) {
  .report-builder-modal.is-server-rendered .report-builder-workspace,
  .report-builder-modal.is-server-rendered.is-province-builder .report-builder-list.report-builder-preview {
    grid-template-columns: 1fr !important;
  }
}

/* Report builder preview width controls and no clipped graphs */
.report-layout-toggle {
  margin-left: auto !important;
  display: inline-flex !important;
  gap: 4px !important;
  padding: 3px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  border: 1px solid #d8e8ff !important;
}
.report-layout-toggle button {
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #496583 !important;
  min-width: 42px !important;
  height: 24px !important;
  padding: 0 9px !important;
  cursor: pointer !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
.report-layout-toggle button.is-active,
.report-layout-toggle button:hover {
  background: #eaf2ff !important;
  color: #0b57d0 !important;
}
.report-builder-modal .report-builder-list.report-builder-preview {
  align-items: start !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.report-builder-modal .report-builder-item {
  overflow: visible !important;
}
.report-builder-modal .report-builder-item-body {
  overflow: visible !important;
  max-height: none !important;
}
.report-builder-modal .report-builder-item.is-half-width {
  grid-column: auto !important;
}
.report-builder-modal .report-builder-item.is-full-width,
.report-builder-modal .report-builder-item:not(.is-half-width) {
  grid-column: 1 / -1 !important;
}
.report-builder-modal.is-server-rendered .call-combined-pie-card,
.report-builder-modal.is-server-rendered .call-sector-chart,
.report-builder-modal.is-server-rendered .call-percentage-chart {
  min-height: auto !important;
  height: auto !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .call-combined-pie-body {
  min-height: 300px !important;
}
.report-builder-modal.is-server-rendered .call-bar-chart-wrap {
  min-height: 360px !important;
}
.report-builder-modal.is-server-rendered .call-donut-grid {
  min-height: 260px !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .call-detail-report-panel {
  min-height: auto !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered.is-pakistan-builder .report-builder-list.report-builder-preview,
.report-builder-modal.is-server-rendered.is-province-builder .report-builder-list.report-builder-preview {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.report-builder-modal.is-server-rendered .report-builder-item:first-child,
.report-builder-modal.is-server-rendered .report-builder-item:nth-child(2) {
  grid-column: auto !important;
}
.report-builder-modal.is-server-rendered .report-builder-item:nth-child(n+3) {
  grid-column: 1 / -1 !important;
}
.report-builder-modal.is-server-rendered .report-builder-item.is-full-width {
  grid-column: 1 / -1 !important;
}
.report-builder-modal.is-server-rendered .report-builder-item.is-half-width {
  grid-column: auto !important;
}
@media (max-width: 1200px) {
  .report-builder-modal.is-server-rendered.is-pakistan-builder .report-builder-list.report-builder-preview,
  .report-builder-modal.is-server-rendered.is-province-builder .report-builder-list.report-builder-preview {
    grid-template-columns: 1fr !important;
  }
}

/* Report builder layout fix: slimmer palette, clean 50/50 preview */
.report-builder-modal.is-server-rendered .report-builder-workspace,
.report-builder-modal .report-builder-workspace {
  grid-template-columns: 250px minmax(0, 1fr) !important;
  gap: 12px !important;
  padding: 12px 14px 16px !important;
  align-items: start !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette,
.report-builder-modal .report-builder-palette {
  width: 250px !important;
  max-width: 250px !important;
  padding: 10px !important;
  box-shadow: 0 8px 18px rgba(8, 36, 92, 0.06) !important;
}
.report-builder-modal .report-builder-palette-item {
  min-height: 38px !important;
  padding: 7px 9px !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  gap: 6px !important;
  font-size: 11px !important;
}
.report-builder-modal .report-builder-palette-title {
  font-size: 12px !important;
  margin-bottom: 8px !important;
}
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview,
.report-builder-modal .report-builder-list.report-builder-preview {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: start !important;
  min-width: 0 !important;
  padding: 12px !important;
  overflow-x: hidden !important;
}
.report-builder-modal.is-server-rendered .report-builder-item,
.report-builder-modal .report-builder-item {
  grid-column: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  align-self: start !important;
  position: static !important;
  transform: none !important;
  overflow: hidden !important;
}
.report-builder-modal.is-server-rendered .report-builder-item:nth-child(n),
.report-builder-modal .report-builder-item:nth-child(n) {
  grid-column: auto !important;
}
.report-builder-modal.is-server-rendered .report-builder-item.is-full-width,
.report-builder-modal .report-builder-item.is-full-width,
.report-builder-modal.is-server-rendered .report-builder-item:has(.call-detail-report-panel),
.report-builder-modal .report-builder-item:has(.call-detail-report-panel) {
  grid-column: 1 / -1 !important;
}
.report-builder-modal.is-server-rendered .report-builder-item-body,
.report-builder-modal .report-builder-item-body {
  max-height: none !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 10px !important;
}
.report-builder-modal.is-server-rendered .call-sector-chart,
.report-builder-modal.is-server-rendered .call-percentage-chart,
.report-builder-modal.is-server-rendered .call-combined-pie-card,
.report-builder-modal .report-builder-clone.call-sector-chart,
.report-builder-modal .report-builder-clone.call-percentage-chart,
.report-builder-modal .report-builder-clone.call-combined-pie-card {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 420px !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .call-detail-report-panel,
.report-builder-modal .report-builder-clone.call-detail-report-panel {
  min-height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .call-bar-chart-wrap,
.report-builder-modal .call-bar-chart-wrap {
  min-height: 315px !important;
  height: auto !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .call-donut-grid,
.report-builder-modal .call-donut-grid {
  min-height: 330px !important;
  height: auto !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .call-combined-pie-body,
.report-builder-modal .call-combined-pie-body {
  min-height: 330px !important;
  height: auto !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .report-builder-item-head,
.report-builder-modal .report-builder-item-head {
  min-height: 38px !important;
  padding: 7px 10px !important;
}
.report-builder-modal.is-server-rendered .report-builder-item-head strong,
.report-builder-modal .report-builder-item-head strong {
  font-size: 12px !important;
  line-height: 1.25 !important;
}
@media (max-width: 1200px) {
  .report-builder-modal.is-server-rendered .report-builder-workspace,
  .report-builder-modal .report-builder-workspace {
    grid-template-columns: 1fr !important;
  }
  .report-builder-modal.is-server-rendered .report-builder-palette,
  .report-builder-modal .report-builder-palette {
    width: 100% !important;
    max-width: none !important;
  }
  .report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview,
  .report-builder-modal .report-builder-list.report-builder-preview {
    grid-template-columns: 1fr !important;
  }
}

/* Extra squeeze: more width for report preview graphs */
.report-builder-modal.is-server-rendered .report-builder-card,
.report-builder-modal .report-builder-card {
  width: min(1860px, 99vw) !important;
}
.report-builder-modal.is-server-rendered .report-builder-workspace,
.report-builder-modal .report-builder-workspace {
  grid-template-columns: 170px minmax(0, 1fr) !important;
  gap: 8px !important;
  padding: 8px !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette,
.report-builder-modal .report-builder-palette {
  width: 170px !important;
  max-width: 170px !important;
  padding: 7px !important;
  border-radius: 10px !important;
}
.report-builder-modal .report-builder-palette-title {
  font-size: 11px !important;
  gap: 5px !important;
  margin-bottom: 6px !important;
}
.report-builder-modal .report-builder-palette-item {
  min-height: 34px !important;
  padding: 6px 7px !important;
  grid-template-columns: 16px minmax(0, 1fr) !important;
  gap: 5px !important;
  font-size: 9.5px !important;
  line-height: 1.15 !important;
  border-radius: 8px !important;
}
.report-builder-modal .report-builder-palette-item i {
  font-size: 10px !important;
}
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview,
.report-builder-modal .report-builder-list.report-builder-preview {
  gap: 8px !important;
  padding: 8px !important;
}
.report-builder-modal .report-builder-list.report-builder-preview::before {
  font-size: 10px !important;
  margin-bottom: 6px !important;
}
.report-builder-modal .report-builder-item-head {
  min-height: 34px !important;
  padding: 6px 8px !important;
  gap: 7px !important;
}
.report-builder-modal .report-builder-item-head strong {
  font-size: 11px !important;
}
.report-builder-modal .drag-handle {
  width: 24px !important;
  height: 24px !important;
}
.report-builder-modal .report-layout-toggle button {
  min-width: 34px !important;
  height: 21px !important;
  padding: 0 6px !important;
  font-size: 10px !important;
}
.report-builder-modal.is-server-rendered .report-builder-item-body,
.report-builder-modal .report-builder-item-body {
  padding: 6px !important;
}
.report-builder-modal.is-server-rendered .call-sector-chart,
.report-builder-modal.is-server-rendered .call-percentage-chart,
.report-builder-modal.is-server-rendered .call-combined-pie-card,
.report-builder-modal .report-builder-clone.call-sector-chart,
.report-builder-modal .report-builder-clone.call-percentage-chart,
.report-builder-modal .report-builder-clone.call-combined-pie-card {
  padding-left: 10px !important;
  padding-right: 10px !important;
}
@media (max-width: 1200px) {
  .report-builder-modal.is-server-rendered .report-builder-workspace,
  .report-builder-modal .report-builder-workspace {
    grid-template-columns: 1fr !important;
  }
  .report-builder-modal.is-server-rendered .report-builder-palette,
  .report-builder-modal .report-builder-palette {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Force report builder half-width graphs to stay two per row */
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview,
.report-builder-modal .report-builder-list.report-builder-preview {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  grid-auto-flow: row dense !important;
}
.report-builder-modal.is-server-rendered .report-builder-item.is-half-width,
.report-builder-modal .report-builder-item.is-half-width,
.report-builder-modal.is-server-rendered .report-builder-item:not(.is-full-width):not(:has(.call-detail-report-panel)),
.report-builder-modal .report-builder-item:not(.is-full-width):not(:has(.call-detail-report-panel)) {
  grid-column: span 1 !important;
  width: 100% !important;
  min-width: 0 !important;
}
.report-builder-modal.is-server-rendered .report-builder-item.is-full-width,
.report-builder-modal .report-builder-item.is-full-width,
.report-builder-modal.is-server-rendered .report-builder-item:has(.call-detail-report-panel),
.report-builder-modal .report-builder-item:has(.call-detail-report-panel) {
  grid-column: 1 / -1 !important;
}
.report-builder-modal.is-server-rendered .report-builder-item:first-child,
.report-builder-modal.is-server-rendered .report-builder-item:nth-child(2),
.report-builder-modal .report-builder-item:first-child,
.report-builder-modal .report-builder-item:nth-child(2) {
  grid-column: span 1 !important;
}
.report-builder-modal.is-server-rendered .report-builder-item:first-child:nth-last-child(1),
.report-builder-modal .report-builder-item:first-child:nth-last-child(1) {
  grid-column: 1 / -1 !important;
}
@media (max-width: 980px) {
  .report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview,
  .report-builder-modal .report-builder-list.report-builder-preview {
    grid-template-columns: 1fr !important;
  }
}

/* Compact pretty graph typography inside report builder preview */
.report-builder-modal .report-builder-clone,
.report-builder-modal .call-sector-chart,
.report-builder-modal .call-percentage-chart,
.report-builder-modal .call-combined-pie-card {
  font-size: 10px !important;
}
.report-builder-modal .analytics-title-block,
.report-builder-modal .call-percentage-head,
.report-builder-modal .call-combined-pie-head {
  min-height: 42px !important;
  padding: 8px 10px !important;
  margin-bottom: 8px !important;
  border-radius: 8px 8px 0 0 !important;
}
.report-builder-modal .analytics-title-block h2,
.report-builder-modal .call-percentage-head h2,
.report-builder-modal .call-combined-pie-head h2 {
  font-size: 13px !important;
  line-height: 1.12 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}
.report-builder-modal .analytics-title-block p,
.report-builder-modal .call-percentage-head p,
.report-builder-modal .call-combined-pie-head > span {
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-weight: 500 !important;
}
.report-builder-modal .call-region-legend {
  gap: 5px 8px !important;
  margin: 6px 0 8px !important;
  font-size: 9px !important;
}
.report-builder-modal .call-region-legend span {
  gap: 4px !important;
  padding: 2px 5px !important;
  font-size: 9px !important;
  line-height: 1.1 !important;
  font-weight: 500 !important;
}
.report-builder-modal .call-region-legend i {
  width: 10px !important;
  height: 10px !important;
  border-radius: 2px !important;
}
.report-builder-modal .call-total-strip {
  margin: 6px 0 8px !important;
  min-height: 42px !important;
}
.report-builder-modal .call-total-box,
.report-builder-modal .call-region-total {
  min-height: 44px !important;
  padding: 5px 6px !important;
}
.report-builder-modal .call-total-box span,
.report-builder-modal .call-region-total b,
.report-builder-modal .call-region-total span {
  font-size: 8px !important;
  line-height: 1.1 !important;
}
.report-builder-modal .call-total-box strong,
.report-builder-modal .call-region-total strong {
  font-size: 16px !important;
  line-height: 1 !important;
}
.report-builder-modal .call-y-axis {
  font-size: 9px !important;
  width: 24px !important;
}
.report-builder-modal .call-bar-total {
  font-size: 10px !important;
  line-height: 1 !important;
}
.report-builder-modal .call-stacked-bar {
  width: 18px !important;
  box-shadow: 0 8px 16px rgba(8,36,92,.12) !important;
}
.report-builder-modal .call-stacked-bar span {
  font-size: 8px !important;
  font-weight: 600 !important;
}
.report-builder-modal .call-bar-item em {
  font-size: 7.5px !important;
  line-height: 1.05 !important;
  max-width: 52px !important;
  min-height: 28px !important;
}
.report-builder-modal .call-category-total-row {
  min-height: 28px !important;
  font-size: 9px !important;
}
.report-builder-modal .call-category-total-row b,
.report-builder-modal .call-category-total-row span,
.report-builder-modal .call-category-total-row strong {
  font-size: 9px !important;
  padding: 4px 5px !important;
}
.report-builder-modal .call-donut-card {
  min-height: 118px !important;
  padding: 8px !important;
}
.report-builder-modal .call-donut-card h3 {
  font-size: 10px !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
}
.report-builder-modal .call-donut-card strong {
  font-size: 15px !important;
  line-height: 1.05 !important;
}
.report-builder-modal .call-donut-card p {
  font-size: 9px !important;
}
.report-builder-modal .call-donut {
  width: 58px !important;
  height: 58px !important;
}
.report-builder-modal .call-donut::after {
  inset: 19px !important;
}
.report-builder-modal .call-combined-pie-visual {
  width: 170px !important;
  height: 170px !important;
}
.report-builder-modal .call-pie-legend-row {
  min-height: 30px !important;
  padding: 5px 8px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}
.report-builder-modal .call-pie-legend-row b,
.report-builder-modal .call-pie-legend-row strong {
  font-size: 10px !important;
}
.report-builder-modal .call-combined-pie-body {
  min-height: 250px !important;
  gap: 10px !important;
}
.report-builder-modal .call-bar-chart-wrap {
  min-height: 270px !important;
}
.report-builder-modal .call-donut-grid {
  min-height: 230px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

/* FIX: preview canvas label must not consume a graph grid cell */
.report-builder-modal .report-builder-list.report-builder-preview::before,
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview::before {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin: 0 0 6px !important;
}
.report-builder-modal .report-builder-list.report-builder-preview,
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  align-items: start !important;
}
.report-builder-modal .report-builder-item.is-half-width,
.report-builder-modal.is-server-rendered .report-builder-item.is-half-width {
  grid-column: auto !important;
  align-self: start !important;
}
.report-builder-modal .report-builder-item.is-full-width,
.report-builder-modal.is-server-rendered .report-builder-item.is-full-width,
.report-builder-modal .report-builder-item:has(.call-detail-report-panel),
.report-builder-modal.is-server-rendered .report-builder-item:has(.call-detail-report-panel) {
  grid-column: 1 / -1 !important;
}
.report-builder-modal .report-builder-item {
  margin: 0 !important;
}

/* Report builder exports and row pagination */
.report-builder-modal .report-export-box,
.report-builder-modal.is-server-rendered .report-export-box {
  gap: 7px !important;
  padding: 6px !important;
}
.report-builder-modal .report-export-icon,
.report-builder-modal.is-server-rendered .report-export-icon {
  width: 58px !important;
  min-height: 48px !important;
  padding: 6px 5px !important;
  border-radius: 9px !important;
  font-size: 9px !important;
  line-height: 1.05 !important;
  gap: 3px !important;
}
.report-builder-modal .report-export-icon i,
.report-builder-modal.is-server-rendered .report-export-icon i {
  font-size: 14px !important;
}
.report-builder-modal .report-export-icon span,
.report-builder-modal.is-server-rendered .report-export-icon span {
  font-size: 9px !important;
  line-height: 1.05 !important;
}
.report-builder-modal .report-row-controls,
.report-builder-modal.is-server-rendered .report-row-controls {
  flex-wrap: wrap !important;
}
.report-builder-modal .report-row-pagination,
.report-builder-modal.is-server-rendered .report-row-pagination {
  margin-left: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  flex-wrap: wrap !important;
}
.report-builder-modal .report-page-btn,
.report-builder-modal.is-server-rendered .report-page-btn {
  min-width: 48px !important;
  height: 28px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  border: 1px solid #bfd8ff !important;
  background: #fff !important;
  color: #0b3570 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}
.report-builder-modal .report-page-btn.is-active,
.report-builder-modal.is-server-rendered .report-page-btn.is-active {
  background: #1d6df2 !important;
  border-color: #1d6df2 !important;
  color: #fff !important;
  box-shadow: 0 6px 14px rgba(29,109,242,.18) !important;
}
.report-builder-modal .report-page-empty,
.report-builder-modal.is-server-rendered .report-page-empty {
  color: #6b7f9f !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
.report-builder-modal .report-drop-row,
.report-builder-modal.is-server-rendered .report-drop-row {
  display: none !important;
}
.report-builder-modal .report-drop-row.is-active-page,
.report-builder-modal.is-server-rendered .report-drop-row.is-active-page {
  display: grid !important;
}
@media print {
  .report-builder-modal .report-drop-row,
  .report-builder-modal.is-server-rendered .report-drop-row {
    display: grid !important;
    page-break-after: always;
  }
}

/* Sheet Record history modal */
.sheet-record-modal {
  position: fixed;
  inset: 0;
  z-index: 2600;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(7, 31, 70, .45);
  backdrop-filter: blur(3px);
}
.sheet-record-card {
  width: min(860px, 96vw);
  max-height: min(680px, 90vh);
  overflow: hidden;
  background: #fff;
  border: 1px solid #cfe1ff;
  border-radius: 14px;
  box-shadow: 0 24px 70px rgba(8, 36, 92, .24);
  position: relative;
}
.sheet-record-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: #ffe2e2;
  color: #dc2626;
  cursor: pointer;
}
.sheet-record-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 58px 16px 20px;
  background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%);
  border-bottom: 1px solid #d8e8ff;
}
.sheet-record-head > i {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #e5f0ff;
  color: #1d64d8;
  font-size: 17px;
}
.sheet-record-head h2 {
  margin: 0;
  color: #06265a;
  font-size: 21px;
  line-height: 1.1;
  font-weight: 700;
}
.sheet-record-head p {
  margin: 4px 0 0;
  color: #4b6388;
  font-size: 13px;
  font-weight: 500;
}
.sheet-record-table-wrap {
  max-height: 500px;
  overflow: auto;
  padding: 14px;
}
.sheet-record-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #d8e8ff;
  border-radius: 10px;
  overflow: hidden;
  font-size: 13px;
  color: #06265a;
}
.sheet-record-table th,
.sheet-record-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #d8e8ff;
  text-align: left;
  vertical-align: middle;
}
.sheet-record-table th {
  background: #eef6ff;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0;
  font-weight: 600;
}
.sheet-record-table tbody tr:nth-child(even) td {
  background: #fbfdff;
}
.sheet-record-table tbody tr:last-child td {
  border-bottom: 0;
}
.sheet-record-table td:first-child,
.sheet-record-table th:first-child {
  text-align: center;
  width: 54px;
}
.sheet-record-table td:last-child {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.sheet-record-table button {
  border: 1px solid #bfd8ff;
  border-radius: 999px;
  background: #fff;
  color: #0759c8;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.sheet-record-table button:hover {
  background: #eaf3ff;
}
.sheet-record-empty {
  text-align: center !important;
  color: #64748b;
  padding: 22px !important;
}
.call-report-chip[data-open-sheet-record] {
  font-size: 14px;
  gap: 8px;
}

/* Report builder page undo */
.report-builder-modal .report-page-undo,
.report-builder-modal.is-server-rendered .report-page-undo {
  min-width: 82px !important;
  height: 28px !important;
  padding: 0 9px !important;
  border-radius: 999px !important;
  border: 1px solid #bfd8ff !important;
  background: #f8fbff !important;
  color: #0759c8 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}
.report-builder-modal .report-page-undo:hover,
.report-builder-modal.is-server-rendered .report-page-undo:hover {
  background: #eaf3ff !important;
}
.report-builder-modal .report-page-undo.is-disabled,
.report-builder-modal.is-server-rendered .report-page-undo.is-disabled {
  opacity: .55 !important;
  cursor: default !important;
}
.report-builder-modal .report-drop-cell:focus-within,
.report-builder-modal.is-server-rendered .report-drop-cell:focus-within,
.report-builder-modal .report-drop-cell:hover,
.report-builder-modal.is-server-rendered .report-drop-cell:hover {
  border-color: #78aef7 !important;
  box-shadow: 0 8px 18px rgba(29,109,242,.08), inset 0 0 0 1px rgba(255,255,255,.8) !important;
}

/* Keep graph full-view available inside report builder */
.report-builder-modal.is-server-rendered .analytics-full-btn,
.report-builder-modal .report-drop-cell .analytics-full-btn {
  display: inline-grid !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}
.analytics-graph-modal {
  z-index: 3200 !important;
}
.analytics-graph-modal .analytics-full-btn {
  display: none !important;
}

/* Make report builder inner preview canvas fill the available right-side space */
.report-builder-modal .report-builder-canvas-wrap,
.report-builder-modal.is-server-rendered .report-builder-canvas-wrap,
.report-builder-modal .report-builder-list.report-builder-preview,
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview,
.report-builder-modal .report-drop-row,
.report-builder-modal.is-server-rendered .report-drop-row,
.report-builder-modal .report-drop-cell,
.report-builder-modal.is-server-rendered .report-drop-cell,
.report-builder-modal .report-drop-cell > .report-builder-item,
.report-builder-modal.is-server-rendered .report-drop-cell > .report-builder-item,
.report-builder-modal .report-builder-item-body,
.report-builder-modal.is-server-rendered .report-builder-item-body,
.report-builder-modal .call-detail-report-panel,
.report-builder-modal.is-server-rendered .call-detail-report-panel,
.report-builder-modal .call-detail-report-table,
.report-builder-modal.is-server-rendered .call-detail-report-table {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}
.report-builder-modal .report-builder-list.report-builder-preview,
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
  justify-items: stretch !important;
  align-items: stretch !important;
}
.report-builder-modal .report-drop-row.is-active-page,
.report-builder-modal.is-server-rendered .report-drop-row.is-active-page {
  display: grid !important;
  justify-items: stretch !important;
}
.report-builder-modal .report-drop-cell,
.report-builder-modal.is-server-rendered .report-drop-cell {
  justify-self: stretch !important;
  align-self: stretch !important;
}
.report-builder-modal .call-detail-report-panel,
.report-builder-modal.is-server-rendered .call-detail-report-panel {
  display: block !important;
}

/* Final report builder canvas stretch fix */
html body .report-builder-modal.is-server-rendered .report-builder-card,
html body .report-builder-modal .report-builder-card {
  width: min(1860px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
}
html body .report-builder-modal.is-server-rendered .report-builder-workspace,
html body .report-builder-modal .report-builder-workspace {
  display: grid !important;
  grid-template-columns: 150px minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: none !important;
  align-items: stretch !important;
}
html body .report-builder-modal.is-server-rendered .report-builder-canvas-wrap,
html body .report-builder-modal .report-builder-canvas-wrap {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}
html body .report-builder-modal.is-server-rendered [data-report-canvas].report-builder-preview,
html body .report-builder-modal [data-report-canvas].report-builder-preview {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-items: stretch !important;
  align-items: stretch !important;
  place-items: stretch !important;
}
html body .report-builder-modal.is-server-rendered .report-drop-row,
html body .report-builder-modal .report-drop-row,
html body .report-builder-modal.is-server-rendered .report-drop-row.is-active-page,
html body .report-builder-modal .report-drop-row.is-active-page {
  width: 100% !important;
  max-width: none !important;
  min-width: 100% !important;
  grid-column: 1 / -1 !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
}
html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row,
html body .report-builder-modal .report-drop-row.is-half-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}
html body .report-builder-modal.is-server-rendered .report-drop-row.is-full-row,
html body .report-builder-modal .report-drop-row.is-full-row {
  grid-template-columns: minmax(0, 1fr) !important;
}
html body .report-builder-modal.is-server-rendered .report-drop-cell,
html body .report-builder-modal .report-drop-cell {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
}
html body .report-builder-modal.is-server-rendered .report-drop-cell > .report-builder-item,
html body .report-builder-modal .report-drop-cell > .report-builder-item,
html body .report-builder-modal.is-server-rendered .report-preview-section,
html body .report-builder-modal .report-preview-section,
html body .report-builder-modal.is-server-rendered .report-builder-item-body,
html body .report-builder-modal .report-builder-item-body,
html body .report-builder-modal.is-server-rendered .report-builder-item-body > *,
html body .report-builder-modal .report-builder-item-body > * {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
html body .report-builder-modal.is-server-rendered .call-combined-pie-card,
html body .report-builder-modal .call-combined-pie-card,
html body .report-builder-modal.is-server-rendered .call-sector-chart,
html body .report-builder-modal .call-sector-chart,
html body .report-builder-modal.is-server-rendered .call-percentage-chart,
html body .report-builder-modal .call-percentage-chart,
html body .report-builder-modal.is-server-rendered .call-detail-report-panel,
html body .report-builder-modal .call-detail-report-panel {
  width: 100% !important;
  max-width: none !important;
}
@media (max-width: 1100px) {
  html body .report-builder-modal.is-server-rendered .report-builder-workspace,
  html body .report-builder-modal .report-builder-workspace {
    grid-template-columns: 1fr !important;
  }
  html body .report-builder-modal.is-server-rendered .report-builder-palette,
  html body .report-builder-modal .report-builder-palette {
    width: 100% !important;
    min-width: 0 !important;
  }
}
@media (max-width: 760px) {
  html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row,
  html body .report-builder-modal .report-drop-row.is-half-row {
    grid-template-columns: 1fr !important;
  }
}

/* Report builder save button and notification */
.report-builder-modal .report-export-icon.is-save,
.report-builder-modal.is-server-rendered .report-export-icon.is-save {
  background: linear-gradient(180deg, #e9fff4 0%, #f7fffb 100%) !important;
  border-color: #a7f3d0 !important;
}
.report-builder-modal .report-export-icon.is-save i,
.report-builder-modal.is-server-rendered .report-export-icon.is-save i {
  color: #059669 !important;
}
.report-builder-toast {
  position: absolute;
  top: 96px;
  right: 88px;
  z-index: 5;
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid #a7f3d0;
  background: #ecfdf5;
  color: #047857;
  font-size: 13px;
  font-weight: 600;
  box-shadow: 0 12px 26px rgba(5, 150, 105, .16);
  transition: opacity .18s ease, transform .18s ease;
}
.report-builder-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.report-builder-modal .call-detail-text,
.report-builder-modal .call-detail-name,
.report-builder-modal .call-detail-dist {
  unicode-bidi: plaintext;
}

/* Stable analytics graph full-view modal */
html body.analytics-modal-open {
  overflow: hidden;
}
html body .analytics-graph-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 50000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 22px !important;
  background: rgba(8, 28, 64, .58) !important;
}
html body .analytics-graph-modal-card {
  position: relative !important;
  width: min(1500px, 96vw) !important;
  max-width: 96vw !important;
  max-height: 92vh !important;
  overflow: auto !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 16px !important;
  background: #f8fbff !important;
  box-shadow: 0 24px 80px rgba(8, 36, 92, .34) !important;
  padding: 18px !important;
}
html body .analytics-graph-modal-close {
  position: sticky !important;
  top: 0 !important;
  float: right !important;
  z-index: 3 !important;
  width: 38px !important;
  height: 38px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #ffe2e2 !important;
  color: #dc2626 !important;
  display: inline-grid !important;
  place-items: center !important;
  cursor: pointer !important;
}
html body .analytics-graph-modal-body,
html body .analytics-graph-modal-body > *,
html body .analytics-graph-modal-body .analytics-full-view-clone {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
html body .analytics-graph-modal-body .call-sector-chart,
html body .analytics-graph-modal-body .call-percentage-chart,
html body .analytics-graph-modal-body .call-combined-pie-card {
  margin: 0 !important;
  min-height: auto !important;
}
html body .analytics-graph-modal .analytics-full-btn {
  display: none !important;
}

/* Report export print rendering: keep CSS graphs visible */
@media print {
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
  .call-combined-pie,
  .call-donut,
  .call-stacked-bar span,
  .call-sector-chart,
  .call-percentage-chart,
  .call-combined-pie-card,
  .analytics-title-block,
  .call-percentage-head,
  .call-combined-pie-head {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
}
.sheet-record-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #0f5fd1;
  font-weight: 600;
  text-decoration: none;
}
.sheet-record-link:hover { text-decoration: underline; }

/* Reference-style public complaints stacked bar graph */
html body .call-analytics-graphs.is-province-selected .call-sector-chart {
  background: #fff !important;
  border: 1px solid #d9e2ef !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  padding: 14px 18px 16px !important;
  overflow: visible !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-block {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #082a63 !important;
  text-align: center !important;
  padding: 0 !important;
  margin: 0 0 8px !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-block h2 {
  color: #082a63 !important;
  font-size: 22px !important;
  line-height: 1.12 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  margin: 0 !important;
  text-transform: uppercase !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-block p {
  color: #082a63 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  margin: 2px 0 0 !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-range {
  font-size: 12px !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-region-legend {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px 34px !important;
  margin: 8px auto 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-region-legend span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  color: #18264a !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-region-legend i {
  width: 18px !important;
  height: 14px !important;
  border-radius: 1px !important;
  box-shadow: 0 0 0 1px rgba(8, 42, 99, .12) !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-chart-wrap {
  display: grid !important;
  grid-template-columns: 62px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: end !important;
  padding: 0 10px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-y-axis {
  height: 300px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  padding: 0 8px 88px 0 !important;
  border-right: 2px solid #9aa9c0 !important;
  color: #082a63 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-chart {
  min-height: 300px !important;
  height: 300px !important;
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 10px !important;
  overflow: visible !important;
  padding: 0 4px 88px !important;
  border-bottom: 2px solid #9aa9c0 !important;
  background: repeating-linear-gradient(to top, transparent 0, transparent 58px, rgba(11, 42, 92, .11) 59px, transparent 60px) !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-item {
  min-width: 34px !important;
  max-width: 54px !important;
  flex: 1 1 38px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: end !important;
  position: relative !important;
  height: 100% !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-total {
  color: #101010 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  margin: 0 0 5px !important;
  text-shadow: none !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-stacked-bar,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-chart.is-district-chart .call-stacked-bar,
html body .call-analytics-graphs.is-region-50.is-province-selected .call-sector-chart .call-stacked-bar {
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: auto !important;
  min-height: 2px !important;
  display: flex !important;
  flex-direction: column-reverse !important;
  justify-content: flex-start !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;
  box-shadow: none !important;
  transform: none !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-stacked-bar::before,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-stacked-bar::after {
  display: none !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-stacked-bar span {
  width: 100% !important;
  min-height: 7px !important;
  border-radius: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-item em {
  position: absolute !important;
  top: calc(100% - 76px) !important;
  left: 50% !important;
  width: 88px !important;
  transform: translateX(-50%) rotate(-48deg) !important;
  transform-origin: top center !important;
  color: #18264a !important;
  font-size: 13px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  text-align: right !important;
  white-space: normal !important;
  overflow: visible !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-category-total-row {
  display: grid !important;
  grid-template-columns: 90px repeat(var(--total-cols, 1), minmax(0, 1fr)) 70px !important;
  width: 100% !important;
  margin: 18px 0 0 !important;
  border: 1px solid #7c8da8 !important;
  border-radius: 5px !important;
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: none !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-category-total-row strong,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-category-total-row b {
  display: grid !important;
  place-items: center !important;
  min-height: 42px !important;
  background: #082a63 !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-category-total-row span {
  display: grid !important;
  place-items: center !important;
  min-height: 42px !important;
  border-left: 1px solid #9aa9c0 !important;
  color: #082a63 !important;
  background: #fff !important;
  font-size: 18px !important;
  font-weight: 800 !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .analytics-full-btn {
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
}
@media (max-width: 1100px) {
  html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-region-legend { gap: 8px 18px !important; }
  html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-region-legend span { font-size: 12px !important; }
  html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-chart { gap: 6px !important; }
  html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-stacked-bar { width: 24px !important; min-width: 24px !important; max-width: 24px !important; }
  html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-item em { font-size: 11px !important; width: 72px !important; }
}

/* Province district graph label alignment under bars */
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-chart {
  padding-bottom: 62px !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-item {
  justify-content: flex-end !important;
}
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-item em {
  position: absolute !important;
  top: calc(100% - 54px) !important;
  left: 50% !important;
  width: 74px !important;
  transform: translateX(-50%) !important;
  transform-origin: center top !important;
  color: #18264a !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

/* Report builder 50 percent graph fit */
html body .report-builder-modal .report-drop-row.is-half-row .call-sector-chart,html body .report-builder-modal .report-drop-row.is-half-row .call-percentage-chart,html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .call-sector-chart,html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .call-percentage-chart{min-height:355px!important;max-height:390px!important;overflow:hidden!important;padding:0 8px 8px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .analytics-title-block,html body .report-builder-modal .report-drop-row.is-half-row .call-percentage-head,html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .analytics-title-block,html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .call-percentage-head{min-height:44px!important;padding:8px 34px!important;margin:0 -8px 8px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .analytics-title-block h2,html body .report-builder-modal .report-drop-row.is-half-row .call-percentage-head h2,html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .analytics-title-block h2,html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .call-percentage-head h2{font-size:13px!important;line-height:1.1!important;margin:0!important;letter-spacing:0!important;}
html body .report-builder-modal .report-drop-row.is-half-row .analytics-title-block p,html body .report-builder-modal .report-drop-row.is-half-row .call-percentage-head p{font-size:10px!important;line-height:1.05!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-region-legend{gap:4px 7px!important;margin:4px 0 6px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-region-legend span{font-size:8.5px!important;line-height:1.05!important;padding:0!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-region-legend i{width:9px!important;height:8px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-bar-chart-wrap{grid-template-columns:26px minmax(0,1fr)!important;min-height:210px!important;gap:6px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-y-axis{height:185px!important;padding-bottom:54px!important;font-size:8px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-bar-chart{height:185px!important;min-height:185px!important;gap:5px!important;padding-bottom:54px!important;overflow:visible!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-stacked-bar{width:14px!important;min-width:14px!important;max-width:14px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-bar-total{font-size:10px!important;top:-17px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-bar-item em{top:calc(100% + 4px)!important;width:58px!important;font-size:7.5px!important;line-height:.95!important;}

/* Report builder donut and modal stability */
html body .report-builder-modal .report-drop-row.is-half-row .call-category-total-row{margin-top:4px!important;grid-template-columns:42px repeat(var(--total-cols,1),minmax(16px,1fr)) 34px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-category-total-row span,html body .report-builder-modal .report-drop-row.is-half-row .call-category-total-row strong,html body .report-builder-modal .report-drop-row.is-half-row .call-category-total-row b{min-height:24px!important;font-size:8px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-donut-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;max-height:255px!important;overflow:hidden!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-donut-card{min-height:116px!important;padding:7px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-donut-card h3{font-size:9px!important;line-height:1.05!important;min-height:22px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-donut-card strong{font-size:15px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-donut-card p{font-size:8.5px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-donut{width:52px!important;height:52px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .call-donut::after{inset:18px!important;}
html body .analytics-graph-modal{z-index:99999!important;}
html body .analytics-graph-modal-body .analytics-full-view-clone{width:100%!important;max-width:1280px!important;margin:0 auto!important;max-height:none!important;overflow:visible!important;}
html body .analytics-graph-modal-body .call-sector-chart .call-bar-chart{min-height:340px!important;height:340px!important;padding-bottom:86px!important;}
html body .analytics-graph-modal-body .call-sector-chart .call-y-axis{height:340px!important;padding-bottom:86px!important;}

/* Final analytics/report-builder cleanup */
html body .call-sector-chart .call-bar-item em{position:absolute!important;left:50%!important;top:calc(100% + 6px)!important;transform:translateX(-50%) rotate(-45deg)!important;transform-origin:top center!important;width:78px!important;min-height:32px!important;display:block!important;text-align:right!important;white-space:normal!important;overflow:visible!important;color:#06265a!important;font-size:11px!important;line-height:1.05!important;font-style:normal!important;font-weight:700!important;z-index:3!important;}
html body .call-sector-chart .call-bar-chart{padding-bottom:76px!important;}
html body .call-sector-chart .call-y-axis{padding-bottom:76px!important;}
html body .call-sector-chart .call-category-total-row{grid-template-columns:74px repeat(var(--total-cols,1),minmax(34px,1fr)) 56px!important;}
html body .report-builder-modal .report-builder-workspace,html body .report-builder-modal.is-server-rendered .report-builder-workspace{grid-template-columns:130px minmax(0,1fr)!important;gap:8px!important;align-items:start!important;}
html body .report-builder-modal .report-builder-palette,html body .report-builder-modal.is-server-rendered .report-builder-palette{width:130px!important;min-width:130px!important;padding:7px!important;}
html body .report-builder-modal .report-builder-palette-item{min-height:31px!important;padding:6px 7px!important;font-size:9px!important;}
html body .report-builder-modal .report-drop-row.is-half-row,html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;}
html body .report-builder-modal .report-drop-row.is-half-row .report-drop-cell,html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .report-drop-cell{overflow:hidden!important;padding:6px!important;}

/* Final fix: stacked chart district labels exactly under bars, diagonal like reference */
html body .call-sector-chart .call-bar-chart .call-bar-item,
html body .call-sector-chart .call-bar-chart.is-district-chart .call-bar-item {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-width: 46px !important;
  overflow: visible !important;
}
html body .call-sector-chart .call-bar-chart .call-bar-item > em,
html body .call-sector-chart .call-bar-chart.is-district-chart .call-bar-item > em,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-chart .call-bar-item > em {
  position: absolute !important;
  left: 50% !important;
  bottom: -58px !important;
  top: auto !important;
  transform: translateX(-50%) rotate(-45deg) !important;
  transform-origin: top center !important;
  width: 86px !important;
  max-width: 86px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  text-align: right !important;
  white-space: normal !important;
  overflow: visible !important;
  color: #0a2c63 !important;
  font-size: 12px !important;
  line-height: 1.05 !important;
  font-style: normal !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  z-index: 4 !important;
}
html body .call-sector-chart .call-bar-chart,
html body .call-sector-chart .call-bar-chart.is-district-chart,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-bar-chart {
  overflow: visible !important;
  padding-bottom: 86px !important;
}
html body .call-sector-chart .call-y-axis,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .call-y-axis {
  padding-bottom: 86px !important;
}
html body .call-sector-chart .call-category-total-row {
  margin-top: 10px !important;
}
html body .report-builder-modal .report-drop-row.is-half-row .call-bar-chart .call-bar-item > em {
  bottom: -44px !important;
  width: 58px !important;
  max-width: 58px !important;
  font-size: 7.5px !important;
}
html body .report-builder-modal .report-drop-row.is-half-row .call-bar-chart {
  padding-bottom: 58px !important;
}
html body .report-builder-modal .report-drop-row.is-half-row .call-y-axis {
  padding-bottom: 58px !important;
}

/* Final graph header unification: same band style with assigned region colors */
html body .call-analytics-graphs,
html body .sms-analytics-graphs {
  --slims-graph-head: #0f5cc9;
  --slims-graph-head-soft: #eaf3ff;
  --slims-graph-head-border: #b8d5ff;
}
html body .call-analytics-graphs.province-tab-kp,
html body .sms-analytics-graphs.province-tab-kp { --slims-graph-head:#16a34a; --slims-graph-head-soft:#ecfdf3; --slims-graph-head-border:#86efac; }
html body .call-analytics-graphs.province-tab-bln,
html body .sms-analytics-graphs.province-tab-bln { --slims-graph-head:#f97316; --slims-graph-head-soft:#fff7ed; --slims-graph-head-border:#fed7aa; }
html body .call-analytics-graphs.province-tab-gb,
html body .sms-analytics-graphs.province-tab-gb { --slims-graph-head:#7c3aed; --slims-graph-head-soft:#f3edff; --slims-graph-head-border:#c4b5fd; }
html body .call-analytics-graphs.province-tab-punjab,
html body .sms-analytics-graphs.province-tab-punjab { --slims-graph-head:#c2185b; --slims-graph-head-soft:#fff0f6; --slims-graph-head-border:#f7b7cf; }
html body .call-analytics-graphs.province-tab-sindh,
html body .sms-analytics-graphs.province-tab-sindh { --slims-graph-head:#0f766e; --slims-graph-head-soft:#ecfdfb; --slims-graph-head-border:#99f6e4; }
html body .call-sector-chart .analytics-title-block,
html body .call-percentage-chart .call-percentage-head,
html body .call-combined-pie-card .call-combined-pie-head,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-block {
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:58px!important;
  margin:-14px -16px 14px!important;
  padding:10px 58px!important;
  border:1px solid var(--slims-graph-head-border)!important;
  border-left:4px solid var(--slims-graph-head)!important;
  border-radius:8px 8px 0 0!important;
  background:linear-gradient(90deg,var(--slims-graph-head-soft) 0%,#ffffff 52%,var(--slims-graph-head-soft) 100%)!important;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.75)!important;
  text-align:center!important;
  color:#08245c!important;
  overflow:hidden!important;
}
html body .call-sector-chart .analytics-title-block h2,
html body .call-percentage-chart .call-percentage-head h2,
html body .call-combined-pie-card .call-combined-pie-head h2,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-block h2 {
  width:100%!important;
  margin:0!important;
  color:#08245c!important;
  font-size:17px!important;
  line-height:1.15!important;
  font-weight:800!important;
  text-transform:uppercase!important;
  letter-spacing:0!important;
}
html body .call-sector-chart .analytics-title-block p,
html body .call-percentage-chart .call-percentage-head p,
html body .call-combined-pie-card .call-combined-pie-head > span,
html body .call-analytics-graphs.is-province-selected .call-sector-chart .analytics-title-block p {
  margin:2px 0 0!important;
  color:var(--slims-graph-head)!important;
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:700!important;
  background:transparent!important;
  box-shadow:none!important;
}
html body .call-sector-chart .analytics-full-btn,
html body .call-percentage-chart .analytics-full-btn,
html body .call-combined-pie-card .analytics-full-btn {
  top:13px!important;
  left:14px!important;
  color:var(--slims-graph-head)!important;
  border-color:var(--slims-graph-head-border)!important;
  background:#ffffffcc!important;
}
html body .report-builder-modal .call-sector-chart .analytics-title-block,
html body .report-builder-modal .call-percentage-chart .call-percentage-head,
html body .report-builder-modal .call-combined-pie-card .call-combined-pie-head {
  min-height:48px!important;
  padding:8px 42px!important;
  margin:-8px -8px 10px!important;
}
html body .report-builder-modal .call-sector-chart .analytics-title-block h2,
html body .report-builder-modal .call-percentage-chart .call-percentage-head h2,
html body .report-builder-modal .call-combined-pie-card .call-combined-pie-head h2 {
  font-size:13px!important;
}

/* Final graph typography: normal readable weights */
html body .call-sector-chart .call-region-legend span,
html body .call-sector-chart .call-bar-total,
html body .call-sector-chart .call-stacked-bar span,
html body .call-sector-chart .call-bar-item > em,
html body .call-sector-chart .call-category-total-row strong,
html body .call-sector-chart .call-category-total-row span,
html body .call-sector-chart .call-category-total-row b,
html body .call-percentage-chart .call-donut-card h3,
html body .call-percentage-chart .call-donut-card strong,
html body .call-percentage-chart .call-donut-card p,
html body .call-combined-pie-card .call-pie-legend-row,
html body .call-combined-pie-card .call-pie-legend-row b,
html body .call-combined-pie-card .call-pie-legend-row strong,
html body .analytics-graph-modal-body .call-region-legend span,
html body .analytics-graph-modal-body .call-bar-total,
html body .analytics-graph-modal-body .call-bar-item > em,
html body .analytics-graph-modal-body .call-category-total-row strong,
html body .analytics-graph-modal-body .call-category-total-row span,
html body .analytics-graph-modal-body .call-category-total-row b,
html body .analytics-graph-modal-body .call-donut-card h3,
html body .analytics-graph-modal-body .call-donut-card strong,
html body .analytics-graph-modal-body .call-donut-card p {
  font-weight: 400 !important;
}
html body .call-sector-chart .analytics-title-block h2,
html body .call-percentage-chart .call-percentage-head h2,
html body .call-combined-pie-card .call-combined-pie-head h2 {
  font-weight: 600 !important;
}
html body .call-sector-chart .analytics-title-block p,
html body .call-percentage-chart .call-percentage-head p,
html body .call-combined-pie-card .call-combined-pie-head > span {
  font-weight: 400 !important;
}
html body .call-sector-chart .call-category-total-row strong,
html body .call-sector-chart .call-category-total-row b {
  font-weight: 500 !important;
}

/* Match stacked graph label sizes with percentage graph labels */
html body .call-sector-chart .call-region-legend span,
html body .call-sector-chart .call-y-axis span,
html body .call-sector-chart .call-stacked-bar span,
html body .call-sector-chart .call-bar-item > em,
html body .analytics-graph-modal-body .call-sector-chart .call-region-legend span,
html body .analytics-graph-modal-body .call-sector-chart .call-y-axis span,
html body .analytics-graph-modal-body .call-sector-chart .call-stacked-bar span,
html body .analytics-graph-modal-body .call-sector-chart .call-bar-item > em {
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
}
html body .call-sector-chart .call-region-legend i {
  width: 14px !important;
  height: 12px !important;
}
html body .call-sector-chart .call-bar-total {
  font-size: 15px !important;
  font-weight: 500 !important;
}
html body .report-builder-modal .report-drop-row.is-half-row .call-region-legend span,
html body .report-builder-modal .report-drop-row.is-half-row .call-y-axis span,
html body .report-builder-modal .report-drop-row.is-half-row .call-stacked-bar span,
html body .report-builder-modal .report-drop-row.is-half-row .call-bar-item > em {
  font-size: 10px !important;
  line-height: 1.05 !important;
}

/* Final uniform graph headers: all pie, stacked and percentage graphs use same band */
html body .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head,
html body .call-sector-chart > .analytics-title-block,
html body .call-percentage-chart > .call-percentage-head,
html body .call-analytics-graphs.is-province-selected .call-sector-chart > .analytics-title-block,
html body .report-builder-modal .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head,
html body .report-builder-modal .call-sector-chart > .analytics-title-block,
html body .report-builder-modal .call-percentage-chart > .call-percentage-head,
html body .analytics-graph-modal-body .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head,
html body .analytics-graph-modal-body .call-sector-chart > .analytics-title-block,
html body .analytics-graph-modal-body .call-percentage-chart > .call-percentage-head {
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:58px!important;
  margin:-14px -16px 14px!important;
  padding:10px 58px!important;
  border:1px solid var(--slims-graph-head-border,#b8d5ff)!important;
  border-left:4px solid var(--slims-graph-head,#0f5cc9)!important;
  border-radius:8px 8px 0 0!important;
  background:linear-gradient(90deg,var(--slims-graph-head-soft,#eaf3ff) 0%,#ffffff 52%,var(--slims-graph-head-soft,#eaf3ff) 100%)!important;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.75)!important;
  text-align:center!important;
  color:#08245c!important;
  overflow:hidden!important;
}
html body .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head h2,
html body .call-sector-chart > .analytics-title-block h2,
html body .call-percentage-chart > .call-percentage-head h2,
html body .call-analytics-graphs.is-province-selected .call-sector-chart > .analytics-title-block h2,
html body .report-builder-modal .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head h2,
html body .report-builder-modal .call-sector-chart > .analytics-title-block h2,
html body .report-builder-modal .call-percentage-chart > .call-percentage-head h2,
html body .analytics-graph-modal-body .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head h2,
html body .analytics-graph-modal-body .call-sector-chart > .analytics-title-block h2,
html body .analytics-graph-modal-body .call-percentage-chart > .call-percentage-head h2 {
  width:100%!important;
  margin:0!important;
  color:#08245c!important;
  font-size:17px!important;
  line-height:1.15!important;
  font-weight:600!important;
  text-transform:uppercase!important;
  letter-spacing:0!important;
}
html body .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head span,
html body .call-sector-chart > .analytics-title-block p,
html body .call-percentage-chart > .call-percentage-head p,
html body .call-analytics-graphs.is-province-selected .call-sector-chart > .analytics-title-block p,
html body .report-builder-modal .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head span,
html body .report-builder-modal .call-sector-chart > .analytics-title-block p,
html body .report-builder-modal .call-percentage-chart > .call-percentage-head p,
html body .analytics-graph-modal-body .call-combined-pie-card.analytics-fullscreen-panel > .call-combined-pie-head span,
html body .analytics-graph-modal-body .call-sector-chart > .analytics-title-block p,
html body .analytics-graph-modal-body .call-percentage-chart > .call-percentage-head p {
  display:block!important;
  margin:2px 0 0!important;
  color:var(--slims-graph-head,#0f5cc9)!important;
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:400!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
html body .call-combined-pie-card.analytics-fullscreen-panel > .analytics-full-btn,
html body .call-sector-chart > .analytics-full-btn,
html body .call-percentage-chart > .analytics-full-btn {
  top:13px!important;
  left:14px!important;
  right:auto!important;
  z-index:9!important;
}
/* Dashboard Calls Overview additions */
.dashboard-call-metric-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.dashboard-text-metric-card {
    gap: 12px;
    min-height: 74px;
}
.dashboard-text-metric-value {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    min-width: 0;
    max-width: 68%;
    text-align: right;
}
.dashboard-text-metric-value strong {
    display: -webkit-box;
    max-width: 100%;
    color: #0f2f6f;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.dashboard-text-metric-value span {
    color: #2563eb;
    font-size: 13px;
    font-weight: 600;
    margin-top: 4px;
}
.dashboard-top-cities-card {
    margin-top: 14px;
}
.dashboard-top-city-list {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    padding: 12px;
}
.dashboard-top-city-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    gap: 3px 8px;
    align-items: center;
    min-height: 58px;
    padding: 10px 12px;
    border: 1px solid #cfe2ff;
    border-radius: 12px;
    background: #f8fbff;
    color: #12345d;
    text-decoration: none;
}
.dashboard-top-city-row:hover {
    border-color: #60a5fa;
    background: #eff6ff;
    transform: translateY(-1px);
}
.dashboard-top-city-row.is-empty:hover {
    transform: none;
}
.dashboard-top-city-station {
    grid-column: 1 / -1;
    color: #64748b;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .03em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dashboard-top-city-row strong {
    min-width: 0;
    color: #0f2f6f;
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dashboard-top-city-row b {
    padding: 4px 10px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 700;
}
@media (max-width: 1200px) {
    .dashboard-call-metric-grid,
    .dashboard-top-city-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 720px) {
    .dashboard-call-metric-grid,
    .dashboard-top-city-list {
        grid-template-columns: 1fr;
    }
    .dashboard-text-metric-value {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    min-width: 0;
    max-width: 68%;
    text-align: right;
}
}

/* Call category summary modal from percentage chart */
html body .call-percentage-chart { position: relative !important; }
html body .call-category-summary-btn {
  position: absolute !important;
  top: 13px !important;
  right: 14px !important;
  z-index: 5 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  height: 30px !important;
  padding: 0 12px !important;
  border: 1px solid #b9d6ff !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.82) !important;
  color: #0b58c4 !important;
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  box-shadow: 0 8px 20px rgba(8,36,92,.10) !important;
}
html body .call-category-summary-btn:hover {
  background: #ffffff !important;
  border-color: #7fb2ff !important;
  color: #073b8f !important;
}
html body .report-builder-modal .call-category-summary-btn { display: none !important; }
html body .call-category-summary-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000000 !important;
  display: grid !important;
  place-items: center !important;
  padding: 24px !important;
  background: rgba(7, 25, 58, .46) !important;
  backdrop-filter: blur(3px) !important;
}
html body .call-category-summary-card {
  position: relative !important;
  width: min(900px, 94vw) !important;
  max-height: 86vh !important;
  overflow: auto !important;
  border: 1px solid #cfe2ff !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%) !important;
  box-shadow: 0 24px 70px rgba(8, 36, 92, .24) !important;
  font-family: Poppins, Arial, sans-serif !important;
}
html body .call-category-summary-close {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  width: 34px !important;
  height: 34px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #ffe1e1 !important;
  color: #dc2626 !important;
  cursor: pointer !important;
}
html body .call-category-summary-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 20px 62px 18px 22px !important;
  border-bottom: 1px solid #cfe2ff !important;
  background: linear-gradient(90deg, #f6fbff 0%, #f8fdff 100%) !important;
}
html body .call-category-summary-head > div {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
html body .call-category-summary-head i { color: #08315f !important; font-size: 17px !important; }
html body .call-category-summary-head h2 {
  margin: 0 !important;
  color: #08245c !important;
  font-size: 19px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}
html body .call-category-summary-head strong {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 52px !important;
  height: 36px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #2563eb, #0ea5e9) !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .20) !important;
}
html body .call-category-summary-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 18px !important;
}
html body .call-category-summary-tile {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 42px !important;
  padding: 9px 11px !important;
  border: 1px solid #cfe2ff !important;
  border-radius: 9px !important;
  background: #f8fbff !important;
  color: #08245c !important;
}
html body .call-category-summary-tile span {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}
html body .call-category-summary-tile b {
  min-width: 38px !important;
  padding: 4px 9px !important;
  border-radius: 8px !important;
  background: #eaf4ff !important;
  color: #075fd7 !important;
  text-align: center !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
html body .call-category-summary-empty {
  grid-column: 1 / -1 !important;
  padding: 24px !important;
  text-align: center !important;
  color: #64748b !important;
  font-size: 14px !important;
}
@media (max-width: 780px) {
  html body .call-category-summary-grid { grid-template-columns: 1fr !important; }
  html body .call-category-summary-btn span { display: none !important; }
}
/* Dashboard requested overview cards */
.dashboard-sms-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sms-dual-code-card {
    min-height: 74px;
}
.sms-dual-code-values {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}
.sms-dual-code-values a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    padding: 6px 10px;
    border-radius: 12px;
    background: #f3e8ff;
    color: #5b21b6;
    text-decoration: none;
}
.sms-dual-code-values a:hover {
    background: #ede9fe;
    transform: translateY(-1px);
}
.sms-dual-code-values span {
    font-size: 11px;
    color: #6b7280;
}
.sms-dual-code-values b {
    font-size: 18px;
    line-height: 1.1;
}
.dashboard-call-metric-grid {
    grid-template-columns: minmax(0, 1fr);
}
.dashboard-top-programs-card,
.dashboard-top-cities-card {
    margin-top: 14px;
}
.dashboard-region-program-list {
    display: grid;
    gap: 12px;
    padding: 12px;
}
.dashboard-region-program-group {
    border: 1px solid #d7e7ff;
    border-radius: 14px;
    background: #fbfdff;
    padding: 10px;
}
.dashboard-region-program-title {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 999px;
    background: #e0f2fe;
    color: #075985;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 9px;
}
.dashboard-region-program-cards {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}
.dashboard-region-program-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 52px;
    padding: 9px 10px;
    border: 1px solid #cfe2ff;
    border-radius: 12px;
    background: #f8fbff;
    color: #12345d;
    text-decoration: none;
}
.dashboard-region-program-card:hover {
    border-color: #60a5fa;
    background: #eff6ff;
    transform: translateY(-1px);
}
.dashboard-region-program-card span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}
.dashboard-region-program-card b,
.dashboard-region-program-empty {
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    padding: 4px 9px;
    font-size: 12px;
    font-weight: 700;
}
.dashboard-region-program-empty {
    border-radius: 12px;
    text-align: center;
    background: #f8fbff;
}
@media (max-width: 1400px) {
    .dashboard-region-program-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@media (max-width: 900px) {
    .dashboard-sms-kpi-grid,
    .dashboard-region-program-cards {
        grid-template-columns: 1fr;
    }
}
/* Dashboard full-width overview layout */
body .dashboard-overview-sections,
body .main-content > .dashboard-overview-sections,
body .content > .dashboard-overview-sections {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    align-items: stretch !important;
    width: 100% !important;
}
body .dashboard-overview-sections > .dashboard-overview-box,
body .main-content > .dashboard-overview-sections > .dashboard-overview-box,
body .content > .dashboard-overview-sections > .dashboard-overview-box {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}
body .dashboard-overview-box .dashboard-sms-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body .dashboard-overview-box .dashboard-call-metric-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
@media (max-width: 1100px) {
    body .dashboard-overview-box .dashboard-sms-summary-grid,
    body .dashboard-overview-box .dashboard-call-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 720px) {
    body .dashboard-overview-box .dashboard-sms-summary-grid,
    body .dashboard-overview-box .dashboard-call-metric-grid {
        grid-template-columns: 1fr !important;
    }
}
/* SMS Overview 4 cards per row */
body .dashboard-overview-box .dashboard-sms-summary-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
@media (max-width: 1200px) {
    body .dashboard-overview-box .dashboard-sms-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 720px) {
    body .dashboard-overview-box .dashboard-sms-summary-grid {
        grid-template-columns: 1fr !important;
    }
}
/* Calls Overview 4 cards + Top Programs 5 region columns */
body .dashboard-overview-box .dashboard-call-metric-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
body .dashboard-top-programs-card .dashboard-region-program-list {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 12px !important;
    align-items: stretch !important;
}
body .dashboard-top-programs-card .dashboard-region-program-group {
    min-width: 0 !important;
    height: 100% !important;
}
body .dashboard-top-programs-card .dashboard-region-program-cards {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
}
body .dashboard-top-programs-card .dashboard-region-program-card {
    width: 100% !important;
}
body .dashboard-top-programs-card .dashboard-region-program-card span {
    white-space: normal !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    line-height: 1.25 !important;
}
@media (max-width: 1400px) {
    body .dashboard-top-programs-card .dashboard-region-program-list {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 1100px) {
    body .dashboard-overview-box .dashboard-call-metric-grid,
    body .dashboard-top-programs-card .dashboard-region-program-list {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 720px) {
    body .dashboard-overview-box .dashboard-call-metric-grid,
    body .dashboard-top-programs-card .dashboard-region-program-list {
        grid-template-columns: 1fr !important;
    }
}
/* Dashboard city columns program cards */
body .dashboard-city-count-card span {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}
body .dashboard-city-count-card span small {
    color: #64748b !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.15 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
/* Dashboard city + province title */
body .dashboard-city-province-title {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 1px !important;
    border-radius: 14px !important;
}
body .dashboard-city-province-title span {
    color: #075985 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
}
body .dashboard-city-province-title small {
    color: #64748b !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.1 !important;
}

/* Reports analytics split header: Analytics left, Reports right */
html body .reports-mode-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin: 0 0 12px !important;
  padding: 10px !important;
  border: 1px solid #cfe2ff !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, #f8fbff 0%, #eef6ff 100%) !important;
  box-shadow: 0 8px 22px rgba(8, 36, 92, .07) !important;
}
html body .reports-mode-group {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}
html body .reports-mode-group-reports {
  justify-content: flex-end !important;
}
html body .reports-mode-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 38px !important;
  padding: 0 13px !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  color: #08245c !important;
  border: 1px solid #d8e8ff !important;
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
html body .reports-mode-header .reports-tab {
  min-height: 38px !important;
  padding: 8px 15px !important;
  border-radius: 9px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
html body .reports-mode-group-reports .reports-tab {
  background: #ffffff !important;
  border: 1px solid #cfe2ff !important;
  color: #0f4fb3 !important;
}
html body .reports-mode-group-reports .reports-tab:hover {
  background: #0f5cc9 !important;
  color: #ffffff !important;
  border-color: #0f5cc9 !important;
}
@media (max-width: 900px) {
  html body .reports-mode-header {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  html body .reports-mode-group {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: auto 1fr 1fr !important;
  }
  html body .reports-mode-header .reports-tab {
    justify-content: center !important;
  }
}
/* Compact pretty dashboard metric cards */
body .stat-grid:not(.dashboard-sms-summary-grid):not(.dashboard-call-metric-grid),
body .dashboard-overview-box .dashboard-sms-summary-grid,
body .dashboard-overview-box .dashboard-call-metric-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 12px !important;
}
body .sims-metric-card {
    min-height: 62px !important;
    padding: 13px 16px !important;
    border-radius: 10px !important;
    box-shadow: 0 7px 18px rgba(15, 47, 111, .055) !important;
    align-items: center !important;
}
body .sims-metric-main {
    gap: 11px !important;
    min-width: 0 !important;
}
body .sims-metric-icon {
    width: 39px !important;
    height: 39px !important;
    min-width: 39px !important;
    border-radius: 14px !important;
    font-size: 16px !important;
}
body .sims-metric-label {
    color: #52677f !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: .025em !important;
    line-height: 1.25 !important;
    text-transform: uppercase !important;
}
body .sims-metric-value {
    color: #12388c !important;
    font-size: clamp(22px, 1.7vw, 30px) !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: -.03em !important;
}
body .sms-dual-code-card {
    padding: 12px 14px !important;
}
body .sms-dual-code-values {
    gap: 7px !important;
}
body .sms-dual-code-values a {
    min-width: 62px !important;
    padding: 5px 8px !important;
    border-radius: 11px !important;
}
body .sms-dual-code-values span {
    font-size: 10px !important;
    line-height: 1 !important;
}
body .sms-dual-code-values b {
    font-size: clamp(16px, 1.25vw, 22px) !important;
    font-weight: 600 !important;
    letter-spacing: -.025em !important;
}
@media (max-width: 1500px) {
    body .stat-grid:not(.dashboard-sms-summary-grid):not(.dashboard-call-metric-grid),
    body .dashboard-overview-box .dashboard-sms-summary-grid,
    body .dashboard-overview-box .dashboard-call-metric-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 1100px) {
    body .stat-grid:not(.dashboard-sms-summary-grid):not(.dashboard-call-metric-grid),
    body .dashboard-overview-box .dashboard-sms-summary-grid,
    body .dashboard-overview-box .dashboard-call-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 720px) {
    body .stat-grid:not(.dashboard-sms-summary-grid):not(.dashboard-call-metric-grid),
    body .dashboard-overview-box .dashboard-sms-summary-grid,
    body .dashboard-overview-box .dashboard-call-metric-grid {
        grid-template-columns: 1fr !important;
    }
}
/* Final compact dashboard + slimmer sidebar */

:root {
    --sims-sidebar-width: 240px !important;
    --sims-sidebar-collapsed: 72px !important;
}
body .sidebar {
    width: var(--sims-sidebar-width) !important;
}
body .sidebar.collapsed {
    width: var(--sims-sidebar-collapsed) !important;
}
body .main-content {
    margin-left: var(--sims-sidebar-width) !important;
}
body .main-content.expanded {
    margin-left: var(--sims-sidebar-collapsed) !important;
}
body .sidebar a {
    padding: 9px 12px !important;
    font-size: 13px !important;
    gap: 9px !important;
}
body .sidebar .nav-label {
    font-size: 13px !important;
    line-height: 1.2 !important;
}
body .sidebar i {
    width: 18px !important;
    min-width: 18px !important;
    font-size: 14px !important;
}
body .submenu a {
    padding-left: 34px !important;
    font-size: 12.5px !important;
}
body .dashboard-overview-heading {
    margin-bottom: 10px !important;
}
body .dashboard-overview-heading h1 {
    font-size: 22px !important;
    font-weight: 500 !important;
}
body .stat-grid,
body .dashboard-overview-box .dashboard-sms-summary-grid,
body .dashboard-overview-box .dashboard-call-metric-grid {
    gap: 10px !important;
}
body .dashboard-overview-box {
    padding: 14px 16px !important;
    border-radius: 10px !important;
}
body .overview-box-head {
    margin-bottom: 10px !important;
    padding-bottom: 9px !important;
}
body .overview-box-head h2 {
    font-size: 17px !important;
    font-weight: 500 !important;
}
body .sims-metric-card {
    min-height: 56px !important;
    padding: 10px 13px !important;
    border-radius: 10px !important;
}
body .sims-metric-icon {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    font-size: 14px !important;
    border-radius: 12px !important;
}
body .sims-metric-label {
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.18 !important;
}
body .sims-metric-value {
    font-size: clamp(20px, 1.45vw, 26px) !important;
    font-weight: 600 !important;
    letter-spacing: -.025em !important;
}
body .sms-dual-code-values a {
    min-width: 58px !important;
    padding: 4px 7px !important;
}
body .sms-dual-code-values b {
    font-size: clamp(15px, 1.1vw, 20px) !important;
}
body .dashboard-region-program-list {
    gap: 10px !important;
    padding: 10px !important;
}
body .dashboard-region-program-group {
    padding: 9px !important;
    border-radius: 12px !important;
}
body .dashboard-region-program-card {
    min-height: 46px !important;
    padding: 8px 9px !important;
    border-radius: 10px !important;
}
body .dashboard-region-program-card span {
    font-size: 12.5px !important;
}
body .dashboard-region-program-card b {
    font-size: 11px !important;
    padding: 3px 8px !important;
}
@media (max-width: 900px) {
    body .main-content,
    body .main-content.expanded {
        margin-left: 0 !important;
    }
}

/* Dashboard SMS/Calls differentiated backgrounds */
body .dashboard-overview-box.dashboard-sms-overview-box {
  background: linear-gradient(180deg, #f5fbff 0%, #ffffff 78%) !important;
  border-color: #cfe6ff !important;
}

body .dashboard-overview-box.dashboard-sms-overview-box .overview-box-head {
  background: linear-gradient(90deg, #eef7ff 0%, #ffffff 100%) !important;
  border-bottom-color: #cfe6ff !important;
}

body .dashboard-overview-box.dashboard-calls-overview-box {
  background: linear-gradient(180deg, #f8fff9 0%, #ffffff 78%) !important;
  border-color: #ccefd7 !important;
}

body .dashboard-overview-box.dashboard-calls-overview-box .overview-box-head {
  background: linear-gradient(90deg, #effaf2 0%, #ffffff 100%) !important;
  border-bottom-color: #ccefd7 !important;
}

/* Header logo/avatar image visibility fix */
#header .logo-mark img,
#header .avatar-circle img {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

#header .logo-mark {
  width: 116px !important;
  height: 42px !important;
  flex: 0 0 116px !important;
  overflow: hidden !important;
}

#header .logo-mark img {
  width: 106px !important;
  height: 36px !important;
  object-fit: contain !important;
}

#header .avatar-circle {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px !important;
}

#header .avatar-circle img {
  width: 26px !important;
  height: 26px !important;
  object-fit: contain !important;
}

/* Profile image upload/profile avatar */
.profile-image-edit-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.profile-image-preview {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 1px solid #dbeafe;
  background: #eef5ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex: 0 0 52px;
}
.profile-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
#header .avatar-circle img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Profile edit two-column layout */
.sims-profile-panel {
  max-width: 980px;
  margin: 0 auto;
}
.sims-profile-form {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 20px;
  padding: 18px;
}
.sims-profile-form > [class*="col-"] {
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  padding: 0 !important;
}
.sims-profile-form input[disabled] {
  background: #f4f7fb !important;
  color: #64748b !important;
  cursor: not-allowed;
}
.sims-profile-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.sims-profile-actions .btn {
  min-width: 170px;
}
@media (max-width: 768px) {
  .sims-profile-form { grid-template-columns: 1fr; }
}

/* Profile password separate section */
.sims-profile-main-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 20px;
}
.sims-profile-image-field {
  grid-column: 1 / -1;
}
.sims-profile-password-box {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid #dbeafe;
  border-radius: 14px;
  background: #f8fbff;
}
.sims-profile-password-box .form-control {
  max-width: 460px;
}
@media (max-width: 768px) {
  .sims-profile-main-grid { grid-template-columns: 1fr; }
}

/* Profile page final three-card layout */
body .sims-profile-layout {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(280px, 1fr)) !important;
  gap: 30px !important;
  align-items: start !important;
  padding: 8px 14px 28px !important;
}

body .sims-profile-card {
  background: #ffffff !important;
  border: 1px solid #e3edf8 !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 38px rgba(15, 23, 42, .08) !important;
  padding: 28px 26px !important;
  min-height: 340px !important;
}

body .sims-profile-card h2 {
  margin: 0 0 18px !important;
  font-size: 22px !important;
  line-height: 1.25 !important;
  font-weight: 500 !important;
  color: #334155 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

body .sims-profile-card h2 i {
  color: #4f6fc4 !important;
  font-size: 21px !important;
}

body .sims-profile-card .form-label,
body .sims-profile-card label {
  display: block !important;
  margin: 14px 0 7px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #111827 !important;
}

body .sims-profile-card .form-control {
  width: 100% !important;
  height: 43px !important;
  border: 1px solid #cfdced !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  font-size: 14px !important;
}

body .sims-profile-card input[disabled] {
  background: #f2f4f7 !important;
  color: #64748b !important;
  cursor: not-allowed !important;
}

body .sims-profile-photo-card {
  text-align: center !important;
}

body .sims-profile-photo-card h2,
body .sims-profile-account-card h2,
body .sims-profile-password-card h2 {
  justify-content: flex-start !important;
}

body .sims-profile-photo-preview {
  width: 160px !important;
  height: 160px !important;
  border-radius: 50% !important;
  border: 3px solid #e5eaf2 !important;
  background: #f8fbff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  margin: 0 auto 22px !important;
}

body .sims-profile-photo-preview img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

body .sims-profile-photo-card .form-control {
  margin-bottom: 24px !important;
  text-align: left !important;
}

body .sims-profile-photo-btn,
body .sims-profile-password-btn {
  border: 0 !important;
  color: #fff !important;
  font-weight: 600 !important;
  border-radius: 9px !important;
  padding: 10px 18px !important;
  box-shadow: 0 12px 22px rgba(0, 0, 0, .12) !important;
}

body .sims-profile-photo-btn {
  background: #f59e0b !important;
}

body .sims-profile-password-btn {
  background: #ef4b3f !important;
  float: right !important;
  margin-top: 24px !important;
}

body .sims-profile-account-btn {
  float: right !important;
  margin-top: 24px !important;
  border-radius: 9px !important;
  padding: 10px 18px !important;
  font-weight: 600 !important;
  box-shadow: 0 12px 22px rgba(37, 99, 235, .14) !important;
}

@media (max-width: 1100px) {
  body .sims-profile-layout { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 760px) {
  body .sims-profile-layout { grid-template-columns: 1fr !important; }
}

/* Header profile shortcut beside logout */
.header-profile-btn {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #dbeafe;
  border-radius: 12px;
  background: #eef5ff;
  color: #2563eb;
  text-decoration: none;
  transition: .2s ease;
}
.header-profile-btn:hover {
  background: #dbeafe;
  color: #1d4ed8;
  text-decoration: none;
}
.header-actions .header-profile-btn + .header-logout-btn {
  margin-left: 6px;
}

/* Header profile: avatar/name is the profile link; no extra icon */
.header-profile-btn { display: none !important; }
.user-profile-link,
.user-profile-link:hover,
.user-profile-link:focus {
  text-decoration: none !important;
  color: inherit !important;
}
.user-dropdown .user-menu {
  min-width: 150px !important;
}

/* Profile edit icon inside user chip */
.user-profile-link {
  gap: 8px !important;
}
.user-profile-edit-icon {
  width: 28px;
  height: 28px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eef5ff;
  color: #2563eb;
  font-size: 13px;
  margin-left: 2px;
  border: 1px solid #dbeafe;
}
.user-profile-link:hover .user-profile-edit-icon {
  background: #2563eb;
  color: #fff;
}

/* Login page exact clean two-column layout */
body:has(.login-wrapper) {
  margin: 0 !important;
  min-height: 100vh !important;
  background: #eef4fb !important;
  color: #0f2647 !important;
  font-family: 'Poppins', Arial, sans-serif !important;
}
body:has(.login-wrapper) .login-wrapper {
  min-height: 100vh !important;
  display: grid !important;
  grid-template-columns: minmax(420px, 1fr) 560px !important;
  gap: 70px !important;
  align-items: center !important;
  padding: 28px 150px 48px 30px !important;
  background: #eef4fb !important;
}
body:has(.login-wrapper) .login-info {
  align-self: start !important;
  padding-top: 0 !important;
  max-width: 760px !important;
}
body:has(.login-wrapper) .login-info h1 {
  margin: 0 0 18px !important;
  font-size: 34px !important;
  line-height: 1.15 !important;
  font-weight: 400 !important;
  letter-spacing: .2px !important;
  color: #092247 !important;
}
body:has(.login-wrapper) .login-info .subtext {
  margin: 0 0 52px !important;
  font-size: 18px !important;
  line-height: 1.55 !important;
  color: #2f3f53 !important;
  max-width: 640px !important;
}
body:has(.login-wrapper) .info-item {
  display: grid !important;
  grid-template-columns: 58px 1fr !important;
  gap: 20px !important;
  align-items: center !important;
  margin: 0 0 36px !important;
}
body:has(.login-wrapper) .info-icon {
  width: 58px !important;
  height: 58px !important;
  border-radius: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .06) !important;
}
body:has(.login-wrapper) .info-icon i { font-size: 27px !important; }
body:has(.login-wrapper) .info-icon-blue { background: #dbeafe !important; color: #2563eb !important; }
body:has(.login-wrapper) .info-icon-green { background: #dcfce7 !important; color: #059669 !important; }
body:has(.login-wrapper) .info-icon-orange { background: #ffedd5 !important; color: #d97706 !important; }
body:has(.login-wrapper) .info-icon-cyan { background: #ccfbf1 !important; color: #0e7490 !important; }
body:has(.login-wrapper) .info-item h4 {
  margin: 0 0 4px !important;
  font-size: 23px !important;
  line-height: 1.25 !important;
  font-weight: 500 !important;
  color: #092247 !important;
}
body:has(.login-wrapper) .info-item p {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1.4 !important;
  color: #202f42 !important;
}
body:has(.login-wrapper) .login-panel {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}
body:has(.login-wrapper) .login-card {
  width: 525px !important;
  min-height: 480px !important;
  padding: 72px 50px 52px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 22px 48px rgba(15, 23, 42, .08) !important;
}
body:has(.login-wrapper) .login-card h2 {
  margin: 0 0 10px !important;
  font-size: 38px !important;
  line-height: 1.12 !important;
  font-weight: 400 !important;
  color: #0d274d !important;
}
body:has(.login-wrapper) .login-card > p {
  margin: 0 0 34px !important;
  font-size: 18px !important;
  color: #4b5563 !important;
}
body:has(.login-wrapper) .login-card .form-group { margin-bottom: 21px !important; }
body:has(.login-wrapper) .login-card label {
  margin-bottom: 8px !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  color: #0b1f3d !important;
}
body:has(.login-wrapper) .login-card .form-control {
  height: 43px !important;
  border: 1px solid #cfdced !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  padding: 9px 15px !important;
  font-size: 16px !important;
}
body:has(.login-wrapper) .password-field { position: relative !important; }
body:has(.login-wrapper) .password-field .form-control { padding-right: 46px !important; }
body:has(.login-wrapper) .password-toggle {
  position: absolute !important;
  right: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 30px !important;
  height: 30px !important;
  border: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
body:has(.login-wrapper) .login-card .btn-primary {
  height: 43px !important;
  margin-top: 4px !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: #2f65e8 !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  box-shadow: 0 14px 26px rgba(47, 101, 232, .18) !important;
}
@media (max-width: 1200px) {
  body:has(.login-wrapper) .login-wrapper {
    grid-template-columns: 1fr !important;
    padding: 30px !important;
    gap: 30px !important;
  }
  body:has(.login-wrapper) .login-info { max-width: none !important; }
  body:has(.login-wrapper) .login-card { width: min(525px, 100%) !important; }
}

/* Login page font-size final tuning */
body:has(.login-wrapper) .login-info h1 {
  font-size: 32px !important;
  font-weight: 400 !important;
}
body:has(.login-wrapper) .login-info .subtext {
  font-size: 16px !important;
  font-weight: 400 !important;
  margin-bottom: 46px !important;
}
body:has(.login-wrapper) .info-item h4 {
  font-size: 21px !important;
  font-weight: 500 !important;
}
body:has(.login-wrapper) .info-item p {
  font-size: 16px !important;
  font-weight: 400 !important;
}
body:has(.login-wrapper) .login-card h2 {
  font-size: 34px !important;
  font-weight: 400 !important;
}
body:has(.login-wrapper) .login-card > p {
  font-size: 16px !important;
  font-weight: 400 !important;
}
body:has(.login-wrapper) .login-card label {
  font-size: 15px !important;
  font-weight: 500 !important;
}
body:has(.login-wrapper) .login-card .form-control {
  font-size: 15px !important;
}
body:has(.login-wrapper) .login-card .btn-primary {
  font-size: 15px !important;
  font-weight: 500 !important;
}

/* Login page final spacing cleanup */
body:has(.login-wrapper) .login-wrapper {
  grid-template-columns: minmax(560px, 760px) minmax(460px, 525px) !important;
  gap: 90px !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 34px 64px 44px !important;
}
body:has(.login-wrapper) .login-info {
  align-self: center !important;
  max-width: 760px !important;
  padding-top: 0 !important;
}
body:has(.login-wrapper) .login-info .subtext {
  max-width: 650px !important;
  margin-bottom: 44px !important;
}
body:has(.login-wrapper) .info-item {
  grid-template-columns: 58px minmax(0, 620px) !important;
  gap: 20px !important;
  margin-bottom: 34px !important;
}
body:has(.login-wrapper) .info-item h4 {
  white-space: normal !important;
  max-width: 620px !important;
}
body:has(.login-wrapper) .info-item p {
  max-width: 620px !important;
}
body:has(.login-wrapper) .login-panel {
  justify-content: flex-start !important;
}
body:has(.login-wrapper) .login-card {
  width: 525px !important;
}
@media (min-width: 1500px) {
  body:has(.login-wrapper) .login-wrapper {
    grid-template-columns: 820px 525px !important;
    gap: 85px !important;
  }
}

/* Login page smaller typography */
body:has(.login-wrapper) .login-info h1 {
  font-size: 30px !important;
}
body:has(.login-wrapper) .login-info .subtext {
  font-size: 14px !important;
  line-height: 1.45 !important;
  max-width: 560px !important;
}
body:has(.login-wrapper) .info-item h4 {
  font-size: 19px !important;
  line-height: 1.22 !important;
}
body:has(.login-wrapper) .info-item p {
  font-size: 14.5px !important;
  line-height: 1.38 !important;
  max-width: 540px !important;
}
body:has(.login-wrapper) .login-card h2 {
  font-size: 31px !important;
}
body:has(.login-wrapper) .login-card > p {
  font-size: 14.5px !important;
  line-height: 1.4 !important;
}
body:has(.login-wrapper) .login-card label {
  font-size: 14px !important;
}
body:has(.login-wrapper) .login-card .form-control {
  font-size: 14px !important;
}
body:has(.login-wrapper) .login-card .btn-primary {
  font-size: 14.5px !important;
}

/* Dashboard top 5 programs last-24-hours card */
body .dashboard-top-programs-24h-card .dashboard-top-five-program-list {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 14px !important;
}
body .dashboard-top-five-program-card {
  min-height: 84px !important;
  padding: 12px !important;
  border: 1px solid #cfe2ff !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%) !important;
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr) auto !important;
  gap: 9px !important;
  align-items: center !important;
  color: #092247 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 22px rgba(37, 99, 235, .07) !important;
}
body .dashboard-top-five-program-card:hover {
  transform: translateY(-1px);
  border-color: #93c5fd !important;
  box-shadow: 0 14px 28px rgba(37, 99, 235, .12) !important;
}
body .dashboard-top-five-rank {
  width: 30px !important;
  height: 30px !important;
  border-radius: 10px !important;
  background: #eef5ff !important;
  color: #2563eb !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
}
body .dashboard-top-five-main {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
body .dashboard-top-five-main strong {
  font-size: 13.5px !important;
  line-height: 1.25 !important;
  font-weight: 600 !important;
  color: #0f2d5c !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}
body .dashboard-top-five-main small {
  font-size: 11.5px !important;
  line-height: 1.2 !important;
  color: #64748b !important;
}
body .dashboard-top-five-program-card b {
  min-width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  background: #dbeafe !important;
  color: #1d4ed8 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
@media (max-width: 1300px) {
  body .dashboard-top-programs-24h-card .dashboard-top-five-program-list { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 800px) {
  body .dashboard-top-programs-24h-card .dashboard-top-five-program-list { grid-template-columns: 1fr !important; }
}

/* View Call Records: use assigned region colors for nested date rows */
.call-record-date-row td {
  background: var(--region-bg, #eef5ff) !important;
}
.call-record-date-row.is-alt td {
  background: var(--region-bg, #eef5ff) !important;
}
.call-record-date-row span,
.call-record-date-row.is-alt span,
.call-record-date-row .call-date-topic-label {
  color: var(--region-fg, #0f62fe) !important;
}
.call-program-group-row td {
}
.call-region-group-row td {
  background: var(--region-bg, #eef5ff) !important;
}

/* Final province analytics cleanup */
html body .call-region-card > .call-control-title,
html body .sms-region-card > .call-control-title {
  display: none !important;
}
html body .call-sector-chart .call-category-total-row strong,
html body .call-sector-chart .call-category-total-row b,
html body .analytics-graph-modal-body .call-sector-chart .call-category-total-row strong,
html body .analytics-graph-modal-body .call-sector-chart .call-category-total-row b,
html body .report-builder-modal .call-sector-chart .call-category-total-row strong,
html body .report-builder-modal .call-sector-chart .call-category-total-row b {
  background: linear-gradient(180deg, #0b3a7a 0%, #061d4f 100%) !important;
  color: #ffffff !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.18) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14), 0 4px 12px rgba(8,36,92,.14) !important;
}
html body .call-sector-chart .call-category-total-row strong,
html body .analytics-graph-modal-body .call-sector-chart .call-category-total-row strong,
html body .report-builder-modal .call-sector-chart .call-category-total-row strong {
  text-transform: uppercase !important;
  font-weight: 600 !important;
}
html body .call-sector-chart .call-category-total-row b,
html body .analytics-graph-modal-body .call-sector-chart .call-category-total-row b,
html body .report-builder-modal .call-sector-chart .call-category-total-row b {
  font-weight: 600 !important;
}

/* Centered analytics controls: provinces, dates, and categories together */
html body .call-analytics-control-row {
  grid-template-columns: minmax(520px, 1.15fr) minmax(720px, 1.65fr) minmax(170px, .32fr) !important;
  align-items: stretch !important;
}
html body .call-region-card .call-analytics-subtabs,
html body .sms-region-card .sms-analytics-subtabs {
  grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
  gap: 8px !important;
}
html body .call-region-card .reports-subtab,
html body .sms-region-card .reports-subtab {
  height: 35px !important;
  font-size: 12px !important;
}
html body .call-filter-card .call-analytics-filter {
  grid-template-columns: minmax(190px, .9fr) minmax(180px, 1fr) minmax(180px, 1fr) auto !important;
  align-items: end !important;
}
html body .call-filter-help {
  grid-column: 1 / -1;
  margin: 0 0 4px !important;
  color: #385780;
  font-size: 12px;
  font-weight: 600;
}
html body .call-category-filter-inline {
  min-width: 0;
}
html body .call-category-filter-inline .call-sector-dropdown {
  width: 100%;
}
html body .call-category-filter-inline .call-sector-dropdown summary {
  min-width: 0 !important;
  width: 100% !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 6px 10px !important;
}
html body .call-category-filter-inline .call-sector-menu {
  right: auto !important;
  left: 0 !important;
}
html body .call-combined-pies-panel {
  padding-top: 0 !important;
}
html body .call-combined-pies-panel > .call-sector-select-form {
  display: none !important;
}
@media (max-width: 1500px) {
  html body .call-analytics-control-row {
    grid-template-columns: minmax(470px, 1fr) minmax(620px, 1.45fr) minmax(160px, .32fr) !important;
  }
  html body .call-region-card .call-analytics-subtabs,
  html body .sms-region-card .sms-analytics-subtabs {
    grid-template-columns: repeat(3, minmax(100px, 1fr)) !important;
  }
  html body .call-filter-card .call-analytics-filter {
    grid-template-columns: minmax(170px, .9fr) minmax(155px, 1fr) minmax(155px, 1fr) auto !important;
  }
}
@media (max-width: 1280px) {
  html body .call-analytics-control-row { grid-template-columns: 1fr !important; }
  html body .call-filter-card .call-analytics-filter { grid-template-columns: 1fr 1fr !important; }
  html body .call-filter-help { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  html body .call-region-card .call-analytics-subtabs,
  html body .sms-region-card .sms-analytics-subtabs,
  html body .call-filter-card .call-analytics-filter { grid-template-columns: 1fr !important; }
}

/* Remove duplicate blue report card spacing after side Reports card removal */
html body .call-analytics-control-row,
html body .sms-analytics-control-row {
  grid-template-columns: minmax(520px, 1.05fr) minmax(760px, 1.55fr) !important;
}
@media (max-width: 1280px) {
  html body .call-analytics-control-row,
  html body .sms-analytics-control-row { grid-template-columns: 1fr !important; }
}

/* Date filter instruction replaces the old Date Filters title */
html body .call-filter-help {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #06285f !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}
html body .call-filter-help i {
  color: #2563eb !important;
}

/* Top reports/analytics menus */
html body .reports-mode-header.reports-menu-header {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 12px !important;
}
html body .reports-menu-spacer { flex: 1 1 auto; }
html body .reports-menu-group {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}
html body .reports-menu {
  position: relative;
  z-index: 50;
}
html body .reports-menu summary {
  list-style: none;
  min-width: 132px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 14px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #fff;
  color: #06285f;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(8,36,92,.06);
}
html body .reports-menu summary::-webkit-details-marker { display: none; }
html body .reports-menu[open] summary,
html body .reports-menu summary:hover {
  background: #eff6ff;
  border-color: #60a5fa;
}
html body .reports-menu summary i:last-child {
  font-size: 11px;
  margin-left: 2px;
}
html body .reports-menu-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 180px;
  display: grid;
  gap: 7px;
  padding: 9px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 34px rgba(15, 42, 90, .16);
}
html body .reports-menu-item {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  border: 1px solid #dbeafe;
  border-radius: 7px;
  background: #f8fbff;
  color: #06285f;
  font: inherit;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  text-align: left;
}
html body .reports-menu-item:hover,
html body .reports-menu-item.is-active {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}
@media (max-width: 700px) {
  html body .reports-mode-header.reports-menu-header { justify-content: stretch !important; }
  html body .reports-menu-group { width: 100%; }
  html body .reports-menu { flex: 1; }
  html body .reports-menu summary { width: 100%; min-width: 0; }
}

/* Place Call/SMS menus on the left side */
html body .reports-mode-header.reports-menu-header {
  justify-content: flex-start !important;
}
html body .reports-menu-spacer {
  display: none !important;
}
html body .reports-menu-group {
  margin-left: 0 !important;
  margin-right: auto !important;
}
html body .reports-menu-panel {
  right: auto !important;
  left: 0 !important;
}

/* Move province tab card to the right side of the filters row */
html body .call-analytics-control-row,
html body .sms-analytics-control-row {
  grid-template-columns: minmax(760px, 1.55fr) minmax(520px, 1.05fr) !important;
}
html body .call-filter-card,
html body .sms-filter-card {
  order: 1 !important;
}
html body .call-region-card,
html body .sms-region-card {
  order: 2 !important;
}
@media (max-width: 1280px) {
  html body .call-analytics-control-row,
  html body .sms-analytics-control-row { grid-template-columns: 1fr !important; }
  html body .call-filter-card,
  html body .sms-filter-card,
  html body .call-region-card,
  html body .sms-region-card { order: initial !important; }
}

/* Province tabs belong on the Call/SMS header row */
html body .reports-analytics-page {
  position: relative !important;
}
html body .reports-mode-header.reports-menu-header {
  min-height: 98px !important;
  padding-right: 560px !important;
}
html body .call-region-card,
html body .sms-region-card {
  position: absolute !important;
  top: 12px !important;
  right: 16px !important;
  width: min(540px, calc(100% - 280px)) !important;
  z-index: 45 !important;
  order: initial !important;
}
html body .call-analytics-control-row,
html body .sms-analytics-control-row {
  grid-template-columns: 1fr !important;
}
html body .call-filter-card,
html body .sms-filter-card {
  order: initial !important;
  max-width: none !important;
}
@media (max-width: 980px) {
  html body .reports-mode-header.reports-menu-header {
    min-height: auto !important;
    padding-right: 12px !important;
    flex-wrap: wrap !important;
  }
  html body .call-region-card,
  html body .sms-region-card {
    position: static !important;
    width: 100% !important;
    margin: 8px 0 0 !important;
  }
}

/* Keep Call/SMS menus and province tabs in one header line */
html body .reports-mode-header.reports-menu-header {
  min-height: 70px !important;
  padding-right: 880px !important;
  align-items: center !important;
}
html body .call-region-card,
html body .sms-region-card {
  top: 12px !important;
  right: 16px !important;
  width: min(860px, calc(100% - 330px)) !important;
  padding: 8px 10px !important;
}
html body .call-region-card .call-analytics-subtabs,
html body .sms-region-card .sms-analytics-subtabs {
  grid-template-columns: repeat(6, minmax(82px, 1fr)) !important;
  gap: 6px !important;
}
html body .sms-region-card .sms-analytics-subtabs {
  grid-template-columns: repeat(7, minmax(74px, 1fr)) !important;
}
html body .call-region-card .reports-subtab,
html body .sms-region-card .reports-subtab {
  height: 32px !important;
  padding: 5px 8px !important;
  white-space: nowrap !important;
}
@media (max-width: 1300px) {
  html body .reports-mode-header.reports-menu-header { padding-right: 12px !important; min-height: auto !important; flex-wrap: wrap !important; }
  html body .call-region-card,
  html body .sms-region-card { position: static !important; width: 100% !important; }
}

/* Calls province tabs include Unknown at the end */
html body .call-region-card .call-analytics-subtabs {
  grid-template-columns: repeat(7, minmax(74px, 1fr)) !important;
}

/* Move province tabs back into the compact filter section */
html body .reports-mode-header.reports-menu-header {
  min-height: auto !important;
  padding-right: 12px !important;
  align-items: center !important;
}
html body .call-region-card,
html body .sms-region-card {
  position: static !important;
  top: auto !important;
  right: auto !important;
  width: 100% !important;
  margin: 0 0 8px !important;
  padding: 8px 10px !important;
  z-index: auto !important;
}
html body .call-analytics-control-row,
html body .sms-analytics-control-row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 10px !important;
}
html body .call-region-card .call-analytics-subtabs,
html body .sms-region-card .sms-analytics-subtabs {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(88px, 1fr)) !important;
  gap: 7px !important;
  margin: 0 !important;
}
html body .call-region-card .reports-subtab,
html body .sms-region-card .reports-subtab {
  height: 34px !important;
  padding: 6px 10px !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}
html body .call-filter-card,
html body .sms-filter-card {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  grid-template-columns: minmax(260px, .9fr) minmax(210px, 1fr) minmax(210px, 1fr) auto !important;
  gap: 8px !important;
}
@media (max-width: 1100px) {
  html body .call-region-card .call-analytics-subtabs,
  html body .sms-region-card .sms-analytics-subtabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  html body .call-filter-card .call-analytics-filter,
  html body .sms-filter-card .sms-analytics-filter {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media (max-width: 650px) {
  html body .call-region-card .call-analytics-subtabs,
  html body .sms-region-card .sms-analytics-subtabs,
  html body .call-filter-card .call-analytics-filter,
  html body .sms-filter-card .sms-analytics-filter {
    grid-template-columns: 1fr !important;
  }
}

/* Correct placement: province tabs stay in top row, filters move to the right beneath them */
html body .reports-analytics-page {
  position: relative !important;
}
html body .reports-mode-header.reports-menu-header {
  min-height: 70px !important;
  padding-right: 900px !important;
  align-items: center !important;
}
html body .call-region-card,
html body .sms-region-card {
  position: absolute !important;
  top: 12px !important;
  right: 16px !important;
  width: min(880px, calc(100% - 330px)) !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  z-index: 45 !important;
}
html body .call-region-card .call-analytics-subtabs,
html body .sms-region-card .sms-analytics-subtabs {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(74px, 1fr)) !important;
  gap: 7px !important;
  margin: 0 !important;
}
html body .call-analytics-control-row,
html body .sms-analytics-control-row {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: flex-start !important;
  margin-top: 10px !important;
  gap: 0 !important;
}
html body .call-filter-card,
html body .sms-filter-card {
  width: min(1180px, 100%) !important;
  max-width: calc(100% - 24px) !important;
  margin-left: auto !important;
  margin-right: 16px !important;
  order: initial !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  grid-template-columns: minmax(260px, .9fr) minmax(210px, 1fr) minmax(210px, 1fr) auto !important;
  gap: 8px !important;
}
@media (max-width: 1300px) {
  html body .reports-mode-header.reports-menu-header {
    min-height: auto !important;
    padding-right: 12px !important;
    flex-wrap: wrap !important;
  }
  html body .call-region-card,
  html body .sms-region-card {
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    margin-top: 8px !important;
  }
  html body .call-analytics-control-row,
  html body .sms-analytics-control-row { display: grid !important; grid-template-columns: 1fr !important; }
  html body .call-filter-card,
  html body .sms-filter-card { margin: 0 !important; max-width: none !important; }
}

/* Compact filter bar directly under province tabs */
html body .call-analytics-control-row,
html body .sms-analytics-control-row {
  margin-top: -2px !important;
  padding-right: 16px !important;
}
html body .call-filter-card,
html body .sms-filter-card {
  width: min(880px, calc(100% - 330px)) !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: 16px !important;
  padding: 8px 10px !important;
  min-height: 0 !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  grid-template-columns: minmax(180px, .9fr) minmax(150px, 1fr) minmax(150px, 1fr) auto !important;
  gap: 7px !important;
}
html body .call-filter-help {
  font-size: 11.5px !important;
  margin-bottom: 1px !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary,
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control,
html body .call-filter-card .btn,
html body .sms-filter-card .btn {
  height: 31px !important;
  min-height: 31px !important;
  font-size: 12px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary {
  padding-left: 9px !important;
  padding-right: 9px !important;
}
@media (max-width: 1300px) {
  html body .call-filter-card,
  html body .sms-filter-card { width: 100% !important; margin: 0 !important; }
}

/* Enclosed province/filter control box with compact aligned dates */
html body .call-region-card,
html body .sms-region-card {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom: 0 !important;
  box-shadow: 0 8px 20px rgba(15,42,90,.05) !important;
}
html body .call-analytics-control-row,
html body .sms-analytics-control-row {
  margin-top: 0 !important;
  padding-right: 0 !important;
}
html body .call-filter-card,
html body .sms-filter-card {
  width: min(880px, calc(100% - 330px)) !important;
  margin-right: 16px !important;
  margin-top: -1px !important;
  padding: 7px 10px 9px !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%) !important;
  box-shadow: 0 14px 28px rgba(15,42,90,.08) !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  grid-template-columns: minmax(210px, .85fr) minmax(250px, 1fr) minmax(250px, 1fr) auto !important;
  align-items: center !important;
  gap: 6px !important;
}
html body .call-filter-card .call-analytics-filter > div:not(.call-filter-help):not(.call-category-filter-inline):not(.call-analytics-filter-actions),
html body .sms-filter-card .sms-analytics-filter > div:not(.call-filter-help):not(.call-category-filter-inline):not(.call-analytics-filter-actions) {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 6px !important;
}
html body .call-filter-card .form-label,
html body .sms-filter-card .form-label {
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  text-align: right !important;
  white-space: nowrap !important;
}
html body .call-filter-help {
  margin-bottom: 0 !important;
  font-size: 11px !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary,
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control,
html body .call-filter-card .btn,
html body .sms-filter-card .btn {
  height: 32px !important;
  min-height: 32px !important;
}
html body .call-filter-card .call-analytics-filter-actions,
html body .sms-filter-card .call-analytics-filter-actions {
  gap: 6px !important;
}
@media (max-width: 1300px) {
  html body .call-filter-card,
  html body .sms-filter-card { width: 100% !important; margin-right: 0 !important; border-radius: 8px !important; }
  html body .call-region-card,
  html body .sms-region-card { border-radius: 8px !important; border-bottom: 1px solid #cfe2ff !important; }
}

/* Compact province and filter block without helper line */
html body .call-filter-help { display: none !important; }
html body .call-filter-card,
html body .sms-filter-card {
  padding: 8px 10px !important;
  margin-top: -2px !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  grid-template-columns: minmax(230px, .95fr) minmax(250px, 1fr) minmax(250px, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
}
html body .call-filter-card .call-analytics-filter > div:not(.call-category-filter-inline):not(.call-analytics-filter-actions),
html body .sms-filter-card .sms-analytics-filter > div:not(.call-category-filter-inline):not(.call-analytics-filter-actions) {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 6px !important;
}
html body .call-filter-card .form-label,
html body .sms-filter-card .form-label {
  text-align: right !important;
  font-weight: 800 !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary,
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control,
html body .call-filter-card .btn,
html body .sms-filter-card .btn {
  height: 34px !important;
  min-height: 34px !important;
}

/* Tighten compact filters so buttons stay inside the province/filter box */
html body .call-filter-card,
html body .sms-filter-card {
  width: min(880px, calc(100% - 330px)) !important;
  overflow: hidden !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  grid-template-columns: minmax(190px, 260px) minmax(165px, 210px) minmax(165px, 210px) minmax(150px, auto) !important;
  gap: 7px !important;
  width: 100% !important;
}
html body .call-filter-card .call-analytics-filter > div:not(.call-category-filter-inline):not(.call-analytics-filter-actions),
html body .sms-filter-card .sms-analytics-filter > div:not(.call-category-filter-inline):not(.call-analytics-filter-actions) {
  grid-template-columns: 38px minmax(0, 1fr) !important;
  min-width: 0 !important;
}
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control {
  min-width: 0 !important;
  width: 100% !important;
  font-size: 13px !important;
  padding-left: 9px !important;
  padding-right: 7px !important;
}
html body .call-filter-card .call-analytics-filter-actions,
html body .sms-filter-card .call-analytics-filter-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(68px, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
}
html body .call-filter-card .btn,
html body .sms-filter-card .btn {
  min-width: 0 !important;
  width: 100% !important;
  padding-left: 9px !important;
  padding-right: 9px !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary {
  min-width: 0 !important;
  font-size: 12px !important;
}
@media (max-width: 1450px) {
  html body .call-filter-card .call-analytics-filter,
  html body .sms-filter-card .sms-analytics-filter {
    grid-template-columns: minmax(180px, 240px) minmax(145px, 185px) minmax(145px, 185px) minmax(140px, auto) !important;
  }
}

/* Keep compact filter buttons fully inside the visible box */
html body .call-filter-card,
html body .sms-filter-card {
  width: min(820px, calc(100% - 360px)) !important;
  margin-right: 32px !important;
  overflow: visible !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  grid-template-columns: 230px 185px 185px 148px !important;
  justify-content: end !important;
  gap: 6px !important;
}
html body .call-filter-card .call-analytics-filter-actions,
html body .sms-filter-card .call-analytics-filter-actions {
  grid-template-columns: 70px 72px !important;
  gap: 6px !important;
}
html body .call-filter-card .btn,
html body .sms-filter-card .btn {
  font-size: 12px !important;
  padding-left: 7px !important;
  padding-right: 7px !important;
  white-space: nowrap !important;
}
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control {
  font-size: 12px !important;
}
@media (max-width: 1450px) {
  html body .call-filter-card,
  html body .sms-filter-card { width: min(780px, calc(100% - 350px)) !important; }
  html body .call-filter-card .call-analytics-filter,
  html body .sms-filter-card .sms-analytics-filter { grid-template-columns: 210px 170px 170px 146px !important; }
}
@media (max-width: 1300px) {
  html body .call-filter-card,
  html body .sms-filter-card { width: 100% !important; margin-right: 0 !important; }
  html body .call-filter-card .call-analytics-filter,
  html body .sms-filter-card .sms-analytics-filter { grid-template-columns: 1fr 1fr !important; justify-content: stretch !important; }
}

/* Exact compact one-line filter strip */
html body .call-filter-card,
html body .sms-filter-card {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-right: 32px !important;
  margin-left: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}
html body .call-category-filter-inline {
  width: 260px !important;
  flex: 0 0 260px !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary {
  width: 260px !important;
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 8px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}
html body .call-filter-card .call-analytics-filter > div:not(.call-category-filter-inline):not(.call-analytics-filter-actions),
html body .sms-filter-card .sms-analytics-filter > div:not(.call-category-filter-inline):not(.call-analytics-filter-actions) {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 0 !important;
}
html body .call-filter-card .form-label,
html body .sms-filter-card .form-label {
  margin: 0 !important;
  min-width: auto !important;
  color: #06285f !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-align: left !important;
}
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control {
  width: 150px !important;
  min-width: 150px !important;
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  padding: 8px 10px !important;
}
html body .call-filter-card .call-analytics-filter-actions,
html body .sms-filter-card .call-analytics-filter-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  min-width: 0 !important;
}
html body .call-filter-card .btn,
html body .sms-filter-card .btn {
  width: auto !important;
  min-width: 82px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
@media (max-width: 1100px) {
  html body .call-filter-card,
  html body .sms-filter-card { margin: 8px 0 0 !important; width: 100% !important; }
  html body .call-filter-card .call-analytics-filter,
  html body .sms-filter-card .sms-analytics-filter { flex-wrap: wrap !important; justify-content: flex-start !important; }
}

/* Attach the compact filter strip directly under the province tabs like the reference */
html body .call-analytics-control-row,
html body .sms-analytics-control-row {
  position: absolute !important;
  top: 82px !important;
  right: 16px !important;
  width: min(880px, calc(100% - 330px)) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  z-index: 44 !important;
}
html body .reports-mode-header.reports-menu-header {
  min-height: 126px !important;
  padding-right: 900px !important;
}
html body .call-filter-card,
html body .sms-filter-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid #cfe2ff !important;
  border-top: 0 !important;
  border-radius: 0 0 8px 8px !important;
  background: #fff !important;
  box-shadow: 0 12px 24px rgba(15, 42, 90, .08) !important;
  box-sizing: border-box !important;
}
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  width: 100% !important;
}
html body .call-category-filter-inline {
  width: 280px !important;
  flex: 0 0 280px !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary {
  width: 280px !important;
}
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control {
  width: 162px !important;
  min-width: 162px !important;
}
html body .call-filter-card .btn,
html body .sms-filter-card .btn {
  min-width: 86px !important;
}
@media (max-width: 1300px) {
  html body .reports-mode-header.reports-menu-header { min-height: auto !important; padding-right: 12px !important; }
  html body .call-analytics-control-row,
  html body .sms-analytics-control-row { position: static !important; width: 100% !important; margin-top: 8px !important; }
  html body .call-filter-card,
  html body .sms-filter-card { border-radius: 8px !important; border-top: 1px solid #cfe2ff !important; }
}


/* Final analytics header alignment: province tabs above one-line filters */
html body .reports-analytics-page { position: relative !important; }
html body .reports-mode-header.reports-menu-header { min-height: 148px !important; padding: 16px 12px !important; align-items: flex-start !important; justify-content: flex-start !important; }
html body .reports-menu-group { margin: 0 auto 0 0 !important; }
html body .call-analytics-control-row,
html body .sms-analytics-control-row { position: absolute !important; top: 16px !important; right: 18px !important; width: min(990px, calc(100% - 380px)) !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto auto !important; gap: 0 !important; margin: 0 !important; padding: 0 !important; z-index: 45 !important; }
html body .call-region-card,
html body .sms-region-card { position: static !important; inset: auto !important; order: 1 !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 8px 10px !important; border: 1px solid #cfe2ff !important; border-bottom: 0 !important; border-radius: 8px 8px 0 0 !important; background: rgba(248,251,255,.98) !important; box-shadow: 0 8px 20px rgba(15,42,90,.05) !important; z-index: auto !important; }
html body .call-filter-card,
html body .sms-filter-card { position: static !important; order: 2 !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 8px 10px !important; border: 1px solid #cfe2ff !important; border-top: 0 !important; border-radius: 0 0 8px 8px !important; background: #fff !important; box-shadow: 0 12px 24px rgba(15,42,90,.08) !important; box-sizing: border-box !important; overflow: visible !important; }
html body .call-region-card .call-analytics-subtabs,
html body .sms-region-card .sms-analytics-subtabs { display: grid !important; grid-template-columns: repeat(7, minmax(72px, 1fr)) !important; gap: 7px !important; width: 100% !important; margin: 0 !important; }
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter { display: flex !important; align-items: center !important; justify-content: flex-end !important; flex-wrap: nowrap !important; gap: 10px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; }
html body .call-category-filter-inline { flex: 0 1 280px !important; width: 280px !important; min-width: 220px !important; }
html body .call-category-filter-inline .call-sector-dropdown summary { width: 100% !important; }
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control { width: 150px !important; min-width: 140px !important; }
html body .call-filter-card .btn,
html body .sms-filter-card .btn { min-width: 78px !important; padding-inline: 12px !important; }
@media (max-width: 1300px) {
 html body .reports-mode-header.reports-menu-header { min-height: auto !important; padding: 10px 12px !important; flex-wrap: wrap !important; }
 html body .call-analytics-control-row,
 html body .sms-analytics-control-row { position: static !important; width: 100% !important; margin: 8px 0 12px !important; }
 html body .call-filter-card .call-analytics-filter,
 html body .sms-filter-card .sms-analytics-filter { flex-wrap: wrap !important; justify-content: flex-start !important; }
}

/* Equal-width filter row and standard SLIMS category dropdown */
html body .call-filter-card .call-analytics-filter,
html body .sms-filter-card .sms-analytics-filter {
  display: grid !important;
  grid-template-columns: minmax(230px, 1.45fr) minmax(210px, 1fr) minmax(210px, 1fr) auto !important;
  align-items: center !important;
  justify-content: stretch !important;
  gap: 10px !important;
  width: 100% !important;
}
html body .call-category-filter-inline {
  width: 100% !important;
  min-width: 0 !important;
  flex: none !important;
}
html body .call-category-filter-inline .call-sector-dropdown,
html body .call-category-filter-inline .call-sector-dropdown summary {
  width: 100% !important;
  min-width: 0 !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary {
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 12px !important;
  border: 1px solid #d8e3f2 !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #12345a !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary i,
html body .call-category-filter-inline .call-sector-dropdown summary span,
html body .call-category-filter-inline .call-sector-dropdown summary::after {
  color: #2563eb !important;
}
html body .call-category-filter-inline .call-sector-dropdown summary b {
  background: #eef5ff !important;
  border: 1px solid #bfdbfe !important;
  color: #2563eb !important;
}
html body .call-filter-card .call-analytics-filter > div:not(.call-category-filter-inline):not(.call-analytics-filter-actions),
html body .sms-filter-card .sms-analytics-filter > div:not(.call-category-filter-inline):not(.call-analytics-filter-actions) {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
}
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control {
  width: 100% !important;
  min-width: 0 !important;
}
html body .call-filter-card .call-analytics-filter-actions,
html body .sms-filter-card .call-analytics-filter-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(78px, auto)) !important;
  gap: 8px !important;
}
@media (max-width: 1300px) {
  html body .call-filter-card .call-analytics-filter,
  html body .sms-filter-card .sms-analytics-filter {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Normal font weight for province tabs and analytics filters */
html body .call-region-card .reports-subtab,
html body .sms-region-card .reports-subtab,
html body .call-filter-card .form-label,
html body .sms-filter-card .form-label,
html body .call-filter-card .form-control,
html body .sms-filter-card .form-control,
html body .call-filter-card .btn,
html body .sms-filter-card .btn,
html body .call-category-filter-inline .call-sector-dropdown summary,
html body .call-category-filter-inline .call-sector-dropdown summary span,
html body .call-category-filter-inline .call-sector-dropdown summary b {
  font-weight: 400 !important;
}

/* Call report builder: four percentage pies per row with include/exclude audit */
.pie-report-audit { display: none; }
.report-builder-modal:not(.is-sms-builder) .call-percentage-chart .call-donut-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  min-height: 0 !important;
}
.report-builder-modal:not(.is-sms-builder) .call-percentage-chart .call-donut-card {
  position: relative !important;
  min-height: 150px !important;
  padding: 28px 8px 8px !important;
}
.report-builder-modal:not(.is-sms-builder) .call-percentage-chart .pie-report-audit {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 8;
  display: flex;
  align-items: center;
  gap: 4px;
}
.pie-report-audit-btn {
  width: 24px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 1px solid #cfe0f6;
  border-radius: 6px;
  background: #fff;
  color: #64748b;
  cursor: pointer;
}
.pie-report-audit-btn.is-included {
  border-color: #86efac;
  background: #ecfdf5;
  color: #059669;
}
.pie-report-audit-btn.is-excluded {
  border-color: #fecaca;
  background: #fff1f2;
  color: #dc2626;
}
.report-builder-modal:not(.is-sms-builder) .call-donut-card.is-report-excluded {
  min-height: 54px !important;
  border-style: dashed !important;
  background: #f8fafc !important;
  opacity: .8;
}
.report-builder-modal:not(.is-sms-builder) .call-donut-card.is-report-excluded > h3,
.report-builder-modal:not(.is-sms-builder) .call-donut-card.is-report-excluded > strong,
.report-builder-modal:not(.is-sms-builder) .call-donut-card.is-report-excluded > .call-donut,
.report-builder-modal:not(.is-sms-builder) .call-donut-card.is-report-excluded > p {
  display: none !important;
}
@media print {
  .pie-report-audit,
  .report-builder-modal:not(.is-sms-builder) .call-donut-card.is-report-excluded {
    display: none !important;
  }
}
@media (max-width: 1100px) {
  .report-builder-modal:not(.is-sms-builder) .call-percentage-chart .call-donut-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Report builder draft and final report actions */
.report-export-box{overflow:visible!important}.report-export-icon.is-draft{border-color:#bfdbfe!important;background:#eff6ff!important;color:#1d4ed8!important}.report-generate-menu{position:relative}.report-generate-menu>summary{list-style:none}.report-generate-menu>summary::-webkit-details-marker{display:none}.report-generate-trigger{min-height:52px;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid #86efac;border-radius:8px;background:#ecfdf5;color:#047857;font-size:12px;font-weight:600;cursor:pointer}.report-generate-options{position:absolute;top:calc(100% + 6px);right:0;z-index:90;min-width:150px;display:grid;gap:5px;padding:7px;border:1px solid #cfe1ff;border-radius:8px;background:#fff;box-shadow:0 14px 30px rgba(8,36,92,.16)}.report-generate-options button{min-height:38px;display:flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid #d8e6fb;border-radius:7px;background:#f8fbff;color:#08245c;cursor:pointer}.report-generate-options button:hover{background:#eef6ff;border-color:#93c5fd}

/* Compact report actions matching the Add Row / Undo button shape */
.report-row-controls .report-toolbar-actions{display:inline-flex;align-items:center;gap:8px;margin-left:4px}.report-row-controls .report-toolbar-actions .report-export-icon,.report-row-controls .report-toolbar-actions .report-generate-trigger{width:auto!important;min-width:0!important;height:38px!important;min-height:38px!important;display:inline-flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:7px!important;padding:7px 12px!important;border-radius:8px!important;font-size:12px!important;font-weight:600!important;line-height:1!important;box-shadow:none!important;white-space:nowrap!important}.report-row-controls .report-toolbar-actions .report-export-icon i,.report-row-controls .report-toolbar-actions .report-generate-trigger i{font-size:13px!important}.report-row-controls .report-toolbar-actions .is-draft{border:1px solid #93c5fd!important;background:#eff6ff!important;color:#1d4ed8!important}.report-row-controls .report-toolbar-actions .is-draft i{color:#2563eb!important}.report-row-controls .report-toolbar-actions .is-save{border:1px solid #86efac!important;background:#ecfdf5!important;color:#047857!important}.report-row-controls .report-toolbar-actions .is-save i{color:#059669!important}.report-row-controls .report-toolbar-actions .report-generate-trigger{border:1px solid #c4b5fd!important;background:#f5f3ff!important;color:#6d28d9!important}.report-row-controls .report-toolbar-actions .report-generate-trigger i{color:#7c3aed!important}.report-row-controls .report-toolbar-actions button:hover,.report-row-controls .report-toolbar-actions .report-generate-trigger:hover{filter:brightness(.98);box-shadow:0 4px 10px rgba(8,36,92,.08)!important}

/* Keep report drop rows directly below the Preview Canvas label */
html body .report-builder-modal [data-report-canvas].report-builder-preview,
html body .report-builder-modal.is-server-rendered [data-report-canvas].report-builder-preview{min-height:0!important;height:auto!important;padding:8px!important;display:grid!important;align-content:start!important;align-items:start!important;justify-content:stretch!important;grid-auto-rows:max-content!important;row-gap:8px!important}
html body .report-builder-modal [data-report-canvas].report-builder-preview::before,
html body .report-builder-modal.is-server-rendered [data-report-canvas].report-builder-preview::before{margin:0 0 4px!important;align-self:start!important}
html body .report-builder-modal .report-drop-row,
html body .report-builder-modal.is-server-rendered .report-drop-row,
html body .report-builder-modal .report-drop-row.is-active-page,
html body .report-builder-modal.is-server-rendered .report-drop-row.is-active-page{margin:0!important;align-self:start!important;min-height:0!important}


.report-generate-menu.is-disabled .report-generate-trigger{opacity:.48;cursor:not-allowed;pointer-events:none}
.report-saved-modal{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:20px;background:rgba(5,25,60,.36);backdrop-filter:blur(2px)}
.report-saved-card{width:min(390px,calc(100vw - 32px));display:grid;justify-items:center;gap:14px;padding:28px;border:1px solid #bfdbfe;border-radius:8px;background:#fff;box-shadow:0 22px 60px rgba(8,36,92,.24);text-align:center}
.report-saved-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#dcfce7;color:#059669;font-size:22px}
.report-saved-card h3{margin:0;color:#08245c;font-size:16px;font-weight:600}
.report-saved-card button{min-width:92px;min-height:38px;border:1px solid #2563eb;border-radius:7px;background:#2563eb;color:#fff;font:inherit;cursor:pointer}
/* Report inclusion controls never hide or alter analytics content on screen. */
.report-builder-modal .is-report-excluded,
.report-builder-modal [data-report-excluded="1"]{opacity:1!important;text-decoration:none!important;background:inherit!important}
.report-builder-modal .call-donut-card.is-report-excluded,
.report-builder-modal .call-donut-card[data-report-excluded="1"]{min-height:0!important;border-style:solid!important}
.report-builder-modal .call-donut-card.is-report-excluded>h3,
.report-builder-modal .call-donut-card[data-report-excluded="1"]>h3,
.report-builder-modal .call-donut-card.is-report-excluded>strong,
.report-builder-modal .call-donut-card[data-report-excluded="1"]>strong,
.report-builder-modal .call-donut-card.is-report-excluded>.call-donut,
.report-builder-modal .call-donut-card[data-report-excluded="1"]>.call-donut,
.report-builder-modal .call-donut-card.is-report-excluded>p,
.report-builder-modal .call-donut-card[data-report-excluded="1"]>p{display:block!important}
.report-builder-modal .report-builder-audit-table tr[data-report-excluded="1"] td:not(.report-audit-cell){opacity:1!important;text-decoration:none!important}
.report-export-icon.is-preview{border-color:#fbbf24!important;background:#fffbeb!important;color:#b45309!important}
.report-preview-modal{position:fixed;inset:0;z-index:10040;display:grid;place-items:center;padding:18px;background:rgba(5,25,60,.48);backdrop-filter:blur(2px)}
.report-preview-card{width:min(1500px,calc(100vw - 36px));height:calc(100vh - 36px);display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;border:1px solid #bfdbfe;border-radius:8px;background:#fff;box-shadow:0 24px 70px rgba(8,36,92,.28)}
.report-preview-toolbar{min-height:52px;display:flex;align-items:center;justify-content:space-between;padding:8px 14px;border-bottom:1px solid #d8e6fb;background:#f8fbff}
.report-preview-toolbar h3{margin:0;color:#08245c;font-size:16px;font-weight:600}
.report-preview-close{width:36px;height:36px;display:grid;place-items:center;border:1px solid #fecaca;border-radius:50%;background:#fff1f2;color:#dc2626;cursor:pointer}
.report-preview-frame{width:100%;height:100%;border:0;background:#fff}
/* Report builder grouped Pakistan/province palette */
.report-builder-palette-groups {
  display: grid !important;
  gap: 8px !important;
}
.report-builder-palette-group {
  width: 100% !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background: #ffffff !important;
}
.report-builder-palette-group > summary {
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 8px 10px !important;
  cursor: pointer !important;
  list-style: none !important;
  background: #eef6ff !important;
  color: #08245c !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}
.report-builder-palette-group > summary::-webkit-details-marker {
  display: none !important;
}
.report-builder-palette-group > summary i {
  color: #1d64d8 !important;
  font-size: 11px !important;
  transition: transform .18s ease !important;
}
.report-builder-palette-group[open] > summary i {
  transform: rotate(180deg) !important;
}
.report-builder-palette-group[open] > summary {
  border-bottom: 1px solid #cfe1ff !important;
  background: #e6f1ff !important;
}
.report-builder-palette-group-items {
  display: grid !important;
  gap: 6px !important;
  padding: 8px !important;
}
.report-builder-palette-group-items .report-builder-palette-item {
  min-height: 40px !important;
  border-radius: 6px !important;
  font-weight: 500 !important;
}

/* Wider report palette without an internal scrollbar */
.report-builder-modal.is-server-rendered .report-builder-workspace {
  grid-template-columns: minmax(310px, 330px) minmax(0, 1fr) !important;
  align-items: start !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette,
.report-builder-palette {
  width: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  position: static !important;
}
.report-builder-palette-group-items .report-builder-palette-item span {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
.report-builder-modal.is-server-rendered .report-builder-card {
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
@media (max-width: 1100px) {
  .report-builder-modal.is-server-rendered .report-builder-workspace {
    grid-template-columns: 1fr !important;
  }
}

/* Report builder: province groups on top, action toolbar on the left */
.report-builder-modal.is-server-rendered .report-builder-workspace {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 12px !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  padding: 8px !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-groups {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(110px, 1fr)) !important;
  gap: 8px !important;
  align-items: start !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-group {
  position: relative !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-group > summary {
  min-height: 42px !important;
  border-radius: 7px !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-group-items {
  position: absolute !important;
  z-index: 80 !important;
  top: calc(100% + 5px) !important;
  left: 0 !important;
  width: min(310px, 82vw) !important;
  max-height: 55vh !important;
  overflow-y: auto !important;
  padding: 8px !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 16px 34px rgba(8, 36, 92, .18) !important;
}
.report-builder-modal.is-server-rendered .report-builder-canvas-wrap {
  grid-column: 1 !important;
  grid-row: 2 !important;
  display: grid !important;
  grid-template-columns: 250px minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 12px !important;
  min-width: 0 !important;
  align-items: start !important;
}
.report-builder-modal.is-server-rendered .report-row-controls {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 10px !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 8px !important;
  background: #f7fbff !important;
}
.report-builder-modal.is-server-rendered .report-row-controls > button,
.report-builder-modal.is-server-rendered .report-toolbar-actions,
.report-builder-modal.is-server-rendered .report-toolbar-actions > button,
.report-builder-modal.is-server-rendered .report-toolbar-actions > details {
  width: 100% !important;
}
.report-builder-modal.is-server-rendered .report-toolbar-actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  margin: 0 !important;
}
.report-builder-modal.is-server-rendered .report-export-icon,
.report-builder-modal.is-server-rendered .report-generate-trigger {
  justify-content: flex-start !important;
  min-height: 40px !important;
}
.report-builder-modal.is-server-rendered .report-row-pagination {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 2px 0 0 !important;
}
.report-builder-modal.is-server-rendered .report-builder-templates {
  display: none !important;
}
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: calc(94vh - 215px) !important;
  max-height: calc(94vh - 215px) !important;
}
@media (max-width: 1100px) {
  .report-builder-modal.is-server-rendered .report-builder-palette-groups {
    grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
  }
}
@media (max-width: 760px) {
  .report-builder-modal.is-server-rendered .report-builder-palette-groups,
  .report-builder-modal.is-server-rendered .report-builder-canvas-wrap {
    grid-template-columns: 1fr !important;
  }
  .report-builder-modal.is-server-rendered .report-row-controls,
  .report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
    grid-column: 1 !important;
  }
  .report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
    grid-row: 2 !important;
    max-height: none !important;
  }
}

/* Final report builder shuffle: actions left, regions right, canvas below */
.report-builder-modal.is-server-rendered .report-builder-workspace {
  display: grid !important;
  grid-template-columns: minmax(620px, auto) minmax(680px, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 10px !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .report-builder-canvas-wrap {
  display: contents !important;
}
.report-builder-modal.is-server-rendered .report-row-controls {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 58px !important;
  padding: 8px 10px !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 8px !important;
  background: #f7fbff !important;
}
.report-builder-modal.is-server-rendered .report-row-controls > button,
.report-builder-modal.is-server-rendered .report-toolbar-actions > button,
.report-builder-modal.is-server-rendered .report-toolbar-actions > details {
  width: auto !important;
  flex: 0 0 auto !important;
}
.report-builder-modal.is-server-rendered .report-toolbar-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  margin: 0 !important;
}
.report-builder-modal.is-server-rendered .report-export-icon,
.report-builder-modal.is-server-rendered .report-generate-trigger {
  justify-content: center !important;
  min-height: 40px !important;
}
.report-builder-modal.is-server-rendered .report-row-pagination {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: auto !important;
  margin: 0 0 0 auto !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-height: 58px !important;
  padding: 8px !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 8px !important;
  background: #f7fbff !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-groups {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(92px, 1fr)) !important;
  gap: 7px !important;
  width: 100% !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-group > summary {
  min-height: 40px !important;
  padding: 7px 9px !important;
}
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  min-height: calc(94vh - 215px) !important;
  max-height: calc(94vh - 215px) !important;
}
@media (max-width: 1450px) {
  .report-builder-modal.is-server-rendered .report-builder-workspace {
    grid-template-columns: 1fr !important;
  }
  .report-builder-modal.is-server-rendered .report-row-controls,
  .report-builder-modal.is-server-rendered .report-builder-palette,
  .report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
    grid-column: 1 !important;
  }
  .report-builder-modal.is-server-rendered .report-row-controls { grid-row: 1 !important; }
  .report-builder-modal.is-server-rendered .report-builder-palette { grid-row: 2 !important; }
  .report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview { grid-row: 3 !important; }
}
@media (max-width: 850px) {
  .report-builder-modal.is-server-rendered .report-row-controls {
    flex-wrap: wrap !important;
  }
  .report-builder-modal.is-server-rendered .report-builder-palette-groups {
    grid-template-columns: repeat(2, minmax(120px, 1fr)) !important;
  }
}

/* Restored neat report builder layout */
.report-builder-modal.is-server-rendered .report-builder-workspace {
  display: grid !important;
  grid-template-columns: 320px minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 12px !important;
  overflow: visible !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 320px !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 10px !important;
  position: static !important;
  overflow: visible !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 8px !important;
  background: #f7fbff !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-groups {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-group {
  position: static !important;
  width: 100% !important;
  overflow: hidden !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-group > summary {
  min-height: 44px !important;
  padding: 9px 11px !important;
}
.report-builder-modal.is-server-rendered .report-builder-palette-group-items {
  position: static !important;
  width: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.report-builder-modal.is-server-rendered .report-builder-canvas-wrap {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 10px !important;
  min-width: 0 !important;
}
.report-builder-modal.is-server-rendered .report-row-controls {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 58px !important;
  padding: 8px 10px !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 8px !important;
  background: #f7fbff !important;
}
.report-builder-modal.is-server-rendered .report-row-controls > button,
.report-builder-modal.is-server-rendered .report-toolbar-actions > button,
.report-builder-modal.is-server-rendered .report-toolbar-actions > details {
  width: auto !important;
  flex: 0 0 auto !important;
}
.report-builder-modal.is-server-rendered .report-toolbar-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  margin: 0 !important;
}
.report-builder-modal.is-server-rendered .report-row-pagination {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: auto !important;
  margin-left: auto !important;
}
.report-builder-modal.is-server-rendered .report-builder-list.report-builder-preview {
  grid-column: 1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: calc(94vh - 215px) !important;
  max-height: calc(94vh - 215px) !important;
}
@media (max-width: 900px) {
  .report-builder-modal.is-server-rendered .report-builder-workspace {
    grid-template-columns: 1fr !important;
  }
  .report-builder-modal.is-server-rendered .report-builder-palette,
  .report-builder-modal.is-server-rendered .report-builder-canvas-wrap {
    grid-column: 1 !important;
    width: 100% !important;
  }
  .report-builder-modal.is-server-rendered .report-builder-palette { grid-row: 1 !important; }
  .report-builder-modal.is-server-rendered .report-builder-canvas-wrap { grid-row: 2 !important; }
}

/* Dashboard SMS and Calls cards differentiated colors */
body .dashboard-sms-overview-box .sims-metric-card:nth-child(1),
body .dashboard-sms-overview-box .dashboard-sms-summary-grid > *:nth-child(1) {
  background: linear-gradient(135deg, #eef6ff 0%, #ffffff 100%) !important;
  border-color: #bfdbfe !important;
}
body .dashboard-sms-overview-box .sims-metric-card:nth-child(2),
body .dashboard-sms-overview-box .dashboard-sms-summary-grid > *:nth-child(2) {
  background: linear-gradient(135deg, #f0fdfa 0%, #ffffff 100%) !important;
  border-color: #99f6e4 !important;
}
body .dashboard-sms-overview-box .sims-metric-card:nth-child(3),
body .dashboard-sms-overview-box .dashboard-sms-summary-grid > *:nth-child(3) {
  background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%) !important;
  border-color: #93c5fd !important;
}
body .dashboard-sms-overview-box .sims-metric-card:nth-child(4),
body .dashboard-sms-overview-box .dashboard-sms-summary-grid > *:nth-child(4) {
  background: linear-gradient(135deg, #faf5ff 0%, #ffffff 100%) !important;
  border-color: #d8b4fe !important;
}
body .dashboard-sms-overview-box .sims-metric-card:nth-child(5),
body .dashboard-sms-overview-box .dashboard-sms-summary-grid > *:nth-child(5) {
  background: linear-gradient(135deg, #fff7ed 0%, #ffffff 100%) !important;
  border-color: #fed7aa !important;
}

body .dashboard-calls-overview-box .dashboard-call-metric-grid > .sims-metric-card:nth-child(1) {
  background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 100%) !important;
  border-color: #bbf7d0 !important;
}
body .dashboard-calls-overview-box .dashboard-call-metric-grid > .sims-metric-card:nth-child(2) {
  background: linear-gradient(135deg, #ecfeff 0%, #ffffff 100%) !important;
  border-color: #a5f3fc !important;
}
body .dashboard-calls-overview-box .dashboard-top-programs-24h-card {
  background: linear-gradient(135deg, #fff7ed 0%, #ffffff 72%) !important;
  border-color: #fed7aa !important;
}
body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(1) {
  background: linear-gradient(135deg, #fff7ed 0%, #ffffff 100%) !important;
  border-color: #fdba74 !important;
}
body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(2) {
  background: linear-gradient(135deg, #fef2f2 0%, #ffffff 100%) !important;
  border-color: #fecaca !important;
}
body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(3) {
  background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 100%) !important;
  border-color: #bbf7d0 !important;
}
body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(4) {
  background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%) !important;
  border-color: #bfdbfe !important;
}
body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(5) {
  background: linear-gradient(135deg, #faf5ff 0%, #ffffff 100%) !important;
  border-color: #ddd6fe !important;
}

/* Dashboard subtle section identity: SMS vs Calls */
body .dashboard-sms-overview-box {
  background: linear-gradient(180deg, #f4f9ff 0%, #ffffff 100%) !important;
  border-color: #bfdbfe !important;
}
body .dashboard-sms-overview-box .overview-box-head {
  background: #eaf4ff !important;
  border-bottom-color: #bfdbfe !important;
}
body .dashboard-sms-overview-box .overview-box-head h2,
body .dashboard-sms-overview-box .overview-box-head h2 i {
  color: #1d4ed8 !important;
}
body .dashboard-sms-overview-box .sims-metric-card,
body .dashboard-sms-overview-box .dashboard-category-table-card {
  background: #ffffff !important;
  border-color: #cfe2ff !important;
}
body .dashboard-sms-overview-box .sims-metric-card:nth-child(odd) {
  box-shadow: inset 4px 0 0 #60a5fa, 0 10px 24px rgba(37, 99, 235, .06) !important;
}
body .dashboard-sms-overview-box .sims-metric-card:nth-child(even) {
  box-shadow: inset 4px 0 0 #8b5cf6, 0 10px 24px rgba(37, 99, 235, .06) !important;
}

body .dashboard-calls-overview-box {
  background: linear-gradient(180deg, #f4fff8 0%, #ffffff 100%) !important;
  border-color: #bbf7d0 !important;
}
body .dashboard-calls-overview-box .overview-box-head {
  background: #ecfdf3 !important;
  border-bottom-color: #bbf7d0 !important;
}
body .dashboard-calls-overview-box .overview-box-head h2,
body .dashboard-calls-overview-box .overview-box-head h2 i {
  color: #047857 !important;
}
body .dashboard-calls-overview-box .sims-metric-card,
body .dashboard-calls-overview-box .dashboard-category-table-card {
  background: #ffffff !important;
  border-color: #ccefd7 !important;
}
body .dashboard-calls-overview-box .sims-metric-card:nth-child(odd),
body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(odd) {
  box-shadow: inset 4px 0 0 #10b981, 0 10px 24px rgba(16, 185, 129, .06) !important;
}
body .dashboard-calls-overview-box .sims-metric-card:nth-child(even),
body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(even) {
  box-shadow: inset 4px 0 0 #f59e0b, 0 10px 24px rgba(16, 185, 129, .06) !important;
}

/* Dashboard final identity colors: SMS blue only, Calls green only */
body .dashboard-sms-overview-box {
  background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%) !important;
  border-color: #bfdbfe !important;
}
body .dashboard-sms-overview-box .overview-box-head {
  background: #dbeafe !important;
  border-bottom-color: #bfdbfe !important;
}
body .dashboard-sms-overview-box .overview-box-head h2,
body .dashboard-sms-overview-box .overview-box-head h2 i {
  color: #1d4ed8 !important;
}
body .dashboard-sms-overview-box .sims-metric-card,
body .dashboard-sms-overview-box .dashboard-category-table-card {
  background: linear-gradient(135deg, #f8fbff 0%, #ffffff 100%) !important;
  border-color: #bfdbfe !important;
  box-shadow: inset 4px 0 0 #3b82f6, 0 10px 24px rgba(59, 130, 246, .06) !important;
}
body .dashboard-sms-overview-box .sims-metric-card:nth-child(even) {
  box-shadow: inset 4px 0 0 #60a5fa, 0 10px 24px rgba(59, 130, 246, .06) !important;
}
body .dashboard-sms-overview-box .sims-metric-icon,
body .dashboard-sms-overview-box .dashboard-code-icon {
  background: #dbeafe !important;
  color: #2563eb !important;
}

body .dashboard-calls-overview-box {
  background: linear-gradient(180deg, #f0fdf4 0%, #ffffff 100%) !important;
  border-color: #bbf7d0 !important;
}
body .dashboard-calls-overview-box .overview-box-head {
  background: #dcfce7 !important;
  border-bottom-color: #bbf7d0 !important;
}
body .dashboard-calls-overview-box .overview-box-head h2,
body .dashboard-calls-overview-box .overview-box-head h2 i {
  color: #047857 !important;
}
body .dashboard-calls-overview-box .sims-metric-card,
body .dashboard-calls-overview-box .dashboard-category-table-card,
body .dashboard-calls-overview-box .dashboard-top-five-program-card {
  background: linear-gradient(135deg, #f8fff9 0%, #ffffff 100%) !important;
  border-color: #bbf7d0 !important;
  box-shadow: inset 4px 0 0 #10b981, 0 10px 24px rgba(16, 185, 129, .06) !important;
}
body .dashboard-calls-overview-box .sims-metric-card:nth-child(even),
body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(even) {
  box-shadow: inset 4px 0 0 #34d399, 0 10px 24px rgba(16, 185, 129, .06) !important;
}
body .dashboard-calls-overview-box .sims-metric-icon,
body .dashboard-calls-overview-box .dashboard-top-five-rank,
body .dashboard-calls-overview-box .dashboard-top-five-program-card b {
  background: #dcfce7 !important;
  color: #059669 !important;
}

/* View Call Records: region parent + indented program rows */
.call-record-list-table .call-region-group-row .call-group-toggle,
.call-record-list-table .call-program-group-row .call-group-toggle {
  background: var(--region-fg, #2563eb) !important;
  color: #fff !important;
  border: 1px solid var(--region-fg, #2563eb) !important;
  box-shadow: none !important;
}
.call-record-list-table .call-program-group-row td {
  padding-left: 42px !important;
}
.call-record-list-table .call-program-group-row .call-group-toggle {
  width: 22px !important;
  height: 22px !important;
  border-radius: 999px !important;
}
.call-record-list-table .call-program-group-row .call-group-toggle i {
  font-size: 11px !important;
}

/* Caller location province badge */
.video-call-record-form .call-caller-location .location-correction-hint {
    display: inline-block;
    margin-top: 6px;
    color: #334155;
    font-size: 12px;
    line-height: 1.4;
}
.video-call-record-form .call-caller-location .call-province-badge {
    display: none;
    align-items: center;
    width: max-content;
    margin: 6px 0 0 8px;
    padding: 3px 10px;
    border: 1px solid #93c5fd;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
    vertical-align: top;
    box-shadow: 0 1px 2px rgba(37, 99, 235, .12);
}
/* View Call Records dynamic caller-location feedback */
.call-location-filter-field .location-correction-hint {
    display: inline-block;
    margin-top: 6px;
    color: #334155;
    font-size: 12px;
    line-height: 1.4;
}
.call-location-filter-field .call-province-badge {
    display: none;
    align-items: center;
    width: max-content;
    margin: 6px 0 0 8px;
    padding: 3px 10px;
    border: 1px solid #93c5fd;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
    vertical-align: top;
    box-shadow: 0 1px 2px rgba(37, 99, 235, .12);
}
/* View Call Records filter alignment */
.call-view-records-filter-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  align-items: end !important;
  gap: 18px 12px !important;
}
.call-view-records-filter-grid > div {
  min-width: 0 !important;
}
.call-view-records-filter-grid .call-filter-actions {
  align-self: end !important;
  display: flex !important;
  gap: 8px !important;
}
@media (max-width: 1100px) {
  .call-view-records-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 640px) {
  .call-view-records-filter-grid { grid-template-columns: 1fr !important; }
}

/* View Call Records: exact two-row filter layout */
.call-view-records-filter-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 14px 12px !important;
  align-items: end !important;
}
.call-view-records-filter-grid > div {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
}
.call-view-records-filter-grid .form-label {
  min-height: 20px !important;
  margin-bottom: 6px !important;
}
.call-view-records-filter-grid .form-control,
.call-view-records-filter-grid .form-select {
  width: 100% !important;
  min-height: 42px !important;
}
.call-view-records-filter-grid .call-filter-actions {
  grid-column: auto !important;
  align-self: end !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
  min-height: 42px !important;
}
.call-view-records-filter-grid .call-filter-actions .btn {
  min-height: 42px !important;
}
@media (min-width: 1181px) {
  .call-view-records-filter-grid .call-filter-actions {
    grid-column: 5 / 6 !important;
  }
}
@media (max-width: 1180px) {
  .call-view-records-filter-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .call-view-records-filter-grid .call-filter-actions {
    grid-column: auto !important;
  }
}
@media (max-width: 760px) {
  .call-view-records-filter-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Login info panel: remove unused blank right space on left content area */
body:has(.login-wrapper) .login-wrapper {
  grid-template-columns: minmax(360px, 520px) minmax(420px, 560px) !important;
  justify-content: center !important;
  gap: 84px !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
}
body:has(.login-wrapper) .login-info {
  width: 100% !important;
  max-width: 520px !important;
}
body:has(.login-wrapper) .login-info .subtext,
body:has(.login-wrapper) .info-item p {
  max-width: 100% !important;
}
@media (max-width: 1100px) {
  body:has(.login-wrapper) .login-wrapper {
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }
  body:has(.login-wrapper) .login-info {
    max-width: 680px !important;
    margin: 0 auto !important;
  }
}

/* Google Charts progressive enhancement for Analytics */
.google-chart-stage {
  display: none;
  width: 100%;
  background: #ffffff;
}
.call-sector-chart.has-google-chart .google-stacked-chart-stage {
  display: block;
  height: 390px;
  min-height: 390px;
}
.call-sector-chart.has-google-chart .call-region-legend,
.call-sector-chart.has-google-chart .call-bar-chart-wrap,
.call-sector-chart.has-google-chart .call-category-total-row {
  display: none !important;
}
.call-combined-pie.is-google-chart,
.call-donut.is-google-chart {
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.call-combined-pie.is-google-chart {
  width: 300px !important;
  height: 250px !important;
  border-radius: 0 !important;
}
.call-combined-pie-wrap:has(.call-combined-pie.is-google-chart) .call-pie-callouts {
  display: none !important;
}
.call-donut.is-google-chart {
  width: 100px !important;
  height: 100px !important;
  border-radius: 0 !important;
}
.call-combined-pie.is-google-chart svg,
.call-donut.is-google-chart svg,
.google-stacked-chart-stage svg {
  overflow: visible !important;
}
.report-builder-modal .call-sector-chart.has-google-chart .google-stacked-chart-stage {
  height: 360px;
  min-height: 360px;
}
.report-builder-modal .report-drop-row.is-half-row .call-sector-chart.has-google-chart .google-stacked-chart-stage {
  height: 300px;
  min-height: 300px;
}
@media (max-width: 760px) {
  .call-sector-chart.has-google-chart .google-stacked-chart-stage {
    height: 330px;
    min-height: 330px;
  }
  .call-combined-pie.is-google-chart {
    width: 250px !important;
    height: 215px !important;
  }
}

/* Google Charts sizing correction */
.call-sector-chart .google-stacked-chart-stage {
  width: 100% !important;
  max-width: none !important;
  overflow: hidden !important;
}
.call-sector-chart .google-stacked-chart-stage > div,
.call-sector-chart .google-stacked-chart-stage svg {
  width: 100% !important;
  max-width: none !important;
}
.call-donut.is-google-chart {
  border: 0 !important;
  outline: 0 !important;
  padding: 0 !important;
}
.call-donut.is-google-chart::before,
.call-donut.is-google-chart::after,
.call-combined-pie.is-google-chart::before,
.call-combined-pie.is-google-chart::after {
  content: none !important;
  display: none !important;
}
.call-donut.is-google-chart > div,
.call-donut.is-google-chart svg {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
}
.call-combined-pie.is-google-chart > div,
.call-combined-pie.is-google-chart svg {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
}

/* Google pie labels with slice leader lines */
.call-combined-pie-card.has-google-pie .call-combined-pie-body {
  display: block !important;
  grid-template-columns: 1fr !important;
}
.call-combined-pie-card.has-google-pie .call-combined-pie-list {
  display: none !important;
}
.call-combined-pie-card.has-google-pie .call-combined-pie-wrap {
  position: relative !important;
  width: min(100%, 800px) !important;
  height: 430px !important;
  margin: 0 auto !important;
  overflow: visible !important;
}
.call-combined-pie-card.has-google-pie .call-combined-pie.is-google-chart {
  position: absolute !important;
  z-index: 1 !important;
  left: 50% !important;
  top: 50% !important;
  width: 340px !important;
  height: 285px !important;
  transform: translate(-50%, -50%) !important;
}
.call-combined-pie-card.has-google-pie .call-pie-callouts,
.call-combined-pie-wrap:has(.call-combined-pie.is-google-chart) .call-pie-callouts {
  display: block !important;
  position: absolute !important;
  z-index: 2 !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
}
.call-combined-pie-card.has-google-pie .google-pie-leaders {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label {
  position: absolute !important;
  width: 164px !important;
  min-height: 34px !important;
  padding: 3px 5px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label.is-left-label {
  text-align: right !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label.is-right-label {
  text-align: left !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label b {
  display: block !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  color: #08245c !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label em {
  display: block !important;
  margin-top: 2px !important;
  color: var(--pie-color) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}
@media (max-width: 820px) {
  .call-combined-pie-card.has-google-pie .call-combined-pie-wrap {
    width: 100% !important;
    height: 400px !important;
    transform: scale(.88) !important;
    transform-origin: center top !important;
  }
}

/* Transparent Google charts with visible labels in Call and SMS */
.reports-analytics-page .google-chart-stage,
.reports-analytics-page .call-combined-pie.is-google-chart,
.reports-analytics-page .call-donut.is-google-chart,
.report-builder-modal .google-chart-stage,
.report-builder-modal .call-combined-pie.is-google-chart,
.report-builder-modal .call-donut.is-google-chart {
  background: transparent !important;
  background-color: transparent !important;
}
.reports-analytics-page .google-chart-stage > div,
.reports-analytics-page .call-combined-pie.is-google-chart > div,
.reports-analytics-page .call-donut.is-google-chart > div,
.report-builder-modal .google-chart-stage > div,
.report-builder-modal .call-combined-pie.is-google-chart > div,
.report-builder-modal .call-donut.is-google-chart > div {
  background: transparent !important;
  background-color: transparent !important;
}
.call-donut.is-google-chart {
  position: relative !important;
}
.google-donut-center-label {
  position: absolute !important;
  z-index: 5 !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  color: #08245c !important;
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  pointer-events: none !important;
  white-space: nowrap !important;
}
.sms-analytics-graphs .call-combined-pie-card.has-google-pie .call-pie-callouts,
.call-analytics-graphs .call-combined-pie-card.has-google-pie .call-pie-callouts {
  display: block !important;
}

/* Remove Google pie plot rectangle and refine callouts */
.call-combined-pie-card.has-google-pie .call-combined-pie.is-google-chart,
.call-combined-pie-card.has-google-pie .call-combined-pie.is-google-chart > div,
.call-combined-pie-card.has-google-pie .call-combined-pie.is-google-chart svg,
.call-combined-pie-card.has-google-pie .call-combined-pie.is-google-chart svg > rect:first-child {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  stroke: transparent !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label {
  z-index: 3 !important;
}
.call-combined-pie-card.has-google-pie .google-pie-leaders {
  z-index: 2 !important;
}

/* Bind pie label typography to its exact slice color */
.call-combined-pie-card.has-google-pie .call-pie-label b,
.call-combined-pie-card.has-google-pie .call-pie-label em {
  color: var(--pie-color) !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label {
  border-inline-start: 3px solid var(--pie-color) !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label.is-left-label {
  border-inline-start: 0 !important;
  border-inline-end: 3px solid var(--pie-color) !important;
}

/* Keep pie leaders outside slices and away from label text */
.call-combined-pie-card.has-google-pie .call-pie-label {
  z-index: 4 !important;
  width: 164px !important;
  padding: 5px 8px !important;
  border: 0 !important;
  background: #f4f8ff !important;
  box-shadow: none !important;
}
.call-combined-pie-card.has-google-pie .call-pie-label.is-left-label,
.call-combined-pie-card.has-google-pie .call-pie-label.is-right-label {
  border: 0 !important;
}
.call-combined-pie-card.has-google-pie .google-pie-leaders {
  z-index: 2 !important;
}

/* Prevent fallback-chart flash while Google Charts loads */
.reports-analytics-page.google-charts-pending .call-sector-chart .call-region-legend,
.reports-analytics-page.google-charts-pending .call-sector-chart .call-bar-chart-wrap,
.reports-analytics-page.google-charts-pending .call-sector-chart .call-category-total-row,
.reports-analytics-page.google-charts-pending .call-combined-pie,
.reports-analytics-page.google-charts-pending .call-pie-callouts,
.reports-analytics-page.google-charts-pending .call-combined-pie-list,
.reports-analytics-page.google-charts-pending .call-donut {
  visibility: hidden !important;
}
.reports-analytics-page.google-charts-pending .google-stacked-chart-stage {
  display: block !important;
  min-height: 390px !important;
  background: transparent !important;
}
.reports-analytics-page.google-charts-pending .call-combined-pie-wrap,
.reports-analytics-page.google-charts-pending .call-donut-card {
  background: transparent !important;
}

/* Native Google pie labels. */
.call-combined-pie-card.uses-native-google-labels .call-pie-callouts,.call-combined-pie-card.uses-native-google-labels .call-combined-pie-list,.call-combined-pie-card.uses-native-google-labels .google-pie-leaders{display:none!important}.call-combined-pie-card.uses-native-google-labels .call-combined-pie-body{display:block!important}.call-combined-pie-card.uses-native-google-labels .call-combined-pie-wrap{width:100%!important;height:430px!important;min-height:430px!important}.call-combined-pie-card.uses-native-google-labels .call-combined-pie.is-google-chart{position:static!important;inset:auto!important;transform:none!important;width:100%!important;height:430px!important;background:transparent!important}


/* Clean two-sided pie labels without leader lines. */
.call-combined-pie-card.uses-side-google-labels .call-pie-callouts,
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-list,
.call-combined-pie-card.uses-side-google-labels .google-pie-leaders { display:none!important; }
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-body {
  position:relative!important; display:block!important; min-height:430px!important;
}
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap {
  width:48%!important; height:430px!important; min-height:430px!important; margin:0 auto!important;
}
.call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart {
  position:static!important; inset:auto!important; transform:none!important;
  width:100%!important; height:430px!important; background:transparent!important;
}
.google-pie-side-labels {
  position:absolute; inset:22px 18px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:52%; pointer-events:none;
}
.google-pie-side-column { display:flex; flex-direction:column; justify-content:center; gap:11px; min-width:0; }
.google-pie-side-label { display:flex; align-items:flex-start; gap:7px; min-width:0; color:var(--label-color); }
.google-pie-side-column.is-right .google-pie-side-label { flex-direction:row-reverse; text-align:right; }
.google-pie-side-label i { width:9px; height:9px; margin-top:4px; flex:0 0 9px; border-radius:2px; background:var(--label-color); }
.google-pie-side-label span { display:grid; gap:1px; min-width:0; }
.google-pie-side-label b { color:var(--label-color); font-size:11px; line-height:1.25; font-weight:600; overflow-wrap:anywhere; }
.google-pie-side-label em { color:var(--label-color); font-size:11px; line-height:1.2; font-style:normal; font-weight:600; }
@media (max-width:900px) {
  .call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap { width:100%!important; height:300px!important; min-height:300px!important; }
  .call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart { height:300px!important; }
  .google-pie-side-labels { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 18px; padding:0 14px 16px; }
}

/* Reserve final chart geometry during Google Charts startup to prevent size jumps. */
.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-body{min-height:430px!important}
.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-wrap{width:48%!important;height:430px!important;min-height:430px!important;margin:0 auto!important}
.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie{width:100%!important;height:430px!important}


/* Keep side labels readable and remove every obsolete center callout. */
.call-combined-pie-card.uses-side-google-labels,.call-combined-pie-card.uses-side-google-labels .call-combined-pie-body{overflow:visible!important}
.call-combined-pie-card.uses-side-google-labels .call-pie-callouts,.call-combined-pie-card.uses-side-google-labels .google-pie-leaders{display:none!important;visibility:hidden!important}
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap{width:44%!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-labels{inset:18px 14px!important;grid-template-columns:minmax(0,27%) minmax(0,27%)!important;justify-content:space-between!important;gap:0!important;overflow:visible!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column,.call-combined-pie-card.uses-side-google-labels .google-pie-side-label,.call-combined-pie-card.uses-side-google-labels .google-pie-side-label span{overflow:visible!important;max-width:none!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-label b{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:normal!important;overflow-wrap:anywhere!important}


/* Final pie/label spacing: prevent the chart from covering either label column. */
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap{width:38%!important;position:relative!important;z-index:1!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-labels{inset:18px 16px!important;grid-template-columns:minmax(0,30%) minmax(0,30%)!important;justify-content:space-between!important;z-index:3!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-left{padding-right:8px!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-right{padding-left:8px!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-label{width:100%!important;box-sizing:border-box!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column-label span{width:100%!important}


.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-wrap{width:38%!important}


/* Shift pies left to keep the right-side labels completely clear. */
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap{transform:translateX(-14%)!important}
.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-wrap{transform:translateX(-14%)!important}
@media (max-width:900px){.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap,.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-wrap{transform:none!important}}


/* Stable three-column pie layout: labels | large pie | labels. */
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-body{display:grid!important;grid-template-columns:minmax(0,28%) minmax(320px,44%) minmax(0,28%)!important;align-items:center!important;min-height:430px!important;overflow:hidden!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-labels{display:contents!important;position:static!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-left{grid-column:1!important;grid-row:1!important;padding:12px 10px 12px 18px!important;z-index:2!important}
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap{grid-column:2!important;grid-row:1!important;width:100%!important;height:430px!important;min-height:430px!important;margin:0!important;transform:none!important;z-index:1!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-right{grid-column:3!important;grid-row:1!important;padding:12px 18px 12px 10px!important;z-index:2!important}
.call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart{width:100%!important;height:430px!important;transform:none!important}
.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-body{display:grid!important;grid-template-columns:minmax(0,28%) minmax(320px,44%) minmax(0,28%)!important;min-height:430px!important}
.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-wrap{grid-column:2!important;width:100%!important;height:430px!important;min-height:430px!important;margin:0!important;transform:none!important}
.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie{width:100%!important;height:430px!important}
@media(max-width:900px){.call-combined-pie-card.uses-side-google-labels .call-combined-pie-body{display:flex!important;flex-direction:column!important}.call-combined-pie-card.uses-side-google-labels .google-pie-side-labels{display:grid!important;position:static!important;width:100%!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap{width:100%!important;height:320px!important;min-height:320px!important}}


/* Authoritative stable pie layout. */
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-body,.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-body{display:grid!important;grid-template-columns:minmax(0,31%) minmax(260px,38%) minmax(0,31%)!important;grid-template-rows:380px!important;align-items:center!important;min-height:380px!important;height:380px!important;overflow:hidden!important;padding:0 16px!important;box-sizing:border-box!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-labels{display:contents!important;position:static!important;inset:auto!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column{position:relative!important;z-index:2!important;align-self:center!important;max-height:350px!important;overflow:visible!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-left{grid-column:1!important;grid-row:1!important;padding:0 14px 0 0!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-right{grid-column:3!important;grid-row:1!important;padding:0 0 0 14px!important}
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap,.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-wrap{grid-column:2!important;grid-row:1!important;width:100%!important;max-width:100%!important;height:360px!important;min-height:360px!important;margin:0!important;transform:none!important;overflow:hidden!important;position:relative!important;z-index:1!important}
.call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart,.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie{position:static!important;width:100%!important;max-width:100%!important;height:360px!important;min-height:360px!important;transform:none!important;overflow:hidden!important}
.call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart > div,.call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart svg{width:100%!important;max-width:100%!important;height:360px!important;overflow:hidden!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-label b{font-size:11px!important;line-height:1.25!important;white-space:normal!important;overflow-wrap:anywhere!important}
@media(max-width:900px){.call-combined-pie-card.uses-side-google-labels .call-combined-pie-body,.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-body{display:block!important;height:auto!important;min-height:0!important;overflow:visible!important}.call-combined-pie-card.uses-side-google-labels .googleb-pie-side-label/z{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}.call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap{height:300px!important;min-height:300px!important}}


@media(max-width:900px){.call-combined-pie-card.uses-side-google-labels .google-pie-side-labels{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px 16px!important;padding:0 12px 14px!important}.call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart,.call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart > div,.call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart svg{height:300px!important}}


/* Google stacked chart is the only graph; preserve its city labels and total row. */
.call-sector-chart.has-google-chart>.call-region-legend,.call-sector-chart.has-google-chart>.call-bar-chart-wrap{display:none!important}
.call-sector-chart.has-google-chart>.call-category-total-row{display:grid!important}
.call-sector-chart.is-district-chart.has-google-chart .google-stacked-chart-stage{height:390px!important;min-height:390px!important}


/* Search Call Record: align second-row fields */
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 14px 12px !important;
  align-items: end !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) > div {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .form-label {
  min-height: 20px !important;
  margin-bottom: 6px !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .form-control,
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .form-select {
  width: 100% !important;
  min-height: 42px !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .call-location-filter-field {
  grid-column: auto !important;
  align-self: end !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .call-filter-actions {
  grid-column: auto !important;
  align-self: end !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 42px !important;
  white-space: nowrap !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .call-filter-actions .btn {
  min-height: 42px !important;
}
@media (max-width: 1180px) {
  .call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 760px) {
  .call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) {
    grid-template-columns: 1fr !important;
  }
}

/* Search Call Record: force Caller Location to same baseline */
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .call-location-filter-field {
  display: grid !important;
  grid-template-rows: 20px 42px !important;
  align-content: end !important;
  row-gap: 6px !important;
  min-height: 68px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .call-location-filter-field .form-label {
  margin: 0 !important;
  min-height: 20px !important;
  line-height: 20px !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .call-location-filter-field .form-control {
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
}
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .call-location-filter-field .location-correction-hint,
.call-filter-panel .call-filter-grid:not(.call-view-records-filter-grid) .call-location-filter-field .call-province-badge {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Dynamic pie height prevents large label sets from clipping. */
.call-combined-pie-card.uses-side-google-labels .call-combined-pie-body,.reports-analytics-page.google-charts-pending .call-combined-pie-card .call-combined-pie-body{grid-template-rows:var(--google-pie-height,430px)!important;height:var(--google-pie-height,430px)!important;min-height:var(--google-pie-height,430px)!important}
.call-combined-pie-card.uses-side-google-labels .google-pie-side-column{max-height:none!important;height:auto!important;overflow:visible!important}
.analytics-graph-modal-body .call-combined-pie-card.uses-side-google-labels,.analytics-graph-modal-body .call-combined-pie-card.uses-side-google-labels .call-combined-pie-body{height:auto!important;min-height:var(--google-pie-height,430px)!important;overflow:visible!important}


/* Manage/View Call Records: province badge below caller city */
.call-record-list-table td.call-location-cell {
    white-space: normal !important;
    vertical-align: top !important;
}
.call-record-list-table td.call-location-cell .call-location-city {
    display: block !important;
    max-width: 100% !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}
.call-record-list-table td.call-location-cell .call-location-province-line {
    display: inline-flex !important;
    align-items: center !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-top: 5px !important;
    padding: 2px 9px !important;
    border: 1px solid #f59e0b !important;
    border-radius: 999px !important;
    background: #fff7ed !important;
    color: #dc2626 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}
/* View Call Records: stations that have not submitted caller data */
.call-missing-regions-panel { margin-bottom: 12px !important; overflow: hidden !important; }
.call-missing-regions-panel .panel-header { display: flex !important; align-items: center !important; justify-content: space-between !important; }
.call-missing-regions-count { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 28px !important; height: 28px !important; padding: 0 8px !important; border-radius: 999px !important; background: #fee2e2 !important; color: #b91c1c !important; font-weight: 700 !important; }
.call-missing-regions-grid { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 7px !important; padding: 9px !important; }
.call-missing-region-card { display: flex !important; align-items: center !important; gap: 8px !important; min-width: 0 !important; padding: 7px 9px !important; border: 1px solid #fecaca !important; border-left: 4px solid #ef4444 !important; border-radius: 8px !important; background: #fff !important; }
.call-missing-region-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 34px !important; width: 34px !important; height: 34px !important; border-radius: 50% !important; background: #fee2e2 !important; color: #dc2626 !important; }
.call-missing-region-copy { display: flex !important; flex-direction: column !important; min-width: 0 !important; }
.call-missing-region-copy strong, .call-missing-region-copy small { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.call-missing-region-copy strong { color: #0f2f5f !important; }
.call-missing-region-copy small { color: #b91c1c !important; }
@media (max-width: 1100px) { .call-missing-regions-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 640px) { .call-missing-regions-grid { grid-template-columns: 1fr !important; } }
/* Missing caller data panel: collapsible header and serial numbers */
.call-missing-regions-toggle { cursor: pointer !important; list-style: none !important; user-select: none !important; }
.call-missing-regions-toggle::-webkit-details-marker { display: none !important; }
.call-missing-regions-summary { display: inline-flex !important; align-items: center !important; gap: 10px !important; }
.call-missing-regions-chevron { color: #2563eb !important; transition: transform .2s ease !important; }
.call-missing-regions-panel:not([open]) .call-missing-regions-chevron { transform: rotate(-90deg) !important; }
.call-missing-region-number { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 28px !important; width: 28px !important; height: 28px !important; border-radius: 50% !important; background: #fee2e2 !important; color: #dc2626 !important; font-size: 12px !important; font-weight: 700 !important; }
/* Region caller data status colors */
.call-missing-region-card.has-call-data {
    border-color: #bbf7d0 !important;
    border-left-color: #16a34a !important;
    background: #f0fdf4 !important;
}
.call-missing-region-card.has-call-data .call-missing-region-number {
    background: #dcfce7 !important;
    color: #15803d !important;
}
.call-missing-region-card.has-call-data .call-missing-region-copy small { color: #15803d !important; }
.call-missing-region-card.no-call-data {
    border-color: #fecaca !important;
    border-left-color: #ef4444 !important;
    background: #fff7f7 !important;
}
/* Last-one-month region status buttons */
.call-region-status-button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    width: max-content !important;
    margin-top: 3px !important;
    padding: 2px 7px !important;
    border: 1px solid currentColor !important;
    border-radius: 5px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}
.call-region-status-button.is-added { background: #dcfce7 !important; color: #15803d !important; }
.call-region-status-button.is-not-added { background: #fee2e2 !important; color: #b91c1c !important; }
/* Compact region status buttons: seven per row */
.call-missing-regions-grid { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
.call-region-status-tile {
    justify-content: flex-start !important;
    min-height: 40px !important;
    padding: 5px 8px !important;
    cursor: default !important;
}
.call-region-status-tile > strong {
    min-width: 0 !important;
    overflow: hidden !important;
    color: #0f2f5f !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
@media (max-width: 1250px) { .call-missing-regions-grid { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; } }
@media (max-width: 900px) { .call-missing-regions-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 640px) { .call-missing-regions-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* Solid red and green region status buttons */
.call-region-status-tile.has-call-data { background: #16a34a !important; border-color: #15803d !important; border-left-color: #166534 !important; }
.call-region-status-tile.no-call-data { background: #dc2626 !important; border-color: #b91c1c !important; border-left-color: #991b1b !important; }
.call-region-status-tile > strong { color: #ffffff !important; }
.call-region-status-tile .call-missing-region-number { background: rgba(255,255,255,.22) !important; color: #ffffff !important; }
/* Region status names and custom hover details */
.call-region-status-tile {
    gap: 6px !important;
    min-height: 38px !important;
    padding: 5px 7px !important;
}
.call-region-status-name {
    min-width: 0 !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
}
.call-region-status-tile .call-missing-region-number {
    flex-basis: 24px !important;
    width: 24px !important;
    height: 24px !important;
    font-size: 11px !important;
}
.call-region-status-tile:focus-visible {
    outline: 2px solid #1d4ed8 !important;
    outline-offset: 2px !important;
}
.call-region-hover-tooltip {
    position: fixed !important;
    z-index: 10000 !important;
    width: max-content !important;
    max-width: min(340px, calc(100vw - 24px)) !important;
    padding: 10px 12px !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #0f2f5f !important;
    box-shadow: 0 10px 28px rgba(15, 42, 90, .20) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
    white-space: pre-line !important;
    pointer-events: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-3px) !important;
    transition: opacity .12s ease, transform .12s ease, visibility .12s ease !important;
}
.call-region-hover-tooltip.is-visible {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}
/* Sta Mgmt serial number column */
.sta-table-panel .sta-serial-column {
    width: 64px !important;
    min-width: 64px !important;
    text-align: center !important;
    white-space: nowrap !important;
}

/* Main dashboard top cards only: five per row. */
body .main-content > .dashboard-main-stat-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
@media(max-width:1200px){body .main-content > .dashboard-main-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:760px){body .main-content > .dashboard-main-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:520px){body .main-content > .dashboard-main-stat-grid{grid-template-columns:1fr!important}}


/* Main dashboard overview rows: five equal cards across desktop width. */
@media(min-width:1301px){
  body .dashboard-overview-box .dashboard-sms-summary-grid,
  body .dashboard-overview-box .dashboard-call-metric-grid,
  body .dashboard-top-programs-24h-card .dashboard-top-five-program-list{grid-template-columns:repeat(5,minmax(0,1fr))!important;width:100%!important}
}


/* Shared graph total row: compact, normal-weight values that fit narrow columns. */
html body .call-sector-chart .call-category-total-row span,
html body .analytics-graph-modal-body .call-sector-chart .call-category-total-row span,
html body .report-builder-modal .call-sector-chart .call-category-total-row span{font-size:9px!important;font-weight:400!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important;min-width:0!important;padding:0 1px!important}
html body .call-sector-chart .call-category-total-row strong,
html body .call-sector-chart .call-category-total-row b,
html body .analytics-graph-modal-body .call-sector-chart .call-category-total-row strong,
html body .analytics-graph-modal-body .call-sector-chart .call-category-total-row b,
html body .report-builder-modal .call-sector-chart .call-category-total-row strong,
html body .report-builder-modal .call-sector-chart .call-category-total-row b{font-size:13px!important;font-weight:400!important;line-height:1!important;white-space:nowrap!important}


/* Analytics graph titles and totals use normal weight. */
html body .reports-analytics-page .analytics-title-block h2,
html body .reports-analytics-page .call-combined-pie-head h2,
html body .reports-analytics-page .call-percentage-head h2,
html body .analytics-graph-modal-body .analytics-title-block h2,
html body .analytics-graph-modal-body .call-combined-pie-head h2,
html body .analytics-graph-modal-body .call-percentage-head h2,
html body .report-builder-modal .analytics-title-block h2,
html body .report-builder-modal .call-combined-pie-head h2,
html body .report-builder-modal .call-percentage-head h2{font-weight:400!important}
html body .reports-analytics-page .analytics-title-block p,
html body .reports-analytics-page .call-combined-pie-head span,
html body .reports-analytics-page .call-percentage-head p,
html body .analytics-graph-modal-body .analytics-title-block p,
html body .analytics-graph-modal-body .call-combined-pie-head span,
html body .analytics-graph-modal-body .call-percentage-head p,
html body .report-builder-modal .analytics-title-block p,
html body .report-builder-modal .call-combined-pie-head span,
html body .report-builder-modal .call-percentage-head p{font-weight:400!important}


/* Final universal analytics graph title weight. */
html body .call-sector-chart > .analytics-title-block h2,
html body .call-percentage-chart > .call-percentage-head h2,
html body .call-combined-pie-card > .call-combined-pie-head h2,
html body .report-builder-item-body .call-sector-chart .analytics-title-block h2,
html body .report-builder-item-body .call-percentage-chart .call-percentage-head h2,
html body .report-builder-item-body .call-combined-pie-card .call-combined-pie-head h2{font-weight:400!important}
html body .call-sector-chart > .analytics-title-block h2 *,
html body .call-percentage-chart > .call-percentage-head h2 *,
html body .call-combined-pie-card > .call-combined-pie-head h2 *{font-weight:400!important}
html body .call-sector-chart > .analytics-title-block p,
html body .call-percentage-chart > .call-percentage-head p,
html body .call-combined-pie-card > .call-combined-pie-head span{font-weight:400!important}


/* Call records: program date-wise topic details */
.call-record-list-table .call-program-group-row>td{position:relative;padding-right:118px!important}
.call-program-details-btn{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;gap:6px;border:1px solid #9fc5ff;border-radius:6px;background:#fff;color:#075ad8;padding:6px 10px;font:500 12px/1 Poppins,Arial,sans-serif;cursor:pointer;white-space:nowrap}
.call-program-details-btn:hover{background:#edf5ff;border-color:#5d9fff}
.call-program-details-backdrop[hidden]{display:none!important}
.call-program-details-backdrop{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:20px;background:rgba(5,24,55,.48)}
.call-program-details-modal{width:min(720px,calc(100vw - 32px));max-height:min(680px,calc(100vh - 40px));display:flex;flex-direction:column;overflow:hidden;border:1px solid #b9d5ff;border-radius:8px;background:#fff;box-shadow:0 24px 70px rgba(4,28,70,.25)}
.call-program-details-modal>header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;border-bottom:1px solid #d6e5fb;background:#f2f7ff}
.call-program-details-modal>header span{display:block;margin-bottom:3px;color:#55708f;font-size:11px;text-transform:uppercase}
.call-program-details-modal>header h3{margin:0;color:#08265c;font-size:17px;font-weight:500}
.call-program-details-modal>header button{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #c6d9f4;border-radius:6px;background:#fff;color:#17385f;cursor:pointer}
.call-program-details-body{overflow:auto;padding:14px 18px 18px}
.call-program-details-body table{width:100%;table-layout:fixed;border-collapse:collapse}
.call-program-details-body th,.call-program-details-body td{padding:10px 12px;border:1px solid #d8e5f7;text-align:left;vertical-align:top;white-space:normal;overflow-wrap:anywhere}
.call-program-details-body th{background:#eef5ff;color:#17385f;font-size:12px;font-weight:500}
.call-program-details-body th:first-child,.call-program-details-body td:first-child{width:150px}
.call-program-details-body td{color:#183457;font-size:13px}
.call-program-details-empty{text-align:center!important;color:#71839a!important}
body.has-call-program-modal{overflow:hidden}
@media(max-width:640px){.call-record-list-table .call-program-group-row>td{padding-right:12px!important}.call-program-details-btn{position:static;transform:none;margin:7px 0 2px 42px}.call-program-details-body th:first-child,.call-program-details-body td:first-child{width:105px}}
/* Report Builder table layout: actions left, regions and sections above canvas */
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-workspace{
  display:grid!important;
  grid-template-columns:170px minmax(0,1fr)!important;
  grid-template-rows:112px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:start!important;
  overflow:visible!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-canvas-wrap{display:contents!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette{
  grid-column:2!important;grid-row:1!important;width:100%!important;min-height:112px!important;
  padding:0!important;border:1px solid #cfe1ff!important;border-radius:6px!important;
  background:#fff!important;overflow:visible!important;position:relative!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-groups{
  position:relative!important;display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;
  gap:0!important;width:100%!important;padding:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group{
  position:static!important;width:auto!important;border:0!important;border-right:1px solid #cfe1ff!important;
  border-radius:0!important;overflow:visible!important;background:#fff!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group:last-child{border-right:0!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group>summary{
  min-height:42px!important;padding:8px 11px!important;border:0!important;border-bottom:1px solid #cfe1ff!important;
  border-radius:0!important;background:#f8fbff!important;color:#08245c!important;font-size:13px!important;
  font-weight:500!important;justify-content:space-between!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group[open]>summary{
  background:#eaf3ff!important;color:#075ad8!important;box-shadow:inset 0 -2px 0 #1670e8!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group-items{
  display:none!important;position:absolute!important;left:0!important;right:0!important;top:42px!important;
  width:100%!important;height:68px!important;max-height:none!important;overflow-x:auto!important;overflow-y:hidden!important;
  align-items:center!important;gap:0!important;padding:10px!important;border:0!important;border-radius:0!important;
  background:#fff!important;box-shadow:none!important;white-space:nowrap!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group[open]>.report-builder-palette-group-items{display:flex!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item{
  width:auto!important;min-width:max-content!important;min-height:38px!important;margin:0!important;padding:7px 11px!important;
  border:0!important;border-right:1px solid #d8e6fb!important;border-radius:0!important;background:transparent!important;
  box-shadow:none!important;color:#17385f!important;font-size:12px!important;font-weight:400!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item:last-child{border-right:0!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item:hover{background:#eef6ff!important;color:#075ad8!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item span{
  white-space:nowrap!important;overflow:visible!important;overflow-wrap:normal!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{
  grid-column:1!important;grid-row:1 / span 2!important;display:flex!important;flex-direction:column!important;
  align-items:stretch!important;justify-content:flex-start!important;gap:6px!important;width:170px!important;
  min-height:112px!important;padding:0!important;border:1px solid #cfe1ff!important;border-radius:6px!important;
  background:#fff!important;overflow:visible!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions>details{
  width:100%!important;min-height:38px!important;flex:0 0 auto!important;margin:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-export-icon,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-generate-trigger{
  justify-content:flex-start!important;border-width:0 0 1px 0!important;border-color:#d8e6fb!important;
  border-radius:0!important;background:#fff!important;color:#08245c!important;padding:8px 11px!important;
  box-shadow:none!important;font-size:12px!important;font-weight:500!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions{
  display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;width:100%!important;margin:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls button:hover,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-generate-trigger:hover{background:#eef6ff!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-pagination{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important;
  width:100%!important;margin:4px 0 0!important;padding:6px!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-list.report-builder-preview{
  grid-column:2!important;grid-row:2!important;width:100%!important;min-width:0!important;
  min-height:calc(94vh - 255px)!important;max-height:calc(94vh - 255px)!important;margin:0!important
}
@media(max-width:900px){
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-workspace{
    grid-template-columns:1fr!important;grid-template-rows:auto auto minmax(0,1fr)!important
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette{
    grid-column:1!important;grid-row:1!important;min-height:112px!important
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-groups{
    grid-template-columns:repeat(3,minmax(110px,1fr))!important
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{
    grid-column:1!important;grid-row:2!important;width:100%!important;display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:6px!important
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions{display:contents!important}
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-list.report-builder-preview{
    grid-column:1!important;grid-row:3!important;max-height:none!important
  }
}
/* Report Builder: polished button controls */
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-workspace{
  grid-template-columns:190px minmax(0,1fr)!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{
  width:190px!important;padding:8px!important;gap:7px!important;background:#f7fbff!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-export-icon,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-generate-trigger{
  min-height:42px!important;width:100%!important;display:flex!important;align-items:center!important;
  justify-content:flex-start!important;gap:9px!important;padding:9px 12px!important;
  border:1px solid #b9d5ff!important;border-radius:7px!important;background:#fff!important;
  color:#082b66!important;font-size:12px!important;font-weight:500!important;
  line-height:1.2!important;box-shadow:0 1px 2px rgba(8,36,92,.04)!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button:hover,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-export-icon:hover,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-generate-trigger:hover{
  border-color:#6ea8ff!important;background:#edf5ff!important;color:#075ad8!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .is-save{
  border-color:#8be0b5!important;background:#effcf6!important;color:#087a4b!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .is-preview{
  border-color:#9fc5ff!important;background:#f5f9ff!important;color:#075ad8!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-generate-menu.is-disabled .report-generate-trigger{
  border-color:#d8def0!important;background:#f7f8fc!important;color:#8a96ad!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette{
  padding:8px!important;background:#f7fbff!important;overflow-x:auto!important;overflow-y:visible!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-groups{
  grid-template-columns:repeat(7,minmax(105px,1fr))!important;gap:7px!important;min-width:770px!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group{
  border:0!important;background:transparent!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group>summary{
  min-height:42px!important;padding:9px 11px!important;border:1px solid #b9d5ff!important;
  border-radius:7px!important;background:#fff!important;font-size:12px!important;font-weight:500!important;
  box-shadow:0 1px 2px rgba(8,36,92,.04)!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group[open]>summary{
  border-color:#4e95ff!important;background:#eaf3ff!important;color:#075ad8!important;
  box-shadow:inset 0 -2px 0 #1670e8!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group-items{
  top:58px!important;height:62px!important;padding:8px!important;gap:7px!important;background:#f7fbff!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item{
  min-height:40px!important;padding:8px 12px!important;border:1px solid #c7daf5!important;
  border-radius:7px!important;background:#fff!important;color:#17385f!important;
  box-shadow:0 1px 2px rgba(8,36,92,.04)!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item:hover{
  border-color:#6ea8ff!important;background:#edf5ff!important;color:#075ad8!important
}
/* Report Builder: full-width top navigation correction */
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-card{width:min(1720px,calc(100vw - 24px))!important;max-width:none!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-workspace{width:100%!important;max-width:none!important;padding:10px!important;grid-template-columns:200px minmax(0,1fr)!important;grid-template-rows:118px minmax(0,1fr)!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette{width:100%!important;max-width:none!important;height:118px!important;min-height:118px!important;max-height:118px!important;overflow:visible!important;align-self:stretch!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-groups{width:100%!important;min-width:0!important;max-width:none!important;grid-template-columns:repeat(7,minmax(92px,1fr))!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group-items{top:57px!important;left:0!important;right:0!important;width:100%!important;max-width:none!important;height:61px!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{width:200px!important;max-width:none!important;grid-row:1 / span 2!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-list.report-builder-preview{width:100%!important;max-width:none!important;min-height:calc(94vh - 260px)!important;max-height:calc(94vh - 260px)!important}
@media(max-width:920px){
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-workspace{grid-template-columns:1fr!important;grid-template-rows:auto auto minmax(0,1fr)!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{grid-column:1!important;grid-row:1!important;width:100%!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions{display:contents!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette{grid-column:1!important;grid-row:2!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-list.report-builder-preview{grid-column:1!important;grid-row:3!important;max-height:none!important}
}
/* Report Builder: equal left spacing and joined section submenu */
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{
  display:flex!important;flex-direction:column!important;gap:8px!important;padding:10px!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions{
  display:flex!important;flex-direction:column!important;gap:8px!important;margin:0!important;width:100%!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions>details{
  height:44px!important;min-height:44px!important;max-height:44px!important;margin:0!important;flex:0 0 44px!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-export-icon,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-generate-trigger{
  height:44px!important;min-height:44px!important;max-height:44px!important;margin:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group-items{
  gap:0!important;padding-left:10px!important;padding-right:10px!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item{
  margin:0!important;border-radius:0!important;border-right-width:0!important;box-shadow:none!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item:first-child{
  border-radius:7px 0 0 7px!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item:last-child{
  border-right-width:1px!important;border-radius:0 7px 7px 0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item:only-child{
  border-radius:7px!important
}
/* Stations without an assigned FPC / Station Manager */
.call-region-status-tile.no-fpc {
    background: #f59e0b !important;
    border-color: #d97706 !important;
    border-left-color: #b45309 !important;
}

/* Call Detail table: centered province/count and category headings. */
html body .call-detail-report-table .call-detail-province-row > td {
  text-align: center !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
}
html body .call-detail-report-table .call-province-toggle {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  justify-content: center !important;
  text-align: center !important;
  font-weight: 700 !important;
}
html body .call-detail-report-table .call-province-toggle > i {
  position: absolute !important;
  left: 8px !important;
}
html body .call-detail-report-table .call-province-toggle > span,
html body .call-detail-report-table .call-province-toggle > b,
html body .call-detail-report-table .call-detail-category-row > td,
html body .call-detail-report-table .call-detail-category-row > td::before,
html body .call-detail-report-table .call-detail-category-row > td::after {
  font-weight: 700 !important;
  text-align: center !important;
}
html body .call-detail-report-table .call-detail-category-row > td::before,
html body .call-detail-report-table .call-detail-category-row > td::after {
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center !important;
}
/* Analytics donut drill-down: category call records modal. */
.call-word-import-badge {
  font-family: var(--slims-font-family) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  width: max-content !important;
  margin-top: 5px !important;
  padding: 3px 8px !important;
  border: 1px solid #93c5fd !important;
  border-radius: 999px !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
html body .call-detail-report-table .call-detail-date,
html body .call-detail-report-table thead th {
  font-family: var(--slims-font-family) !important;
}
html body .call-analytics-graphs > .call-percentage-chart .call-donut-card {
  cursor: pointer !important;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}
html body .call-analytics-graphs > .call-percentage-chart .call-donut-card:hover,
html body .call-analytics-graphs > .call-percentage-chart .call-donut-card:focus-visible {
  border-color: var(--donut-color) !important;
  box-shadow: 0 10px 24px rgba(8,36,92,.14) !important;
  transform: translateY(-2px) !important;
  outline: none !important;
}
html body .call-donut-records-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000002 !important;
  display: grid !important;
  place-items: center !important;
  padding: 22px !important;
  background: rgba(7,25,58,.48) !important;
  backdrop-filter: blur(3px) !important;
}
html body .call-donut-records-card {
  position: relative !important;
  width: min(1220px,96vw) !important;
  max-height: 90vh !important;
  overflow: auto !important;
  padding: 18px !important;
  border: 1px solid #cfe2ff !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: 0 24px 70px rgba(8,36,92,.26) !important;
}
html body .call-donut-records-close {
  position: sticky !important;
  z-index: 3 !important;
  top: 0 !important;
  float: right !important;
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #fee2e2 !important;
  color: #dc2626 !important;
  cursor: pointer !important;
}
html body .call-donut-records-body {
  clear: both !important;
  min-width: 720px !important;
}
html body .call-donut-records-body .call-detail-report-panel {
  margin: 0 !important;
  box-shadow: none !important;
}
html body .call-donut-records-body .call-detail-region-title {
  padding-right: 44px !important;
  text-align: center !important;
  font-weight: 700 !important;
}
html body .call-donut-records-body .call-detail-dist-grouped {
  vertical-align: middle !important;
  text-align: center !important;
  background: #f4f9ff !important;
  color: #0f5f57 !important;
  font-weight: 600 !important;
  border-left: 1px solid #cbd8e8 !important;
  border-right: 1px solid #cbd8e8 !important;
}
@media (max-width:760px) {
  html body .call-donut-records-modal { padding: 8px !important; }
  html body .call-donut-records-card { width: 98vw !important; padding: 10px !important; }
}

.program-mgmt-layout.program-archive-mode {
  grid-template-columns: minmax(0, 1fr);
}

.program-archive-mode .program-content-panel {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
}

.program-archive-mode .program-schedule-table {
  min-width: 920px;
}

.program-archive-mode .program-schedule-table td:last-child,
.program-archive-mode .program-schedule-table th:last-child {
  white-space: nowrap;
}
/* Add Call Record: conditional foreign-country selector */
.video-call-record-form .call-left-top-fields { align-items: start !important; }
.video-call-record-form .call-foreign-country[hidden] { display: none !important; }
.video-call-record-form .call-foreign-country { min-width: 0 !important; }
.call-record-list-table .call-foreign-country-badge {
    border-color: #2563eb !important;
    background: #eff6ff !important;
    color: #1d4ed8 !important;
}
/* Caller Location switches in-place to the foreign-country selector. */
.video-call-record-form .call-caller-location > [data-caller-country-select][hidden],
.video-call-record-form .call-caller-location > [data-caller-location][hidden] {
    display: none !important;
}
.video-call-record-form .call-caller-location > [data-caller-country-select] {
    width: 100% !important;
}

/* Call Analytics has eight region tabs; keep them compact on one desktop row. */
@media (min-width: 1301px) {
  html body .call-region-card .call-analytics-subtabs {
    grid-template-columns: repeat(8, minmax(64px, 1fr)) !important;
    gap: 5px !important;
  }
  html body .call-region-card .reports-subtab {
    height: 32px !important;
    padding: 4px 6px !important;
    font-size: 11.5px !important;
  }
}
/* Report Builder graph text editor and clean preview/export output. */
.report-builder-modal .report-builder-item-head .report-text-edit-btn {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid #9fc5ff;
  border-radius: 6px;
  background: #fff;
  color: #0759c8;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}
.report-builder-modal .report-text-editor {
  display: grid;
  gap: 9px;
  padding: 11px;
  border-bottom: 1px solid #cfe1ff;
  background: #f8fbff;
}
.report-builder-modal .report-text-editor > label,
.report-builder-modal .report-label-editor-list label {
  display: grid;
  grid-template-columns: minmax(110px, 180px) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  color: #163b72;
  font-size: 11px;
}
.report-builder-modal .report-text-editor input {
  width: 100%;
  height: 32px;
  padding: 5px 8px;
  border: 1px solid #b8d3fa;
  border-radius: 5px;
  background: #fff;
  color: #08245c;
  font: inherit;
  box-sizing: border-box;
}
.report-builder-modal .report-label-editor-title { font-size: 11px; font-weight: 600; color: #163b72; }
.report-builder-modal .report-label-editor-list { display: grid; gap: 6px; max-height: 190px; overflow: auto; }
.report-builder-modal .report-text-editor-actions { display: flex; justify-content: flex-end; gap: 7px; }
.report-builder-modal .report-text-editor-actions button {
  min-width: 72px;
  padding: 6px 10px;
  border: 1px solid #9fc5ff;
  border-radius: 5px;
  background: #fff;
  color: #0759c8;
  cursor: pointer;
}
.report-builder-modal .report-text-editor-actions [data-apply-report-text] { background: #0759c8; border-color: #0759c8; color: #fff; }
.report-preview-modal .analytics-full-btn,
.report-preview-modal .analytics-excel-btn,
.report-preview-modal .analytics-image-btn,
.report-preview-modal .call-province-exclude-filter,
.report-preview-modal .call-province-exclude-one,
.report-export-render-host .analytics-full-btn,
.report-export-render-host .analytics-excel-btn,
.report-export-render-host .analytics-image-btn,
.report-export-render-host .call-province-exclude-filter,
.report-export-render-host .call-province-exclude-one { display: none !important; }
/* Never expose analytics action controls in report preview or generated output. */
.report-preview-modal .call-category-summary-btn,
.report-preview-modal .analytics-region-excel-proxy,
.report-preview-modal .analytics-modal-full-proxy,
.report-preview-modal .analytics-full-proxy,
.report-export-render-host .call-category-summary-btn,
.report-export-render-host .analytics-region-excel-proxy,
.report-export-render-host .analytics-modal-full-proxy,
.report-export-render-host .analytics-full-proxy { display: none !important; }
/* Report preview/PDF: use the full canvas and keep stacked values readable. */
.export-page .call-sector-chart,
.report-export-render-host .call-sector-chart {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}
.export-page .call-sector-chart .call-bar-chart-wrap,
.report-export-render-host .call-sector-chart .call-bar-chart-wrap {
  width: 100% !important;
  max-width: none !important;
  grid-template-columns: 48px minmax(0, 1fr) !important;
}
.export-page .call-sector-chart:not(.is-district-chart) .call-bar-chart,
.report-export-render-host .call-sector-chart:not(.is-district-chart) .call-bar-chart {
  width: 100% !important;
  justify-content: space-around !important;
  gap: 28px !important;
  padding-inline: 18px !important;
  box-sizing: border-box !important;
}
.export-page .call-sector-chart:not(.is-district-chart) .call-bar-item,
.report-export-render-host .call-sector-chart:not(.is-district-chart) .call-bar-item {
  flex: 1 1 0 !important;
  min-width: 90px !important;
  max-width: 190px !important;
}
.export-page .call-sector-chart:not(.is-district-chart) .call-stacked-bar,
.report-export-render-host .call-sector-chart:not(.is-district-chart) .call-stacked-bar {
  width: 42px !important;
  max-width: 58% !important;
}
.export-page .call-sector-chart .call-stacked-bar span,
.report-export-render-host .call-sector-chart .call-stacked-bar span {
  min-height: 15px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.8) !important;
  overflow: visible !important;
}
.export-page .call-sector-chart .call-bar-item > em,
.report-export-render-host .call-sector-chart .call-bar-item > em {
  font-size: 12px !important;
  line-height: 1.2 !important;
  white-space: normal !important;
  text-align: center !important;
}
/* Report preview/PDF: consistent 3D chart treatment. */
.export-page .call-combined-pie.is-google-chart,
.report-export-render-host .call-combined-pie.is-google-chart {
  filter: drop-shadow(0 16px 10px rgba(5, 35, 90, .24)) !important;
}
.export-page .call-donut-card,
.report-export-render-host .call-donut-card {
  perspective: 650px !important;
  overflow: visible !important;
}
.export-page .call-donut,
.report-export-render-host .call-donut {
  transform: rotateX(9deg) translateY(-2px) !important;
  transform-origin: 50% 60% !important;
  filter: drop-shadow(0 11px 5px rgba(5, 35, 90, .32)) !important;
  overflow: visible !important;
}
.export-page .call-stacked-bar,
.report-export-render-host .call-stacked-bar {
  position: relative !important;
  overflow: visible !important;
  filter: drop-shadow(7px 8px 5px rgba(5, 35, 90, .22)) !important;
}
.export-page .call-stacked-bar span,
.report-export-render-host .call-stacked-bar span {
  position: relative !important;
  overflow: visible !important;
  border-top: 1px solid rgba(255,255,255,.48) !important;
}
.export-page .call-stacked-bar span::after,
.report-export-render-host .call-stacked-bar span::after {
  content: '' !important;
  position: absolute !important;
  top: 3px !important;
  right: -6px !important;
  width: 6px !important;
  height: calc(100% - 2px) !important;
  background: inherit !important;
  filter: brightness(.72) !important;
  transform: skewY(-38deg) !important;
  transform-origin: left top !important;
  pointer-events: none !important;
}
.export-page .call-stacked-bar span::before,
.report-export-render-host .call-stacked-bar span::before {
  content: '' !important;
  position: absolute !important;
  left: 3px !important;
  top: -5px !important;
  width: calc(100% - 2px) !important;
  height: 5px !important;
  background: inherit !important;
  filter: brightness(1.15) !important;
  transform: skewX(-48deg) !important;
  transform-origin: left bottom !important;
  pointer-events: none !important;
}
.export-page .call-stacked-bar span,
.report-export-render-host .call-stacked-bar span,
.export-page .call-stacked-bar span::before,
.export-page .call-stacked-bar span::after,
.report-export-render-host .call-stacked-bar span::before,
.report-export-render-host .call-stacked-bar span::after {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}
/* Report Builder custom heading and separator blocks. */
.report-builder-modal .report-builder-custom-block {
  width: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.report-builder-modal .report-builder-custom-heading,
.export-page .report-builder-custom-heading,
.report-export-render-host .report-builder-custom-heading {
  width: 100%;
  padding: 10px 14px;
  border-left: 4px solid #0759c8;
  background: #edf5ff;
  color: #08245c;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  box-sizing: border-box;
  outline: none;
}
.report-builder-modal .report-builder-custom-heading:focus {
  box-shadow: inset 0 0 0 2px #80b4ff;
}
.report-builder-modal .report-builder-custom-separator,
.export-page .report-builder-custom-separator,
.report-export-render-host .report-builder-custom-separator {
  width: 100%;
  height: 0;
  margin: 12px 0;
  border: 0;
  border-top: 2px solid #8fb8ec;
}
.report-builder-modal .report-row-controls [data-add-report-block] {
  justify-content: flex-start;
}
/* Calls Report Builder has eight province groups; keep them on one compact row. */
@media (min-width: 1101px) {
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-groups {
    grid-template-columns: repeat(8, minmax(72px, 1fr)) !important;
    gap: 5px !important;
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group > summary {
    min-height: 42px !important;
    height: 42px !important;
    padding: 6px 10px !important;
    font-size: 11px !important;
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group-items {
    top: 47px !important;
  }
}
/* Fit Report Builder graph submenu without horizontal scrolling. */
@media (min-width: 921px) {
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group-items {
    display: none !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
    gap: 0 !important;
    padding-inline: 8px !important;
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group[open] > .report-builder-palette-group-items {
    display: flex !important;
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-group-items::-webkit-scrollbar {
    display: none !important;
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 6px 7px !important;
    font-size: 10.5px !important;
    line-height: 1.15 !important;
  }
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette-item span {
    min-width: 0 !important;
    white-space: normal !important;
    overflow: hidden !important;
    overflow-wrap: anywhere !important;
    text-align: center !important;
  }
}
/* Production responsive fix: one-row call tabs and non-overlapping graph actions. */
@media (min-width: 921px) {
  html body .call-region-card .call-analytics-subtabs {
    display: grid !important;
    grid-template-columns: repeat(8, minmax(58px, 1fr)) !important;
    gap: 5px !important;
  }
  html body .call-region-card .reports-subtab {
    min-width: 0 !important;
    height: 32px !important;
    padding: 4px 5px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
  }
}
html body .call-analytics-graphs .call-sector-chart,
html body .call-analytics-graphs .call-percentage-chart,
html body .call-analytics-graphs .call-combined-pie-card,
html body .call-analytics-graphs .call-category-region-chart {
  position: relative !important;
}
html body .call-analytics-graphs .call-sector-chart > .analytics-title-block,
html body .call-analytics-graphs .call-percentage-chart > .call-percentage-head,
html body .call-analytics-graphs .call-combined-pie-card > .call-combined-pie-head,
html body .call-analytics-graphs .call-category-region-chart > .call-category-region-head {
  min-height: 88px !important;
  padding: 52px 12px 8px !important;
  box-sizing: border-box !important;
}
html body .call-analytics-graphs .analytics-full-btn,
html body .call-analytics-graphs .analytics-excel-btn,
html body .call-analytics-graphs .analytics-image-btn,
html body .call-analytics-graphs .analytics-region-excel-proxy,
html body .call-analytics-graphs .analytics-modal-full-proxy,
html body .call-analytics-graphs .analytics-full-proxy,
html body .call-analytics-graphs .call-category-summary-btn {
  top: 9px !important;
  height: 36px !important;
  min-height: 36px !important;
  z-index: 12 !important;
}
html body .call-analytics-graphs .analytics-excel-btn,
html body .call-analytics-graphs .analytics-region-excel-proxy { right: 10px !important; }
html body .call-analytics-graphs .analytics-full-btn,
html body .call-analytics-graphs .analytics-modal-full-proxy,
html body .call-analytics-graphs .analytics-full-proxy { right: 54px !important; }
html body .call-analytics-graphs .analytics-image-btn { right: 98px !important; }
html body .call-analytics-graphs .call-category-summary-btn {
  right: 142px !important;
  max-width: 112px !important;
}
/* Distinct Call Analytics colors for Foreign and Unknown. */
html body .reports-subtab[href*="call_analytics_tab=foreign"] {
  color: #0369a1 !important;
  border-color: #7dd3fc !important;
  background: #f0f9ff !important;
}
html body .reports-subtab[href*="call_analytics_tab=unknown"] {
  color: #475569 !important;
  border-color: #cbd5e1 !important;
  background: #f8fafc !important;
}
html body .reports-subtab[href*="call_analytics_tab=foreign"].is-active,
html body .reports-subtab[href*="call_analytics_tab=foreign"]:hover {
  color: #fff !important;
  border-color: #0284c7 !important;
  background: linear-gradient(135deg, #38bdf8, #0284c7) !important;
}
html body .reports-subtab[href*="call_analytics_tab=unknown"].is-active,
html body .reports-subtab[href*="call_analytics_tab=unknown"]:hover {
  color: #fff !important;
  border-color: #64748b !important;
  background: linear-gradient(135deg, #94a3b8, #475569) !important;
}
/* Add Call Record: searchable caller-location suggestions. */
.video-call-record-form .call-caller-location { position: relative; }
.video-call-record-form .call-location-suggestions {
  position: absolute;
  z-index: 40;
  top: calc(100% - 2px);
  left: 0;
  right: 0;
  max-height: 240px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid #b8c9df;
  border-radius: 0 0 6px 6px;
  box-shadow: 0 8px 18px rgba(27, 55, 92, .16);
}
.video-call-record-form .call-location-suggestions[hidden] { display: none !important; }
.video-call-record-form .call-location-suggestion {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border: 0;
  border-bottom: 1px solid #e4ebf4;
  border-radius: 0;
  background: #fff;
  color: #17345d;
  text-align: left;
  cursor: pointer;
}
.video-call-record-form .call-location-suggestion:last-child { border-bottom: 0; }
.video-call-record-form .call-location-suggestion:hover,
.video-call-record-form .call-location-suggestion.is-active { background: #edf5ff; }
.video-call-record-form .call-location-suggestion strong { font-size: 13px; font-weight: 600; }
.video-call-record-form .call-location-suggestion span { font-size: 11px; color: #63758d; }

/* Keep Caller Location autocomplete visible outside the details grid. */
.video-call-record-form .call-details-panel { overflow: visible !important; }
.video-call-record-form .call-left-top-fields { position: relative; z-index: 20; }
.video-call-record-form .call-caller-location { z-index: 25; }

/* Pakistan Locations: expose every page number without widening the page. */
.pakistan-location-pagination {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 8px 0 10px;
  scrollbar-width: thin;
}
.pakistan-location-pagination .pagination {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  width: max-content;
  min-width: 100%;
  margin: 0 !important;
}
.pakistan-location-pagination .pagination > li { flex: 0 0 auto; }

/* Polished announcement composer with multi-group audience selection */
.announcement-compose-head{display:flex!important;align-items:center!important;gap:13px;padding:18px 20px!important;background:linear-gradient(135deg,#f8fbff,#edf5ff)!important}
.announcement-compose-head .announcement-compose-icon{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;border-radius:12px;background:#2563eb;color:#fff;box-shadow:0 8px 18px rgba(37,99,235,.23)}
.announcement-compose-head h2{margin:0!important;color:#12335d!important;font-size:18px!important;font-weight:700!important}
.announcement-compose-head p{margin:4px 0 0;color:#6b7e97;font-size:12px;line-height:1.4}
.announcement-form{padding:20px!important}
.announcement-primary-grid{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:14px;margin-bottom:14px}
.announcement-form .form-label{display:flex;align-items:center;gap:7px;color:#294665;font-size:13px;font-weight:600;margin-bottom:7px}
.announcement-form .form-label i{color:#2563eb}
.announcement-message-field{margin-bottom:16px}
.announcement-message-field textarea.form-control{min-height:120px!important;resize:vertical;padding:12px 14px!important;line-height:1.55}
.announcement-audience-box{min-width:0;margin:0;padding:16px;border:1px solid #dce8f7;border-radius:10px;background:#f8fbff}
.announcement-audience-box legend{float:none;width:auto;margin:0 0 4px;padding:0;color:#163b68;font-size:14px;font-weight:700}
.announcement-audience-box legend i{margin-right:7px;color:#2563eb}
.announcement-audience-box>p{margin:0 0 13px;color:#71839a;font-size:12px}
.announcement-audience-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;max-height:265px;overflow:auto;padding:2px}
.announcement-audience-option{position:relative;margin:0;cursor:pointer}
.announcement-audience-option input{position:absolute;opacity:0;pointer-events:none}
.announcement-audience-option span{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;min-height:62px;padding:10px 12px;border:1px solid #dce6f3;border-radius:9px;background:#fff;transition:.16s ease}
.announcement-audience-option span>i{grid-row:1/3;width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;background:#eef4ff;color:#2563eb}
.announcement-audience-option b{color:#29445f;font-size:13px;font-weight:600}
.announcement-audience-option small{color:#8392a6;font-size:11px}
.announcement-audience-option input:checked+span{border-color:#2563eb;background:#edf5ff;box-shadow:0 0 0 2px rgba(37,99,235,.1)}
.announcement-audience-option input:checked+span>i{background:#2563eb;color:#fff}
.announcement-audience-option input:checked+span:after{content:'✓';position:absolute;top:8px;right:10px;color:#2563eb;font-weight:800}
.announcement-audience-option.is-all{grid-column:1/-1}
.announcement-form-actions{padding-top:17px!important}
.announcement-form-actions .btn{width:100%;min-height:46px!important;border-radius:8px!important;background:linear-gradient(135deg,#2563eb,#1d4ed8)!important;border:0!important;box-shadow:0 8px 18px rgba(37,99,235,.2);font-weight:700}
@media(max-width:700px){.announcement-primary-grid,.announcement-audience-options{grid-template-columns:1fr}.announcement-audience-option.is-all{grid-column:auto}.announcement-form{padding:14px!important}}
/* Shared Call and SMS graph controls. */
html body .reports-analytics-page .call-combined-pies-panel .call-combined-pie-card,
html body .reports-analytics-page .call-analytics-graphs .call-sector-chart,
html body .reports-analytics-page .call-analytics-graphs .call-percentage-chart,
html body .reports-analytics-page .call-analytics-graphs .call-category-region-chart {
  position: relative !important;
}
html body .reports-analytics-page .call-combined-pies-panel .call-combined-pie-head,
html body .reports-analytics-page .call-analytics-graphs .analytics-title-block,
html body .reports-analytics-page .call-analytics-graphs .call-percentage-head,
html body .reports-analytics-page .call-analytics-graphs .call-category-region-head {
  min-height: 72px !important;
  padding: 12px 164px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}
html body .reports-analytics-page .call-combined-pies-panel .call-combined-pie-card > :is(.analytics-full-btn,.analytics-excel-btn,.analytics-image-btn),
html body .reports-analytics-page .call-analytics-graphs :is(.call-sector-chart,.call-percentage-chart,.call-category-region-chart) > :is(.analytics-full-btn,.analytics-excel-btn,.analytics-image-btn,.analytics-region-excel-proxy,.analytics-modal-full-proxy,.analytics-full-proxy) {
  position: absolute !important;
  top: 14px !important;
  right: auto !important;
  transform: none !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  z-index: 15 !important;
  font-size: 15px !important;
}
html body .reports-analytics-page :is(.call-combined-pies-panel,.call-analytics-graphs) .analytics-full-btn,
html body .reports-analytics-page .call-analytics-graphs :is(.analytics-modal-full-proxy,.analytics-full-proxy) {
  left: 14px !important;
}
html body .reports-analytics-page :is(.call-combined-pies-panel,.call-analytics-graphs) .analytics-excel-btn,
html body .reports-analytics-page .call-analytics-graphs .analytics-region-excel-proxy {
  left: 66px !important;
  border: 1px solid #9bd5b0 !important;
  background: #f4fff8 !important;
  color: #087a4b !important;
}
html body .reports-analytics-page :is(.call-combined-pies-panel,.call-analytics-graphs) .analytics-image-btn {
  left: 118px !important;
  border: 1px solid #a8caff !important;
  background: #fff !important;
  color: #1769d2 !important;
}
html body .reports-analytics-page .call-province-exclude-filter {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 9px 12px !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  color: #395371 !important;
}
html body .reports-analytics-page .call-province-exclude-filter > span {
  margin-right: 2px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}
html body .reports-analytics-page .call-province-exclude-filter label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 3px 7px !important;
  border: 1px solid #c9daf1 !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #163b6f !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}
html body .reports-analytics-page .call-province-exclude-filter label span {
  font-size: 10px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}
html body .reports-analytics-page .call-province-exclude-filter input {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
  margin: 0 !important;
  accent-color: #dc3545 !important;
}
@media (max-width: 700px) {
  html body .reports-analytics-page .call-combined-pies-panel .call-combined-pie-head,
  html body .reports-analytics-page .call-analytics-graphs .analytics-title-block,
  html body .reports-analytics-page .call-analytics-graphs .call-percentage-head,
  html body .reports-analytics-page .call-analytics-graphs .call-category-region-head {
    min-height: 105px !important;
    padding: 58px 12px 9px !important;
  }
}

/* SLIMS icon cleanup: keep icons plain, compact and without colored backgrounds */
html body .sims-metric-icon,
html body .stat-icon,
html body .metric-icon,
html body .card-icon,
html body .module-icon,
html body .module-card-icon,
html body .section-icon,
html body .dashboard-top-five-rank,
html body .dashboard-card-icon,
html body .panel-icon,
html body .profile-link-icon,
html body .announcement-compose-icon,
html body .sidebar .nav-icon,
html body .sidebar-menu i,
html body .nav-link i,
html body .panel-header > i,
html body .panel-header h2 > i,
html body .dashboard-category-head i,
html body .dashboard-section-title i,
html body .page-title i,
html body .card-title i {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

html body .fa-solid,
html body .fa-regular,
html body .fa-brands,
html body .fas,
html body .far,
html body .fab {
  font-size: 12px !important;
  line-height: 1 !important;
}

html body .btn i,
html body .cell-edit-btn i,
html body .cell-delete-btn i,
html body .call-group-toggle i,
html body .call-audit-hover i,
html body .icon-only-btn i,
html body .sims-metric-icon i,
html body .stat-icon i,
html body .metric-icon i,
html body .card-icon i,
html body .module-card-icon i,
html body .dashboard-top-five-rank i {
  font-size: 11px !important;
}


/* Force plain dashboard/card icons: no icon background boxes */
html body .sims-metric-card .sims-metric-icon,
html body .sims-metric-card.is-blue .sims-metric-icon,
html body .sims-metric-card.is-green .sims-metric-icon,
html body .sims-metric-card.is-red .sims-metric-icon,
html body .sims-metric-card.is-orange .sims-metric-icon,
html body .sims-metric-card.is-purple .sims-metric-icon,
html body .sims-metric-card.is-teal .sims-metric-icon,
html body .sims-metric-card.is-slate .sims-metric-icon,
html body .dashboard-section .sims-metric-icon,
html body .dashboard-overview-grid .sims-metric-icon,
html body .sms-overview-section .sims-metric-icon,
html body .calls-overview-section .sims-metric-icon {
  width: 14px !important;
  height: 14px !important;
  min-width: 14px !important;
  min-height: 14px !important;
  flex: 0 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

html body .sims-metric-card .sims-metric-icon i,
html body .dashboard-section .sims-metric-icon i,
html body .dashboard-overview-grid .sims-metric-icon i,
html body .sms-overview-section .sims-metric-icon i,
html body .calls-overview-section .sims-metric-icon i {
  font-size: 12px !important;
  line-height: 1 !important;
}

/* SLIMS panel heading typography: match SMS Overview and uppercase */
html body .dashboard-overview-heading h1,
html body .page-title-row h1,
html body .panel-header h2,
html body .overview-box-head h2,
html body .activity-section-title h2,
html body .compact-strip-title h2,
html body .sims-management-head h2,
html body .program-panel-header h2,
html body .fpc-panel-header h2,
html body .analytics-title-block h2,
html body .call-percentage-head h2,
html body .call-combined-pie-head h2,
html body .report-builder-top h2,
html body .sheet-record-head h2,
html body .call-record-filter-header h2,
html body .dashboard-category-head,
html body .dashboard-section-title,
html body .card-title {
  font-size: 18px !important;
  line-height: 1.25 !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
}

html body .dashboard-overview-heading,
html body .page-title-row {
  margin-bottom: 12px !important;
}

/* SLIMS compact panel headings: smaller uppercase, cleaner look */
html body .dashboard-overview-heading h1,
html body .page-title-row h1,
html body .panel-header h2,
html body .overview-box-head h2,
html body .activity-section-title h2,
html body .compact-strip-title h2,
html body .sims-management-head h2,
html body .program-panel-header h2,
html body .fpc-panel-header h2,
html body .analytics-title-block h2,
html body .call-percentage-head h2,
html body .call-combined-pie-head h2,
html body .report-builder-top h2,
html body .sheet-record-head h2,
html body .call-record-filter-header h2,
html body .dashboard-category-head,
html body .dashboard-section-title,
html body .card-title {
  font-size: 15px !important;
  line-height: 1.25 !important;
  font-weight: 600 !important;
  letter-spacing: .015em !important;
  text-transform: uppercase !important;
}

/* Dashboard Top 5 program cards: uniform flat color and typography */
html body .dashboard-calls-overview-box .dashboard-top-five-program-card,
html body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(1),
html body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(2),
html body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(3),
html body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(4),
html body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(5),
html body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(odd),
html body .dashboard-calls-overview-box .dashboard-top-five-program-card:nth-child(even),
html body .dashboard-top-five-program-card {
  border: 1px solid #bbf7d0 !important;
  border-left: 4px solid #10b981 !important;
  background: #f8fffb !important;
  background-image: none !important;
  box-shadow: 0 8px 18px rgba(16, 185, 129, .08) !important;
}

html body .dashboard-top-five-main strong {
  font-size: 13px !important;
  line-height: 1.22 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .01em !important;
  color: #082f49 !important;
}

html body .dashboard-top-five-main small {
  font-size: 13px !important;
  line-height: 1.22 !important;
  font-weight: 500 !important;
  color: #475569 !important;
}

html body .dashboard-top-five-program-card b {
  min-width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  background: #dcfce7 !important;
  color: #047857 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

html body .dashboard-top-five-rank {
  color: #059669 !important;
}

/* Top 5 Stations card: keep 5 cards in one row on desktop */
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-list {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

@media (max-width: 1300px) {
  html body .dashboard-top-stations-7d-card .dashboard-top-five-program-list {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  html body .dashboard-top-stations-7d-card .dashboard-top-five-program-list {
    grid-template-columns: 1fr !important;
  }
}

/* Force Top 5 Stations card into 5 equal columns */
html body .dashboard-top-stations-7d-card > .dashboard-top-five-program-list,
html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card > .dashboard-top-five-program-list {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 12px !important;
  align-items: stretch !important;
}

html body .dashboard-top-stations-7d-card > .dashboard-top-five-program-list > .dashboard-top-five-program-card,
html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card > .dashboard-top-five-program-list > .dashboard-top-five-program-card {
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: 26px minmax(0, 1fr) auto !important;
}

@media (max-width: 1300px) {
  html body .dashboard-top-stations-7d-card > .dashboard-top-five-program-list,
  html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card > .dashboard-top-five-program-list {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  html body .dashboard-top-stations-7d-card > .dashboard-top-five-program-list,
  html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card > .dashboard-top-five-program-list {
    grid-template-columns: 1fr !important;
  }
}

/* Calls overview visual separation: green shell, distinct inner section colors */
html body .dashboard-calls-overview-box {
  background: #f0fdf4 !important;
  border-color: #bbf7d0 !important;
}

html body .dashboard-calls-overview-box > .overview-box-head {
  background: #ecfdf5 !important;
  border-bottom-color: #bbf7d0 !important;
}

html body .dashboard-calls-overview-box .dashboard-call-metric-grid .sims-metric-card {
  background: #ffffff !important;
  border-color: #86efac !important;
  border-left: 4px solid #10b981 !important;
  box-shadow: 0 8px 18px rgba(16, 185, 129, .08) !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card {
  background: #fff7ed !important;
  border-color: #fed7aa !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card > .dashboard-category-head {
  background: #fff7ed !important;
  border-bottom-color: #fed7aa !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card .dashboard-top-five-program-card {
  background: #fffbf5 !important;
  border-color: #fdba74 !important;
  border-left-color: #f97316 !important;
  box-shadow: 0 8px 18px rgba(249, 115, 22, .08) !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card .dashboard-top-five-rank,
html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card .dashboard-top-five-rank i {
  color: #ea580c !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card .dashboard-top-five-program-card b {
  background: #ffedd5 !important;
  color: #c2410c !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card {
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card > .dashboard-category-head {
  background: #eff6ff !important;
  border-bottom-color: #bfdbfe !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card .dashboard-top-five-program-card {
  background: #f8fbff !important;
  border-color: #93c5fd !important;
  border-left-color: #3b82f6 !important;
  box-shadow: 0 8px 18px rgba(59, 130, 246, .08) !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card .dashboard-top-five-rank,
html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card .dashboard-top-five-rank i {
  color: #2563eb !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card .dashboard-top-five-program-card b {
  background: #dbeafe !important;
  color: #1d4ed8 !important;
}

/* SMS overview: remove gradients/mixed tones and keep one clean blue theme */
html body .dashboard-sms-overview-box {
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
}

html body .dashboard-sms-overview-box > .overview-box-head {
  background: #eff6ff !important;
  border-bottom-color: #bfdbfe !important;
}

html body .dashboard-sms-overview-box .sims-metric-card,
html body .dashboard-sms-overview-box .sims-metric-card.is-blue,
html body .dashboard-sms-overview-box .sims-metric-card.is-green,
html body .dashboard-sms-overview-box .sims-metric-card.is-red,
html body .dashboard-sms-overview-box .sims-metric-card.is-orange,
html body .dashboard-sms-overview-box .sims-metric-card.is-purple,
html body .dashboard-sms-overview-box .sims-metric-card.is-teal,
html body .dashboard-sms-overview-box .sims-metric-card.is-slate {
  background: #ffffff !important;
  background-image: none !important;
  border-color: #93c5fd !important;
  border-left: 4px solid #3b82f6 !important;
  box-shadow: 0 8px 18px rgba(59, 130, 246, .08) !important;
}

html body .dashboard-sms-overview-box .sims-metric-icon,
html body .dashboard-sms-overview-box .sims-metric-icon i {
  color: #2563eb !important;
}

html body .dashboard-sms-overview-box .sims-metric-value,
html body .dashboard-sms-overview-box .dashboard-code-metric strong,
html body .dashboard-sms-overview-box .dashboard-code-metric b {
  color: #1d4ed8 !important;
}

/* Refined distinct colors for Calls Overview detail sections */
html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card {
  background: #fffaf0 !important;
  border-color: #fde68a !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card > .dashboard-category-head {
  background: #fffbeb !important;
  border-bottom-color: #fde68a !important;
  color: #7c2d12 !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card > .dashboard-category-head i {
  color: #d97706 !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card .dashboard-top-five-program-card {
  background: #fffdf5 !important;
  border-color: #fcd34d !important;
  border-left-color: #f59e0b !important;
  box-shadow: 0 8px 18px rgba(245, 158, 11, .09) !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card .dashboard-top-five-rank,
html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card .dashboard-top-five-rank i {
  color: #b45309 !important;
}

html body .dashboard-calls-overview-box .dashboard-top-programs-24h-card .dashboard-top-five-program-card b {
  background: #fef3c7 !important;
  color: #92400e !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card > .dashboard-category-head {
  background: #f5f3ff !important;
  border-bottom-color: #c4b5fd !important;
  color: #312e81 !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card > .dashboard-category-head i {
  color: #6d28d9 !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card .dashboard-top-five-program-card {
  background: #fbfaff !important;
  border-color: #a78bfa !important;
  border-left-color: #7c3aed !important;
  box-shadow: 0 8px 18px rgba(124, 58, 237, .09) !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card .dashboard-top-five-rank,
html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card .dashboard-top-five-rank i {
  color: #6d28d9 !important;
}

html body .dashboard-calls-overview-box .dashboard-top-stations-7d-card .dashboard-top-five-program-card b {
  background: #ede9fe !important;
  color: #5b21b6 !important;
}

/* Calls overview: flat green only for metric section; detail cards sit separately */
html body .dashboard-calls-overview-box {
  background: #f0fdf4 !important;
  background-image: none !important;
  border-color: #bbf7d0 !important;
  box-shadow: 0 8px 18px rgba(22, 163, 74, .06) !important;
}

html body .dashboard-calls-overview-box > .overview-box-head {
  background: #f0fdf4 !important;
  background-image: none !important;
  border-bottom-color: #bbf7d0 !important;
}

html body .dashboard-calls-overview-box .dashboard-call-metric-grid .sims-metric-card {
  background: #ffffff !important;
  background-image: none !important;
}

html body .dashboard-overview-sections > .dashboard-top-programs-24h-card,
html body .dashboard-overview-sections > .dashboard-top-stations-7d-card {
  grid-column: 1 / -1 !important;
  margin-top: 0 !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, .06) !important;
}

html body .dashboard-overview-sections > .dashboard-top-programs-24h-card {
  background: #fffaf0 !important;
  background-image: none !important;
  border: 1px solid #fde68a !important;
}

html body .dashboard-overview-sections > .dashboard-top-stations-7d-card {
  background: #f5f3ff !important;
  background-image: none !important;
  border: 1px solid #c4b5fd !important;
}

html body .dashboard-overview-sections > .dashboard-top-programs-24h-card > .dashboard-category-head,
html body .dashboard-overview-sections > .dashboard-top-stations-7d-card > .dashboard-category-head {
  background-image: none !important;
}

/* Call detail cities: retain the S# column and make merged city groups explicit. */
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-name,
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist,
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-ser {
  font-family: var(--slims-font-family) !important;
  font-weight: 600 !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist.call-detail-dist-grouped {
  padding: 8px !important;
  vertical-align: middle !important;
  background: #f4f9ff !important;
  border-left: 1px solid #cbd8e8 !important;
  border-right: 1px solid #cbd8e8 !important;
}
html body .call-detail-report-table .call-city-group {
  display: flex !important;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  padding: 7px 5px;
  border-radius: 7px;
  background: #ffffff;
  color: #0f5f57;
  line-height: 1.25;
}
html body .call-detail-report-table .call-city-group-name {
  font-family: var(--slims-font-family) !important;
  font-size: 14px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
html body .call-detail-report-table .call-city-group small {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 7px;
  border-radius: 999px;
  background: #dff5ef;
  color: #0f766e;
  font-family: var(--slims-font-family) !important;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}
/* Final flat colors: no gradients in Calls Overview and Top 5 cards */
html body .dashboard-calls-overview-box,
html body .dashboard-calls-overview-box *,
html body .dashboard-top-programs-24h-card,
html body .dashboard-top-programs-24h-card *,
html body .dashboard-top-stations-7d-card,
html body .dashboard-top-stations-7d-card * {
  background-image: none !important;
}

/* Calls Overview metric cards: flat green theme */
html body .dashboard-calls-overview-box .sims-metric-card,
html body .dashboard-calls-overview-box .sims-metric-card.is-blue,
html body .dashboard-calls-overview-box .sims-metric-card.is-green,
html body .dashboard-calls-overview-box .sims-metric-card.is-teal,
html body .dashboard-calls-overview-box .sims-metric-card.is-purple,
html body .dashboard-calls-overview-box .sims-metric-card.is-orange,
html body .dashboard-calls-overview-box .sims-metric-card.is-red,
html body .dashboard-calls-overview-box .sims-metric-card.is-slate {
  background: #ffffff !important;
  border-color: #86efac !important;
  border-left: 4px solid #10b981 !important;
  box-shadow: 0 8px 18px rgba(16, 185, 129, .07) !important;
}

html body .dashboard-calls-overview-box .sims-metric-icon,
html body .dashboard-calls-overview-box .sims-metric-icon i {
  color: #059669 !important;
}

/* Top 5 Programs cards: flat amber theme according to its box */
html body .dashboard-top-programs-24h-card {
  background: #fffaf0 !important;
  border-color: #fde68a !important;
}

html body .dashboard-top-programs-24h-card > .dashboard-category-head {
  background: #fffbeb !important;
  border-bottom-color: #fde68a !important;
  color: #7c2d12 !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card,
html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card:nth-child(odd),
html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card:nth-child(even) {
  background: #fffdf5 !important;
  border-color: #fcd34d !important;
  border-left: 4px solid #f59e0b !important;
  box-shadow: 0 8px 18px rgba(245, 158, 11, .07) !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card b {
  background: #fef3c7 !important;
  color: #92400e !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-rank,
html body .dashboard-top-programs-24h-card .dashboard-top-five-rank i {
  color: #b45309 !important;
}

/* Top 5 Stations cards: flat violet theme according to its box */
html body .dashboard-top-stations-7d-card {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
}

html body .dashboard-top-stations-7d-card > .dashboard-category-head {
  background: #f5f3ff !important;
  border-bottom-color: #c4b5fd !important;
  color: #312e81 !important;
}

html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card:nth-child(odd),
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card:nth-child(even) {
  background: #fbfaff !important;
  border-color: #a78bfa !important;
  border-left: 4px solid #7c3aed !important;
  box-shadow: 0 8px 18px rgba(124, 58, 237, .07) !important;
}

html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card b {
  background: #ede9fe !important;
  color: #5b21b6 !important;
}

html body .dashboard-top-stations-7d-card .dashboard-top-five-rank,
html body .dashboard-top-stations-7d-card .dashboard-top-five-rank i {
  color: #6d28d9 !important;
}

/* Sleek look for Top 5 Programs and Top 5 Stations cards */
html body .dashboard-top-programs-24h-card,
html body .dashboard-top-stations-7d-card {
  border-radius: 16px !important;
  overflow: hidden !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-list,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-list {
  padding: 14px !important;
  gap: 14px !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card {
  min-height: 74px !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  grid-template-columns: 20px minmax(0, 1fr) 34px !important;
  gap: 12px !important;
  align-items: center !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card:hover,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card:hover {
  transform: translateY(-2px) !important;
  text-decoration: none !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-rank,
html body .dashboard-top-stations-7d-card .dashboard-top-five-rank {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-main,
html body .dashboard-top-stations-7d-card .dashboard-top-five-main {
  gap: 3px !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-main strong,
html body .dashboard-top-stations-7d-card .dashboard-top-five-main strong {
  font-size: 12.5px !important;
  line-height: 1.18 !important;
  font-weight: 700 !important;
  letter-spacing: .015em !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-main small,
html body .dashboard-top-stations-7d-card .dashboard-top-five-main small {
  font-size: 12px !important;
  line-height: 1.15 !important;
  font-weight: 500 !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card b,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card b {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card:hover {
  border-color: #f59e0b !important;
  box-shadow: 0 12px 24px rgba(245, 158, 11, .12) !important;
}

html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card:hover {
  border-color: #7c3aed !important;
  box-shadow: 0 12px 24px rgba(124, 58, 237, .12) !important;
}
/* Final call-detail table alignment: each row owns its city cell, keeping S# in one column. */
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-date::before {
  content: none !important;
  display: none !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row :is(.call-detail-date, .call-detail-name, .call-detail-dist) {
  font-family: var(--slims-font-family) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-date {
  color: #08245c !important;
  text-align: center !important;
  white-space: nowrap !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-name {
  color: #08245c !important;
  text-align: center !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  padding: 8px 10px !important;
  color: #0f766e !important;
  text-align: center !important;
  vertical-align: middle !important;
}
html body .call-detail-report-table .call-city-name {
  font-family: var(--slims-font-family) !important;
  font: inherit !important;
  overflow-wrap: anywhere;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist.is-city-group {
  background: #f4fbf9 !important;
  border-left: 3px solid #54a99a !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist.is-city-group-start {
  border-top: 1px solid #a9d8cf !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist.is-city-group-member {
  color: #277b70 !important;
}

/* ABSOLUTE FINAL: remove Calls Overview gradients completely */
html body .dashboard-overview-box.dashboard-calls-overview-box,
html body section.dashboard-overview-box.dashboard-calls-overview-box {
  background: #f0fdf4 !important;
  background-color: #f0fdf4 !important;
  background-image: none !important;
  border-color: #bbf7d0 !important;
}

html body .dashboard-overview-box.dashboard-calls-overview-box::before,
html body .dashboard-overview-box.dashboard-calls-overview-box::after,
html body .dashboard-calls-overview-box::before,
html body .dashboard-calls-overview-box::after {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  content: none !important;
}

html body .dashboard-calls-overview-box > .overview-box-head,
html body .dashboard-calls-overview-box .overview-box-head,
html body .dashboard-calls-overview-box .dashboard-call-metric-grid,
html body .dashboard-calls-overview-box .overview-box-grid {
  background: #f0fdf4 !important;
  background-color: #f0fdf4 !important;
  background-image: none !important;
}

html body .dashboard-calls-overview-box .dashboard-call-metric-grid > .sims-metric-card,
html body .dashboard-calls-overview-box .dashboard-call-metric-grid > .sims-metric-card:nth-child(1),
html body .dashboard-calls-overview-box .dashboard-call-metric-grid > .sims-metric-card:nth-child(2),
html body .dashboard-calls-overview-box .dashboard-call-metric-grid > .sims-metric-card:nth-child(odd),
html body .dashboard-calls-overview-box .dashboard-call-metric-grid > .sims-metric-card:nth-child(even),
html body .dashboard-calls-overview-box .sims-metric-card,
html body .dashboard-calls-overview-box .sims-metric-card.is-blue,
html body .dashboard-calls-overview-box .sims-metric-card.is-teal {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border-color: #86efac !important;
  border-left: 4px solid #10b981 !important;
}

/* Extra sleek compact cards for Top 5 dashboard sections */
html body .dashboard-top-programs-24h-card .dashboard-top-five-program-list,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-list {
  padding: 12px 16px !important;
  gap: 12px !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card {
  min-height: 58px !important;
  height: 58px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  grid-template-columns: 18px minmax(0, 1fr) 28px !important;
  gap: 10px !important;
  align-items: center !important;
  border-width: 1px !important;
  border-left-width: 3px !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, .05) !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card:hover,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 20px rgba(15, 23, 42, .08) !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-rank,
html body .dashboard-top-stations-7d-card .dashboard-top-five-rank {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-rank i,
html body .dashboard-top-stations-7d-card .dashboard-top-five-rank i {
  font-size: 11px !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-main strong,
html body .dashboard-top-stations-7d-card .dashboard-top-five-main strong {
  font-size: 12px !important;
  line-height: 1.12 !important;
  letter-spacing: .012em !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-main small,
html body .dashboard-top-stations-7d-card .dashboard-top-five-main small {
  font-size: 11px !important;
  line-height: 1.1 !important;
}

html body .dashboard-top-programs-24h-card .dashboard-top-five-program-card b,
html body .dashboard-top-stations-7d-card .dashboard-top-five-program-card b {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  border-radius: 10px !important;
  font-size: 12px !important;
  box-shadow: none !important;
}

/* Match SMS/Calls overview metric count size with Top 5 count badges */
html body .dashboard-sms-overview-box .sims-metric-value,
html body .dashboard-calls-overview-box .sims-metric-value {
  min-width: 28px !important;
  height: 28px !important;
  padding: 0 8px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
}

html body .dashboard-sms-overview-box .sims-metric-value {
  background: #dbeafe !important;
  color: #1d4ed8 !important;
}

html body .dashboard-calls-overview-box .sims-metric-value {
  background: #dcfce7 !important;
  color: #047857 !important;
}

html body .dashboard-sms-overview-box .dashboard-code-metric strong,
html body .dashboard-sms-overview-box .dashboard-code-metric b {
  min-width: 28px !important;
  height: 28px !important;
  padding: 0 8px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  background: #dbeafe !important;
  color: #1d4ed8 !important;
}

/* SMS Code Wise counts: same compact font as other dashboard count badges */
html body .dashboard-sms-overview-box .dashboard-code-metric,
html body .dashboard-sms-overview-box .dashboard-code-metric * {
  font-size: 12px !important;
  line-height: 1 !important;
}

html body .dashboard-sms-overview-box .dashboard-code-metric strong,
html body .dashboard-sms-overview-box .dashboard-code-metric b,
html body .dashboard-sms-overview-box .dashboard-code-metric .dashboard-code-count,
html body .dashboard-sms-overview-box .dashboard-code-metric .sims-metric-value,
html body .dashboard-sms-overview-box .dashboard-code-metric span:last-child {
  min-width: 28px !important;
  height: 28px !important;
  padding: 0 8px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  background: #dbeafe !important;
  color: #1d4ed8 !important;
}

html body .dashboard-sms-overview-box .dashboard-code-metric small,
html body .dashboard-sms-overview-box .dashboard-code-metric label,
html body .dashboard-sms-overview-box .dashboard-code-metric em {
  font-size: 10px !important;
  line-height: 1 !important;
  font-style: normal !important;
}

/* FINAL dashboard SMS count size fix: make all SMS overview counts consistent */
html body .dashboard-sms-overview-box .sims-metric-card .sims-metric-value,
html body .dashboard-sms-overview-box .sms-dual-code-card .sms-dual-code-values a b,
html body .dashboard-sms-overview-box .sms-dual-code-values a b,
html body .dashboard-sms-kpi-grid .sims-metric-card .sims-metric-value,
html body .dashboard-sms-kpi-grid .sms-dual-code-values a b {
  width: auto !important;
  min-width: 28px !important;
  max-width: none !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 8px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  background: #dbeafe !important;
  color: #1d4ed8 !important;
  box-shadow: none !important;
}

html body .dashboard-sms-overview-box .sms-dual-code-values {
  gap: 8px !important;
}

html body .dashboard-sms-overview-box .sms-dual-code-values a {
  padding: 0 !important;
  gap: 4px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .dashboard-sms-overview-box .sms-dual-code-values a span,
html body .dashboard-sms-kpi-grid .sms-dual-code-values a span {
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  color: #64748b !important;
}

html body .dashboard-sms-overview-box .sms-dual-code-card .sims-metric-value,
html body .dashboard-sms-overview-box .sms-dual-code-card b,
html body .dashboard-sms-kpi-grid .sms-dual-code-card b {
  font-size: 12px !important;
}
/* Production report: keep cities in every row and restore the region chart summary layout. */
html body .call-detail-report-table tbody tr.call-detail-data-row :is(.call-detail-date, .call-detail-name, .call-detail-dist),
html body .call-detail-report-table .call-city-name {
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 1.45 !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-date::before {
  content: none !important;
  display: none !important;
}
html body .call-category-region-chart {
  display: block !important;
  overflow: hidden !important;
  border: 1px solid #cfe1ff !important;
  border-radius: 10px !important;
  background: #ffffff !important;
}
html body .call-category-region-chart > .call-category-region-head {
  min-height: 92px !important;
  margin: 0 !important;
  padding: 18px 160px !important;
  background: #f4f8ff !important;
  border-bottom: 1px solid #d5e4fa !important;
}
html body .call-category-region-chart > .call-category-region-head h2 {
  margin: 0 !important;
  color: #08245c !important;
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  text-align: center !important;
}
html body .call-category-region-chart > .call-category-region-head p {
  margin: 4px 0 0 !important;
  color: #2458a8 !important;
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-align: center !important;
}
html body .call-category-region-summary {
  display: grid !important;
  grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
  margin: 0 !important;
  padding: 14px 18px !important;
  background: #fbfdff !important;
  border-bottom: 1px solid #e0ebfa !important;
}
html body .call-category-region-total,
html body .call-category-region-stat {
  display: flex !important;
  min-width: 0 !important;
  min-height: 62px !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  gap: 2px !important;
  padding: 8px 6px !important;
  border: 1px solid #d6e5f8 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #163968 !important;
  font-family: Poppins, Arial, sans-serif !important;
  text-align: center !important;
}
html body .call-category-region-total { background: #eef6ff !important; border-color: #a9ccfb !important; }
html body .call-category-region-total span,
html body .call-category-region-stat span { font-size: 11px !important; font-weight: 500 !important; }
html body .call-category-region-total strong,
html body .call-category-region-stat strong { font-size: 16px !important; font-weight: 700 !important; line-height: 1.1 !important; }
html body .call-category-region-stat small { font-size: 10px !important; color: #55708f !important; }
html body .call-category-region-stat span i { display: inline-block !important; width: 8px !important; height: 8px !important; margin-right: 4px !important; border-radius: 50% !important; background: var(--region-color) !important; }
@media (max-width: 980px) { html body .call-category-region-summary { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
/* Analytics graphs: use the panel background rather than an isolated white chart rectangle. */
html body .reports-analytics-page .google-stacked-chart-stage,
html body .reports-analytics-page .google-stacked-chart-stage > div,
html body .reports-analytics-page .google-stacked-chart-stage svg {
  background: transparent !important;
}
html body .reports-analytics-page .google-stacked-chart-stage svg > rect:first-child {
  fill: transparent !important;
}

/* Province title, count and exclude control remain together on one neat line. */
html body .call-detail-report-table .call-province-row-controls {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 9px !important;
}
html body .call-detail-report-table .call-province-exclude-one {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 5px 9px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: var(--province-color) !important;
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}
html body .call-detail-report-table .call-province-exclude-one input {
  width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  accent-color: var(--province-color) !important;
}
html body .call-detail-report-table .call-province-exclude-one span {
  color: inherit !important;
  font: inherit !important;
}
/* Caller details use the same Urdu typeface as the call message on every environment. */
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-date::before {
  content: none !important;
  display: none !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row :is(.call-detail-name, .call-detail-dist),
html body .call-detail-report-table .call-city-name {
  font-family: 'Jameel Noori Nastaleeq', 'Noto Nastaliq Urdu', 'Noto Naskh Arabic', 'Urdu Typesetting', serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.8 !important;
  direction: rtl !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-name,
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist {
  text-align: center !important;
}
/* Directly lock city text to the caller-name Urdu typeface. */
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-dist .call-city-name {
  font-family: 'Jameel Noori Nastaleeq', 'Noto Nastaliq Urdu', 'Noto Naskh Arabic', 'Urdu Typesetting', serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  line-height: 1.8 !important;
  letter-spacing: 0 !important;
}
/* Province strip layout: toggle left, province/count centered, exclude aligned right. */
html body .call-detail-report-table .call-detail-province-row > td {
  position: relative !important;
  min-height: 62px !important;
  padding: 7px 150px !important;
}
html body .call-detail-report-table .call-province-row-controls {
  display: flex !important;
  width: 100% !important;
  min-height: 42px !important;
  align-items: center !important;
  justify-content: center !important;
}
html body .call-detail-report-table .call-province-toggle {
  position: static !important;
  margin: 0 auto !important;
}
html body .call-detail-report-table .call-province-exclude-one {
  position: absolute !important;
  top: 50% !important;
  right: 18px !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
}
@media (max-width: 680px) {
  html body .call-detail-report-table .call-detail-province-row > td { padding: 7px 12px !important; }
  html body .call-detail-report-table .call-province-row-controls { flex-direction: column !important; gap: 6px !important; }
  html body .call-detail-report-table .call-province-exclude-one { position: static !important; transform: none !important; }
}
/* Caller details stay in English and use the shared SLIMS application typeface. */
html body .call-detail-report-table tbody tr.call-detail-data-row :is(.call-detail-name, .call-detail-dist),
html body .call-detail-report-table .call-detail-dist .call-city-name {
  font-family: var(--slims-font-family) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 1.45 !important;
  direction: ltr !important;
}
/* Call detail table: production-safe English caller fields and icon-free dates. */
html body .call-detail-report-table tbody tr.call-detail-data-row .call-detail-date::before {
  content: none !important;
  display: none !important;
}
html body .call-detail-report-table tbody tr.call-detail-data-row :is(.call-detail-name, .call-detail-dist),
html body .call-detail-report-table .call-detail-dist .call-city-name {
  font-family: var(--slims-font-family) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 1.45 !important;
  direction: ltr !important;
  unicode-bidi: isolate !important;
  text-align: center !important;
}
/* Announcement composer: optional specific-user recipient. */
.announcement-user-field{margin:0 0 16px;padding:14px 16px;border:1px solid #dce8f7;border-radius:10px;background:#f8fbff}
.announcement-user-field .form-select{min-height:44px}
.announcement-user-field .form-label small{color:#7b8da5;font-weight:500}
.announcement-user-help{display:block;margin-top:6px;color:#71839a;font-size:11px;line-height:1.4}
/* Keep the Specific User selector prominent inside the recipient list. */
.announcement-specific-user-option{grid-column:1/-1;display:grid;grid-template-columns:minmax(190px,.65fr) minmax(240px,1.35fr);align-items:center;gap:14px;padding:13px 14px;border:2px solid #9fc1ff;border-radius:10px;background:#f3f7ff;box-shadow:0 2px 8px rgba(37,99,235,.08)}
.announcement-specific-user-title{display:flex;align-items:center;gap:11px;min-width:0}
.announcement-specific-user-title>i{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 40px;border-radius:10px;background:#2563eb;color:#fff}
.announcement-specific-user-title>span{display:flex;flex-direction:column;min-width:0}
.announcement-specific-user-title b{color:#173f70;font-size:14px;font-weight:700}
.announcement-specific-user-title small{color:#71839a;font-size:11px;line-height:1.35}
.announcement-specific-user-option .form-select{min-height:44px;border-color:#8bb5ff!important;background-color:#fff!important;color:#183b66!important;font-weight:600}
.announcement-specific-user-option .form-select:focus{border-color:#2563eb!important;box-shadow:0 0 0 3px rgba(37,99,235,.14)!important}
@media(max-width:700px){.announcement-specific-user-option{grid-template-columns:1fr}}
/* Recipient panel alignment: never overflow the compose column. */
html body .announcement-audience-box,
html body .announcement-audience-options{width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important}
html body .announcement-audience-options>*{min-width:0!important;max-width:100%!important}
html body .announcement-specific-user-option{grid-template-columns:minmax(0,1fr)!important;width:100%!important;max-width:100%!important;min-width:0!important;gap:10px!important;box-sizing:border-box!important}
html body .announcement-specific-user-option .form-select{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;text-overflow:ellipsis!important}
html body .announcement-form-actions,
html body .announcement-form-actions .btn{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
/* Analytics caller city: show its field label directly below the value. */
html body .call-detail-report-table .call-detail-dist .call-city-name{display:block!important}
html body .call-detail-report-table .call-detail-dist .call-city-district-label{display:block!important;margin-top:3px!important;color:#71839a!important;font-family:var(--slims-font-family)!important;font-size:10px!important;font-weight:500!important;line-height:1.2!important;letter-spacing:.04em!important;text-transform:uppercase!important;direction:ltr!important;text-align:center!important}
/* FINAL Calls report-builder toolbar: full-width, aligned and responsive. */
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-workspace{
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr)!important;gap:10px!important;width:100%!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette{
  grid-column:1!important;grid-row:1!important;width:100%!important;min-width:0!important;max-width:100%!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-canvas-wrap{
  grid-column:1!important;grid-row:2!important;display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr)!important;gap:10px!important;width:100%!important;min-width:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{
  grid-column:1!important;grid-row:1!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important;gap:8px!important;width:100%!important;max-width:100%!important;min-height:60px!important;padding:9px!important;border:1px solid #cfe1ff!important;border-radius:9px!important;background:#f7fbff!important;overflow:visible!important;box-sizing:border-box!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-export-icon,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-generate-trigger{
  width:auto!important;min-width:132px!important;max-width:none!important;height:42px!important;min-height:42px!important;max-height:42px!important;display:inline-flex!important;flex:0 0 auto!important;align-items:center!important;justify-content:center!important;gap:8px!important;margin:0!important;padding:9px 13px!important;border:1px solid #b9d5ff!important;border-radius:8px!important;background:#fff!important;color:#082b66!important;font-size:12px!important;font-weight:600!important;line-height:1!important;white-space:nowrap!important;box-shadow:0 1px 2px rgba(8,36,92,.05)!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button i,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions i{width:15px!important;font-size:13px!important;text-align:center!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions{
  display:flex!important;flex-direction:row!important;align-items:center!important;flex-wrap:wrap!important;gap:8px!important;width:auto!important;margin:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions>details{width:auto!important;min-width:0!important;height:42px!important;min-height:42px!important;max-height:none!important;flex:0 0 auto!important;margin:0!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-pagination{
  display:flex!important;grid-template-columns:none!important;align-items:center!important;justify-content:flex-end!important;flex-wrap:wrap!important;gap:6px!important;width:auto!important;max-width:100%!important;margin:0 0 0 auto!important;padding:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-page-btn{min-width:76px!important;height:34px!important;margin:0!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-list.report-builder-preview{
  grid-column:1!important;grid-row:2!important;width:100%!important;min-width:0!important;min-height:calc(94vh - 300px)!important;max-height:calc(94vh - 300px)!important
}
@media(max-width:760px){
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button,
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-export-icon,
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-generate-trigger{width:100%!important;min-width:0!important}
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions{display:contents!important}
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-pagination{grid-column:1/-1!important;justify-content:center!important;margin:0!important}
}
/* Analytics city-to-district badge from Pakistan Locations data. */
html body .call-detail-report-table .call-detail-dist .call-city-district-badge{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:3px 5px!important;max-width:calc(100% - 8px)!important;margin:6px auto 0!important;padding:4px 8px!important;border:1px solid #f5b301!important;border-radius:999px!important;background:#fff3a6!important;color:#c1121f!important;font-family:var(--slims-font-family)!important;font-size:10px!important;font-weight:700!important;line-height:1.2!important;letter-spacing:0!important;text-transform:none!important;direction:ltr!important;text-align:center!important;box-shadow:0 1px 3px rgba(193,18,31,.10)!important}
html body .call-detail-report-table .call-detail-dist .call-city-district-badge span{color:#9f1239!important;font:inherit!important;text-transform:uppercase!important}
/* Group repeated analytics city/district values into one merged table cell. */
html body .call-detail-report-table .call-detail-dist.call-detail-dist-grouped{vertical-align:middle!important;text-align:center!important;background:#f2fbf8!important;border-left:2px solid #43aaa1!important;border-right:1px solid #cfe1ff!important}
html body .call-detail-report-table .call-detail-dist.call-detail-dist-grouped .call-city-name{margin:0 auto!important}
html body .call-detail-report-table .call-detail-dist .call-city-district-badge{display:table!important;width:auto!important;max-width:calc(100% - 12px)!important;margin:7px auto 0!important;padding:4px 10px!important}
/* FINAL Calls builder restoration: controls left, palette above canvas. */
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-workspace{
  display:grid!important;grid-template-columns:190px minmax(0,1fr)!important;grid-template-rows:118px minmax(0,1fr)!important;gap:10px!important;width:100%!important;align-items:start!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-canvas-wrap{display:contents!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette{
  grid-column:2!important;grid-row:1!important;width:100%!important;min-width:0!important;max-width:none!important;height:118px!important;min-height:118px!important;max-height:118px!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{
  grid-column:1!important;grid-row:1 / span 2!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;flex-wrap:nowrap!important;gap:7px!important;width:190px!important;max-width:190px!important;min-height:112px!important;padding:8px!important;overflow:visible!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-export-icon,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions .report-generate-trigger{
  width:100%!important;min-width:0!important;max-width:100%!important;height:42px!important;min-height:42px!important;max-height:42px!important;display:flex!important;flex:0 0 42px!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;margin:0!important;padding:9px 12px!important;white-space:nowrap!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions{
  display:flex!important;flex-direction:column!important;align-items:stretch!important;flex-wrap:nowrap!important;gap:7px!important;width:100%!important;margin:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions>button,
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions>details{width:100%!important;height:42px!important;min-height:42px!important;max-height:none!important;flex:0 0 auto!important;margin:0!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-pagination{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:center!important;gap:5px!important;width:100%!important;max-width:100%!important;margin:4px 0 0!important;padding:6px!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-page-btn{min-width:0!important;width:100%!important;height:34px!important}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-list.report-builder-preview{
  grid-column:2!important;grid-row:2!important;width:100%!important;min-width:0!important;min-height:calc(94vh - 255px)!important;max-height:calc(94vh - 255px)!important;margin:0!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-drop-cell:empty{
  position:relative!important;display:grid!important;place-items:center!important;min-height:180px!important;border:2px dashed #91baf5!important;border-radius:10px!important;background:linear-gradient(180deg,#fafdff,#f2f7ff)!important;color:#55769f!important
}
html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-drop-cell:empty::before{
  content:'Drop section here'!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:8px 13px!important;border:1px solid #c6daf8!important;border-radius:999px!important;background:#fff!important;color:#35659f!important;font:600 12px/1 var(--slims-font-family)!important
}
@media(max-width:900px){
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-workspace{grid-template-columns:1fr!important;grid-template-rows:auto auto minmax(0,1fr)!important}
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-palette{grid-column:1!important;grid-row:1!important}
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-row-controls{grid-column:1!important;grid-row:2!important;width:100%!important;max-width:100%!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-toolbar-actions{display:contents!important}
  html body .report-builder-modal.is-server-rendered:not(.is-sms-builder) .report-builder-list.report-builder-preview{grid-column:1!important;grid-row:3!important;max-height:none!important}
}
/* Dashboard category call extremes: two distinct five-card rows. */
.dashboard-category-extreme-section{grid-column:1/-1;border:1px solid var(--category-border);border-radius:18px;padding:18px;background:linear-gradient(135deg,var(--category-soft),#fff);box-shadow:0 10px 28px rgba(15,23,42,.07);overflow:hidden}
.dashboard-category-extreme-head{display:flex;align-items:center;margin-bottom:14px}
.dashboard-category-extreme-head h2{margin:0;color:var(--category-deep);font-size:18px;font-weight:800;letter-spacing:.01em}
.dashboard-category-extreme-head i{margin-right:9px;color:var(--category-accent)}
.dashboard-category-extreme-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.dashboard-category-extreme-card{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto;gap:3px 10px;align-items:center;min-height:92px;padding:15px;border:1px solid var(--category-border);border-radius:14px;background:#fff;color:#162d52;text-decoration:none;box-shadow:0 7px 18px rgba(15,23,42,.06);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.dashboard-category-extreme-rank{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--category-accent);color:#fff;font-size:14px;font-weight:900}
.dashboard-category-extreme-name{min-width:0;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.dashboard-category-extreme-card strong{grid-row:1/3;grid-column:3;font-size:25px;line-height:1;color:var(--category-deep)}
.dashboard-category-extreme-card small{grid-column:2;color:#73829b;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.dashboard-category-extreme-empty{grid-column:1/-1;padding:18px;text-align:center;color:#718096}
.dashboard-category-extreme-section.is-top-categories{--category-accent:#c026d3;--category-deep:#86198f;--category-soft:#fdf4ff;--category-border:#f0abfc}
.dashboard-category-extreme-section.is-low-categories{--category-accent:#65a30d;--category-deep:#3f6212;--category-soft:#f7fee7;--category-border:#bef264}
@media(max-width:1100px){.dashboard-category-extreme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.dashboard-category-extreme-grid{grid-template-columns:1fr}.dashboard-category-extreme-card{min-height:78px}}

/* Final dashboard layout: overview pair above four equal five-row columns. */
html body .dashboard-overview-sections{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
}
html body .dashboard-overview-sections>.dashboard-sms-overview-box{grid-column:1/span 2!important}
html body .dashboard-overview-sections>.dashboard-calls-overview-box{grid-column:3/span 2!important}
html body .dashboard-overview-sections>.dashboard-top-programs-24h-card,
html body .dashboard-overview-sections>.dashboard-top-stations-7d-card,
html body .dashboard-overview-sections>.dashboard-category-ranking-card{
  grid-column:auto!important;
  min-width:0!important;
  margin:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  box-shadow:0 10px 22px rgba(15,23,42,.06)!important;
}
html body .dashboard-overview-sections>.dashboard-top-programs-24h-card .dashboard-top-five-program-list,
html body .dashboard-overview-sections>.dashboard-top-stations-7d-card .dashboard-top-five-program-list,
html body .dashboard-overview-sections>.dashboard-category-ranking-card .dashboard-top-five-program-list{
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:repeat(5,minmax(58px,auto))!important;
  align-content:start!important;
  padding:12px!important;
  gap:10px!important;
}
html body .dashboard-category-ranking-card{background:#fff!important;background-image:none!important}
html body .dashboard-category-ranking-card>.dashboard-category-head{background-image:none!important}
html body .dashboard-category-ranking-card .dashboard-top-five-program-card{
  min-height:58px!important;
  height:auto!important;
  padding:10px 12px!important;
  border-radius:12px!important;
  grid-template-columns:18px minmax(0,1fr) 34px!important;
  gap:10px!important;
  align-items:center!important;
  background:#fff!important;
  background-image:none!important;
}
html body .dashboard-category-ranking-card.is-top-categories{border:1px solid #f0abfc!important;background:#fdf4ff!important}
html body .dashboard-category-ranking-card.is-top-categories>.dashboard-category-head{background:#fae8ff!important;color:#86198f!important}
html body .dashboard-category-ranking-card.is-top-categories .dashboard-top-five-program-card{border-color:#f0abfc!important}
html body .dashboard-category-ranking-card.is-top-categories .dashboard-top-five-rank,
html body .dashboard-category-ranking-card.is-top-categories .dashboard-top-five-program-card>b{color:#a21caf!important}
html body .dashboard-category-ranking-card.is-low-categories{border:1px solid #bef264!important;background:#f7fee7!important}
html body .dashboard-category-ranking-card.is-low-categories>.dashboard-category-head{background:#ecfccb!important;color:#3f6212!important}
html body .dashboard-category-ranking-card.is-low-categories .dashboard-top-five-program-card{border-color:#bef264!important}
html body .dashboard-category-ranking-card.is-low-categories .dashboard-top-five-rank,
html body .dashboard-category-ranking-card.is-low-categories .dashboard-top-five-program-card>b{color:#4d7c0f!important}
@media(max-width:1200px){
 html body .dashboard-overview-sections{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 html body .dashboard-overview-sections>.dashboard-sms-overview-box,
 html body .dashboard-overview-sections>.dashboard-calls-overview-box{grid-column:auto!important}
}
@media(max-width:700px){
 html body .dashboard-overview-sections{grid-template-columns:1fr!important}
}

/* Category ranking links: compact icons and clear clickable state. */
html body .dashboard-category-ranking-card .dashboard-category-small-icon{
  display:grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  border-radius:7px!important;
  font-size:11px!important;
  background:currentColor!important;
}
html body .dashboard-category-ranking-card .dashboard-category-small-icon i{color:#fff!important;font-size:11px!important}
html body .dashboard-category-ranking-card .dashboard-category-analytics-link{cursor:pointer!important}
html body .dashboard-category-ranking-card .dashboard-category-analytics-link:hover,
html body .dashboard-category-ranking-card .dashboard-category-analytics-link:focus-visible{
  transform:translateY(-2px)!important;
  box-shadow:0 8px 18px rgba(15,23,42,.12)!important;
  text-decoration:none!important;
  outline:none!important;
}

/* Dedicated four-column dashboard ranking row. */
html body .dashboard-overview-sections>.dashboard-four-column-rankings{
  grid-column:1/-1!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
  min-width:0!important;
}
html body .dashboard-four-column-rankings>.dashboard-top-programs-24h-card,
html body .dashboard-four-column-rankings>.dashboard-top-stations-7d-card,
html body .dashboard-four-column-rankings>.dashboard-category-ranking-card{
  grid-column:auto!important;
  width:auto!important;
  min-width:0!important;
  margin:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  box-shadow:0 10px 22px rgba(15,23,42,.06)!important;
}
html body .dashboard-four-column-rankings .dashboard-top-five-program-list{
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:repeat(5,minmax(58px,auto))!important;
  align-content:start!important;
  gap:10px!important;
  padding:12px!important;
}
html body .dashboard-four-column-rankings .dashboard-top-five-program-card{
  width:100%!important;
  min-width:0!important;
  min-height:58px!important;
  height:auto!important;
  box-sizing:border-box!important;
}
/* Category icons have no tile/background; only the icon remains. */
html body .dashboard-category-ranking-card .dashboard-category-small-icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
}
html body .dashboard-category-ranking-card.is-top-categories .dashboard-category-small-icon i{color:#a21caf!important}
html body .dashboard-category-ranking-card.is-low-categories .dashboard-category-small-icon i{color:#4d7c0f!important}
html body .dashboard-category-ranking-card .dashboard-category-small-icon i{font-size:14px!important;background:transparent!important}
@media(max-width:900px){html body .dashboard-overview-sections>.dashboard-four-column-rankings{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:600px){html body .dashboard-overview-sections>.dashboard-four-column-rankings{grid-template-columns:1fr!important}}

/* Compact category ranking rows. */
html body .dashboard-four-column-rankings .dashboard-category-ranking-card .dashboard-top-five-program-list{
  grid-template-rows:repeat(5,minmax(46px,auto))!important;
  gap:8px!important;
  padding:10px!important;
}
html body .dashboard-four-column-rankings .dashboard-category-ranking-card .dashboard-top-five-program-card{
  min-height:46px!important;
  height:46px!important;
  padding:7px 10px!important;
  grid-template-columns:18px minmax(0,1fr) 30px!important;
  gap:8px!important;
  border-radius:10px!important;
}
html body .dashboard-category-ranking-card .dashboard-top-five-main strong{
  font-size:13px!important;
  line-height:1.15!important;
}
html body .dashboard-category-ranking-card .dashboard-top-five-program-card>b{
  font-size:14px!important;
}

/* Flat dashboard cards: normal borders, no embossed elevation. */
html body .dashboard-main-stat-grid .sims-metric-card,
html body .dashboard-overview-sections .dashboard-overview-box,
html body .dashboard-four-column-rankings>.dashboard-category-table-card,
html body .dashboard-four-column-rankings .dashboard-top-five-program-card,
html body .dashboard-category-ranking-card,
html body .dashboard-category-ranking-card .dashboard-category-analytics-link{
  box-shadow:none!important;
  filter:none!important;
}
html body .dashboard-four-column-rankings>.dashboard-category-table-card,
html body .dashboard-overview-sections .dashboard-overview-box{
  border-width:1px!important;
  border-style:solid!important;
}
html body .dashboard-main-stat-grid .sims-metric-card:hover,
html body .dashboard-overview-sections .dashboard-overview-box:hover,
html body .dashboard-four-column-rankings>.dashboard-category-table-card:hover,
html body .dashboard-four-column-rankings .dashboard-top-five-program-card:hover,
html body .dashboard-four-column-rankings .dashboard-top-five-program-card:focus-visible,
html body .dashboard-category-ranking-card .dashboard-category-analytics-link:hover,
html body .dashboard-category-ranking-card .dashboard-category-analytics-link:focus-visible{
  transform:none!important;
  box-shadow:none!important;
  filter:none!important;
}

/* Uniform headers across all four dashboard ranking columns. */
html body .dashboard-four-column-rankings>.dashboard-category-table-card>.dashboard-category-head{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  min-height:78px!important;
  height:78px!important;
  box-sizing:border-box!important;
  padding:14px 18px!important;
}
html body .dashboard-four-column-rankings>.dashboard-category-table-card>.dashboard-category-head>span{
  display:flex!important;
  align-items:flex-start!important;
  gap:9px!important;
  margin:0!important;
  font-size:17px!important;
  line-height:1.28!important;
  font-weight:800!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
}
html body .dashboard-four-column-rankings>.dashboard-category-table-card>.dashboard-category-head>span>i{
  flex:0 0 17px!important;
  width:17px!important;
  margin-top:2px!important;
  font-size:14px!important;
  line-height:1.28!important;
  text-align:center!important;
}

/* Ranking headers use the exact Calls Overview heading typography. */
html body .dashboard-four-column-rankings>.dashboard-category-table-card>.dashboard-category-head>span{
  font-size:15px!important;
  line-height:1.25!important;
  font-weight:600!important;
  letter-spacing:.015em!important;
  text-transform:uppercase!important;
}

/* Final dashboard border reset: uniform simple borders, no colored left accents. */
html body .dashboard-main-stat-grid .sims-metric-card,
html body .dashboard-overview-sections .sims-metric-card,
html body .dashboard-four-column-rankings .dashboard-top-five-program-card,
html body .dashboard-category-ranking-card .dashboard-category-analytics-link{
  border:1px solid #d8e2ef!important;
  border-left:1px solid #d8e2ef!important;
  box-shadow:none!important;
  outline:none!important;
}
html body .dashboard-overview-sections>.dashboard-overview-box,
html body .dashboard-four-column-rankings>.dashboard-category-table-card{
  border:1px solid #d8e2ef!important;
  border-left:1px solid #d8e2ef!important;
  box-shadow:none!important;
}
html body .dashboard-main-stat-grid .sims-metric-card::before,
html body .dashboard-main-stat-grid .sims-metric-card::after,
html body .dashboard-overview-sections .sims-metric-card::before,
html body .dashboard-overview-sections .sims-metric-card::after,
html body .dashboard-four-column-rankings .dashboard-top-five-program-card::before,
html body .dashboard-four-column-rankings .dashboard-top-five-program-card::after{
  display:none!important;
  content:none!important;
}
html body .dashboard-main-stat-grid .sims-metric-card:hover,
html body .dashboard-overview-sections .sims-metric-card:hover,
html body .dashboard-four-column-rankings .dashboard-top-five-program-card:hover,
html body .dashboard-four-column-rankings .dashboard-top-five-program-card:focus-visible{
  border-color:#cbd7e6!important;
  border-left-color:#cbd7e6!important;
  box-shadow:none!important;
  transform:none!important;
}

/* Remove remaining legacy inset accent strips from every dashboard card. */
html body .dashboard-overview-sections .dashboard-sms-overview-box .sims-metric-card:nth-child(n),
html body .dashboard-overview-sections .dashboard-calls-overview-box .sims-metric-card:nth-child(n),
html body .dashboard-four-column-rankings .dashboard-top-five-program-list>.dashboard-top-five-program-card:nth-child(n),
html body .dashboard-four-column-rankings .dashboard-category-ranking-card .dashboard-category-analytics-link:nth-child(n){
  border:1px solid #d8e2ef!important;
  border-left:1px solid #d8e2ef!important;
  box-shadow:none!important;
  filter:none!important;
  background-image:none!important;
}
html body .dashboard-overview-sections .dashboard-sms-overview-box .sims-metric-card:nth-child(n):hover,
html body .dashboard-overview-sections .dashboard-calls-overview-box .sims-metric-card:nth-child(n):hover,
html body .dashboard-four-column-rankings .dashboard-top-five-program-list>.dashboard-top-five-program-card:nth-child(n):hover{
  border:1px solid #cbd7e6!important;
  border-left:1px solid #cbd7e6!important;
  box-shadow:none!important;
  transform:none!important;
}

/* Match lower four-column card typography to Calls Overview; retain each theme color. */
html body .dashboard-four-column-rankings .dashboard-top-five-main strong{
  font-size:11px!important;
  line-height:1.18!important;
  font-weight:500!important;
  letter-spacing:.025em!important;
  text-transform:uppercase!important;
}
html body .dashboard-four-column-rankings .dashboard-top-five-main small{
  font-size:11px!important;
  line-height:1.18!important;
  font-weight:500!important;
}
html body .dashboard-four-column-rankings .dashboard-top-five-program-card>b{
  font-size:12px!important;
  line-height:1!important;
  font-weight:800!important;
}

/* One consistent heading style for all four dashboard ranking columns. */
html body .dashboard-four-column-rankings>.dashboard-category-table-card>.dashboard-category-head,
html body .dashboard-four-column-rankings>.dashboard-top-programs-24h-card>.dashboard-category-head,
html body .dashboard-four-column-rankings>.dashboard-top-stations-7d-card>.dashboard-category-head,
html body .dashboard-four-column-rankings>.dashboard-category-ranking-card>.dashboard-category-head{
  display:flex!important;
  align-items:center!important;
  min-height:78px!important;
  height:78px!important;
  padding:14px 18px!important;
  box-sizing:border-box!important;
  background:#f4f7fb!important;
  background-image:none!important;
  color:#173b6c!important;
  border-bottom:1px solid #d8e2ef!important;
}
html body .dashboard-four-column-rankings>.dashboard-category-table-card>.dashboard-category-head>span,
html body .dashboard-four-column-rankings>.dashboard-category-table-card>.dashboard-category-head>span>i{
  color:#173b6c!important;
}
html body .dashboard-four-column-rankings>.dashboard-category-table-card>.dashboard-category-head>span{
  font-size:15px!important;
  line-height:1.25!important;
  font-weight:600!important;
  letter-spacing:.015em!important;
  text-transform:uppercase!important;
}

/* Analytics performance fallback: always show server-rendered graphs immediately. */
html body .reports-analytics-page .call-sector-chart .google-stacked-chart-stage {
  display: none !important;
}
html body .reports-analytics-page .call-sector-chart.has-google-chart .google-stacked-chart-stage {
  display: block !important;
}
html body .reports-analytics-page .call-sector-chart .call-region-legend {
  display: flex !important;
}
html body .reports-analytics-page .call-sector-chart .call-bar-chart-wrap {
  display: grid !important;
}
html body .reports-analytics-page .call-sector-chart .call-category-total-row {
  display: grid !important;
}

/* Native pie layout: crisp conic chart with labels split on both sides. */
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-body {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 210px minmax(0,1fr) !important;
  grid-auto-rows: minmax(38px,auto) !important;
  gap: 8px 14px !important;
  align-items: center !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-wrap {
  grid-column: 2 !important;
  grid-row: 1 / span 20 !important;
  width: 210px !important;
  height: 210px !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie {
  width: 190px !important;
  height: 190px !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-list {
  display: contents !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row:nth-child(odd) { grid-column: 1 !important; }
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row:nth-child(even) { grid-column: 3 !important; }
@media(max-width:900px){
  html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-body{grid-template-columns:1fr!important}
  html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-wrap,
  html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row{grid-column:1!important;grid-row:auto!important}
  html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-list{display:grid!important;width:100%!important}
}


/* Combined pie charts: plain SLIMS labels beside a centered pie. */
html body .reports-analytics-page .call-combined-pie-card .call-combined-pie-body {
  display: grid !important;
  grid-template-columns: minmax(0, 31%) minmax(210px, 38%) minmax(0, 31%) !important;
  grid-template-rows: repeat(var(--pie-label-rows, 1), minmax(38px, auto)) !important;
  gap: 6px 12px !important;
  align-items: center !important;
  min-height: var(--google-pie-height, 300px) !important;
  height: auto !important;
  padding: 12px 18px !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}
html body .reports-analytics-page .call-combined-pie-card .call-combined-pie-wrap {
  grid-column: 2 !important;
  grid-row: 1 / span var(--pie-label-rows, 1) !important;
  align-self: center !important;
  justify-self: center !important;
  width: 100% !important;
  max-width: 300px !important;
  height: var(--google-pie-height, 300px) !important;
  min-height: var(--google-pie-height, 300px) !important;
  margin: 0 auto !important;
  transform: none !important;
  overflow: visible !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-wrap .call-combined-pie {
  width: 190px !important;
  height: 190px !important;
}
html body .reports-analytics-page .call-combined-pie-card .call-combined-pie-list {
  display: contents !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row {
  grid-row: var(--pie-row) !important;
  display: grid !important;
  grid-template-columns: 10px minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 32px !important;
  padding: 3px 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #08245c !important;
  box-sizing: border-box !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row.is-left-label {
  grid-column: 1 !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row.is-right-label {
  grid-column: 3 !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row b {
  display: block !important;
  min-width: 0 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  -webkit-line-clamp: unset !important;
  color: #08245c !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row strong,
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row span {
  min-width: 0 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label {
  padding: 3px 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label b {
  color: #08245c !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label em {
  color: #0f766e !important;
  font-size: 11px !important;
  font-weight: 650 !important;
}
@media (max-width: 900px) {
  html body .reports-analytics-page .call-combined-pie-card .call-combined-pie-body {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }
  html body .reports-analytics-page .call-combined-pie-card .call-combined-pie-wrap {
    order: 1 !important;
    width: 100% !important;
    height: 280px !important;
    min-height: 280px !important;
  }
  html body .reports-analytics-page .call-combined-pie-card .call-combined-pie-list,
  html body .reports-analytics-page .call-combined-pie-card .google-pie-side-labels {
    order: 2 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 8px 14px !important;
  }
}


/* Requested pie labels: plain category names outside; values stay inside Google pie. */
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row {
  grid-template-columns: minmax(0, 1fr) !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row i,
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row strong,
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row span {
  display: none !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row b {
  font-weight: 400 !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label {
  display: block !important;
  padding: 2px 0 !important;
  color: #08245c !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label-name {
  display: block !important;
  color: #08245c !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label i,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label b,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label em {
  display: none !important;
}

/* FINAL: category names always use the exact matching pie-slice color. */
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row b {
  color: var(--pie-color, #08245c) !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label-name {
  color: var(--pie-label-color, #08245c) !important;
}

/* Production-safe analytics layout for large category datasets. */
html body .reports-analytics-page .call-combined-pies-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
html body .reports-analytics-page .call-combined-pie-card,
html body .reports-analytics-page .call-combined-pie-card .call-combined-pie-body,
html body .reports-analytics-page .call-combined-pie-card .google-pie-side-column,
html body .reports-analytics-page .call-combined-pie-card .google-pie-side-label {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
html body .reports-analytics-page .call-combined-pie-card {
  width: 100% !important;
  overflow: hidden !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie-body {
  grid-template-columns: minmax(0, 1fr) minmax(180px, 240px) minmax(0, 1fr) !important;
  width: 100% !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label-name {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}
html body .reports-analytics-page .call-combined-pie-card.has-many-segments .call-combined-pie-body {
  grid-template-rows: repeat(var(--pie-label-rows, 1), minmax(24px, auto)) !important;
  row-gap: 3px !important;
}
html body .reports-analytics-page .call-combined-pie-card.has-many-segments .google-pie-side-column {
  gap: 3px !important;
}
html body .reports-analytics-page .call-combined-pie-card.has-many-segments .google-pie-side-label {
  padding: 1px 0 !important;
}
html body .reports-analytics-page .call-combined-pie-card.has-many-segments .google-pie-side-label-name {
  font-size: 10.5px !important;
  line-height: 1.2 !important;
}
html body .reports-analytics-page [data-google-stacked-stage] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  scrollbar-width: thin !important;
}
html body .analytics-graph-modal-body [data-google-stacked-stage] {
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

/* Report Builder preview: keep 3D pie clear of the clipped top edge. */
html body .report-builder-modal .report-drop-row.is-half-row .call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap,
html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap {
  transform: none !important; /* prevent the 3D pie base from being pushed below its preview card */
}

/* FINAL left header alignment: equal top buttons with a neat province grid below. */
@media (min-width: 1301px) {
  html body .reports-analytics-page .reports-menu-group {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 320px !important;
    margin-top: 0 !important;
    align-self: flex-start !important;
  }
  html body .reports-analytics-page .reports-menu,
  html body .reports-analytics-page .reports-menu summary {
    width: 100% !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
    display: grid !important;
    grid-template-columns: auto auto auto auto auto !important;
    grid-template-rows: repeat(2, auto) !important;
    justify-content: start !important;
    align-content: center !important;
    column-gap: 7px !important;
    row-gap: 5px !important;
    width: 320px !important;
    padding: 7px 10px !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter > span {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-content: flex-start !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(1) { grid-column: 2 !important; grid-row: 1 !important; }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(2) { grid-column: 3 !important; grid-row: 1 !important; }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(3) { grid-column: 4 !important; grid-row: 1 !important; }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(4) { grid-column: 5 !important; grid-row: 1 !important; }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(5) { grid-column: 2 !important; grid-row: 2 !important; }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(6) { grid-column: 3 !important; grid-row: 2 !important; }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(7) { grid-column: 4 !important; grid-row: 2 !important; }
}

/* ABSOLUTE FINAL: compact province controls without distributed gaps. */
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
  display: flex !important;
  flex-flow: row wrap !important;
  justify-content: flex-start !important;
  align-content: center !important;
  align-items: center !important;
  gap: 4px 8px !important;
  padding: 7px 10px !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter > span,
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter > label {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 1px !important;
  grid-column: auto !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label input {
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
}

/* FINAL professional alignment for the analytics header. */
@media (min-width: 1301px) {
  html body .reports-analytics-page .reports-menu-group {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 424px !important;
    margin-left: 16px !important;
    margin-right: 0 !important;
  }
  html body .reports-analytics-page .reports-menu,
  html body .reports-analytics-page .reports-menu summary {
    width: 100% !important;
    min-width: 0 !important;
  }
  html body .reports-analytics-page .reports-menu summary {
    height: 52px !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
    right: calc(100% + 13px) !important;
    width: 424px !important;
    padding: 8px !important;
    gap: 4px 6px !important;
    align-content: center !important;
  }
}

/* FINAL overlap-free header geometry. */
@media (min-width: 1301px) {
  html body .reports-analytics-page .reports-menu-group {
    width: 320px !important;
    margin-top: 8px !important;
    margin-left: 24px !important;
    box-sizing: border-box !important;
  }
  html body .reports-analytics-page .reports-menu,
  html body .reports-analytics-page .reports-menu summary {
    box-sizing: border-box !important;
  }
  html body .reports-analytics-page .reports-menu summary {
    height: 40px !important;
    min-height: 40px !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
    right: calc(100% + 4px) !important;
    width: 320px !important;
    height: 72px !important;
    min-height: 72px !important;
    grid-template-columns: 1.1fr repeat(4, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
    padding: 6px 8px !important;
    gap: 4px 6px !important;
    box-sizing: border-box !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(5) {
    grid-column: 2 !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(6) {
    grid-column: 3 !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label:nth-of-type(7) {
    grid-column: 4 !important;
  }
}

/* Pie label colors in normal view, fullscreen modal, and cloned chart views. */
html body .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row b {
  color: var(--pie-color, #08245c) !important;
}
html body .call-combined-pie-card.uses-side-google-labels .google-pie-side-label-name {
  color: var(--pie-label-color, #08245c) !important;
}
html body .call-combined-pie-card .call-combined-pie.is-google-chart {
  position: relative !important;
}
html body .call-combined-pie-card .google-pie-slice-percentage {
  position: absolute !important;
  z-index: 20 !important;
  display: block !important;
  transform: translate(-50%, -50%) !important;
  padding: 2px 3px !important;
  border: 0 !important;
  border-radius: 3px !important;
  background: rgba(4, 26, 66, .45) !important;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .95) !important;
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

/* Compact province selector: plain checkboxes, no pill buttons. */
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
  column-gap: 3px !important;
  row-gap: 2px !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label {
  padding: 1px 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Fullscreen pie controls: compact left actions and right exit. */
html body .analytics-graph-modal-body .call-combined-pie-card > .analytics-excel-btn {
  top: 10px !important;
  left: 14px !important;
  right: auto !important;
}
html body .analytics-graph-modal-body .call-combined-pie-card > .analytics-image-btn {
  top: 10px !important;
  left: 58px !important;
  right: auto !important;
}
html body .analytics-graph-modal-body .call-combined-pie-card > .analytics-modal-full-proxy {
  top: 10px !important;
  left: auto !important;
  right: 14px !important;
}

/* FINAL province alignment: compact natural-width wrapping, no grid gaps. */
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  align-content: center !important;
  align-items: center !important;
  column-gap: 10px !important;
  row-gap: 5px !important;
  padding: 8px 14px !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter > span,
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  grid-column: auto !important;
}

/* Match every outside category name to its pie-slice color. */
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row b {
  color: var(--pie-color, #08245c) !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label-name {
  color: var(--pie-label-color, #08245c) !important;
}


/* Final presentable pie/filter layout. */
html body .reports-analytics-page .call-province-exclude-filter {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 4px !important;
  width: 100% !important;
  padding: 8px 10px !important;
  white-space: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  box-sizing: border-box !important;
}
html body .reports-analytics-page .call-province-exclude-filter::-webkit-scrollbar {
  display: none !important;
}
html body .reports-analytics-page .call-province-exclude-filter > span {
  flex: 0 0 auto !important;
  margin-right: 3px !important;
}
html body .reports-analytics-page .call-province-exclude-filter label {
  flex: 0 0 auto !important;
  padding: 3px 6px !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
  position: absolute !important;
  top: 0 !important;
  right: calc(100% + 4px) !important;
  display: flex !important;
  flex-flow: row wrap !important;
  justify-content: flex-start !important;
  align-content: center !important;
  gap: 4px 8px !important;
  width: 320px !important;
  height: 72px !important;
  min-height: 72px !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  border: 1px solid #d7e6f8 !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .72) !important;
  box-shadow: 0 8px 20px rgba(15, 42, 90, .05) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
html body .reports-analytics-page .call-filter-card:has(> .call-province-exclude-filter) {
  position: relative !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter > span {
  grid-column: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  text-align: center !important;
  font-size: 8px !important;
  line-height: 1.1 !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label {
  min-width: 0 !important;
  width: auto !important;
  max-width: none !important;
  padding: 1px !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label span {
  min-width: 0 !important;
  font-size: 9px !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}
html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label input {
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
}
html body .reports-analytics-page:has(.call-filter-card > .call-province-exclude-filter) .reports-mode-header.reports-menu-header {
  min-height: 148px !important;
}
@media (max-width: 1300px) {
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
    position: static !important;
    display: flex !important;
    width: 100% !important;
    margin-top: 8px !important;
    padding: 8px 4px 2px !important;
    border-width: 1px 0 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow-x: auto !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter > span {
    text-align: center !important;
  }
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter label span {
    font-size: inherit !important;
  }
  html body .reports-analytics-page:has(.call-filter-card > .call-province-exclude-filter) .reports-mode-header.reports-menu-header {
    min-height: auto !important;
  }
}
html body .reports-analytics-page .call-combined-pie-card.has-google-pie .call-combined-pie-list {
  display: none !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie-body {
  grid-template-columns: minmax(150px, 200px) minmax(230px, 260px) minmax(150px, 200px) !important;
  justify-content: center !important;
  gap: 8px 18px !important;
  height: 280px !important;
  min-height: 280px !important;
  padding: 6px 14px 10px !important;
  overflow: visible !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap {
  width: 100% !important;
  max-width: 260px !important;
  height: 260px !important;
  min-height: 260px !important;
  overflow: visible !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart > div,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart svg {
  flex: 0 0 245px !important;
  width: 260px !important;
  max-width: 260px !important;
  height: 245px !important;
  min-height: 245px !important;
  overflow: visible !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column {
  gap: 8px !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-left .google-pie-side-label,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-left .google-pie-side-label-name {
  text-align: right !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-right .google-pie-side-label,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-right .google-pie-side-label-name {
  text-align: left !important;
}


/* Percentage labels forced inside every Google 3D pie slice. */
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart {
  position: relative !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-slice-percentage {
  position: absolute !important;
  z-index: 8 !important;
  display: block !important;
  transform: translate(-50%, -50%) !important;
  padding: 1px 2px !important;
  border: 0 !important;
  border-radius: 3px !important;
  background: rgba(4, 26, 66, .38) !important;
  color: #fff !important;
  box-shadow: none !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .95) !important;
  font-family: Poppins, Arial, sans-serif !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}


/* FINAL compact combined-pie composition: labels | total + pie | labels. */
html body .reports-analytics-page .call-combined-pies-grid {
  align-items: start !important;
}
html body .reports-analytics-page .call-combined-pie-card {
  min-height: 0 !important;
  height: auto !important;
  align-self: start !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-body,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie-body {
  display: grid !important;
  grid-template-columns: minmax(150px, 1fr) minmax(190px, 240px) minmax(150px, 1fr) !important;
  grid-template-rows: repeat(var(--pie-label-rows, 1), minmax(34px, auto)) !important;
  align-items: center !important;
  align-content: center !important;
  gap: 5px 14px !important;
  width: 100% !important;
  height: var(--google-pie-height, 270px) !important;
  min-height: var(--google-pie-height, 270px) !important;
  padding: 8px 14px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-wrap,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap {
  grid-column: 2 !important;
  grid-row: 1 / -1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 240px !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  transform: none !important;
  overflow: visible !important;
}
html body .reports-analytics-page .call-combined-pie-total {
  display: inline-flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 5px !important;
  min-height: 24px !important;
  color: #08245c !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
html body .reports-analytics-page .call-combined-pie-total strong {
  color: #0759c8 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
}
html body .reports-analytics-page .call-combined-pie-total span {
  color: #496583 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie {
  flex: 0 0 190px !important;
  width: 190px !important;
  height: 190px !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-list {
  display: contents !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row {
  grid-row: var(--pie-row) !important;
  grid-template-columns: 10px minmax(0, 1fr) auto !important;
  gap: 7px !important;
  min-height: 30px !important;
  padding: 2px 3px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row.is-left-label {
  grid-column: 1 !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row.is-right-label {
  grid-column: 3 !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row strong {
  display: none !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row b {
  color: #08245c !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row span {
  color: #0f766e !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-labels {
  display: contents !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column {
  align-self: center !important;
  justify-content: center !important;
  gap: 10px !important;
  max-height: none !important;
  padding: 0 !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-left {
  grid-column: 1 !important;
  grid-row: 1 / -1 !important;
  padding-right: 8px !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column.is-right {
  grid-column: 3 !important;
  grid-row: 1 / -1 !important;
  padding-left: 8px !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart > div,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie.is-google-chart svg {
  flex: 0 0 215px !important;
  width: 100% !important;
  max-width: 240px !important;
  height: 215px !important;
  min-height: 215px !important;
  position: static !important;
  transform: none !important;
  overflow: visible !important;
}
@media (max-width: 900px) {
  html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-body,
  html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie-body {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-wrap,
  html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap {
    order: 1 !important;
    height: 245px !important;
    min-height: 245px !important;
  }
  html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-list,
  html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-labels {
    order: 2 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px 12px !important;
    width: 100% !important;
  }
  html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}


/* Authoritative requested outside-label styling. */
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row {
  grid-template-columns: minmax(0, 1fr) !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row i,
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row strong,
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row span {
  display: none !important;
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row b {
  font-weight: 400 !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label {
  display: block !important;
  padding: 2px 0 !important;
  text-align: left !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label-name {
  display: block !important;
  color: #08245c !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label i,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label b,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label em {
  display: none !important;
}

/* FINAL live analytics alignment and slice-label colors. */
@media (min-width: 1301px) {
  html body .reports-analytics-page .call-filter-card > .call-province-exclude-filter {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}
html body .reports-analytics-page .call-combined-pie-card:not(.has-google-pie) .call-combined-pie-row b {
  color: var(--pie-color, #08245c) !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label-name {
  color: var(--pie-label-color, #08245c) !important;
}

/* AUTHORITATIVE production large-data sizing (keep this block last). */
html body .reports-analytics-page .call-combined-pies-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
html body .reports-analytics-page .call-combined-pie-card {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .call-combined-pie-body {
  grid-template-columns: minmax(0, 1fr) minmax(180px, 240px) minmax(0, 1fr) !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-column,
html body .reports-analytics-page .call-combined-pie-card.uses-side-google-labels .google-pie-side-label {
  min-width: 0 !important;
  max-width: 100% !important;
}
html body .reports-analytics-page .call-combined-pie-card.has-many-segments .call-combined-pie-body {
  grid-template-rows: repeat(var(--pie-label-rows, 1), minmax(24px, auto)) !important;
  row-gap: 3px !important;
}
html body .reports-analytics-page .call-combined-pie-card.has-many-segments .google-pie-side-column {
  gap: 3px !important;
}
html body .reports-analytics-page .call-combined-pie-card.has-many-segments .google-pie-side-label-name {
  font-size: 10.5px !important;
  line-height: 1.2 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
html body .reports-analytics-page [data-google-stacked-stage] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
html body .analytics-graph-modal-body [data-google-stacked-stage] {
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

/* Dashboard counts: plain digits with a slightly larger, readable size. */
html body .dashboard-overview-sections .dashboard-overview-box .sims-metric-card .sims-metric-value,
html body .dashboard-overview-sections .dashboard-sms-overview-box .sms-dual-code-card .sms-dual-code-values a b,
html body .dashboard-overview-sections .dashboard-four-column-rankings .dashboard-top-five-program-card > b {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 16px !important;
}

/* FINAL Report Builder preview clearance for half-width 3D pies. */
html body .report-builder-modal .report-drop-row.is-half-row .call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap,
html body .report-builder-modal.is-server-rendered .report-drop-row.is-half-row .call-combined-pie-card.uses-side-google-labels .call-combined-pie-wrap {
  transform: none !important; /* prevent the 3D pie base from being pushed below its preview card */
}
/* Caller Data: report-only selection drafts and role-limited call-content editing. */
.call-report-selection-actions{display:inline-flex;gap:8px;align-items:center;margin-left:auto;margin-right:12px}.call-selection-draft-btn,.call-content-edit-btn,.call-content-save-btn,.call-content-cancel-btn{border:1px solid #b7cdf7;background:#fff;color:#063476;border-radius:6px;cursor:pointer;font:inherit}.call-selection-draft-btn{padding:6px 9px;font-size:12px}.call-content-edit-btn{float:right;padding:4px 7px;margin-left:8px}.call-detail-content-cell{position:relative;min-width:220px}.call-content-editor{clear:both;margin-top:8px;padding:8px;background:#f5f9ff;border:1px solid #cddcf5;border-radius:7px}.call-content-editor[hidden]{display:none!important}.call-content-editor textarea{width:100%;min-height:76px;resize:vertical;box-sizing:border-box;border:1px solid #a9c3ef;border-radius:5px;padding:7px;font:inherit}.call-content-editor>div{display:flex;gap:7px;margin-top:6px}.call-content-save-btn{background:#0d6efd;color:#fff;border-color:#0d6efd;padding:5px 10px}.call-content-cancel-btn{padding:5px 10px}.call-content-editor small{display:block;margin-top:5px;color:#b42318}@media(max-width:720px){.call-report-selection-actions{margin:7px 0;flex-wrap:wrap}.call-detail-region-title{flex-wrap:wrap}.call-detail-content-cell{min-width:160px}}
/* Caller Data report selection: green tick for included, red cross for excluded. */
.call-detail-report-table .report-audit-btn{border:1px solid #cbd5e1!important;border-radius:7px!important;background:#fff!important;transition:background .15s,border-color .15s,color .15s!important}.call-detail-report-table .report-audit-btn.is-included{color:#15803d!important;border-color:#86efac!important;background:#ecfdf5!important}.call-detail-report-table .report-audit-btn.is-excluded{color:#dc2626!important;border-color:#fecaca!important;background:#fff1f2!important}.call-detail-report-table tr.is-report-excluded td:not(.report-audit-cell){opacity:.64!important;text-decoration:line-through!important}
/* Admin / Coord Officer Call Content formatting controls. */
.call-detail-content-cell [data-call-content-value].is-call-content-bold{font-weight:800!important}.call-detail-content-cell [data-call-content-value].is-call-content-red{color:#c81e1e!important}.call-content-format-tools{display:flex;gap:6px;margin:0 0 7px}.call-content-format-tools button{min-width:31px;height:29px;border:1px solid #b7cdf7;border-radius:5px;background:#fff;color:#163e7a;cursor:pointer}.call-content-format-tools button[data-call-content-red]{color:#c81e1e}.call-content-format-tools button.is-active{background:#eaf3ff;border-color:#2563eb;box-shadow:inset 0 0 0 1px #2563eb}.call-content-format-tools button[data-call-content-red].is-active{background:#fff1f2;border-color:#e11d48;box-shadow:inset 0 0 0 1px #e11d48}
/* Analytics caller category editor — Admin and Coord Officer only. */
.call-category-edit-btn{float:right;margin:4px 0 0 8px;padding:4px 7px;border:1px solid #b7cdf7;border-radius:6px;background:#fff;color:#5b21b6;cursor:pointer;font:inherit;font-size:12px}.call-category-editor{clear:both;margin-top:8px;padding:8px;background:#faf7ff;border:1px solid #ddd6fe;border-radius:7px}.call-category-editor[hidden]{display:none!important}.call-category-editor select{width:100%;box-sizing:border-box;padding:7px;border:1px solid #c4b5fd;border-radius:5px;background:#fff;font:inherit}.call-category-editor>div{display:flex;gap:7px;margin-top:6px}.call-category-save-btn{padding:5px 10px;border:1px solid #6d28d9;border-radius:5px;background:#6d28d9;color:#fff;cursor:pointer}.call-category-cancel-btn{padding:5px 10px;border:1px solid #b7cdf7;border-radius:5px;background:#fff;color:#063476;cursor:pointer}.call-category-editor small{display:block;margin-top:5px;color:#b42318}
/* Keep the Analytics category dropdown on the normal SLIMS UI type scale. */
html body .call-detail-report-table .call-category-editor select,html body .call-detail-report-table .call-category-editor select option{font-family:var(--slims-font-family),Arial,sans-serif!important;font-size:14px!important;font-weight:400!important;line-height:1.4!important;letter-spacing:normal!important;color:#173b70!important;text-transform:none!important}html body .call-detail-report-table .call-category-editor select{min-height:38px!important}
/* Compact Category modal; independent from report/province checkboxes. */
html body .call-detail-report-table .call-category-edit-btn,html body .call-detail-report-table .call-content-edit-btn{font-family:var(--slims-font-family),Arial,sans-serif!important;font-size:12px!important;font-weight:500!important;line-height:1.2!important}html body .call-detail-report-table .call-category-editor{position:fixed!important;inset:0!important;z-index:12000!important;display:grid!important;place-items:center!important;margin:0!important;padding:16px!important;border:0!important;border-radius:0!important;background:rgba(10,31,68,.34)!important}html body .call-detail-report-table .call-category-editor[hidden]{display:none!important}html body .call-category-modal-card{width:min(420px,calc(100vw - 32px))!important;max-height:calc(100vh - 36px)!important;overflow:auto!important;padding:16px!important;border:1px solid #cfe1ff!important;border-radius:10px!important;background:#fff!important;box-shadow:0 22px 60px rgba(8,36,92,.28)!important;font-family:var(--slims-font-family),Arial,sans-serif!important}html body .call-category-modal-head{display:flex!important;justify-content:space-between!important;align-items:center!important;margin-bottom:12px!important;color:#08245c!important;font-size:15px!important}html body .call-category-modal-head button{width:28px!important;height:28px!important;border:0!important;border-radius:6px!important;background:#f1f5f9!important;color:#334155!important;font-size:20px!important;line-height:1!important;cursor:pointer!important}html body .call-category-options{display:grid!important;gap:7px!important}html body .call-category-options label{display:flex!important;align-items:center!important;gap:9px!important;min-height:36px!important;padding:7px 9px!important;border:1px solid #dbeafe!important;border-radius:7px!important;background:#fff!important;color:#173b70!important;font-family:var(--slims-font-family),Arial,sans-serif!important;font-size:13px!important;font-weight:400!important;line-height:1.35!important;cursor:pointer!important}html body .call-category-options input{width:15px!important;height:15px!important;flex:0 0 auto!important;accent-color:#6d28d9!important}html body .call-category-modal-actions{display:flex!important;justify-content:flex-end!important;gap:8px!important;margin-top:14px!important}html body .call-category-modal-actions button{min-height:34px!important;padding:6px 11px!important;font-family:var(--slims-font-family),Arial,sans-serif!important;font-size:12px!important;font-weight:500!important;line-height:1.2!important}
.call-content-rich-editor{min-height:76px;padding:7px;border:1px solid #a9c3ef;border-radius:5px;background:#fff;font-family:var(--slims-font-family),Arial,sans-serif;font-size:14px;line-height:1.5;outline:none}.call-content-rich-editor .call-content-red,.call-detail-content-cell [data-call-content-value] .call-content-red{color:#c81e1e!important}.call-content-rich-editor .call-content-black,.call-detail-content-cell [data-call-content-value] .call-content-black{color:#000!important}.call-content-editor button{font-family:var(--slims-font-family),Arial,sans-serif!important;font-size:12px!important;line-height:1.2!important;padding:5px 8px!important}
/* Final category modal layout reset: prevent legacy editor flex rules from breaking the card. */
html body .call-detail-report-table .call-category-editor>.call-category-modal-card{display:block!important;box-sizing:border-box!important;width:min(440px,calc(100vw - 32px))!important;min-width:0!important;margin:0!important}html body .call-detail-report-table .call-category-modal-card>.call-category-modal-head{display:flex!important;width:100%!important;box-sizing:border-box!important}html body .call-detail-report-table .call-category-modal-card>.call-category-options{display:grid!important;width:100%!important;box-sizing:border-box!important;max-height:50vh!important;overflow-y:auto!important}html body .call-detail-report-table .call-category-modal-card>.call-category-modal-actions{display:flex!important;width:100%!important;box-sizing:border-box!important}html body .call-detail-report-table .call-category-modal-card>small{display:block!important;font-family:var(--slims-font-family),Arial,sans-serif!important;font-size:12px!important;line-height:1.35!important}html body .call-detail-report-table .call-category-modal-actions .call-category-save-btn,html body .call-detail-report-table .call-category-modal-actions .call-category-cancel-btn{width:auto!important;min-width:0!important;white-space:nowrap!important}
/* Two-column category chooser: show more options without a long modal scroll. */
html body .call-detail-report-table .call-category-editor>.call-category-modal-card{width:min(760px,calc(100vw - 32px))!important;max-height:calc(100vh - 28px)!important}html body .call-detail-report-table .call-category-modal-card>.call-category-options{grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:10px!important;row-gap:8px!important;max-height:68vh!important;overflow-y:auto!important}html body .call-detail-report-table .call-category-options label{min-height:38px!important}@media(max-width:620px){html body .call-detail-report-table .call-category-modal-card>.call-category-options{grid-template-columns:1fr!important;max-height:60vh!important}}