/**
 * Admin CMS (/dashboard/*) — loaded after locial-marketing-theme.css.
 * Requires Bootstrap theme CSS (css-all + css-style) via useLoadBootstrapAssets.
 */

.public-site.admin-dashboard-page {
  --bs-body-bg: var(--locial-bg);
  --bs-body-color: var(--locial-text);
  /* Bootstrap .text-body uses --bs-body-color-rgb; without this, light-theme RGB stays dark → invisible on dark cards */
  --bs-body-color-rgb: 240, 242, 243;
  --bs-card-bg: var(--locial-surface);
  --bs-card-color: var(--locial-text);
  --bs-card-border-color: var(--locial-border);
  /* Readable body + consistent dashboard scale (30px page titles) */
  --bs-body-font-size: 0.9375rem; /* 15px */
  --admin-font-page-title: 1.875rem; /* 30px */
  --admin-font-section: 1.375rem; /* 22px */
  --admin-font-subsection: 1.125rem; /* 18px */
  --admin-font-card-title: 1rem; /* 16px */
  --admin-font-label: 0.9375rem; /* 15px */
  --admin-font-meta: 0.8125rem; /* 13px */
  --admin-font-caption: 0.75rem; /* 12px */
  --admin-sidebar-width: 260px;
  min-height: 100vh;
  font-size: var(--bs-body-font-size);
}

@media (min-width: 1200px) {
  .public-site.admin-dashboard-page {
    --admin-sidebar-width: 230px;
  }
}

/* No backdrop-filter here: blur on many .card instances while scrolling is a major jank source; surface is already opaque. */
.public-site.admin-dashboard-page .card {
  --bs-card-title-color: var(--locial-text-heading);
  background-color: var(--locial-surface) !important;
  border: 1px solid var(--locial-border) !important;
  color: var(--locial-text) !important;
  box-shadow: var(--locial-shadow-card) !important;
}

/* Inset text / readonly blocks (replaces Tailwind bg-gray-50 on dark dashboard) */
.public-site.admin-dashboard-page .admin-dashboard-readonly-block {
  background: rgba(0, 12, 16, 0.42) !important;
  border: 1px solid var(--locial-border);
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  color: var(--locial-text) !important;
}

.public-site.admin-dashboard-page .admin-dashboard-file-row {
  align-items: center;
  background: rgba(0, 12, 16, 0.35) !important;
  border: 1px solid var(--locial-border) !important;
  border-radius: 0.5rem;
  display: flex;
  padding: 0.75rem 1rem;
}

/* Campaign create/edit — “run on all locations” callout */
.public-site.admin-dashboard-page .campaign-form-run-all-box {
  background: rgba(0, 12, 16, 0.35) !important;
  border: 2px dashed var(--locial-border) !important;
  border-radius: 0.75rem;
  padding: 1rem 1.125rem;
}

.public-site.admin-dashboard-page .campaign-form-location-grid {
  max-height: 24rem;
  overflow-y: auto;
  padding-right: 0.25rem;
}

.public-site.admin-dashboard-page .campaign-form-location-card:hover {
  border-color: rgba(13, 110, 253, 0.65) !important;
  background: rgba(13, 110, 253, 0.06) !important;
}

