/*────────────────────────────────────────────
  CTF Writeup·취약점 분석 보고서용 통합 스타일
  고정 너비 레이아웃 + 테이블 줄무늬 스타일
────────────────────────────────────────────*/

/* ── 색상 팔레이트 정의 ── */
:root, .theme-dark, .theme-light {
  --text-normal: #1e2022;
  --text-muted: #5a6672;
  --text-faint: #9aa1a9;
  --text-accent: #0050e6;
  --text-accent-hover: #003dba;
  --background-secondary: #f2f3f5;
  --background-secondary-alt: #e3e5e8;
  --background-modifier-border: #ddd;
  
  /* 보안 관련 색상 추가 */
  --severity-high: #e53935;
  --severity-medium: #fb8c00;
  --severity-low: #43a047;
  --severity-info: #039be5;
}

/* ── Preview view ── */
.markdown-preview-view .markdown-preview-sizer {
  max-width: 76ch;
  margin: 2rem auto;
  padding: 0 1rem;
  box-sizing: border-box;
}

/* ── Heading 구분선 ── */
.markdown-preview-view h1 {
  margin-top: 2rem;
  margin-bottom: 0.5rem;
  position: relative;
}
.markdown-preview-view h1::after {
  content: '';
  display: block;
  width: 100%;
  border-bottom: 3px solid var(--text-normal);
  margin-top: 0.25em;
}
.markdown-preview-view h2 {
  margin-top: 1.75rem;
  margin-bottom: 0.5rem;
  position: relative;
}
.markdown-preview-view h2::after {
  content: '';
  display: block;
  width: 100%;
  border-bottom: 1px solid var(--text-faint);
  margin-top: 0.25em;
}
/* h4 구분선 추가 */
.markdown-preview-view h4 {
  margin-top: 1.5rem;
  margin-bottom: 0.4rem;
  position: relative;
}

.markdown-preview-view h4::after {
  content: '';
  display: block;
  width: 100%;
  border-bottom: 1px dashed var(--text-faint);
  margin-top: 0.25em;
}

/* ── Editor view ── */
.markdown-source-view .cm-editor .cm-scroller {
  max-width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  margin: 2rem auto;
  padding: 0 1rem;
  box-sizing: border-box;
  position: relative;
}

/* ── Editor content column ── */
.markdown-source-view .cm-editor .cm-scroller .cm-content {
  width: 76ch;
  margin: 0 auto;
  white-space: pre-wrap;
  word-break: break-word;
}

/* ── Column guide ── */
.markdown-source-view .cm-editor .cm-scroller::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(76ch + 1rem);
  border-left: 1px solid rgba(150,150,150,0.3);
  pointer-events: none;
}

/* ── Code block (preview) ── */
.markdown-preview-view pre {
  max-width: 76ch;
  overflow-x: auto;
  padding: 1em;
  border-radius: 4px;
  background-color: var(--background-secondary);
  border: 1px solid var(--background-modifier-border);
}
.markdown-preview-view pre code {
  background: none;
  color: var(--code-normal);
  padding: 0;
  border: none;
  font-family: var(--font-monospace);
}

/* ── Inline code (preview & edit) ── */
.markdown-preview-view code,
.markdown-source-view .cm-inline-code {
  background-color: var(--background-secondary);
  color: var(--text-accent);
  padding: 0.1em 0.3em;
  border: none;
  border-radius: 2px;
  font-size: 0.95em;
  font-family: var(--font-monospace) !important;
  line-height: 1.4;
  margin: 0 0.5ch;
}

/* ── Bold marker opacity (edit) ── */
.markdown-source-view .cm-formatting-strong-open,
.markdown-source-view .cm-formatting-strong-close {
  color: var(--text-faint) !important;
}

/* ── 블록 인용문 (blockquote) ── */
.markdown-preview-view blockquote {
  border-left: 3px solid var(--text-accent);
  background-color: var(--background-secondary);
  padding: 0.3em 0.5em;
  color: var(--text-muted);
  margin: 1em 0;
}

/* ── 링크 및 호버 효과 ── */
.markdown-preview-view a {
  color: var(--text-accent);
  text-decoration: none;
}
.markdown-preview-view a:hover {
  color: var(--text-accent-hover);
  text-decoration: underline;
}

/* ── 각주·Superscript 스타일 ── */
.markdown-preview-view sup.footnote-ref {
  font-size: 0.8em;
  vertical-align: super;
  color: var(--text-faint);
}

/* ─────────────────────────────────────
   테이블 줄무늬 스타일
   ─────────────────────────────────────*/

/* 테이블 전체 스타일 */
.markdown-preview-view table {
  width: 100%;
  border-collapse: collapse;
  margin: 1em 0;
  border: 1px solid var(--background-modifier-border);
}

