/* ==========================================================================
   Madalice Returns
   Scoped to .mr-returns-app (form) and .ma-returns (policy page) so nothing
   leaks into the surrounding theme.
   ========================================================================== */

.mr-returns-app,
.ma-returns {
	--ma-ink: #1a1526;
	--ma-ink-soft: #5d5670;
	--ma-ink-faint: #8e87a0;
	--ma-paper: #ffffff;
	--ma-wash: #f8f6fb;
	--ma-line: #e8e3f0;
	--ma-line-strong: #d5cee2;
	--ma-accent: #c2185b;
	--ma-accent-deep: #8e1145;
	--ma-accent-wash: #fdf2f7;
	--ma-warn-wash: #fff9f2;
	--ma-warn-line: #e8c9a4;
	--ma-warn-ink: #9a5a18;

	--ma-radius: 12px;
	--ma-ease: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================================================
   Returns form
   ========================================================================== */

.mr-returns-app {
	max-width: 620px;
	margin: 0 auto;
	color: var(--ma-ink);
	line-height: 1.6;
}

.mr-returns-app h2 {
	margin: 0 0 12px;
	letter-spacing: -0.015em;
}

.mr-intro {
	background: var(--ma-wash);
	border-radius: var(--ma-radius);
	padding: 20px 22px;
	margin-bottom: 28px;
	color: var(--ma-ink-soft);
	font-size: 15.5px;
}

.mr-intro p { margin: 0 0 10px; }
.mr-intro p:last-child { margin-bottom: 0; }

.mr-field { margin-bottom: 18px; }

.mr-field label {
	display: block;
	font-weight: 600;
	margin-bottom: 6px;
	font-size: 14.5px;
	letter-spacing: 0.01em;
}

.mr-field input,
.mr-field textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--ma-line-strong);
	border-radius: 8px;
	box-sizing: border-box;
	font-size: 16px;
	font-family: inherit;
	color: var(--ma-ink);
	background: var(--ma-paper);
	transition: border-color 0.15s var(--ma-ease), box-shadow 0.15s var(--ma-ease);
}

.mr-field input:focus,
.mr-field textarea:focus {
	outline: none;
	border-color: var(--ma-accent);
	box-shadow: 0 0 0 3px var(--ma-accent-wash);
}

.mr-button {
	background: var(--ma-ink);
	color: #fff;
	border: none;
	padding: 14px 26px;
	border-radius: 8px;
	cursor: pointer;
	font-size: 16px;
	font-weight: 600;
	font-family: inherit;
	transition: background 0.15s var(--ma-ease), transform 0.1s var(--ma-ease);
}

.mr-button:hover:not(:disabled) { background: var(--ma-accent); }
.mr-button:active:not(:disabled) { transform: translateY(1px); }

.mr-button:focus-visible {
	outline: 2px solid var(--ma-accent);
	outline-offset: 3px;
}

.mr-button:disabled { opacity: 0.55; cursor: not-allowed; }

.mr-error {
	color: #b3261e;
	margin-top: 12px;
	font-size: 15px;
}

.mr-item-row {
	border: 1px solid var(--ma-line);
	border-radius: 10px;
	padding: 16px 18px;
	margin-bottom: 10px;
	transition: border-color 0.15s var(--ma-ease), background 0.15s var(--ma-ease);
}

.mr-item-row:has(.mr-item-select:checked) {
	border-color: var(--ma-accent);
	background: var(--ma-accent-wash);
}

.mr-item-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
	line-height: 1.5;
}

.mr-item-checkbox input { margin-top: 4px; flex-shrink: 0; }

.mr-item-details {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--ma-line);
	display: flex;
	gap: 22px;
	flex-wrap: wrap;
}

.mr-item-details label {
	display: flex;
	flex-direction: column;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ma-ink-soft);
}

.mr-item-details select {
	margin-top: 5px;
	padding: 9px 10px;
	border: 1px solid var(--ma-line-strong);
	border-radius: 7px;
	font-size: 15px;
	font-family: inherit;
	background: var(--ma-paper);
	color: var(--ma-ink);
}

