:root {
	--ink: #2e2a22;
	--ink-soft: #5b5346;
	--paper: #fbf9f5;
	--card: #ffffff;
	--gold: #b6964a;
	--gold-deep: #8b7136;
	--line: #e4dfd3;
	--status-open: #6b8f71;
	--status-reserve: #b6964a;
	--status-closed: #a15c48;
	--status-open-bg: #e3ede4;
	--status-open-text: #3f5c43;
	--status-reserve-bg: #f3ead2;
	--status-reserve-text: #7a5f27;
	--status-closed-bg: #f0dcd5;
	--status-closed-text: #7a3f32;
	--font-display: "Shippori Mincho", "Hiragino Mincho ProN", serif;
	--font-body: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

* {
	box-sizing: border-box;
}

/* [hidden]属性は、同じ要素に display を明示指定するクラス（.admin_btn 等）と
   同じ詳細度になり打ち消されてしまうため、常に最優先で隠す。 */
[hidden] {
	display: none !important;
}

/* <button>はブラウザ標準でフォントを継承しないため、隣接する<a>等と高さがずれる。
   常にページ全体のフォントに合わせる。 */
button {
	font-family: inherit;
}

body {
	margin: 0;
	font-family: var(--font-body);
	color: var(--ink-soft);
	background: var(--paper);
}

a {
	color: var(--gold-deep);
}

.admin_header {
	padding: 18px 28px 0;
	background: var(--ink);
	color: #f2ede2;
}

.admin_header_bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-bottom: 14px;
}

.admin_header_title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.3rem;
	letter-spacing: 0.04em;
	margin: 0;
	color: #f2ede2;
}

.admin_header_title a {
	color: inherit;
	text-decoration: none;
}

/* 上部のメニュー：タブの形にして、選択中のタブを本文の背景とつなげる。スマホで収まらないときは横スクロール */
.admin_nav {
	display: flex;
	gap: 4px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.admin_nav a {
	flex: none;
	padding: 10px 18px;
	border-radius: 8px 8px 0 0;
	background: rgba(242, 237, 226, 0.1);
	color: #e7cd94;
	font-weight: bold;
	font-size: 0.95rem;
	text-decoration: none;
	white-space: nowrap;
}

.admin_nav a:hover {
	background: rgba(242, 237, 226, 0.2);
}

.admin_nav a[aria-current="page"] {
	background: var(--paper);
	color: var(--ink);
}

.admin_user_bar {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 0.9rem;
	color: #d8d1c2;
}

.admin_logout_form button {
	background: none;
	border: 1px solid #6b6455;
	border-radius: 4px;
	padding: 4px 10px;
	color: #f2ede2;
	cursor: pointer;
}

.admin_main {
	max-width: 960px;
	margin: 28px auto;
	padding: 0 20px 48px;
}

.admin_toolbar {
	margin-bottom: 18px;
}

.admin_btn {
	display: inline-block;
	padding: 9px 18px;
	border: 1px solid var(--gold);
	border-radius: 4px;
	background: var(--card);
	color: var(--gold-deep);
	cursor: pointer;
	text-decoration: none;
	font-size: 0.95rem;
}

.admin_btn:hover {
	background: #faf4e6;
}

.admin_btn_primary {
	background: var(--gold);
	color: #fff;
	border-color: var(--gold);
}

.admin_btn_primary:hover {
	background: var(--gold-deep);
	border-color: var(--gold-deep);
}

.admin_form_actions {
	display: flex;
	gap: 12px;
	margin-top: 20px;
}

.admin_link_button {
	background: none;
	border: none;
	color: var(--gold-deep);
	text-decoration: underline;
	cursor: pointer;
	padding: 0;
	font-size: 0.9rem;
}

.admin_link_button_danger {
	color: var(--status-closed);
}

.admin_table_wrapper {
	overflow-x: auto;
}

.admin_table {
	width: 100%;
	border-collapse: collapse;
	background: var(--card);
	border: 1px solid var(--line);
}

.admin_table th,
.admin_table td {
	padding: 12px;
	border-bottom: 1px solid var(--line);
	text-align: left;
	vertical-align: middle;
}

.admin_table th {
	font-family: var(--font-display);
	font-weight: 700;
	color: var(--ink);
}

.admin_table_actions {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: nowrap;
	white-space: nowrap;
}

.admin_table_actions form {
	margin: 0;
	display: inline-flex;
}

.admin_row_btn {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 4px;
	border: 1px solid var(--gold);
	background: var(--card);
	color: var(--gold-deep);
	font-size: 0.85rem;
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
	line-height: 1.4;
}

.admin_row_btn:hover {
	background: #faf4e6;
}

.admin_row_btn_primary {
	background: var(--gold);
	color: #fff;
	border-color: var(--gold);
}

.admin_row_btn_primary:hover {
	background: var(--gold-deep);
	border-color: var(--gold-deep);
}

.admin_row_btn_danger {
	border-color: var(--status-closed);
	color: var(--status-closed);
}

.admin_row_btn_danger:hover {
	background: #faf0ee;
}

.status_badge {
	display: inline-block;
	padding: 3px 12px;
	border-radius: 12px;
	font-size: 0.78rem;
	font-weight: bold;
	white-space: nowrap;
}

/* 一覧の「状態」欄は文言の長さが違っても同じ幅にそろえる */
.admin_table .status_badge {
	min-width: 6.2em;
	text-align: center;
}

.status_badge_draft {
	background: #f4ecd8;
	color: var(--gold-deep);
	border: 1px solid var(--gold);
}

.status_badge_published {
	background: #e8f0e9;
	color: var(--status-open);
	border: 1px solid var(--status-open);
}

.status_badge_scheduled {
	background: #e6eef6;
	color: #3d6a92;
	border: 1px solid #6f97bc;
}

.status_badge_ended {
	background: #efedea;
	color: #8a8274;
	border: 1px solid #c9c3b8;
}

.admin_back_link {
	display: inline-block;
	margin-bottom: 12px;
}

.admin_error,
.admin_error_list {
	color: var(--status-closed);
}

.admin_error_list {
	padding-left: 1.2em;
}

.restore_banner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	background: #fbf1dc;
	border: 1px solid var(--gold);
	border-radius: 6px;
	padding: 12px 16px;
	margin-bottom: 18px;
	font-size: 0.92rem;
}

