/* ================================================================
 *  学科日程表 フロントエンド
 *
 *  カラーは Snow Monkey CSS 変数を使用:
 *    --accent-color          アクセントカラー
 *    --sub-accent-color      サブアクセントカラー
 *    --dark-color            ダークカラー
 *    --msm-custom-color-1    カスタムカラー1
 * ================================================================ */

.gksc-container {
	max-width: 1400px;
	margin: 0 auto;
	padding: 20px 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif;
	box-sizing: border-box;
}

.gksc-container *,
.gksc-container *::before,
.gksc-container *::after {
	box-sizing: border-box;
}

.gksc-title {
	font-size: var(--gksc-fs-title, 22px);
	font-weight: 800;
	color: var(--dark-color, #1a1a2e);
	text-align: center;
	margin: 0 0 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.gksc-title::before,
.gksc-title::after {
	content: '';
	display: block;
	width: 40px;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--accent-color, #ff6522));
}

.gksc-title::after {
	background: linear-gradient(90deg, var(--accent-color, #ff6522), transparent);
}

.gksc-note {
	text-align: center;
	font-size: 13px;
	color: #666;
	margin: 0 0 20px;
	line-height: 1.6;
}

/* ----------------------------------------------------------------
 *  テーブルブロック
 * ---------------------------------------------------------------- */

.gksc-tables {
	display: block;
}

.gksc-block {
	min-width: 0;
}

.gksc-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #d0d0d8;
	border-radius: 10px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	position: relative;
}

/* ----------------------------------------------------------------
 *  テーブル
 * ---------------------------------------------------------------- */

.gksc-table {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
	font-size: 12px;
	background: #fff;
}

.gksc-col-section {
	width: 22px;
}

.gksc-col-period {
	width: 80px;
}

/* ヘッダー */

.gksc-table thead th {
	border: 1px solid #d0d0d8;
	text-align: center;
	vertical-align: middle;
	background: #f5f5fa;
	padding: 4px 2px;
	font-weight: 600;
}

.gksc-corner {
	background: #eeeef4 !important;
	white-space: nowrap;
	padding: 6px 4px !important;
	position: sticky;
	left: 0;
	z-index: 3;
}

.gksc-cr-label {
	background: #eeeef4 !important;
	font-size: 9px !important;
	font-weight: 600 !important;
	color: #888 !important;
	white-space: nowrap;
	padding: 2px 4px !important;
	text-align: center;
	position: sticky;
	left: 0;
	z-index: 3;
}

/* 日付行 */

.gksc-date-row th {
	padding: 6px 2px;
}

.gksc-date-num {
	display: block;
	font-size: var(--gksc-fs-date, 11px);
	font-weight: 700;
	line-height: 1.5;
	color: var(--dark-color, #333);
	white-space: nowrap;
}

.gksc-closed .gksc-date-num {
	color: #bbb;
}

.gksc-sat {
	background: color-mix(in srgb, var(--sub-accent-color, #2563eb) 8%, #fff) !important;
}

.gksc-sat .gksc-date-num {
	color: var(--sub-accent-color, #2563eb);
}

.gksc-sun {
	background: color-mix(in srgb, var(--accent-color, #ff6522) 8%, #fff) !important;
}

.gksc-sun .gksc-date-num {
	color: var(--accent-color, #ff6522);
}

/* 曜日行 */

.gksc-dow {
	font-size: var(--gksc-fs-dow, 12px) !important;
	font-weight: 800 !important;
	padding: 4px 2px !important;
	color: var(--dark-color, #333);
}

.gksc-dow--0 {
	color: var(--accent-color, #ff6522) !important;
	background: color-mix(in srgb, var(--accent-color, #ff6522) 8%, #fff) !important;
}

.gksc-dow--6 {
	color: var(--sub-accent-color, #2563eb) !important;
	background: color-mix(in srgb, var(--sub-accent-color, #2563eb) 8%, #fff) !important;
}

/* 教室行 */

.gksc-cr-row th {
	font-size: var(--gksc-fs-classroom, 10px) !important;
	color: #999 !important;
	font-weight: 600 !important;
	padding: 2px 4px !important;
	border-bottom: 2px solid var(--dark-color, #c0c0cc);
	min-width: 28px;
}

/* ----------------------------------------------------------------
 *  ボディ
 * ---------------------------------------------------------------- */

.gksc-table tbody tr {
	height: 32px;
}

.gksc-table tbody td {
	border: 1px solid #d8d8e0;
	text-align: center;
	vertical-align: middle;
	height: 32px;
	max-height: 32px;
	padding: 2px 1px;
	font-size: var(--gksc-fs-cell, 13px);
	font-weight: 700;
	color: var(--dark-color, #1a1a2e);
	white-space: nowrap;
	overflow: hidden;
}

/* セクションラベル（午前/午後/夜間） */

.gksc-section-label {
	background: #eeeef4;
	vertical-align: middle;
	text-align: center;
	width: 22px;
	min-width: 22px;
	max-width: 22px;
	padding: 0 !important;
	border-right: 2px solid #c0c0cc;
	overflow: visible !important;
	position: sticky;
	left: 0;
	z-index: 2;
}

.gksc-section-label span {
	display: flex;
	align-items: center;
	justify-content: center;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	font-size: var(--gksc-fs-section, 12px);
	font-weight: 800;
	color: var(--dark-color, #555);
	letter-spacing: 4px;
	width: 100%;
	height: 100%;
	min-height: 60px;
}

.gksc-section-label--test {
	background: color-mix(in srgb, var(--accent-color, #ff6522) 8%, #fff);
	border-right: 2px solid color-mix(in srgb, var(--accent-color, #ff6522) 40%, #fff);
}

.gksc-section-label--test span {
	color: var(--accent-color, #ff6522);
	font-size: 10px;
	letter-spacing: 2px;
}

/* 時限ラベル */

.gksc-period-lbl {
	background: #f5f5fa;
	text-align: left !important;
	padding: 2px 4px !important;
	white-space: nowrap;
	min-width: 80px;
	width: 80px;
	overflow: hidden !important;
	position: sticky;
	left: 22px;
	z-index: 2;
}

.gksc-period-num {
	display: block;
	font-size: var(--gksc-fs-period, 10px);
	font-weight: 700;
	color: var(--dark-color, #333);
	line-height: 1.3;
}

.gksc-period-time {
	display: block;
	font-size: var(--gksc-fs-period-time, 8px);
	color: #999;
	line-height: 1.2;
	white-space: nowrap;
}

/* セクション区切り */

.gksc-section--morning + .gksc-section--test td,
.gksc-section--morning + .gksc-section--afternoon td {
	border-top: 2px solid #999;
}

.gksc-section--test + .gksc-section--afternoon td {
	border-top: 2px solid color-mix(in srgb, var(--accent-color, #ff6522) 40%, #fff);
}

.gksc-section--afternoon + .gksc-section--evening td {
	border-top: 2px solid #999;
}

/* 通常セル */

.gksc-cell {
	min-width: 28px;
}

.gksc-cell--red {
	background: color-mix(in srgb, var(--accent-color, #ff6522) 8%, #fff);
	color: var(--accent-color, #ff6522) !important;
}

.gksc-cell--blue {
	background: color-mix(in srgb, var(--sub-accent-color, #2563eb) 8%, #fff);
	color: var(--sub-accent-color, #2563eb) !important;
}

/* イベントセル */

.gksc-event {
	position: relative;
	padding: 2px !important;
	overflow: hidden;
}

.gksc-event--red {
	background: color-mix(in srgb, var(--accent-color, #ff6522) 12%, #fff) !important;
	border-color: color-mix(in srgb, var(--accent-color, #ff6522) 40%, #fff) !important;
}

.gksc-event--blue {
	background: color-mix(in srgb, var(--sub-accent-color, #2563eb) 12%, #fff) !important;
	border-color: color-mix(in srgb, var(--sub-accent-color, #2563eb) 40%, #fff) !important;
}

.gksc-event-text {
	font-size: var(--gksc-fs-event, 10px);
	font-weight: 800;
	line-height: 1.4;
}

.gksc-event--red .gksc-event-text {
	color: var(--accent-color, #ff6522);
}

.gksc-event--blue .gksc-event-text {
	color: var(--sub-accent-color, #2563eb);
}

.gksc-vertical {
	writing-mode: vertical-rl;
	text-orientation: mixed;
	letter-spacing: 2px;
}

/* ----------------------------------------------------------------
 *  休校日（日曜＋休校日カレンダー指定）
 * ---------------------------------------------------------------- */

/* 休校日付プレースホルダ（日付行の高さ維持） */
.gksc-date-num--closed {
	display: block;
	font-size: var(--gksc-fs-date, 11px);
	line-height: 1.5;
	visibility: hidden;
}

/* 列まるごと休校（ヘッダ） */
.gksc-day-hd.gksc-closed,
.gksc-dow.gksc-closed,
.gksc-cr.gksc-closed {
	background: repeating-linear-gradient(
		-45deg,
		#fafafa 0,
		#fafafa 4px,
		#e8e8ee 4px,
		#e8e8ee 6px
	) !important;
	color: #b0b0b8 !important;
}

/* 列まるごと休校（ボディセル） */
.gksc-cell--closed {
	background: repeating-linear-gradient(
		-45deg,
		transparent 0,
		transparent 4px,
		rgba(0, 0, 0, 0.07) 4px,
		rgba(0, 0, 0, 0.07) 6px
	) !important;
	color: transparent !important;
	border-color: #d8d8e0 !important;
}

.gksc-cell--closed .gksc-event-text {
	display: none;
}

/* ----------------------------------------------------------------
 *  週の区切り線（1週目と2週目の間）
 * ---------------------------------------------------------------- */

.gksc-table .gksc-week-break {
	border-left: 3px double var(--dark-color, #1a1a2e) !important;
}

/* ----------------------------------------------------------------
 *  教習番号一覧
 * ---------------------------------------------------------------- */

.gksc-subjects {
	margin-top: 40px;
}

.gksc-subjects-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.gksc-subjects-header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 20px;
	border-radius: 10px;
	margin-bottom: 4px;
}

.gksc-subjects-header--s1 {
	background: var(--accent-color, #ff6522);
}

.gksc-subjects-header--s2 {
	background: var(--msm-custom-color-1, #ff6522);
}

.gksc-subjects-step {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	color: #fff;
	font-size: 14px;
	font-weight: 800;
	flex-shrink: 0;
}

.gksc-subjects-htitle {
	font-size: var(--gksc-fs-subj-header, 16px);
	font-weight: 800;
	color: #fff;
}

.gksc-subjects-sub {
	font-size: 12px;
	font-weight: 600;
	margin-left: 6px;
	opacity: 0.85;
}

.gksc-subjects-list {
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 1px 8px rgba(0, 0, 0, 0.05);
	overflow: hidden;
}

.gksc-subject-row {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 16px;
	border-bottom: 1px solid #f0f0f5;
	transition: background 0.15s;
}

.gksc-subject-row:last-child {
	border-bottom: none;
}

.gksc-subject-row:hover {
	background: #fafafe;
}

.gksc-subject-no {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 8px;
	font-size: var(--gksc-fs-subj-no, 16px);
	font-weight: 800;
	color: #fff;
	flex-shrink: 0;
}

.gksc-subject-no--s1 {
	background: var(--accent-color, #ff6522);
}

.gksc-subject-no--s2 {
	background: var(--msm-custom-color-1, #ff6522);
}

.gksc-subject-body {
	flex: 1;
	min-width: 0;
}

.gksc-subject-name {
	display: block;
	font-size: var(--gksc-fs-subj-name, 13px);
	font-weight: 600;
	color: var(--dark-color, #333);
	line-height: 1.5;
}

.gksc-subject-badge {
	display: inline-block;
	margin-top: 3px;
	padding: 2px 10px;
	border-radius: 4px;
	font-size: 10px;
	font-weight: 700;
}

.gksc-subject-badge--s1 {
	background: color-mix(in srgb, var(--accent-color, #ff6522) 15%, #fff);
	color: var(--accent-color, #ff6522);
}

.gksc-subject-badge--s2 {
	background: color-mix(in srgb, var(--msm-custom-color-1, #ff6522) 15%, #fff);
	color: var(--msm-custom-color-1, #ff6522);
}

/* ----------------------------------------------------------------
 *  レスポンシブ
 * ---------------------------------------------------------------- */

@media (max-width: 1200px) {
	.gksc-table {
		width: max-content;
		min-width: 100%;
		table-layout: auto;
	}
}

@media (max-width: 768px) {
	.gksc-container {
		padding: 10px 0;
	}

	.gksc-subjects-grid {
		grid-template-columns: 1fr;
	}

	.gksc-subject-row {
		padding: 10px 12px;
		gap: 10px;
	}

	.gksc-subject-no {
		width: 30px;
		height: 30px;
	}

	.gksc-scroll {
		border-radius: 6px;
		margin: 0 -4px;
	}

	.gksc-table tbody td {
		height: 26px;
		padding: 1px;
	}

	.gksc-period-lbl {
		min-width: 48px;
		width: 48px;
		padding: 2px 3px !important;
		left: 18px;
	}

	.gksc-section-label {
		width: 18px;
		min-width: 18px;
		max-width: 18px;
		padding: 4px 2px;
		letter-spacing: 2px;
	}

	.gksc-cr-row th {
		min-width: 22px;
		padding: 1px 2px !important;
	}

	.gksc-col-section {
		width: 18px;
	}

	.gksc-col-period {
		width: 48px;
	}

	.gksc-col-cell {
		width: 24px;
	}

	.gksc-cell {
		min-width: 22px;
	}
}

@media (max-width: 480px) {
	.gksc-col-section {
		width: 16px;
	}

	.gksc-col-period {
		width: 68px;
	}

	.gksc-col-cell {
		width: 22px;
	}

	.gksc-period-lbl {
		min-width: 68px;
		width: 68px;
		left: 16px;
	}

	.gksc-section-label {
		width: 16px;
		min-width: 16px;
		max-width: 16px;
		letter-spacing: 1px;
	}
}

/* ----------------------------------------------------------------
 *  印刷
 * ---------------------------------------------------------------- */

@media print {
	.gksc-container {
		max-width: 100%;
		padding: 0;
	}

	.gksc-scroll {
		overflow: visible !important;
		box-shadow: none;
		border-radius: 0;
	}

	.gksc-table {
		width: 100%;
		min-width: 0;
		font-size: 8px;
	}

	.gksc-table tbody td {
		height: auto;
		padding: 1px;
		font-size: 9px;
	}

	.gksc-period-lbl {
		min-width: 0;
		width: auto;
	}
}