/**
 * DXCMS — boards/skins/gallery/style.css
 * gallery 스킨 전용 스타일시트
 * (모든 테마에서 gallery 스킨 사용 시 공통 적용)
 */

/* ─── 갤러리 목록 (list.php) ───────────────────────────────── */
/* ── 게시판 목록 v1.0.3 ─────────────────────────────────── */
.dx-list-wrap {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 16px;
  /* overflow:hidden 제거 - 카드 모서리 잘림 방지 */
}
/* .dx-list-head — 2줄 구조로 교체됨 (하단 참고) */
.dx-list-head-left {
  display: flex;
  align-items: center;
  gap: 12px;
} /* 하위호환 유지 */
.dx-list-title {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text-main);
  margin: 0;
}
.dx-sort-btn-wrap {
  display: flex;
  background: var(--bg-body);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 3px;
  gap: 2px;
}
.dx-sort-btn {
  padding: 5px 12px;
  border-radius: 6px;
  border: none;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: all .15s;
  background: transparent;
  color: var(--text-muted);
}
.dx-sort-btn.active {
  background: var(--bg-card);
  color: var(--p);
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
}

.dx-thead  { display: none !important; }
.dx-row-pc { display: none !important; }
.dx-row-mo { display: none !important; }

@media (min-width: 768px) {
  /* 갤러리: 테이블 행 미디어쿼리 무효화 */
  .dx-row-mo { display: none !important; }
}

.dx-ava {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
  color: #fff;
  flex-shrink: 0;
}
.dx-hot {
  font-size: 9px;
  font-weight: 900;
  color: #f97316;
  background: rgba(249,115,22,.1);
  padding: 2px 6px;
  border-radius: 4px;
  font-style: italic;
  flex-shrink: 0;
  letter-spacing: .02em;
}

/* 관리자 툴바 */
.dx-adm-bar {
  padding: 9px 16px;
  background: #fffbeb;
  border-bottom: 1px solid #fde68a;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
body.dark .dx-adm-bar {
  background: #1c1a0a;
  border-color: #78350f;
}
.dx-hl {
  background: #fef08a;
  color: #78350f;
  border-radius: 2px;
  padding: 0 1px;
  font-weight: 800;
}
body.dark .dx-hl {
  background: #713f12;
  color: #fef08a;
}

/* ── 갤러리 카드형 v5.5.9 ── */
.gl55-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  padding: 20px 30px;
  /* border/bg는 dx-list-wrap에서 처리 */
}
.gl55-card-wrap { position: relative; }
.gl55-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  transition: box-shadow .2s, transform .15s;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  color: inherit;
  height: 100%;
}
body.dark .gl55-card { box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.gl55-card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,.13);
  transform: translateY(-3px);
  text-decoration: none;
}

/* 썸네일 */
.gl55-thumb-wrap {
  width: 100%;
  aspect-ratio: 3/2;
  overflow: hidden;
  background: #f1f5f9;
  flex-shrink: 0;
  position: relative;
}
body.dark .gl55-thumb-wrap { background: var(--bg-body); }
.gl55-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s;
}
.gl55-card:hover .gl55-thumb { transform: scale(1.05); }
.gl55-empty-img {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  color: #cbd5e1;
}

/* 썸네일 위 오버레이 뱃지 */
.gl55-thumb-cat {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 1;
  padding: 3px 10px;
  border-radius: 99px;
  background: rgba(255,255,255,.92);
  color: var(--p);
  font-size: .7rem;
  font-weight: 700;
  backdrop-filter: blur(4px);
  border: 1px solid rgba(26,115,232,.15);
}
body.dark .gl55-thumb-cat {
  background: rgba(15,23,42,.85);
  color: #7dd3fc;
}
.gl55-thumb-cmt {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: 99px;
  background: rgba(255,255,255,.92);
  color: #64748b;
  font-size: .7rem;
  font-weight: 700;
  backdrop-filter: blur(4px);
}
body.dark .gl55-thumb-cmt {
  background: rgba(15,23,42,.85);
  color: #94a3b8;
}

