/* ================================================================
   lidlm-partners — Material Design front-end styles
   ================================================================ */

/* ----------------------------------------------------------------
   CSS custom properties (overridden at runtime by button color)
   ---------------------------------------------------------------- */
:root {
	--lidlm-primary:       #1976d2;
	--lidlm-primary-dark:  #1256a3;
	--lidlm-btn-color:     #1976d2;
	--lidlm-btn-color-dark:#1256a3;
	--lidlm-btn-text-color:#ffffff;
	--lidlm-text:          #212121;
	--lidlm-secondary-text:#757575;
	--lidlm-divider:       #e0e0e0;
	--lidlm-bg-card:       #ffffff;
	--lidlm-bg-surface:    #fafafa;
	--lidlm-radius:        4px;
	/* Material elevation 2dp */
	--lidlm-shadow-2:      0 2px 2px 0 rgba(0,0,0,.14),
	                        0 3px 1px -2px rgba(0,0,0,.12),
	                        0 1px 5px 0 rgba(0,0,0,.20);

	--md-elev-1: 0 1px 2px rgba(0, 0, 0, .10), 0 1px 3px 1px rgba(0, 0, 0, .07);

	/* Material elevation 8dp (hover) */
	--lidlm-shadow-8:      0 8px 10px 1px rgba(0,0,0,.14),
	                        0 3px 14px 2px rgba(0,0,0,.12),
	                        0 5px 5px -3px rgba(0,0,0,.20);
	--lidlm-transition:    0.28s cubic-bezier(.4,0,.2,1);
	--lidlm-font:          'Roboto', system-ui, -apple-system, sans-serif;
}

/* ----------------------------------------------------------------
   Slider wrapper
   ---------------------------------------------------------------- */
.lidlm-partners-slider-wrap {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding: 0 0 1.5rem;
	font-family: var(--lidlm-font);
}

.lidlm-partners-swiper {
	width: 100%;
	padding-bottom: 3rem !important;
}

/* ----------------------------------------------------------------
   Slide card – slider variant (Material card)
   ---------------------------------------------------------------- */
.lidlm-partner-slide {
	height: auto;
}

.lidlm-partner-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	background: var(--lidlm-bg-card);
	border-radius: var(--lidlm-radius);
	box-shadow: var(--lidlm-shadow-2);
	overflow: hidden;
	transition: box-shadow var(--lidlm-transition);
	height: 100%;
	box-sizing: border-box;
}

.lidlm-partner-card:hover {
	box-shadow: var(--lidlm-shadow-8);
}

/* Square logo area inside slider card */
.lidlm-partner-card .lidlm-partner-logo-link,
.lidlm-partner-card > .lidlm-partner-logo-placeholder {
	width: 100%;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

/* ----------------------------------------------------------------
   Logo – shared
   ---------------------------------------------------------------- */
.lidlm-partner-logo-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

/* Logo image — always renders as a square (400×400 source crop).
   Display size adapts per context via container width. */
.lidlm-partner-logo {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: opacity var(--lidlm-transition);
}

.lidlm-partner-logo:hover {
	opacity: .82;
}

.lidlm-partner-logo-placeholder {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: var(--lidlm-primary);
	color: #fff;
	font-size: 28px;
	font-weight: 500;
	font-family: var(--lidlm-font);
	display: flex;
	align-items: center;
	justify-content: center;
	text-transform: uppercase;
	letter-spacing: .02em;
}

/* ----------------------------------------------------------------
   Partner name – slider card (Material body-2)
   ---------------------------------------------------------------- */
.lidlm-partner-name {
	margin: 0;
	padding: 10px 12px 12px;
	margin: 0 0 0 0!important;
	font-family: var(--lidlm-font);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .1px;
	color: var(--lidlm-text);
	text-align: center;
	line-height: 1.4;
	width: 100%;
	box-sizing: border-box;
}

/* ----------------------------------------------------------------
   Swiper nav overrides – Material style
   ---------------------------------------------------------------- */
.lidlm-partners-swiper .swiper-button-prev,
.lidlm-partners-swiper .swiper-button-next {
	color: var(--lidlm-primary);
	background: var(--lidlm-bg-card);
	border-radius: 50%;
	width: 40px;
	height: 40px;
	box-shadow: var(--lidlm-shadow-2);
	top: 40%;
	transition: box-shadow var(--lidlm-transition);
}

.lidlm-partners-swiper .swiper-button-prev:hover,
.lidlm-partners-swiper .swiper-button-next:hover {
	box-shadow: var(--lidlm-shadow-8);
}

.lidlm-partners-swiper .swiper-button-prev::after,
.lidlm-partners-swiper .swiper-button-next::after {
	font-size: 13px;
	font-weight: 700;
}

.lidlm-partners-swiper .swiper-pagination-bullet-active {
	background: var(--lidlm-primary);
}

/* ----------------------------------------------------------------
   Material Design button (filled)
   ---------------------------------------------------------------- */
.lidlm-mdc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	overflow: hidden;
	padding: 0 24px;
	height: 36px;
	min-width: 64px;
	border-radius: 3px;
	font-family: var(--lidlm-font);
	font-size: .875rem;
    font-weight: 500;
    letter-spacing: .0178em;
	text-decoration: none;
	background: var(--lidlm-btn-color)!important;
	color: var(--lidlm-btn-text-color)!important;
	box-shadow: var(--md-elev-1);
	transition: box-shadow var(--lidlm-transition), background var(--lidlm-transition), color var(--lidlm-transition);
	cursor: pointer;
	white-space: nowrap;
}

