/**
 * Site footer (footer.php), 1.17.0.
 *
 * Same rules as the /my-account/ area: white and grey, purple only for what
 * you can act on, one inner padding for every box. Colours read the theme's
 * custom properties (assets/css/main.css) with literal fallbacks.
 */

.ft {
	--ft-primary: var(--color-primary, #87348c);
	--ft-text: var(--color-primary-text, #2d2832);
	--ft-muted: var(--color-secondary-text, #4b4b4b);
	--ft-border: var(--color-border, #e7e8ea);
	--ft-soft: var(--color-light-gray, #f9f9f9);
	--ft-radius: var(--radius-3xl, 1.5rem);
	--ft-pad: 24px;

	color: var(--ft-text);
	/* The floating account bar is fixed at the bottom at every width; keep
	   the last row clear of it. */
	padding-bottom: 112px;
}
.ft--guest { padding-bottom: 40px; }

.ft a { color: inherit; text-decoration: none; }
.ft a:focus-visible { outline: 2px solid var(--ft-primary); outline-offset: 3px; border-radius: 6px; }
.ft-icon { width: 16px; height: 16px; flex-shrink: 0; }

/* ── Newsletter ─────────────────────────────────────────────────────────── */

.ft-news {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 440px);
	gap: 24px 48px;
	align-items: center;
	padding: 32px var(--ft-pad);
	margin: 40px 0 56px;
	background: var(--ft-soft);
	border: 1px solid var(--ft-border);
	border-radius: var(--ft-radius);
}
.ft-news__label { margin: 0 0 6px; font-size: 0.8125rem; color: var(--ft-muted); }
.ft-news__title {
	margin: 0;
	font-size: 1.375rem;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.01em;
	text-wrap: balance;
}
/* The CF7 field: white on the grey panel, a touch taller than before. */
.ft-news .prcn-newsletter-field {
	background: #fff;
	font-size: 0.9375rem;
	font-weight: 400;
	padding: 12px 16px;
}

/* On account pages the newsletter is off; a thin rule opens the footer. */
.ft-rule { height: 1px; background: var(--ft-border); margin: 24px 0 40px; }

/* ── Brand + links ──────────────────────────────────────────────────────── */

.ft-main {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	gap: 48px;
	padding: 8px 0 48px;
}
.ft-brand { display: flex; flex-direction: column; gap: 16px; max-width: 380px; }
.ft-brand .custom-logo-link { align-self: flex-start; }
.ft-brand .custom-logo { height: 36px; width: auto; }
.ft-brand__line { margin: 0; font-size: 1.125rem; font-weight: 600; letter-spacing: -0.01em; }

.ft-contact { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.ft-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 14px;
	font-size: 0.875rem;
	font-weight: 500;
	border: 1px solid var(--ft-border);
	border-radius: 9999px;
	background: #fff;
	transition: border-color 150ms ease, color 150ms ease, transform 200ms ease;
}
.ft-chip:hover { border-color: #d9dadd; color: var(--ft-primary); transform: translateY(-1px); }

.ft-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.ft-links__title { margin: 0 0 14px; font-size: 0.8125rem; font-weight: 500; color: var(--ft-muted); letter-spacing: 0; }
.ft-links ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ft-links li { padding: 0; }
.ft-links a { font-size: 0.9375rem; transition: color 150ms ease; }
.ft-links a:hover { color: var(--ft-primary); }

/* ── Bottom row ─────────────────────────────────────────────────────────── */

.ft-bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	padding-top: 24px;
	border-top: 1px solid var(--ft-border);
	font-size: 0.8125rem;
	color: var(--ft-muted);
}
.ft--guest .ft-bottom { margin-top: 40px; }
.ft-legal { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
.ft-copy { margin: 0; }
.ft-legal__menu ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; }
.ft-legal__menu li { padding: 0; }
.ft-legal__menu a { transition: color 150ms ease; }
.ft-legal__menu a:hover { color: var(--ft-text); }

.ft-tools { display: flex; align-items: center; gap: 12px; }

/* Language: both options, flag and code on one centre line. */
.ft-lang {
	display: inline-flex;
	gap: 2px;
	padding: 3px;
	background: var(--ft-soft);
	border: 1px solid var(--ft-border);
	border-radius: 9999px;
}
.ft-lang a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px;
	border-radius: 9999px;
	line-height: 1;
	color: var(--ft-muted);
	transition: color 150ms ease, background-color 150ms ease;
}
.ft-lang a:hover { color: var(--ft-text); }
.ft-lang a[aria-current="true"] { background: #fff; color: var(--ft-text); font-weight: 500; box-shadow: 0 1px 3px rgba(45, 40, 50, 0.08); }
.ft-lang img { width: 16px; height: 16px; border-radius: 50%; object-fit: cover; display: block; }

.ft-top {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--ft-border);
	border-radius: 50%;
	background: #fff;
	transition: transform 200ms ease, box-shadow 200ms ease;
}
.ft-top:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(45, 40, 50, 0.08); }

/* ── Phones ─────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
	.ft { --ft-pad: 20px; }
	.ft-news { grid-template-columns: 1fr; padding: 24px var(--ft-pad); margin: 32px 0 40px; }
	.ft-main { grid-template-columns: 1fr; gap: 32px; padding-bottom: 32px; }
	.ft-links { gap: 24px; }
	.ft-bottom { flex-direction: column-reverse; align-items: flex-start; }
	.ft-tools { width: 100%; justify-content: space-between; }
}