@charset "UTF-8";

/* Staff CV – page-specific layout / 職務経歴書 – 画面固有レイアウト */

/* *-----------------------------------------------------------------------------------------* */
/* PAGE
/* *-----------------------------------------------------------------------------------------* */

.cv-edit-page {
	--cv-meter-width: 3.375rem;
	--cv-meter-height: 0.4375rem;
	--cv-meter-step: 20%;
	--cv-text-line-height: 1.7;
	--cv-text-rows-summary: 4;
	--cv-text-rows-intro: 8;
	--cv-text-rows-history: 12;
	--cv-media-max-width: 13.75rem;
	--cv-panel-padding-x: var(--space-5xl);
	--cv-body-padding-x: var(--space-8xl);
	--cv-column-gutter: var(--space-sm);
	--cv-skill-table-min-height: 600px;
}

/* Keep header buttons below the page title. Shared form CSS pulls them up over the title. */
/* ヘッダーボタンをページタイトルの下に置く。共通CSSはタイトル上へ引き上げる。 */
.cv-edit-page .form_header_btn_group {
	margin-top: 0;
}

/* Match the profile card column inset (--cv-column-gutter). */
/* プロフィールカード列の左余白（--cv-column-gutter）に合わせる。 */
.cv-edit-page .form_card_header_area {
	margin-left: 0 !important;
	padding-left: var(--cv-column-gutter);
}

.cv-edit-page .form_card_header_area .row,
.cv-edit-page .form_card_header_area [class*="col-"] {
	margin-left: 0;
	padding-left: 0;
}

.cv-edit-page .card_header_title {
	padding-left: 0;
}

.cv-edit-page .form_header_left_btn_group {
	padding-left: var(--cv-column-gutter);
}

/* *-----------------------------------------------------------------------------------------* */
/* CONTENT COLUMNS
/* *-----------------------------------------------------------------------------------------* */

/* Tighter gutter than the Bootstrap default so the profile column can take the saved width. */
/* Bootstrap既定より溝を狭め、余った幅をプロフィール列に回す。 */
.cv-content-row {
	align-items: stretch;
	margin-left: calc(-1 * var(--cv-column-gutter));
	margin-right: calc(-1 * var(--cv-column-gutter));
}

.cv-content-row > [class*="col-"] {
	padding-left: var(--cv-column-gutter);
	padding-right: var(--cv-column-gutter);
}

/* Skill list is a sibling of parts2. Global .row margins are 0, so cancel the extra col padding. */
/* スキル一覧はparts2の兄弟。全体の.row余白が0のため、余分な列paddingを打ち消す。 */
.cv-skill-list-row > .col-md-12 {
	padding-left: 0;
	padding-right: 0;
}

/* Table scrolls inside スキル一覧. Height is leftover space under 職務経歴書本文. */
/* スキル一覧の表は枠内でスクロールする。高さは職務経歴書本文の下の残り領域。 */
.cv-edit-page #xitm_tabu2_table.tabulator {
	max-width: 100%;
	min-height: 0;
	overflow: auto;
}

.cv-edit-page #xitm_tabu2_table .tabulator-tableholder {
	overflow: auto !important;
}

.cv-edit-page .card_container {
	margin-bottom: var(--space-lg) !important;
}

.cv-edit-page .card-body-form {
	padding: var(--space-lg) var(--space-3xl) var(--space-3xl);
	border: 1px solid var(--color-border-lighter);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-xs);
}

.cv-edit-page .form_card_text {
	display: block;
	padding-bottom: var(--space-md);
	border-bottom: 1px solid var(--color-border-lighter);
	color: var(--color-text-dark);
	font-size: var(--font-lg);
	font-weight: var(--font-weight-bold);
}

/* *-----------------------------------------------------------------------------------------* */
/* PROFILE PANEL
/* *-----------------------------------------------------------------------------------------* */

/* Stretch the outer card to the column; leave --space-lg for margin-bottom. */
/* The inner body must be 100% of the card. Subtracting --space-lg again left a gap. */
/* 外側カードを列いっぱいに伸ばし、下余白用に--space-lgを残す。 */
/* 内側はカードの100%にする。ここでも--space-lgを引くと下部に隙間が出る。 */
.cv-profile-panel {
	height: calc(100% - var(--space-lg));
}

