/**
 * HOMEBOX DS 컴포넌트 클래스 — agents/homebox-ds-style-source.css 와 동기
 * (자동 생성: node tools/build-homebox-ds-spec.mjs)
 * 사용: 마크업에 .btn, .ptog, .gsearch 등 스펙과 동일 클래스 적용
 * 로드: templates/header.php · templates/admin-header.php (homebox-ds.css 다음)
 */

body.imgshop-site--dark,
body.imgshop-admin-app--hb {
  --p: var(--hb-primary);
  --p2: var(--hb-primary2);
  --pbg: var(--hb-primaryBg);
  --bg: var(--hb-bg);
  --s: var(--hb-surface);
  --s2: var(--hb-surface2);
  --s3: var(--hb-surface3);
  --b: var(--hb-border);
  --b2: var(--hb-border2);
  --t: var(--hb-text);
  --m: var(--hb-muted);
  --m2: var(--hb-muted2);
  --err: var(--hb-error);
  --errbg: var(--hb-errorBg);
  --warn: var(--hb-warning);
}

/* 섹션 헤더 */

body.imgshop-site--dark .sh,
body.imgshop-admin-app--hb .sh {
display:flex;align-items:center;gap:10px;margin:40px 0 14px
}

body.imgshop-site--dark .sh h2,
body.imgshop-admin-app--hb .sh h2 {
font-size:10px;font-weight:700;color:var(--m);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap
}

body.imgshop-site--dark .sh hr,
body.imgshop-admin-app--hb .sh hr {
flex:1;border:none;border-top:1px solid var(--b)
}

/* BADGE */

body.imgshop-site--dark .badge,
body.imgshop-admin-app--hb .badge {
display:inline-flex;align-items:center;gap:4px;font-weight:600;font-size:10.5px;border-radius:8px;padding:3px 9px;border:1px solid transparent
}

body.imgshop-site--dark .badge.xs,
body.imgshop-admin-app--hb .badge.xs {
padding:2px 6px;border-radius:6px;font-size:10px
}

body.imgshop-site--dark .bd-default,
body.imgshop-admin-app--hb .bd-default {
background:var(--s2);color:var(--m);border-color:var(--b)
}

body.imgshop-site--dark .bd-primary,
body.imgshop-admin-app--hb .bd-primary {
background:var(--pbg);color:var(--p);border-color:rgba(34,197,94,.3)
}

body.imgshop-site--dark .bd-pro,
body.imgshop-admin-app--hb .bd-pro {
background:var(--p);color:#fff;border:none
}

body.imgshop-site--dark .bd-success,
body.imgshop-admin-app--hb .bd-success {
background:var(--pbg);color:var(--p);border-color:rgba(34,197,94,.3)
}

body.imgshop-site--dark .bd-error,
body.imgshop-admin-app--hb .bd-error {
background:var(--errbg);color:var(--err);border-color:rgba(239,68,68,.3)
}

body.imgshop-site--dark .bd-warning,
body.imgshop-admin-app--hb .bd-warning {
background:rgba(245,158,11,.12);color:var(--warn);border-color:rgba(245,158,11,.3)
}