/* 카드 본문 */
.gl55-body {
  padding: 13px 14px 14px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.gl55-title {
  font-size: .92rem;
  font-weight: 800;
  color: var(--text-main);
  margin: 0 0 6px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.45;
  overflow-wrap: break-word;
  word-break: break-word;
}
.gl55-excerpt {
  font-size: .78rem;
  color: var(--text-muted);
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0 0 10px;
  flex: 1;
  overflow-wrap: break-word;
  word-break: break-word;
}

/* 태그 */
.gl55-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 10px; }
.gl55-tag {
  display: inline-block;
  padding: 2px 8px;
  background: var(--bg-body);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: .68rem;
  font-weight: 600;
  color: var(--text-muted);
}

/* 하단 메타 */
.gl55-foot {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 9px;
  border-top: 1px solid var(--border);
  font-size: .72rem;
  color: var(--text-muted);
  gap: 4px;
}
.gl55-foot-author {
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 600;
  color: var(--text-muted);
  width: 100%;
  min-width: 0;
}
.gl55-foot-stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 4px;
}
.gl55-foot-stats-right {
  display: flex;
  align-items: center;
  gap: 8px;
}
.gl55-ava {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--p);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 800;
  flex-shrink: 0;
}

/* 공지 */
.gl55-notice-badge {
  display: inline-block;
  padding: 2px 8px;
  background: #ef4444;
  color: #fff;
  border-radius: 99px;
  font-size: .66rem;
  font-weight: 700;
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
}

/* 관리자 체크박스 */
.gl55-admin-check {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 3;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 7px;
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
}
.gl55-admin-check input[type="checkbox"] {
  width: 15px;
  height: 15px;
  margin: 0;
}
body.dark .gl55-admin-check { background: var(--bg-card); }

.gl55-new {
  display: inline-block;
  padding: 1px 5px;
  background: var(--p);
  color: #fff;
  border-radius: 3px;
  font-size: .6rem;
  font-weight: 700;
  vertical-align: middle;
  margin-left: 3px;
}

/* 테이블 행 완전 숨김 */
.dx-thead,
.dx-row-pc,
.dx-row-mob,
.dx-row-mo { display: none !important; }

@media (max-width: 1200px) { .gl55-grid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 768px)  { .gl55-grid { grid-template-columns: repeat(2, 1fr) !important; padding: 14px; } }
@media (max-width: 480px)  { .gl55-grid { grid-template-columns: 1fr !important; } }

.dx-global-notice-wrap {
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 0px;
  overflow: hidden;
  background: var(--bg-card, #fff);
}
.dx-gn-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 16px;
  border-bottom: 1px solid var(--border, #e2e8f0);
  transition: background .12s;
}
.dx-gn-row:last-child  { border-bottom: none; }
.dx-gn-row:hover       { background: rgba(239,68,68,.04); }
.dx-gn-badge {
  flex-shrink: 0;
  display: inline-block;
  padding: 2px 7px;
  background: #ef4444;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  border-radius: 5px;
  letter-spacing: .02em;
  white-space: nowrap;
}
.dx-gn-title {
  flex: 1;
  min-width: 0;
  font-size: .875rem;
  font-weight: 700;
  color: var(--text-main, #1e293b);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dx-gn-link {
  text-decoration: none;
  transition: opacity .12s;
}
.dx-gn-link:hover { opacity: .75; }
body.dark .dx-global-notice-wrap {
  background: var(--bg-card);
  border-color: var(--border);
}
body.dark .dx-gn-row:hover { background: rgba(239,68,68,.08); }


/* ─── 갤러리 뷰 (view.php) ────────────────────────────────── */

/* 라이트박스 */
#gl5-lightbox {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.92);
  z-index: 9998;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
#gl5-lightbox.open { display: flex; }
#gl5-lb-img {
  max-width: 92vw;
  max-height: 85vh;
  border-radius: 10px;
  object-fit: contain;
}
#gl5-lb-close {
  position: absolute;
  top: 16px;
  right: 20px;
  color: #fff;
  font-size: 2rem;
  cursor: pointer;
  background: none;
  border: none;
  line-height: 1;
  opacity: .7;
}
#gl5-lb-close:hover { opacity: 1; }
#gl5-lb-name {
  color: rgba(255,255,255,.5);
  font-size: .8rem;
  margin-top: 10px;
  max-width: 80vw;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#gl5-lb-nav-l,
