@import url("./showroom/configuration-admin.css");
@import url("./showroom/auto-admin.css");
/* 쇼룸 관리 — 이 화면 고유 배치만 둔다. 버튼·배지·고르기·사진 칸·옆 창·알림·빈 화면 모양은
   관리자 표준 부품(admin-ui.css)이 맡는다. 색은 --mg-* 이름만, 글자는 12px 이상. */
.sg-admin .sg-section{display:grid;gap:var(--mg-space-16);align-content:start;min-width:0}
.sg-admin [data-message]:empty,.sg-admin [data-state]:empty{display:none}
.sg-library-controls{display:grid;gap:var(--mg-space-12);min-width:0}
.sg-filter-row{display:flex;align-items:flex-end;flex-wrap:wrap;gap:var(--mg-space-12)}
.sg-filter-row .ui-field{flex:0 1 240px}
.sg-more{display:flex;justify-content:center}
.sg-more:has(>[hidden]){display:none}

/* 사진 칸: 문 사진은 세로가 길어 3:4, 크기 고르기(작게·크게)는 칸 최소 폭만 바꾼다 */
.sg-gallery .ui-tile-media{aspect-ratio:3/4}
.ui-grid.sg-density-small{--ui-tile-min:150px}
.ui-grid.sg-density-medium{--ui-tile-min:230px}
.sg-gallery[aria-busy="true"]{opacity:.6}
@media(max-width:800px){.ui-grid.sg-density-small{--ui-tile-min:100px}.ui-grid.sg-density-medium{--ui-tile-min:150px}}

/* 분류 고르기(taxonomy.mjs가 그리는 select 묶음)를 표준 입력칸 모양에 맞춘다 */
.sg-tax{display:grid;gap:var(--mg-space-12);min-width:0}
.sg-tax .tax-product-row,.sg-tax .tax-chain{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--mg-space-8);min-width:0}
.sg-tax .tax-field{display:grid;gap:var(--mg-space-6);flex:1 1 160px;min-width:0}
.sg-tax .tax-field>span{font-size:var(--mg-fs-xs);font-weight:var(--mg-weight-semibold);color:var(--mg-black-4)}
.sg-tax select{font:inherit;font-size:var(--mg-fs-sm);width:100%;min-width:0;min-height:40px;padding:var(--mg-space-8) var(--mg-space-10);border:1px solid var(--mg-paper-3);border-radius:var(--mg-radius-md);background:var(--mg-white);color:var(--mg-black)}
.sg-tax select:disabled{background:var(--mg-ink);color:var(--mg-gray)}
.sg-tax select:focus-visible{outline:2px solid var(--mg-focus-ring);outline-offset:1px}
.sg-tax .tax-branch{display:grid;gap:var(--mg-space-6);min-width:0}
.sg-tax .tax-branch-name{font-size:var(--mg-fs-sm);font-weight:var(--mg-weight-bold);color:var(--mg-black)}
.sg-tax .tax-arrow{color:var(--mg-gray);font-size:var(--mg-fs-sm);padding-bottom:var(--mg-space-10)}
.sg-tax .tax-hint,.sg-tax .tax-branch small{margin:0;font-size:var(--mg-fs-xs);color:var(--mg-gray)}

/* 사진 상세(옆 창 안) */
.sg-detail{display:grid;gap:var(--mg-space-12);padding-top:var(--mg-space-16);min-width:0}
.sg-stage{margin:0;display:grid;justify-items:center;gap:var(--mg-space-8);padding:var(--mg-space-8);border-radius:var(--mg-radius-lg);background:var(--mg-ink);max-height:62vh;overflow:auto}
.sg-stage:empty{display:none}
.sg-stage img{display:block;max-width:100%;max-height:52vh;object-fit:contain;border-radius:var(--mg-radius-md)}
.sg-stage.zoomed{justify-items:start;max-height:70vh}
.sg-stage.zoomed img{max-width:none;max-height:none}
.sg-fields{display:grid;gap:var(--mg-space-12);margin:0;padding:0;border:0;min-width:0}
.sg-detail .ui-section{gap:var(--mg-space-12)}
.sg-detail>.ui-fold{margin-top:var(--mg-space-12)}
.sg-buttons{display:flex;flex-wrap:wrap;gap:var(--mg-space-8)}
.sg-source{display:grid;gap:var(--mg-space-12);min-width:0}
.sg-source:empty{display:none}
.sg-detail-message{margin:0;flex-basis:100%;font-size:var(--mg-fs-xs);line-height:var(--mg-leading-snug);color:var(--mg-gray)}
.sg-detail-message:empty{display:none}
.sg-detail-message.sg-error{color:var(--mg-red)}
@media(max-width:800px){.ui-drawer-actions .sg-detail-message{flex:1 1 100%}}

/* 명칭 일괄 매칭 */
.sg-matches{display:grid;gap:var(--mg-space-8);align-content:start}
.sg-matches .ui-fold-body>div{display:grid;gap:var(--mg-space-12);min-width:0}
.ui-grid.sg-match-photos{--ui-tile-min:88px;gap:var(--mg-space-8)}
.sg-match-photos .ui-tile-media{aspect-ratio:1}