/* Kệ Số – trang tài khoản giám đốc: đăng nhập, đăng ký, trang quản lý (dùng kèm keso.css) */
body.acc{background:var(--gx);min-height:100vh}
.acc section{padding:0}
.acc header{position:static}
.acc .hd{height:64px}
.acc .hb .who{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--ink)}
.acc .av{width:34px;height:34px;border-radius:50%;background:var(--gl);color:var(--g);font-weight:800;display:inline-flex;align-items:center;justify-content:center;font-size:13px}
.auth{max-width:440px;margin:0 auto;padding:28px 16px 60px}
.box{background:#fff;border-radius:18px;padding:26px 24px;box-shadow:0 6px 24px rgba(15,31,25,.08);border:1px solid var(--line)}
.box h1{font-size:23px;margin:0 0 4px}
.box .sub{font-size:14px}
.f label{display:block;font-size:13.5px;font-weight:600;margin:14px 0 6px}
.f input,.f select{width:100%;height:48px;border:1.5px solid var(--line);border-radius:12px;padding:0 14px;font:inherit;font-size:15.5px;color:var(--ink);background:#fff}
.f input:focus,.f select:focus{outline:none;border-color:var(--g);box-shadow:0 0 0 3px var(--gl)}
.pw{position:relative}.pw input{padding-right:60px}
.pw button{position:absolute;right:8px;top:8px;height:32px;border:0;background:none;color:var(--g);font:inherit;font-weight:700;font-size:13px;cursor:pointer}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.ck{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;margin-top:14px;line-height:1.45}
.ck input{width:18px;height:18px;margin-top:1px;accent-color:var(--g);flex:none}
.err{color:#B91C1C;background:#FEF2F2;border-radius:10px;padding:9px 12px;font-size:13.5px;margin-top:12px;display:none}
.okm{color:#065F46;background:#ECFDF5;border:1px solid #A7F3D0;border-radius:10px;padding:10px 12px;font-size:13.5px;margin-top:12px;display:none}
.err.on,.okm.on{display:block}
.box .btn{width:100%;margin-top:18px}
.lnk{color:var(--g);font-weight:700;text-decoration:none;background:none;border:0;font:inherit;cursor:pointer;padding:0}
.or{display:flex;align-items:center;gap:10px;color:var(--mute);font-size:13px;margin:20px 0 10px}
.or:before,.or:after{content:"";flex:1;height:1px;background:var(--line)}
.tip{font-size:13px;color:var(--mute);background:var(--gx);border:1px dashed var(--line);border-radius:10px;padding:9px 12px;line-height:1.5}
.picks{display:grid;gap:8px;margin-top:6px}
.picks label{display:flex;gap:10px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;margin:0;font-weight:600;cursor:pointer}
.picks label small{display:block;font-weight:500;color:var(--mute);font-size:12.5px}
.picks input{accent-color:var(--g);width:18px;height:18px}
.picks label:has(input:checked){border-color:var(--g);background:var(--gx)}
/* trang quản lý */
.tabs{display:flex;gap:22px;margin-left:24px}
.tabs a{font-weight:600;font-size:14.5px;color:var(--mute);text-decoration:none;padding:21px 0;border-bottom:2px solid transparent}
.tabs a.on{color:var(--g);border-color:var(--g)}
.pg{max-width:1040px;margin:0 auto;padding:24px 20px 60px}
.pg h2{font-size:22px;margin:0}
.ban{display:flex;gap:12px;align-items:center;background:#FFF7ED;border:1px solid #FED7AA;border-radius:12px;padding:10px 14px;margin:14px 0 0;font-size:13.5px;color:#7C2D12}
.ban.bad{background:#FEF2F2;border-color:#FECACA;color:#991B1B}
.ban .btn{margin-left:auto;height:36px;font-size:13px;padding:0 14px;border-radius:10px;width:auto;margin-top:0}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;margin-top:14px}
.wsr{display:grid;grid-template-columns:56px 1fr auto;gap:16px;align-items:start}
.ic{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex:none}
.wn{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.wn b{font-size:17px}
.stt{font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 10px}
.stt.ok{background:#ECFDF5;color:#047857}.stt.wa{background:#FFF7ED;color:#B45309}.stt.no{background:#FEF2F2;color:#B91C1C}
.meta{display:flex;gap:6px 18px;margin-top:8px;font-size:13.5px;flex-wrap:wrap}
.bar{height:8px;background:#E5EDE9;border-radius:99px;overflow:hidden;margin-top:6px;max-width:300px}
.bar i{display:block;height:100%;background:var(--g)}
.acts{display:flex;flex-direction:column;gap:8px;min-width:180px}
.acts .btn{width:100%}
.hdl{text-align:center;font-size:13.5px;font-weight:600;color:var(--g);text-decoration:none;padding:4px 0}.hdl:hover{text-decoration:underline}
.staff{margin-top:14px;border-top:1px dashed var(--line);padding-top:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px}
.code{background:#F1F5F9;border-radius:8px;padding:6px 10px;font-family:ui-monospace,Menlo,monospace;font-size:13px;word-break:break-all}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
.mini{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column}
.mini b{margin-top:10px;font-size:15px}
.mini p{font-size:13px;color:var(--mute);margin:4px 0 12px;flex:1}
.mini .row{display:flex;gap:8px;flex-wrap:wrap}
.mini .btn{height:38px;font-size:13px;padding:0 14px;border-radius:10px}
.empty{background:#fff;border:1px dashed var(--line);border-radius:16px;padding:22px;text-align:center;margin-top:14px}
.md{position:fixed;inset:0;background:rgba(15,31,25,.45);display:none;align-items:center;justify-content:center;padding:16px;z-index:50}
.md.on{display:flex}
.md .box{width:100%;max-width:440px;position:relative}
.md .x{position:absolute;right:12px;top:10px;border:0;background:none;font-size:26px;cursor:pointer;color:var(--mute)}
.load{opacity:.55;pointer-events:none}
@media (max-width:760px){
  .tabs{display:none}
  .wsr{grid-template-columns:48px 1fr}.ic{width:48px;height:48px}
  .acts{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;min-width:0}.acts .hdl{flex-basis:100%}.acts .btn{flex:1;font-size:13.5px;padding:0 10px}
  .grid3{grid-template-columns:1fr}
  .row2{grid-template-columns:1fr}
  .mtabs{display:flex!important}
}
.mtabs{display:none;gap:6px;margin:0 0 6px;overflow:auto}
.mtabs a{flex:none;font-size:13.5px;font-weight:600;text-decoration:none;color:var(--mute);background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px}
.mtabs a.on{color:#fff;background:var(--g);border-color:var(--g)}
