/* PepShop Admin Captain Dashboard v1
   Non-invasive fixed navigation rail for the private Admin workspace. */

:root{
  --captain-purple:#5f259f;
  --captain-purple-dark:#2c0a4f;
  --captain-orange:#ff7900;
  --captain-ink:#171228;
  --captain-muted:#7e6b91;
  --captain-panel:#ffffff;
  --captain-line:#eadcf8;
  --captain-shadow:0 20px 55px rgba(35,10,66,.24);
}

#pepshopAdminCaptainNav{
  position:fixed;
  z-index:980;
  left:12px;
  top:88px;
  bottom:14px;
  width:64px;
  display:none;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(95,37,159,.20);
  border-radius:22px;
  background:rgba(255,255,255,.97);
  box-shadow:var(--captain-shadow);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  transition:width .2s ease,transform .2s ease,box-shadow .2s ease;
}

#pepshopAdminCaptainNav.is-visible{display:flex}
#pepshopAdminCaptainNav.is-open,
#pepshopAdminCaptainNav:hover,
#pepshopAdminCaptainNav:focus-within{width:262px}

.captain-nav-head{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:66px;
  padding:10px;
  border-bottom:1px solid var(--captain-line);
  background:linear-gradient(145deg,#32105a 0%,#5f259f 62%,#7c34c9 100%);
  color:#fff;
}

.captain-nav-toggle{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:13px;
  background:var(--captain-orange);
  color:#fff;
  font:800 20px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(255,121,0,.28);
}

.captain-nav-title{
  min-width:0;
  opacity:0;
  transform:translateX(-4px);
  transition:opacity .15s ease,transform .15s ease;
  white-space:nowrap;
}

#pepshopAdminCaptainNav.is-open .captain-nav-title,
#pepshopAdminCaptainNav:hover .captain-nav-title,
#pepshopAdminCaptainNav:focus-within .captain-nav-title{opacity:1;transform:none}

.captain-nav-title strong{display:block;font:800 14px/1.15 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.02em}
.captain-nav-title span{display:block;margin-top:3px;font:700 10px/1.1 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.12em;text-transform:uppercase;opacity:.78}

.captain-nav-tools{
  flex:0 0 auto;
  padding:10px;
  border-bottom:1px solid var(--captain-line);
  opacity:0;
  pointer-events:none;
  transition:opacity .15s ease;
}

#pepshopAdminCaptainNav.is-open .captain-nav-tools,
#pepshopAdminCaptainNav:hover .captain-nav-tools,
#pepshopAdminCaptainNav:focus-within .captain-nav-tools{opacity:1;pointer-events:auto}

.captain-nav-search{
  width:100%;
  min-height:38px;
  box-sizing:border-box;
  border:1px solid #ddc9f4;
  border-radius:11px;
  padding:8px 10px;
  background:#fbf8ff;
  color:var(--captain-ink);
  font:600 12px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;
  outline:none;
}

.captain-nav-search:focus{border-color:#7c34c9;box-shadow:0 0 0 3px rgba(124,52,201,.12)}
.captain-nav-count{display:block;margin-top:7px;color:var(--captain-muted);font:700 10px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.04em;text-transform:uppercase}

.captain-nav-list{
  flex:1 1 auto;
  min-height:0;
  margin:0;
  padding:8px 7px 12px;
  list-style:none;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:#c8a8e7 transparent;
}

.captain-nav-item{margin:3px 0}
.captain-nav-link{
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  gap:10px;
  box-sizing:border-box;
  border:1px solid transparent;
  border-radius:13px;
  padding:7px 9px;
  background:transparent;
  color:#3b1a57;
  text-align:left;
  cursor:pointer;
  transition:background .14s ease,border-color .14s ease,color .14s ease,transform .14s ease;
}

.captain-nav-link:hover{background:#f4ebff;border-color:#e4cff8;transform:translateX(1px)}
.captain-nav-link.is-active{background:linear-gradient(90deg,#f2e7ff,#fff6ed);border-color:#d7b9f2;color:#2b0746}

.captain-nav-icon{
  width:36px;
  height:34px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#f2e7ff;
  color:#5f259f;
  font:900 16px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
}

.captain-nav-link.is-active .captain-nav-icon{background:var(--captain-orange);color:#fff}
.captain-nav-label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:normal;
  opacity:0;
  transition:opacity .12s ease;
  font:750 12px/1.22 system-ui,-apple-system,"Segoe UI",sans-serif;
}

#pepshopAdminCaptainNav.is-open .captain-nav-label,
#pepshopAdminCaptainNav:hover .captain-nav-label,
#pepshopAdminCaptainNav:focus-within .captain-nav-label{opacity:1}

.captain-nav-empty{padding:14px 10px;color:var(--captain-muted);font:700 12px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif}

.captain-nav-foot{
  flex:0 0 auto;
  padding:8px;
  border-top:1px solid var(--captain-line);
  background:#fbf8ff;
}

.captain-nav-top{
  width:100%;
  min-height:40px;
  display:flex;
  align-items:center;
  gap:10px;
  border:0;
  border-radius:11px;
  padding:6px 9px;
  background:transparent;
  color:#5f259f;
  cursor:pointer;
  font:800 12px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;
}
.captain-nav-top:hover{background:#efe1ff}
.captain-nav-top .captain-nav-label{text-transform:uppercase;letter-spacing:.05em}

#adminWorkspace [id^="admin-captain-"]{scroll-margin-top:105px}
.admin-captain-focus{
  outline:3px solid rgba(255,121,0,.72)!important;
  outline-offset:5px!important;
  border-radius:12px;
  transition:outline-color .3s ease;
}

@media (min-width:1500px){
  #pepshopAdminCaptainNav{width:248px}
  #pepshopAdminCaptainNav .captain-nav-title,
  #pepshopAdminCaptainNav .captain-nav-tools,
  #pepshopAdminCaptainNav .captain-nav-label{opacity:1;pointer-events:auto;transform:none}
}

@media (max-width:900px){
  #pepshopAdminCaptainNav{
    top:74px;
    left:8px;
    bottom:10px;
    width:58px;
    border-radius:18px;
  }
  #pepshopAdminCaptainNav.is-open,
  #pepshopAdminCaptainNav:hover,
  #pepshopAdminCaptainNav:focus-within{width:min(286px,calc(100vw - 18px))}
  .captain-nav-head{min-height:60px;padding:8px}
  .captain-nav-toggle{width:40px;height:40px;flex-basis:40px}
}

@media print{#pepshopAdminCaptainNav{display:none!important}}
