/*
 * CDLM ページ用の最小スタイル (CDLM の単体ページ・CPT 検索結果だけに読み込む)。
 * 旧 Liquid Magazine は Bootstrap 4 を同梱していた。CDLM の表示が使っている分だけを、
 * .nk-cdlm の中に限って再現する。SWELL 全体には影響させない。
 * 広告枠 (APPEP free_space) のスタイルは含めない (別段階)。
 */

/* 見えない h1 (SEO 用)。旧子テーマ style.css と同じ */
.not-actually-visible-content {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	pointer-events: none;
	-webkit-user-select: none;
	user-select: none;
}

/* ---- ユーティリティ (Bootstrap 4 の同名クラスのうち CDLM が使うもの) ---- */
.nk-cdlm .row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.nk-cdlm .row > [class*="col-"] { box-sizing: border-box; padding-right: 15px; padding-left: 15px; width: 100%; }
.nk-cdlm .col-12 { flex: 0 0 100%; max-width: 100%; }
.nk-cdlm .col-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
@media (min-width: 576px) {
	.nk-cdlm .col-sm-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
	.nk-cdlm .col-sm-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
}
@media (min-width: 768px) {
	.nk-cdlm .col-md-3 { flex: 0 0 25%; max-width: 25%; }
	.nk-cdlm .col-md-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
}
@media (min-width: 992px) {
	.nk-cdlm .col-lg-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
	.nk-cdlm .col-lg-6 { flex: 0 0 50%; max-width: 50%; }
	.nk-cdlm .d-lg-block { display: block !important; }
}
@media (min-width: 1200px) {
	.nk-cdlm .col-xl-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
}
.nk-cdlm .form-row { display: flex; flex-wrap: wrap; margin-right: -5px; margin-left: -5px; }
.nk-cdlm .form-row > [class*="col-"] { box-sizing: border-box; padding-right: 5px; padding-left: 5px; width: 100%; }
.nk-cdlm .container { width: 100%; max-width: 100%; margin-right: auto; margin-left: auto; }
.nk-cdlm .d-flex { display: flex !important; }
.nk-cdlm .d-none { display: none !important; }
.nk-cdlm .d-block { display: block !important; }
.nk-cdlm .d-inline-block { display: inline-block !important; }
.nk-cdlm .justify-content-center { justify-content: center !important; }
.nk-cdlm .align-items-center { align-items: center !important; }
.nk-cdlm .vh-100 { height: 100vh !important; }
.nk-cdlm .text-center { text-align: center !important; }
.nk-cdlm .text-left { text-align: left !important; }
.nk-cdlm .position-relative { position: relative !important; }
.nk-cdlm .position-absolute { position: absolute !important; }
.nk-cdlm .w-100 { width: 100% !important; }
.nk-cdlm .h-100 { height: 100% !important; }
.nk-cdlm .mt-1 { margin-top: .25rem !important; }
.nk-cdlm .mt-3 { margin-top: 1rem !important; }
.nk-cdlm .mt-5 { margin-top: 3rem !important; }
.nk-cdlm .mb-2 { margin-bottom: .5rem !important; }
.nk-cdlm .mb-3 { margin-bottom: 1rem !important; }
.nk-cdlm .mb-4 { margin-bottom: 1.5rem !important; }
.nk-cdlm .mb-5 { margin-bottom: 3rem !important; }
.nk-cdlm .ml-2 { margin-left: .5rem !important; }
.nk-cdlm .ml-3 { margin-left: 1rem !important; }
.nk-cdlm .mr-3 { margin-right: 1rem !important; }
.nk-cdlm .mx-auto { margin-right: auto !important; margin-left: auto !important; }
.nk-cdlm .img-fluid { max-width: 100%; height: auto; }
.nk-cdlm .img-thumbnail { max-width: 100%; height: auto; padding: .25rem; background: #fff; border: 1px solid #dee2e6; border-radius: .25rem; cursor: pointer; }

/* ---- フォーム・ボタン・アラート ---- */
.nk-cdlm .form-control { display: block; width: 100%; box-sizing: border-box; padding: .5rem .75rem; border: 1px solid #ced4da; border-radius: .25rem; font-size: 1rem; }
.nk-cdlm .btn { display: inline-block; padding: .5rem 1rem; border: 1px solid transparent; border-radius: .25rem; font-size: 1rem; line-height: 1.5; cursor: pointer; text-align: center; }
.nk-cdlm .btn-primary { color: #fff; background-color: #007bff; border-color: #007bff; }
.nk-cdlm .btn-primary:disabled { opacity: .65; cursor: not-allowed; }
.nk-cdlm .btn-link { color: #007bff; background: transparent; border-color: transparent; }
.nk-cdlm .btn-block { display: block; width: 100%; }
.nk-cdlm .alert { padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem; }
.nk-cdlm .alert-primary { color: #004085; background-color: #cce5ff; border-color: #b8daff; }
.nk-cdlm .alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb; }
.nk-cdlm .alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }

/* ---- カード (回答一覧) ---- */
.nk-cdlm .card { position: relative; display: flex; flex-direction: column; border: 1px solid rgba(0, 0, 0, .125); border-radius: .25rem; background: #fff; }
.nk-cdlm .card-header { padding: .75rem 1.25rem; background: rgba(0, 0, 0, .03); border-bottom: 1px solid rgba(0, 0, 0, .125); }
.nk-cdlm .card-header.bg-warning { background: #ffc107; }
.nk-cdlm .card-body { flex: 1 1 auto; padding: 1.25rem; }
.nk-cdlm .card-header img { vertical-align: middle; border-radius: 50%; }

/* ---- 回答目次 (collapse) ---- */
.nk-cdlm .collapse:not(.show) { display: none; }
.nk-cdlm .list-group { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.nk-cdlm .list-group-item { padding: .5rem 0; border-bottom: 1px solid rgba(0, 0, 0, .125); }

/* ---- 画像カルーセル (images 投稿の複数画像) ---- */
.nk-cdlm .carousel { position: relative; }
.nk-cdlm .carousel-inner { position: relative; width: 100%; overflow: hidden; }
.nk-cdlm .carousel-item { display: none; position: relative; }
.nk-cdlm .carousel-item.active { display: block; }
.nk-cdlm .carousel-thumbnails { display: flex; flex-wrap: wrap; }

/* ---- モーダル (モバイルの画像ダウンロード表示。#imageModal) ---- */
.nk-cdlm .modal { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000; overflow: auto; background: rgba(0, 0, 0, .6); }
.nk-cdlm .modal.show { display: block; }
.nk-cdlm .modal-dialog { position: relative; width: auto; max-width: 800px; margin: 1.75rem auto; }
.nk-cdlm .modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - 3.5rem); }
.nk-cdlm .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; background: #fff; border-radius: .3rem; }
.nk-cdlm .modal-header { display: flex; align-items: flex-start; justify-content: space-between; padding: 1rem; border-bottom: 1px solid #dee2e6; }
.nk-cdlm .modal-body { position: relative; flex: 1 1 auto; padding: 1rem; }
.nk-cdlm .modal .close { float: right; font-size: 1.5rem; line-height: 1; background: transparent; border: 0; cursor: pointer; }

/* ---- 回答ページ送り (APPEP の liquid_magazine_like_pagination の出力) ---- */
.nk-cdlm nav.navigation ul.page-numbers { margin: 1.5em 0; padding: 0; list-style: none; text-align: center; }
.nk-cdlm nav.navigation ul.page-numbers li { display: block; }
.nk-cdlm nav.navigation .page-numbers a,
.nk-cdlm nav.navigation .page-numbers span.page-numbers { display: inline-block; min-width: 2.2em; margin: 0 2px; padding: .3em .6em; border: 1px solid #ccc; border-radius: 4px; text-decoration: none; }
.nk-cdlm nav.navigation .page-numbers span.current { background: #007bff; border-color: #007bff; color: #fff; }

/* ---- 単体ページの付属部品 (CDLM 用に新規に書いたもの) ---- */
.nk-cdlm-nav { margin: 0 0 1.5em; font-size: .85em; }
.nk-cdlm-nav ul { display: flex; flex-wrap: wrap; gap: .25em 1em; margin: 0; padding: 0; list-style: none; }
.nk-cdlm-tags { display: flex; flex-wrap: wrap; gap: .5em; margin: 1.5em 0; padding: 0; list-style: none; }
.nk-cdlm-tags a { display: inline-block; padding: .2em .8em; border: 1px solid #ccc; border-radius: 1em; font-size: .85em; text-decoration: none; }
.nk-cdlm-pn { display: flex; justify-content: space-between; gap: 1em; margin: 2em 0; padding: 0; list-style: none; }
.nk-cdlm-recommend { margin-top: 2.5em; }
.nk-cdlm-recommend__ttl { margin-bottom: 1em; font-weight: bold; font-size: 1.1em; }

/* ---- 作品カードの一覧 (関連・CPT 検索結果) ---- */
.nk-cdlm-list { display: grid; grid-template-columns: repeat(var(--nk-cols, 3), minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
@media (max-width: 959px) { .nk-cdlm-list { grid-template-columns: repeat(min(var(--nk-cols, 3), 2), minmax(0, 1fr)); } }
@media (max-width: 599px) { .nk-cdlm-list { grid-template-columns: minmax(0, 1fr); } }
.nk-cdlm-item { margin: 0; }
.nk-cdlm-item > a { display: block; color: inherit; text-decoration: none; }
.nk-cdlm-item__thumb { display: flex; align-items: center; justify-content: center; height: var(--nk-thumb-h, 300px); overflow: hidden; background: #f4f4f4; }
.nk-cdlm-item__thumb img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.nk-cdlm-item__ttl { margin: .5em 0 0; font-size: .95em; font-weight: bold; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nk-cdlm-item .needs-answer { color: #d9534f; font-size: .85em; font-weight: bold; }
@media (max-width: 575.98px) { .nk-cdlm-item__thumb { height: min(var(--nk-thumb-h, 300px), 60vw); } }
.nk-cdlm-search { margin: 0 0 1.5em; }
.nk-cdlm-search form { display: flex; gap: 8px; }
.nk-cdlm-search input[type="text"] { flex: 1 1 auto; min-width: 0; padding: .5em .75em; border: 1px solid #ced4da; border-radius: 4px; }
.nk-cdlm-search button { padding: .5em 1em; border: 0; border-radius: 4px; background: #007bff; color: #fff; cursor: pointer; }