#gl5-lb-nav-r {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,.12);
  border: none;
  color: #fff;
  font-size: 1.4rem;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
#gl5-lb-nav-l { left: 16px; }
#gl5-lb-nav-r { right: 16px; }
#gl5-lb-nav-l:hover,
#gl5-lb-nav-r:hover { background: rgba(255,255,255,.25); }

/* ── 이미지 라이트박스 (본문 내 이미지) ── */
/* ── 본문 테이블 반응형 스크롤 ── */
@media (max-width: 768px) {
  .dx-post-body table,
  .dx-post-content table,
  .post-content table,
  .ck-content table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    max-width: 100%;
  }
  .dx-post-body figure.table,
  .dx-post-content figure.table,
  .post-content figure.table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }
}
.dx-post-body img,
.dx-post-body figure img,
.dx-post-body figure.image img { cursor: zoom-in !important; }
/* CKEditor가 이미지에 a 태그 씌운 경우 */
.dx-post-body a > img {
  cursor: zoom-in !important;
  pointer-events: auto !important;
}

#dx-lb-ov {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,.95);
  z-index: 999999;
}
#dx-lb-ov.on { display: block; }
#dx-lb-track {
  position: absolute;
  top: 0; left: 0; bottom: 0;
  display: flex;
  align-items: center;
  transition: transform .28s cubic-bezier(.4,0,.2,1);
  will-change: transform;
}
.dx-lb-slide {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 56px 12px 72px;
  box-sizing: border-box;
}
.dx-lb-slide img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 6px;
  display: block;
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
  pointer-events: auto;
  transform-origin: center center;
}

/* 줌바 */
#dx-lb-zoom-bar {
  position: fixed;
  bottom: 18px;
  right: 18px;
  display: flex;
  align-items: center;
  gap: 4px;
  background: rgba(0,0,0,.55);
  border-radius: 99px;
  padding: 5px 10px;
  z-index: 20;
}
#dx-lb-zoom-bar button {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.25);
  color: #fff;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s;
  font-family: sans-serif;
}
#dx-lb-zoom-bar button:hover { background: rgba(255,255,255,.35); }
#dx-lb-zoom-pct {
  font-size: .75rem;
  font-weight: 600;
  color: rgba(255,255,255,.85);
  min-width: 38px;
  text-align: center;
  white-space: nowrap;
}
@media (max-width: 640px) {
  #dx-lb-zoom-bar {
    bottom: 70px;
    right: 10px;
    padding: 4px 8px;
  }
  #dx-lb-zoom-bar button {
    width: 26px;
    height: 26px;
    font-size: .9rem;
  }
}

#dx-lb-close {
  position: fixed;
  top: 12px;
  right: 14px;
  z-index: 10;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255,255,255,.18);
  border: 1.5px solid rgba(255,255,255,.3);
  color: #fff;
  font-size: 1.1rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: sans-serif;
}
.dx-lb-arr {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,.15);
  border: 1.5px solid rgba(255,255,255,.22);
  color: #fff;
  font-size: 1.3rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
#dx-lb-prev { left: 12px; }
#dx-lb-next { right: 12px; }
#dx-lb-counter {
  position: fixed;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255,255,255,.85);
  font-size: .8rem;
  font-weight: 600;
  background: rgba(0,0,0,.55);
  padding: 5px 16px;
  border-radius: 99px;
  pointer-events: none;
  white-space: nowrap;
}
#dx-lb-dots {
  position: fixed;
  bottom: 48px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 6px;
  align-items: center;
  pointer-events: none;
}
.dx-lb-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.3);
  transition: all .2s;
}
.dx-lb-dot.on {
  background: #fff;
  width: 16px;
  border-radius: 3px;
}
@media (max-width: 640px) { .dx-lb-arr { display: none !important; } }

