/* ===========================
   Theme variables
   =========================== */
:root{
  --bg: #f6f8fb;
  --surface: #ffffff;
  --border: #e5e7eb;
  --text: #0f172a;
  --muted: #6b7280;
  --primary: #2563eb;
  --primary-50:#eef2ff;
  --primary-600:#2563eb;
  --shadow: 0 2px 10px rgba(15,23,42,0.06);
}

html[data-theme="dark"]{
  --bg: #0b1220;
  --surface: #0f172a;
  --border: #1f2937;
  --text: #e5e7eb;
  --muted: #94a3b8;
  --primary: #60a5fa;
  --primary-50:#0b1a33;
  --primary-600:#60a5fa;
  --shadow: 0 2px 12px rgba(0,0,0,.35);
}

body{
  background: var(--bg);
  color: var(--text);
}

/* ===========================
   Layout
   =========================== */
.layout{
  display:flex;
  min-height: calc(100vh - 56px); /* minus navbar height */
}

.sidebar{
  width: 300px;
  flex: 0 0 300px;
  background: var(--surface);
  border-right: 1px solid var(--border);
  position: sticky;
  top:56px;
  height: calc(100vh - 56px);
  overflow-y:auto;
}

.content-wrap{
  flex:1;
  padding: 18px;
}

/* Collapsed sidebar */
html[data-collapsed="true"] .sidebar{ width:72px; flex-basis:72px; }
html[data-collapsed="true"] .sidebar .name,
html[data-collapsed="true"] .sidebar .nav-vert .text,
html[data-collapsed="true"] .sidebar .client-pill .label,
html[data-collapsed="true"] .sidebar hr{ display:none !important; }
html[data-collapsed="true"] .sidebar .nav-vert .nav-link{ justify-content:center; padding-left:0.75rem; padding-right:0.75rem; }
html[data-collapsed="true"] .sidebar .dropdown-menu{ transform: translateX(56px); }

/* ===========================
   Brand
   =========================== */
.brand{
  display:flex; align-items:center; gap:.5rem;
  padding: .5rem .5rem 1rem .5rem;
}
.brand .logo{
  width:28px;height:28px;border-radius:6px;background:var(--primary-50);
  box-shadow: inset 0 0 0 2px var(--border);
}
.brand .name{
  font-weight:700; color:var(--text);
}

/* ===========================
   Vertical nav
   =========================== */