.cv-profile-panel > .card-body-form {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.cv-profile-panel .tab-content {
	flex: 0 0 auto;
}

/* Label above value, muted small label, hairline divider between rows (prototype .lp-mini-field). */
/* ラベルを値の上に置き、ラベルは小さめのグレー、行間に細い区切り線（プロトタイプの.lp-mini-field相当）。 */
.cv-profile-field .form-group {
	padding-bottom: var(--space-3px);
	margin-bottom: var(--space-3px);
	border-bottom: 1px solid var(--color-border-lighter);
}

.cv-profile-field .form-group:last-child,
.cv-profile-field .cv-profile-name .form-group {
	border-bottom: 0;
}

.cv-profile-field label {
	margin-bottom: 0;
	color: var(--color-gray);
	font-size: var(--font-sm);
	font-weight: var(--font-weight-medium);
	line-height: 1.3;
}

.cv-profile-field .form-control {
	color: var(--color-text-table);
	font-size: var(--font-md2);
}

.cv-profile-name .form-control {
	color: var(--color-text);
	font-size: var(--font-xl);
	font-weight: var(--font-weight-bold);
}

/* Photo occupies the right half and stretches to the height of the field stack. */
/* 写真は右半分を占め、左側の項目群の高さまで伸びる。 */
.cv-profile-row {
	align-items: stretch;
}

.cv-profile-row > [class*="col-"] {
	display: flex;
	flex-direction: column;
}

.cv-profile-row .cv-profile-field {
	min-width: 0;
}

/* *-----------------------------------------------------------------------------------------* */
/* SECTION LABELS AND TEXT
/* *-----------------------------------------------------------------------------------------* */

.cv-section {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.cv-section-label,
.cv-edit-page .cv-section .form-group label {
	display: flex;
	align-items: center;
	column-gap: var(--space-sm);
	padding: var(--space-sm) 0 var(--space-xs);
	margin-bottom: 0;
	color: var(--color-text-lighter);
	font-size: var(--font-md2);
	font-weight: var(--font-weight-semibold);
}

.cv-section-label > i {
	font-size: var(--icon-size-xs);
}

/* *-----------------------------------------------------------------------------------------* */
/* EXPANDABLE LONG-TEXT SECTIONS (reusable)
/* *-----------------------------------------------------------------------------------------* */

.cv-expand-section .form-group label {
	width: 100%;
}

.cv-expand-btn {
	flex-shrink: 0;
	width: 1.375rem;
	height: 1.375rem;
	margin-left: auto;
	padding: 0;
	border: 1.5px solid var(--color-purple-lighter);
	border-radius: var(--radius-full);
	background: var(--color-white);
	color: var(--color-purple-lighter);
	font-size: var(--font-xs);
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}

.cv-expand-btn > i {
	transition: transform 0.25s;
}

.cv-expand-btn:hover,
.cv-expand-btn.is-expanded {
	background: var(--color-background-light-purple);
	border-color: var(--color-primary);
	color: var(--color-primary);
}

.cv-expand-btn.is-expanded > i {
	transform: rotate(180deg);
}

/* Shared field chrome for all three long-text sections. */
/* 3つの長文セクション共通のフィールドスタイル。 */
.cv-expand-section textarea.cv-expand-field {
	line-height: var(--cv-text-line-height);
	resize: none;
	box-sizing: border-box;
	width: 100%;
}

/* Fixed height from --cv-expand-row-count (set by JS from data-collapse-rows / data-expand-rows). */
/* 高さはJSがdata-collapse-rows／data-expand-rowsから設定する--cv-expand-row-countで固定する。 */
.cv-expand-section textarea.cv-expand-field.cv-expand-is-collapsed,
.cv-expand-section textarea.cv-expand-field.cv-expand-is-expanded {
	height: calc(var(--font-lg) * var(--cv-text-line-height) * var(--cv-expand-row-count, 8) + var(--space-3xl)) !important;
	min-height: 0 !important;
	max-height: calc(var(--font-lg) * var(--cv-text-line-height) * var(--cv-expand-row-count, 8) + var(--space-3xl)) !important;
}

/* Collapsed: clip with fade; no scrollbar. */
/* 折りたたみ：下端フェードで省略し、スクロールバーは出さない。 */
.cv-expand-section textarea.cv-expand-field.cv-expand-is-collapsed {
	overflow: hidden !important;
	-webkit-mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
	mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
}

/* Expanded: same fixed max height; scrollbar when content exceeds it. */
/* 展開：最大高さは固定のまま、溢れた分はスクロール表示する。 */
.cv-expand-section textarea.cv-expand-field.cv-expand-is-expanded {
	overflow-y: auto !important;
	-webkit-mask-image: none;
	mask-image: none;
}

.cv-view-mode .cv-expand-section textarea.cv-expand-field.cv-expand-is-expanded {
	overflow-y: auto !important;
}

/* Divider above 自己紹介・専門・アピールポイント and above 主な職歴, with spacing on both sides. */
/* 自己紹介・専門・アピールポイントと主な職歴の上に、上下に余白を持つ区切り線を表示する。 */
.cv-section-divider {
	width: 100%;
	height: 0;
	margin: var(--space-3xl) 0;
	border-top: 1px solid var(--color-border-lighter);
}

.cv-edit-page .cv-text-area,
.cv-edit-page .cv-section textarea.form-control:not(.cv-expand-field) {
	line-height: var(--cv-text-line-height);
	resize: none;
	overflow-y: auto;
}

.cv-edit-page .cv-text-summary {
	height: calc(var(--font-lg) * var(--cv-text-line-height) * var(--cv-text-rows-summary) + var(--space-3xl));
}

.cv-edit-mode .cv-strength-box {
	background: var(--tabu-cell-editable-color);
	border: solid 1px var(--color-border-dark);
	border-radius: var(--radius-xs);
}

/* Bordered box with a light purple left accent, matching the prototype. */
/* プロトタイプに合わせ、薄紫の左アクセントと薄い枠線で囲む。 */
.cv-strength-box {
	border: 1px solid var(--color-border-lighter);
	border-left: var(--space-xs) solid var(--color-background-pale-lavender);
	border-radius: var(--radius-2sm);
	overflow: hidden;
}

.cv-strength-box .form-group {
	margin-bottom: 0;
}

.cv-strength-box .form-group > .text-left {
	display: none;
}

.cv-strength-box .cv-text-strength {
	height: auto;
	min-height: calc(var(--font-lg) * var(--cv-text-line-height) * var(--cv-text-rows-summary) + var(--space-3xl));
	padding: var(--space-md) var(--space-lg) var(--space-md) var(--space-3xl);
	border: 0 !important;
	border-radius: 0;
	background: transparent !important;
	box-shadow: none !important;
}

/* *-----------------------------------------------------------------------------------------* */
/* PHOTO AND VIDEO
/* *-----------------------------------------------------------------------------------------* */

.cv-media-block {
	width: 100%;
	max-width: var(--cv-media-max-width);
}

.cv-media-block > label {
	color: var(--color-gray);
	font-size: var(--font-sm);
	font-weight: var(--font-weight-medium);
}

/* The video fills its column instead of being capped like the photo. */
/* 動画は写真と違い幅の上限を設けず、列いっぱいに広げる。 */
.cv-video-block {
	max-width: none;
}

/* The photo keeps its column width without stretching to the row height. */
/* 写真は行の高さに合わせて伸ばさず、列の幅のまま表示する。 */
.cv-photo-block {
	display: flex;
	flex-direction: column;
	flex: 0 0 auto;
	max-width: none;
}

/* Keep a definite square box for the image injected by the existing media loader. */
/* 既存のメディア読込処理が挿入する画像に、正方形の表示領域を与える。 */
.cv-photo-holder:not(:empty) {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
}

.cv-photo-holder:empty {
	display: none;
}

/* Empty-state placeholder, injected by JS in display mode only. */
/* 写真未設定時のプレースホルダー。参照モードのみJSが挿入する。 */
.cv-photo-placeholder {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: var(--space-xs);
	width: 100%;
	height: 100%;
	border: 1px dashed var(--color-border-dark);
	border-radius: var(--radius-2sm);
	background: var(--color-bg);
	color: var(--color-gray);
	text-align: center;
}

.cv-photo-placeholder > i {
	font-size: var(--font-42px);
	line-height: 1;
}

.cv-photo-placeholder > span {
	font-size: var(--font-sm);
	font-weight: var(--font-weight-semibold);
}

.cv-photo-holder .profile-icon {
	width: 100% !important;
	height: 100% !important;
	margin: 0;
	padding: 0;
	border: 1px solid var(--color-border-lighter);
	border-radius: var(--radius-2sm);
	box-shadow: none;
	overflow: hidden;
}

.cv-photo-holder .profile-icon img,
.cv-photo-holder .profile-icon img.img-circle {
	display: block;
	width: 100% !important;
	height: 100% !important;
	border-radius: var(--radius-2sm) !important;
	object-fit: cover;
}

.cv-photo-holder .profile-icon img.cv-profile-placeholder {
	padding: var(--space-5xl);
	background: var(--color-bg);
	object-fit: contain;
}

.cv-video-holder .profile-video {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	margin: 0;
	border-radius: var(--radius-2sm);
	background: var(--color-sidebar-dark);
	overflow: hidden;
}

.cv-video-holder .profile-video video {
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}

.cv-media-block .file_upload_area {
	min-height: 7.5rem;
	padding: var(--space-md);
	border: 1px dashed var(--color-border-dark);
	border-radius: var(--radius-2sm);
	background: var(--color-bg);
}

.cv-media-block .file_upload_area h6 {
	margin-bottom: 0;
	font-size: var(--font-base);
}

.cv-media-block .file_upload_icon {
	width: var(--icon-size-lg);
	height: auto;
}

.cv-media-block .card {
	margin-bottom: 0;
	border: 0;
	box-shadow: none;
}

/* *-----------------------------------------------------------------------------------------* */
/* DUMMY SKILL METERS
/* *-----------------------------------------------------------------------------------------* */

.cv-skill-card {
	padding: var(--space-md) var(--space-lg) var(--space-sm);
	margin-bottom: var(--space-sm);
	border: 1px solid var(--color-border-lighter);
	border-radius: var(--radius-2sm);
	background: var(--color-background-alt);
}

.cv-skill-card:last-child {
	margin-bottom: 0;
}

.cv-skill-card-title {
	padding-bottom: var(--space-xs);
	margin-bottom: var(--space-3px);
	border-bottom: 1px solid var(--color-border-light);
	color: var(--color-primary);
	font-size: var(--font-base);
	font-weight: var(--font-weight-bold);
}

.cv-skill-row {
	display: flex;
	align-items: center;
	padding: var(--space-3px) 0;
}

.cv-skill-row + .cv-skill-row {
	border-top: 1px solid var(--color-border-light);
}

.cv-skill-row-label {
	flex: 1;
	min-width: 0;
	color: var(--color-text-light);
	font-size: var(--font-base);
	font-weight: var(--font-weight-medium);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.cv-skill-meter {
	position: relative;
	flex-shrink: 0;
	width: var(--cv-meter-width);
	height: var(--cv-meter-height);
	margin-left: var(--space-sm);
	background: var(--color-background-pale-lavender);
}

.cv-skill-meter-fill {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: var(--color-primary);
	transition: width 0.3s;
}

.cv-edit-mode .cv-skill-meter {
	cursor: ew-resize;
	touch-action: none;
}

.cv-edit-mode .cv-skill-meter:hover {
	outline: 1.5px solid var(--color-primary);
	outline-offset: 2px;
}

.cv-skill-meter-dragging {
	user-select: none;
}

.cv-skill-strength-block {
	position: relative;
	margin-top: var(--space-3xl);
}

.cv-skill-level-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	color: var(--btn-purple);
	cursor: pointer;
	outline: none;
}

.cv-skill-level-toggle > .fa-info-circle {
	font-size: var(--font-md2);
}

.cv-skill-level-toggle:focus-visible {
	border-radius: var(--radius-full);
	outline: 2px solid var(--color-primary);
	outline-offset: 2px;
}

.cv-skill-level-body {
	display: none;
	position: fixed;
	z-index: 2000;
	width: 26.25rem;
	max-width: calc(100vw - var(--space-7xl));
	max-height: min(70vh, 28rem);
	overflow: auto;
	padding: var(--space-md) var(--space-lg);
	border: 1px solid var(--color-border);
	border-radius: 6px;
	background: var(--color-white);
	box-shadow: var(--shadow-popover);
	color: var(--color-text-lighter);
	font-size: var(--font-10px);
	font-weight: var(--font-weight-normal);
	line-height: 1.6;
	text-align: left;
	white-space: pre-wrap;
	pointer-events: auto;
}

.cv-skill-level-toggle.is-open .cv-skill-level-body {
	display: block;
}

#cv-skill-meter-toast {
	position: fixed;
	z-index: var(--z-tooltip);
	margin-left: var(--space-sm);
	padding: var(--space-xs) var(--space-lg);
	border-radius: var(--radius-full);
	background: var(--color-primary-dark);
	color: var(--color-white);
	font-size: var(--font-sm);
	font-weight: var(--font-weight-bold);
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	transform: translateY(-50%);
	transition: opacity 0.15s;
}

#cv-skill-meter-toast.is-show {
	opacity: 1;
}