.dx-mob-cat-wrap { display: none; margin-bottom: 10px; }
@media (max-width: 1023px) { .dx-mob-cat-wrap { display: block; } }
.dx-mob-cat-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 7px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  font-size: .78rem;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  transition: all .15s;
}
.dx-mob-cat-toggle:hover {
  border-color: var(--p);
  color: var(--p);
}
.dx-mob-cat-toggle-arrow {
  margin-left: auto;
  font-size: .65rem;
  transition: transform .22s;
}
.dx-mob-cat-toggle.open .dx-mob-cat-toggle-arrow { transform: rotate(180deg); }
.dx-mob-cat-slider { display: none; overflow: hidden; padding: 8px 0 4px; }
.dx-mob-cat-slider.open { display: block; }
.dx-mob-cat-inner {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 2px 0 8px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.dx-mob-cat-inner::-webkit-scrollbar { display: none; }
.dx-mob-cat-pill {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  flex-shrink: 0;
  padding: 6px 14px;
  border-radius: 99px;
  font-size: .78rem;
  font-weight: 600;
  border: 1.5px solid var(--border);
  background: var(--bg-card);
  color: var(--text-muted);
  text-decoration: none;
  transition: all .15s;
}
.dx-mob-cat-pill:hover {
  border-color: var(--p);
  color: var(--p);
}
.dx-mob-cat-pill.active {
  background: var(--p);
  color: #fff;
  border-color: var(--p);
  font-weight: 700;
}

/* ── 액션 버튼 모바일 반응형 ── */
.dx-btn-txt { white-space: nowrap; }
@media (max-width: 480px) {
  .dx-action-btn {
    padding: 7px 10px !important;
    font-size: .72rem !important;
    gap: 4px !important;
  }
  .dx-btn-txt { display: none; }
}

@keyframes dxDelIn {
  from { opacity: 0; transform: scale(.94) translateY(8px); }
  to   { opacity: 1; transform: scale(1)   translateY(0);   }
}


/* ─── 갤러리 쓰기 (write.php) ──────────────────────────────── */
/* ── write.php 모바일 최적화 ─────────────────────────── */

/* 링크 행: PC=가로, 모바일=URL 전체너비 + 이름/X 한 줄 */
.dx-link-row  { display: flex; gap: 6px; align-items: center; }
.dx-link-label { width: 128px; flex-shrink: 0; }

@media (max-width: 540px) {
  .dx-link-row { flex-wrap: wrap; }
  .dx-link-row input[type="url"] {
    width: 100% !important;
    flex: none !important;
    min-width: 0;
  }
  .dx-link-label {
    flex: 1 !important;
    width: auto !important;
    min-width: 0;
  }
  input[name="tags"]::placeholder { font-size: .78rem; }
}

/* 파일 첨부 영역: 금지 확장자 텍스트 줄바꿈 허용 */
#dx-file-zone p { word-break: break-all; white-space: normal; }

@media (max-width: 480px) {
  #dx-write-form .flex.items-center.justify-end.gap-3.flex-wrap { justify-content: stretch; }
  #dx-write-form .flex.items-center.justify-end.gap-3.flex-wrap > * {
    flex: 1;
    text-align: center;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .dx-sq-row > div[style*="grid-template-columns:1fr auto"] {
    grid-template-columns: 1fr !important;
  }
}


/* ─── 갤러리 행 (_list_rows.php) ──────────────────────────── */
/* ── 갤러리 _list_rows 카드 그리드 v1.0.0 ── */
.dx-gl-lt-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  padding: 16px 20px;
}
.dx-gl-lt-card-wrap { position: relative; }
.dx-gl-lt-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  transition: box-shadow .2s, transform .15s;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  color: inherit;
  height: 100%;
}
body.dark .dx-gl-lt-card { box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.dx-gl-lt-card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,.13);
  transform: translateY(-3px);
  text-decoration: none;
}
.dx-gl-lt-card.dx-gl-lt-cur {
  border-color: var(--p);
  box-shadow: 0 0 0 2px rgba(26,115,232,.2);
  cursor: default;
  pointer-events: none;
}

