/* =========================================================================
 * Niyal Modern UI  —  tuned dark skin for the Muusico lyrics theme
 * Loaded automatically only when Muusico (parent or child) is the active theme.
 * Targets Muusico's real container classes so dark mode looks intentional.
 * Selectors are html[data-theme="dark"] scoped -> light mode is untouched, and
 * the extra [data-theme] specificity beats Muusico's base rules without !important.
 * ========================================================================= */

/* =========================================================================
 * PREMIUM RESTYLE  (applies in BOTH light & dark — gated by html.nmui-premium)
 * Apple-style: soft big corners, layered shadows, glass, refined type & motion.
 * ========================================================================= */

/* Content "sheet" rising over the hero (iOS-like) */
html.nmui-premium .content-pull,
html.nmui-premium .height-capsule {
  border-radius: var(--nmui-r-xl) var(--nmui-r-xl) 0 0;
  box-shadow: 0 -12px 40px rgba(17, 17, 26, .08);
  position: relative;
  overflow: hidden;
}
html.nmui-premium.nmui-premium[data-theme="dark"] .content-pull,
html[data-theme="dark"].nmui-premium .height-capsule { box-shadow: 0 -12px 40px rgba(0, 0, 0, .45); }

/* Hero: rounded lower corners + graceful gradient overlay */
html.nmui-premium .background-single-lyrics {
  border-radius: 0 0 var(--nmui-r-xl) var(--nmui-r-xl);
  overflow: hidden;
}
html.nmui-premium .single-lyrics-overlay {
  background: linear-gradient(180deg, rgba(0, 0, 0, .18) 0%, rgba(0, 0, 0, .48) 60%, rgba(0, 0, 0, .68) 100%);
}

/* Cards — widgets, ad boxes, media, empty states */
html.nmui-premium :is(.sidebar-widget, .single-widget, .single-lyric-ads, .single-lyric-video, .media_background, .no-widget) {
  border-radius: var(--nmui-r-md);
  box-shadow: var(--nmui-shadow-sm);
  border: 1px solid color-mix(in srgb, currentColor 8%, transparent);
  overflow: hidden;
  transition: transform var(--nmui-tr), box-shadow var(--nmui-tr);
}
html.nmui-premium :is(.sidebar-widget, .single-widget):hover { transform: translateY(-2px); box-shadow: var(--nmui-shadow-md); }

/* Lyric list rows -> tappable cards with hover lift */
html.nmui-premium .list-line {
  border-radius: var(--nmui-r-sm);
  box-shadow: var(--nmui-shadow-sm);
  padding: 14px 16px;
  margin-bottom: 10px;
  transition: transform var(--nmui-tr), box-shadow var(--nmui-tr), background var(--nmui-tr);
}
html.nmui-premium .list-line:hover { transform: translateY(-2px); box-shadow: var(--nmui-shadow-md); }
html.nmui-premium .album-line { border-radius: var(--nmui-r-sm); }

/* Single-lyric body: premium reading surface */
html.nmui-premium .lyric-text {
  border-radius: var(--nmui-r-lg);
  box-shadow: var(--nmui-shadow-sm);
  padding: 26px clamp(18px, 4vw, 34px);
  font-size: 1.05rem;
  line-height: 1.95;
  letter-spacing: .002em;
}
html.nmui-premium .lyric-text .translated { line-height: 1.9; }

/* Search: prominent glass pill */
html.nmui-premium .search-wrapper input[type="search"],
html.nmui-premium .search-wrapper input[type="text"],
html.nmui-premium #mini-search-wrapper,
html.nmui-premium .s-input {
  border-radius: var(--nmui-r-pill) !important;
  backdrop-filter: blur(14px) saturate(140%);
  box-shadow: var(--nmui-shadow-md);
  border: 1px solid rgba(255, 255, 255, .35);
}
html.nmui-premium .search-wrapper input:focus,
html.nmui-premium .s-input:focus { box-shadow: var(--nmui-shadow-md), var(--nmui-ring); }
html.nmui-premium .s-submit { border-radius: var(--nmui-r-pill); }