fieldset {
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 8px;
	padding: 20px;
	margin-bottom: 18px;
}

legend {
	font-family: var(--font-display);
	font-weight: 700;
	color: var(--ink);
	padding: 0 6px;
}

fieldset label {
	display: block;
	margin-bottom: 10px;
	font-size: 0.9rem;
}

fieldset input[type="text"],
fieldset select,
fieldset textarea {
	display: block;
	width: 100%;
	margin-top: 4px;
	padding: 7px 9px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 0.95rem;
	font-family: inherit;
}

.day_row {
	border: 1px solid var(--line);
	border-radius: 6px;
	padding: 0 16px 14px;
	margin-bottom: 14px;
	background: #fdfcfa;
	overflow: hidden;
}

.day_row_head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0 -16px 12px;
	padding: 10px 16px;
	background: var(--status-open-bg);
	border-bottom: 1px solid var(--line);
}

.day_row[data-status="reserve"] .day_row_head {
	background: var(--status-reserve-bg);
}

.day_row[data-status="closed"] .day_row_head {
	background: var(--status-closed-bg);
}

.day_row_date {
	font-weight: bold;
	color: var(--status-open-text);
}

.day_row[data-status="reserve"] .day_row_date {
	color: var(--status-reserve-text);
}

.day_row[data-status="closed"] .day_row_date {
	color: var(--status-closed-text);
}

.day_status_label {
	display: flex !important;
	align-items: center;
	gap: 8px;
	margin-bottom: 0 !important;
	width: auto;
}

.day_status_label select {
	width: auto;
	margin-top: 0;
}

.day_main_field {
	margin-bottom: 12px !important;
}

.day_main_field input {
	font-size: 1.05rem;
	padding: 9px 11px;
}

.day_sub_fields {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 10px;
}

.day_sub_fields label {
	margin-bottom: 0;
}

.weekly_toggle {
	display: flex;
	gap: 20px;
	margin-bottom: 16px;
}

.weekly_toggle label {
	display: flex !important;
	align-items: center;
	gap: 6px;
	width: auto;
	margin-bottom: 0 !important;
}

.weekly_category_block {
	border: 1px solid var(--line);
	border-radius: 6px;
	padding: 14px 16px;
	margin-bottom: 14px;
	background: #fdfcfa;
}

.weekly_category_head {
	display: flex;
	align-items: flex-end;
	gap: 16px;
	margin-bottom: 10px;
}

.weekly_category_head label {
	flex: 1;
	margin-bottom: 0;
}

.weekly_items_list {
	margin-bottom: 8px;
}

.weekly_item_row {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}

.weekly_item_symbol {
	width: 80px !important;
	flex: none;
}

.weekly_item_name {
	flex: 1;
}

dialog {
	border: none;
	border-radius: 8px;
	padding: 26px;
	width: 100%;
	max-width: 380px;
}

dialog::backdrop {
	background: rgba(46, 42, 34, 0.5);
}

dialog h2 {
	margin-top: 0;
	font-family: var(--font-display);
	font-size: 1.15rem;
	color: var(--ink);
}

dialog label {
	display: block;
	margin-bottom: 14px;
	font-size: 0.9rem;
}

dialog input {
	display: block;
	width: 100%;
	margin-top: 4px;
	padding: 7px 9px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-family: inherit;
}

.login_body {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	margin: 0;
	background: var(--paper);
	font-family: var(--font-body);
}

.login_main {
	background: var(--card);
	padding: 36px;
	border-radius: 8px;
	width: 100%;
	max-width: 360px;
	box-shadow: 0 4px 20px rgba(46, 42, 34, 0.08);
	border: 1px solid var(--line);
}

.login_main h1 {
	font-family: var(--font-display);
	font-size: 1.3rem;
	color: var(--ink);
	margin-top: 0;
}

