/* =============================================================
   광고상품DB — 맥 고밀도형 (사용자 2026-11-03 "1")
   범위: #ad_products-content 안쪽만(머리 · 도구 줄 · 분류 묶음). 화면에서만.
   그림자 큰 상자 · 대분류마다 진한 색 테두리와 색 바탕 · 10px 글자 108곳 · 굵은 글씨 41곳 · 색 단추 4개 →
   흰 묶음 + 대분류 색 점, 상품 줄 24px, 11px 이상, 채운 파랑은 '광고상품 추가' 하나.
   실행 · 대행 표시 색(뜻이 있는 색)과 대분류 구분 색(점으로)은 남김. 누르면 하는 일 · 권한은 그대로.
   휴대폰만: 소분류를 접어 두고 누르면 펼침(app-table.js _adToggleSub · adp-searching, 사용자 승인 기능 변경).
   ============================================================= */
@media screen{
html #ad_products-content{ background:var(--ui-bg) !important }
html #ad_products-content > .container > .bg-white{ padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important }
html #ad_products-content #ad_products-list{ padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important }

/* ---------- 머리 · 도구 줄 ---------- */
html #ad_products-content > .container > .bg-white > .flex:first-child{ min-height:54px; margin:0 0 8px !important; padding:0 !important; gap:8px !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important }
html #ad_products-content > .container > .bg-white > .flex:first-child h2{ color:var(--ui-text-1) !important; font-size:var(--ui-text-title2) !important; font-weight:var(--ui-weight-semibold) !important; line-height:1.3 }
html #ad_products-content > .container > .bg-white > .flex:first-child h2 > i{ display:none !important }
html #ad_products-content > .container > .bg-white > .flex:first-child > .flex{ gap:6px !important }
html #ad_products-content #adp-search{ height:28px; width:200px !important; padding:0 10px 0 28px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background:var(--ui-fill) !important; box-shadow:none !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-body) !important }
html #ad_products-content #adp-search::placeholder{ color:var(--ui-text-3) }
html #ad_products-content #adp-search:focus{ outline:0; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-field), var(--ui-focus-ring) !important }
html #ad_products-content #adp-search + i, html #ad_products-content .relative > i.fa-search{ left:10px !important; color:var(--ui-text-3) !important; font-size:var(--ui-text-caption) !important }
html #ad_products-content :is(#adp-manage-cat-btn,#adp-cat-perm-btn,#adp-edit-perm-btn,#adp-add-btn){ height:28px; display:inline-flex; align-items:center; padding:0 12px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; font-size:var(--ui-text-body) !important; transform:none !important }
html #ad_products-content :is(#adp-manage-cat-btn,#adp-cat-perm-btn,#adp-edit-perm-btn).hidden, html #ad_products-content #adp-add-btn.hidden{ display:none !important }
html #ad_products-content :is(#adp-manage-cat-btn,#adp-cat-perm-btn,#adp-edit-perm-btn){ background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-text-1) !important; font-weight:var(--ui-weight-regular) !important }
html #ad_products-content :is(#adp-manage-cat-btn,#adp-cat-perm-btn,#adp-edit-perm-btn):hover{ background:var(--ui-fill-subtle) !important }
html #ad_products-content :is(#adp-manage-cat-btn,#adp-cat-perm-btn,#adp-edit-perm-btn) > i{ margin-right:5px !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-caption) }
html #ad_products-content #adp-add-btn{ background:var(--ui-accent) !important; box-shadow:none !important; color:var(--ui-on-accent) !important; font-weight:var(--ui-weight-semibold) !important }
html #ad_products-content #adp-add-btn:hover{ background:var(--ui-accent-hover) !important }
html #ad_products-content #adp-add-btn > i{ margin-right:5px !important; font-size:var(--ui-text-caption) }

/* ---------- 요약 줄: 대분류 색 글자 → 색 점 + 보통 글자 ---------- */
html #ad_products-content .adp-sum{ gap:14px !important; margin-bottom:10px !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important }
html #ad_products-content .adp-sum b{ color:var(--ui-text-1) !important; font-weight:var(--ui-weight-semibold) !important; font-variant-numeric:tabular-nums }
html #ad_products-content .adp-sum > span > i{ display:none !important }
html #ad_products-content .adp-sum-major{ display:inline-flex; align-items:center; gap:5px; color:var(--ui-text-2) !important }
html #ad_products-content .adp-sum-major::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--adp-c) }
html #ad_products-content .adp-sum > span.text-blue-600{ color:var(--ui-accent-text) !important; font-weight:var(--ui-weight-regular) !important }

/* ---------- 대분류 묶음 ---------- */
html #ad_products-content .adp-major{ margin-bottom:12px !important; border:0 !important; border-radius:var(--ui-radius-group) !important; background:var(--ui-surface) !important; box-shadow:0 0 0 .5px var(--ui-line) !important }
html #ad_products-content .adp-major-head{ min-height:36px; padding:0 8px 0 12px !important; border-bottom:0 !important; background:var(--ui-surface-alt) !important; box-shadow:inset 0 -.5px var(--ui-line) }
html #ad_products-content .adp-major-head > .flex:first-child{ gap:8px !important }
html #ad_products-content .adp-major-head > .flex:first-child > i{ width:8px; height:8px; border-radius:50%; background:var(--adp-c); font-size:0 !important }
html #ad_products-content .adp-major-head > .flex:first-child > span.font-bold{ color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important; font-weight:var(--ui-weight-semibold) !important }
html #ad_products-content .adp-major-head > .flex:first-child > span.rounded-full{ padding:0 !important; background:transparent !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important }
html #ad_products-content .adp-major-head button{ height:24px; padding:0 8px !important; border-radius:var(--ui-radius-row) !important; color:var(--ui-accent-text) !important; font-size:var(--ui-text-footnote) !important }
html #ad_products-content .adp-major-head button.text-gray-400{ color:var(--ui-text-2) !important }
html #ad_products-content .adp-major-head button:hover{ background:var(--ui-fill) !important }

/* ---------- 소분류 칸 · 상품 줄 ---------- */
html #ad_products-content .adp-sub-grid{ gap:0 !important; padding:0 !important; min-height:0 !important; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)) !important }
html #ad_products-content .adp-sub{ padding:8px 8px 6px !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:inset -.5px -.5px var(--ui-line) }
html #ad_products-content .adp-sub-head{ min-height:24px; margin-bottom:2px !important; padding:0 4px }
html #ad_products-content .adp-sub-head > span{ color:var(--ui-text-1) !important; font-size:var(--ui-text-body) !important; font-weight:var(--ui-weight-semibold) !important }
html #ad_products-content .adp-sub-head > span > span{ color:var(--ui-text-3) !important; font-weight:var(--ui-weight-regular) !important }
html #ad_products-content .adp-sub-head button{ width:22px; height:22px; padding:0 !important; border-radius:var(--ui-radius-row) !important; color:var(--ui-text-3) !important; font-size:var(--ui-text-caption) !important }
html #ad_products-content .adp-sub-head button:hover{ background:var(--ui-fill) !important; color:var(--ui-text-1) !important }
html #ad_products-content .adp-sub-head button[onclick^="_adTmDeleteSub"]:hover{ color:var(--ui-danger) !important }
html #ad_products-content .adp-row{ min-height:24px; gap:6px !important; padding:0 4px !important; border-radius:var(--ui-radius-row) !important; font-size:var(--ui-text-body) !important }
html #ad_products-content .adp-row:hover{ background:var(--ui-fill-subtle) !important }
html #ad_products-content .adp-row > span.text-gray-700{ color:var(--ui-text-1) !important }
html #ad_products-content .adp-row > button{ font-size:var(--ui-text-caption) !important; color:var(--ui-text-3) !important }
html #ad_products-content .adp-tag{ flex:0 0 auto; padding:0 5px !important; border-radius:var(--ui-radius-row) !important; font-size:var(--ui-text-caption) !important; line-height:16px; font-weight:var(--ui-weight-semibold) }
html #ad_products-content .adp-tag.is-run{ background:var(--ui-fill) !important; color:var(--ui-success) !important }
html #ad_products-content .adp-tag.is-agency{ background:var(--ui-accent-tint) !important; color:var(--ui-accent-text) !important }
html #ad_products-content .adp-empty{ padding:4px !important; color:var(--ui-text-3) !important; font-size:var(--ui-text-footnote) !important; text-align:left !important }
html #ad_products-content .adp-empty > i{ display:none }
html #ad_products-content .adp-add-row{ height:24px; margin-top:2px !important; padding:0 4px !important; border-radius:var(--ui-radius-row) !important; background:transparent !important; color:var(--ui-text-3) !important; font-size:var(--ui-text-footnote) !important; text-align:left !important }
html #ad_products-content .adp-add-row:hover{ background:var(--ui-fill-subtle) !important; color:var(--ui-accent-text) !important }
html #ad_products-content .adp-add-row > i{ margin-right:4px !important; font-size:var(--ui-text-caption) }
html #ad_products-content .adp-add-major{ height:32px; padding:0 !important; border:0 !important; border-radius:var(--ui-radius-group) !important; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-accent-text) !important; font-size:var(--ui-text-body) !important }
html #ad_products-content .adp-add-major:hover{ background:var(--ui-fill-subtle) !important }
}