/* 썸네일 */
.dx-gl-lt-thumb-wrap {
  width: 100%;
  aspect-ratio: 3/2;
  overflow: hidden;
  background: #f1f5f9;
  flex-shrink: 0;
  position: relative;
}
body.dark .dx-gl-lt-thumb-wrap { background: var(--bg-body); }
.dx-gl-lt-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s;
}
.dx-gl-lt-card:hover .dx-gl-lt-thumb { transform: scale(1.05); }
.dx-gl-lt-empty-img {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.2rem;
  color: #cbd5e1;
}

/* 오버레이 뱃지 */
.dx-gl-lt-cat {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 1;
  padding: 3px 10px;
  border-radius: 99px;
  background: rgba(255,255,255,.92);
  color: var(--p);
  font-size: .7rem;
  font-weight: 700;
  backdrop-filter: blur(4px);
  border: 1px solid rgba(26,115,232,.15);
}
body.dark .dx-gl-lt-cat {
  background: rgba(15,23,42,.85);
  color: #7dd3fc;
}
.dx-gl-lt-cmt-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: 99px;
  background: rgba(255,255,255,.92);
  color: #64748b;
  font-size: .7rem;
  font-weight: 700;
  backdrop-filter: blur(4px);
}
body.dark .dx-gl-lt-cmt-badge {
  background: rgba(15,23,42,.85);
  color: #94a3b8;
}

/* 공지 뱃지 */
.dx-gl-lt-notice-badge {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
  padding: 2px 8px;
  background: #ef4444;
  color: #fff;
  border-radius: 99px;
  font-size: .66rem;
  font-weight: 700;
}

/* 카드 본문 */
.dx-gl-lt-body {
  padding: 11px 13px 13px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.dx-gl-lt-title {
  font-size: .9rem;
  font-weight: 800;
  color: var(--text-main);
  margin: 0 0 5px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.45;
  overflow-wrap: break-word;
  word-break: break-word;
}
.dx-gl-lt-cur .dx-gl-lt-title { color: var(--p); }
.dx-gl-lt-excerpt {
  font-size: .76rem;
  color: var(--text-muted);
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0 0 8px;
  flex: 1;
  overflow-wrap: break-word;
  word-break: break-word;
}

/* 태그 */
.dx-gl-lt-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 8px; }
.dx-gl-lt-tag {
  display: inline-block;
  padding: 2px 7px;
  background: var(--bg-body);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: .66rem;
  font-weight: 600;
  color: var(--text-muted);
}

/* 하단 메타 */
.dx-gl-lt-foot {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 8px;
  border-top: 1px solid var(--border);
  font-size: .7rem;
  color: var(--text-muted);
  gap: 4px;
}
.dx-gl-lt-foot-author {
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 600;
  width: 100%;
  min-width: 0;
}
.dx-gl-lt-foot-stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 4px;
}
.dx-gl-lt-foot-stats-right {
  display: flex;
  align-items: center;
  gap: 7px;
}
.dx-gl-lt-ava {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--p);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 800;
  flex-shrink: 0;
}

/* 관리자 체크박스 */
.dx-gl-lt-adm-check {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  background: #fff;
  border-radius: 4px;
  padding: 1px;
  box-shadow: 0 1px 4px rgba(0,0,0,.2);
}
body.dark .dx-gl-lt-adm-check { background: var(--bg-card); }

/* NEW 뱃지 */
.dx-gl-lt-new {
  display: inline-block;
  padding: 1px 5px;
  background: var(--p);
  color: #fff;
  border-radius: 3px;
  font-size: .6rem;
  font-weight: 700;
  vertical-align: middle;
  margin-left: 3px;
}

/* 하이라이트 */
.dx-hl {
  background: #fef08a;
  color: #78350f;
  border-radius: 2px;
  padding: 0 1px;
  font-weight: 800;
}
body.dark .dx-hl {
  background: #713f12;
  color: #fef08a;
}

