.color-upload-title{display:flex;justify-content:space-between;align-items:end;margin-top:18px}.color-upload-title b{font-size:13px}.color-upload-title small{font-size:10px;color:var(--muted)}.color-uploads{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin-top:9px}.color-uploads label{margin:0!important;min-width:0;height:48px;padding:7px;border:1px solid var(--line);border-radius:10px;display:grid!important;grid-template-columns:25px 1fr;grid-template-rows:1fr 1fr;gap:0 7px;align-items:center;position:relative;cursor:pointer}.color-uploads label.has-file{border-color:#1a9b4b;background:#f4fbf6}.color-uploads i{grid-row:1/3;width:23px;height:23px;border-radius:50%;background:var(--swatch);border:1px solid #aaa}.color-uploads span{font-size:11px;align-self:end}.color-uploads em{font-size:9px;color:var(--blue);font-style:normal;align-self:start}.color-uploads input{position:absolute;inset:0;opacity:0;cursor:pointer}.color-preview{height:150px;margin-top:10px;border-radius:12px;background:#fafafa;border:1px dashed var(--line);display:grid;place-items:center;overflow:hidden;position:relative}.color-preview img{width:100%;height:100%;object-fit:contain}.color-preview span{position:absolute;left:8px;bottom:6px;padding:3px 6px;border-radius:6px;background:rgba(255,255,255,.88);font-size:9px;color:var(--muted)}@media(max-width:420px){.color-uploads{grid-template-columns:1fr}}
.add-colors{border:0;background:#edf6ff;color:#0065bd;border-radius:9px;padding:7px 9px;cursor:pointer;white-space:nowrap}
.product-actions{display:grid;gap:6px}.product-actions button{border:0;border-radius:9px;padding:7px 9px;cursor:pointer;white-space:nowrap}.edit{background:#edf6ff;color:#0065bd}.clear-colors,.delete,.delete-system{background:#fff0f0;color:#d93025}
.compat-details{grid-column:1/-1;border-top:1px solid #ededf0;padding-top:9px}.compat-details summary{list-style:none;display:flex;align-items:center;gap:7px;color:#0065bd;font-size:11px;font-weight:600;cursor:pointer;user-select:none}.compat-details summary::-webkit-details-marker{display:none}.compat-details summary b{margin-left:auto;padding:3px 7px;border-radius:99px;background:#edf6ff;font-size:9px}.compat-details summary:after{content:'›';font-size:17px;line-height:1;transition:transform .2s}.compat-details[open] summary:after{transform:rotate(90deg)}.compat-heads{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:9px}.compat-head{min-width:0;display:grid;grid-template-columns:48px 1fr;gap:8px;align-items:center;padding:7px;border-radius:10px;background:#f7f7f9}.compat-head img{width:48px;height:48px;border-radius:8px;background:white;object-fit:contain}.compat-head b,.compat-head small,.compat-head em{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.compat-head b{font-size:11px}.compat-head small{font-size:9px;color:var(--muted);margin-top:2px}.compat-head em{font-size:9px;color:#007d91;font-style:normal;margin-top:3px}.compat-empty{grid-column:1/-1;margin:0;padding:11px;border-radius:9px;background:#f7f7f9;color:var(--muted);font-size:10px}@media(max-width:520px){.compat-heads{grid-template-columns:1fr}}
.compat-head{grid-template-columns:48px minmax(0,1fr) auto}.compat-info{min-width:0}.compat-actions{display:grid;gap:4px}.compat-actions button{border:0;border-radius:7px;padding:5px 7px;font-size:9px;cursor:pointer}.confirm-dialog{width:min(360px,calc(100% - 32px));padding:0;border:0;border-radius:20px;box-shadow:0 24px 80px rgba(0,0,0,.24)}.confirm-dialog::backdrop{background:rgba(0,0,0,.38);backdrop-filter:blur(3px)}.confirm-box{padding:25px}.confirm-box h3{font-size:20px;margin:0 0 8px}.confirm-box p{color:var(--muted);font-size:13px;line-height:1.6;margin:0 0 22px}.confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.confirm-actions button{border:0;border-radius:99px;padding:11px;cursor:pointer}.confirm-actions .cancel-confirm{background:#ededf0;color:var(--text)}.confirm-actions .confirm-delete{background:#d93025;color:white}
.group-field input.auto-group{background:#f0fbfd;color:#007d91;border-color:#b9edf3;cursor:not-allowed}.group-field input.auto-group:focus{box-shadow:none}
.login-card .mark{width:96px;height:46px;border-radius:14px;font-size:15px;letter-spacing:.2px}

.stats{grid-template-columns:repeat(5,1fr)}.stats .stat-link{position:relative;display:block;min-height:96px;padding:18px 20px;border:1px solid #e5e5e7;border-radius:16px;text-decoration:none;color:var(--text);background:#fff;transition:transform .18s,box-shadow .18s,border-color .18s}.stats .stat-link:hover,.stats .stat-link.active{transform:translateY(-2px);border-color:#87bff7;box-shadow:0 8px 24px rgba(0,113,227,.1)}.stats .stat-link.active{background:#f2f8ff}.stat-link em{position:absolute;right:15px;bottom:15px;color:#0071e3;font-size:10px;font-style:normal}.stats .stat-background-link{background:#fff;border-color:#e5e5e7}.stats .stat-background-link.active{background:#f2f8ff;border-color:#87bff7}#productLibrary{scroll-margin-top:78px}
.background-workspace{display:grid;grid-template-columns:370px 1fr;gap:20px;align-items:start;margin-top:22px;scroll-margin-top:78px}.background-form{position:sticky;top:80px}.background-file-label{position:relative}.background-file-label input{position:absolute;inset:0;opacity:0;cursor:pointer}.background-file-label>span{display:grid;place-items:center;min-height:46px;border:1px dashed #aeb3b8;border-radius:11px;background:#fafafa;color:#0071e3;font-size:12px;font-weight:500;cursor:pointer}.background-preview{height:240px;margin-top:12px;border:1px solid #e1e1e4;border-radius:14px;background:#f5f5f7;overflow:hidden;position:relative;display:grid;place-items:center}.background-preview img{width:100%;height:100%;object-fit:cover}.background-preview span{position:absolute;left:8px;right:8px;bottom:7px;padding:5px 7px;border-radius:7px;background:rgba(255,255,255,.9);font-size:10px;color:var(--muted);text-align:center}.background-form-actions{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.background-form-actions .save{margin-top:10px}.background-form-actions #cancelBackgroundEdit{margin-top:10px;border:0;border-radius:99px;background:#ededf0;color:#555;padding:12px 15px;cursor:pointer}.background-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.background-item{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px;border:1px solid #e1e1e4;border-radius:15px}.background-item>img{width:110px;height:125px;border-radius:11px;background:#f5f5f7;object-fit:cover}.background-item h3{margin:5px 0;font-size:14px}.background-item p{margin:0;color:var(--muted);font-size:11px}.background-item>div>span{display:inline-block;padding:3px 7px;border-radius:99px;background:#edf6ff;color:#0065bd;font-size:9px}.background-actions{display:grid;gap:6px}.background-actions button{border:0;border-radius:9px;padding:8px 9px;white-space:nowrap;cursor:pointer}.edit-background{background:#edf6ff;color:#0065bd}.delete-background{background:#fff0f0;color:#d93025}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}.background-workspace{grid-template-columns:1fr}.background-form{position:static}.background-list{grid-template-columns:1fr}}@media(max-width:520px){header nav a[href="#backgroundManager"]{display:none}.background-item{grid-template-columns:82px minmax(0,1fr) auto}.background-item>img{width:82px;height:94px}.background-actions button{padding:7px;font-size:10px}}

/* Fixed dashboard: top navigation and editor stay in place; only the library pane changes. */
@media(min-width:901px){
  body.is-authenticated{height:100dvh;overflow:hidden}
  .admin-shell{height:100dvh;overflow:hidden}
  .admin-shell main{height:calc(100dvh - 60px);padding-top:22px;padding-bottom:22px;display:flex;flex-direction:column;overflow:hidden}
  .stats{flex:none;margin-bottom:16px}
  .workspace{flex:1;min-height:0;grid-template-columns:370px minmax(0,1fr);align-items:stretch}
  .admin-editor-pane,.admin-library-pane{min-height:0;height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
  .admin-editor-pane{padding-right:3px}.admin-library-pane{padding-right:3px}
  .admin-editor-pane>.upload-card,.admin-library-pane>.list-card{min-height:100%}
  .admin-editor-pane>.background-form{position:static;top:auto}
  .admin-editor-pane [hidden],.admin-library-pane [hidden]{display:none!important}
}
@media(max-width:900px){
  .admin-editor-pane,.admin-library-pane{display:block}.admin-editor-pane>.upload-card,.admin-library-pane>.list-card{margin-bottom:18px}
  .admin-editor-pane [hidden],.admin-library-pane [hidden]{display:none!important}
}
.login-card .mark{width:130px;height:48px;padding:8px 10px;border:1px solid #e5e5e7;border-radius:14px;background:#fff}.login-card .mark img{display:block;width:100%;height:100%;object-fit:contain}.admin-brand-logo{display:flex;align-items:center}.admin-brand-logo img{display:block;width:auto;height:25px}