/* 줄무늬 행 스타일 */
.markdown-preview-view table tr:nth-child(even) {
  background-color: #f6f8fa; /* 밝은 회색 (Github 기본 배경) */
}

.markdown-preview-view table tr:nth-child(odd) {
  background-color: #ffffff; /* 흰색 */
}

/* 테이블 헤더 스타일 */
.markdown-preview-view table th {
  background-color: var(--background-secondary-alt);
  font-weight: bold;
  text-align: left;
  padding: 10px;
  border: 1px solid var(--background-modifier-border);
}

/* 테이블 셀 스타일 */
.markdown-preview-view table td {
  border: 1px solid #d0d7de; /* Github 테이블 테두리 색 */
  padding: 8px;
  vertical-align: top;
}

/* 테이블 호버 효과 */
.markdown-preview-view table tr:hover {
  background-color: rgba(0, 80, 230, 0.05);
}

/* ─────────────────────────────────────
   보안 포트폴리오 특화 스타일
   ─────────────────────────────────────*/

/* 취약점 심각도 표시 */
.severity-high {
  color: white;
  background-color: var(--severity-high);
  padding: 0.2em 0.5em;
  border-radius: 3px;
  font-weight: bold;
  display: inline-block;
}

.severity-medium {
  color: white;
  background-color: var(--severity-medium);
  padding: 0.2em 0.5em;
  border-radius: 3px;
  font-weight: bold;
  display: inline-block;
}

.severity-low {
  color: white;
  background-color: var(--severity-low);
  padding: 0.2em 0.5em;
  border-radius: 3px;
  font-weight: bold;
  display: inline-block;
}

.severity-info {
  color: white;
  background-color: var(--severity-info);
  padding: 0.2em 0.5em;
  border-radius: 3px;
  font-weight: bold;
  display: inline-block;
}

/* 프로젝트 카드 */
.project-card {
  border: 1px solid var(--background-modifier-border);
  border-radius: 5px;
  padding: 15px;
  margin: 1em 0;
  background-color: rgba(242, 243, 245, 0.5);
  transition: all 0.2s ease;
}

.project-card:hover {
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  transform: translateY(-2px);
}

.project-card h3 {
  margin-top: 0;
  color: var(--text-accent);
}

.project-card .project-links {
  margin-top: 10px;
}

.project-card .project-links a {
  display: inline-block;
  margin-right: 10px;
  padding: 4px 8px;
  background-color: var(--text-accent);
  color: white;
  border-radius: 4px;
  text-decoration: none;
  font-size: 0.9em;
}

.project-card .project-links a:hover {
  background-color: var(--text-accent-hover);
}

/* 취약점 프로세스 타임라인 */
.vuln-timeline {
  position: relative;
  margin: 2em 0;
  padding-left: 30px;
}

.vuln-timeline::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 8px;
  width: 2px;
  background-color: var(--text-accent);
}

.vuln-timeline-item {
  position: relative;
  margin-bottom: 1.5em;
}

.vuln-timeline-item::before {
  content: '';
  position: absolute;
  top: 4px;
  left: -22px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: var(--text-accent);
}

.vuln-timeline-date {
  font-weight: bold;
  margin-bottom: 0.2em;
  color: var(--text-accent);
}

/* 코드 하이라이트 */
.code-highlight {
  background-color: rgba(255, 235, 59, 0.2);
  border-bottom: 2px solid rgba(255, 152, 0, 0.7);
}

/* 파일 경로 */
.file-path {
  font-family: var(--font-monospace);
  background-color: var(--background-secondary);
  padding: 0.2em 0.4em;
  border-radius: 3px;
  font-size: 0.9em;
}

/* 명령어 */
.command {
  font-family: var(--font-monospace);
  background-color: #2b2b2b;
  color: #f8f8f2;
  padding: 0.2em 0.5em;
  border-radius: 3px;
  font-size: 0.9em;
}

/* 플로우차트 컨테이너 */
.flowchart-container {
  background-color: white;
  border: 1px solid var(--background-modifier-border);
  border-radius: 5px;
  padding: 15px;
  margin: 1em 0;
  overflow-x: auto;
}

/* 보안 용어 강조 */
.security-term {
  color: var(--text-accent);
  font-weight: 600;
  border-bottom: 1px dotted var(--text-accent);
}

/* 책임있는 공개 박스 */
.responsible-disclosure {
  border-left: 4px solid var(--severity-info);
  background-color: rgba(3, 155, 229, 0.08);
  padding: 1em;
  margin: 1em 0;
  border-radius: 0 4px 4px 0;
}

.responsible-disclosure h4 {
  color: var(--severity-info);
  margin-top: 0;
}

/* 테마 구분선 제거 */
.markdown-preview-view h1,
.markdown-preview-view h2,
.markdown-preview-view h4 {
  border-bottom: none !important;
}