/**
 * Frontend styles for AKM Booking plugin.
 * Applies Poppins font to all shortcode elements.
 */

.akm-booking-form,
.akm-accommodation-form,
.akm-facility-form,
.akm-accommodation-cart,
.akm-facility-cart,
.akm-accommodation-list,
.akm-facility-list,
.akm-events-timeline,
.akm-events-calendar-wrap,
.akm-event-registration-form-wrap,
.akm-event-detail-wrap,
.akm-frontend-dashboard-wrapper,
.akm-admin-login-wrap,
.akm-thank-you,
.akm-senarai-latihan,
.akm-signature-program,
.akm-course-detail,
.akm-calendar-wrap,
.akm-residensi-wrapper,
.akm-pakar-registration-wrap,
.akm-pakar-registration-form-wrap {
	font-family: 'Poppins', sans-serif;
}

.akm-event-registration-form-wrap {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.elementor-widget-shortcode .akm-event-registration-form-wrap,
.elementor .akm-event-registration-form-wrap {
	max-width: 100%;
}

/* Typography: body copy 15px, titles (headings & calendar month labels) 19px */
:is(
	.akm-booking-form,
	.akm-accommodation-form,
	.akm-facility-form,
	.akm-accommodation-cart,
	.akm-facility-cart,
	.akm-accommodation-list,
	.akm-facility-list,
	.akm-events-timeline,
	.akm-events-calendar-wrap,
	.akm-event-registration-form-wrap,
	.akm-event-detail-wrap,
	.akm-frontend-dashboard-wrapper,
	.akm-admin-login-wrap,
	.akm-thank-you,
	.akm-senarai-latihan,
	.akm-signature-program,
	.akm-course-detail,
	.akm-calendar-wrap,
	.akm-residensi-wrapper,
	.akm-pakar-registration-wrap,
	.akm-pakar-registration-form-wrap
) {
	font-size: 15px;
}

:is(
	.akm-booking-form,
	.akm-accommodation-form,
	.akm-facility-form,
	.akm-accommodation-cart,
	.akm-facility-cart,
	.akm-accommodation-list,
	.akm-facility-list,
	.akm-events-timeline,
	.akm-events-calendar-wrap,
	.akm-event-registration-form-wrap,
	.akm-event-detail-wrap,
	.akm-frontend-dashboard-wrapper,
	.akm-admin-login-wrap,
	.akm-thank-you,
	.akm-senarai-latihan,
	.akm-signature-program,
	.akm-course-detail,
	.akm-calendar-wrap,
	.akm-residensi-wrapper,
	.akm-pakar-registration-wrap,
	.akm-pakar-registration-form-wrap
) :is(h1, h2, h3, h4, h5, h6) {
	font-size: 19px !important;
}

:is(
	.akm-booking-form,
	.akm-accommodation-form,
	.akm-facility-form,
	.akm-accommodation-cart,
	.akm-facility-cart,
	.akm-accommodation-list,
	.akm-facility-list,
	.akm-events-timeline,
	.akm-events-calendar-wrap,
	.akm-event-registration-form-wrap,
	.akm-event-detail-wrap,
	.akm-frontend-dashboard-wrapper,
	.akm-admin-login-wrap,
	.akm-thank-you,
	.akm-senarai-latihan,
	.akm-signature-program,
	.akm-course-detail,
	.akm-calendar-wrap,
	.akm-residensi-wrapper,
	.akm-pakar-registration-wrap,
	.akm-pakar-registration-form-wrap
) :is(.akm-module-title, .akm-calendar-title, .akm-events-calendar-title) {
	font-size: 19px !important;
}

/* Tailwind text-* utilities → body size (headings keep title size via rules above) */
:is(
	.akm-booking-form,
	.akm-accommodation-form,
	.akm-facility-form,
	.akm-accommodation-cart,
	.akm-facility-cart,
	.akm-accommodation-list,
	.akm-facility-list,
	.akm-events-timeline,
	.akm-events-calendar-wrap,
	.akm-event-registration-form-wrap,
	.akm-event-detail-wrap,
	.akm-frontend-dashboard-wrapper,
	.akm-admin-login-wrap,
	.akm-thank-you,
	.akm-senarai-latihan,
	.akm-signature-program,
	.akm-course-detail,
	.akm-calendar-wrap,
	.akm-residensi-wrapper,
	.akm-pakar-registration-wrap,
	.akm-pakar-registration-form-wrap
) :not(h1, h2, h3, h4, h5, h6):where(
	.text-xs,
	.text-sm,
	.text-base,
	.text-lg,
	.text-xl,
	.text-2xl,
	.text-3xl,
	.text-4xl,
	.text-5xl,
	.text-6xl,
	.text-7xl,
	.text-8xl,
	.text-9xl
) {
	font-size: 15px !important;
}

@media (min-width: 640px) {
	:is(
		.akm-booking-form,
		.akm-accommodation-form,
		.akm-facility-form,
		.akm-accommodation-cart,
		.akm-facility-cart,
		.akm-accommodation-list,
		.akm-facility-list,
		.akm-events-timeline,
		.akm-events-calendar-wrap,
		.akm-event-registration-form-wrap,
		.akm-event-detail-wrap,
		.akm-frontend-dashboard-wrapper,
		.akm-admin-login-wrap,
		.akm-thank-you,
		.akm-senarai-latihan,
		.akm-signature-program,
		.akm-course-detail,
		.akm-calendar-wrap,
		.akm-residensi-wrapper,
		.akm-pakar-registration-wrap,
		.akm-pakar-registration-form-wrap
	) :not(h1, h2, h3, h4, h5, h6):where(
		.sm\:text-xs,
		.sm\:text-sm,
		.sm\:text-base,
		.sm\:text-lg,
		.sm\:text-xl,
		.sm\:text-2xl,
		.sm\:text-3xl
	) {
		font-size: 15px !important;
	}
}

@media (min-width: 768px) {
	:is(
		.akm-booking-form,
		.akm-accommodation-form,
		.akm-facility-form,
		.akm-accommodation-cart,
		.akm-facility-cart,
		.akm-accommodation-list,
		.akm-facility-list,
		.akm-events-timeline,
		.akm-events-calendar-wrap,
		.akm-event-registration-form-wrap,
		.akm-event-detail-wrap,
		.akm-frontend-dashboard-wrapper,
		.akm-admin-login-wrap,
		.akm-thank-you,
		.akm-senarai-latihan,
		.akm-signature-program,
		.akm-course-detail,
		.akm-calendar-wrap,
		.akm-residensi-wrapper,
		.akm-pakar-registration-wrap,
		.akm-pakar-registration-form-wrap
	) :not(h1, h2, h3, h4, h5, h6):where(
		.md\:text-xs,
		.md\:text-sm,
		.md\:text-base,
		.md\:text-lg,
		.md\:text-xl,
		.md\:text-2xl,
		.md\:text-3xl
	) {
		font-size: 15px !important;
	}
}

@media (min-width: 1024px) {
	:is(
		.akm-booking-form,
		.akm-accommodation-form,
		.akm-facility-form,
		.akm-accommodation-cart,
		.akm-facility-cart,
		.akm-accommodation-list,
		.akm-facility-list,
		.akm-events-timeline,
		.akm-events-calendar-wrap,
		.akm-event-registration-form-wrap,
		.akm-event-detail-wrap,
		.akm-frontend-dashboard-wrapper,
		.akm-admin-login-wrap,
		.akm-thank-you,
		.akm-senarai-latihan,
		.akm-signature-program,
		.akm-course-detail,
		.akm-calendar-wrap,
		.akm-residensi-wrapper,
		.akm-pakar-registration-wrap,
		.akm-pakar-registration-form-wrap
	) :not(h1, h2, h3, h4, h5, h6):where(
		.lg\:text-xs,
		.lg\:text-sm,
		.lg\:text-base,
		.lg\:text-lg,
		.lg\:text-xl,
		.lg\:text-2xl,
		.lg\:text-3xl,
		.lg\:text-4xl,
		.lg\:text-5xl
	) {
		font-size: 15px !important;
	}
}

@media (min-width: 1280px) {
	:is(
		.akm-booking-form,
		.akm-accommodation-form,
		.akm-facility-form,
		.akm-accommodation-cart,
		.akm-facility-cart,
		.akm-accommodation-list,
		.akm-facility-list,
		.akm-events-timeline,
		.akm-events-calendar-wrap,
		.akm-event-registration-form-wrap,
		.akm-event-detail-wrap,
		.akm-frontend-dashboard-wrapper,
		.akm-admin-login-wrap,
		.akm-thank-you,
		.akm-senarai-latihan,
		.akm-signature-program,
		.akm-course-detail,
		.akm-calendar-wrap,
		.akm-residensi-wrapper,
		.akm-pakar-registration-wrap,
		.akm-pakar-registration-form-wrap
	) :not(h1, h2, h3, h4, h5, h6):where(
		.xl\:text-xs,
		.xl\:text-sm,
		.xl\:text-base,
		.xl\:text-lg,
		.xl\:text-xl,
		.xl\:text-2xl,
		.xl\:text-3xl
	) {
		font-size: 15px !important;
	}
}

.akm-senarai-latihan .akm-senarai-latihan-title {
	font-size: 33px !important;
	line-height: 1.2;
}

/* Senarai Latihan: typical laptop viewports — dial back dominant type sizes */
@media (min-width: 1024px) and (max-width: 1439px) {
	.akm-senarai-latihan .akm-senarai-latihan-title {
		font-size: 26px !important;
	}

	.akm-senarai-latihan .akm-senarai-card h3 {
		font-size: 16px !important;
		line-height: 1.35;
	}

	.akm-senarai-latihan .akm-senarai-card p,
	.akm-senarai-latihan .akm-senarai-card a.text-sm {
		font-size: 13px !important;
	}

	.akm-senarai-latihan .akm-senarai-cluster-btn,
	.akm-senarai-latihan .akm-senarai-cat-btn {
		font-size: 13px !important;
	}

	.akm-senarai-latihan #akm-senarai-lihat-lagi {
		font-size: 14px !important;
	}
}