body.imgshop-site--dark .bd-new,
body.imgshop-admin-app--hb .bd-new {
background:linear-gradient(135deg,#22C55E,#16A34A);color:#fff;border:none
}

body.imgshop-site--dark .dot,
body.imgshop-admin-app--hb .dot {
width:5px;height:5px;border-radius:50%;background:currentColor;display:inline-block;flex-shrink:0
}

/* BUTTON */

body.imgshop-site--dark .btn,
body.imgshop-admin-app--hb .btn {
display:inline-flex;align-items:center;justify-content:center;gap:6px;font-weight:600;border-radius:10px;cursor:pointer;transition:opacity .15s;font-family:inherit;font-size:11.7px;padding:9px 18px;border:none
}

body.imgshop-site--dark .btn:hover,
body.imgshop-admin-app--hb .btn:hover {
opacity:.85
}

body.imgshop-site--dark .btn.sm,
body.imgshop-admin-app--hb .btn.sm {
padding:5px 11px;font-size:10.5px;border-radius:8px
}

body.imgshop-site--dark .btn.lg,
body.imgshop-admin-app--hb .btn.lg {
padding:11px 22px;font-size:12.6px;border-radius:12px
}

body.imgshop-site--dark .btn-p,
body.imgshop-admin-app--hb .btn-p {
background:var(--p);color:#fff
}

body.imgshop-site--dark .btn-sec,
body.imgshop-admin-app--hb .btn-sec {
background:transparent;color:var(--t);border:1px solid var(--b2)
}

body.imgshop-site--dark .btn-out,
body.imgshop-admin-app--hb .btn-out {
background:transparent;color:var(--p);border:1px solid var(--p)
}

body.imgshop-site--dark .btn-ghost,
body.imgshop-admin-app--hb .btn-ghost {
background:transparent;color:var(--m);border:none
}

body.imgshop-site--dark .btn-danger,
body.imgshop-admin-app--hb .btn-danger {
background:var(--errbg);color:var(--err);border:1px solid var(--err)
}

body.imgshop-site--dark .btn-success,
body.imgshop-admin-app--hb .btn-success {
background:var(--pbg);color:var(--p);border:1px solid var(--p)
}

body.imgshop-site--dark .btn[disabled],
body.imgshop-admin-app--hb .btn[disabled] {
opacity:.45;cursor:not-allowed
}

/* INPUT */

body.imgshop-site--dark .field,
body.imgshop-admin-app--hb .field {
display:flex;flex-direction:column;gap:5px
}

body.imgshop-site--dark .label,
body.imgshop-admin-app--hb .label {
font-size:10.8px;color:var(--m);font-weight:500
}

body.imgshop-site--dark .inp,
body.imgshop-admin-app--hb .inp {
background:var(--s);border:1px solid var(--b);color:var(--t);border-radius:10px;padding:9px 13px;font-size:12.6px;outline:none;font-family:inherit;width:100%
}

body.imgshop-site--dark .inp:focus,
body.imgshop-admin-app--hb .inp:focus {
border-color:var(--p)
}

body.imgshop-site--dark .inp.err,
body.imgshop-admin-app--hb .inp.err {
border-color:var(--err)
}

body.imgshop-site--dark textarea.inp,
body.imgshop-admin-app--hb textarea.inp {
resize:vertical;line-height:1.6
}

body.imgshop-site--dark .err-msg,
body.imgshop-admin-app--hb .err-msg {
font-size:10.5px;color:var(--err)
}

body.imgshop-site--dark .hint-msg,
body.imgshop-admin-app--hb .hint-msg {
font-size:10.5px;color:var(--m)
}

/* CHIP */

body.imgshop-site--dark .chip,
body.imgshop-admin-app--hb .chip {
background:var(--s2);border:1px solid var(--b);border-radius:8px;padding:4px 12px;font-size:11.7px;color:var(--m);cursor:pointer;font-family:inherit
}

body.imgshop-site--dark .chip.on,
body.imgshop-admin-app--hb .chip.on {
background:var(--p);color:#fff;border-color:var(--p);font-weight:700
}

body.imgshop-site--dark .chip:focus,
body.imgshop-admin-app--hb .chip:focus {
outline:none
}

/* IMAGE SLOT */

body.imgshop-site--dark .slot,
body.imgshop-admin-app--hb .slot {
width:72px;height:72px;background:var(--s2);border:1px solid var(--b2);border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0
}

/* TOGGLE */

body.imgshop-site--dark .tog-wrap,
body.imgshop-admin-app--hb .tog-wrap {
display:flex;align-items:center;gap:10px;cursor:pointer
}

body.imgshop-site--dark .tog-track,
body.imgshop-admin-app--hb .tog-track {
width:44px;height:24px;border-radius:99px;position:relative;border:1px solid;flex-shrink:0;cursor:pointer;transition:background .2s
}

body.imgshop-site--dark .tog-thumb,
body.imgshop-admin-app--hb .tog-thumb {
position:absolute;top:3px;width:16px;height:16px;background:#fff;border-radius:50%;transition:left .2s
}

body.imgshop-site--dark .tog-on,
body.imgshop-admin-app--hb .tog-on {
background:var(--p);border-color:var(--p)
}

body.imgshop-site--dark .tog-off,
body.imgshop-admin-app--hb .tog-off {
background:var(--s2);border-color:var(--b)
}

/* TABS */

body.imgshop-site--dark .tab-group,
body.imgshop-admin-app--hb .tab-group {
display:flex;gap:3px;background:var(--s);border-radius:10px;padding:3px
}

body.imgshop-site--dark .tab-btn,
body.imgshop-admin-app--hb .tab-btn {
background:transparent;border:1px solid transparent;border-radius:8px;padding:6px 14px;font-size:11.7px;color:var(--m);cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:5px;transition:all .15s
}

body.imgshop-site--dark .tab-btn.on,
body.imgshop-admin-app--hb .tab-btn.on {
background:var(--s2);color:var(--t);border-color:var(--b2);font-weight:600
}

/* CATEGORY FILTER TABS (하단 보더 스타일, Tailwind 없이 사용) */

body.imgshop-site--dark .cat-tabs,
body.imgshop-admin-app--hb .cat-tabs {
display:flex;flex-wrap:wrap;border-bottom:1px solid var(--b);gap:0;align-items:flex-end
}

body.imgshop-site--dark .cat-tab-btn,
body.imgshop-admin-app--hb .cat-tab-btn {
background:transparent;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;padding:10px 14px;font-size:11.7px;color:var(--m);cursor:pointer;font-family:inherit;font-weight:400;transition:color .15s,border-color .15s,font-weight .15s;line-height:1.35
}

body.imgshop-site--dark .cat-tab-btn:hover,
body.imgshop-admin-app--hb .cat-tab-btn:hover {
color:var(--t)
}

body.imgshop-site--dark .cat-tab-btn.on,
body.imgshop-admin-app--hb .cat-tab-btn.on {
color:var(--p);border-bottom-color:var(--p);font-weight:700
}

body.imgshop-site--dark .cat-tab-count,
body.imgshop-admin-app--hb .cat-tab-count {
font-size:10.8px;margin-left:3px;font-weight:inherit;opacity:.92
}

/* MODEL AVATAR GRID (AI 모델 썸네일 선택) */

body.imgshop-site--dark .modav,
body.imgshop-admin-app--hb .modav {
display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;font-family:inherit;background:none;border:none;padding:0;text-align:center
}

body.imgshop-site--dark .modav-frame,
body.imgshop-admin-app--hb .modav-frame {
width:64px;height:64px;border-radius:10px;overflow:hidden;background:var(--s2);border:2px solid transparent;transition:border-color .15s,box-shadow .15s;flex-shrink:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box
}

body.imgshop-site--dark .modav-frame img,
body.imgshop-admin-app--hb .modav-frame img {
width:100%;height:100%;object-fit:cover;display:block
}

body.imgshop-site--dark .modav-ph,
body.imgshop-admin-app--hb .modav-ph {
font-size:20px;line-height:1;color:var(--m);user-select:none
}

body.imgshop-site--dark .modav-name,
body.imgshop-admin-app--hb .modav-name {
font-size:10.8px;color:var(--m);max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .15s;font-weight:500
}

body.imgshop-site--dark .modav.on .modav-frame,
body.imgshop-admin-app--hb .modav.on .modav-frame {
border-color:var(--p);box-shadow:0 0 0 1px rgba(34,197,94,.22)
}

body.imgshop-site--dark .modav.on .modav-name,
body.imgshop-admin-app--hb .modav.on .modav-name {
color:var(--p);font-weight:700
}

/* ALERT */

body.imgshop-site--dark .alert,
body.imgshop-admin-app--hb .alert {
border-radius:10px;padding:12px 16px;display:flex;align-items:flex-start;gap:10px;border:1px solid
}

body.imgshop-site--dark .al-icon,
body.imgshop-admin-app--hb .al-icon {
font-size:13px;flex-shrink:0;margin-top:1px;line-height:1
}

body.imgshop-site--dark .al-title,
body.imgshop-admin-app--hb .al-title {
font-size:11.7px;font-weight:600;margin-bottom:2px
}

body.imgshop-site--dark .al-text,
body.imgshop-admin-app--hb .al-text {
font-size:11.7px;color:var(--m);line-height:1.5
}

/* PROGRESS */

body.imgshop-site--dark .prog-bar,
body.imgshop-admin-app--hb .prog-bar {
height:6px;background:var(--s2);border-radius:99px;overflow:hidden
}

body.imgshop-site--dark .prog-fill,
body.imgshop-admin-app--hb .prog-fill {
height:100%;background:linear-gradient(90deg,var(--p),var(--p2));border-radius:99px
}

body.imgshop-site--dark .prog-header,
body.imgshop-admin-app--hb .prog-header {
display:flex;justify-content:space-between;margin-bottom:5px;font-size:10.5px
}

/* SPINNER */

@keyframes hb-ds-spec-spin{to{transform:rotate(360deg)}}

body.imgshop-site--dark .spinner,
body.imgshop-admin-app--hb .spinner {
border:2px solid var(--b2);border-top-color:var(--p);border-radius:50%;animation: hb-ds-spec-spin .8s linear infinite;flex-shrink:0;display:inline-block
}

/* CARD */

body.imgshop-site--dark .card,
body.imgshop-admin-app--hb .card {
background:var(--s);border:1px solid var(--b);border-radius:12px;overflow:hidden;transition:all .2s
}

body.imgshop-site--dark .card:hover,
body.imgshop-admin-app--hb .card:hover {
border-color:var(--b2);transform:translateY(-2px)
}

body.imgshop-site--dark .card-img,
body.imgshop-admin-app--hb .card-img {
height:110px;background:var(--s2);display:flex;align-items:center;justify-content:center;font-size:28px;position:relative
}

body.imgshop-site--dark .card-body,
body.imgshop-admin-app--hb .card-body {
padding:9px 11px
}

body.imgshop-site--dark .card-title,
body.imgshop-admin-app--hb .card-title {
font-size:10.8px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}

body.imgshop-site--dark .card-sub,
body.imgshop-admin-app--hb .card-sub {
font-size:9.9px;color:var(--m);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}

/* STAT */

body.imgshop-site--dark .stat,
body.imgshop-admin-app--hb .stat {
background:var(--s);border:1px solid var(--b);border-radius:12px;padding:16px 18px
}

body.imgshop-site--dark .stat-label,
body.imgshop-admin-app--hb .stat-label {
font-size:10.5px;color:var(--m);margin-bottom:5px
}

body.imgshop-site--dark .stat-val,
body.imgshop-admin-app--hb .stat-val {
font-size:20px;font-weight:800
}

body.imgshop-site--dark .stat-sub,
body.imgshop-admin-app--hb .stat-sub {
font-size:10.5px;color:var(--p);margin-top:4px
}

/* INFO TABLE */

body.imgshop-site--dark .tbl,
body.imgshop-admin-app--hb .tbl {
background:var(--s);border:1px solid var(--b);border-radius:10px;overflow:hidden
}

body.imgshop-site--dark .tbl-row,
body.imgshop-admin-app--hb .tbl-row {
display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid var(--b)
}

body.imgshop-site--dark .tbl-row:last-child,
body.imgshop-admin-app--hb .tbl-row:last-child {
border-bottom:none
}

body.imgshop-site--dark .tbl-key,
body.imgshop-admin-app--hb .tbl-key {
font-size:11.7px;color:var(--m)
}

body.imgshop-site--dark .tbl-val,
body.imgshop-admin-app--hb .tbl-val {
font-size:11.7px
}

/* NOTICE ITEM */

body.imgshop-site--dark .notice,
body.imgshop-admin-app--hb .notice {
display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:var(--s);border:1px solid var(--b);border-radius:8px;gap:10px
}

body.imgshop-site--dark .notice-tag,
body.imgshop-admin-app--hb .notice-tag {
font-size:10px;padding:3px 8px;border-radius:99px;font-weight:700;flex-shrink:0
}

body.imgshop-site--dark .notice-title,
body.imgshop-admin-app--hb .notice-title {
font-size:11.7px
}

body.imgshop-site--dark .notice-date,
body.imgshop-admin-app--hb .notice-date {
font-size:10.5px;color:var(--m);flex-shrink:0;margin-left:8px
}

/* SIDE MENU */

body.imgshop-site--dark .sidemenu,
body.imgshop-admin-app--hb .sidemenu {
background:var(--s);border:1px solid var(--b);border-radius:12px;padding:14px
}

body.imgshop-site--dark .sidemenu h3,
body.imgshop-admin-app--hb .sidemenu h3 {
font-size:13.5px;font-weight:700;margin-bottom:10px
}

body.imgshop-site--dark .sm-divider,
body.imgshop-admin-app--hb .sm-divider {
height:1px;background:var(--b);margin-bottom:10px
}

body.imgshop-site--dark .sm-group,
body.imgshop-admin-app--hb .sm-group {
font-size:10px;color:var(--m2);font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin:10px 0 4px
}

body.imgshop-site--dark .sm-item,
body.imgshop-admin-app--hb .sm-item {
display:block;width:100%;text-align:left;background:none;border:none;padding:5px 6px;font-size:11.7px;color:var(--m);cursor:pointer;font-family:inherit;transition:color .15s
}

body.imgshop-site--dark .sm-item:hover,
body.imgshop-admin-app--hb .sm-item:hover {
color:var(--t)
}

body.imgshop-site--dark .sm-item.on,
body.imgshop-admin-app--hb .sm-item.on {
color:var(--p);font-weight:700
}

/* PRICING */

body.imgshop-site--dark .price-card,
body.imgshop-admin-app--hb .price-card {
background:var(--s);border:1px solid var(--b);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:12px
}

body.imgshop-site--dark .price-card.rec,
body.imgshop-admin-app--hb .price-card.rec {
border:2px solid var(--p)
}

body.imgshop-site--dark .price-amount,
body.imgshop-admin-app--hb .price-amount {
font-size:24px;font-weight:900;color:var(--p)
}

/* COMPARE TABLE */

body.imgshop-site--dark .cmp,
body.imgshop-admin-app--hb .cmp {
background:var(--s);border:1px solid var(--b);border-radius:12px;overflow:hidden
}

body.imgshop-site--dark .cmp-head,
body.imgshop-admin-app--hb .cmp-head {
display:grid;grid-template-columns:1fr 1fr 1fr;background:var(--s2)
}

body.imgshop-site--dark .cmp-head div,
body.imgshop-admin-app--hb .cmp-head div {
padding:10px 14px;font-size:10.5px;font-weight:700;color:var(--m);border-bottom:1px solid var(--b)
}

body.imgshop-site--dark .cmp-row,
body.imgshop-admin-app--hb .cmp-row {
display:grid;grid-template-columns:1fr 1fr 1fr;border-bottom:1px solid var(--b)
}

body.imgshop-site--dark .cmp-row:last-child,
body.imgshop-admin-app--hb .cmp-row:last-child {
border-bottom:none
}

body.imgshop-site--dark .cmp-row div,
body.imgshop-admin-app--hb .cmp-row div {
padding:10px 14px;font-size:11.7px
}

/* KEYWORD */

body.imgshop-site--dark .kw,
body.imgshop-admin-app--hb .kw {
background:var(--s2);border:1px solid var(--b);border-radius:99px;padding:4px 12px;font-size:10.8px;color:var(--m);cursor:pointer;font-family:inherit;transition:all .15s
}

body.imgshop-site--dark .kw.on,
body.imgshop-admin-app--hb .kw.on {
background:var(--pbg);border-color:rgba(34,197,94,.3);color:var(--p);font-weight:700
}

/* CHECKBOX */

body.imgshop-site--dark .cb,
body.imgshop-admin-app--hb .cb {
width:16px;height:16px;border-radius:3px;border:1.5px solid var(--b2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;vertical-align:middle;transition:all .15s
}

body.imgshop-site--dark .cb.on,
body.imgshop-admin-app--hb .cb.on {
background:var(--p);border-color:var(--p)
}

/* DOWNLOAD CARD */

body.imgshop-site--dark .dl-card,
body.imgshop-admin-app--hb .dl-card {
background:var(--s);border:1px solid var(--b);border-radius:10px;overflow:hidden
}

body.imgshop-site--dark .dl-img,
body.imgshop-admin-app--hb .dl-img {
height:100px;background:var(--s2);display:flex;align-items:center;justify-content:center;font-size:24px
}

body.imgshop-site--dark .dl-body,
body.imgshop-admin-app--hb .dl-body {
padding:8px 10px
}

body.imgshop-site--dark .dl-time,
body.imgshop-admin-app--hb .dl-time {
font-size:10.5px;color:var(--m);margin-bottom:4px
}

body.imgshop-site--dark .dl-msg,
body.imgshop-admin-app--hb .dl-msg {
font-size:10.5px;color:var(--p);line-height:1.5;margin-bottom:4px
}

/* BULK BAR */

body.imgshop-site--dark .bulk,
body.imgshop-admin-app--hb .bulk {
display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:10px 14px;background:var(--s);border:1px solid var(--b);border-radius:10px
}

body.imgshop-site--dark .bulk-label,
body.imgshop-admin-app--hb .bulk-label {
font-size:11.7px;font-weight:600;color:var(--t);margin-right:4px
}

body.imgshop-site--dark .btn-out-err,
body.imgshop-admin-app--hb .btn-out-err {
background:transparent;color:var(--err);border:1px solid var(--err)
}

/* DASH CARD */

body.imgshop-site--dark .dash,
body.imgshop-admin-app--hb .dash {
background:var(--s);border:1px solid var(--b);border-radius:12px;padding:15px 17px
}

body.imgshop-site--dark .dash-label,
body.imgshop-admin-app--hb .dash-label {
font-size:10.5px;color:var(--m);margin-bottom:4px
}

body.imgshop-site--dark .dash-val,
body.imgshop-admin-app--hb .dash-val {
font-size:20px;font-weight:900;display:flex;align-items:center;gap:6px
}

body.imgshop-site--dark .dash-sub,
body.imgshop-admin-app--hb .dash-sub {
font-size:10.5px;color:var(--m);margin-top:3px
}

body.imgshop-site--dark .dash-link,
body.imgshop-admin-app--hb .dash-link {
font-size:10.5px;color:var(--p);margin-top:4px;cursor:pointer
}

/* MEM CARD */

body.imgshop-site--dark .mem,
body.imgshop-admin-app--hb .mem {
background:var(--s);border:1px solid var(--b);border-radius:12px;padding:20px 22px;display:flex;flex-direction:column;gap:12px
}

body.imgshop-site--dark .mem-tier,
body.imgshop-admin-app--hb .mem-tier {
font-size:19px;font-weight:900
}

body.imgshop-site--dark .mem-row,
body.imgshop-admin-app--hb .mem-row {
display:flex;gap:8px;align-items:flex-start
}

body.imgshop-site--dark .mem-key,
body.imgshop-admin-app--hb .mem-key {
font-size:11.7px;color:var(--m);min-width:80px;flex-shrink:0;padding-top:1px
}

/* EMPTY */

body.imgshop-site--dark .empty,
body.imgshop-admin-app--hb .empty {
display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px;gap:10px;text-align:center
}

/* WELCOME */

body.imgshop-site--dark .welcome,
body.imgshop-admin-app--hb .welcome {
background:var(--s);border:1px solid var(--b);border-radius:12px;padding:18px 22px
}

/* PRICING TOGGLE */

body.imgshop-site--dark .ptog,
body.imgshop-admin-app--hb .ptog {
display:inline-flex;background:var(--s2);border:1px solid var(--b);border-radius:99px;padding:3px;gap:2px
}

body.imgshop-site--dark .ptog-btn,
body.imgshop-admin-app--hb .ptog-btn {
background:transparent;border:none;border-radius:99px;padding:6px 18px;font-size:11.7px;color:var(--m);cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:5px
}

body.imgshop-site--dark .ptog-btn.on,
body.imgshop-admin-app--hb .ptog-btn.on {
background:var(--p);color:#fff;font-weight:700
}

/* MODAL FAUX */

body.imgshop-site--dark .modal-bg,
body.imgshop-admin-app--hb .modal-bg {
background:rgba(0,0,0,.6);border-radius:12px;padding:24px;display:flex;align-items:center;justify-content:center;min-height:260px
}

body.imgshop-site--dark .modal-box,
body.imgshop-admin-app--hb .modal-box {
background:var(--s);border:1px solid var(--b);border-radius:16px;padding:20px;width:100%;max-width:400px
}

body.imgshop-site--dark .modal-hd,
body.imgshop-admin-app--hb .modal-hd {
display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px
}

body.imgshop-site--dark .modal-close,
body.imgshop-admin-app--hb .modal-close {
background:var(--s2);border:1px solid var(--b);border-radius:8px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--m);font-size:11px;flex-shrink:0
}

/* UTIL NAV */

body.imgshop-site--dark .util-nav,
body.imgshop-admin-app--hb .util-nav {
background:#0D0D0D;border:1px solid var(--b);border-radius:8px;padding:6px 16px;display:flex;justify-content:space-between;align-items:center
}

body.imgshop-site--dark .util-nav a,
body.imgshop-admin-app--hb .util-nav a {
font-size:10.5px;color:var(--m);text-decoration:none
}

/* GLOBAL SEARCH */

body.imgshop-site--dark .gsearch,
body.imgshop-admin-app--hb .gsearch {
display:flex
}

body.imgshop-site--dark .gsearch input,
body.imgshop-admin-app--hb .gsearch input {
flex:1;background:var(--s2);border:1px solid var(--b);border-right:none;border-radius:8px 0 0 8px;padding:9px 13px;font-size:12.6px;color:var(--t);outline:none;font-family:inherit
}

body.imgshop-site--dark .gsearch input::placeholder,
body.imgshop-admin-app--hb .gsearch input::placeholder {
color:var(--m)
}

body.imgshop-site--dark .gsearch .sbtn,
body.imgshop-admin-app--hb .gsearch .sbtn {
background:var(--p);border:none;padding:0 16px;color:#fff;font-size:14px;cursor:pointer
}

body.imgshop-site--dark .gsearch .abtn,
body.imgshop-admin-app--hb .gsearch .abtn {
background:var(--s3);border:1px solid var(--b);border-left:none;border-radius:0 8px 8px 0;padding:0 13px;color:var(--p);font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:4px;white-space:nowrap
}

/* AI SEARCH */

body.imgshop-site--dark .aisearch,
body.imgshop-admin-app--hb .aisearch {
background:var(--s);border:1px solid var(--b);border-radius:10px;padding:12px 14px;position:relative
}

body.imgshop-site--dark .aisearch input,
body.imgshop-admin-app--hb .aisearch input {
flex:1;background:transparent;border:none;color:var(--t);font-size:12.6px;outline:none;font-family:inherit;width:100%
}

body.imgshop-site--dark .aisearch input::placeholder,
body.imgshop-admin-app--hb .aisearch input::placeholder {
color:var(--m)
}

body.imgshop-site--dark .ai-char,
body.imgshop-admin-app--hb .ai-char {
position:absolute;bottom:8px;right:12px;font-size:10.5px;color:var(--m)
}

/* FILTER DD */

body.imgshop-site--dark .dd,
body.imgshop-admin-app--hb .dd {
position:relative;display:inline-block
}

body.imgshop-site--dark .dd-btn,
body.imgshop-admin-app--hb .dd-btn {
background:var(--s);border:1px solid var(--b2);border-radius:8px;padding:7px 12px;font-size:11.7px;color:var(--t);cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:6px
}

body.imgshop-site--dark .dd-menu,
body.imgshop-admin-app--hb .dd-menu {
display:none;position:absolute;top:calc(100%+3px);left:0;z-index:20;background:var(--s);border:1px solid var(--b);border-radius:8px;min-width:140px;overflow:hidden
}

body.imgshop-site--dark .dd-menu.open,
body.imgshop-admin-app--hb .dd-menu.open {
display:block
}

body.imgshop-site--dark .dd-opt,
body.imgshop-admin-app--hb .dd-opt {
display:block;width:100%;text-align:left;background:none;border:none;padding:8px 14px;font-size:11.7px;color:var(--t);cursor:pointer;font-family:inherit
}

body.imgshop-site--dark .dd-opt:hover,
body.imgshop-admin-app--hb .dd-opt:hover {
background:var(--s2)
}

/* SORT */

body.imgshop-site--dark .sort-links,
body.imgshop-admin-app--hb .sort-links {
display:flex;align-items:center;font-size:11.7px
}

body.imgshop-site--dark .sort-sep,
body.imgshop-admin-app--hb .sort-sep {
color:var(--b2);margin:0 7px
}

body.imgshop-site--dark .sort-btn,
body.imgshop-admin-app--hb .sort-btn {
background:none;border:none;cursor:pointer;font-size:11.7px;color:var(--m);font-family:inherit
}

body.imgshop-site--dark .sort-btn.on,
body.imgshop-admin-app--hb .sort-btn.on {
color:var(--p);font-weight:700;text-decoration:underline
}

/* PAGINATION */

body.imgshop-site--dark .pag,
body.imgshop-admin-app--hb .pag {
display:flex;align-items:center;gap:6px
}

body.imgshop-site--dark .pag-btn,
body.imgshop-admin-app--hb .pag-btn {
background:var(--s);border:1px solid var(--b);border-radius:6px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--t);font-size:13px;font-family:inherit
}