.lidlm-mdc-btn:hover {
	background: var(--lidlm-btn-color-dark);
	box-shadow: var(--lidlm-shadow-8);
	color: var(--lidlm-btn-text-color);
	text-decoration: none;
}

/* Ripple effect */
.lidlm-mdc-btn::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(255,255,255,.08);
	opacity: 0;
	transition: opacity var(--lidlm-transition);
}
.lidlm-mdc-btn:hover::after { opacity: 1; }

/* Outlined button variant — uses btn-color for border/text */
.lidlm-mdc-btn--outlined {
	background: transparent;
	color: var(--lidlm-btn-color);
	border: 1.5px solid var(--lidlm-btn-color);
	box-shadow: none;
	padding: 0 15px;
	text-transform: none;
	letter-spacing: .02em;
	font-size: 13px;
	height: 32px;
}

.lidlm-mdc-btn--outlined:hover {
	background: color-mix(in srgb, var(--lidlm-btn-color) 8%, transparent);
	color: var(--lidlm-btn-color-dark);
	border-color: var(--lidlm-btn-color-dark);
	box-shadow: none;
}

/* ----------------------------------------------------------------
   "View all" button wrapper
   ---------------------------------------------------------------- */
.lidlm-partners-btn-wrap {
	text-align: center;
	margin-top: 20px;
}

/* Legacy alias */
.lidlm-partners-btn { /* handled by .lidlm-mdc-btn */ }

/* ----------------------------------------------------------------
   Full list grid (Material Design cards)
   ---------------------------------------------------------------- */
.lidlm-partners-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
	padding: 8px 0 16px;
	font-family: var(--lidlm-font);
}

.lidlm-mdc-card {
	background: var(--lidlm-bg-card);
	border-radius: var(--lidlm-radius);
	box-shadow: var(--lidlm-shadow-2);
	overflow: hidden;
	transition: box-shadow var(--lidlm-transition);
	display: flex;
	flex-direction: column;
}

.lidlm-mdc-card:hover {
	box-shadow: var(--lidlm-shadow-8);
}

/* Card media area (logo) — square 1:1 container */
.lidlm-partner-card-logo {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--lidlm-bg-surface);
	border-bottom: 1px solid var(--lidlm-divider);
	padding: 1rem;
}

.lidlm-partner-card-logo .lidlm-partner-logo-link {
	position: absolute;
	inset: 0;
}

.lidlm-partner-card-logo .lidlm-partner-logo-placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