.nav-vert .nav-link{
  display:flex; align-items:center; gap:.5rem;
  color: var(--text);
  border-radius: .6rem;
  padding: .5rem .75rem;
  margin: 2px 4px;
  transition: background .15s ease,color .15s ease;
}
.nav-vert .nav-link:hover{
  background: var(--primary-50);
  color: var(--primary-600);
}
.nav-vert .nav-link.active{
  background: var(--primary-50);
  color: var(--primary-600);
  font-weight: 600;
}
.nav-vert .nav-link i{ width:18px; text-align:center; }
.nav-vert .nav-link .text{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nav-vert .nav-label{ letter-spacing:.08em; font-weight:600; opacity:.7; }
html[data-collapsed="true"] .nav-vert .nav-label{ display:none; }
.profile-card{ background:var(--bs-body-bg,#fff); border:1px solid rgba(0,0,0,.05); border-radius:.75rem; padding:1rem; width:100%; }
.profile-card-photo{ width:140px; }
.profile-photo-preview{ width:100%; padding-top:100%; border-radius:.75rem; background:linear-gradient(135deg,rgba(13,110,253,.08),rgba(25,135,84,.08)); border:1px solid rgba(0,0,0,.05); position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; font-weight:600; color:rgba(0,0,0,.45); text-transform:uppercase; }
.profile-photo-preview.has-image{ background-size:cover; background-position:center; color:transparent; }
.client-logo-card{ max-width:180px; }
.client-logo-preview{ width:100%; padding-top:100%; border-radius:.75rem; border:1px solid rgba(0,0,0,.1); background:linear-gradient(135deg,rgba(13,110,253,.05),rgba(25,135,84,.05)); position:relative; display:flex; align-items:center; justify-content:center; color:rgba(0,0,0,.45); font-weight:600; text-transform:uppercase; overflow:hidden; }
.client-logo-preview.has-image{ background-size:cover; background-position:center; color:transparent; }
.client-logo-preview .placeholder-text{ pointer-events:none; }
.client-logo-actions label.btn{ position:relative; overflow:hidden; }
.client-logo-actions input[type=file]{ position:absolute; inset:0; opacity:0; cursor:pointer; }
.profile-card-fields .form-label{ font-weight:600; }
.password-strength-indicator{ color:rgba(0,0,0,.55); }
.password-strength-indicator.weak{ color:#dc3545; }
.password-strength-indicator.medium{ color:#fd7e14; }
.password-strength-indicator.strong{ color:#198754; }
.password-strength-indicator.very-strong{ color:#0d6efd; }

/* accordion navigation */
.nav-accordion{ margin:4px 4px 6px; }
.nav-accordion-toggle{ position:relative; }
.nav-accordion .accordion-caret{
  font-size:0.65rem;
  color:var(--muted);
  transition: transform .2s ease, color .2s ease;
}
.nav-accordion.expanded .accordion-caret{
  transform: rotate(90deg);
  color: var(--primary-600);
}
.nav-accordion-panel{
  display:none;
  padding-left:1.75rem;
  margin-top:0.25rem;
}
.nav-accordion.expanded .nav-accordion-panel{ display:block; }
.nav-accordion-panel .nav-link{
  margin:2px 0;
  padding-left:0.5rem;
  opacity:0.95;
  font-size:0.95rem;
}
.nav-accordion-panel .nav-link .text{ font-size:0.9rem; }
.nav-link.nav-sub i{ font-size:0.85rem; }
html[data-collapsed="true"] .nav-accordion-panel{ display:none !important; }
html[data-collapsed="true"] .nav-accordion .accordion-caret{ display:none; }
html[data-collapsed="true"] .nav-accordion{ margin:4px 0; }

/* ===========================
   Client switcher
   =========================== */
.client-pill{
  border:1px solid var(--border);
  background: var(--surface);
  border-radius: .7rem;
  padding: .35rem .5rem;
  box-shadow: var(--shadow);
}
.client-pill .label{min-width:0}

.client-switch-list .list-group-item{
  cursor:pointer;
  display:flex; align-items:center; gap:.5rem;
  padding:.5rem .75rem;
  border-color:var(--border);
  background:var(--surface);
}
.client-switch-list .list-group-item:hover{
  background: var(--primary-50);
}
.client-switch-list .list-group-item.active{
  background: var(--primary-50);
  color: var(--primary-600);
  font-weight:600;
}

/* ===========================
   Dashboard
   =========================== */
.dashboard-hero{
  background:linear-gradient(135deg,#4f46e5,#0ea5e9);
  border-radius:1.5rem;
  overflow:hidden;
  position:relative;
  color:#fff;
}
.dashboard-hero::after{
  content:"";
  position:absolute;
  inset:auto 0 -45% -20%;
  height:130%;
  background:radial-gradient(circle at top,#ffffff3d,transparent 70%);
  pointer-events:none;
}
.dashboard-hero .card-body{position:relative;z-index:1;}
.dashboard-hero .dashboard-hero-meta{min-width:180px;}

.dashboard-kpi{
  border-radius:1.15rem;
  transition:transform .2s ease,box-shadow .2s ease;
  background:#fff;
}
.dashboard-kpi:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(15,23,42,0.08);
}
.dashboard-kpi .kpi-label{
  text-transform:uppercase;
  font-size:.75rem;
  letter-spacing:.05em;
  font-weight:600;
  color:#6c757d;
}
.dashboard-kpi .kpi-value{
  font-size:2rem;
  font-weight:700;
  line-height:1.1;
  color:#212529;
}
.dashboard-kpi .kpi-icon{
  width:2.75rem;
  height:2.75rem;
  border-radius:.85rem;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(13,110,253,.12);
  color:#0d6efd;
  font-size:1.1rem;
}
.dashboard-kpi .kpi-subtitle{
  letter-spacing:.02em;
}

.dashboard-kpi.kpi-primary{background:linear-gradient(135deg,#2563eb,#7c3aed);color:#fff;}
.dashboard-kpi.kpi-search{background:linear-gradient(135deg,#0ea5e9,#22c55e);color:#fff;}
.dashboard-kpi.kpi-speed{background:linear-gradient(135deg,#f97316,#ec4899);color:#fff;}
.dashboard-kpi.kpi-rank{background:linear-gradient(135deg,#8b5cf6,#6366f1);color:#fff;}
.dashboard-kpi.kpi-backlink{background:linear-gradient(135deg,#0f766e,#14b8a6);color:#fff;}
.dashboard-kpi.kpi-email{background:linear-gradient(135deg,#ec4899,#f59e0b);color:#fff;}
.dashboard-kpi.kpi-social{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;}
.dashboard-kpi.kpi-tasks{background:linear-gradient(135deg,#6366f1,#0ea5e9);color:#fff;}
.dashboard-kpi.kpi-primary .kpi-label,
.dashboard-kpi.kpi-search .kpi-label,
.dashboard-kpi.kpi-speed .kpi-label,
.dashboard-kpi.kpi-rank .kpi-label,
.dashboard-kpi.kpi-backlink .kpi-label,
.dashboard-kpi.kpi-email .kpi-label,
.dashboard-kpi.kpi-social .kpi-label,
.dashboard-kpi.kpi-tasks .kpi-label,
.dashboard-kpi.kpi-primary .kpi-subtitle,
.dashboard-kpi.kpi-search .kpi-subtitle,
.dashboard-kpi.kpi-speed .kpi-subtitle,
.dashboard-kpi.kpi-rank .kpi-subtitle,
.dashboard-kpi.kpi-backlink .kpi-subtitle,
.dashboard-kpi.kpi-email .kpi-subtitle,
.dashboard-kpi.kpi-social .kpi-subtitle,
.dashboard-kpi.kpi-tasks .kpi-subtitle{
  color:rgba(255,255,255,.75);
}
.dashboard-kpi.kpi-primary .kpi-value,
.dashboard-kpi.kpi-search .kpi-value,
.dashboard-kpi.kpi-speed .kpi-value,
.dashboard-kpi.kpi-rank .kpi-value,
.dashboard-kpi.kpi-backlink .kpi-value,
.dashboard-kpi.kpi-email .kpi-value,
.dashboard-kpi.kpi-social .kpi-value,
.dashboard-kpi.kpi-tasks .kpi-value{color:#fff;}
.dashboard-kpi.kpi-primary .kpi-icon,
.dashboard-kpi.kpi-search .kpi-icon,
.dashboard-kpi.kpi-speed .kpi-icon,
.dashboard-kpi.kpi-rank .kpi-icon,
.dashboard-kpi.kpi-backlink .kpi-icon,
.dashboard-kpi.kpi-email .kpi-icon,
.dashboard-kpi.kpi-social .kpi-icon,
.dashboard-kpi.kpi-tasks .kpi-icon{
  background:rgba(255,255,255,.18);
  color:#fff;
}

.dashboard-metric-grid{
  display:grid;
  gap:.75rem;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.dashboard-metric{
  background:#f8f9fa;
  border-radius:.9rem;
  padding:.75rem 1rem;
  min-height:84px;
  display:flex;
  flex-direction:column;
  gap:.35rem;
}
.dashboard-metric .metric-label{
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-weight:600;
  color:#6c757d;
}
.dashboard-metric .metric-value{
  font-size:1.1rem;
  font-weight:600;
  color:#212529;
  display:flex;
  align-items:center;
  gap:.4rem;
  flex-wrap:wrap;
}

.mini-stat{
  background:#f8f9fa;
  border-radius:.9rem;
  padding:.85rem 1rem;
  display:flex;
  flex-direction:column;
  gap:.2rem;
}
.mini-stat .label{
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-weight:600;
  color:#6c757d;
}
.mini-stat .value{
  font-size:1.6rem;
  font-weight:700;
  color:#212529;
}

.dashboard-chart{position:relative;min-height:240px;}
.dashboard-chart canvas{width:100%;height:240px;}
.dashboard-chart .alert{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.dashboard-list{display:flex;flex-direction:column;gap:.75rem;}
.dashboard-list-item{
  display:flex;
  gap:1rem;
  align-items:flex-start;
  background:#f8f9fa;
  border-radius:.9rem;
  padding:.75rem 1rem;
  transition:background .2s ease, box-shadow .2s ease;
}
.dashboard-list-item:hover{
  background:#eef2ff;
  box-shadow:0 12px 24px rgba(15,23,42,0.08);
}
.dashboard-list-item a{color:inherit;text-decoration:none;}
.dashboard-list-item a:hover{text-decoration:underline;}

/* Avatars (client + user) */
.avatar-mini{
  width:24px;height:24px;border-radius:6px;
  background:#eef2ff;color:#2b5fd6;
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.7rem;
}
.avatar-mini img{ width:100%; height:100%; object-fit:cover; border-radius:6px; border:1px solid var(--border); }

.avatar-circle{
  width:28px;height:28px;border-radius:50%;
  background:#e9f2ff;color:#1f5fbf;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.9rem;
}
.avatar-circle.has-image{ background-size:cover; background-position:center; color:transparent; }
.avatar-xl{
  width:48px;height:48px;border-radius:50%;
  background:#e9f2ff;color:#1f5fbf;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:1.1rem;
}
.avatar-xl.has-image{ background-size:cover; background-position:center; color:transparent; }

/* ===========================
   Navbar (top)
   =========================== */
.navbar{
  background: var(--surface) !important;
  border-bottom: 1px solid var(--border) !important;
}
.navbar .btn.btn-light{
  background: var(--surface);
  border: 1px solid var(--border);
}

/* Dropdown polish */
.dropdown-menu{
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}
.dropdown-menu .dropdown-item{
  color: var(--text);
}
.dropdown-menu .dropdown-item:hover{
  background: var(--primary-50);
  color: var(--primary-600);
}
.dropdown-menu .dropdown-item i{ width:18px; text-align:center; }

/* ===========================
   Cards / tables
   =========================== */
.card{
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  border-radius: .8rem;
}
.table thead th{ background: var(--surface); border-bottom:1px solid var(--border); }
.table td, .table th{ border-color: var(--border); }

/* badges used in link state */
.badge.text-bg-success{
  background-color: #16a34a !important;
}

/* ===========================
   PageSpeed styling
   =========================== */
.pagespeed-score{ 
  --pagespeed-score:0;
  --pagespeed-color:#0d6efd;
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  border-radius:50%;
  font-weight:600;
  font-size:0.95rem;
  color:var(--pagespeed-color);
}

.pagespeed-score-lg{
  width:96px;
  height:96px;
  font-size:1.65rem;
}

.pagespeed-score-sm{
  width:44px;
  height:44px;
  font-size:0.85rem;
}

.pagespeed-score-sm::after{
  inset:5px;
}

.pagespeed-score-lg::after{
  inset:12px;
}

.pagespeed-score::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:conic-gradient(var(--pagespeed-color) calc(var(--pagespeed-score) * 3.6deg), #e9ecef 0deg);
}

.pagespeed-score::after{
  content:"";
  position:absolute;
  inset:6px;
  border-radius:50%;
  background:#fff;
}

.pagespeed-score span{
  position:relative;
  z-index:1;
}

.pagespeed-score-good{
  --pagespeed-color:#198754;
}

.pagespeed-score-average{
  --pagespeed-color:#fd7e14;
}

.pagespeed-score-poor{
  --pagespeed-color:#dc3545;
}

.pagespeed-score-na{
  --pagespeed-color:#adb5bd;
  color:#495057;
}

.pagespeed-score-na::before{
  background:#e9ecef;
}

.pagespeed-score-na::after{
  background:#f8f9fa;
}

.seo-summary-card{
  border-radius:1rem;
}

.seo-summary-card .pagespeed-score{
  flex-shrink:0;
}

.seo-summary-card .text-uppercase{
  letter-spacing:0.04em;
}

.seo-summary-card-overall .display-6{
  font-weight:700;
}

.seo-summary-card-overall .pagespeed-score{
  box-shadow:0 0 0 4px #fff;
}

.audit-score-gauge{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.25rem;
}

.audit-checklist{
  display:flex;
  flex-direction:column;
  gap:0.75rem;
}

.audit-checklist-row{
  display:flex;
  align-items:flex-start;
  gap:0.75rem;
}

.audit-checklist-row .badge{
  margin-top:0.2rem;
}

.audit-score-gauge small{
  font-size:0.75rem;
  color:#6c757d;
}

.pagespeed-strategy{
  display:inline-flex;
  align-items:center;
  gap:0.35rem;
  font-weight:600;
  font-size:0.75rem;
  padding:0.2rem 0.65rem;
  border-radius:999px;
}

.pagespeed-strategy-mobile{
  background:rgba(13,110,253,0.12);
  color:#0d6efd;
}

.pagespeed-strategy-desktop{
  background:rgba(102,16,242,0.12);
  color:#6610f2;
}

.pagespeed-score i,
.pagespeed-strategy i{
  font-size:0.8rem;
}

/* ===========================
   Rank Tracker
   =========================== */
.rank-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:2.5rem;
  padding:0.2rem 0.55rem;
  font-weight:600;
}

#panel-ranktracker .table td{
  vertical-align:middle;
}

/* ===========================
   Backlinks & Website Audit
   =========================== */
.backlink-sparkline{
  position:relative;
  width:100%;
  min-height:48px;
}

.backlink-sparkline svg{
  width:100%;
  height:48px;
  stroke:#0d6efd;
  stroke-width:2;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
  background:linear-gradient(180deg,rgba(13,110,253,0.08),rgba(13,110,253,0));
  border-radius:0.5rem;
}

.backlink-sparkline polyline{
  vector-effect:non-scaling-stroke;
}

.audit-metric{
  border:1px solid rgba(108,117,125,0.2);
  border-radius:0.65rem;
  padding:0.75rem;
  background:rgba(248,249,250,0.65);
  min-height:82px;
}

html[data-theme="dark"] .audit-metric{
  background:rgba(30,41,59,0.65);
  border-color:rgba(148,163,184,0.35);
}

.audit-metric .label{
  font-size:0.75rem;
  text-transform:uppercase;
  letter-spacing:0.04em;
  color:#6c757d;
}

html[data-theme="dark"] .audit-metric .label{
  color:#94a3b8;
}

.audit-metric .value{
  font-weight:600;
  font-size:1.05rem;
  margin-top:0.15rem;
}

/* ===========================
   Utilities
   =========================== */
.text-muted{ color: var(--muted) !important; }
.small{ font-size:.875rem; }

/* scrollbars (webkit) */
.sidebar::-webkit-scrollbar{ width:10px; }
.sidebar::-webkit-scrollbar-thumb{ background: #cbd5e1; border-radius:8px; }
html[data-theme="dark"] .sidebar::-webkit-scrollbar-thumb{ background:#334155; }

/* ===========================
   Responsive
   =========================== */
@media (max-width: 992px){
  .sidebar{ position: fixed; z-index: 1030; height: 100vh; top:56px; left:0; transform: translateX(0); }
  html[data-collapsed="true"] .sidebar{ transform: translateX(-100%); }
  .content-wrap{ padding:14px; }
}

.email-provider-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.email-provider-card {
  border: none;
  border-radius: 1rem;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.12);
  overflow: hidden;
}

.email-provider-card .card-body {
  padding: 1.5rem;
}

.email-provider-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(13, 110, 253, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #0d6efd;
}

.email-summary-card {
  border: none;
  border-radius: 1rem;
  background: linear-gradient(135deg, rgba(13, 110, 253, 0.08), rgba(13, 110, 253, 0));
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

.email-summary-card .metric-value {
  font-size: 1.85rem;
  font-weight: 600;
}

.email-analytics-card .analytics-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(13, 110, 253, 0.12);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #0d6efd;
  font-size: 1.1rem;
}

.analytics-stat {
  background: var(--bs-body-bg);
  border-radius: 0.75rem;
  padding: 0.75rem;
  border: 1px solid var(--bs-border-color);
}

.code-block {
  background: var(--bs-tertiary-bg);
  border-radius: 0.75rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--bs-border-color);
  white-space: pre-wrap;
  max-height: 340px;
  overflow: auto;
}

.email-campaign-preview {
  width: 100%;
  min-height: 260px;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  background: var(--bs-body-bg);
}

.automation-step {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  padding: 0.75rem 1rem;
  margin-bottom: 0.75rem;
  background: var(--bs-body-bg);
}

.wysiwyg-wrapper {
  margin-top: 0.5rem;
}

.wysiwyg-toolbar {
  gap: 0.35rem;
  margin-bottom: 0.5rem;
}

.wysiwyg-toolbar .btn {
  border-radius: 0.35rem;
}

.wysiwyg-editor {
  min-height: 220px;
  overflow-y: auto;
}

.wysiwyg-editor.wysiwyg-empty::before {
  content: attr(data-placeholder);
  color: var(--bs-secondary-color);
}

.email-summary-highlight {
  border: none;
  border-radius: 1rem;
  background: var(--bs-primary-bg-subtle);
  color: var(--bs-primary-text);
  box-shadow: inset 0 0 0 1px rgba(13, 110, 253, 0.15);
}

.email-metric .fw-semibold {
  font-size: 1.25rem;
}

.email-mini-campaign {
  padding: 0.75rem 0;
  border-top: 1px solid rgba(148, 163, 184, 0.2);
}

.email-mini-campaign:first-of-type {
  border-top: none;
  padding-top: 0;
}

.email-mini-campaign:last-of-type {
  padding-bottom: 0;
}

#emailOverviewLoading,
#emailCampaignLoading,
#emailAudienceLoading {
  min-height: 140px;
}

.btn-email-add-contact {
  white-space: nowrap;
}

.account-card {
  border-radius: 1rem;
  border: 1px solid var(--bs-border-color);
  background: var(--bs-body-bg);
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

.account-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--bs-primary-bg-subtle);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  color: var(--bs-primary);
  overflow: hidden;
}

.account-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.summary-pill {
  min-width: 120px;
  padding: 0.5rem 0.75rem;
  border-radius: 0.75rem;
  background: var(--bs-tertiary-bg);
  border: 1px solid var(--bs-border-color);
}

.summary-pill .label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--bs-secondary-color);
}

.summary-pill .value {
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--bs-body-color);
}

.post-card {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  padding: 1rem;
  margin-bottom: 1rem;
  background: var(--bs-body-bg);
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.04);
}

.post-card .post-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  color: var(--bs-secondary-color);
  font-size: 0.85rem;
}

.post-card .media {
  margin-bottom: 0.75rem;
}

.post-card .media img {
  max-width: 100%;
  border-radius: 0.75rem;
}

.post-card .post-message {
  white-space: pre-wrap;
  margin-bottom: 0.75rem;
}

.post-card .post-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.post-card .metric {
  display: flex;
  flex-direction: column;
  font-size: 0.75rem;
  color: var(--bs-secondary-color);
}

.post-card .metric-value {
  font-size: 1rem;
  font-weight: 600;
  color: var(--bs-body-color);
}

.empty-state {
  padding: 2rem 1rem;
  text-align: center;
  background: var(--bs-tertiary-bg);
  border-radius: 0.75rem;
  color: var(--bs-secondary-color);
}

.account-list .list-group-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.account-list .list-group-item .form-check-input {
  margin-top: 0;
}

.integration-highlight {
  position: relative;
  z-index: 1;
  box-shadow: 0 0 0 0.4rem rgba(13, 110, 253, 0.25);
  animation: integrationHighlightPulse 1.2s ease-in-out infinite alternate;
}

@keyframes integrationHighlightPulse {
  from {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.35);
  }
  to {
    box-shadow: 0 0 0 0.45rem rgba(13, 110, 253, 0.15);
  }
}

[data-placeholder="chart"] {
  border: 1px dashed var(--bs-border-color);
  border-radius: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background-color: var(--bs-body-bg);
  color: var(--bs-secondary-color);
  text-align: center;
}

.app-footer {
  background-color: var(--surface);
  border-top: 1px solid var(--border);
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.5rem;
  font-size: 0.875rem;
}

.app-footer__left,
.app-footer__right {
  flex: 1 1 auto;
}

.app-footer__right {
  text-align: right;
}

.app-footer a {
  color: inherit;
  text-decoration: none;
}

.app-footer a:hover,
.app-footer a:focus {
  color: var(--primary);
  text-decoration: underline;
}

@media (max-width: 576px) {
  .app-footer__left,
  .app-footer__right {
    flex: 1 1 100%;
    text-align: left;
  }
}