/* =============================================================
   MS-PRO NEXT GENERATION — SIDEBAR STYLES
   v1.3.1: Increased CSS specificity for all widget title/body rules
   so WP core styles cannot override DC controls. All variables now
   use !important to guarantee DC settings take effect.
   ============================================================= */

.mspng-sidebar { min-width: 0; }

/* Sticky sidebar */
.mspng-sidebar-sticky {
  position: sticky;
  top: calc(var(--header-height) + var(--space-4));
  display: flex;
  flex-direction: column;
  gap: var(--sidebar-widget-spacing, 24px);
}

/* Sidebar widget container
   Both .widget (WP standard) and .mspng-widget (custom) */
.mspng-sidebar .widget,
.mspng-sidebar .mspng-widget {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
  overflow: hidden;
}

/* ── Widget Title
   .mspng-sidebar .widget .widget-title ensures higher specificity than:
   - WP core: h2.widget-title (0,1,1)
   - classic-themes.css: .widget-title
   Our selector: .mspng-sidebar .widget .widget-title = (0,3,0) — wins
   ── */
.mspng-sidebar .widget h2,
.mspng-sidebar .widget h3,
.mspng-sidebar .widget .widget-title,
.mspng-sidebar .mspng-widget .widget-title {
  font-family: var(--font-widget) !important;
  font-size: var(--sidebar-widget-title-size, 15px) !important;
  font-weight: var(--sidebar-widget-title-weight, 700) !important;
  color: var(--color-heading) !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em;
  margin: 0 0 var(--space-3) !important;
  padding: var(--sidebar-widget-padding, 20px) var(--sidebar-widget-padding, 20px) calc(var(--sidebar-widget-padding, 20px) * 0.6) !important;
  border-bottom: 2px solid var(--color-primary);
  display: flex;
  align-items: center;
  gap: var(--space-2);
  text-align: var(--text-align-widget, left) !important;
  background: transparent;
}

/* Accent bar before widget title */
.mspng-sidebar .widget h2::before,
.mspng-sidebar .widget h3::before,
.mspng-sidebar .widget .widget-title::before {
  content: '';
  display: inline-block;
  width: 3px;
  height: 16px;
  background: var(--color-primary);
  border-radius: var(--radius-full);
  flex-shrink: 0;
}

/* ── Widget Body Text
   Covers WP default widget content: <ul>, <li>, <p>, <a>
   Higher specificity than WP's element-level rules
   ── */
.mspng-sidebar .widget p,
.mspng-sidebar .widget ul,
.mspng-sidebar .widget ol,
.mspng-sidebar .widget li,
.mspng-sidebar .widget li a,
.mspng-sidebar .widget select,
.mspng-sidebar .widget .widget-body,
.mspng-sidebar .mspng-widget .widget-body {
  font-family: var(--font-widget) !important;
  font-size: var(--sidebar-body-font-size, 14px) !important;
  line-height: var(--lh-normal) !important;
  color: var(--color-text);
}

/* ── Links inside widgets ── */
.mspng-sidebar .widget a:not(.mspng-btn):not(.tag-cloud-link) {
  color: var(--color-text);
  text-decoration: none;
  transition: color var(--transition-fast);
}
.mspng-sidebar .widget a:not(.mspng-btn):not(.tag-cloud-link):hover {
  color: var(--color-primary);
}

/* ── Widget inner padding ── */
.mspng-sidebar .widget > ul,
.mspng-sidebar .widget > ol,
.mspng-sidebar .widget > p,
.mspng-sidebar .widget .widget-body,
.mspng-sidebar .widget select {
  padding-left: var(--sidebar-widget-padding, 20px) !important;
  padding-right: var(--sidebar-widget-padding, 20px) !important;
  padding-bottom: var(--sidebar-widget-padding, 20px) !important;
}

/* ── Widget list items: spacing between entries ── */
.mspng-sidebar .widget ul li {
  padding: 5px 0;
  border-bottom: 1px solid var(--color-border);
  list-style: none;
}
.mspng-sidebar .widget ul li:last-child { border-bottom: none; }
.mspng-sidebar .widget ul { padding-left: var(--sidebar-widget-padding, 20px) !important; padding-right: var(--sidebar-widget-padding, 20px) !important; }

/* ── Widget header block (for custom widgets) ── */
.widget-header {
  padding: var(--sidebar-widget-padding, 20px) var(--sidebar-widget-padding, 20px) calc(var(--sidebar-widget-padding, 20px) * 0.7);
  border-bottom: 1px solid var(--color-border);
}

/* Widget body */
.widget-body { padding: calc(var(--sidebar-widget-padding, 20px) * 0.8) var(--sidebar-widget-padding, 20px); }