/* Card primary / body */
.lidlm-partner-card-body {
	padding: 16px 16px 20px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

/* Card title – Material headline-6 */
.lidlm-partner-card-name {
	margin: 0 0 8px!important;
	font-family: var(--lidlm-font);
	font-size: 20px;
	font-weight: 500;
	letter-spacing: .15px;
	color: var(--lidlm-text);
	line-height: 1.3;
}

.lidlm-partner-card-name a {
	color: inherit;
	text-decoration: none;
	transition: color var(--lidlm-transition);
}

.lidlm-partner-card-name a:hover {
	color: var(--lidlm-primary);
}

/* Card body text – Material body-2 */
.lidlm-partner-card-desc {
	margin: 0 0 16px;
	font-family: var(--lidlm-font);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .25px;
	color: var(--lidlm-secondary-text);
	line-height: 1.6;
	flex: 1;
}

/* Card action area */
.lidlm-partner-visit-btn {
	align-self: flex-start;
	display: inline-flex;
    margin: auto auto 0;
}

/* ----------------------------------------------------------------
   Description truncation & read-more toggle
   ---------------------------------------------------------------- */
.lidlm-partner-card-desc-wrap {
	flex: 1;
	display: flex;
	flex-direction: column;
	margin-bottom: 16px;
}

.lidlm-partner-card-desc-wrap .lidlm-partner-card-desc {
	margin-bottom: 6px;
	flex: unset;
}

.lidlm-read-more-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	font-family: var(--lidlm-font);
	font-size: 13px;
	font-weight: 500;
	color: var(--lidlm-btn-color);
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color var(--lidlm-transition), opacity var(--lidlm-transition);
	align-self: flex-start;
}

.lidlm-read-more-btn:hover {
	opacity: .75;
}

/* ----------------------------------------------------------------
   Layout variants: column (default) vs row
   ---------------------------------------------------------------- */

/* Column layout — cards stack vertically (logo top, text below) */
.lidlm-partners-list.lidlm-layout-column {
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

/* Row layout — single column list, logo left + text right */
.lidlm-partners-list.lidlm-layout-row {
	grid-template-columns: 1fr;
	gap: 16px;
}

.lidlm-layout-row .lidlm-partner-card-full {
	flex-direction: row;
	align-items: stretch;
	min-height: 180px;
}

.lidlm-layout-row .lidlm-partner-card-logo {
	flex: 0 0 180px;
	width: 180px;
	height: 180px;
	aspect-ratio: unset;
	min-height: unset;
	border-bottom: none;
	border-right: 1px solid var(--lidlm-divider);
}

.lidlm-layout-row .lidlm-partner-card-logo .lidlm-partner-logo {
	/* inherits width/height 100% from base rule */
}

.lidlm-layout-row .lidlm-partner-card-body {
	padding: 16px 20px;
}

/* ----------------------------------------------------------------
   ---------------------------------------------------------------- */
.lidlm-archive-wrap {
	padding: 2rem 1rem 4rem;
	box-sizing: border-box;
	font-family: var(--lidlm-font);
}

.lidlm-archive-inner {
	max-width: 1200px;
	margin: 0 auto;
}

/* Material headline-4 */
.lidlm-archive-title {
	font-family: var(--lidlm-font);
	font-size: 34px;
	font-weight: 400;
	letter-spacing: .25px;
	color: var(--lidlm-text);
	margin: 0 0 32px;
	line-height: 1.2;
}

/* ----------------------------------------------------------------
   No partners message
   ---------------------------------------------------------------- */
.lidlm-no-partners {
	color: var(--lidlm-secondary-text);
	font-family: var(--lidlm-font);
	font-size: 14px;
	padding: 24px 0;
}

/* ----------------------------------------------------------------
   Responsive
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
	.lidlm-archive-title { font-size: 24px; }

	.lidlm-partners-list.lidlm-layout-column {
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
		gap: 16px;
	}

	/* Row layout collapses to column on tablet */
	.lidlm-layout-row .lidlm-partner-card-full {
		flex-direction: column;
	}
	.lidlm-layout-row .lidlm-partner-card-logo {
		flex: unset;
		width: 100%;
		height: auto;
		aspect-ratio: 1 / 1;
		border-right: none;
		border-bottom: 1px solid var(--lidlm-divider);
	}

	.lidlm-partners-swiper .swiper-button-prev,
	.lidlm-partners-swiper .swiper-button-next {
		display: none;
	}
}

@media (max-width: 480px) {
	.lidlm-partner-card-name { font-size: 18px; }

	.lidlm-partner-card-name { font-size: 14px; }

	.lidlm-partners-list.lidlm-layout-column {
		grid-template-columns: 1fr;
	}

	.lidlm-archive-wrap {
		padding: 1.25rem .75rem 3rem;
	}

	.lidlm-partner-card-name { font-size: 18px; }
}