.login_main label {
	display: block;
	margin-bottom: 14px;
	font-size: 0.9rem;
}

.login_main input {
	display: block;
	width: 100%;
	margin-top: 4px;
	padding: 8px 9px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-family: inherit;
}

.login_main button {
	width: 100%;
	padding: 11px;
	border: none;
	border-radius: 4px;
	background: var(--gold);
	color: #fff;
	font-size: 1rem;
	cursor: pointer;
}

.login_main button:hover {
	background: var(--gold-deep);
}

@media (max-width: 640px) {
	.admin_header {
		padding: 14px 16px 0;
	}

	.admin_nav a {
		padding: 9px 12px;
		font-size: 0.88rem;
	}

	.admin_main {
		margin: 16px auto;
		padding: 0 12px 32px;
	}

	fieldset {
		padding: 14px;
	}

	/* 一覧の表は横に長すぎてスマホでは読みにくいため、1行=1カードの縦積みに切り替える */
	.admin_table_wrapper {
		overflow-x: visible;
	}

	.admin_table thead {
		display: none;
	}

	.admin_table,
	.admin_table tbody,
	.admin_table tr {
		display: block;
		width: 100%;
	}

	.admin_table tr {
		border: 1px solid var(--line);
		border-radius: 8px;
		margin-bottom: 12px;
		overflow: hidden;
	}

	.admin_table td {
		display: block;
		width: auto;
		border-bottom: none;
		padding: 8px 12px;
	}

	.admin_table td[data-label]::before {
		content: attr(data-label);
		display: block;
		font-size: 0.72rem;
		font-weight: bold;
		color: var(--ink-soft);
		margin-bottom: 2px;
	}

	.admin_table_actions_cell {
		padding-top: 4px !important;
		padding-bottom: 12px !important;
		background: #f8f6f2;
	}

	.admin_table_actions {
		flex-wrap: wrap;
	}
}

/* ===== 営業カレンダー（/calendar/） ===== */
.cal_title {
	font-family: var(--font-display);
	color: var(--ink);
	margin: 0 0 8px;
}

.cal_lead {
	line-height: 1.8;
	margin: 0 0 16px;
}

.cal_notice {
	background: var(--status-open-bg);
	color: var(--status-open-text);
	border-radius: 6px;
	padding: 10px 14px;
}

.cal_hint {
	font-size: 0.82rem;
	color: #8a8274;
	margin: 6px 0;
}

.cal_months {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 16px;
	margin-bottom: 28px;
}

.cal_month_card {
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 8px;
	padding: 14px;
}

.cal_month_card h3 {
	margin: 0 0 10px;
	font-size: 1.05rem;
	color: var(--ink);
}

.cal_month_card .admin_table_actions {
	margin-top: 10px;
}

.cal_grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
	text-align: center;
	font-size: 0.85rem;
}

.cal_grid_edit {
	max-width: 520px;
	gap: 6px;
	font-size: 1rem;
	user-select: none;
}

.cal_head {
	font-size: 0.75rem;
	font-weight: bold;
	color: var(--ink-soft);
}

.cal_day {
	padding: 6px 0;
	border: 1px solid var(--line);
	border-radius: 50%;
	aspect-ratio: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ink);
	font-family: inherit;
	font-size: inherit;
}

button.cal_day {
	cursor: pointer;
	touch-action: none;
}

button.cal_day:hover {
	outline: 2px solid var(--gold);
}

.cal_sun {
	color: #c0392b;
}

.cal_sat {
	color: #2c6fb3;
}

.cal_today {
	border: 2px solid var(--ink);
}

.cal_palette {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
}

.cal_paint {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	margin: 0 !important;
	cursor: pointer;
}

.cal_swatch {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 1px solid var(--line);
	flex-shrink: 0;
}

.cal_swatch_none {
	background: #fff;
}

.cal_bulk {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 8px 0 14px;
	font-size: 0.9rem;
}

.cal_legend_rows {
	list-style: none;
	padding: 0;
	margin: 0 0 12px;
}

.cal_legend_row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	padding: 8px 0;
	border-bottom: 1px dashed var(--line);
}

.cal_legend_row input[type="text"] {
	flex: 1 1 240px;
	padding: 7px 9px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-family: inherit;
	font-size: 0.95rem;
}

.cal_legend_row input[type="color"] {
	width: 44px;
	height: 34px;
	padding: 2px;
	border: 1px solid #ccc;
	border-radius: 4px;
	background: #fff;
	cursor: pointer;
}

.cal_check {
	display: inline-flex !important;
	align-items: center;
	gap: 4px;
	margin: 0 !important;
}

/* ===== インスタ画像（/images/） ===== */
.image_tools {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 14px;
}

.image_tool {
	display: flex;
	flex-direction: column;
	gap: 6px;
	height: 100%;
	padding: 18px;
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 8px;
	color: var(--ink-soft);
	text-decoration: none;
	font-size: 0.9rem;
}

.image_tool strong {
	color: var(--ink);
	font-size: 1.05rem;
}

.image_tool:hover {
	border-color: var(--gold);
}
