/* mumu skini: ui.mcp.az/templates/gallery.html#tpl/mumu-admin illustrasiyasinin shell ve siyahi dili.
   Yalniz [data-skin="mumu"] altinda isleyir; onebase ve digər skin-lər toxunulmaz qalir.
   Ferq: künclər yumshaq (6/8/12), kartlar yumshaq kolkə ile qalxir, secim acik mavi ve yumru, sidebar aktiv item zolaqsiz. */

[data-skin="mumu"] body { font-size: var(--size-sm); line-height: var(--leading-normal); }
[data-skin="mumu"] .icon { width: 1rem; height: 1rem; }

/* ---- qabıq: ag sidebar + isti boz well */
[data-skin="mumu"] .app-shell { background: var(--bg); }
[data-skin="mumu"] .app-shell__sidebar { width: 13.5rem; padding: var(--space-3) var(--space-2); background: var(--surface); border-right: 1px solid var(--border); }
[data-skin="mumu"] .app-shell__brand { padding: var(--space-2) var(--space-3) var(--space-4); margin-bottom: 0; font-size: var(--size-base); }
[data-skin="mumu"] .app-shell__mark { width: 1.5rem; height: 1.5rem; border-radius: var(--radius-sm); background: var(--primary); color: var(--on-primary); }
[data-skin="mumu"] .app-shell__nav { gap: 2px; }
[data-skin="mumu"] .app-shell__nav-group { margin: var(--space-4) 0 var(--space-1) var(--space-3); font-size: var(--size-2xs); letter-spacing: var(--tracking-wide); color: var(--text-faint); }

/* aktiv item: dolgu + qalin srift, sol zolaq YOX (illustrasiyada oldugu kimi) */
[data-skin="mumu"] .app-shell__link {
    gap: var(--space-2);
    padding: 0.3125rem var(--space-3);
    border-radius: var(--radius-md);
    font-size: var(--size-sm);
    font-weight: var(--weight-medium);
    color: var(--text-muted);
}
[data-skin="mumu"] .app-shell__link .icon { width: 1rem; height: 1rem; color: var(--text-faint); }
[data-skin="mumu"] .app-shell__link:hover { background: var(--hover-veil); color: var(--text); }
[data-skin="mumu"] .app-shell__link:hover .icon { color: var(--text-muted); }
[data-skin="mumu"] .app-shell__link--active {
    background: var(--selected);
    color: var(--primary-ink);
    font-weight: var(--weight-semibold);
}
[data-skin="mumu"] .app-shell__link--active .icon { color: var(--primary-ink); }
[data-skin="mumu"] .app-shell__link--active:hover { background: var(--selected); color: var(--primary-ink); }

[data-skin="mumu"] .app-shell__avatar { width: 1.625rem; height: 1.625rem; background: var(--primary); color: var(--on-primary); }
[data-skin="mumu"] .app-shell__topbar { height: 2.75rem; padding: 0 var(--space-4); background: var(--surface); border-bottom: 1px solid var(--border); }
[data-skin="mumu"] .app-shell__search { padding: 0.25rem var(--space-3); border-color: var(--border); background: var(--surface-2); border-radius: var(--radius-md); max-width: 20rem; }
[data-skin="mumu"] .app-shell__icon-btn, [data-skin="mumu"] .app-shell__mobile-toggle { width: 1.875rem; height: 1.875rem; border-radius: var(--radius-sm); }
[data-skin="mumu"] .app-shell__main { padding: var(--space-5) var(--space-6); background: var(--bg); }

/* ---- başlıq + kart */
[data-skin="mumu"] .pg-head { margin-bottom: var(--space-4); }
[data-skin="mumu"] .pg-title { font-size: var(--size-xl); letter-spacing: var(--tracking-tight); }
[data-skin="mumu"] .pg-sub { font-size: var(--size-xs); }
[data-skin="mumu"] .card {
    padding: var(--space-4);
    border-radius: var(--radius-lg);
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
}
[data-skin="mumu"] .card--status { border-top-width: 1px; border-top-color: var(--border); border-left: 2px solid var(--success); }
[data-skin="mumu"] .card--device { border-top-width: 1px; border-top-color: var(--border); border-left: 2px solid var(--primary); }
[data-skin="mumu"] .card__h h2 { font-size: var(--size-base); }
[data-skin="mumu"] .kpi { padding: var(--space-3) var(--space-4); border-radius: var(--radius-lg); background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-sm); }
[data-skin="mumu"] .kpi__v { font-size: var(--size-xl); }
[data-skin="mumu"] .kpis { gap: var(--space-3); }