/* Buttons: pill + accent gradient + lift */
html.nmui-premium :is(.button, .submit-lyric a, .s-submit, input[type="submit"]) {
  border-radius: var(--nmui-r-pill);
  background: linear-gradient(145deg, color-mix(in srgb, var(--nmui-accent) 90%, #fff), var(--nmui-accent)) !important;
  color: #fff !important;
  box-shadow: var(--nmui-shadow-sm);
  border: none;
}
html.nmui-premium :is(.button, .submit-lyric a):hover { transform: translateY(-2px); box-shadow: var(--nmui-shadow-md); }

/* Alphabet index -> pill chips */
html.nmui-premium .lyric-alphabet ul li a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  border-radius: var(--nmui-r-pill);
  transition: background var(--nmui-tr), color var(--nmui-tr), transform var(--nmui-tr);
}
html.nmui-premium .lyric-alphabet ul li a:hover {
  background: var(--nmui-accent);
  color: #fff !important;
  transform: translateY(-1px);
}

/* Menu links: rounded hover */
html.nmui-premium #nav > li > a {
  border-radius: var(--nmui-r-pill);
  transition: background var(--nmui-tr), color var(--nmui-tr);
  padding-left: 14px;
  padding-right: 14px;
}
html.nmui-premium #nav > li > a:hover { background: color-mix(in srgb, var(--nmui-accent) 14%, transparent); }

/* Pagination -> soft round buttons */
html.nmui-premium .custom-pagination a,
html.nmui-premium .pagination a {
  border-radius: var(--nmui-r-pill);
  box-shadow: var(--nmui-shadow-sm);
  transition: transform var(--nmui-tr), box-shadow var(--nmui-tr), background var(--nmui-tr);
}
html.nmui-premium .custom-pagination a:hover { transform: translateY(-2px); box-shadow: var(--nmui-shadow-md); }

/* Thumbnails / cover art: rounded, clipped */
html.nmui-premium :is(.list-line, .album-line, .sidebar-widget, .single-artist) img,
html.nmui-premium .popular-lyrics img,
html.nmui-premium .latest-lyrics img { border-radius: var(--nmui-r-sm); }

/* Section titles: refined weight + accent tick */
html.nmui-premium .title h3,
html.nmui-premium .latestnew h3 {
  font-weight: 700;
  letter-spacing: -.01em;
}
html.nmui-premium .title h3 i { color: var(--nmui-accent); }

/* Comment cards */
html.nmui-premium .user-comment-box {
  border-radius: var(--nmui-r-md);
  box-shadow: var(--nmui-shadow-sm);
  border: 1px solid color-mix(in srgb, currentColor 8%, transparent);
}

/* Featured / popular carousel card. NOTE: `.single-album` must exclude the <body>
   — WordPress adds a `single-album` class to the <body> of single album pages, and
   `overflow:hidden` there would freeze the whole page's scroll. */
html.nmui-premium .popular-lyrics .item,
html.nmui-premium .single-album:not(body) { border-radius: var(--nmui-r-md); overflow: hidden; }