.mr-warning {
	background: var(--ma-warn-wash);
	border: 1px solid var(--ma-warn-line);
	border-radius: var(--ma-radius);
	padding: 18px 20px;
	margin: 26px 0 18px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--ma-ink-soft);
}

.mr-warning > strong {
	display: block;
	margin-bottom: 10px;
	color: var(--ma-warn-ink);
	font-size: 14px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.mr-warning p { margin: 0 0 10px; }
.mr-warning p:last-child { margin-bottom: 0; }
.mr-warning ul { margin: 0 0 12px; padding-left: 20px; }
.mr-warning li { margin-bottom: 7px; }
.mr-warning li strong { color: var(--ma-ink); }
.mr-warning a { color: var(--ma-accent-deep); }

.mr-ack {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	margin: 0 0 20px;
	padding: 14px 16px;
	border: 1px solid var(--ma-line-strong);
	border-radius: 10px;
	font-size: 15px;
	cursor: pointer;
	line-height: 1.5;
	transition: border-color 0.15s var(--ma-ease), background 0.15s var(--ma-ease);
}

.mr-ack:hover { border-color: var(--ma-accent); }
.mr-ack:has(input:checked) { border-color: var(--ma-accent); background: var(--ma-accent-wash); }
.mr-ack input { margin-top: 3px; flex-shrink: 0; }

.mr-next-steps {
	background: var(--ma-wash);
	border-radius: 10px;
	padding: 16px 18px;
	margin: 0 0 22px;
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--ma-ink-soft);
}

.mr-next-steps strong { color: var(--ma-ink); }

/* ==========================================================================
   Returns & Refunds policy page
   ========================================================================== */

.ma-returns {
	max-width: 740px;
	margin: 0 auto;
	color: var(--ma-ink);
	line-height: 1.7;
	font-size: 16.5px;
}

.ma-lede {
	font-size: 19px;
	line-height: 1.55;
	color: var(--ma-ink-soft);
	margin: 0 0 40px;
	max-width: 54ch;
	letter-spacing: -0.005em;
}

/* Two-door entry: most people are in one of two situations */
.ma-quick {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 16px;
	margin: 0 0 56px;
}

.ma-quick-card {
	position: relative;
	background: var(--ma-paper);
	border: 1px solid var(--ma-line);
	border-radius: var(--ma-radius);
	padding: 24px 24px 26px;
	display: flex;
	flex-direction: column;
	transition: border-color 0.18s var(--ma-ease), transform 0.18s var(--ma-ease), box-shadow 0.18s var(--ma-ease);
}

.ma-quick-card:hover {
	border-color: var(--ma-line-strong);
	transform: translateY(-2px);
	box-shadow: 0 8px 24px -12px rgba(26, 21, 38, 0.22);
}

.ma-quick-card h2 {
	font-size: 12.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0 0 10px;
	color: var(--ma-accent);
	font-weight: 700;
}

.ma-quick-card p {
	margin: 0 0 20px;
	font-size: 15.5px;
	color: var(--ma-ink-soft);
	flex-grow: 1;
	line-height: 1.55;
}

.ma-btn {
	display: inline-block;
	align-self: flex-start;
	background: var(--ma-ink);
	color: #fff !important;
	text-decoration: none !important;
	font-size: 15px;
	font-weight: 600;
	padding: 12px 22px;
	border-radius: 8px;
	transition: background 0.15s var(--ma-ease);
}

.ma-btn:hover, .ma-btn:focus-visible { background: var(--ma-accent); }

.ma-btn:focus-visible {
	outline: 2px solid var(--ma-accent);
	outline-offset: 3px;
}

.ma-section-title {
	font-size: 12.5px;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--ma-ink-faint);
	margin: 52px 0 4px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--ma-line);
}

.ma-section-title:first-of-type { margin-top: 0; }

/* Accordion. The accent bar on the left is the signature detail — it grows
   from nothing when a question opens, like a brush stroke down the margin. */
.ma-faq {
	border-bottom: 1px solid var(--ma-line);
	position: relative;
}

