/* ============================================================
 * FeastForAll — Class Details widget styles
 * Author: DeltaV Digital
 * Identical look to the store-locator card, but flat: no border,
 * no shadow (it sits inside its own widget block).
 * Install: feast-theme/widgets/class-details/css/class-details.css
 * ============================================================ */

.ffa-class-details {
	/* Pull from Astra's global palette so the widget tracks the theme. */
	--ffa-orange:      var(--ast-global-color-0, #f37225);
	--ffa-orange-dark: #c95810;
	--ffa-orange-soft: #fdeadd;
	--ffa-teal:        var(--ast-global-color-1, #00abb8);
	--ffa-green-bg:    #e6f3e6;
	--ffa-green-tx:    var(--ast-global-color-4, #57a057);
	--ffa-blue-bg:     #e6f1fb;
	--ffa-blue-tx:     #0c447c;
	--ffa-amber-bg:    #faeeda;
	--ffa-amber-tx:    #854f0b;
	--ffa-pink-bg:     #fde5f0;
	--ffa-pink-tx:     var(--ast-global-color-3, #ee2a79);
	--ffa-ink:         var(--ast-global-color-2, #1a1a1a);
	--ffa-sub:         #3a3a3a;
	--ffa-muted:       #8a8a8a;
	--ffa-faint:       #a6a6a6;
	--ffa-line:        rgba(0,0,0,0.07);

	/* Flat — no card chrome. */
	background: transparent;
	border: 0;
	box-shadow: none;
	padding: 0;
	color: var(--ffa-ink);
	font-size: 14px;
	line-height: 1.45;
}

/* Head: name (h3) + status badge */
.ffa-class-details .ffa-head-row {
	display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
}
.ffa-class-details .ffa-name {
	margin: 0; padding: 0;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ffa-ink);
}
.ffa-class-details .ffa-partner {
	display: block;
	font-size: 14px;
	color: var(--ffa-muted);
	margin-top: 6px;
}

/* Status badge */
.ffa-class-details .ffa-status {
	flex: none;
	display: inline-block;
	font-size: 11.5px;
	font-weight: 600;
	line-height: 1;
	padding: 5px 11px;
	border-radius: 999px;
	white-space: nowrap;
	margin-left: auto;
}
.ffa-class-details .ffa-status--enrolling     { background: var(--ffa-green-bg); color: var(--ffa-green-tx); }
.ffa-class-details .ffa-status--starting_soon { background: var(--ffa-blue-bg);  color: var(--ffa-blue-tx); }
.ffa-class-details .ffa-status--ending_soon   { background: var(--ffa-amber-bg); color: var(--ffa-amber-tx); }
.ffa-class-details .ffa-status--ended         { background: #f1efe8; color: #5f5e5a; }

/* Rows with icons */
.ffa-class-details .ffa-row {
	display: flex; align-items: center; gap: 10px;
	font-size: 14px; color: var(--ffa-sub);
	line-height: 1.45;
}
.ffa-class-details .ffa-row .ffa-ic { flex: none; color: var(--ffa-orange); }
.ffa-class-details .ffa-addr { margin-top: 6px; color: var(--ffa-muted); }
.ffa-class-details .ffa-row--lang { color: var(--ffa-teal); font-weight: 600; }
.ffa-class-details .ffa-row--lang .ffa-ic { color: var(--ffa-teal); }

/* Schedule section */
.ffa-class-details .ffa-schedule {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--ffa-line);
	display: flex; flex-direction: column; gap: 10px;
}

/* Duration badge */
.ffa-class-details .ffa-duration {
	display: inline-block;
	margin-left: 8px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ffa-pink-tx);
	background: var(--ffa-pink-bg);
	padding: 2px 8px;
	border-radius: 999px;
	vertical-align: middle;
	white-space: nowrap;
}

/* Registration */
.ffa-class-details .ffa-register {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--ffa-line);
}
.ffa-class-details .ffa-email {
	display: flex; align-items: center; gap: 10px;
	font-size: 14px; text-decoration: none; color: var(--ffa-muted);
	line-height: 1.45;
}
.ffa-class-details .ffa-email .ffa-ic { flex: none; color: var(--ffa-orange); }
.ffa-class-details .ffa-email-cta { display: block; font-weight: 600; color: var(--ffa-orange); }
.ffa-class-details .ffa-email-addr { display: block; color: var(--ffa-muted); word-break: break-word; }
.ffa-class-details .ffa-email-addr:hover { color: var(--ffa-orange-dark); text-decoration: underline; }

/* Directions */
.ffa-class-details .ffa-direction-wrap {
	margin-top: 16px;
}
.ffa-class-details .ffa-directions {
	display: inline-flex; align-items: center; gap: 7px;
	background: var(--ffa-orange);
	color: #fff;
	font-size: 13.5px; font-weight: 600;
	text-decoration: none;
	padding: 9px 18px;
	border-radius: 999px;
	line-height: 1;
	transition: background .2s ease-in-out;
}
.ffa-class-details .ffa-directions:hover { background: var(--ffa-orange-dark); }
.ffa-class-details .ffa-directions .ffa-ic { color: #fff; }

@media (max-width: 480px) {
	.ffa-class-details .ffa-name { font-size: 18px; }
}