/* Events timeline: typical laptop viewports — reduce type and card density */
@media (min-width: 1024px) and (max-width: 1439px) {
	.akm-events-timeline .akm-events-timeline-item {
		padding: 1rem 1.25rem !important;
		gap: 1rem !important;
	}

	.akm-events-timeline .akm-events-timeline-item h3 {
		font-size: 16px !important;
		line-height: 1.35;
	}

	.akm-events-timeline .akm-timeline-date-badge {
		width: 3.5rem !important;
		height: 3.5rem !important;
		min-width: 3.5rem;
	}

	.akm-events-timeline .akm-timeline-day-num {
		font-size: 1rem !important;
	}

	.akm-events-timeline .akm-timeline-month {
		font-size: 0.6875rem !important;
		margin-top: 0.125rem !important;
	}

	.akm-events-timeline .akm-events-timeline-item .flex-1.min-w-0 > .flex.flex-wrap.text-slate-600,
	.akm-events-timeline .akm-events-timeline-item .flex-1.min-w-0 > p.text-slate-600 {
		font-size: 13px !important;
	}

	.akm-events-timeline .akm-events-timeline-item .flex.flex-wrap.gap-2 a.inline-flex {
		font-size: 13px !important;
		padding: 0.5rem 1rem !important;
	}

	.akm-events-timeline .akm-timeline-search-input {
		font-size: 14px !important;
	}

	.akm-events-timeline .akm-events-timeline-pagination .font-medium,
	.akm-events-timeline .akm-events-timeline-pagination span {
		font-size: 13px !important;
	}
}