/* 반응형 */
@media (max-width: 1200px) { .dx-gl-lt-grid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 768px)  { .dx-gl-lt-grid { grid-template-columns: repeat(2, 1fr) !important; padding: 12px 14px; } }
@media (max-width: 480px)  { .dx-gl-lt-grid { grid-template-columns: 1fr !important; } }

/* ── 갤러리 아코디언 패널 ── */
.dx-acc-content {
  font-size: .92rem;
  line-height: 1.75;
  color: var(--text-main);
  word-break: break-word;
}
.dx-acc-content img {
  max-width: 100%;
  border-radius: 8px;
  margin: 6px 0;
}
.dx-acc-meta {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
  font-size: .78rem;
  color: var(--text-muted);
}
.dx-acc-meta-author {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  color: var(--text-main);
}
.dx-acc-actions {
  display: flex;
  gap: 8px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}
.dx-acc-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  border-radius: 8px;
  font-size: .8rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-main);
  transition: all .12s;
}
.dx-acc-btn:hover {
  border-color: var(--p);
  color: var(--p);
}
.dx-acc-btn-primary {
  background: var(--p);
  color: #fff;
  border-color: var(--p);
}
.dx-acc-btn-primary:hover {
  opacity: .88;
  color: #fff;
}
.dx-acc-spinner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 28px 0;
  color: var(--text-muted);
  font-size: .85rem;
}
.dx-acc-spinner-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--p);
  animation: dx-acc-bounce .8s ease-in-out infinite;
}
.dx-acc-spinner-dot:nth-child(2) { animation-delay: .15s; }
.dx-acc-spinner-dot:nth-child(3) { animation-delay: .3s; }
@keyframes dx-acc-bounce {
  0%, 80%, 100% { transform: scale(0.7); opacity: .5; }
  40%            { transform: scale(1);   opacity: 1; }
}


/* ── 공지 전용 인라인 테이블 (갤러리 상단) ── */
.dx-gl-notice-table { margin-bottom: 8px; }
/* PC: grid 행 표시 */
.dx-gl-notice-row-pc { display: grid !important; }
/* 모바일: 768px 미만에서 PC행 숨기고 모바일행 표시 */
@media (max-width: 767px) {
  .dx-gl-notice-row-pc { display: none !important; }
  .dx-gl-notice-row-mo { display: flex !important; }
}
/* 마지막 공지 행 border-bottom 제거 */
.dx-gl-notice-table > div:last-child { border-bottom: none !important; }

/* 검색 — 모든 화면 크기에서 모달로 표시 */
.dx-search-drop {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  width: calc(100vw - 40px) !important;
  max-width: 360px !important;
  z-index: 9999 !important;
}
#dx-search-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 9998;
}
#dx-search-overlay.dx-search-overlay-show { display: block; }


/* ── 게시판 헤더 구조 (v8.2.14) ──────────────────────────────────────── */
.dx-list-head { display: flex; flex-direction: column; gap: 0; padding: 0; }

/* 1행: 게시판명(좌) | 정렬+삼선(우) */
.dx-lh-row1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
  padding: 14px 30px 4px;
  gap: 10px;
}
.dx-lh-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

/* 2행: 총N개+전체선택(좌) | 검색+글쓰기(우) */
.dx-lh-row2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
  padding: 8px 30px 8px;
}
.dx-lh-left2  { display: flex; align-items: center; gap: 10px; }
.dx-lh-right2 { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.dx-lh-total   { font-size: .8rem; color: var(--text-muted); white-space: nowrap; }
.dx-lh-total b { color: var(--p); font-weight: 700; }
.dx-lh-checkall {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  font-size: .8rem;
  color: var(--text-muted);
  user-select: none;
}

/* 모바일 */
@media (max-width: 540px) {
  .dx-list-wrap {
	  padding:2px 5px;
	}
  .dx-lh-row1   { padding: 11px 14px 9px; }
  .dx-lh-row2   { padding: 7px 14px 9px; flex-wrap: wrap; gap: 8px; }
  .dx-lh-right2 { flex-wrap: nowrap; }
  #dx-list-title-mobile {font-size:15pt}
}