body.imgshop-site--dark .pag-info,
body.imgshop-admin-app--hb .pag-info {
font-size:11.7px;color:var(--m);min-width:46px;text-align:center
}

/* CONTENT NOTICE */

body.imgshop-site--dark .content-notice,
body.imgshop-admin-app--hb .content-notice {
background:var(--s2);border:1px solid var(--b);border-radius:10px;padding:14px 16px
}

body.imgshop-site--dark .cn-title,
body.imgshop-admin-app--hb .cn-title {
font-size:11.7px;font-weight:600;margin-bottom:8px
}

body.imgshop-site--dark .cn-list,
body.imgshop-admin-app--hb .cn-list {
padding-left:16px;display:flex;flex-direction:column;gap:5px
}

body.imgshop-site--dark .cn-list li,
body.imgshop-admin-app--hb .cn-list li {
font-size:10.5px;color:var(--m);line-height:1.6
}

/* SEL CARD */

body.imgshop-site--dark .sel-card,
body.imgshop-admin-app--hb .sel-card {
background:var(--s);border:1px solid var(--b);border-radius:10px;overflow:hidden;transition:border-color .15s
}

body.imgshop-site--dark .sel-card.on,
body.imgshop-admin-app--hb .sel-card.on {
border-color:var(--p)
}

