/**
 * Moduł „Twoja pozycja”: pasek „Nie ma tego w portalu?” i własne pozycje
 * na liście ulubionych.
 *
 * Design System INM v2: limonka strony (#D7E79E) ze skośną górą i dołem
 * jak dzielniki sekcji, tekst grafitowy, pola z dolną linią, przyciski na
 * tle strony. Bez pomarańczu: to nie jest akcja główna (tę ma wysyłka
 * planu); pomarańcz tylko jako znacznik wybranego rodzaju. Promień 0, bez
 * cieni; fokus to wewnętrzny pasek 3 px.
 */

.inm-own {
	--inm-own-text: var(--inm-text-dark, #303431);
	--inm-own-meta: var(--inm-meta, #646B65);
	--inm-own-bg: var(--inm-bg-page, #FAFAFA);
	--inm-own-muted: var(--inm-bg-muted, #ECEFE7);
	--inm-own-hover: var(--inm-brand-hover, #F1F6E0);
	--inm-own-line: var(--inm-border-line, #D5DBD0);
	--inm-own-accent: var(--inm-green, #EF8F10);
	--inm-own-lime: #D7E79E;
	--inm-own-font: var(--inm-font, 'Poppins', sans-serif);
	--inm-own-display: var(--inm-font-display, 'Bebas Neue', sans-serif);
	--inm-own-gutter: 16px;
	--inm-own-edge: 16px;

	position: relative;
	margin: 0;
	padding: calc(var(--inm-own-edge) + 20px) var(--inm-own-gutter) calc(var(--inm-own-edge) + 18px);
	background: var(--inm-own-lime);
	color: var(--inm-own-text);
	font-family: var(--inm-own-font);
	font-size: 16px;
	line-height: 1.5;
}

.inm-own *,
.inm-own *::before,
.inm-own *::after { box-sizing: border-box; }

.inm-own [hidden] { display: none !important; }

/* Osadzony: część większej limonkowej sekcji, oddzielony grafitową linią. */
.inm-own--embedded {
	padding: 20px 0 0;
	background: transparent;
	border-top: 2px solid var(--inm-own-text);
}

.inm-own__edge {
	position: absolute;
	right: 0;
	left: 0;
	line-height: 0;
	pointer-events: none;
}

.inm-own__edge--top { top: -1px; }
.inm-own__edge--bottom { bottom: -1px; }

.inm-own__edge svg {
	display: block;
	width: 100%;
	height: var(--inm-own-edge);
	fill: var(--inm-own-bg);
}

.inm-own__wrap {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 10px;
	max-width: 1280px;
	margin: 0 auto;
}

.inm-own--embedded .inm-own__wrap { max-width: none; }

.inm-own .inm-own__title {
	margin: 0;
	color: var(--inm-own-text);
	font-family: var(--inm-own-display);
	font-size: 28px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
}

.inm-own__lead {
	margin: 6px 0 0;
	font-size: 14px;
}

.inm-own__lead label { cursor: pointer; }

/* --- Krok 1 -------------------------------------------------------------- */

.inm-own__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 52px;
	gap: 8px;
	align-items: start;
}

.inm-own__field { position: relative; min-width: 0; }

.inm-own .inm-own__input {
	display: block;
	width: 100%;
	height: 52px;
	margin: 0;
	padding: 0 2px;
	border: 0;
	border-bottom: 2px solid var(--inm-own-text);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--inm-own-text);
	font-family: inherit;
	font-size: 16px;
	line-height: 1.2;
}

.inm-own .inm-own__input::placeholder { color: var(--inm-own-meta); opacity: 1; }

.inm-own .inm-own__input:focus {
	outline: none;
	box-shadow: inset 0 -3px 0 var(--inm-own-text);
}

.inm-own .inm-own__input:disabled { opacity: 0.5; }

.inm-own .inm-own__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 52px;
	margin: 0;
	padding: 0 20px;
	border: 0;
	border-radius: 0;
	background: var(--inm-own-bg);
	box-shadow: none;
	color: var(--inm-own-text);
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
	transition: background-color var(--inm-motion-duration, 150ms) ease;
}

.inm-own .inm-own__btn:hover,
.inm-own .inm-own__btn:focus-visible {
	background: var(--inm-own-hover);
	color: var(--inm-own-text);
}

.inm-own .inm-own__btn:focus-visible,
.inm-own .inm-own__undo:focus-visible,
.inm-own .inm-own__as-own:focus-visible,
.inm-own .inm-own__opt input:focus-visible + span {
	outline: none;
	box-shadow: inset 0 -3px 0 var(--inm-own-text);
}

.inm-own .inm-own__btn:disabled {
	cursor: default;
	opacity: 0.55;
	background: var(--inm-own-bg);
}

.inm-own .inm-own__btn--add { padding: 0; }
.inm-own__btn-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.inm-own .inm-own__btn--ghost { background: transparent; font-weight: 400; }
.inm-own .inm-own__btn--sm { min-height: 40px; padding: 0 12px; font-size: 14px; background: var(--inm-own-muted); }

.inm-own__ico {
	flex: none;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
}

.inm-own__foot {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 24px;
	margin-top: 10px;
	font-size: 13px;
}

.inm-own__consent {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	cursor: pointer;
}

.inm-own__consent input {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--inm-own-text);
}

.inm-own__msg:empty { display: none; }
.inm-own__msg { margin: 4px 0 0; font-size: 14px; font-weight: 600; }

/* --- Podpowiedzi „Mamy to w portalu” ------------------------------------- */

.inm-own__sug {
	position: absolute;
	top: 100%;
	/* Na telefonie lista sięga pod przycisk „+” (52 px i odstęp 8 px). */
	right: -60px;
	left: 0;
	z-index: 20;
	padding: 10px 12px;
	background: var(--inm-own-bg);
}

.inm-own__sug-title { margin: 0 0 6px; font-size: 13px; font-weight: 600; }

.inm-own__sug-list { margin: 0; padding: 0; list-style: none; }

.inm-own__sug-row {
	display: grid;
	grid-template-columns: 36px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	margin: 0;
	padding: 6px 0;
	border-bottom: 1px solid var(--inm-own-line);
}

.inm-own__sug-thumb {
	display: block;
	width: 36px;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	background: var(--inm-own-muted);
}

.inm-own__sug-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }

.inm-own__sug-text { min-width: 0; }

.inm-own .inm-own__sug-name {
	display: -webkit-box;
	overflow: hidden;
	color: var(--inm-own-text);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* Telefon: samo serduszko (etykieta w aria-label), jak w makiecie. */
.inm-own .inm-own__sug-row .inm-own__btn--sm { width: 44px; min-height: 44px; padding: 0; }
.inm-own__sug-label { display: none; }

.inm-own .inm-own__sug-name:hover { text-decoration: underline; }

.inm-own__sug-meta { display: block; color: var(--inm-own-meta); font-size: 13px; }

.inm-own .inm-own__as-own {
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	min-height: 44px;
	margin: 6px 0 0;
	padding: 0 4px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--inm-own-text);
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	text-align: left;
	cursor: pointer;
}

.inm-own .inm-own__as-own:hover { background: var(--inm-own-hover); }

/* --- Krok 2 -------------------------------------------------------------- */

.inm-own.is-details .inm-own__intro { display: none; }
.inm-own.is-limit .inm-own__lead { display: none; }

.inm-own__done {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
	margin: 0;
	font-size: 15px;
}

.inm-own__done:focus { outline: none; }

.inm-own__heart {
	align-self: center;
	fill: var(--inm-own-accent);
	stroke: var(--inm-own-text);
	stroke-width: 1.6;
	stroke-linejoin: round;
}

.inm-own .inm-own__undo {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--inm-own-text);
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	text-decoration: underline;
	cursor: pointer;
}

.inm-own__details {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin-top: 12px;
}

.inm-own__kinds,
.inm-own__cell--place,
.inm-own__actions { grid-column: 1 / -1; }

.inm-own__kinds { min-width: 0; margin: 0; padding: 0; border: 0; }

.inm-own__label {
	display: block;
	margin: 0 0 4px;
	padding: 0;
	font-size: 13px;
	font-weight: 600;
}

.inm-own__seg { display: flex; }

.inm-own__opt { position: relative; flex: 1; cursor: pointer; }

.inm-own__opt input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.inm-own__opt span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 12px;
	font-size: 14px;
	transition: background-color var(--inm-motion-duration, 150ms) ease;
}

