/**
 * Calma Course Widget — layout og design tokens.
 *
 * ALT er scopet til .elementor-element.elementor-widget-calma_course_level_grid
 * slik at Elementor/tema-regler (button, a, typografi) ikke overstyrer skissen.
 */

/* -------------------------------------------------------------------------
   Design tokens (kun inne i widgeten)
   ------------------------------------------------------------------------- */
.elementor-element.elementor-widget-calma_course_level_grid .ccw-course-grid {
	--ccw-surface: #f5f2e9;
	--ccw-on-bg: #1c1c17;
	--ccw-muted: #5e5e5e;
	--ccw-card-bg: #ffffff;
	--ccw-tab-active-border: #b1994f;
	--ccw-tab-active-color: #b1994f;
	--ccw-tab-idle-border: #e7e5e0;
	--ccw-tab-idle-color: #78716c;
	--ccw-btn-bg: #000000;
	--ccw-btn-fg: #ffffff;
	--ccw-btn-hover-bg: #b1994f;

	box-sizing: border-box;
	background: var(--ccw-surface) !important;
	color: var(--ccw-on-bg);
	padding: 2rem 0 4rem;
	font-family: "Montserrat", system-ui, -apple-system, sans-serif;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-course-grid,
.elementor-element.elementor-widget-calma_course_level_grid .ccw-course-grid *,
.elementor-element.elementor-widget-calma_course_level_grid .ccw-course-grid *::before,
.elementor-element.elementor-widget-calma_course_level_grid .ccw-course-grid *::after {
	box-sizing: border-box;
}

/* -------------------------------------------------------------------------
   Faner — skisse: rektangulære «chips», aktiv = tynn gull/karamell ramme + tekst
   Inaktiv = lys grå ramme, stone tekst; hover ≈ aktiv (Tailwind-skissen).
   !important: tema og Elementor overstyrer ofte knapper globalt.
   ------------------------------------------------------------------------- */
.elementor-element.elementor-widget-calma_course_level_grid .ccw-tabs {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	align-items: center !important;
	gap: 1rem !important;
	row-gap: 1rem !important;
	margin: 0 auto 2.5rem !important;
	padding: 0 !important;
	list-style: none !important;
	border: none !important;
	background: transparent !important;
	box-shadow: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-tabs .ccw-tab {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	max-width: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0.75rem 2rem !important;
	cursor: pointer !important;

	font-family: "Montserrat", system-ui, -apple-system, sans-serif !important;
	font-size: 12px !important;
	font-style: normal !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	text-align: center !important;
	white-space: normal !important;

	color: var(--ccw-tab-idle-color) !important;
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;

	border: 1px solid var(--ccw-tab-idle-border) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	outline: none !important;

	-webkit-appearance: none !important;
	appearance: none !important;

	transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-tabs .ccw-tab:hover,
.elementor-element.elementor-widget-calma_course_level_grid .ccw-tabs .ccw-tab:focus-visible {
	color: var(--ccw-tab-active-color) !important;
	border-color: var(--ccw-tab-active-border) !important;
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	outline: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-tabs .ccw-tab.is-active {
	color: var(--ccw-tab-active-color) !important;
	border-color: var(--ccw-tab-active-border) !important;
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-panel[hidden] {
	display: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-panel.is-active {
	display: block !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-panel.ccw-panel--loading {
	opacity: 0.55 !important;
	pointer-events: none !important;
	transition: opacity 0.2s ease !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-panel__body {
	min-height: 0 !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-grid {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: 3rem !important;
	max-width: 1200px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding: 0 !important;
}

@media (min-width: 768px) {
	.elementor-element.elementor-widget-calma_course_level_grid .ccw-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

/* Paginering (WordPress paginate_links → ul.page-numbers) */
.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination {
	margin: 2.5rem auto 0 !important;
	padding: 0 !important;
	max-width: 1200px !important;
	display: block !important;
	border: none !important;
	background: transparent !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination .page-numbers {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 0.5rem 1rem !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination .page-numbers li {
	display: inline-flex !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	border: none !important;
	background: transparent !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination .page-numbers a,
.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination .page-numbers span {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 2.5rem !important;
	padding: 0.5rem 0.85rem !important;
	margin: 0 !important;

	font-family: "Montserrat", system-ui, -apple-system, sans-serif !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.08em !important;
	line-height: 1.2 !important;
	text-transform: uppercase !important;
	text-decoration: none !important;

	color: var(--ccw-tab-idle-color) !important;
	background: transparent !important;
	border: 1px solid var(--ccw-tab-idle-border) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination .page-numbers a:hover,
.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination .page-numbers a:focus-visible {
	color: var(--ccw-tab-active-color) !important;
	border-color: var(--ccw-tab-active-border) !important;
	background: transparent !important;
	outline: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination .page-numbers span.current {
	color: var(--ccw-on-bg) !important;
	border-color: var(--ccw-on-bg) !important;
	background: rgba(255, 255, 255, 0.6) !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-pagination .page-numbers span.dots {
	border-color: transparent !important;
	min-width: auto !important;
	padding-left: 0.25rem !important;
	padding-right: 0.25rem !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card {
	display: flex !important;
	flex-direction: column !important;
	background: var(--ccw-card-bg) !important;
	border: 1px solid #f1efe8 !important;
	border-radius: 0 !important;
	overflow: hidden !important;
	box-shadow: none !important;
	transition: box-shadow 0.25s ease !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card:hover {
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.05) !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__media {
	position: relative !important;
	overflow: hidden !important;
	aspect-ratio: 16 / 9 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	vertical-align: middle !important;
	transition: transform 0.7s ease !important;
	max-width: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card:hover .ccw-card__img {
	transform: scale(1.05) !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__img--placeholder {
	background: linear-gradient(135deg, #ebe8df, #ddd9cd) !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-price-badge {
	position: absolute !important;
	top: 1rem !important;
	left: 1rem !important;
	background: rgba(255, 255, 255, 0.92) !important;
	padding: 0.35rem 0.65rem !important;
	font-family: "Montserrat", system-ui, -apple-system, sans-serif !important;
	font-size: 0.75rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.08em !important;
	line-height: 1.2 !important;
	text-transform: uppercase !important;
	color: var(--ccw-on-bg) !important;
	margin: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-wave {
	display: block !important;
	line-height: 0 !important;
	margin-top: -1px !important;
	color: var(--ccw-card-bg) !important;
	padding: 0 !important;
	border: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-wave svg {
	display: block !important;
	width: 100% !important;
	height: 1.5rem !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__body {
	padding: 2rem !important;
	display: flex !important;
	flex-direction: column !important;
	flex-grow: 1 !important;
	background: var(--ccw-card-bg) !important;
	margin: 0 !important;
	border: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__body--wavy {
	padding-top: 0.5rem !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__title {
	font-family: "Playfair Display", Georgia, "Times New Roman", serif !important;
	font-size: 1.5rem !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	margin: 0 0 1rem !important;
	padding: 0 !important;
	color: var(--ccw-on-bg) !important;
	border: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__excerpt {
	font-family: "Montserrat", system-ui, -apple-system, sans-serif !important;
	font-size: 1rem !important;
	line-height: 1.6 !important;
	font-weight: 400 !important;
	color: var(--ccw-muted) !important;
	margin: 0 0 1.75rem !important;
	padding: 0 !important;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden !important;
	border: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__btn {
	align-self: flex-start !important;
	margin-top: auto !important;
	margin-bottom: 0 !important;
	display: inline-block !important;
	text-decoration: none !important;
	background: var(--ccw-btn-bg) !important;
	background-image: none !important;
	color: var(--ccw-btn-fg) !important;
	padding: 1rem 2.5rem !important;
	font-family: "Montserrat", system-ui, -apple-system, sans-serif !important;
	font-size: 0.75rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	line-height: 1.2 !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	transition: background-color 0.2s ease, color 0.2s ease !important;
	width: auto !important;
	max-width: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__btn:hover,
.elementor-element.elementor-widget-calma_course_level_grid .ccw-card__btn:focus-visible {
	background: var(--ccw-btn-hover-bg) !important;
	background-image: none !important;
	color: #ffffff !important;
	outline: none !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

.elementor-element.elementor-widget-calma_course_level_grid .ccw-empty {
	text-align: center !important;
	font-family: "Montserrat", system-ui, -apple-system, sans-serif !important;
	color: var(--ccw-muted) !important;
	margin: 0 !important;
	padding: 2rem 1rem !important;
	border: none !important;
}