/* SJ에서 새로 추가한 안내 양식. 기존 g-* 안내 스타일은 guide.css를 사용한다. */
.g-content-text {
  margin-top: 14px;
  color: var(--ink-2);
  font-size: 14.5px;
  line-height: 1.65;
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
}
.g-content-text p { margin: 0; }
.g-content-text p + p { margin-top: 8px; }

.g-content-table {
  max-width: 100%;
  margin-top: 14px;
  overflow-x: auto;
}
.g-content-table .g-table { margin: 0; }
.guide-sect figure.table { max-width: 100%; overflow-x: auto; }
.g-content-table th,
.g-content-table td { overflow-wrap: anywhere; }

.g-faqs {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 14px;
}
.g-faq {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}
.g-faq > summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  color: var(--ink);
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: -0.01em;
  list-style: none;
  cursor: pointer;
  overflow-wrap: anywhere;
}
.g-faq > summary::-webkit-details-marker { display: none; }
.g-faq > summary::after {
  content: '+';
  flex: 0 0 auto;
  color: var(--brand);
  font-size: 18px;
  line-height: 1.3;
}
.g-faq[open] > summary::after { content: '−'; }
.g-faq > summary:focus-visible { outline: 2px solid var(--brand); outline-offset: -3px; }
.g-faq-answer {
  margin: 0;
  padding: 0 16px 16px;
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.65;
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
}

/* 공개 페이지에서는 로그인한 관리자에게 전용 편집 화면 링크만 표시한다. */
.g-admin-links {
  display: none;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 20px;
}
body.on-manage .g-admin-links { display: flex; }
.g-admin-links[hidden] { display: none !important; }
.g-admin-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg-2);
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
}
.g-admin-link:hover { border-color: var(--brand); color: var(--brand); }
.g-admin-link:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }

@media (max-width: 600px) {
  .g-admin-links { gap: 6px; }
  .g-admin-link { padding: 9px 10px; font-size: 12px; }
  .g-faq > summary { gap: 12px; padding: 14px; }
  .g-faq-answer { padding: 0 14px 14px; }
}

/* 관리자가 선택한 모양만 적용한다. 표시 속성을 제거하면 원래 클래스·인라인 스타일이 다시 보인다. */
table[data-guide-table-style] { width: 100%; border-collapse: collapse; }
table[data-guide-table-style] > :is(thead, tbody, tfoot) > tr > :is(th, td) { padding: 12px 14px !important; border: 1px solid var(--line, #dfe4ec) !important; background: #fff !important; color: var(--ink-1, var(--ink, #273248)) !important; }
table[data-guide-table-style="striped"] > tbody > tr:nth-child(even) > :is(th, td) { background: var(--bg-2, #f5f7fa) !important; }
table[data-guide-table-style="accent"] > thead > tr > :is(th, td) { background: var(--brand, #315de5) !important; color: #fff !important; }
table[data-guide-table-style="accent"]:not(:has(> thead)) > tbody:first-of-type > tr:first-child > th { background: var(--brand, #315de5) !important; color: #fff !important; }
:is(ul, ol)[data-guide-list-style] { display: block !important; padding-left: 24px !important; list-style-position: outside !important; }
:is(ul, ol)[data-guide-list-style] > li { display: list-item !important; padding-left: 0 !important; list-style-type: inherit !important; }
:is(ul, ol)[data-guide-list-style] > li::before { display: none !important; }
[data-guide-list-style="disc"] { list-style-type: disc !important; }
[data-guide-list-style="circle"] { list-style-type: circle !important; }
[data-guide-list-style="square"] { list-style-type: square !important; }
[data-guide-list-style="decimal"] { list-style-type: decimal !important; }
[data-guide-align="left"] { text-align: left !important; }
[data-guide-align="center"] { text-align: center !important; }
[data-guide-align="right"] { text-align: right !important; }
:is(.guide-rows, .gins-table)[data-guide-rows-style="basic"] > :is(.guide-row, .gins-trow) { margin-top: 6px; border: 1px solid var(--line, #dfe4ec) !important; border-radius: 7px; background: #fff !important; }
:is(.guide-rows, .gins-table)[data-guide-rows-style="lines"] > :is(.guide-row, .gins-trow) { border: 0 !important; border-bottom: 1px solid var(--line, #dfe4ec) !important; border-radius: 0; background: transparent !important; }
:is(.guide-rows, .gins-table)[data-guide-rows-style="accent"] > :is(.guide-row, .gins-trow) { border: 1px solid var(--line, #dfe4ec) !important; background: #fff !important; }
:is(.guide-rows, .gins-table)[data-guide-rows-style="accent"] > :is(.guide-row, .gins-trow) > :is(.gr-k, .gins-name) { background: var(--brand, #315de5) !important; color: #fff !important; }
.g-content-table[data-guide-rows-style] > .g-table-row > tbody > tr > :is(th, td) { padding: 12px 14px !important; background: #fff !important; }
.g-content-table[data-guide-rows-style="basic"] > .g-table-row > tbody > tr > :is(th, td) { border: 1px solid var(--line, #dfe4ec) !important; }
.g-content-table[data-guide-rows-style="lines"] > .g-table-row > tbody > tr > :is(th, td) { border: 0 !important; border-bottom: 1px solid var(--line, #dfe4ec) !important; }
.g-content-table[data-guide-rows-style="accent"] > .g-table-row > tbody > tr > :is(th, td) { border: 1px solid var(--line, #dfe4ec) !important; }
.g-content-table[data-guide-rows-style="accent"] > .g-table-row > tbody > tr > th.rh { background: var(--brand, #315de5) !important; color: #fff !important; }
[data-guide-label-align="left"] :is(.gr-k, .gins-name, .g-table-row > tbody > tr > th.rh) { text-align: left !important; }
[data-guide-label-align="center"] :is(.gr-k, .gins-name, .g-table-row > tbody > tr > th.rh) { text-align: center !important; }
[data-guide-label-align="right"] :is(.gr-k, .gins-name, .g-table-row > tbody > tr > th.rh) { text-align: right !important; }
[data-guide-value-align="left"] :is(.gr-v, .gins-info, .g-table-row > tbody > tr > td) { text-align: left !important; }
[data-guide-value-align="center"] :is(.gr-v, .gins-info, .g-table-row > tbody > tr > td) { text-align: center !important; }
[data-guide-value-align="right"] :is(.gr-v, .gins-info, .g-table-row > tbody > tr > td) { text-align: right !important; }
[data-guide-column-width] { width: var(--guide-column-width) !important; }
table:has([data-guide-column-width]) { table-layout: fixed !important; }
