/* ── 13.11 (ns148): п'ять стилів бокової панелі (вибір у «Оформлення» → «Стиль панелі») ──
   A світла · B глибока темна · C острівець-рейка · D скляна · E робоча. «Типовий» — без data-key-side.
   A, B, D, E працюють у «Сучасному» вигляді (з підписами), C — у «Класичному» (рейка). */

html[data-key-side="A"][data-key-view] .rail.ks-side{background:#fff; border:1px solid #e9ecf2; box-shadow:none}
html[data-key-side="A"][data-key-view] .ks-lbl--brand,html[data-key-side="A"][data-key-view] .ks-lbl--me{color:#101828}
html[data-key-side="A"][data-key-view] .ks-item{color:#475467; font-weight:500; border-radius:10px}
html[data-key-side="A"][data-key-view] .ks-item:hover{background:#f6f8fb; color:#101828}
html[data-key-side="A"][data-key-view] .ks-item.active:not(.has-sub){background:#eaf7fe; color:#0b8fd0}
html[data-key-side="A"][data-key-view] .ks-item.has-sub.active{background:transparent}
html[data-key-side="A"][data-key-view] .ks-item.has-sub:hover{background:#f6f8fb}
html[data-key-side="A"][data-key-view] .ks-sub-link{color:#475467; border-radius:8px; margin-left:18px; padding-left:14px; font-weight:400; border-left:0; position:relative}
html[data-key-side="A"][data-key-view] .ks-sub-link:hover{background:#f6f8fb; color:#101828}
html[data-key-side="A"][data-key-view] .ks-sub-link.is-active{background:#eaf7fe; color:#0b8fd0; font-weight:600}
html[data-key-side="A"][data-key-view] .ks-sub-sec{color:#98a2b3}
html[data-key-side="A"][data-key-view] .ks-list--bottom{border-top-color:#eef0f4}
html[data-key-side="A"][data-key-view] .ks-collapse{color:#98a2b3}
html[data-key-side="A"][data-key-view] .ks-collapse:hover{background:#f6f8fb; color:#101828}

html[data-key-side="A"][data-key-view] .ks-item .ks-ic{color:#98a2b3}
html[data-key-side="A"][data-key-view] .ks-item:hover .ks-ic,html[data-key-side="A"][data-key-view] .ks-item.active .ks-ic{color:#0b8fd0}

html[data-key-side="B"][data-key-view] .rail.ks-side{background:linear-gradient(180deg,#14203f 0,#0d1630 100%); border:0}
html[data-key-side="B"][data-key-view] .ks-item{color:#b6c0da; font-weight:500; border-radius:10px}
html[data-key-side="B"][data-key-view] .ks-item:hover{background:rgba(255,255,255,.07); color:#fff}
html[data-key-side="B"][data-key-view] .ks-item.has-sub.active{background:transparent}
html[data-key-side="B"][data-key-view] .ks-sub-link{color:#b6c0da; border-radius:8px; margin-left:18px; padding-left:14px; font-weight:400; position:relative}
html[data-key-side="B"][data-key-view] .ks-sub-link:hover{background:rgba(255,255,255,.07); color:#fff}
html[data-key-side="B"][data-key-view] .ks-sub-link.is-active{background:rgba(27,181,251,.15); color:#fff; font-weight:600}
html[data-key-side="B"][data-key-view] .ks-sub-link.is-active::before{content:""; position:absolute; left:-12px; top:8px; bottom:8px; width:3px; border-radius:0 3px 3px 0; background:#1bb5fb; box-shadow:0 0 12px #1bb5fb}
html[data-key-side="B"][data-key-view] .ks-item.active:not(.has-sub){background:rgba(27,181,251,.15); color:#fff}
html[data-key-side="B"][data-key-view] .ks-sub-sec{color:#6f7da3}

html[data-key-side="D"][data-key-view] .rail.ks-side{background:linear-gradient(165deg,#e7f5ff 0,#efeaff 100%); border:1px solid rgba(255,255,255,.8); box-shadow:0 10px 30px -14px rgba(76,87,200,.35)}
html[data-key-side="D"][data-key-view] .ks-lbl--brand,html[data-key-side="D"][data-key-view] .ks-lbl--me{color:#1d2540}
html[data-key-side="D"][data-key-view] .ks-item{color:#44506f; font-weight:500; border-radius:10px}
html[data-key-side="D"][data-key-view] .ks-item:hover{background:rgba(255,255,255,.55); color:#1d2540}
html[data-key-side="D"][data-key-view] .ks-item.active:not(.has-sub){background:#fff; color:#1d2540}
html[data-key-side="D"][data-key-view] .ks-item.has-sub.active{background:transparent}
html[data-key-side="D"][data-key-view] .ks-item.has-sub:hover{background:rgba(255,255,255,.55)}
html[data-key-side="D"][data-key-view] .ks-sub-link{color:#44506f; border-radius:8px; margin-left:18px; padding-left:14px; font-weight:400; border-left:0; position:relative}
html[data-key-side="D"][data-key-view] .ks-sub-link:hover{background:rgba(255,255,255,.55); color:#1d2540}
html[data-key-side="D"][data-key-view] .ks-sub-link.is-active{background:#fff; color:#1d2540; font-weight:600}
html[data-key-side="D"][data-key-view] .ks-sub-sec{color:#7b86a8}
html[data-key-side="D"][data-key-view] .ks-list--bottom{border-top-color:rgba(91,108,240,.15)}
html[data-key-side="D"][data-key-view] .ks-collapse{color:#7b86a8}
html[data-key-side="D"][data-key-view] .ks-collapse:hover{background:rgba(255,255,255,.55); color:#1d2540}

html[data-key-side="D"][data-key-view] .rail.ks-side{border-radius:22px}
html[data-key-side="D"][data-key-view] .ks-sub-link.is-active,html[data-key-side="D"][data-key-view] .ks-item.active:not(.has-sub){box-shadow:0 4px 12px -4px rgba(76,87,200,.3)}
html[data-key-side="D"][data-key-view] .ks-sub-link.is-active .x{}

html[data-key-side="E"][data-key-view] .rail.ks-side{background:#f8f9fb; border:1px solid #e4e7ec; box-shadow:none}
html[data-key-side="E"][data-key-view] .ks-lbl--brand,html[data-key-side="E"][data-key-view] .ks-lbl--me{color:#101828}
html[data-key-side="E"][data-key-view] .ks-item{color:#475467; font-weight:500; border-radius:10px}
html[data-key-side="E"][data-key-view] .ks-item:hover{background:#eef1f5; color:#101828}
html[data-key-side="E"][data-key-view] .ks-item.active:not(.has-sub){background:#fff; color:#101828}
html[data-key-side="E"][data-key-view] .ks-item.has-sub.active{background:transparent}
html[data-key-side="E"][data-key-view] .ks-item.has-sub:hover{background:#eef1f5}
html[data-key-side="E"][data-key-view] .ks-sub-link{color:#475467; border-radius:8px; margin-left:18px; padding-left:14px; font-weight:400; border-left:0; position:relative}
html[data-key-side="E"][data-key-view] .ks-sub-link:hover{background:#eef1f5; color:#101828}
html[data-key-side="E"][data-key-view] .ks-sub-link.is-active{background:#fff; color:#101828; font-weight:600}
html[data-key-side="E"][data-key-view] .ks-sub-sec{color:#98a2b3}
html[data-key-side="E"][data-key-view] .ks-list--bottom{border-top-color:#e4e7ec}
html[data-key-side="E"][data-key-view] .ks-collapse{color:#98a2b3}
html[data-key-side="E"][data-key-view] .ks-collapse:hover{background:#eef1f5; color:#101828}

html[data-key-side="E"][data-key-view] .ks-sub-link.is-active,html[data-key-side="E"][data-key-view] .ks-item.active:not(.has-sub){box-shadow:0 0 0 1px #e4e7ec,0 1px 2px rgba(16,24,40,.06)}
html[data-key-side="E"][data-key-view] .ks-item.has-sub .ks-lbl{font:600 11px/1 var(--k-font); letter-spacing:.06em; text-transform:uppercase; color:#98a2b3}
html[data-key-side="E"][data-key-view] .ks-item.has-sub{height:30px}
html[data-key-side="E"][data-key-view] .ks-item.has-sub .ks-ic{display:none}
html[data-key-side="E"][data-key-view] .ks-sub-link{margin-left:0; padding-left:12px}
html[data-key-side="E"][data-key-view] .ks-sub{padding-bottom:10px}

html[data-key-side="C"][data-key-view="classic"] .rail.ks-side{width:64px; border-radius:22px; background:#26407f; box-shadow:0 10px 30px -12px rgba(38,64,127,.6)}
html[data-key-side="C"][data-key-view="classic"] .ks-item{width:46px; height:46px; border-radius:14px; color:#c5d0f0; opacity:1}
html[data-key-side="C"][data-key-view="classic"] .ks-item:hover{background:rgba(255,255,255,.12); color:#fff}
html[data-key-side="C"][data-key-view="classic"] .ks-item.active{background:#fff; color:#26407f; box-shadow:0 6px 14px -4px rgba(0,0,0,.35)}
html[data-key-side="C"][data-key-view="classic"] .ks-item .ks-badge{top:2px; right:0; border-color:#26407f}

html[data-key-theme="dark"][data-key-side="A"][data-key-view] .rail.ks-side{background:var(--k-card,#171d2b); border-color:var(--k-border,#272f40)}
html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-lbl--brand,html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-lbl--me,html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-item:hover,html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-sub-link:hover{color:#eef1f6}
html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-item,html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-sub-link{color:#b4bccb}
html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-item:hover,html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-sub-link:hover,html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-item.has-sub:hover{background:rgba(255,255,255,.07)}
html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-item.active:not(.has-sub),html[data-key-theme="dark"][data-key-side="A"][data-key-view] .ks-sub-link.is-active{background:rgba(27,181,251,.16); color:#5ccbff; box-shadow:none}

html[data-key-theme="dark"][data-key-side="D"][data-key-view] .rail.ks-side{background:var(--k-card,#171d2b); border-color:var(--k-border,#272f40)}
html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-lbl--brand,html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-lbl--me,html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-item:hover,html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-sub-link:hover{color:#eef1f6}
html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-item,html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-sub-link{color:#b4bccb}
html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-item:hover,html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-sub-link:hover,html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-item.has-sub:hover{background:rgba(255,255,255,.07)}
html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-item.active:not(.has-sub),html[data-key-theme="dark"][data-key-side="D"][data-key-view] .ks-sub-link.is-active{background:rgba(27,181,251,.16); color:#5ccbff; box-shadow:none}

html[data-key-theme="dark"][data-key-side="E"][data-key-view] .rail.ks-side{background:var(--k-card,#171d2b); border-color:var(--k-border,#272f40)}
html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-lbl--brand,html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-lbl--me,html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-item:hover,html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-sub-link:hover{color:#eef1f6}
html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-item,html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-sub-link{color:#b4bccb}
html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-item:hover,html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-sub-link:hover,html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-item.has-sub:hover{background:rgba(255,255,255,.07)}
html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-item.active:not(.has-sub),html[data-key-theme="dark"][data-key-side="E"][data-key-view] .ks-sub-link.is-active{background:rgba(27,181,251,.16); color:#5ccbff; box-shadow:none}