.public-site.admin-dashboard-page .admin-dashboard-pending-ad-hover {
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.public-site.admin-dashboard-page a:hover .admin-dashboard-pending-ad-hover {
  border-color: var(--locial-border-strong) !important;
  background: rgba(0, 12, 16, 0.35) !important;
}

.public-site.admin-dashboard-page .advertiser-list-card-hover {
  cursor: pointer;
  transition: box-shadow 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.public-site.admin-dashboard-page .advertiser-list-card-hover:hover {
  box-shadow: var(--locial-shadow-card) !important;
  border-color: var(--locial-border-strong) !important;
  transform: translateY(-1px);
}

.public-site.admin-dashboard-page .customer-list-card-hover {
  cursor: pointer;
  transition: box-shadow 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.public-site.admin-dashboard-page .customer-list-card-hover:hover {
  box-shadow: var(--locial-shadow-card) !important;
  border-color: var(--locial-border-strong) !important;
  transform: translateY(-1px);
}

.public-site.admin-dashboard-page .customer-stat-card-clickable {
  cursor: pointer;
  transition: box-shadow 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.public-site.admin-dashboard-page .customer-stat-card-clickable:hover {
  box-shadow: var(--locial-shadow-card) !important;
  border-color: var(--locial-border-strong) !important;
  transform: translateY(-1px);
}

.public-site.admin-dashboard-page .customer-stat-card-clickable:focus-visible {
  outline: 2px solid var(--locial-cta);
  outline-offset: 2px;
}

.public-site.admin-dashboard-page .customer-stat-card-clickable.customer-stat-card-active {
  border: 1px solid var(--locial-border-strong) !important;
  box-shadow: var(--locial-shadow-card) !important;
  background: var(--locial-surface-elevated, rgba(255, 255, 255, 0.04));
}

.public-site.admin-dashboard-page .customer-stat-card-clickable.customer-stat-card-active .admin-dashboard-kpi-value {
  color: var(--locial-cta, var(--bs-primary)) !important;
}

.public-site.admin-dashboard-page .advertiser-ads-list-item {
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.public-site.admin-dashboard-page .advertiser-ads-list-item:hover {
  border-color: var(--locial-border-strong) !important;
  background: rgba(0, 12, 16, 0.28) !important;
}

.public-site.admin-dashboard-page .contact-submission-row {
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.public-site.admin-dashboard-page .contact-submission-row:hover {
  border-color: var(--locial-border-strong) !important;
  background: rgba(0, 12, 16, 0.22) !important;
}

.public-site.admin-dashboard-page .admin-dashboard-hover-surface:hover {
  background: rgba(0, 12, 16, 0.35) !important;
}

/* Slide builder — timeline row tints (replaces Tailwind bg-*-50) */
.public-site.admin-dashboard-page .slide-builder-slide-tile {
  border-width: 1px;
  border-style: solid;
  border-radius: 0.75rem;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
.public-site.admin-dashboard-page .slide-builder-slide-tile--ad {
  background: rgba(147, 51, 234, 0.12);
  border-color: rgba(147, 51, 234, 0.35);
}
.public-site.admin-dashboard-page .slide-builder-slide-tile--weather {
  background: rgba(13, 110, 253, 0.12);
  border-color: rgba(13, 110, 253, 0.35);
}
.public-site.admin-dashboard-page .slide-builder-slide-tile--news {
  background: rgba(253, 126, 20, 0.12);
  border-color: rgba(253, 126, 20, 0.35);
}
.public-site.admin-dashboard-page .slide-builder-slide-tile--sports {
  background: rgba(25, 135, 84, 0.12);
  border-color: rgba(25, 135, 84, 0.35);
}
.public-site.admin-dashboard-page .slide-builder-slide-tile--biz {
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--locial-border);
}
.public-site.admin-dashboard-page .slide-builder-slide-tile--default {
  background: var(--locial-surface);
  border-color: var(--locial-border);
}

/* Slide builder timeline — bare <button> + .text-muted can render as light icons on a light button chrome */
.public-site.admin-dashboard-page .slide-builder-timeline-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.375rem;
  line-height: 1;
  border-radius: 0.375rem;
  border: 1px solid var(--locial-border) !important;
  background: rgba(0, 12, 16, 0.4) !important;
  color: var(--locial-text) !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.public-site.admin-dashboard-page .slide-builder-timeline-action-btn:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: var(--locial-border-strong) !important;
  color: var(--locial-text-heading) !important;
}

.public-site.admin-dashboard-page .slide-builder-timeline-action-btn--danger {
  border-color: rgba(220, 53, 69, 0.5) !important;
  color: #f8a8b1 !important;
}

.public-site.admin-dashboard-page .slide-builder-timeline-action-btn--danger:hover {
  background: rgba(220, 53, 69, 0.18) !important;
  color: #fecaca !important;
  border-color: rgba(220, 53, 69, 0.75) !important;
}

.public-site.admin-dashboard-page .slide-builder-timeline-drag-handle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem;
  border-radius: 0.375rem;
  border: 1px solid transparent;
  background: transparent !important;
  color: var(--locial-text-muted) !important;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.public-site.admin-dashboard-page .slide-builder-timeline-drag-handle:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--locial-text-heading) !important;
  border-color: var(--locial-border);
}

.public-site.admin-dashboard-page .slide-builder-timeline-drag-handle:active {
  cursor: grabbing;
}

.public-site.admin-dashboard-page .slide-builder-timeline-droppable {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
}

.public-site.admin-dashboard-page .slide-builder-timeline-item--dragging {
  position: relative;
  z-index: 20;
}

.public-site.admin-dashboard-page .card-header {
  background: transparent !important;
  border-color: var(--locial-border) !important;
  color: var(--locial-text-heading) !important;
}

.public-site.admin-dashboard-page .text-muted {
  color: var(--locial-text-muted) !important;
}

/* Typography — main CMS content (page title = 30px, clear hierarchy) */
.public-site.admin-dashboard-page .admin-dashboard-main {
  font-size: var(--bs-body-font-size);
  line-height: 1.55;
}

.public-site.admin-dashboard-page .admin-dashboard-main h1 {
  font-size: var(--admin-font-page-title) !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
}

.public-site.admin-dashboard-page .admin-dashboard-main h2 {
  font-size: var(--admin-font-section) !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  letter-spacing: -0.015em;
}

.public-site.admin-dashboard-page .admin-dashboard-main h3:not(.h6) {
  font-size: var(--admin-font-subsection) !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
}

/* List / compact titles (e.g. h3.h6 on table rows) */
.public-site.admin-dashboard-page .admin-dashboard-main h3.h6,
.public-site.admin-dashboard-page .admin-dashboard-main h4.h6 {
  font-size: var(--admin-font-meta) !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  letter-spacing: 0;
}

.public-site.admin-dashboard-page .admin-dashboard-main h4 {
  font-size: var(--admin-font-card-title) !important;
  line-height: 1.4 !important;
}

.public-site.admin-dashboard-page .admin-dashboard-main h5 {
  font-size: var(--admin-font-label) !important;
  line-height: 1.45 !important;
}

.public-site.admin-dashboard-page .admin-dashboard-main h6 {
  font-size: var(--admin-font-meta) !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
}

.public-site.admin-dashboard-page .admin-dashboard-main p {
  font-size: var(--bs-body-font-size);
  line-height: 1.55;
}

.public-site.admin-dashboard-page .admin-dashboard-main .small,
.public-site.admin-dashboard-page .admin-dashboard-main small,
.public-site.admin-dashboard-page .admin-dashboard-main .text-small {
  font-size: var(--admin-font-meta) !important;
  line-height: 1.45 !important;
}

.public-site.admin-dashboard-page .admin-dashboard-main .form-label,
.public-site.admin-dashboard-page .admin-dashboard-main label.col-form-label {
  font-size: var(--admin-font-meta) !important;
}

.public-site.admin-dashboard-page .admin-dashboard-main .card-title {
  font-size: var(--admin-font-card-title) !important;
  line-height: 1.35 !important;
}

.public-site.admin-dashboard-page .admin-dashboard-main .table {
  font-size: var(--bs-body-font-size);
}

.public-site.admin-dashboard-page .admin-dashboard-main .table thead th {
  font-size: var(--admin-font-meta) !important;
  font-weight: 600 !important;
}

.public-site.admin-dashboard-page .admin-dashboard-main .modal-title {
  font-size: var(--admin-font-subsection) !important;
  line-height: 1.3 !important;
}

/* Top header strip — match body scale */
.public-site.admin-dashboard-page .admin-dashboard-top-header {
  font-size: var(--bs-body-font-size);
}

/* Modals rendered inside dashboard routes */
.public-site.admin-dashboard-page .modal {
  font-size: var(--bs-body-font-size);
}

.public-site.admin-dashboard-page .modal .modal-body p {
  font-size: var(--bs-body-font-size);
  line-height: 1.55;
}

/* KPI / stat numerals — avoid dark theme text tokens bleeding from Bootstrap */
.public-site.admin-dashboard-page .admin-dashboard-kpi-value {
  color: var(--locial-text-heading) !important;
}

/* Sidebar — fixed on lg+, min full viewport height; main offset */
@media (min-width: 992px) {
  .public-site .admin-dashboard-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1020;
    width: var(--admin-sidebar-width);
    min-height: 100vh;
    padding: 0.75rem;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    margin-bottom: 0 !important;
  }

  .public-site .admin-dashboard-sidebar > .admin-dashboard-sidebar-card {
    min-height: calc(100vh - 1.5rem);
    display: flex;
    flex-direction: column;
  }

  .public-site .admin-dashboard-sidebar .card-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
  }

  .public-site .admin-dashboard-main-column {
    margin-left: var(--admin-sidebar-width);
    width: calc(100% - var(--admin-sidebar-width));
    max-width: calc(100% - var(--admin-sidebar-width));
    box-sizing: border-box;
  }
}

@media (max-width: 991.98px) {
  .public-site .admin-dashboard-main-column {
    margin-left: 0;
    width: 100%;
    max-width: 100%;
  }
}

/* Sidebar — mirror partner sidebar tokens */
.public-site .admin-dashboard-sidebar .offcanvas-body .card,
.public-site .admin-dashboard-sidebar > .card {
  background: var(--locial-surface) !important;
  border: 1px solid var(--locial-border) !important;
  color: var(--locial-text) !important;
  box-shadow: var(--locial-shadow-card) !important;
}

.public-site .admin-dashboard-sidebar .card-header {
  background: transparent !important;
  border-color: var(--locial-border) !important;
  color: var(--locial-text-heading) !important;
}

.public-site .admin-dashboard-sidebar .nav-pills-primary-border-start .nav-link {
  color: #ffffff !important;
  font-size: var(--admin-font-meta, 0.8125rem) !important;
  line-height: 1.45 !important;
}

.public-site .admin-dashboard-sidebar .nav-pills-primary-border-start .nav-link.active,
.public-site .admin-dashboard-sidebar .nav-pills-primary-border-start .nav-link:hover {
  color: #ffffff !important;
  background-color: rgba(59, 214, 43, 0.12) !important;
  border-left-color: var(--locial-cta) !important;
}

.public-site .admin-dashboard-sidebar .nav-link.text-danger {
  color: var(--locial-danger) !important;
}

.public-site .admin-dashboard-sidebar .nav-link.text-danger:hover {
  color: #ffcccc !important;
  background-color: var(--locial-danger-bg) !important;
}

.public-site .admin-dashboard-avatar-initial {
  background: linear-gradient(
    145deg,
    rgba(59, 214, 43, 0.45) 0%,
    rgba(0, 36, 46, 0.98) 55%,
    #001319 100%
  ) !important;
  color: var(--locial-text-heading) !important;
}

/* Top header strip */
.public-site .admin-dashboard-top-header.card {
  background: var(--locial-surface-elevated) !important;
  border: 1px solid var(--locial-border) !important;
}

.public-site .admin-dashboard-top-header .admin-dashboard-top-header-logo {
  width: auto !important;
  max-width: none !important;
  height: 2.25rem;
  object-fit: contain;
}

/* List rows / chrome (used by CustomerList, etc.) */
.public-site.admin-dashboard-page .admin-dashboard-chrome-icon {
  background: rgba(0, 12, 16, 0.45) !important;
  border: 1px solid var(--locial-border) !important;
  color: var(--locial-text-muted);
}

.public-site.admin-dashboard-page .admin-dashboard-slug-pill {
  display: inline-block;
  background: rgba(0, 12, 16, 0.55) !important;
  border: 1px solid var(--locial-border);
  color: var(--locial-text-muted) !important;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.public-site.admin-dashboard-page .h1,
.public-site.admin-dashboard-page .h2,
.public-site.admin-dashboard-page .h3,
.public-site.admin-dashboard-page .h4,
.public-site.admin-dashboard-page .h5,
.public-site.admin-dashboard-page .h6,
.public-site.admin-dashboard-page h1,
.public-site.admin-dashboard-page h2,
.public-site.admin-dashboard-page h3,
.public-site.admin-dashboard-page h4,
.public-site.admin-dashboard-page h5,
.public-site.admin-dashboard-page h6 {
  color: var(--locial-text-heading) !important;
}

.public-site.admin-dashboard-page .form-control:not([type="file"]),
.public-site.admin-dashboard-page .form-select {
  background: var(--locial-input-bg) !important;
  border-color: var(--locial-input-border) !important;
  color: var(--locial-text) !important;
}

.public-site.admin-dashboard-page .form-control:not([type="file"]):focus,
.public-site.admin-dashboard-page .form-select:focus {
  background: var(--locial-input-bg-focus) !important;
  border-color: var(--locial-input-border-focus) !important;
  color: var(--locial-text) !important;
  box-shadow: 0 0 0 0.2rem var(--locial-focus-ring);
}

/* File inputs: global .form-control color !important + WebKit = white label text on white "Choose file" button */
.public-site.admin-dashboard-page input[type="file"].form-control {
  background: var(--locial-input-bg) !important;
  border-color: var(--locial-input-border) !important;
  color: var(--locial-text-muted) !important;
  padding: 0.35rem 0.5rem;
  border-radius: 0.5rem;
  min-height: 2.75rem;
}

.public-site.admin-dashboard-page input[type="file"].form-control:focus {
  outline: 0;
  background: var(--locial-input-bg-focus) !important;
  border-color: var(--locial-input-border-focus) !important;
  color: var(--locial-text-muted) !important;
  box-shadow: 0 0 0 0.2rem var(--locial-focus-ring);
}

.public-site.admin-dashboard-page input[type="file"].form-control::file-selector-button,
.public-site.admin-dashboard-page input[type="file"].form-control::-webkit-file-upload-button {
  margin-right: 0.75rem;
  padding: 0.45rem 1rem;
  border-radius: 0.375rem;
  border: 1px solid var(--locial-cta-hover) !important;
  background: var(--locial-cta) !important;
  background-color: var(--locial-cta) !important;
  color: var(--locial-cta-text) !important;
  font-weight: 600;
  font-size: 0.875rem;
  font-family: inherit;
  cursor: pointer;
}

.public-site.admin-dashboard-page input[type="file"].form-control::file-selector-button:hover,
.public-site.admin-dashboard-page input[type="file"].form-control::-webkit-file-upload-button:hover {
  background: var(--locial-cta-hover) !important;
  background-color: var(--locial-cta-hover) !important;
  border-color: var(--locial-cta-active) !important;
  color: var(--locial-cta-text) !important;
}

.public-site.admin-dashboard-page input[type="file"].form-control:disabled::file-selector-button,
.public-site.admin-dashboard-page input[type="file"].form-control:disabled::-webkit-file-upload-button {
  opacity: 0.55;
  cursor: not-allowed;
}

.public-site.admin-dashboard-page .input-group-text {
  background: var(--locial-input-bg) !important;
  border-color: var(--locial-input-border) !important;
  color: var(--locial-text-muted) !important;
}

.public-site.admin-dashboard-page .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--locial-text);
  border-color: var(--locial-border);
}

.public-site.admin-dashboard-page .table thead th {
  color: var(--locial-text-heading);
  border-color: var(--locial-border);
}