/* ---- cedvel: hairline setirler, zebra YOX, yumru secim */
[data-skin="mumu"] .tbl-wrap { border-radius: var(--radius-lg); background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-sm); overflow: hidden; }
[data-skin="mumu"] .tbl { font-size: var(--size-xs); border-collapse: separate; border-spacing: 0; }
[data-skin="mumu"] .tbl th { padding: var(--space-2) var(--space-3); background: var(--surface); border-bottom: 1px solid var(--border); font-size: var(--size-2xs); color: var(--text-faint); }
[data-skin="mumu"] .tbl td { padding: 0.5rem var(--space-3); border-bottom: 1px solid var(--border); }
[data-skin="mumu"] .tbl tbody tr:last-child td { border-bottom: 0; }
[data-skin="mumu"] .tbl tbody tr:hover td { background: var(--hover-veil); }
/* illustrasiyada secim zolaqla deyil, yumru dolgu ile vurgulanir */
[data-skin="mumu"] .tbl tr.is-sel { box-shadow: none; }
/* tbody acari specificity ucundur: :nth-child(even) kimi pseudo-sinif (0,3,3) verir,
   aşağıdaki seçici onsuz (0,3,2)-də qalıb uduzurdu */
[data-skin="mumu"] .tbl tbody tr.is-sel td { background: var(--selected); box-shadow: none; }
[data-skin="mumu"] .tbl tr.is-sel:hover td { background: var(--selected); }
[data-skin="mumu"] .tbl tr.is-sel td:first-child { border-radius: var(--radius-md) 0 0 var(--radius-md); box-shadow: none; }
[data-skin="mumu"] .tbl tr.is-sel td:last-child { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
[data-skin="mumu"] .tbl tr.is-sel td { border-bottom-color: transparent; }

/* ---- kontrollar */
[data-skin="mumu"] .jv-btn { padding: 0.25rem var(--space-3); font-size: var(--size-xs); border-radius: var(--radius-md); min-height: 1.75rem; }
[data-skin="mumu"] .jv-input, [data-skin="mumu"] .jv-sel { padding: 0.25rem var(--space-3); font-size: var(--size-sm); border-radius: var(--radius-md); min-height: 1.75rem; }
[data-skin="mumu"] .jv-input--sm { min-height: 1.5rem; }
[data-skin="mumu"] .jv-badge { padding: 0.0625rem var(--space-2); font-size: var(--size-2xs); }
/* nişan mətni yaşıl tonun özü ilə yazılanda 11px-də oxunmur (2.3:1) — ink tonu */
[data-skin="mumu"] .jv-badge--ok { color: var(--success-ink); }
[data-skin="mumu"] .chip { padding: 0.125rem var(--space-3); font-size: var(--size-xs); }

/* SVG <text> shorthand-ı etibarsız ötürür: chart oxları serif-ə düşürdü, ayrı-ayrı yazılır */
[data-skin="mumu"] .ch-ax { font-family: var(--font-mono); font-size: 10px; }

/* ---- uzən qatlar: yumshaq kolkə */
[data-skin="mumu"] .jv-dialog, [data-skin="mumu"] .jv-toast { border: 1px solid var(--border); box-shadow: var(--shadow-lg); border-radius: var(--radius-lg); }
[data-skin="mumu"] .jv-dot--pulse { box-shadow: 0 0 0 3px color-mix(in oklab, var(--success) 18%, transparent); }

/* 375px-də topbar 75px daşirdi: axtaris label-i flex item kimi min-content altina dusmurdu */
@media (max-width: 40rem) {
    [data-skin="mumu"] .app-shell__topbar { gap: var(--space-2); padding: 0 var(--space-2); }
    [data-skin="mumu"] .app-shell__search { min-width: 0; }
    [data-skin="mumu"] .app-shell__topbar-actions { gap: var(--space-1); }
    [data-skin="mumu"] .auth-split__lang button { padding: 0 var(--space-1); }
}
