/* PX Opening Hours
 * Desktop: one grid, rows use display:contents so columns line up and the
 * dividers (cell borders) run as one continuous line from top to bottom.
 * Stacked/mobile rules are added inline by the loader using Elementor's breakpoints.
 * Defaults match the original px-oh table (16px / 1.3, #3F647E, 120px + 180px columns).
 */

.pxoh-wrap {
	display: flex;
	justify-content: flex-start;
}

.pxoh {
	--pxoh-gap: 15px;
	--pxoh-row-pad: 3px;
	--pxoh-div-w: 1px;
	--pxoh-div1: #DF6FA4;
	--pxoh-div2: #DF6FA4;

	display: grid;
	grid-template-columns:
		var(--pxoh-day-w, 120px)
		var(--pxoh-slot-w, 180px)
		var(--pxoh-slot-w, 180px);
	width: max-content;
	max-width: 100%;
	color: #3F647E;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.3;
}

.pxoh-row {
	display: contents;
}

.pxoh-day,
.pxoh-slot {
	box-sizing: border-box;
	min-width: 0;
}

.pxoh-day {
	padding: var(--pxoh-row-pad) var(--pxoh-gap) var(--pxoh-row-pad) 0;
	font-weight: 700;
}

.pxoh-slot {
	padding: var(--pxoh-row-pad) var(--pxoh-gap);
}

.pxoh-s1 {
	border-left: var(--pxoh-div-w) solid var(--pxoh-div1);
}

.pxoh-s2 {
	border-left: var(--pxoh-div-w) solid var(--pxoh-div2);
}