.ma-faq::before {
	content: "";
	position: absolute;
	left: -14px;
	top: 14px;
	bottom: 14px;
	width: 2px;
	background: var(--ma-accent);
	border-radius: 2px;
	transform: scaleY(0);
	transform-origin: top;
	transition: transform 0.28s var(--ma-ease);
}

.ma-faq[open]::before { transform: scaleY(1); }

.ma-faq summary {
	cursor: pointer;
	list-style: none;
	padding: 20px 44px 20px 0;
	font-size: 17.5px;
	font-weight: 600;
	letter-spacing: -0.01em;
	position: relative;
	transition: color 0.15s var(--ma-ease);
}

.ma-faq summary::-webkit-details-marker { display: none; }
.ma-faq summary:hover { color: var(--ma-accent); }

.ma-faq summary:focus-visible {
	outline: 2px solid var(--ma-accent);
	outline-offset: 4px;
	border-radius: 4px;
}

/* Chevron drawn in CSS so there's no icon font dependency */
.ma-faq summary::after {
	content: "";
	position: absolute;
	right: 10px;
	top: 50%;
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--ma-accent);
	border-bottom: 2px solid var(--ma-accent);
	transform: translateY(-70%) rotate(45deg);
	transition: transform 0.28s var(--ma-ease);
}

.ma-faq[open] summary::after { transform: translateY(-20%) rotate(225deg); }

.ma-faq-body {
	padding: 0 0 26px;
	font-size: 16px;
	color: var(--ma-ink-soft);
	max-width: 64ch;
	animation: ma-reveal 0.28s var(--ma-ease);
}

@keyframes ma-reveal {
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: none; }
}

.ma-faq-body p { margin: 0 0 15px; }
.ma-faq-body p:last-child { margin-bottom: 0; }
.ma-faq-body ul, .ma-faq-body ol { margin: 0 0 15px; padding-left: 20px; }
.ma-faq-body li { margin-bottom: 10px; padding-left: 3px; }
.ma-faq-body li::marker { color: var(--ma-accent); font-weight: 600; }
.ma-faq-body strong { color: var(--ma-ink); font-weight: 600; }

.ma-faq-body a {
	color: var(--ma-accent-deep);
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

.ma-faq-body a:hover { color: var(--ma-accent); }

.ma-callout {
	background: var(--ma-accent-wash);
	padding: 16px 18px;
	border-radius: 10px;
	margin: 18px 0 0;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--ma-ink-soft);
}

.ma-callout strong { color: var(--ma-accent-deep); }

.ma-contact {
	margin-top: 60px;
	background: var(--ma-wash);
	border-radius: var(--ma-radius);
	padding: 30px 32px;
}

.ma-contact h2 {
	margin: 0 0 8px;
	font-size: 21px;
	letter-spacing: -0.015em;
}

.ma-contact p {
	margin: 0 0 20px;
	color: var(--ma-ink-soft);
	font-size: 15.5px;
}

.ma-contact-links { display: flex; flex-wrap: wrap; gap: 10px; }

.ma-contact-links a {
	background: var(--ma-paper);
	border: 1px solid var(--ma-line-strong);
	border-radius: 8px;
	padding: 11px 20px;
	text-decoration: none !important;
	color: var(--ma-ink) !important;
	font-size: 15px;
	font-weight: 600;
	transition: border-color 0.15s var(--ma-ease), color 0.15s var(--ma-ease);
}

.ma-contact-links a:hover {
	border-color: var(--ma-accent);
	color: var(--ma-accent) !important;
}

/* ==========================================================================
   Responsive + accessibility
   ========================================================================== */

@media (max-width: 640px) {
	.ma-returns { font-size: 16px; }
	.ma-lede { font-size: 17.5px; margin-bottom: 32px; }
	.ma-quick { margin-bottom: 40px; }
	.ma-quick-card { padding: 20px; }
	.ma-faq summary { font-size: 16.5px; padding: 18px 36px 18px 0; }
	.ma-faq::before { left: -8px; }
	.ma-section-title { margin-top: 40px; }
	.ma-contact { padding: 24px 22px; }
	.ma-contact-links a { flex: 1 1 auto; text-align: center; }
	.mr-item-details { gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
	.mr-returns-app *,
	.ma-returns * {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}