/* Event detail (course layout): typical laptop viewports — tighter type */
@media (min-width: 1024px) and (max-width: 1439px) {
	.akm-course-detail .akm-about-section-main > h3 {
		font-size: 18px !important;
		line-height: 1.3;
	}

	.akm-course-detail .akm-price-row b {
		font-size: 16px !important;
	}

	.akm-course-detail .akm-price-row span span {
		font-size: 13px !important;
	}

	.akm-course-detail .akm-slot-info {
		font-size: 13px !important;
	}

	.akm-course-detail .akm-slot-info span {
		font-size: inherit !important;
	}

	.akm-course-detail .akm-enroll-btn {
		font-size: 13px !important;
		padding: 8px 16px !important;
	}

	.akm-course-detail .akm-tab {
		font-size: 14px !important;
		padding: 10px 16px !important;
	}

	.akm-course-detail .akm-module-title {
		font-size: 17px !important;
	}

	.akm-course-detail .akm-accordion-header {
		font-size: 16px !important;
		padding: 0.75rem 1rem !important;
	}

	.akm-course-detail .akm-accordion-body,
	.akm-course-detail .akm-accordion-body .akm-module-content {
		font-size: 14px !important;
	}

	.akm-course-detail .akm-info-content,
	.akm-course-detail .akm-info-content p,
	.akm-course-detail .akm-module-content p,
	.akm-course-detail .akm-module-content li {
		font-size: 14px !important;
	}

	.akm-course-detail .akm-rich-text li,
	.akm-course-detail ul.akm-rich-text li {
		font-size: 14px !important;
	}

	.akm-course-detail .akm-rich-text h1 {
		font-size: 1.35rem !important;
	}

	.akm-course-detail .akm-rich-text h2 {
		font-size: 1.2rem !important;
	}

	.akm-course-detail .akm-rich-text h3 {
		font-size: 1.1rem !important;
	}

	.akm-course-detail .akm-tab-panel > p {
		font-size: 14px !important;
	}

	.akm-course-detail .akm-details-card h4 {
		font-size: 17px !important;
	}

	.akm-course-detail .akm-details-card h5 {
		font-size: 12px !important;
	}

	.akm-course-detail .akm-details-card p,
	.akm-course-detail .akm-details-card li,
	.akm-course-detail .akm-details-card .akm-reference-link,
	.akm-course-detail .akm-details-card .akm-reference-link a {
		font-size: 13px !important;
	}

	.akm-course-detail .col-lg-4 {
		padding: 1.25rem !important;
	}

	.akm-course-detail .akm-details-card {
		padding: 1.25rem !important;
	}

	.akm-course-detail .container > .row > .col-lg-8 .akm-tab-content {
		font-size: 14px !important;
	}

	.akm-course-detail .container p.text-slate-600 {
		font-size: 14px !important;
	}
}