/* ── Widget: Recent Posts / Popular Posts ── */
.widget-posts__list { list-style: none; padding: 0; margin: 0; }
.widget-posts__item {
  display: flex;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
  border-bottom: 1px solid var(--color-border);
  transition: background var(--transition-fast);
}
.widget-posts__item:last-child { border-bottom: none; }
.widget-posts__item:hover { background: var(--color-surface-2); }
.widget-posts__thumb {
  width: 64px;
  height: 64px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  flex-shrink: 0;
  background: var(--color-surface-2);
}
.widget-posts__thumb img { width: 100%; height: 100%; object-fit: cover; }
.widget-posts__content { flex: 1; min-width: 0; }
.widget-posts__title {
  font-size: var(--text-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-heading);
  line-height: var(--lh-snug);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: var(--space-1);
  transition: color var(--transition-fast);
}
.widget-posts__item:hover .widget-posts__title { color: var(--color-primary); }
.widget-posts__meta {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

/* ── Widget: Live Scores ── */
.widget-livescores .sdb-table-wrap {
  border-radius: 0;
  border: none;
  box-shadow: none;
}

/* ── Widget: Standings ── */
.widget-standings .ms-standings-wrap {
  border-radius: 0;
  border: none;
  box-shadow: none;
}
.widget-standings .ms-standings-table { font-size: var(--text-xs); }
.widget-standings .ms-standings-table thead th { padding: var(--space-2) var(--space-3); }
.widget-standings .ms-standings-table tbody td { padding: var(--space-2) var(--space-3); }

/* ── Widget: Category Tags ── */
.widget-tags .tag-cloud-link {
  display: inline-flex;
  margin: 3px;
  padding: 4px 12px;
  font-size: var(--text-xs) !important;
  font-weight: var(--fw-medium);
  background: var(--color-surface-2);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  color: var(--color-text-muted);
  transition: all var(--transition-fast);
}
.widget-tags .tag-cloud-link:hover {
  background: var(--color-primary-light);
  border-color: var(--color-primary);
  color: var(--color-primary);
}

/* ── Widget: Newsletter ── */
.widget-newsletter { padding: var(--space-5); }
.widget-newsletter .mspng-newsletter { padding: var(--space-6) var(--space-5); }
.widget-newsletter .mspng-newsletter__title { font-size: var(--text-xl); }
.widget-newsletter .mspng-newsletter__form { flex-direction: column; }

/* ── Widget: Ad Block ── */
.widget-advertisement { padding: var(--space-4); text-align: center; }

/* ── Widget: Team Spotlight ── */
.widget-team-spotlight__badge {
  width: 80px;
  height: 80px;
  margin: 0 auto var(--space-4);
  display: block;
  object-fit: contain;
}
.widget-team-spotlight__name {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: var(--fw-bold);
  text-align: center;
  color: var(--color-heading);
  margin-bottom: var(--space-2);
}
.widget-team-spotlight__league {
  text-align: center;
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  margin-bottom: var(--space-4);
}
.widget-team-spotlight__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-2);
  text-align: center;
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}
.widget-team-spotlight__stat-value {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: var(--fw-extrabold);
  color: var(--color-primary);
  display: block;
}
.widget-team-spotlight__stat-label {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: var(--ls-wide);
}

/* ── Sidebar Layout Stability & Formatting Protections ── */
.mspng-sidebar img {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  display: block !important;
}

.mspng-sidebar-ad {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
.mspng-sidebar-ad iframe,
.mspng-sidebar-ad img,
.mspng-sidebar-ad ins,
.mspng-sidebar-ad embed {
  max-width: 100% !important;
  height: auto !important;
}

/* Sidebar Excerpts, descriptions, summaries text justification */
.mspng-sidebar .widget,
.mspng-sidebar .widget p,
.mspng-sidebar .widget .widget-body,
.mspng-sidebar .widget-posts__title,
.mspng-sidebar .mspng-widget p,
.mspng-sidebar .widget ul,
.mspng-sidebar .widget ol,
.mspng-sidebar .widget ul li,
.mspng-sidebar .widget ul li a,
.sidebar-area .widget,
.sidebar-area .widget p,
.sidebar-area .widget ul li,
.sidebar-area .widget ul li a,
.sidebar .widget,
.sidebar .widget p,
.sidebar .widget ul li,
.sidebar .widget ul li a,
aside .widget,
aside .widget p,
aside .widget ul li,
aside .widget ul li a {
  text-align: justify !important;
  text-justify: inter-word !important;
}

/* Keep headings, metadata and scoreboards left/centered/unjustified */
.mspng-sidebar .widget h2,
.mspng-sidebar .widget h3,
.mspng-sidebar .widget .widget-title,
.mspng-sidebar .widget-posts__meta,
.mspng-sidebar .widget-team-spotlight__name,
.mspng-sidebar .widget-team-spotlight__league,
.mspng-sidebar .widget-team-spotlight__stat-label {
  text-align: inherit !important;
}