/* ============================================================
   PermiStar — Dashboard & Admin panel layout
   ============================================================ */
:root{--ps-side-w:274px}

.ps-panel{display:flex;min-height:100vh;background:var(--ps-light)}

/* ---------- sidebar ---------- */
.ps-side{width:var(--ps-side-w);flex:0 0 var(--ps-side-w);background:var(--ps-grad-navy);color:#C9DBEF;position:sticky;top:0;height:100vh;overflow-y:auto;z-index:40;transition:transform .32s var(--ps-ease);scrollbar-width:thin}
.ps-side::-webkit-scrollbar{width:6px}
.ps-side::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:6px}
.ps-side__brand{display:flex;gap:11px;align-items:center;padding:20px 18px;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;background:rgba(7,26,51,.92);backdrop-filter:blur(10px);z-index:3}
.ps-side__brand .ps-logo__mark{width:40px;height:40px;border-radius:13px}
.ps-side__brand b{color:#fff;font-size:1rem;display:block;line-height:1.4}
.ps-side__brand span{font-size:.7rem;color:var(--ps-accent);letter-spacing:.5px}
.ps-side__user{padding:16px 18px;display:flex;gap:11px;align-items:center;border-bottom:1px solid rgba(255,255,255,.08)}
.ps-side__avatar{width:42px;height:42px;border-radius:14px;background:var(--ps-grad);display:grid;place-items:center;color:#fff;font-weight:800;font-size:.95rem;flex:0 0 auto}
.ps-side__user b{color:#fff;font-size:.9rem;display:block;line-height:1.5}
.ps-side__user small{color:#9FBADB;font-size:.75rem}
.ps-side__group{padding:14px 12px 4px;font-size:.7rem;letter-spacing:1.1px;color:#7C9AC0;font-weight:800;text-transform:uppercase}
.ps-side__nav{list-style:none;margin:0;padding:0 12px 12px;display:flex;flex-direction:column;gap:2px}
.ps-side__nav a{display:flex;gap:11px;align-items:center;padding:10px 12px;border-radius:12px;color:#C9DBEF;font-size:.9rem;font-weight:600;transition:.22s var(--ps-ease);position:relative}
.ps-side__nav a:hover{background:rgba(255,255,255,.08);color:#fff;padding-inline-start:16px}
.ps-side__nav a.is-active{background:var(--ps-grad);color:#fff;box-shadow:0 8px 22px rgba(22,139,255,.35)}
.ps-side__nav svg{width:19px;height:19px;flex:0 0 auto}
.ps-side__nav .ps-side__count{margin-inline-start:auto;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:rgba(255,255,255,.14);color:#fff;font-size:.72rem;font-weight:800;display:grid;place-items:center}
.ps-side__nav a.is-active .ps-side__count{background:rgba(255,255,255,.28)}
.ps-side__count--danger{background:rgba(240,68,56,.85) !important}
.ps-side__foot{padding:14px 18px 24px;font-size:.75rem;color:#7C9AC0;border-top:1px solid rgba(255,255,255,.08);margin-top:8px}

/* ---------- main ---------- */
.ps-main{flex:1;min-width:0;display:flex;flex-direction:column}
.ps-topbar{position:sticky;top:0;z-index:35;background:rgba(255,255,255,.86);backdrop-filter:blur(16px);border-bottom:1px solid var(--ps-line-soft);padding:13px 24px;display:flex;gap:14px;align-items:center}
.ps-topbar__title{font-size:1.05rem;font-weight:800;color:var(--ps-navy);margin:0;line-height:1.5}
.ps-topbar__sub{font-size:.79rem;color:var(--ps-muted);margin:0}
.ps-topbar__actions{margin-inline-start:auto;display:flex;gap:9px;align-items:center}
.ps-topbar__icon{width:42px;height:42px;border-radius:13px;background:var(--ps-light);border:1px solid var(--ps-line);display:grid;place-items:center;color:var(--ps-navy);position:relative;transition:.22s}
.ps-topbar__icon:hover{background:var(--ps-primary-soft);color:var(--ps-primary);transform:translateY(-2px)}
.ps-topbar__icon svg{width:20px;height:20px}
.ps-topbar__dot{position:absolute;top:8px;inset-inline-start:9px;width:8px;height:8px;border-radius:50%;background:var(--ps-danger);box-shadow:0 0 0 2px #fff}
.ps-side-toggle{display:none}
.ps-content{padding:26px 24px 46px;flex:1}

/* ---------- dashboard bits ---------- */
.ps-panel-grid{display:grid;gap:20px}
.ps-panel-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ps-panel-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ps-panel-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ps-panel-grid--side{grid-template-columns:1.55fr .95fr}
.ps-panel .ps-card{background:#fff;backdrop-filter:none}
.ps-panel .ps-card--navy{background:var(--ps-grad-navy)}
.ps-mini{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px dashed var(--ps-line-soft)}
.ps-mini:last-child{border-bottom:0}
.ps-mini__title{font-size:.9rem;font-weight:700;color:var(--ps-navy);margin:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ps-mini__meta{font-size:.78rem;color:var(--ps-muted)}
.ps-mini__value{font-weight:900;color:var(--ps-navy);white-space:nowrap;font-size:.95rem}
.ps-chart{width:100%;height:230px;display:block}
.ps-chart-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:.8rem;color:var(--ps-muted);margin-top:8px}
.ps-chart-legend i{display:inline-block;width:11px;height:11px;border-radius:4px;margin-inline-end:6px;vertical-align:-1px}
.ps-score{position:relative;width:132px;height:132px;margin-inline:auto}
.ps-score svg{transform:rotate(-90deg)}
.ps-score__val{position:absolute;inset:0;display:grid;place-items:center;font-size:1.7rem;font-weight:900;color:var(--ps-navy)}
.ps-check-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.ps-check-list li{display:flex;gap:11px;align-items:flex-start;padding:12px 14px;border-radius:13px;background:var(--ps-light);font-size:.88rem;border-inline-start:4px solid var(--ps-success)}
.ps-check-list li.bad{border-color:var(--ps-danger);background:var(--ps-danger-soft)}
.ps-check-list li.warn{border-color:var(--ps-warning);background:var(--ps-warning-soft)}
.ps-check-list b{display:block;color:var(--ps-navy);font-size:.9rem}
.ps-check-list small{color:var(--ps-muted);font-size:.79rem;line-height:1.8;display:block;margin-top:3px}
.ps-check-ico{width:22px;height:22px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--ps-success);margin-top:2px}
.ps-check-list li.bad .ps-check-ico{color:var(--ps-danger)}
.ps-check-list li.warn .ps-check-ico{color:var(--ps-warning)}
.ps-check-ico svg{width:14px;height:14px}

/* tickets / messages */
.ps-thread{display:flex;flex-direction:column;gap:14px;margin-bottom:20px}
.ps-msg{max-width:82%;padding:15px 18px;border-radius:18px;font-size:.92rem;line-height:1.95;position:relative;box-shadow:var(--ps-shadow-sm)}
.ps-msg--user{background:#fff;border:1px solid var(--ps-line);align-self:flex-start;border-start-start-radius:5px}
.ps-msg--admin{background:var(--ps-grad);color:#fff;align-self:flex-end;border-start-end-radius:5px}
.ps-msg--system{background:var(--ps-light);border:1px dashed var(--ps-line);align-self:center;text-align:center;font-size:.83rem;color:var(--ps-muted)}
.ps-msg--internal{background:var(--ps-warning-soft);border:1px solid rgba(247,144,9,.35);align-self:flex-end;color:#8A5200}
.ps-msg__meta{display:flex;gap:9px;align-items:center;font-size:.75rem;margin-bottom:7px;opacity:.85;font-weight:700}
.ps-msg--user .ps-msg__meta{color:var(--ps-primary)}
.ps-msg__att{margin-top:10px;display:inline-flex;gap:7px;align-items:center;padding:7px 12px;border-radius:10px;background:rgba(255,255,255,.2);font-size:.8rem;font-weight:700}
.ps-msg--user .ps-msg__att,.ps-msg--internal .ps-msg__att{background:var(--ps-light);color:var(--ps-primary)}
.ps-msg__att svg{width:15px;height:15px}

/* settings sections */
.ps-settings-nav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.ps-settings-nav a{padding:9px 15px;border-radius:12px;background:#fff;border:1px solid var(--ps-line);font-size:.86rem;font-weight:700;color:var(--ps-muted)}
.ps-settings-nav a:hover{color:var(--ps-primary);border-color:var(--ps-primary)}
.ps-settings-nav a.is-active{background:var(--ps-grad);color:#fff;border-color:transparent;box-shadow:var(--ps-glow)}
.ps-secret{display:flex;gap:8px;align-items:center}
.ps-secret code{background:var(--ps-light);padding:5px 11px;border-radius:9px;font-size:.8rem}

/* installer */
.ps-install{min-height:100vh;display:grid;place-items:center;padding:40px 16px;background:var(--ps-grad-navy);position:relative;overflow:hidden}
.ps-install::before{content:"";position:absolute;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(22,139,255,.35),transparent 70%);top:-260px;inset-inline-end:-180px}
.ps-install::after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(101,197,255,.24),transparent 70%);bottom:-220px;inset-inline-start:-140px}
.ps-install__card{width:100%;max-width:820px;background:#fff;border-radius:26px;box-shadow:0 40px 100px rgba(0,0,0,.4);position:relative;z-index:2;overflow:hidden}
.ps-install__head{padding:30px 34px 22px;background:linear-gradient(135deg,#F7FBFF,#EAF3FF);border-bottom:1px solid var(--ps-line)}
.ps-install__body{padding:30px 34px 34px}
.ps-install__foot{padding:18px 34px;background:var(--ps-light);border-top:1px solid var(--ps-line-soft);display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.ps-install__steps{display:flex;gap:5px;margin-top:20px}
.ps-install__steps i{flex:1;height:5px;border-radius:4px;background:var(--ps-line);transition:.4s}
.ps-install__steps i.done{background:var(--ps-success)}
.ps-install__steps i.now{background:var(--ps-grad)}
.ps-install__log{background:#04121F;color:#9FE8B8;border-radius:14px;padding:18px;font-family:ui-monospace,Menlo,monospace;font-size:.82rem;line-height:2;max-height:300px;overflow-y:auto;direction:ltr;text-align:left}
.ps-install__log .err{color:#FF9B91}
.ps-install__log .ok{color:#8FE3B0}
.ps-req{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px}
.ps-req li{display:flex;gap:11px;align-items:center;padding:11px 15px;border-radius:12px;background:var(--ps-light);font-size:.89rem;border-inline-start:4px solid var(--ps-success)}
.ps-req li.bad{border-color:var(--ps-danger);background:var(--ps-danger-soft)}
.ps-req li.warn{border-color:var(--ps-warning);background:var(--ps-warning-soft)}
.ps-req__status{margin-inline-start:auto;font-weight:800;font-size:.78rem;color:var(--ps-success)}
.ps-req li.bad .ps-req__status{color:var(--ps-danger)}
.ps-req li.warn .ps-req__status{color:#B54708}

/* auth pages */
.ps-auth{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}
.ps-auth__side{background:var(--ps-grad-navy);color:#C9DBEF;padding:52px 46px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.ps-auth__side::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(22,139,255,.4),transparent 70%);top:-200px;inset-inline-end:-160px}
.ps-auth__side::after{content:"";position:absolute;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(101,197,255,.28),transparent 70%);bottom:-160px;inset-inline-start:-120px}
.ps-auth__side>*{position:relative;z-index:2}
.ps-auth__side h2{color:#fff;font-size:1.75rem;margin-bottom:14px}
.ps-auth__side p{color:#A9C3E0;max-width:44ch}
.ps-auth__list{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-direction:column;gap:12px}
.ps-auth__list li{display:flex;gap:11px;align-items:center;font-size:.92rem;color:#D3E3F6}
.ps-auth__list svg{width:20px;height:20px;color:var(--ps-accent);flex:0 0 auto}
.ps-auth__form{display:flex;align-items:center;justify-content:center;padding:44px 30px}
.ps-auth__box{width:100%;max-width:430px}
.ps-auth__box h1{font-size:1.5rem;margin-bottom:7px}
.ps-auth__box>p.ps-muted{margin-bottom:26px;font-size:.92rem}
.ps-auth__foot{margin-top:20px;text-align:center;font-size:.88rem;color:var(--ps-muted)}

@media (max-width:1200px){
  .ps-panel-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ps-panel-grid--side{grid-template-columns:1fr}
}
@media (max-width:1000px){
  .ps-auth{grid-template-columns:1fr}
  .ps-auth__side{display:none}
}
@media (max-width:992px){
  .ps-side{position:fixed;inset-block:0;inset-inline-start:0;transform:translateX(-102%);box-shadow:22px 0 60px rgba(7,26,51,.35)}
  body.ps-side-open .ps-side{transform:none}
  .ps-side-toggle{display:grid}
  .ps-panel-grid--3{grid-template-columns:1fr 1fr}
  .ps-content{padding:20px 16px 40px}
  .ps-topbar{padding:12px 16px}
}
@media (max-width:600px){
  .ps-panel-grid--4,.ps-panel-grid--3,.ps-panel-grid--2{grid-template-columns:1fr}
  .ps-install__head,.ps-install__body,.ps-install__foot{padding-inline:20px}
  .ps-msg{max-width:100%}
}

/* ---------- mini rows (stacked variant) ---------- */
.ps-mini--stack{display:block}
.ps-mini--stack b{display:block;margin-bottom:3px;color:var(--ps-navy)}
.ps-mini.is-unread{background:var(--ps-primary-soft);border-radius:12px;padding:11px 13px;border-bottom:0;margin-bottom:4px}
.ps-mini.is-unread b::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ps-danger);margin-inline-start:7px;vertical-align:middle}
.ps-filter-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ps-filter-bar .ps-chip.is-active{background:var(--ps-primary);color:#fff;border-color:var(--ps-primary)}

/* ---------- utilities used by panel views ---------- */
.ps-text-end{text-align:left}
.ps-text-start{text-align:right}
.ps-panel .is-unread-card{background:var(--ps-primary-soft);border-color:rgba(22,139,255,.28);box-shadow:0 6px 22px rgba(22,139,255,.09)}
.ps-panel .is-unread-card b{color:var(--ps-navy)}

/* ---------- admin: toggle switch, thumbs, code, sub-rows ---------- */
.ps-switch{position:relative;display:inline-block;width:46px;height:26px;border-radius:999px;border:1px solid var(--ps-line);
  background:#E4EAF2;cursor:pointer;padding:0;transition:background .22s ease,border-color .22s ease;flex:0 0 auto}
.ps-switch span{position:absolute;top:2px;inset-inline-start:2px;width:20px;height:20px;border-radius:50%;background:#fff;
  box-shadow:0 2px 6px rgba(7,26,51,.25);transition:transform .22s cubic-bezier(.34,1.4,.64,1)}
.ps-switch.is-on{background:var(--ps-primary);border-color:var(--ps-primary)}
.ps-switch.is-on span{transform:translateX(-20px)}
[dir=rtl] .ps-switch.is-on span{transform:translateX(-20px)}
.ps-switch:hover{border-color:var(--ps-primary)}
.ps-switch.is-loading{opacity:.55;pointer-events:none}
.ps-switch:focus-visible{outline:3px solid var(--ps-primary-soft);outline-offset:2px}

.ps-thumb{width:42px;height:42px;border-radius:12px;object-fit:cover;background:var(--ps-light);border:1px solid var(--ps-line);flex:0 0 auto}
.ps-thumb--empty{display:inline-flex;align-items:center;justify-content:center;color:var(--ps-muted)}

.ps-code{background:#071A33;color:#D7E7FA;border-radius:12px;padding:12px 14px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.76rem;line-height:1.7;overflow:auto;max-height:260px;white-space:pre-wrap;word-break:break-word}
.ps-table__sub td{background:var(--ps-light);border-top:0;padding-top:0}

/* ---------- compact controls, image preview, permission grid ---------- */
.ps-input--sm,.ps-select--sm{padding:8px 12px;font-size:.85rem;border-radius:11px}
.ps-select--sm{background-position:left 10px center;background-size:15px;padding-inline-start:32px}
.ps-img-preview{display:block;max-width:230px;max-height:175px;object-fit:contain;border-radius:14px;
  border:1.5px solid var(--ps-line-soft);background:var(--ps-light);padding:8px}
.ps-perm-group{border:1.5px solid var(--ps-line-soft);border-radius:15px;background:#fff;overflow:hidden}
.ps-perm-group__head{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:11px 14px;
  background:var(--ps-light);border-bottom:1px solid var(--ps-line-soft);font-weight:800;font-size:.9rem;color:var(--ps-navy)}
.ps-perm-group__body{padding:12px 14px;display:grid;gap:9px}
.ps-perm{display:flex;gap:9px;align-items:flex-start;font-size:.85rem;cursor:pointer;line-height:1.7}
.ps-perm input{margin-top:3px;width:16px;height:16px;accent-color:var(--ps-primary);flex:0 0 auto}
.ps-perm b{display:block;font-weight:700;color:var(--ps-text)}
.ps-perm small{color:var(--ps-muted)}
.ps-perm.is-locked{opacity:.5;cursor:not-allowed}
.ps-role-block{border:1.5px solid var(--ps-line-soft);border-radius:16px;background:#fff;padding:16px;display:grid;gap:14px}
.ps-role-block__head{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.ps-role-block__title{display:flex;gap:9px;align-items:center;font-weight:800;color:var(--ps-navy);font-size:1rem}
.ps-role-block__form{display:grid;gap:14px}
.ps-burger-close{background:#fff}