/* Tennispadel.ch — modern reskin v1 (homepage) */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700;800;900&display=swap');

:root {
	--tp-court-green: #1FAE59;
	--tp-court-green-dark: #146638;
	--tp-clay-orange: #D2691E;
	--tp-neon: #D4FF04;
	--tp-navy: #0D1B2A;
	--tp-offwhite: #F7F5F0;
}

/* Base content area */
body.home #content {
	background: var(--tp-offwhite);
}

/* Header — modernize nav, socials, sticky shadow (background left as-is: unknown logo colors) */
.elementor-location-header {
	border-bottom: 3px solid var(--tp-court-green);
}
.elementor-element-1ad81faf {
	box-shadow: 0 2px 16px rgba(13,27,42,0.08) !important;
}
.elementor-element-9183386 .elementor-nav-menu--main .elementor-item {
	font-family: 'Poppins', sans-serif !important;
	font-weight: 700 !important;
	color: var(--tp-navy) !important;
	font-size: 15px;
}
.elementor-element-9183386 .elementor-nav-menu--main .elementor-item:hover {
	color: var(--tp-court-green-dark) !important;
}
.elementor-element-9183386 .elementor-nav-menu--dropdown {
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(13,27,42,0.15);
}
.elementor-element-9183386 .elementor-sub-item {
	transition: background-color 0.15s ease, color 0.15s ease;
}
.elementor-element-9183386 .elementor-sub-item:hover {
	background-color: var(--tp-offwhite) !important;
	color: var(--tp-court-green-dark) !important;
}
/* Social icons — single brand color instead of the default multicolor network badges */
.elementor-element-f865db3 .elementor-social-icon {
	background-color: var(--tp-navy) !important;
	transition: background-color 0.15s ease, transform 0.15s ease;
}
.elementor-element-f865db3 .elementor-social-icon:hover {
	background-color: var(--tp-court-green-dark) !important;
	transform: translateY(-2px);
	opacity: 1;
}

/* Global left/right breathing room on every page (reduced on small screens) */
.elementor-section.elementor-section-boxed > .elementor-container {
	padding-left: 50px;
	padding-right: 50px;
}
@media (max-width: 767px) {
	.elementor-section.elementor-section-boxed > .elementor-container {
		padding-left: 16px;
		padding-right: 16px;
	}
}

/* Awin affiliate links/banners — hide everywhere on the site, not just the footer */
a[href*="awin1.com"],
a[href*="awin.com"] {
	display: none !important;
}
.elementor-widget-html:has(a[href*="awin1.com"]),
.elementor-widget-html:has(a[href*="awin.com"]) {
	display: none !important;
}

/* Headings — bold, condensed, modern */
.elementor-heading-title,
.elementor-widget-heading h1,
.elementor-widget-heading h2,
.elementor-widget-heading h3 {
	font-family: 'Poppins', sans-serif !important;
	font-weight: 800 !important;
	letter-spacing: -0.01em;
	color: var(--tp-navy);
}

/* Hero section — homepage. Keep the existing photo, just tint the overlay + diagonal cut */
.elementor-element-2239ea7f {
	position: relative;
	clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
}
.elementor-element-2239ea7f > .elementor-background-overlay {
	background: linear-gradient(120deg, rgba(20,102,56,0.78) 0%, rgba(31,174,89,0.55) 55%, rgba(13,27,42,0.8) 100%) !important;
	opacity: 1 !important;
}
.elementor-element-2239ea7f .elementor-heading-title {
	color: #ffffff !important;
	font-size: clamp(28px, 5vw, 46px) !important;
	text-align: center;
	text-shadow: 0 2px 12px rgba(0,0,0,0.35);
}

/* Title band — every other page. Keep the existing photo, just tint the overlay (no effect if the section has no overlay to begin with) */
.elementor-element-1ad81faf + .elementor-top-section > .elementor-background-overlay {
	background: linear-gradient(120deg, rgba(20,102,56,0.78) 0%, rgba(31,174,89,0.55) 55%, rgba(13,27,42,0.8) 100%) !important;
	opacity: 1 !important;
}
.elementor-element-1ad81faf + .elementor-top-section .elementor-heading-title,
.elementor-element-1ad81faf + .elementor-top-section h1,
.elementor-element-1ad81faf + .elementor-top-section h2 {
	color: #ffffff !important;
	text-shadow: 0 2px 12px rgba(0,0,0,0.35);
}