.inm-own__opt:hover span { background: var(--inm-own-hover); }

.inm-own__opt input:checked + span {
	background: var(--inm-own-bg);
	box-shadow: inset 0 -2px 0 var(--inm-own-accent);
	font-weight: 600;
}

.inm-own .inm-own__details .inm-own__input { height: 48px; }

.inm-own__actions {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px;
	margin-top: 4px;
}

.inm-own .inm-own__actions .inm-own__btn { min-height: 48px; font-size: 15px; }

/* --- Limit --------------------------------------------------------------- */

.inm-own__step--limit {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
}

.inm-own__limit { flex: 1 1 280px; margin: 0; font-size: 15px; }

/* --- Lista ulubionych: własna pozycja ------------------------------------ */

.inm-favorites-list .inm-favorites-item-image--local {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--inm-bg-muted, #ECEFE7);
	color: var(--inm-text-dark, #303431);
	font-size: 28px;
	font-weight: 600;
	line-height: 1;
}

.inm-favorites-list .inm-favorites-item--local .inm-favorites-item-title { font-weight: 600; }

/* --- Szersze ekrany ------------------------------------------------------ */

@media (min-width: 768px) {
	.inm-own { --inm-own-gutter: 24px; --inm-own-edge: 22px; }

	.inm-own .inm-own__title { font-size: 34px; }

	.inm-own__row { grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: end; }

	.inm-own .inm-own__btn--add { padding: 0 24px; }

	.inm-own__sug { right: 0; }
	.inm-own .inm-own__sug-row .inm-own__btn--sm { width: auto; min-height: 40px; padding: 0 12px; }
	.inm-own__sug-label { display: inline; }

	.inm-own__btn-text {
		position: static;
		width: auto;
		height: auto;
		overflow: visible;
		clip: auto;
	}

	.inm-own__details {
		grid-template-columns: auto 170px 120px minmax(0, 1fr) auto;
		gap: 20px;
		align-items: end;
	}

	.inm-own__kinds,
	.inm-own__cell--place,
	.inm-own__actions { grid-column: auto; }

	.inm-own__opt { flex: none; }
	.inm-own__opt span { min-height: 48px; padding: 0 14px; }

	.inm-own__actions { grid-template-columns: auto auto; margin-top: 0; }
}

@media (min-width: 1024px) {
	.inm-own { --inm-own-gutter: 32px; --inm-own-edge: 26px; }

	.inm-own__wrap {
		grid-template-columns: 300px minmax(0, 1fr);
		column-gap: 32px;
		align-items: end;
	}

	.inm-own__wrap > .inm-own__step,
	.inm-own__wrap > .inm-own__msg { grid-column: 2; }

	.inm-own.is-details .inm-own__wrap > .inm-own__step,
	.inm-own.is-details .inm-own__wrap > .inm-own__msg { grid-column: 1 / -1; }

	.inm-own__wrap > .inm-own__step--add .inm-own__foot { margin-top: 14px; }

	.inm-own--embedded .inm-own__wrap { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: 64px; }
}

@media (prefers-reduced-motion: reduce) {
	.inm-own *,
	.inm-own *::before,
	.inm-own *::after { transition: none !important; }
}