body.imgshop-site--dark .sel-img,
body.imgshop-admin-app--hb .sel-img {
height:100px;background:var(--s2);display:flex;align-items:center;justify-content:center;font-size:22px
}

body.imgshop-site--dark .sel-body,
body.imgshop-admin-app--hb .sel-body {
padding:8px 10px
}

body.imgshop-site--dark .sel-name,
body.imgshop-admin-app--hb .sel-name {
font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px
}

body.imgshop-site--dark .sel-id,
body.imgshop-admin-app--hb .sel-id {
font-size:10.5px;color:var(--m);margin-bottom:5px
}

body.imgshop-site--dark .sel-footer,
body.imgshop-admin-app--hb .sel-footer {
display:flex;justify-content:space-between;align-items:center
}

/* PAGE HEADER */

body.imgshop-site--dark .pg-eye,
body.imgshop-admin-app--hb .pg-eye {
font-size:10.5px;color:var(--m);font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px
}

body.imgshop-site--dark .pg-title,
body.imgshop-admin-app--hb .pg-title {
font-size:22px;font-weight:900
}

body.imgshop-site--dark .pg-desc,
body.imgshop-admin-app--hb .pg-desc {
font-size:11.7px;color:var(--m);margin-top:5px
}

/* HELPERS */

body.imgshop-site--dark .row,
body.imgshop-admin-app--hb .row {
display:flex;flex-wrap:wrap;gap:8px;align-items:center
}

body.imgshop-site--dark .col,
body.imgshop-admin-app--hb .col {
display:flex;flex-direction:column;gap:8px
}

body.imgshop-site--dark .g2,
body.imgshop-admin-app--hb .g2 {
display:grid;grid-template-columns:1fr 1fr;gap:10px
}

body.imgshop-site--dark .g3,
body.imgshop-admin-app--hb .g3 {
display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px
}

body.imgshop-site--dark .g4,
body.imgshop-admin-app--hb .g4 {
display:grid;grid-template-columns:repeat(4,1fr);gap:8px
}

body.imgshop-site--dark .g5,
body.imgshop-admin-app--hb .g5 {
display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px
}

body.imgshop-site--dark hr.div,
body.imgshop-admin-app--hb hr.div {
border:none;border-top:1px solid var(--b);margin:0
}