.cv-skill-meter::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: var(--z-base);
	pointer-events: none;
	background: repeating-linear-gradient(
		to right,
		transparent 0,
		transparent calc(var(--cv-meter-step) - 1px),
		var(--color-white) calc(var(--cv-meter-step) - 1px),
		var(--color-white) var(--cv-meter-step)
	);
}

/* *-----------------------------------------------------------------------------------------* */
/* VERSION TABS AND ACTIONS
/* *-----------------------------------------------------------------------------------------* */

/* The panel chrome lives on .card-body-form only. Padding moves inside so the tab header and */
/* tab body no longer look like a second card stacked on top of the panel. */
/* パネルの枠線・影は.card-body-formだけに持たせ、余白は内側へ移すことでカードの二重表示を防ぐ。 */
.cv-resume-panel > .card-body-form {
	padding: 0;
}

/* Bootstrap gutters would push the title outside the now unpadded panel. */
/* パネルの余白を0にしたため、Bootstrapの溝でタイトルが外にずれないよう打ち消す。 */
.cv-resume-panel > .card-body-form > .row {
	margin-left: 0;
	margin-right: 0;
}

.cv-resume-panel > .card-body-form > .row > [class*="col-"] {
	padding-left: 0;
	padding-right: 0;
}

/* Title sits on the section background, no band of its own. */
/* タイトルは独自の背景色を持たず、セクションと同じ背景にする。 */
.cv-resume-panel > .card-body-form > .row,
.cv-resume-panel > .card-body-form > .row > [class*="col-"],
.cv-resume-panel .form_card_text {
	background: transparent;
}

