/* ==========================================================================
   account-f2-plans.css — Välj foderplan · Meny · FAQ på /mitt-konto/food-plan/type-edit/
   Kontosidor-design 2026-10-20 (W3). Kontrakt: _audit/kontosidor-design-20261020/F2-KONTRAKT.md.

   Scope: body.fma-f2.food-plan-type-edit (klassen 'food-plan-type-edit' sätts av
   class-account.php::add_body_class på type-edit, inkl. ?meals=edit). Enqueue:as av W1
   (class-account.php::enqueue_f2_assets) efter style.css → fas2.css → account-f2.css.

   Cascade att slå (datafakta):
   - food-plan.css (Wetail/Tailwind): `.woocommerce-account .fma-account-page .woocommerce .X`
     (0,4,0) och Meny-raderna `… .woocommerce-MyAccount-content .food-plan-meals .X` (0,6,0).
   - food-plan-v3.css (Fix 207, prod sedan 2026-07): `body.fnm-foodplan-v3 .fma-account-page .X`
     (0,3,1) med !important på bakgrund/kant/radie/skugga/knappfärger. Laddordningen mot den här
     filen är inte garanterad → reglerna här har högre specificitet OCH !important på exakt de
     egenskaperna. Fix 207 lämnas orörd (kill-switchen fnm_account_f2_disable faller tillbaka på den).
   Prefix: P  = body.fma-f2.food-plan-type-edit .fma-account-page            (0,3,1)
           PW = P .woocommerce                                               (0,4,1)
   Presentation enbart: inga formulärnamn/värden, ingen save-gate (Fix 200/201), ingen JS-logik rörd.
   ========================================================================== */

/* --- 0. Ingen beige panel; korten ligger direkt på cream ------------------- */
body.fma-f2.food-plan-type-edit .fma-account-page .fma-food-plan {
	background: transparent;
	border-radius: 0;
	padding: 0;
}
/* Feedback 27/10 (R8): Foderplan, Välj foderplan och Meny får samma innehållsbredd som översikten
   (.fnm-konto-v2 / hundsidan / orderdetaljen / formulären: 780 px, centrerad). */
