/**
 * Pixelwork Therapy Slots - Frontend CSS.
 *
 * Minimal layout and status colors. Breakdance can override any of these
 * properties. Status colors are exposed as CSS custom properties.
 */

.pw-ts {
	--pw-ts-color-available: #16a34a;
	--pw-ts-color-opening: #ea580c;
	--pw-ts-color-full: #dc2626;

	--pw-ts-bg-card: #ffffff;
	--pw-ts-border-card: #e5e7eb;
	--pw-ts-text: #1f2937;
	--pw-ts-text-muted: #6b7280;

	--pw-ts-radius: 12px;
	--pw-ts-card-padding: 1.25rem;
	--pw-ts-dot-size: 12px;

	color: var(--pw-ts-text);
}

.pw-ts__card {
	/*background: var(--pw-ts-bg-card);
	border: 1px solid var(--pw-ts-border-card);
	border-radius: var(--pw-ts-radius);
	padding: var(--pw-ts-card-padding);*/
	display: flex;
	flex-direction: column;
	gap: 0rem;
}

/* Card accent border based on the overall status. */
/*
.pw-ts--available .pw-ts__card { border-left: 4px solid var(--pw-ts-color-available); }
.pw-ts--opening   .pw-ts__card { border-left: 4px solid var(--pw-ts-color-opening); }
.pw-ts--full      .pw-ts__card { border-left: 4px solid var(--pw-ts-color-full); }
*/

.pw-ts__body {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.pw-ts__line {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 400;
	line-height: 1.1;
}

/* The inner wrapper holds the dot and the text as one inline-flex unit, so the
   parent paragraph's text-align (left/center/right, inherited from Breakdance)
   moves the whole dot+text group together. */
.pw-ts__line-inner {
	display: inline-flex;
	align-items: self-start;
	gap: 0.4rem;
}

/* Inline dot indicator at the start of each body line. */
.pw-ts__indicator {
	display: inline-block;
	width: var(--pw-ts-dot-size);
	height: var(--pw-ts-dot-size);
	border-radius: 50%;
	flex: 0 0 var(--pw-ts-dot-size);
	margin-top: 3px;
}

.pw-ts__indicator--available { background: var(--pw-ts-color-available); }
.pw-ts__indicator--opening   { background: var(--pw-ts-color-opening); }
.pw-ts__indicator--full      { background: var(--pw-ts-color-full); }

.pw-ts__label {
	color: var(--pw-ts-text-muted);
}

.pw-ts__value {
	font-weight: 500;
}

.pw-ts__extra {
	font-size: 1.1rem;
	/*color: var(--pw-ts-text-muted);*/
}

.pw-ts__extra p {
	margin: 0 0 0.5rem 0;
}

.pw-ts__extra p:last-child {
	margin-bottom: 0;
}

.pw-ts__cta-wrapper {
	margin: 25px 0 0 0;
}

/* CTA button styling is delegated to Breakdance via the button-atom classes. */

.pw-ts__updated {
	margin: 0.75rem 0 0 0;
	font-size: 0.95rem;
	/*color: var(--pw-ts-text-muted);*/
}