/* KSO_Moon 이식에서 Django 쪽 화면(didim-cms 템플릿의 .field/.btn 등)을 Bootstrap 3 안에 맞추는 보정.
   원본 CSS(kso-*.css, board.css)는 손대지 않고 여기서만 덧붙인다. */

/* 본문: XE .xe_content 와 같은 기본값 */
.xe_content { line-height: 1.7; word-break: break-word; }
.xe_content img { max-width: 100%; height: auto; }
.xe_content iframe { max-width: 100%; }
.xe_content table { max-width: 100%; }
.page-doc h1 { margin-bottom: 20px; }

/* 상단 메뉴 활성 */
nav.navbar.bootsnav ul.nav > li.active > a { font-weight: 700; }

/* 서브사이트 안 가로 서브 메뉴 */
.moon-submenu { margin: 10px 0 0; }
.moon-submenu > li > a { padding: 6px 14px; }

/* 유튜브 배경 영상(YTPlayer 대체 iframe) */
.kso-player { position: relative; overflow: hidden; background-size: cover; }
.kso-player .kso-player-frame { position: absolute; top: 50%; left: 50%; width: 177.78vh; min-width: 100%; height: 56.25vw; min-height: 100%; transform: translate(-50%, -50%); pointer-events: none; }

/* 썸네일 카드: XE 는 360x350 잘린 썸네일을 썼다. 첫 이미지를 같은 비율로 자른다 (P2-09) */
.restgallery .imgwh { height: 220px; overflow: hidden; background: #f3f3f3; }
.restgallery .imgwh .rthumbnail { height: 100%; }
.restgallery .rthumbnailimg { width: 100%; height: 100%; object-fit: cover; }
.restgallery .rthumbnail-empty { display: flex; align-items: center; justify-content: center; height: 100%; color: #ccc; }
.moonCarousel .owl-article .thumb img { width: 100%; height: 150px; object-fit: cover; }

/* 알림 */
.moon-messages { padding-top: 15px; }

/* didim-cms 공용 폼(_form.html) */
.field { margin-bottom: 15px; }
.field label { display: block; font-weight: 700; margin-bottom: 5px; }
.field input:not([type=checkbox]):not([type=radio]):not([type=file]), .field select, .field textarea,
.write-form input[type=text], .write-form select, .write-form textarea {
  display: block; width: 100%; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555;
  background: #fff; border: 1px solid #ccc; border-radius: 3px; box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}
.field .help { display: block; color: #888; font-size: 12px; margin-top: 4px; }
.field .error, .errors li { color: #a94442; font-size: 13px; }
.errors { padding-left: 18px; }
.field-check .check-label { display: inline-flex; align-items: center; gap: 6px; font-weight: 400; }
.check-row { margin: 10px 0; }
.check-row .check-label { margin-right: 16px; font-weight: 400; }
.form-actions { margin: 20px 0; }
form.narrow { max-width: 480px; }
.btn { }  /* Bootstrap 3 의 .btn 을 그대로 쓴다 */
a.btn:not(.btn-default):not(.btn-primary):not(.btn-link):not(.btn-kso), button.btn:not(.btn-default):not(.btn-primary):not(.btn-link):not(.btn-sm):not(.btn-xs) {
  color: #fff; background-color: #337ab7; border-color: #2e6da4;
}
.btn.danger { background-color: #d9534f; border-color: #d43f3a; color: #fff; }
.btn-plain { display: inline-block; padding: 6px 12px; border: 1px solid #ccc; border-radius: 3px; color: #333; background: #fff; margin-left: 4px; }
.btn-plain:hover { background: #e6e6e6; text-decoration: none; }
.btn-plain.danger { color: #a94442; }
.linklike { background: none; border: 0; padding: 0; color: #337ab7; cursor: pointer; }
.inline-form { display: inline; }
.sub-links { margin-top: 15px; }
.notice { padding: 10px 15px; background: #fcf8e3; border: 1px solid #faebcc; border-radius: 3px; }

/* 첨부 UI(boards/write.html) */
.attach-row { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.file-button { display: inline-block; padding: 4px 10px; border: 1px solid #ccc; border-radius: 3px; cursor: pointer; font-weight: 400; margin: 0; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.attach-info.error { color: #a94442; }
textarea.html-source { width: 100%; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 13px; line-height: 1.5; }

/* 검색 */
.search-form { display: flex; gap: 8px; margin-bottom: 20px; }
.search-form input[type=search] { flex: 1; padding: 6px 12px; border: 1px solid #ccc; border-radius: 3px; }
.search-list { list-style: none; padding: 0; }
.search-item { padding: 10px 0; border-bottom: 1px solid #eee; }
.search-meta { margin: 2px 0 0; font-size: 13px; }
.search-group .section-head { display: flex; justify-content: space-between; align-items: baseline; margin-top: 24px; }

/* 공유 단추 */
.share-buttons { margin: 20px 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.share-button { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border: 1px solid #ddd; border-radius: 3px; background: #fff; color: #333; font-size: 13px; }
.share-button svg { width: 14px; height: 14px; }
svg.icon { width: 1em; height: 1em; vertical-align: -0.125em; fill: none; stroke: currentColor; stroke-width: 2; }

/* 댓글 */
.media-list .media { margin-top: 15px; }
.comment-form textarea { min-height: 80px; }
.cmt_editor .field label { display: none; }

/* 아이콘박스 아래 '자세히' 등 보정 */
.kso-section-info .mcont { font-size: 17px; line-height: 1.8; padding: 20px 0; }
.muted { color: #888; }

/* 서브사이트 첫 화면의 서브 메뉴 띠 */
.subsite-submenu { padding-top: 10px; }
.subsite-submenu .moon-submenu { margin-bottom: 10px; }

/* didim-cms 폼의 기본 단추(class="btn" 만 있는 것)를 Bootstrap primary 처럼 */
form.narrow .btn, .form-actions .btn, .write-form .btn, .search-form .btn { color: #fff; background-color: #337ab7; border-color: #2e6da4; padding: 6px 14px; }
form.narrow .btn:hover, .form-actions .btn:hover { background-color: #286090; }

/* KSO_RBoard 갤러리: 스킨 CSS 가 .imgwh 높이를 0 으로 두고 JS 로 맞추던 것을 고정 높이로. 설명은 겹치지 않게 이미지 아래에 */
.restgallery .imgwh { position: relative; width: 100% !important; height: 220px !important; margin-bottom: 0 !important; overflow: hidden; background: #f3f3f3; }
.restgallery .rthumb { margin-right: 0 !important; display: block; float: none !important; color: #333; }
.restgallery .viewinfo.effect .caption, .restgallery .caption { position: static !important; opacity: 1 !important; padding: 10px 2px 0 !important; min-height: 70px; }
.restgallery .caption .title { font-size: 14px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.restgallery .caption p { color: #888; font-size: 12px; }

/* 상단 사용자 메뉴 (로그인 후) */
nav.navbar.bootsnav .attr-nav > ul > li.moon-user > a { padding-left: 12px; padding-right: 12px; }
nav.navbar.bootsnav .attr-nav > ul > li.moon-user .moon-user-name { font-size: 13px; }
nav.navbar.bootsnav .attr-nav > ul > li.moon-user .dropdown-menu { min-width: 190px; left: auto; right: 0; padding: 6px 0; }
nav.navbar.bootsnav .attr-nav > ul > li.moon-user .dropdown-menu > li > a { padding: 8px 16px; font-size: 13px; }
nav.navbar.bootsnav .attr-nav > ul > li.moon-user .dropdown-header { padding: 4px 16px 8px; font-size: 11px; color: #999; }
.moon-logout-form { margin: 0; }
.moon-logout-form button { display: block; width: 100%; text-align: left; padding: 8px 16px; font-size: 13px; background: none; border: 0; color: #333; }
.moon-logout-form button:hover { background: #f5f5f5; }
.moon-panel-user { margin: 0 0 12px; font-weight: 700; }
.moon-panel-user small { display: block; font-weight: 400; color: #999; }