/**
 * Counter Branches — weekly operating hours table.
 *
 * @package jpd-theme
 */

.jpd-page--counter-branches {
	background: var(--jpd-light);
}

.jpd-counter-branches {
	padding-block: clamp(2rem, 4vw, 3.5rem);
	padding-bottom: clamp(3rem, 6vw, 5rem);
}

.jpd-counter-branches__intro {
	margin-bottom: 1.5rem;
	max-width: 42rem;
}

.jpd-counter-branches__title {
	margin: 0 0 0.5rem;
	color: var(--jpd-dark);
	font-family: var(--jpd-font-heading);
	font-size: clamp(1.35rem, 1vw + 1.1rem, 1.75rem);
	font-weight: 700;
	line-height: 1.25;
}

.jpd-counter-branches__note {
	margin: 0;
	color: var(--jpd-text-light);
	font-size: clamp(0.95rem, 0.2vw + 0.9rem, 1.05rem);
	line-height: 1.55;
}

.jpd-counter-branches__empty {
	margin: 0;
	padding: 1.25rem 1.5rem;
	border-left: 4px solid var(--jpd-secondary);
	border-radius: 0 10px 10px 0;
	background: #fff8e8;
	color: var(--jpd-text);
}

.jpd-counter-branches__table-wrap {
	overflow-x: auto;
	max-width: 100%;
	border-radius: 12px;
	box-shadow: 0 1px 3px rgba(3, 47, 60, 0.06);
	outline: none;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-inline: contain;
}

.jpd-counter-branches__table-wrap:focus-visible {
	box-shadow: 0 0 0 3px rgba(var(--jpd-teal-rgb), 0.28);
}

.jpd-counter-branches__table {
	width: 100%;
	min-width: 52rem;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	border: 1px solid #e8d48a;
	border-radius: 12px;
	background: var(--jpd-white);
	font-size: clamp(0.85rem, 0.25vw + 0.78rem, 0.95rem);
	font-variant-numeric: tabular-nums;
	line-height: 1.45;
	text-align: center;
}

.jpd-counter-branches__table th,
.jpd-counter-branches__table td {
	padding: 0.85rem 0.75rem;
	border-right: 1px solid #e8d48a;
	vertical-align: middle;
}

.jpd-counter-branches__table th:last-child,
.jpd-counter-branches__table td:last-child {
	border-right: 0;
}

.jpd-counter-branches__table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: linear-gradient(90deg, #fde08d 0%, #f5c842 100%);
	color: #1a1a1a;
	font-weight: 700;
	letter-spacing: 0.02em;
	white-space: nowrap;
}

.jpd-counter-branches__table thead th:first-child,
.jpd-counter-branches__table tbody th {
	position: sticky;
	left: 0;
	z-index: 1;
	width: 1%;
	min-width: 10rem;
	text-align: left;
	white-space: nowrap;
}

.jpd-counter-branches__table thead th:first-child {
	z-index: 3;
}

.jpd-counter-branches__table tbody th {
	background: var(--jpd-white);
	color: #0b3a74;
	font-weight: 700;
}

.jpd-counter-branches__table tbody tr:nth-child(odd) th,
.jpd-counter-branches__table tbody tr:nth-child(odd) td {
	background: var(--jpd-white);
}

.jpd-counter-branches__table tbody tr:nth-child(even) th,
.jpd-counter-branches__table tbody tr:nth-child(even) td {
	background: #fef6d8;
}

.jpd-counter-branches__table tbody tr:not(:last-child) th,
.jpd-counter-branches__table tbody tr:not(:last-child) td {
	border-bottom: 1px solid #e8d48a;
}

.jpd-counter-branches__time {
	display: block;
}

.jpd-counter-branches__table td.is-closed {
	color: var(--jpd-text-light);
	font-style: italic;
}

@media (max-width: 640px) {
	.jpd-counter-branches__table {
		min-width: 44rem;
		font-size: 0.8rem;
	}

	.jpd-counter-branches__table th,
	.jpd-counter-branches__table td {
		padding: 0.7rem 0.55rem;
	}

	.jpd-counter-branches__table thead th:first-child,
	.jpd-counter-branches__table tbody th {
		min-width: 8rem;
	}
}