/* ---------- 휴대폰 ---------- */
@media screen and (max-width:768px){
html #ad_products-content > .container > .bg-white > .flex:first-child > .flex{ width:100% }
html #ad_products-content > .container > .bg-white > .flex:first-child .relative{ flex:1 1 100% }
html #ad_products-content #adp-search{ width:100% !important; height:36px }
html #ad_products-content :is(#adp-manage-cat-btn,#adp-cat-perm-btn,#adp-edit-perm-btn,#adp-add-btn){ height:36px }
html #ad_products-content .adp-sub-grid{ grid-template-columns:1fr !important }
html #ad_products-content .adp-sub{ box-shadow:inset 0 -.5px var(--ui-line) }
html #ad_products-content .adp-row{ min-height:36px; font-size:var(--ui-text-body) !important } /* 상품 80여 개라 44px 이면 세로가 너무 길어짐 → 36px */
html #ad_products-content .adp-add-row{ height:36px; font-size:var(--ui-text-body) !important }
html #ad_products-content .adp-sub-head button{ width:32px; height:32px }
html #ad_products-content .adp-major-head button{ height:32px }
/* 소분류 접기(사용자 2026-11-03 "1"): 처음엔 '소분류 이름 (개수) ›' 한 줄, 누르면 그 소분류 상품만 펼침. 검색 중엔 모두 펼침 */
html #ad_products-content .adp-sub{ padding:0 8px !important }
html #ad_products-content .adp-sub-head{ min-height:44px; margin:0 !important; cursor:pointer; -webkit-tap-highlight-color:transparent }
html #ad_products-content .adp-sub-head > span:first-child{ flex:1 1 auto; display:flex; align-items:center; gap:6px; font-size:var(--ui-text-callout) !important }
html #ad_products-content .adp-sub-head > span:first-child::after{ content:""; width:7px; height:7px; margin-left:auto; margin-right:6px; border-right:1.5px solid var(--ui-text-3); border-bottom:1.5px solid var(--ui-text-3); transform:rotate(-45deg); transition:transform var(--ui-dur-fast) var(--ui-ease) }
html #ad_products-content .adp-sub.is-open > .adp-sub-head > span:first-child::after, html #ad_products-content .adp-searching .adp-sub-head > span:first-child::after{ transform:rotate(45deg) }
html #ad_products-content .adp-sub:not(.is-open) > :is(.adp-row,.adp-add-row,.adp-empty){ display:none !important }
html #ad_products-content .adp-searching .adp-sub > :is(.adp-row,.adp-add-row,.adp-empty){ display:flex !important }
html #ad_products-content .adp-sub.is-open, html #ad_products-content .adp-searching .adp-sub{ padding-bottom:6px !important }
}