/* Event registration shortcode: typical laptop viewports — smaller type */
@media (min-width: 1024px) and (max-width: 1439px) {
	.akm-event-registration-form-wrap h2 {
		font-size: 17px !important;
		line-height: 1.35;
	}

	.akm-event-registration-form-wrap h3 {
		font-size: 17px !important;
		line-height: 1.35;
	}

	.akm-event-registration-form-wrap .akm-event-registration-event-card h3 {
		font-size: 15px !important;
	}

	.akm-event-registration-form-wrap .mb-8 > p,
	.akm-event-registration-form-wrap .p-6 > p {
		font-size: 13px !important;
	}

	.akm-event-registration-form-wrap .akm-event-registration-title {
		font-size: 17px !important;
	}

	.akm-event-registration-form-wrap .akm-event-registration-fee {
		font-size: 13px !important;
	}

	.akm-event-registration-form-wrap .bg-slate-50.rounded-lg.border h4 {
		font-size: 13px !important;
	}

	.akm-event-registration-form-wrap .bg-slate-50.rounded-lg.border .space-y-2,
	.akm-event-registration-form-wrap .bg-slate-50.rounded-lg.border .space-y-2 span {
		font-size: 13px !important;
	}

	.akm-event-registration-form-wrap .akm-event-registration-event-card .text-xs {
		font-size: 11px !important;
	}

	.akm-event-registration-form-wrap .akm-event-registration-event-card .w-14 .text-lg {
		font-size: 1rem !important;
	}

	.akm-event-registration-form-wrap .akm-field label {
		font-size: 13px !important;
	}

	.akm-event-registration-form-wrap .akm-event-registration-form input,
	.akm-event-registration-form-wrap .akm-event-registration-form select,
	.akm-event-registration-form-wrap .akm-event-registration-form textarea {
		font-size: 14px !important;
	}

	.akm-event-registration-form-wrap .akm-event-registration-form button[type='submit'] {
		font-size: 14px !important;
	}

	.akm-event-registration-form-wrap .akm-event-registration-message {
		font-size: 13px !important;
	}
}