/* Artist page: premium circular avatar in the hero + photo widget */
html.nmui-premium .artist-hero { display: flex; align-items: center; gap: 18px; }
html.nmui-premium .artist-avatar {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  overflow: hidden;
  flex: 0 0 auto;
  border: 3px solid rgba(255, 255, 255, .9);
  box-shadow: var(--nmui-shadow-md);
  background: var(--nmui-surface, #eee);
}
html.nmui-premium .artist-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
html.nmui-premium .artist-hero-name h1 { margin: 0; }
html.nmui-premium .artist-photo-widget img { border-radius: var(--nmui-r-md); width: 100%; height: auto; display: block; }
html.nmui-premium .artist-photo-empty {
  padding: 28px 14px;
  text-align: center;
  color: var(--nmui-muted, #999);
  border: 1px dashed color-mix(in srgb, currentColor 25%, transparent);
  border-radius: var(--nmui-r-md);
}
@media (max-width: 600px) {
  html.nmui-premium .artist-avatar { width: 64px; height: 64px; }
}

/* ---- extra super-modern polish ---- */

/* Glassy app-bar header */
html.nmui-premium .blog-back {
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  box-shadow: var(--nmui-shadow-sm);
}
html.nmui-premium.nmui-premium[data-theme="dark"] .blog-back,
html[data-theme="dark"].nmui-premium .blog-back { background: color-mix(in srgb, var(--nmui-surface) 82%, transparent); }

/* Section titles get a small accent bar under the text */
html.nmui-premium .title h3,
html.nmui-premium .title h4 { position: relative; padding-bottom: 8px; }
html.nmui-premium .title h3::after,
html.nmui-premium .title h4::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 42px;
  height: 3px;
  border-radius: var(--nmui-r-pill);
  background: var(--nmui-accent);
}

/* Cover-art hover zoom (clipped by the rounded card). `.single-album:not(body)` —
   see note above: the body carries a single-album class on single album pages. */
html.nmui-premium :is(.list-line, .album-line, .popular-lyrics .item, .single-album:not(body)) { overflow: hidden; }
html.nmui-premium :is(.list-line, .album-line) img {
  transition: transform var(--nmui-tr);
}
html.nmui-premium :is(.list-line, .album-line):hover img { transform: scale(1.06); }

/* Featured / album tiles rounding + lift */
html.nmui-premium .full-screen-list-inside ul li,
html.nmui-premium .popular-lyrics .item {
  border-radius: var(--nmui-r-md);
  overflow: hidden;
  transition: transform var(--nmui-tr), box-shadow var(--nmui-tr);
}
html.nmui-premium .full-screen-list-inside ul li:hover { transform: translateY(-3px); box-shadow: var(--nmui-shadow-md); }

/* Media (audio/video) blocks rounded */
html.nmui-premium .media_background :is(audio, video, iframe) { border-radius: var(--nmui-r-sm); width: 100%; }

/* ---- App-shell: mobile bottom navigation (structural — not premium-gated) ---- */
.niyal-bottom-nav {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 2147482000;
  display: none;
  justify-content: space-around;
  align-items: stretch;
  padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px));
  background: var(--nmui-glass-light, rgba(255, 255, 255, .88));
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  border-top: 1px solid var(--nmui-border, #e2e2e6);
  box-shadow: 0 -6px 24px rgba(0, 0, 0, .08);
}
html[data-theme="dark"] .niyal-bottom-nav {
  background: var(--nmui-glass-dark, rgba(20, 22, 28, .82));
  border-top-color: var(--nmui-border, #2c313b);
}
.niyal-bottom-nav .nbn-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 6px 4px;
  text-decoration: none;
  color: var(--nmui-muted, #8a8f98);
  font-size: 11px;
  letter-spacing: .01em;
  border-radius: var(--nmui-r-sm, 14px);
  transition: color .2s, background .2s, transform .15s;
}
.niyal-bottom-nav .nbn-item i { font-size: 19px; line-height: 1; }
.niyal-bottom-nav .nbn-item:hover { color: var(--nmui-accent, #e4422e); background: color-mix(in srgb, var(--nmui-accent, #e4422e) 10%, transparent); }
.niyal-bottom-nav .nbn-item:active { transform: scale(.93); }

@media (max-width: 900px) {
  .niyal-bottom-nav { display: flex; }
  body { padding-bottom: 70px; }
  /* keep the floating dark-mode toggle above the bar */
  .nmui-toggle.nmui-pos-bottom-right,
  .nmui-toggle.nmui-pos-bottom-left { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
}

/* ========================================================================= */

/* Page shell */
html[data-theme="dark"] #wrapper,
html[data-theme="dark"] .height-capsule { background: var(--nmui-bg) !important; }
html[data-theme="dark"] .content-capsule,
html[data-theme="dark"] .content-pull,
html[data-theme="dark"] .page-container,
html[data-theme="dark"] .second-container { background: var(--nmui-bg); color: var(--nmui-text); }

/* Header / menu / alphabet bar */
html[data-theme="dark"] .blog-back,
html[data-theme="dark"] .nav-top,
html[data-theme="dark"] .main-header,
html[data-theme="dark"] .menu,
html[data-theme="dark"] #menu,
html[data-theme="dark"] .pre-header,
html[data-theme="dark"] .lyric-alphabet { background: var(--nmui-surface); border-color: var(--nmui-border); }
html[data-theme="dark"] #nav a,
html[data-theme="dark"] .lyric-alphabet a,
html[data-theme="dark"] .menu a { color: var(--nmui-text); }
html[data-theme="dark"] #nav a:hover,
html[data-theme="dark"] .lyric-alphabet a:hover { color: var(--nmui-accent); }

/* Mini search */
html[data-theme="dark"] #mini-search-wrapper { background: var(--nmui-elev); border-color: var(--nmui-border); }
html[data-theme="dark"] .s-input { background: var(--nmui-elev); color: var(--nmui-text); }
html[data-theme="dark"] .s-submit { background: var(--nmui-accent); color: #fff; }
html[data-theme="dark"] .searchminicats li { color: var(--nmui-text); }

/* Cards / widgets / ad boxes */
html[data-theme="dark"] .sidebar-widget,
html[data-theme="dark"] .single-widget,
html[data-theme="dark"] .single-lyric-ads,
html[data-theme="dark"] .single-lyric-video,
html[data-theme="dark"] .media_background,
html[data-theme="dark"] .no-widget {
  background: var(--nmui-surface);
  color: var(--nmui-text);
  border: 1px solid var(--nmui-border);
  border-radius: var(--nmui-radius);
}
html[data-theme="dark"] .sidebar-widget h3,
html[data-theme="dark"] .single-widget .title h4 { color: var(--nmui-text); }

/* Lyric list rows / tables */
html[data-theme="dark"] .album-line,
html[data-theme="dark"] .list-line {
  background: var(--nmui-surface);
  border-color: var(--nmui-border);
  border-radius: calc(var(--nmui-radius) - 6px);
}
html[data-theme="dark"] .list-line:hover { background: var(--nmui-elev); }
html[data-theme="dark"] .table-title { color: var(--nmui-muted); }
html[data-theme="dark"] .album-line a,
html[data-theme="dark"] .list-line a { color: var(--nmui-text); }
html[data-theme="dark"] .list-line a:hover { color: var(--nmui-accent); }

/* Single lyric body */
html[data-theme="dark"] .lyric-text,
html[data-theme="dark"] .lyric-line,
html[data-theme="dark"] .lyric-bottom {
  background: var(--nmui-surface);
  color: var(--nmui-text);
  border-color: var(--nmui-border);
  border-radius: var(--nmui-radius);
}
html[data-theme="dark"] .lyric-text .translated { color: var(--nmui-muted); }
html[data-theme="dark"] .same-album h3,
html[data-theme="dark"] .related-list a { color: var(--nmui-text); }
html[data-theme="dark"] .genre-list a { color: var(--nmui-accent); }

/* Comments */
html[data-theme="dark"] .user-comment-box,
html[data-theme="dark"] .comment-content,
html[data-theme="dark"] #respond,
html[data-theme="dark"] .commentlist li {
  background: var(--nmui-surface);
  color: var(--nmui-text);
  border-color: var(--nmui-border);
}
html[data-theme="dark"] .comment-content .author h4 { color: var(--nmui-text); }

/* Pagination */
html[data-theme="dark"] .custom-pagination a,
html[data-theme="dark"] .pagination a {
  background: var(--nmui-surface);
  color: var(--nmui-text);
  border-color: var(--nmui-border);
}
html[data-theme="dark"] .custom-pagination .active a,
html[data-theme="dark"] .custom-pagination a:hover { background: var(--nmui-accent); color: #fff; }

/* Footer */
html[data-theme="dark"] .footer,
html[data-theme="dark"] #footer,
html[data-theme="dark"] .footer-widgets { background: var(--nmui-surface); color: var(--nmui-text); border-color: var(--nmui-border); }
html[data-theme="dark"] .footer a { color: var(--nmui-muted); }
html[data-theme="dark"] .footer a:hover { color: var(--nmui-accent); }

/* Buttons */
html[data-theme="dark"] .button,
html[data-theme="dark"] .submit-lyric a { background: var(--nmui-accent); color: #fff; border-color: transparent; }

/* Keep the hero image readable in dark mode by deepening its overlay */
html[data-theme="dark"] .single-lyrics-overlay { background: rgba(0, 0, 0, .55); }

/* --- Homepage sections & full-width content wrappers (theme hardcodes #fff) --- */
html[data-theme="dark"] .popular-lyrics,
html[data-theme="dark"] .latest-lyrics-container,
html[data-theme="dark"] .homepage-advertisement,
html[data-theme="dark"] .second-container {
  background: var(--nmui-bg) !important;
  color: var(--nmui-text);
}
html[data-theme="dark"] .homepage-news { background: var(--nmui-surface) !important; color: var(--nmui-text); }

/* Zebra list rows used on homepage / archives */
html[data-theme="dark"] .latest-lyrics ul li,
html[data-theme="dark"] .latest-lyrics ul li:nth-child(2n+1) { background: var(--nmui-surface); border-color: var(--nmui-border); }
html[data-theme="dark"] .latest-lyrics ul li a,
html[data-theme="dark"] .popular-lyrics a,
html[data-theme="dark"] .latest-lyrics-container a { color: var(--nmui-text); }

/* Generic tables the theme paints light */
html[data-theme="dark"] tbody,
html[data-theme="dark"] tbody td { background: var(--nmui-surface); color: var(--nmui-text); }
html[data-theme="dark"] tbody td:hover { background: var(--nmui-elev); }

/* Footer widgets + footer bar */
html[data-theme="dark"] .footer-widgets,
html[data-theme="dark"] .blog .footer,
html[data-theme="dark"] .footer,
html[data-theme="dark"] .popular-lyrics-container { background: var(--nmui-surface) !important; color: var(--nmui-text); }
html[data-theme="dark"] .footer-menu a,
html[data-theme="dark"] .footer-logo + * a { color: var(--nmui-muted); }
html[data-theme="dark"] .popular-lyrics-container { background: var(--nmui-bg) !important; }

/* Section headings on light strips */
html[data-theme="dark"] .popular-lyrics h2,
html[data-theme="dark"] .popular-lyrics h3,
html[data-theme="dark"] .latest-lyrics-container h2,
html[data-theme="dark"] .latest-lyrics-container h3 { color: var(--nmui-text); }
/* ============================ SUPERB A-Z ALPHABET BAR ============================== */
.lyric-alphabet ul { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin: 0; padding: 0; }
.lyric-alphabet ul li { list-style: none; float: none; }
.lyric-alphabet ul li a {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 32px; height: 32px; padding: 0 7px;
  border-radius: 10px; font-weight: 700; font-size: 13px; line-height: 1;
  color: var(--nmui-text, #e6e6e6);
  background: rgba(255, 255, 255, .08);
  transition: background .18s ease, color .18s ease, transform .12s ease;
}
.lyric-alphabet ul li a:hover,
.lyric-alphabet ul li a:focus {
  background: var(--nmui-accent, #e4422e); color: #fff; transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
}
html.nmui-premium .lyric-alphabet ul li a { border-radius: 10px; }

/* ============================ BOTTOM NAV: 5 ITEMS ============================== */
.niyal-bottom-nav .nbn-item span { font-size: 10.5px; }
@media (max-width: 400px) {
  .niyal-bottom-nav .nbn-item { padding: 6px 2px; }
  .niyal-bottom-nav .nbn-item span { font-size: 9.5px; }
  .niyal-bottom-nav .nbn-item i { font-size: 17px; }
}

/* Hide the (disabled) Submit Lyric header button anywhere it still renders */
.submit-lyric { display: none !important; }

/* Card grid section wrapper on single-artist / single-album / archives */
.niyal-cards-section .title { margin-bottom: 6px; }
.niyal-cards-section .title h4 { display: flex; align-items: center; gap: 8px; }

/* ===================== COMMERCIAL POLISH (2026-07-28) ========================= */

/* A–Z alphabet bar — brighter, clearly-visible pills over the hero photo. */
.lyric-alphabet ul li a,
html.nmui-premium .lyric-alphabet ul li a,
html[data-theme="dark"] .lyric-alphabet ul li a {
  color: #fff;
  background: rgba(255, 255, 255, .16);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}
html.nmui-premium .lyric-alphabet ul li a:hover,
html.nmui-premium .lyric-alphabet ul li a:focus,
html[data-theme="dark"] .lyric-alphabet ul li a:hover { background: var(--nmui-accent, #e4422e); color: #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .25); }

/* Sidebar widget headings (ADVERTISEMENT / ALBUM PHOTO / VIDEO …) — centered,
   with the accent underline centered too. */
.single-widget .title,
.single-widget .title h4 { text-align: center; }
html.nmui-premium .single-widget .title h4::after { left: 50%; transform: translateX(-50%); }

/* A–Z Songs sidebar widget: center its letter grid (the header nav bar stays inline). */
.lyric-sidebar .lyric-alphabet ul,
aside .lyric-alphabet ul,
.single-widget .lyric-alphabet ul,
.widget .lyric-alphabet ul,
.sidebar-widget .lyric-alphabet ul,
.widget_text .lyric-alphabet ul,
.widget_nav_menu ul,
.lyric-sidebar ul.menu,
.lyric-sidebar [class*="alphabet"] ul { justify-content: center; text-align: center; }

/* ---- "A to Z Songs" sidebar widget (widget_text.sidebar-widget) ---- */
/* 1) Center the widget heading + its accent underline. */
.sidebar-widget > h3,
.sidebar-widget .widgettitle,
.sidebar-widget .widget-title,
.widget_text.sidebar-widget h3 { text-align: center; }

/* 1b) The theme's .pull-left floats the alphabet block left, so it shrink-wraps
   (~222px) inside the wider card and leaves dead space on the right. Neutralise the
   float and let it span the full card so the flex grid can center across the whole width. */
.sidebar-widget .lyric-alphabet,
.widget_text .lyric-alphabet {
  float: none !important;
  width: 100% !important;
  display: block !important;
}

/* 2) Visibility: the global pill rule above paints letters #fff on rgba(255,255,255,.16),
   which vanishes on the WHITE sidebar card in light mode. Re-skin ONLY the sidebar
   alphabet with theme-aware, high-contrast pills (header bar keeps its own look). */
.sidebar-widget .lyric-alphabet ul li a,
.widget_text .lyric-alphabet ul li a {
  color: #2a2f45 !important;
  background: rgba(0, 0, 0, .055) !important;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .09) !important;
}
html[data-theme="dark"] .sidebar-widget .lyric-alphabet ul li a,
html[data-theme="dark"] .widget_text .lyric-alphabet ul li a {
  color: #e6e8ee !important;
  background: rgba(255, 255, 255, .10) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14) !important;
}
.sidebar-widget .lyric-alphabet ul li a:hover,
.sidebar-widget .lyric-alphabet ul li a:focus,
.widget_text .lyric-alphabet ul li a:hover,
.widget_text .lyric-alphabet ul li a:focus,
html[data-theme="dark"] .sidebar-widget .lyric-alphabet ul li a:hover,
html[data-theme="dark"] .widget_text .lyric-alphabet ul li a:hover {
  background: var(--nmui-accent, #e4422e) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .22) !important;
}

/* Search / archive result rows: make the WHOLE row clickable (not just the text),
   while any secondary links (album / artist) inside the row stay clickable. */
html.nmui-premium .list-line { position: relative; cursor: pointer; }
/* Bootstrap columns are position:relative, which would trap the stretched link in
   the first column. Make that column static so the ::after escapes to the whole row. */
html.nmui-premium .list-line > div:first-child { position: static; }
html.nmui-premium .list-line > div:first-child a::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
}
/* Secondary links (album / artist) sit ABOVE the stretched link so they stay clickable. */
html.nmui-premium .list-line .col-lg-3 a { position: relative; z-index: 2; }
html.nmui-premium .list-line:hover { background: color-mix(in srgb, var(--nmui-accent, #e4422e) 8%, transparent); }

/* ===================== MODERN SIDEBAR WIDGETS (Recent Posts / Recent Comments /
   Categories / Archives …) — real padding + clean divided rows + hover. The card
   shell (radius/border/shadow) already exists above; this adds the inner comfort.
   List rules are scoped to `.sidebar-widget > ul` (DIRECT child) so the A–Z pill
   grid — whose <ul> is nested inside .textwidget > .lyric-alphabet — is untouched. */
html.nmui-premium .sidebar-widget { padding: 18px 20px 20px; }

/* Heading: centered (set earlier), tightened inside the padded card, bolder. */
html.nmui-premium .sidebar-widget > h3 {
  margin: 2px 0 0;
  padding: 0;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.01em;
}
/* The theme prints an <hr> under the heading — turn it into a short centered accent bar. */
html.nmui-premium .sidebar-widget > hr {
  width: 44px; height: 3px;
  margin: 8px auto 14px;
  border: 0; border-radius: 3px;
  background: var(--nmui-accent, #e4422e);
  opacity: 1;
}

/* List reset + divided rows. */
html.nmui-premium .sidebar-widget > ul { margin: 0; padding: 0; list-style: none; }
html.nmui-premium .sidebar-widget > ul > li {
  position: relative;
  margin: 0;
  padding: 10px 0;
  line-height: 1.5;
  border-bottom: 1px solid color-mix(in srgb, currentColor 10%, transparent);
}
html.nmui-premium .sidebar-widget > ul > li:first-child { padding-top: 2px; }
html.nmui-premium .sidebar-widget > ul > li:last-child { padding-bottom: 0; border-bottom: 0; }

/* Links read as body text, lift to accent on hover. */
html.nmui-premium .sidebar-widget > ul > li a {
  color: var(--nmui-text, #23262d);
  text-decoration: none;
  transition: color var(--nmui-tr, .2s ease);
}
html.nmui-premium .sidebar-widget > ul > li a:hover { color: var(--nmui-accent, #e4422e); }

/* Recent Posts (and other plain link lists): leading accent dot + hover slide. */
html.nmui-premium .sidebar-widget > ul:not(#recentcomments) > li { padding-left: 16px; }
html.nmui-premium .sidebar-widget > ul:not(#recentcomments) > li::before {
  content: ""; position: absolute; left: 1px; top: 50%;
  width: 6px; height: 6px; margin-top: -3px;
  border-radius: 50%;
  background: var(--nmui-accent, #e4422e);
  opacity: .55;
  transition: opacity var(--nmui-tr, .2s ease), transform var(--nmui-tr, .2s ease);
}
html.nmui-premium .sidebar-widget > ul:not(#recentcomments) > li:hover::before { opacity: 1; transform: scale(1.3); }
html.nmui-premium .sidebar-widget > ul:not(#recentcomments) > li a { display: inline-block; transition: transform var(--nmui-tr, .2s ease), color var(--nmui-tr, .2s ease); }
html.nmui-premium .sidebar-widget > ul:not(#recentcomments) > li:hover a { transform: translateX(2px); }

/* Recent Comments: author bold, " on " muted, the post link in accent. */
html.nmui-premium #recentcomments > li { color: var(--nmui-muted, #666); }
html.nmui-premium #recentcomments .comment-author-link,
html.nmui-premium #recentcomments .comment-author-link a { font-weight: 700; color: var(--nmui-text, #23262d); }
html.nmui-premium #recentcomments > li > a { color: var(--nmui-accent, #e4422e); font-weight: 600; }
html.nmui-premium #recentcomments > li > a:hover { text-decoration: underline; }