.cv-resume-panel .form_card_text {
	padding: var(--space-lg) var(--cv-panel-padding-x) var(--space-md);
}

/* The tab strip carries no card chrome of its own; only the tabs are shaped. */
/* タブ列自体はカードの装飾を持たず、角丸・影はタブ本体だけに付ける。 */
.cv-resume-panel .card.card-tabs,
.cv-resume-panel .card-tabs > .nav-tabs,
.cv-resume-panel .card-tabs > .nav-tabs > .nav-item {
	border-radius: 0 !important;
	box-shadow: none !important;
	background: transparent;
}

.cv-resume-panel .card.card-tabs {
	margin: 0;
	border: 0;
}

.cv-resume-panel .nav-tabs {
	padding: var(--space-lg) var(--cv-panel-padding-x) 0;
	align-items: flex-end;
	column-gap: var(--space-2px);
	border-bottom: 1px solid var(--color-border-lighter);
}

/* staff.css and menu.css style .cv-tab through deeper selectors, so these are raised to match. */
/* staff.cssとmenu.cssが.cv-tabをより詳細なセレクタで指定しているため、画面固有側の詳細度を上げる。 */
.cv-resume-panel .card-tabs .nav-tabs > .nav-item > .nav-link.cv-tab {
	width: auto !important;
	height: auto !important;
	min-height: var(--button-height);
	justify-content: flex-start;
	column-gap: var(--space-sm);
	padding: var(--space-xs) var(--space-lg);
	border: 1px solid transparent;
	border-bottom: 0;
	border-radius: var(--radius-2sm) var(--radius-2sm) 0 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--color-text-lighter);
	transition: background-color 0.15s, color 0.15s;
}