/* Facility list shortcode: typical laptop viewports — smaller type */
@media (min-width: 1024px) and (max-width: 1439px) {
	.akm-facility-list .akm-facility-list-dates label {
		font-size: 13px !important;
	}

	.akm-facility-list .akm-facility-list-dates input,
	.akm-facility-list .akm-facility-list-dates select {
		font-size: 14px !important;
	}

	.akm-facility-list .akm-list-cart-link {
		font-size: 13px !important;
		padding: 0.5rem 1rem !important;
	}

	.akm-facility-list .akm-facility-card h3 {
		font-size: 16px !important;
		line-height: 1.35;
	}

	.akm-facility-list .akm-facility-card .akm-list-availability,
	.akm-facility-list .akm-facility-card .akm-list-availability-text {
		font-size: 13px !important;
	}

	.akm-facility-list .akm-facility-card-image .text-lg {
		font-size: 1rem !important;
	}

	.akm-facility-list .akm-facility-card .akm-facility-list-add-cart-btn {
		font-size: 13px !important;
		padding: 0.5rem 1rem !important;
	}

	.akm-facility-list .akm-facility-card > .p-5 {
		padding: 1rem 1.25rem !important;
	}

	.akm-facility-list .akm-modal-content h3 {
		font-size: 16px !important;
	}

	.akm-facility-list .akm-modal-content label,
	.akm-facility-list .akm-modal-content .akm-modal-facility-name,
	.akm-facility-list .akm-modal-content #akm-modal-price-display {
		font-size: 13px !important;
	}

	.akm-facility-list .akm-modal-content #akm-modal-dates-display {
		font-size: 13px !important;
	}

	.akm-facility-list .akm-modal-content select,
	.akm-facility-list .akm-modal-content input[type='number'] {
		font-size: 14px !important;
		padding-top: 0.5rem !important;
		padding-bottom: 0.5rem !important;
	}

	.akm-facility-list .akm-modal-content #akm-modal-confirm,
	.akm-facility-list .akm-modal-content #akm-modal-cancel {
		font-size: 13px !important;
		padding: 0.5rem 1rem !important;
	}
}

/* Signature program overlay - rotate from 10 o'clock to 2 o'clock, bounce to upright */
@keyframes akm-overlay-bounce {
	0% {
		transform: translate(-50%, -50%) rotate(-60deg);
	}
	55% {
		transform: translate(-50%, -50%) rotate(60deg);
	}
	75% {
		transform: translate(-50%, -50%) rotate(-8deg);
	}
	88% {
		transform: translate(-50%, -50%) rotate(3deg);
	}
	100% {
		transform: translate(-50%, -50%) rotate(0deg);
	}
}
.akm-signature-overlay {
	transform: translate(-50%, -50%) rotate(-60deg);
	transition: opacity 0.2s ease;
}
.akm-signature-card:hover .akm-signature-overlay {
	animation: akm-overlay-bounce 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* Signature program play button hover */
.akm-signature-play-btn {
	transition: all 0.3s ease;
}
.akm-signature-play-btn:hover {
	transform: translate(-50%, -50%) scale(1.1);
	box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.2), 0 8px 10px -6px rgb(0 0 0 / 0.1);
	background-color: rgb(185 28 28) !important;
}

/* Event registration form message states */
.akm-event-registration-message.akm-message-success {
	background-color: #ecfdf5;
	border: 1px solid #a7f3d0;
	color: #065f46;
}

.akm-event-registration-message.akm-message-error {
	background-color: #fef2f2;
	border: 1px solid #fecaca;
	color: #991b1b;
}

/* Events timeline AJAX loading */
#akm-events-timeline-content.akm-timeline-loading {
	opacity: 0.6;
	pointer-events: none;
}