/* Override Django dark_mode.css when light is forced */
html[data-theme="light"] body.yt-admin,
html[data-theme="light"] body.yt-admin #container,
html[data-theme="light"] body.yt-admin #content,
html[data-theme="light"] body.yt-admin main.content {
  background: var(--yt-bg) !important;
  color: var(--yt-text) !important;
}

html[data-theme="light"] body.yt-admin .module,
html[data-theme="light"] body.yt-admin #changelist,
html[data-theme="light"] body.yt-admin .yt-card,
html[data-theme="light"] body.yt-admin .yt-kpi {
  background: var(--yt-bg-elevated) !important;
  color: var(--yt-text) !important;
}

html[data-theme="light"] body.yt-admin table thead th {
  color: var(--yt-text-secondary) !important;
}

html[data-theme="light"] body.yt-admin table td,
html[data-theme="light"] body.yt-admin table th,
html[data-theme="light"] body.yt-admin label,
html[data-theme="light"] body.yt-admin .form-row,
html[data-theme="light"] body.yt-admin #content p,
html[data-theme="light"] body.yt-admin #content li,
html[data-theme="light"] body.yt-admin main.content p,
html[data-theme="light"] body.yt-admin main.content li {
  color: var(--yt-text);
}

html[data-theme="light"] body.yt-admin #header.yt-navbar .yt-brand a,
html[data-theme="light"] body.yt-admin #header.yt-navbar .yt-brand a:link,
html[data-theme="light"] body.yt-admin #header.yt-navbar .yt-brand a:visited,
html[data-theme="light"] body.yt-admin #header.yt-navbar .yt-brand__text {
  color: #141414 !important;
}

html[data-theme="light"] body.yt-admin #header.yt-navbar {
  color: #141414 !important;
}

html[data-theme="light"] body.yt-admin .yt-cmd__item-sub,
html[data-theme="light"] body.yt-admin .yt-cmd__hint {
  color: #404348 !important;
}

/* Sidebar stays dark even in light theme — never inherit page text color */
html[data-theme="light"] body.yt-admin #nav-sidebar,
html[data-theme="light"] body.yt-admin #nav-sidebar p,
html[data-theme="light"] body.yt-admin #nav-sidebar li,
html[data-theme="light"] body.yt-admin #nav-sidebar span,
html[data-theme="light"] body.yt-admin #nav-sidebar button {
  color: #fefefe;
}

html[data-theme="light"] body.yt-admin #nav-sidebar .yt-sidebar__label {
  color: #b8bec6 !important;
}

html[data-theme="light"] body.yt-admin #nav-sidebar .yt-sidebar__empty,
html[data-theme="light"] body.yt-admin #nav-sidebar .yt-empty {
  color: #c0c6ce !important;
}

html[data-theme="light"] body.yt-admin #nav-sidebar a:link,
html[data-theme="light"] body.yt-admin #nav-sidebar a:visited {
  color: #fefefe;
}

html[data-theme="light"] body.yt-admin #nav-sidebar .yt-app-group__table,
html[data-theme="light"] body.yt-admin #nav-sidebar .yt-app-group__table tbody,
html[data-theme="light"] body.yt-admin #nav-sidebar .yt-app-group__table tr,
html[data-theme="light"] body.yt-admin #nav-sidebar .yt-app-group__table th,
html[data-theme="light"] body.yt-admin #nav-sidebar .yt-app-group__table td {
  background: transparent !important;
  color: #fefefe !important;
}

/* Chart area for conversion widget */
#chart-wrap-checkout-trigger {
  min-height: 220px;
  position: relative;
}

#chart-wrap-checkout-trigger canvas {
  width: 100% !important;
  height: 220px !important;
}

.viz-card-header .viz-table-toggle {
  border: 1px solid var(--yt-border, rgba(20,20,20,0.12));
  border-radius: 999px;
  padding: 6px 12px;
  background: var(--yt-bg-muted, #ececed);
  color: var(--yt-orange, #fe6819) !important;
  text-decoration: none !important;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
}

.viz-card-header .viz-table-toggle:hover {
  background: var(--yt-orange-soft, rgba(254,104,25,0.14));
}