.cv-resume-panel .card-tabs .nav-tabs > .nav-item > .nav-link.cv-tab:hover {
	background: var(--color-hover) !important;
}

/* Active tab reads as one surface with the body below, covering the strip line. */
/* 選択中のタブは下の本文と一体に見えるよう、タブ列の線を白い下辺で覆う。 */
.cv-resume-panel .card-tabs .nav-tabs > .nav-item > .nav-link.cv-tab.active {
	margin-bottom: -1px;
	border-color: var(--color-border-lighter);
	border-bottom: 1px solid var(--color-white);
	background: var(--color-white) !important;
}

.cv-resume-panel .card-tabs .nav-tabs > .nav-item > .nav-link.cv-tab.active .tab-text {
	color: var(--color-text) !important;
	font-weight: var(--font-weight-bold) !important;
}

/* Width is set by f_fit_cv_tab_width() so each tab hugs its version name. */
/* 幅はf_fit_cv_tab_width()が名称に合わせて設定し、タブが名称幅に収まるようにする。 */
.cv-resume-panel .cv-tab .tab-text {
	width: auto;
	text-align: left;
	font-size: var(--font-md2);
}

.cv-tab-version-no {
	order: -1;
	flex-shrink: 0;
	padding: 0 var(--space-xs);
	border-radius: var(--radius-xs);
	background: var(--color-background-dark);
	color: var(--color-text-lighter);
	font-size: var(--font-sm);
	font-weight: var(--font-weight-bold);
}