/* Buttons — pill shape, neon accent */
.elementor-button,
.elementor-button-link,
a.elementor-button {
	background-color: var(--tp-neon) !important;
	color: var(--tp-navy) !important;
	border-radius: 999px !important;
	font-weight: 700 !important;
	padding: 14px 28px !important;
	border: none !important;
	transition: transform 0.18s ease, box-shadow 0.18s ease !important;
	box-shadow: 0 4px 14px rgba(13,27,42,0.15);
}
.elementor-button:hover,
a.elementor-button:hover {
	transform: translateY(-2px) scale(1.02);
	box-shadow: 0 8px 20px rgba(13,27,42,0.22);
	color: var(--tp-navy) !important;
}

/* Content "cards" — any column/box with an explicit background becomes a soft card */
.elementor-column[data-settings*="background_background"] > .elementor-widget-wrap,
.elementor-widget-wrap.elementor-element-populated {
	border-radius: 14px;
}
.elementor-column[data-settings*="\"background_background\":\"classic\""] {
	box-shadow: 0 4px 24px rgba(13,27,42,0.08);
	border-radius: 14px;
	overflow: hidden;
}

/* Links inside body copy */
#content a:not(.elementor-button):not(.elementor-icon):not(.elementor-social-icon) {
	color: var(--tp-court-green-dark);
	text-decoration-thickness: 1.5px;
}
#content a:not(.elementor-button):not(.elementor-icon):not(.elementor-social-icon):hover {
	color: var(--tp-clay-orange);
}

/* Section spacing — a bit more breathing room */
.elementor-top-section {
	padding-top: 10px;
}

/* Data tables in article content — wrapped in a scroll container (needs responsive-tables.js)
   so the table itself keeps a normal grid layout (display:table) instead of breaking alignment. */
#content .elementor-widget-text-editor {
	max-width: 100%;
}
#content .tp-table-wrap {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid rgba(13,27,42,0.1);
	border-radius: 12px;
	margin-bottom: 20px;
}
#content .tp-table-wrap table {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
	border: none;
}
#content .tp-table-wrap th,
#content .tp-table-wrap td {
	padding: 8px 12px;
	border: 1px solid rgba(13,27,42,0.1);
	white-space: nowrap;
}
#content .tp-table-wrap thead th,
#content .tp-table-wrap tr:first-child td.tp-header-row {
	background: var(--tp-court-green-dark);
	color: #ffffff;
}

/* Mobile — stack tables as cards instead of horizontal scroll, only when a real header was detected */
@media (max-width: 680px) {
	#content .tp-table-wrap:has(table.tp-responsive-table) {
		border: none;
		overflow-x: visible;
	}
	#content table.tp-responsive-table {
		display: block;
	}
	#content table.tp-responsive-table thead,
	#content table.tp-responsive-table tr:first-child.tp-header-row {
		display: none;
	}
	#content table.tp-responsive-table tbody,
	#content table.tp-responsive-table tr {
		display: block;
		width: 100%;
	}
	#content table.tp-responsive-table tr {
		margin-bottom: 16px;
		border: 1px solid rgba(13,27,42,0.12);
		border-radius: 12px;
		overflow: hidden;
		box-shadow: 0 2px 10px rgba(13,27,42,0.06);
	}
	#content table.tp-responsive-table td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 12px;
		white-space: normal;
		text-align: right;
		border: none;
		border-bottom: 1px solid rgba(13,27,42,0.08);
	}
	#content table.tp-responsive-table td:last-child {
		border-bottom: none;
	}
	#content table.tp-responsive-table td::before {
		content: attr(data-label);
		font-weight: 700;
		color: var(--tp-court-green-dark);
		text-align: left;
		flex-shrink: 0;
	}
}

/* Images — soften hard corners site-wide */
.elementor-widget-image img,
.woocommerce ul.products li.product img {
	border-radius: 10px;
}

