/* Externalise depuis la modification #56, bloc inline #66 — position et ordre de cascade inchanges */

/* G6M_RESPONSIVE_SITE_V434
   MOBILE / TABLET ONLY — every rule is inside @media.
   Desktop (≥1025px) is intentionally untouched.

   Root auth bug: g6m-login-forum-chrome-v409 forces
   grid-template-columns: 1.05fr 28px 0.95fr without a max-width
   query, so mobile keeps a 3-column shell (~137px form column).
*/

/* ═══════════════════════════════════════════════════════════
   ≤1024px — tablet + phone shared guards
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {

	/* Kill horizontal page scroll globally (site chrome) */
	html#XF,
	html#XF body {
		overflow-x: clip !important;
		max-width: 100vw !important;
	}

	html#XF .p-pageWrapper,
	html#XF .p-body,
	html#XF .p-body-inner,
	html#XF .p-body-main,
	html#XF .p-body-content,
	html#XF .p-body-pageContent,
	html#XF .uix_contentWrapper {
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
	}

	html#XF .p-body-inner {
		overflow-x: clip !important;
		padding-left: max(12px, env(safe-area-inset-left, 0px)) !important;
		padding-right: max(12px, env(safe-area-inset-right, 0px)) !important;
	}

	/* Media / tables / embeds never blow the viewport */
	html#XF img,
	html#XF svg,
	html#XF video,
	html#XF canvas,
	html#XF iframe,
	html#XF embed,
	html#XF object {
		max-width: 100% !important;
		height: auto !important;
	}

	html#XF table,
	html#XF .dataList,
	html#XF .block-body--collapsible {
		max-width: 100% !important;
	}

	html#XF .block-container,
	html#XF .block,
	html#XF .message,
	html#XF .structItem,
	html#XF .node,
	html#XF .menu,
	html#XF .tooltip {
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	/* Auth: beat v409 desktop grid lock on tablet widths */
	html#XF[data-template="login"] .g6m397-grid,
	html#XF body[data-template="login"] .g6m397-grid,
	html#XF[data-template="register_form"] .g6m397-grid,
	html#XF body[data-template="register_form"] .g6m397-grid,
	html body[data-template="login"] .g6m397-grid,
	html body[data-template="register_form"] .g6m397-grid {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) auto minmax(0, 0.9fr) !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		gap: 0 10px !important;
	}
}