.nav-link.cv-tab.active .cv-tab-version-no {
	background: var(--color-text-lighter);
	color: var(--color-white);
}

.cv-edit-page .nav-tabs .cv-tab-meta {
	margin-left: auto;
	align-self: center;
	padding: 0 var(--space-md);
	color: var(--color-text-lighter);
	font-size: var(--font-base);
}

.cv-edit-page .tab-content {
	padding: var(--space-lg) 0 0;
}

/* Breathing room for サマリ／自己紹介ムービー／自己紹介／主な職歴／経験プロジェクト. */
/* サマリ・自己紹介ムービー・自己紹介・主な職歴・経験プロジェクトに余白を確保する。 */
.cv-resume-panel .tab-content {
	padding: var(--space-3xl) var(--space-3xl) var(--space-7xl);
}

.cv-action-stack {
	display: flex;
	flex-direction: column;
	row-gap: var(--space-sm);
}

/* *-----------------------------------------------------------------------------------------* */
/* DISPLAY MODE
/* *-----------------------------------------------------------------------------------------* */

.cv-view-mode .cv-edit-page #xbtn_update1,
.cv-view-mode .cv-edit-page [id^="icon_drag_and_drop"],
.cv-view-mode .cv-edit-page [id^="icon_deleted_btn"],
.cv-view-mode .cv-edit-page [id^="video_drag_and_drop"],
.cv-view-mode .cv-edit-page [id^="video_deleted_btn"],
.cv-view-mode .cv-edit-page #tabulator-controls,
.cv-view-mode .cv-edit-page .optional-input-label,
.cv-view-mode .cv-edit-page .cv-edit-only-field,
.cv-view-mode .cv-edit-page .cv-photo-block > label {
	display: none !important;
}

/* Allow table scroll in display mode. Cell editing is already off in view mode. */
/* 参照モードでも表のスクロールは許可する。セル編集は参照モードで既に無効。 */
.cv-view-mode .cv-edit-page #xitm_tabu2_table {
	pointer-events: auto;
}

.cv-view-mode .cv-edit-page .form-group {
	margin-bottom: var(--space-xs);
}

.cv-view-mode .cv-edit-page .form-control,
.cv-view-mode .cv-edit-page .form-control:disabled,
.cv-view-mode .cv-edit-page .form-control[readonly],
.cv-view-mode .cv-edit-page select:disabled {
	padding-left: 0;
	padding-right: 0;
	border-color: transparent !important;
	border-radius: 0;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--color-text) !important;
	opacity: 1;
	-webkit-text-fill-color: var(--color-text);
}

.cv-view-mode .cv-edit-page textarea.form-control {
	overflow: hidden;
}

.cv-view-mode .cv-edit-page .cv-text-summary {
	border-bottom: 1px solid var(--color-border-lighter) !important;
}

/* Keep the bordered accent box visible in display mode. */
/* 参照モードでも枠線付きのアクセントボックスを表示する。 */
.cv-view-mode .cv-edit-page .cv-strength-box {
	border: 1px solid var(--color-border-lighter);
	border-left: var(--space-xs) solid var(--color-background-pale-lavender);
	background: var(--color-white);
}

.cv-view-mode .cv-edit-page .cv-strength-box .cv-text-strength {
	padding: var(--space-md) var(--space-lg) var(--space-md) var(--space-3xl);
	border: 0 !important;
	background: transparent !important;
}

.cv-view-mode .cv-edit-page .cv-profile-name label {
	display: none;
}

.cv-view-mode .cv-edit-page .cv-profile-name .form-control {
	font-size: var(--font-xl);
}

.cv-view-mode .cv-edit-page .tabulator-col[tabulator-field="rowSelection"],
.cv-view-mode .cv-edit-page .tabulator-cell[tabulator-field="rowSelection"] {
	display: none !important;
}