/* WooCommerce — native buttons (cart, checkout, my-account, single product) */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-Button {
	background-color: var(--tp-neon) !important;
	color: var(--tp-navy) !important;
	border-radius: 999px !important;
	font-weight: 700 !important;
	padding: 12px 24px !important;
	border: none !important;
	transition: transform 0.18s ease, box-shadow 0.18s ease !important;
	box-shadow: 0 4px 14px rgba(13,27,42,0.15);
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background-color: var(--tp-neon) !important;
	color: var(--tp-navy) !important;
	transform: translateY(-2px) scale(1.02);
}

/* WooCommerce — price color */
.woocommerce .price,
.woocommerce-Price-amount {
	color: var(--tp-court-green-dark);
	font-weight: 700;
}

/* WooCommerce — product cards */
.woocommerce ul.products li.product {
	border-radius: 14px;
	box-shadow: 0 4px 20px rgba(13,27,42,0.08);
	padding: 12px;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.woocommerce ul.products li.product:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 28px rgba(13,27,42,0.14);
}

/* Footer — hide the Awin affiliate banner widget */
.elementor-element-65696c8 {
	display: none !important;
}

/* Footer — modernize (background is already black; fix contrast + add polish) */
.elementor-location-footer {
	border-top: 4px solid var(--tp-neon);
}
.elementor-location-footer .elementor-heading-title {
	color: var(--tp-neon) !important;
	text-transform: uppercase;
	font-size: 16px !important;
	letter-spacing: 0.06em;
}
.elementor-location-footer p,
.elementor-location-footer .elementor-icon-list-text {
	color: rgba(255,255,255,0.75) !important;
}
.elementor-location-footer .elementor-icon-list-items {
	margin-top: 8px;
}
.elementor-location-footer .elementor-icon-list-item {
	margin-bottom: 10px;
}
.elementor-location-footer a {
	transition: color 0.15s ease;
}
.elementor-location-footer .elementor-icon-list-text:hover,
.elementor-location-footer a:hover .elementor-icon-list-text {
	color: var(--tp-neon) !important;
}
/* Logo — ensure visibility regardless of the logo file's own colors (scoped to the image
   itself, not the whole widget, so the tagline moved below it isn't stuck on a white plate) */
.elementor-element-bb8c045 img {
	background: #ffffff;
	border-radius: 14px;
	padding: 10px;
}
.elementor-element-bb8c045 .elementor-widget-container {
	text-align: center;
}
/* Tagline, relocated under the logo by responsive-tables.js */
.elementor-element-bb8c045 .elementor-widget-container p {
	margin-top: 12px;
	color: rgba(255,255,255,0.8) !important;
}
.elementor-element-bb8c045 .elementor-widget-container p strong {
	color: #ffffff;
}

/* Tagline column is now empty (its text moved under the logo) — hide it and redistribute
   the remaining three footer columns evenly */
.elementor-element-3dd5c0a {
	display: none !important;
}
.elementor-element-7d1920f0,
.elementor-element-56427290,
.elementor-element-3fd7f2e3 {
	width: 33.333% !important;
	flex-basis: 33.333% !important;
}
/* Bottom bar — subtle separator + muted, smaller text */
.elementor-element-336a4d2c {
	border-top: 1px solid rgba(255,255,255,0.12);
	margin-top: 10px;
	padding-top: 20px !important;
}
.elementor-element-336a4d2c p,
.elementor-element-336a4d2c a {
	color: rgba(255,255,255,0.55) !important;
	font-size: 13px;
}
.elementor-element-755dfe41 {
	text-align: right;
}
@media (max-width: 767px) {
	.elementor-element-755dfe41 {
		text-align: left;
	}
}

/* Article/location pages ("terrain-padel-*" etc.) — the ad-sidebar column (identifiable by
   its gradient background setting) is now empty since the Awin ad inside it is hidden.
   Drop it and let the content column take the full width. Applies to every page using this
   pattern, regardless of its specific element IDs.
   To bring a sidebar back later (e.g. for Decathlon affiliate links), just delete this block. */
.elementor-column[data-settings*="\"background_background\":\"gradient\""] {
	display: none !important;
}
.elementor-column[data-settings*="\"background_background\":\"gradient\""] ~ .elementor-column,
.elementor-column:has(~ .elementor-column[data-settings*="\"background_background\":\"gradient\""]) {
	width: 100% !important;
	flex-basis: 100% !important;
	max-width: 100% !important;
}