/* ═══════════════════════════════════════════════════════════
   ≤900px — stack auth columns (login + register)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 900px) {

	html#XF[data-template="login"] .g6m397-grid,
	html#XF body[data-template="login"] .g6m397-grid,
	html#XF[data-template="register_form"] .g6m397-grid,
	html#XF body[data-template="register_form"] .g6m397-grid,
	html body[data-template="login"] .g6m397-grid,
	html body[data-template="register_form"] .g6m397-grid {
		grid-template-columns: 1fr !important;
		gap: 16px 0 !important;
	}

	html#XF[data-template="login"] .g6m397-divider,
	html#XF body[data-template="login"] .g6m397-divider,
	html#XF[data-template="register_form"] .g6m397-divider,
	html#XF body[data-template="register_form"] .g6m397-divider,
	html body[data-template="login"] .g6m397-divider,
	html body[data-template="register_form"] .g6m397-divider {
		display: none !important;
	}

	html#XF[data-template="login"] .g6m397-col--form,
	html#XF[data-template="login"] .g6m397-col--present,
	html#XF[data-template="register_form"] .g6m397-col--form,
	html#XF[data-template="register_form"] .g6m397-col--present,
	html#XF body[data-template="login"] .g6m397-col--form,
	html#XF body[data-template="login"] .g6m397-col--present,
	html#XF body[data-template="register_form"] .g6m397-col--form,
	html#XF body[data-template="register_form"] .g6m397-col--present {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		box-sizing: border-box !important;
	}

	html#XF[data-template="login"] .g6m397-col--form,
	html#XF[data-template="register_form"] .g6m397-col--form {
		order: 1 !important;
	}

	html#XF[data-template="login"] .g6m397-col--present,
	html#XF[data-template="register_form"] .g6m397-col--present {
		order: 2 !important;
	}
}

/* ═══════════════════════════════════════════════════════════
   ≤767.98px — phones: header / nav / footer / auth polish
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 767.98px) {

	/* —— Header CTA must never clip —— */
	html#XF body .p-nav-inner,
	html#XF body .p-nav .p-nav-inner {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 8px !important;
		width: 100% !important;
		max-width: 100% !important;
		padding-left: max(10px, env(safe-area-inset-left, 0px)) !important;
		padding-right: max(10px, env(safe-area-inset-right, 0px)) !important;
		box-sizing: border-box !important;
		overflow: visible !important;
	}

	html#XF body .p-nav-opposite,
	html#XF body .p-nav .p-nav-opposite {
		flex: 0 1 auto !important;
		min-width: 0 !important;
		max-width: 46% !important;
		justify-content: flex-end !important;
		overflow: visible !important;
	}

	html#XF body .p-nav-opposite .p-navgroup-link.g6m-header-cta,
	html#XF body .p-nav-opposite a.g6m-header-cta,
	html#XF body .p-navgroup-link--register,
	html#XF body .p-navgroup-link--logIn.g6m-header-cta,
	html#XF body a.p-navgroup-link.g6m-header-cta {
		flex: 0 0 auto !important;
		max-width: none !important;
		min-width: 0 !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
		font-size: 0.78rem !important;
		white-space: nowrap !important;
		overflow: visible !important;
		text-overflow: clip !important;
		box-sizing: border-box !important;
	}

	html#XF body .p-nav-opposite .p-navgroup-link.g6m-header-cta .p-navgroup-linkText,
	html#XF body a.g6m-header-cta .p-navgroup-linkText {
		display: inline !important;
		overflow: visible !important;
		max-width: none !important;
		white-space: nowrap !important;
	}

	html#XF body .p-nav-menuTrigger {
		flex: 0 0 auto !important;
	}

	html#XF body .p-nav-smallLogo,
	html#XF body .p-nav .g6m-site-logo--compact,
	html#XF body .p-nav-smallLogo img {
		max-width: 110px !important;
		height: auto !important;
	}

	/* —— Auth shell width —— */
	html#XF[data-template="login"] .p-body-pageContent,
	html#XF[data-template="register_form"] .p-body-pageContent,
	html#XF body[data-template="login"] .p-body-pageContent,
	html#XF body[data-template="register_form"] .p-body-pageContent,
	html body[data-template="login"] .p-body-pageContent,
	html body[data-template="register_form"] .p-body-pageContent {
		width: calc(100vw - 24px) !important;
		max-width: calc(100vw - 24px) !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding: 18px 14px 14px !important;
		box-sizing: border-box !important;
		overflow: visible !important;
	}

	html#XF[data-template="login"] .p-body-inner,
	html#XF[data-template="register_form"] .p-body-inner,
	html#XF body[data-template="login"] .p-body-inner,
	html#XF body[data-template="register_form"] .p-body-inner {
		padding: 16px 10px 28px !important;
		align-items: center !important;
		width: 100% !important;
		max-width: none !important;
		overflow-x: clip !important;
	}

	/* Hide present panel on phones (same as login design intent) */
	html#XF[data-template="login"] .g6m397-col--present,
	html#XF[data-template="register_form"] .g6m397-col--present,
	html#XF body[data-template="login"] .g6m397-col--present,
	html#XF body[data-template="register_form"] .g6m397-col--present,
	html body[data-template="login"] .g6m397-col--present,
	html body[data-template="register_form"] .g6m397-col--present {
		display: none !important;
	}

	html#XF[data-template="login"] .g6m397-grid,
	html#XF[data-template="register_form"] .g6m397-grid,
	html#XF body[data-template="login"] .g6m397-grid,
	html#XF body[data-template="register_form"] .g6m397-grid {
		grid-template-columns: 1fr !important;
		width: 100% !important;
	}

	html#XF[data-template="login"] .g6m397-col--form,
	html#XF[data-template="register_form"] .g6m397-col--form,
	html#XF body[data-template="login"] .g6m397-col--form,
	html#XF body[data-template="register_form"] .g6m397-col--form {
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Title: wrap on spaces, never mid-glyph orphan */
	html#XF[data-template="login"] .g6m-login-hero__title,
	html#XF[data-template="register_form"] .g6m-login-hero__title,
	html#XF[data-template="register_form"] .g6m-register-hero__title,
	html#XF body[data-template="login"] .g6m-login-hero__title,
	html#XF body[data-template="register_form"] .g6m-login-hero__title,
	html#XF[data-template="login"] .g6m397-col--form .g6m-login-hero__title,
	html#XF[data-template="register_form"] .g6m397-col--form .g6m-login-hero__title {
		width: 100% !important;
		max-width: 100% !important;
		font-size: clamp(1.05rem, 4.6vw, 1.2rem) !important;
		line-height: 1.3 !important;
		letter-spacing: -0.01em !important;
		white-space: normal !important;
		word-break: normal !important;
		overflow-wrap: break-word !important;
		hyphens: none !important;
	}

	html#XF[data-template="login"] .g6m-login-hero__sub,
	html#XF[data-template="register_form"] .g6m-login-hero__sub,
	html#XF[data-template="login"] .g6m397-col--form .g6m-login-hero__sub,
	html#XF[data-template="register_form"] .g6m397-col--form .g6m-login-hero__sub {
		max-width: 100% !important;
		font-size: 0.8rem !important;
		line-height: 1.4 !important;
	}

	html#XF[data-template="login"] .g6m-login-hero__logo,
	html#XF[data-template="register_form"] .g6m-login-hero__logo,
	html#XF[data-template="login"] .g6m-login-hero img,
	html#XF[data-template="register_form"] .g6m-login-hero img {
		height: 28px !important;
		max-width: min(160px, 70vw) !important;
		width: auto !important;
		object-fit: contain !important;
	}

	/* Full-width form chrome */
	html#XF[data-template="login"] .blocks,
	html#XF[data-template="login"] form.block,
	html#XF[data-template="login"] form.block > .block-container,
	html#XF[data-template="login"] form.block .block-body,
	html#XF[data-template="login"] form.block .block-body > .formRow,
	html#XF[data-template="login"] form.block .block-body > .formRow > dd,
	html#XF[data-template="login"] form.block .formSubmitRow,
	html#XF[data-template="login"] form.block .formSubmitRow-controls,
	html#XF[data-template="register_form"] .blocks,
	html#XF[data-template="register_form"] form.block,
	html#XF[data-template="register_form"] form.block > .block-container,
	html#XF[data-template="register_form"] form.block .block-body,
	html#XF[data-template="register_form"] form.block .block-body > .formRow,
	html#XF[data-template="register_form"] form.block .block-body > .formRow > dd,
	html#XF[data-template="register_form"] form.block .formSubmitRow,
	html#XF[data-template="register_form"] form.block .formSubmitRow-controls {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
	}

	html#XF[data-template="login"] form.block .input,
	html#XF[data-template="login"] form.block input.input,
	html#XF[data-template="login"] form.block .inputGroup,
	html#XF[data-template="login"] form.block .inputGroup input.input,
	html#XF[data-template="login"] form.block .button,
	html#XF[data-template="login"] form.block button.button,
	html#XF[data-template="login"] form.block .button--primary,
	html#XF[data-template="register_form"] form.block .input,
	html#XF[data-template="register_form"] form.block input.input,
	html#XF[data-template="register_form"] form.block .inputGroup,
	html#XF[data-template="register_form"] form.block .inputGroup input.input,
	html#XF[data-template="register_form"] form.block .button,
	html#XF[data-template="register_form"] form.block button.button,
	html#XF[data-template="register_form"] form.block .button--primary {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
	}

	/* Forgot link: flow in document, wrap if needed */
	html#XF[data-template="login"] .g6m397-col--form .g6m404-forgot,
	html#XF[data-template="login"] .g6m397-col--form .g6m402-forgot,
	html#XF body[data-template="login"] .g6m397-col--form .g6m404-forgot,
	html#XF body[data-template="login"] .g6m397-col--form .g6m402-forgot {
		display: flex !important;
		justify-content: flex-end !important;
		position: static !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 4px 0 12px !important;
		overflow: visible !important;
	}

	html#XF[data-template="login"] .g6m397-col--form .g6m404-forgot a,
	html#XF[data-template="login"] .g6m397-col--form a.g6m404-forgot-link,
	html#XF[data-template="login"] .g6m397-col--form a.g6m402-forgot-link,
	html#XF[data-template="login"] a[href*="lost-password"],
	html#XF body[data-template="login"] a[href*="lost-password"] {
		position: static !important;
		left: auto !important;
		right: auto !important;
		width: auto !important;
		max-width: 100% !important;
		white-space: normal !important;
		overflow-wrap: anywhere !important;
		word-break: normal !important;
		text-align: right !important;
		font-size: 0.74rem !important;
	}

	/* OAuth / quick login full width */
	html#XF[data-template="login"] .g6m397-quick,
	html#XF[data-template="register_form"] .g6m397-quick,
	html#XF[data-template="login"] .g6m397-col--form .g6m397-quick,
	html#XF[data-template="register_form"] .g6m397-col--form .g6m397-quick,
	html#XF body[data-template="login"] .g6m397-quick,
	html#XF body[data-template="register_form"] .g6m397-quick {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		box-sizing: border-box !important;
	}

	html#XF[data-template="login"] .g6m397-quick__grid,
	html#XF[data-template="login"] .g6m397-quick .listHeap,
	html#XF[data-template="register_form"] .g6m397-quick__grid,
	html#XF[data-template="register_form"] .g6m397-quick .listHeap,
	html#XF[data-template="login"] .g6m397-col--form .g6m397-quick__grid,
	html#XF[data-template="login"] .g6m397-col--form .g6m397-quick .listHeap {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 10px !important;
		width: 100% !important;
	}

	html#XF[data-template="login"] .g6m397-quick .button--provider,
	html#XF[data-template="login"] .g6m397-quick .g6m-login-social__btn,
	html#XF[data-template="login"] .g6m397-quick .js-webauthnStart,
	html#XF[data-template="login"] .g6m397-quick .js-webAuthnStart,
	html#XF[data-template="register_form"] .g6m397-quick .button--provider,
	html#XF[data-template="register_form"] .g6m397-quick .g6m-login-social__btn,
	html#XF[data-template="register_form"] a.button--provider {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	html#XF[data-template="login"] .g6m397-secure,
	html#XF[data-template="login"] .g6m397-legal,
	html#XF[data-template="register_form"] .g6m397-secure,
	html#XF[data-template="register_form"] .g6m397-legal {
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 4px !important;
		box-sizing: border-box !important;
		text-align: center !important;
	}

	/* Captcha / turnstile */
	html#XF[data-template="login"] .cf-turnstile,
	html#XF[data-template="register_form"] .cf-turnstile,
	html#XF[data-template="login"] [id*="turnstile"],
	html#XF[data-template="register_form"] [id*="turnstile"] {
		max-width: 100% !important;
		overflow: hidden !important;
	}

	/* —— Footer stack —— */
	html#XF .g6m-site-footer__body .grid,
	html#XF .g6m-site-footer .grid,
	html#XF footer.g6m-site-footer .relative > .grid,
	html#XF .g6m-site-footer .grid.gap-10,
	html#XF .g6m-site-footer .md\:grid-cols-2,
	html#XF .g6m-site-footer .lg\:grid-cols-3 {
		display: flex !important;
		flex-direction: column !important;
		gap: 1.75rem !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	html#XF .g6m-site-footer,
	html#XF .g6m-site-footer__body,
	html#XF .p-footer,
	html#XF .g6m-site-footer .mx-auto {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
		overflow-x: clip !important;
		box-sizing: border-box !important;
	}

	html#XF .g6m-site-footer .mx-auto.max-w-7xl,
	html#XF .g6m-site-footer .max-w-7xl {
		max-width: 100% !important;
		padding-left: max(16px, env(safe-area-inset-left, 0px)) !important;
		padding-right: max(16px, env(safe-area-inset-right, 0px)) !important;
	}

	html#XF .g6m-site-footer img,
	html#XF .g6m-site-footer .g6m-site-logo {
		max-width: min(200px, 70vw) !important;
		height: auto !important;
	}

	html#XF .g6m-footer-link,
	html#XF .g6m-footer-links a {
		overflow-wrap: anywhere !important;
		word-break: normal !important;
	}

	/* Off-canvas / hamburger menu */
	html#XF .offCanvasMenu,
	html#XF .offCanvasMenu-content,
	html#XF .offCanvasMenu-list {
		max-width: 100vw !important;
		box-sizing: border-box !important;
	}

	html#XF .offCanvasMenu-content {
		width: min(320px, 88vw) !important;
	}
}