.cv-public-view .cv-public-private-fields,
.cv-public-view .cv-action-stack,
.cv-public-view .nav-tabs,
.cv-public-view .cv-tab-meta {
	display: none !important;
}

/* *-----------------------------------------------------------------------------------------* */
/* RESPONSIVE
/* *-----------------------------------------------------------------------------------------* */

@media (min-width: 1200px) {
	.cv-action-stack {
		margin-top: var(--space-6xl);
	}

	/* Page wrapper places スキル一覧 under 職務経歴書本文 without parts2 requiring parts3. */
	/* Profile column stretches to the full grid height so the card fills leftover space */
	/* when スキル・強み has little or no data. Extra space stays inside the card. */
	/* ページ側の枠でスキル一覧を本文の下に置く。parts2からparts3を呼ばない。 */
	/* プロフィール列をグリッド全体の高さまで伸ばし、スキル・強みが少ないときもカードが余白を埋める。 */
	/* 余った高さはカード内（スキル・強み）に残す。 */
	.cv-resume-block {
		display: grid;
		grid-template-columns: minmax(0, 28%) minmax(0, 72%);
		grid-template-rows: auto 1fr;
		align-items: stretch;
	}

	.cv-resume-block > .cv-content-row {
		display: contents;
	}

	/* height: 0 + min-height: 100% so プロフィール does not inflate row 1 (gap above スキル一覧). */
	/* プロフィールが1行目を押し広げないよう height:0 と min-height:100% にする。 */
	.cv-col-profile {
		grid-column: 1;
		grid-row: 1 / span 2;
		align-self: stretch;
		display: flex;
		flex-direction: column;
		width: auto;
		max-width: none;
		height: 0;
		min-height: 100%;
		overflow: visible;
		padding-left: var(--cv-column-gutter);
		padding-right: var(--cv-column-gutter);
	}

	.cv-col-profile .cv-profile-panel {
		flex: 1 1 auto;
		display: flex;
		flex-direction: column;
		height: auto;
		min-height: 0;
		overflow: hidden;
	}

	.cv-col-profile .cv-profile-panel > .card-body-form {
		flex: 1 1 auto;
		height: auto;
		min-height: 0;
		overflow: hidden;
	}

	.cv-col-profile .cv-skill-strength-block {
		flex: 1 1 auto;
		min-height: 0;
		overflow: auto;
	}

	.cv-skill-strength-block > [class*="col-"] {
		flex: 1 1 auto;
		min-height: 0;
		display: flex;
		flex-direction: column;
	}

	.cv-col-resume {
		grid-column: 2;
		grid-row: 1;
		align-self: start;
		width: auto;
		max-width: none;
		padding-left: var(--cv-column-gutter);
		padding-right: var(--cv-column-gutter);
	}

	.cv-skill-list-row {
		grid-column: 2;
		grid-row: 2;
		align-self: stretch;
		display: flex;
		flex-direction: column;
		width: auto;
		max-width: none;
		min-width: 0;
		min-height: var(--cv-skill-table-min-height);
		height: auto;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: var(--cv-column-gutter);
		padding-right: var(--cv-column-gutter);
	}

	.cv-skill-list-row > .col-md-12,
	.cv-skill-list-row .card_container,
	.cv-skill-list-row .card-body-form {
		display: flex;
		flex-direction: column;
		flex: 1 1 auto;
		min-height: 0;
		height: 100%;
	}

	.cv-skill-list-row #xitm_tabu2_table.tabulator {
		flex: 1 1 auto;
		min-height: var(--cv-skill-table-min-height);
		height: 100%;
		max-height: none;
		overflow: auto;
	}
}

@media (max-width: 1199px) {
	.cv-profile-panel,
	.cv-profile-panel > .card-body-form {
		height: auto;
	}

	.cv-media-block {
		max-width: 100%;
	}
}

@media (max-width: 767px) {
	.cv-edit-page .card-body-form {
		padding: var(--space-lg);
	}

	.cv-resume-panel > .card-body-form {
		padding: 0;
	}

	.cv-edit-page {
		--cv-panel-padding-x: var(--space-lg);
		--cv-body-padding-x: var(--space-lg);
	}

	.cv-edit-page .nav-tabs .cv-tab-meta {
		width: 100%;
		margin: var(--space-sm) 0;
	}
}