/* =====================================================================
   Admin / CMS panel — separate from public site styling
   File: 15-admin-cms.css
   ===================================================================== */

/* ============ ADMIN ============ */
#admin{display:none; min-height:100vh; background:#08080a; color:#f2f2f2; font-family:var(--sans);}
#admin.show{display:flex;}
.admin-sidebar{width:250px; flex-shrink:0; background:#0c0c0e; border-right:1px solid var(--line); padding:22px 14px; position:sticky; top:0; height:100vh; overflow-y:auto;}
.admin-brand{display:flex; align-items:center; gap:10px; padding:8px 10px 22px; font-weight:700; font-size:14px;}
.admin-tab{display:flex; align-items:center; gap:10px; width:100%; text-align:left; background:none; border:none; color:var(--muted); padding:11px 12px; border-radius:9px; font-size:13.5px; margin-bottom:2px; transition:all .2s ease;}
.admin-tab:hover{background:rgba(255,255,255,.04); color:var(--text);}
.admin-tab.active{background:var(--grad-soft); color:#fff; border:1px solid rgba(252,110,32,.35);}
.sidebar-divider{margin:16px 10px 8px; padding-top:16px; border-top:1px solid var(--line); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted2); font-weight:600;}
.admin-main{flex:1; padding:34px 44px; max-width:920px;}
.admin-topbar{display:flex; justify-content:space-between; align-items:center; margin-bottom:28px; flex-wrap:wrap; gap:12px;}
.admin-title{font-size:24px; font-weight:600;}
.admin-actions{display:flex; gap:10px;}
.abtn{padding:10px 18px; border-radius:9px; font-size:13px; font-weight:600; border:1px solid var(--line-strong); background:rgba(255,255,255,.03); color:var(--text); transition:all .2s ease;}
.abtn:hover{background:rgba(255,255,255,.07);}
.abtn.primary{background:var(--grad); border-color:transparent;}
.abtn.danger{border-color:rgba(224,18,44,.4); color:#ff6b7a;}
.afield{margin-bottom:16px;}
.afield label{display:block; font-size:12px; color:var(--muted); margin-bottom:6px; font-weight:600; text-transform:uppercase; letter-spacing:.05em;}
.afield input, .afield textarea, .afield select{width:100%; background:#111113; border:1px solid var(--line); border-radius:9px; padding:11px 13px; color:#fff; font-family:inherit; font-size:13.5px; outline:none;}
.afield select option{background:#111113; color:#fff;}
.afield input:focus, .afield textarea:focus{border-color:var(--orange);}
.afield textarea{min-height:70px; resize:vertical;}
.afield .hint{font-size:11px; color:var(--muted2); margin-top:5px;}
.acard{background:#0f0f11; border:1px solid var(--line); border-radius:12px; padding:20px; margin-bottom:16px; position:relative;}
.acard-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;}
.acard-tag{font-size:11px; color:var(--muted2); font-weight:700;}
.acard-tools{display:flex; gap:6px;}
.acard-tools button{width:26px; height:26px; border-radius:6px; border:1px solid var(--line-strong); background:transparent; color:var(--muted); font-size:12px; display:flex; align-items:center; justify-content:center;}
.acard-tools button:hover{color:#fff; border-color:var(--orange);}
.add-item-btn{width:100%; padding:12px; border:1px dashed var(--line-strong); border-radius:10px; background:transparent; color:var(--muted); font-size:13px; font-weight:600;}
.add-item-btn:hover{border-color:var(--orange); color:#fff;}
.admin-panel{display:none;}
.admin-panel.active{display:block;}
.toast{position:fixed; bottom:26px; right:26px; background:#141416; border:1px solid rgba(80,220,140,.4); color:#7fe3ac; padding:13px 20px; border-radius:11px; font-size:13.5px; z-index:2000; opacity:0; transform:translateY(10px); transition:all .3s ease; pointer-events:none;}
.toast.show{opacity:1; transform:translateY(0);}
.admin-login{min-height:100vh; display:flex; align-items:center; justify-content:center; width:100%;}
.login-box{width:340px; background:#0f0f11; border:1px solid var(--line); border-radius:16px; padding:34px;}
.cms-brand-mark{display:flex; align-items:center; gap:10px; margin-bottom:6px;}
.cms-brand-mark img{width:32px; height:32px; object-fit:contain; border-radius:8px;}
.login-box h3{font-size:19px; font-weight:600; margin:0;}
.login-box p{font-size:12.5px; margin-bottom:20px;}
.sub-list{display:flex; flex-direction:column; gap:10px; margin-top:10px;}
.sub-card{background:#0f0f11; border:1px solid var(--line); border-radius:10px; padding:14px 16px;}
.sub-card .meta{font-size:11px; color:var(--muted2); margin-bottom:6px;}
.sub-card .name{font-weight:600; font-size:14px; margin-bottom:2px;}
.sub-card .msg{font-size:13px; color:var(--muted); margin-top:6px;}
.empty-note{color:var(--muted2); font-size:13px; padding:30px 0; text-align:center; border:1px dashed var(--line); border-radius:10px;}
@media(max-width:900px){.admin-sidebar{display:none;} .admin-main{padding:22px;}}