/* ═══════════════════════════════════════════════════════════
   ≤430px — compact phones
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 430px) {

	html#XF[data-template="login"] .p-body-pageContent,
	html#XF[data-template="register_form"] .p-body-pageContent,
	html#XF body[data-template="login"] .p-body-pageContent,
	html#XF body[data-template="register_form"] .p-body-pageContent {
		padding: 16px 12px 12px !important;
		width: calc(100vw - 16px) !important;
		max-width: calc(100vw - 16px) !important;
	}

	html#XF[data-template="login"] .g6m-login-hero__title,
	html#XF[data-template="register_form"] .g6m-login-hero__title,
	html#XF[data-template="register_form"] .g6m-register-hero__title,
	html#XF[data-template="login"] .g6m397-col--form .g6m-login-hero__title {
		font-size: clamp(0.98rem, 5vw, 1.1rem) !important;
	}

	html#XF body .p-nav-opposite .p-navgroup-link.g6m-header-cta,
	html#XF body a.p-navgroup-link.g6m-header-cta {
		padding-left: 10px !important;
		padding-right: 10px !important;
		font-size: 0.72rem !important;
	}

	html#XF[data-template="login"] form.block .block-body > .formRow.formRow--input .formRow-label,
	html#XF[data-template="register_form"] form.block .block-body > .formRow.formRow--input .formRow-label {
		font-size: 0.62rem !important;
		letter-spacing: 0.08em !important;
	}
}

/* ═══════════════════════════════════════════════════════════
   ≤360px — very small
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 360px) {

	html#XF[data-template="login"] .p-body-pageContent,
	html#XF[data-template="register_form"] .p-body-pageContent {
		padding: 14px 10px 10px !important;
	}

	html#XF body .p-nav-smallLogo img,
	html#XF body .p-nav .g6m-site-logo--compact {
		max-width: 92px !important;
	}
}