body.fma-f2 .fma-account-page .f2-plan-page,
body.fma-f2.food-plan-type-edit .fma-account-page .fma-food-plan {
	max-width: 780px;
	margin-left: auto;
	margin-right: auto;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-type-edit {
	gap: 32px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-container > :not([hidden]) ~ :not([hidden]) {
	margin-top: 24px;
}

/* Infotexten om onsdag 09:00 (Fix 198, .fnmk-dialog-note — W2:s fil, rörs ej): f2-info-ytan.
   account-f2-plans.js lägger även klassen .f2-info på elementet; detta är CSS-fallbacken. */
body.fma-f2.food-plan-type-edit .fma-account-page .fnmk-dialog-note {
	background: var(--f2-tint);
	border-left: 4px solid var(--f2-green);
	border-radius: 12px;
	padding: 14px 18px 14px 48px;
	margin: 0 auto 24px; /* Svar 28/10 (N3): samma 780 px-kolumn som innehållet (var full bredd) */
	max-width: 780px;
	box-sizing: border-box;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 15px;
	line-height: 1.5;
	color: var(--f2-green);
	position: relative;
}
/* Jossan 4.3: "ljusgrön infoyta med ikon" — en ⓘ-ikon (inline-SVG, grön) i infoytans vänsterkant.
   Samma ikon på landningssidans infoyta (.fma-food-plan__subtitle-wrap). Ingen ny markup i 198. */
body.fma-f2.food-plan-type-edit .fma-account-page .fnmk-dialog-note::before,
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__subtitle-wrap::before {
	content: "";
	position: absolute;
	left: 18px;
	top: 15px;
	width: 20px;
	height: 20px;
	background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%231f3e36' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='10' cy='10' r='8.2'/%3E%3Cpath d='M10 9v5'/%3E%3Ccircle cx='10' cy='6.3' r='.9' fill='%231f3e36' stroke='none'/%3E%3C/svg%3E") no-repeat center / contain;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__subtitle-wrap {
	position: relative;
	padding-left: 48px;
}

/* --- 1. Rubriker ------------------------------------------------------------ */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options__title,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options__subtitle {
	text-align: left;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options__subtitle {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 16px;
	line-height: 1.55;
	color: var(--f2-mut);
	margin: 0;
	max-width: 640px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options__recommendations .fma-plan-options__title {
	margin: 0 0 8px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options__recommendations p {
	margin: 0;
	color: var(--f2-green);
}

/* --- 2. Plankorten: tre i rad som quizet (Topper, Partial, Full); Anpassad = knapp under raden ----
   Våg F (Josefines svar 28/10, N4): korten var "superstora" (2 × 2, R8) — nu quizets kompakta kort:
   liten rund bild, namn, "% av dagsbehovet", "X g/dag", "N förp. × S g · intervall", Välj.
   Mobil (≤600, N12): två kort per rad, Full centrerad under (§6). */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	align-items: stretch;
	justify-content: stretch;
	flex-wrap: wrap;
	padding-top: 12px; /* plats för "Din foderplan"-etiketten som sticker upp över kortets kant */
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card.fma-plan-custom {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: auto;
	min-width: 0;
	margin: 0;
	padding: 18px 14px 16px !important;
	gap: 6px !important;
	background: #fff !important;
	border: 2px solid transparent !important;
	border-radius: var(--f2-radius) !important;
	box-shadow: var(--f2-shadow-card) !important;
	cursor: pointer;
	transition: box-shadow .15s ease, border-color .15s ease;
}
/* Anpassad-kortet: grid i food-plan.css (bild | text) → samma kolumn-kort som de andra. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom {
	grid-template-columns: none;
}
/* Vald plan = grön 2 px kant (nuvarande plan är vald vid sidladdning). Slår Fix 207:s orange. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card.selected,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom.selected {
	background: #fff !important;
	border-color: var(--f2-green) !important;
	box-shadow: var(--f2-shadow-lifted) !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card:not(.selected):hover {
	box-shadow: var(--f2-shadow-lifted) !important;
	transform: none;
}

/* "Din foderplan"-etiketten på kundens nuvarande plan (statisk, följer inte valet). Våg F: centrerad över
   kortets överkant (quizets "Mest populär"-placering). */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-card__flag {
	position: absolute;
	top: -10px;
	left: 50%;
	right: auto;
	transform: translateX(-50%);
	white-space: nowrap;
	z-index: 2;
	background: var(--f2-tint);
	color: var(--f2-green);
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1;
	padding: 6px 10px;
	border-radius: 999px;
	box-shadow: 0 2px 8px rgba(31, 58, 55, .12);
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-card__flag::before {
	content: none;
}

/* Våg F: liten rund bild (quizet), i stället för full kortbredd 4:3. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-card__media {
	flex: 0 0 auto;
	width: 104px;
	max-width: 100%;
	border-radius: 50%;
	overflow: hidden;
	background: var(--f2-grey);
	aspect-ratio: 1 / 1;
	margin: 0 auto 4px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-card__media img,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-card__media picture,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card__image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	border-radius: 0;
}

/* Plannamn: VERSALT (f2-h3), kompakt som quizet; får brytas i smala kort i stället för att kortas med "…". */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card__title {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-weight: 500;
	font-size: 16px;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--f2-green);
	margin: 2px 0 0;
	overflow-wrap: break-word;
}

/* Nominell fyllnadsstapel (20/50/100 % av dagsbehovet — plan-nominellt, samma som hemsidan).
   Våg F: stapeln döljs (quizet visar bara texten "X % av dagsbehovet"); texten står kvar. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-fill {
	display: none;
	height: 8px;
	background: var(--f2-tint);
	border-radius: 999px;
	overflow: hidden;
	margin: 0;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-fill__bar {
	height: 100%;
	background: var(--f2-green);
	border-radius: 999px;
	width: var(--fill, 0%);
	transition: width .3s ease;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-fill__label {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 12px;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
	color: var(--f2-mut);
	margin: 0;
}

/* Våg F: beskrivningen visas inte i de kompakta korten (quizet har ingen); den står kvar i markupen. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card__description {
	display: none;
}
/* Siffrorna i quizets form (plans.php $fnm_f2_plan_figures): "160 g/dag" + "18 förp. × 250 g · var 4:e vecka". */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-plan-card__figures--compact {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	margin: 4px 0 8px;
	padding: 0;
	border: 0;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-plan-card__figures--compact p {
	margin: 0;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	color: var(--f2-mut);
	font-size: 12px;
	line-height: 1.35;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-plan-card__figures--compact .f2-plan-card__grams {
	color: var(--f2-green);
	font-size: 15px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-plan-card__figures--compact .f2-plan-card__grams strong {
	font-size: 17px;
	font-weight: 500;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-plan-card__figures--compact .f2-plan-card__nowrap {
	white-space: nowrap;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .f2-plan-card__figures--compact .f2-plan-card__price strong {
	color: var(--f2-green);
	font-weight: 500;
}

/* Knappen: "Välj" = orange fylld (JS sätter .fma-dashboard-button__secondary på OVALDA kort),
   "Vald ✓" = grön kontur (valt kort, klassen borta). Texterna byts av script.js via data-select/-selected.
   Slår Fix 207:s !important-regler (orange kontur/glow) med högre specificitet + !important. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .fma-plan-card__button.f2-btn,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-button .fma-plan-card__button.f2-btn {
	margin-top: auto;
	width: auto; /* Våg F: centrerad pill som quizet, inte kantad över hela kortet */
	max-width: 100%;
	min-height: 44px !important;
	padding: 10px 16px !important;
	font-size: 14px !important;
	border-radius: 999px !important;
	background: transparent !important;
	color: var(--f2-green) !important;
	border: 2px solid var(--f2-green) !important;
	box-shadow: none !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .fma-plan-card__button.f2-btn:hover {
	background: var(--f2-green) !important;
	color: var(--f2-cream) !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .fma-plan-card__button.f2-btn.fma-dashboard-button__secondary {
	background: var(--f2-orange) !important;
	color: #fff !important;
	border-color: var(--f2-orange) !important;
	box-shadow: var(--f2-shadow-btn) !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .fma-plan-card__button.f2-btn.fma-dashboard-button__secondary:hover {
	background: var(--f2-orange-dark) !important;
	border-color: var(--f2-orange-dark) !important;
	color: #fff !important;
}
/* Josefine 27/10 (svar 2): inaktiv "Välj" (Anpassad, Fix 075-spärren) = samma grå variant som Spara. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .fma-plan-card__button.f2-btn[disabled],
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .fma-plan-card__button.f2-btn.fma-dashboard-button__secondary[disabled],
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .fma-plan-card__button.f2-btn[disabled]:hover,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card .fma-plan-card__button.f2-btn.fma-dashboard-button__secondary[disabled]:hover {
	opacity: 1;
	background: var(--f2-disabled-bg, #e4e7e5) !important;
	border-color: var(--f2-disabled-bg, #e4e7e5) !important;
	color: var(--f2-mut) !important;
	box-shadow: none !important;
	cursor: not-allowed;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-button {
	display: flex;
	justify-content: center;
	width: 100%;
	margin-top: auto;
}

/* Anpassad plan: samma kort; rullistorna visas först när kortet är valt (ren CSS —
   fältens namn/värden/JS orörda; select2 får bredd via Wetails 100%-regel). */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description {
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
	width: 100%;
	text-align: center;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description > :not([hidden]) ~ :not([hidden]) {
	margin-top: 0;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-info {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 13px;
	line-height: 1.5;
	color: var(--f2-green);
	background: var(--f2-tint);
	border-radius: 10px;
	padding: 10px 12px;
	margin: 0;
}
/* Våg 2 B13 (W10): Anpassad-kortet är HOPFÄLLT (rullistor, info, Välj och 075:s text dolda) tills
   kortet är .selected (script.js ft) ELLER .f2-plan-custom--open (account-f2-plans.js: klick var som
   helst på kortet / knappen "Anpassad foderplan" / fokus eller ändring inuti; kund med anpassad plan = öppet
   från start; klick på annat kort fäller ihop). Öppningen går ALDRIG via "Välj", så Fix 075:s spärr
   (Välj disabled tills (storlek, antal) är giltigt) är oförändrad och kan inte låsa kortet.
   Varför !important: script.js Q() fadeIn/fadeOut sätter inline display på __description-info, och
   075 sätter inline display på .fnm-075-pair-msg. Fälten finns i DOM och behåller sina värden. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--open) .fma-plan-custom__description-selects,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--open) .fma-plan-custom__description-button,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--open) .fma-plan-custom__description-info,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--open) .fnm-075-pair-msg {
	display: none !important;
}
/* Feedback 27/10 (svar 4): öppnat men inte valt = grå kant (som inaktiv Spara), så bara det valda kortet
   har grön kant. Valt (.selected) behåller grön via regeln högre upp. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom.f2-plan-custom--open:not(.selected) {
	border-color: var(--f2-disabled-line, #c9cfcc) !important;
	box-shadow: var(--f2-shadow-lifted) !important;
}
/* "Anpassad foderplan ▾" (svar 28/10, N4) — öppnar kortet; quizets knapp: orange kontur, grön text.
   Dold när kortet är öppet/valt. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom .f2-plan-custom__open {
	display: inline-flex !important; /* knappen renderas med [hidden] (kill-switch-säker) */
	align-items: center;
	justify-content: center;
	gap: 8px;
	align-self: center;
	width: auto;
	min-height: 44px;
	padding: 10px 22px;
	font-size: 15px;
	border-radius: 999px;
	background: transparent;
	color: var(--f2-green);
	border: 2px solid var(--f2-orange);
	box-shadow: none;
	text-transform: none; /* temats knappar versaliserar orden; texten ska stå "Anpassad foderplan" */
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom .f2-plan-custom__open:hover {
	background: var(--f2-orange);
	border-color: var(--f2-orange);
	color: #fff;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom .f2-plan-custom__chev {
	font-size: 12px;
	line-height: 1;
}
/* Hopfällt (varken valt eller öppnat): bara knappen syns, utan kortets yta — som quizet. Bild, namn, andel och
   text visas när kortet öppnas (bilden aldrig: den kompakta panelen har ingen). "Din foderplan" döljs också hopfällt
   (kund med anpassad plan som valt en annan plan: etiketten låg annars över knappen, review vagF). */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card.fma-plan-custom:not(.selected):not(.f2-plan-custom--open),
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card.fma-plan-custom:not(.selected):not(.f2-plan-custom--open):hover {
	background: transparent !important;
	border-color: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	cursor: default;
	/* Bara knappens bredd (annars en osynlig klickyta i hela radens bredd som också öppnar kortet). */
	width: fit-content;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--open) .fma-plan-card__title,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--open) .f2-fill__label,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--open) .fma-plan-card__description,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--open) .f2-plan-card__flag,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom .fma-plan-custom__image {
	display: none !important;
}
/* Öppnat/valt: kortets text (instruktionen) visas igen — den döljs bara i de förinställda korten. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom .fma-plan-card__description {
	display: block;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 14px;
	line-height: 1.5;
	color: var(--f2-mut);
	margin: 0;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom.selected .f2-plan-custom__open,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom.f2-plan-custom--open .f2-plan-custom__open {
	display: none !important;
}
/* Fix 075:s valideringstext visas först när kunden interagerat med kortet (.f2-plan-custom--touched,
   sätts av account-f2-plans.js på äkta händelser) eller när kortet är valt — annars syns
   "Välj förpackningsstorlek." direkt när kortet öppnas via "Anpassad foderplan". */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom:not(.selected):not(.f2-plan-custom--touched) .fnm-075-pair-msg {
	display: none !important;
}
/* Select2 initieras (script.js Pt + 075:s re-init) medan rullistorna är display:none → width:auto;
   lås bredden så fälten fyller kortet när det öppnas. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects-item .select2-container {
	width: 100% !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom .fnm-075-pair-msg {
	margin: 0 !important;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 13px !important;
	line-height: 1.4;
	color: var(--f2-error, #B4441B) !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 10px;
	column-gap: 10px;
	text-align: left;
}
/* Våg F: Anpassad-panelen har hela 780 px-bredden → rullistorna bredvid varandra från 769 px. */
@media (min-width: 769px) {
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects-item {
	height: auto;
	min-height: var(--f2-field-h, 52px);
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom select,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects-item .select2-container--default .select2-selection--single {
	height: var(--f2-field-h, 52px) !important;
	min-height: var(--f2-field-h, 52px) !important;
	border: 1px solid var(--f2-line) !important;
	border-radius: var(--f2-field-radius, 12px) !important;
	background: #fff !important;
	color: var(--f2-green) !important;
	font-family: var(--f2-font, 'gelica', Georgia, serif) !important;
	font-size: 15px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom select {
	padding: 0 14px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects-item .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--f2-green);
	line-height: 1.3;
	padding-left: 0;
}
/* W14 (fynd 3): rullistornas text klipps aldrig. Är fältet för smalt bryts texten till högst två
   rader inne i det 52 px höga fältet i stället för att kortas med "…" (gäller alla bredder). */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects-item .select2-container--default .select2-selection--single {
	display: flex;
	align-items: center;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects-item .select2-container--default .select2-selection--single .select2-selection__rendered {
	flex: 1 1 auto;
	min-width: 0;
	white-space: normal;
	overflow: visible;
	text-overflow: clip;
	overflow-wrap: break-word;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects-item .select2-container--default.select2-container--focus .select2-selection--single,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-custom__description-selects-item .select2-container--default.select2-container--open .select2-selection--single {
	border: 2px solid var(--f2-green) !important;
}

/* --- 3. Meny: receptkort i hemsidans meal-carousel-stil ---------------------- */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(196px, 1fr));
	gap: 18px;
	min-height: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__item {
	display: flex;
	flex-direction: column;
	min-width: 0;
	margin: 0;
	padding: 0 !important;
	background: #fff !important;
	border: 0 !important;
	border-radius: var(--f2-radius) !important;
	box-shadow: var(--f2-shadow-card) !important;
	overflow: hidden;
	transition: box-shadow .15s ease;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__item:hover {
	box-shadow: var(--f2-shadow-lifted) !important;
	transform: none;
}
/* Bilden i full kortbredd, 4:3, etiketter i hörnen. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__image-wrapper {
	display: block;
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--f2-grey);
	margin: 0 0 12px;
	overflow: hidden;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__image-wrapper img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}
/* Merpris ("+ 15,00 kr/st") = liten orange etikett i bildens hörn → alla kort lika höga. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__cheapest-price {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	margin: 0;
	background: var(--f2-orange);
	color: #fff;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .04em;
	line-height: 1;
	text-transform: none;
	text-align: left;
	padding: 6px 10px;
	border-radius: 999px;
	box-shadow: 0 2px 8px rgba(31, 58, 55, .2);
	white-space: nowrap;
}
/* Hemsidans etikett (BÄSTSÄLJARE, LÅGALLERGEN …) uppe till höger. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .f2-plan-meal__pill {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 2;
	font-size: 10px;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 6px 10px;
	white-space: nowrap;
}
/* Namn VERSALT, kort beskrivning. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__name {
	display: block;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-weight: 500;
	font-size: 15px;
	line-height: 1.2;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--f2-green);
	margin: 0 0 6px;
	padding: 0 14px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__title-text {
	display: block;
	margin: 0;
	color: var(--f2-green);
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__description {
	flex: 1;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 13px;
	line-height: 1.45;
	color: var(--f2-mut);
	margin: 0 0 12px;
	padding: 0 14px;
}
/* Plus/minus som rundad pill (#F2F2F2) med gröna runda knappar; siffran i Gelica 600.
   Knapptexterna "-"/"+" är JS-kontrakt (script.js jämför e.text()) och lämnas orörda. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 4px;
	margin: auto 14px 14px;
	padding: 4px;
	background: var(--f2-grey);
	border-radius: 999px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--button.fma-dashboard-button {
	flex: 0 0 auto;
	width: 36px !important;
	height: 36px !important;
	min-width: 36px !important;
	min-height: 36px !important;
	max-width: 36px;
	padding: 0 !important;
	margin: 0;
	border-radius: 999px !important;
	border: 0 !important;
	background: var(--f2-green) !important;
	color: var(--f2-cream) !important;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 20px !important;
	font-weight: 500;
	line-height: 1;
	box-shadow: none !important;
	cursor: pointer;
	position: relative;
	transition: background .15s ease;
}
/* Generösare träffyta på mobil utan att pillen växer (idé från staging-fix 373, ej intagen som fix). */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--button.fma-dashboard-button::after {
	content: "";
	position: absolute;
	inset: -6px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--button.fma-dashboard-button:hover {
	background: var(--f2-green-deep) !important;
	color: var(--f2-cream) !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--input {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	height: 36px;
	padding: 0;
	margin: 0;
	background: transparent;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none;
	text-align: center;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 18px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--f2-green) !important;
	-moz-appearance: textfield;
	appearance: textfield;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--input::-webkit-outer-spin-button,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* --- 4. Raden längst ner: Spara + "Du har valt X / Y" + pris ---------------- */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 24px;
	margin: 8px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid var(--f2-line);
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons .f2-plan-nav__meta {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 15px;
	line-height: 1.4;
	color: var(--f2-green);
	margin: 0;
	text-align: left;
	width: auto;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons .f2-plan-nav__meta strong,
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons .f2-plan-nav__meta span {
	font-weight: 600;
	color: var(--f2-green);
}
/* Fix 200:s vägledningsnot (egen inline-CSS, rörs ej) → samma form som .f2-info--warn. */
body.fma-f2.food-plan-type-edit .fma-account-page .fnm200-meals-note {
	border-left: 4px solid var(--f2-orange);
	border-radius: 12px;
	padding: 12px 16px;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 14px;
	flex-basis: 100%;
}
/* Spara (primär) — slår Fix 207:s !important på bakgrund/skugga; disabled = grå variant (regeln nedan). */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-button__next.f2-btn {
	margin-left: auto;
	background: var(--f2-orange) !important;
	color: #fff !important;
	border-color: transparent !important;
	box-shadow: var(--f2-shadow-btn) !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-button__next.f2-btn:hover:not([disabled]) {
	background: var(--f2-orange-dark) !important;
	transform: translateY(-1px);
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-button__next.f2-btn[disabled],
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-button__next.f2-btn[disabled]:hover {
	/* Josefine 27/10 (svar 2): grå variant, inte 40 % opacitet (slår orange !important ovan). */
	opacity: 1;
	background: var(--f2-disabled-bg, #e4e7e5) !important;
	border-color: var(--f2-disabled-bg, #e4e7e5) !important;
	color: var(--f2-mut) !important;
	cursor: not-allowed;
	box-shadow: none !important;
	transform: none;
}
/* "Avbryt" (planvalet) = grön kontur; "Tillbaka" (Meny-steget) DÖLJS — länken överst räcker (Jossan 4.4).
   Markupen finns kvar: script.js (xt), Fix 249 och FM-252 binder på den. Klassen sätts av account-f2-plans.js. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-button__prev.f2-btn {
	background: transparent !important;
	color: var(--f2-green) !important;
	border: 2px solid var(--f2-green) !important;
	box-shadow: none !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-button__prev.f2-btn:hover {
	background: var(--f2-green) !important;
	color: var(--f2-cream) !important;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-button__prev {
	display: none !important;
}

/* --- 4b. Våg 2 B5 (W10): fast spara-fält i Meny-steget ----------------------------
   SAMMA .fma-plan-buttons-rad (samma DOM, samma submit, samma script.js/Fix 200-hooks). account-f2-
   plans.js lägger kontraktets .f2-sticky-save (account-f2.css: sticky, cream, skugga) bredvid
   .f2-plan-at-meals och sätter --f2-save-h (barens höjd) på formuläret. Desktop: sticky inom
   innehållsbredden (inga overflow:hidden-förfäder: .fma-account-page har overflow-x:clip).
   Mobil ≤600: fixed i viewportens botten, fullbredd, formuläret får padding-bottom = barens höjd.
   Fyllnadsstapeln (.f2-plan-nav__fill) speglar "X / Y"-texten; --fill sätts av JS. */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-buttons.f2-sticky-save {
	position: sticky;
	bottom: 0;
	z-index: 20;
	margin: 24px 0 0;
	padding: 14px 20px;
	border-top: 0;
	border-radius: var(--f2-radius) var(--f2-radius) 0 0;
	background: var(--f2-cream);
	box-shadow: 0 -4px 16px rgba(31, 58, 55, 0.08), 0 0 0 1px var(--f2-line);
	align-items: center;
	gap: 10px 24px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-buttons.f2-sticky-save .f2-plan-nav__meta--count {
	flex: 1 1 220px;
	min-width: 0;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons .f2-plan-nav__fill {
	display: block;
	width: 100%;
	max-width: 260px;
	height: 8px;
	margin: 8px 0 0;
	background: var(--f2-tint);
	border-radius: 999px;
	overflow: hidden;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons .f2-plan-nav__fill .f2-fill__bar {
	display: block;
	height: 100%;
	width: var(--fill, 0%);
	max-width: 100%;
	background: var(--f2-green);
	border-radius: 999px;
	transition: width .3s ease;
}
/* Stapeln hör till Meny-steget: visas bara när raden är fast (planvalet har ingen räknare). */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons:not(.f2-sticky-save) .f2-plan-nav__fill {
	display: none;
}
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-buttons.f2-sticky-save .fma-plan-button__next.f2-btn {
	flex: 0 0 auto;
}
/* Fix 200:s vägledningsnot (sätter sig själv efter räknar-raden, alltså INNE i baren) läggs sist i
   baren som egen kompakt rad, så första raden alltid är "Du har valt X / Y · pris · Spara". */
body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-buttons.f2-sticky-save .fnm200-meals-note {
	order: 99;
	flex-basis: 100%;
	margin: 0;
	padding: 8px 12px;
	font-size: 13px;
	line-height: 1.4;
}
@media (max-width: 600px) {
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-buttons.f2-sticky-save {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		margin: 0;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
		border-radius: 0;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px 16px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-buttons.f2-sticky-save .f2-plan-nav__meta {
		flex: 1 1 auto;
		font-size: 14px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-buttons.f2-sticky-save .f2-plan-nav__meta--count {
		flex-basis: 100%;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-at-meals .fma-plan-buttons.f2-sticky-save .fma-plan-button__next.f2-btn {
		width: auto;
		flex: 0 0 auto;
		margin-left: auto;
	}
	/* Plats för den fasta baren så inget (receptkort, FAQ, sidfot) hamnar bakom den i sidans slut.
	   :has → spacern på body (täcker även sidfoten); utan :has-stöd → på formuläret. JS sätter
	   --f2-save-h på både formuläret och body. */
	@supports selector(:has(a)) {
		body.fma-f2.food-plan-type-edit:has(.fma-plan-type-edit.f2-plan-at-meals) {
			padding-bottom: var(--f2-save-h, 110px);
		}
	}
	@supports not selector(:has(a)) {
		body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-type-edit.f2-plan-at-meals {
			padding-bottom: var(--f2-save-h, 110px);
		}
	}
}

/* --- 5. FAQ: ett block i hemsidans .faq-row-stil (Fix 020) ------------------ */
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan {
	max-width: 780px; /* feedback 27/10 (R8): samma innehållsbredd som översikten */
	margin: 48px auto 0;
	padding: 0;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .fma-faq-plan__title {
	text-align: left;
	margin: 0 0 8px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .fma-faq-plan__list {
	display: block;
}
/* Kopia av fas2.css `.fm-fas2 .f2-acc .faq-row__*` (samma värden) som fallback utan fas2-lanen. */
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row {
	border: 0;
	border-top: 1px solid var(--f2-line);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	padding: 0;
	margin: 0;
	overflow: visible;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row:last-of-type {
	border-bottom: 1px solid var(--f2-line);
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__question {
	width: 100%;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	padding: 18px 0;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	cursor: pointer;
	text-align: left;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.3;
	text-transform: none;
	color: var(--f2-green);
	position: relative;
	user-select: none;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__question:hover,
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__question:focus-visible {
	background: transparent;
	box-shadow: none;
	color: var(--f2-green);
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__question:focus-visible {
	outline: 2px solid var(--f2-green);
	outline-offset: 2px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__question::after {
	content: none;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__question-text {
	flex: 1;
	line-height: 1.3;
	text-transform: none;
	font-weight: 400;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__chevron {
	color: var(--f2-green);
	display: inline-flex;
	flex: 0 0 auto;
	transition: transform 250ms ease;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row--open .faq-row__chevron {
	transform: rotate(180deg);
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__answer {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	padding: 0;
	padding-block: 0;
	transition: max-height 250ms ease-out, opacity 250ms ease-out, padding 250ms ease-out;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row--open .faq-row__answer {
	max-height: none;
	opacity: 1;
	padding-block: 0 16px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__answer-inner,
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__answer-inner p {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 15px;
	line-height: 1.6;
	color: var(--f2-mut);
	margin: 0;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__answer-inner p + p {
	margin-top: 12px;
}
body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .fma-faq-plan__all {
	margin: 20px 0 0;
}

/* --- 7. Foderplan-landningssidan (/mitt-konto/food-plan/, .f2-plan-page) ------
   Kort enligt kontraktet; EN primär (Justera recept), gröna konturer, länk-CTA för betalmetod/
   orderhistorik, Avsluta som diskret länk. Slår food-plan.css (0,3,0)–(0,5,0) med body-prefix. */
body.fma-f2 .fma-account-page .f2-plan-page {
	display: block;
}
body.fma-f2 .fma-account-page .f2-plan-page > :not([hidden]) ~ :not([hidden]) {
	margin-top: 16px;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__header > :not([hidden]) ~ :not([hidden]) {
	margin-top: 12px;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__title {
	text-align: left;
	margin: 0 0 12px;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__subtitle {
	font-style: normal;
	text-align: left;
	margin: 0;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__subtitle a {
	color: var(--f2-orange);
	text-decoration: underline;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__items {
	background: transparent;
	border-radius: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__items > :not([hidden]) ~ :not([hidden]),
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__item > :not([hidden]) ~ :not([hidden]) {
	margin-top: 0;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__item,
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders {
	background: #fff;
	border: 0;
	border-radius: var(--f2-radius);
	box-shadow: var(--f2-shadow-card);
	padding: 22px 24px;
	margin: 0;
}
body.fma-f2 .fma-account-page .f2-plan-page .f2-card__head {
	margin: 0 0 14px;
}
body.fma-f2 .fma-account-page .f2-plan-page h3.f2-h3,
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders header h3 {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-weight: 500;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--f2-green);
	margin: 0;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders header {
	margin: 0 0 12px;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__content {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 16px 40px;
	margin: 0 0 18px;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__recipes {
	flex-direction: column;
	gap: 6px;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__recipes .product-name {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 16px;
	color: var(--f2-green);
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__recipes .product-name strong {
	font-weight: 500;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__recipes .product-quantity {
	color: var(--f2-mut);
}
body.fma-f2 .fma-account-page .f2-plan-page .f2-kv__value .f2-pill {
	vertical-align: middle;
}
body.fma-f2 .fma-account-page .f2-plan-page .f2-btnrow {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__items .fma-dashboard-button.f2-btn {
	max-width: none;
}
/* Orderhistoriken: WC-tabellen behålls, raden "Se alla ordrar →" under. */
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders > :not([hidden]) ~ :not([hidden]) {
	margin-top: 0;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders table.shop_table td,
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders table.shop_table td:before {
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	color: var(--f2-green);
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders table.shop_table td a {
	color: var(--f2-orange);
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders-all {
	margin: 14px 0 0;
	text-align: right;
}
/* Åtgärdsraden: Pausa + Ändra nästa leverans (sekundära), Aktivera (primär) — centrerade. */
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__actions {
	justify-content: center;
	gap: 12px;
	margin-top: 24px;
}
body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__footer {
	display: flex;
	justify-content: center;
	margin-top: 16px;
}
/* Avsluta = diskret länk; neutralisera Wetails .fma-dashboard-button (0,4,1) på just detta element.
   .fma-dashboard-button + data-popup måste ligga kvar (script.js et → dialogen). */
body.fma-f2 .fma-account-page .woocommerce a.fma-dashboard-button.f2-link-quiet,
body.fma-f2 .fma-account-page a.fma-dashboard-button.f2-link-quiet {
	display: inline;
	min-height: 0;
	min-width: 0;
	width: auto;
	max-width: none;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	font-family: var(--f2-font, 'gelica', Georgia, serif);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--f2-mut);
	text-decoration: underline;
	text-underline-offset: 3px;
}
body.fma-f2 .fma-account-page .woocommerce a.fma-dashboard-button.f2-link-quiet:hover,
body.fma-f2 .fma-account-page a.fma-dashboard-button.f2-link-quiet:hover {
	background: transparent;
	color: var(--f2-green);
}
@media (max-width: 600px) {
	body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__item,
	body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders {
		padding: 16px;
	}
	body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__content {
		flex-direction: column;
		gap: 14px;
	}
	body.fma-f2 .fma-account-page .f2-plan-page .f2-btnrow .f2-btn,
	body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__actions .f2-btn {
		width: 100%;
	}
	body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders-all {
		text-align: left;
	}
}

/* --- 6. Mobil ---------------------------------------------------------------- */
@media (max-width: 768px) {
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options {
		gap: 12px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card,
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card.fma-plan-custom {
		padding: 16px 12px 14px !important;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__question {
		font-size: 16px;
		padding: 14px 0;
	}
}
@media (max-width: 600px) {
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons {
		flex-direction: column;
		align-items: stretch;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-buttons .f2-btn {
		width: 100%;
		margin-left: 0;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__name {
		font-size: 14px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls {
		margin: auto 10px 10px;
	}
}
/* Våg F (svar 28/10, N12): mobilen kompakt som quizet. Ersätter fynd 3:s "en kolumn ≤600" (21/10), som kom av att
   Anpassad-kortets rullistor klipptes i halvbreda kort; Anpassad är nu en egen panel i full bredd.
   - Planerna: två kort per rad, Full centrerad under (quizets sidledes rullade rad vore en horisontell scrollyta,
     som F2-KONTRAKT §8 utesluter — karusell = klass B).
   - Meny: två receptkort per rad; merpris-etiketten flyttas till bildens nederkant så den inte krockar med
     receptets etikett uppe till höger i de smalare korten. */
@media (max-width: 600px) {
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 18px 10px; /* radavstånd: plats för "Din foderplan" på ett kort i andra raden */
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-options > .fma-plan-card {
		flex: 0 0 calc(50% - 5px);
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .f2-plan-card__media {
		width: 80px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card__title {
		font-size: 14px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__cheapest-price {
		top: auto;
		bottom: 8px;
		left: 8px;
		font-size: 10px;
		padding: 5px 8px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .f2-plan-meal__pill {
		top: 8px;
		right: 8px;
		max-width: calc(100% - 16px);
		overflow: hidden;
		text-overflow: ellipsis;
		font-size: 9px;
		letter-spacing: .08em;
		padding: 5px 8px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__image-wrapper {
		margin-bottom: 10px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__name {
		padding: 0 10px;
		font-size: 13px;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__description {
		padding: 0 10px;
		font-size: 12px;
		line-height: 1.4;
		margin-bottom: 10px;
	}
}
/* W14 (fynd 2): plus/minus på Meny får 44 × 44 px på mobil. Den synliga gröna cirkeln är kvar på
   36 px (padding 4 px + background-clip: content-box) och pillens 4 px-padding flyttas in i knappen,
   så pillen är fortsatt 44 px hög. Knapptexterna "-"/"+" (JS-kontrakt) är orörda. */
@media (max-width: 767px) {
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls {
		padding: 0;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--button.fma-dashboard-button,
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--button.fma-dashboard-button:hover {
		width: 44px !important;
		height: 44px !important;
		min-width: 44px !important;
		min-height: 44px !important;
		max-width: 44px;
		padding: 4px !important;
		background-clip: content-box !important;
	}
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__quantity-controls--button.fma-dashboard-button::after {
		inset: 0;
	}
	/* Diskreta "Återaktivera foderplan" (åtgärdsraden) + "Avsluta prenumerationen" (foten) under varandra:
	   26 px så att deras 44 px-träffytor (account-f2.css §11) inte krockar (var 16 px från food-plan.css
	   space-y, (0,5,0) — därav > .fma-food-plan__footer på .fma-food-plan för (0,5,1)). */
	body.fma-f2 .fma-account-page .f2-plan-page.fma-food-plan > .fma-food-plan__footer {
		margin-top: 26px;
	}
	/* Codex R8: "Se alla ordrar →" (44 px träffyta) låg ~9 px under orderradens Visa/Faktura → luft till.
	   cp10 (staging, riktiga typsnitt): 8 px räckte inte (2,8 px kvar i 360–430) → 14 px.
	   (0,6,1) + senare = slår space-y-nollningen ovan (> :not([hidden]) ~ :not([hidden])). */
	body.fma-f2 .fma-account-page .f2-plan-page .fma-food-plan__orders > .fma-food-plan__orders-all:not([hidden]) {
		margin-top: 14px;
	}
}
@media (prefers-reduced-motion: reduce) {
	body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__answer,
	body.fma-f2.food-plan-type-edit .fma-account-page .fma-faq-plan .faq-row__chevron,
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .fma-plan-card,
	body.fma-f2.food-plan-type-edit .fma-account-page .woocommerce .food-plan-meals .food-plan-meals__item {
		transition: none;
	}
}