/* ==========================================================================
   GARAN GENERATOR – generátor, účet, oznámenia

   Premenné `--garan-*` definuje téma; fallbacky zabezpečia slušný vzhľad
   aj v inej téme.
   ========================================================================== */

@font-face {
	font-family: 'Inter-Regular';
	src: url('../fonts/Inter-Regular.woff2') format('woff2');
	font-weight: 100 900;
	font-display: swap;
}

@font-face {
	font-family: 'Inter-ExtraBold';
	src: url('../fonts/Inter-ExtraBold.woff2') format('woff2');
	font-weight: 100 900;
	font-display: swap;
}

/* Atribút hidden má prednosť pred display: flex/grid komponentov. */
.garan-generator [hidden],
.garan-account [hidden] {
	display: none !important;
}

.garan-generator {
	--g-text: var(--garan-text, #0f172a);
	--g-muted: var(--garan-muted, #64748b);
	--g-border: var(--garan-border, #e2e8f0);
	--g-surface: var(--garan-surface, #ffffff);
	--g-mist: var(--garan-mist, #f5f7fa);
	--g-accent: var(--garan-accent, #034ea2);
	--g-accent-dark: var(--garan-accent-dark, #023b7a);
	--g-success: var(--garan-success, #15803d);
	--g-error: var(--garan-error, #b91c1c);
	--g-radius: var(--garan-radius, 12px);
	--g-radius-sm: var(--garan-radius-sm, 8px);
	--g-font: var(--garan-font, 'Inter', system-ui, sans-serif);

	font-family: var(--g-font);
	color: var(--g-text);
}

.garan-generator__grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	gap: clamp(24px, 4vw, 56px);
	align-items: start;
}

@media (max-width: 900px) {
	.garan-generator__grid {
		grid-template-columns: 1fr;
	}

	.garan-preview {
		order: -1;
	}
}

/* ---- Formulár ----------------------------------------------------------- */

.garan-form {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: clamp(20px, 3vw, 32px);
	background: var(--g-surface);
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
}

.garan-form__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}

.garan-form__title,
.garan-preview__title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 600;
	letter-spacing: -0.01em;
}

.garan-form__usage {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 0.8125rem;
	color: var(--g-muted);
}

.garan-form__plan {
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--g-mist);
	font-weight: 600;
	color: var(--g-text);
}

.garan-form__count {
	font-variant-numeric: tabular-nums;
}

.garan-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.garan-field__label {
	font-size: 0.875rem;
	font-weight: 600;
}

.garan-field__row {
	display: flex;
	align-items: center;
	gap: 12px;
}

.garan-field__input {
	width: 100%;
	min-height: 48px;
	padding: 0 14px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-surface);
	font: inherit;
	font-size: 1rem;
	color: var(--g-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.garan-field__input:focus {
	outline: none;
	border-color: var(--g-accent);
	box-shadow: 0 0 0 3px rgba(3, 78, 162, 0.18);
}

.garan-field__input.is-invalid {
	border-color: var(--g-error);
}

.garan-field__input--short {
	width: 120px;
	font-variant-numeric: tabular-nums;
}

.garan-field__suffix {
	color: var(--g-muted);
}

.garan-field__hint {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--g-muted);
}

.garan-field__error {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--g-error);
}

.garan-field__error:empty {
	display: none;
}

.garan-form__message {
	margin: 0;
	padding: 12px 14px;
	border-radius: var(--g-radius-sm);
	background: var(--g-mist);
	font-size: 0.875rem;
	line-height: 1.5;
}

.garan-form__message.is-error {
	background: #fdf2f2;
	color: var(--g-error);
}

.garan-form__message.is-error a {
	color: inherit;
	font-weight: 600;
}

.garan-form__note {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--g-muted);
}

.garan-form__note a {
	color: var(--g-accent);
	font-weight: 600;
}

/* ---- Tlačidlá ----------------------------------------------------------- */

.garan-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 22px;
	border: 1px solid transparent;
	border-radius: var(--g-radius-sm);
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.garan-btn--primary {
	background: var(--g-accent);
	color: #fff;
}

.garan-btn--primary:hover,
.garan-btn--primary:focus-visible {
	background: var(--g-accent-dark);
	color: #fff;
	text-decoration: none;
}

.garan-btn--ghost {
	background: transparent;
	border-color: var(--g-border);
	color: var(--g-text);
}

.garan-btn--ghost:hover {
	border-color: var(--g-text);
	text-decoration: none;
}

.garan-btn:disabled {
	opacity: 0.6;
	cursor: progress;
}

.garan-form__submit {
	width: 100%;
	font-size: 1rem;
}

/* ---- Náhľad ------------------------------------------------------------- */

.garan-preview {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

.garan-preview__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.garan-preview__badge {
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--g-mist);
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--g-muted);
}

.garan-preview__badge.is-done {
	background: #e6f4ec;
	color: var(--g-success);
}

.garan-preview__stage {
	display: flex;
	justify-content: center;
	padding: clamp(20px, 4vw, 48px);
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
	background:
		radial-gradient(120% 90% at 50% 0%, rgba(3, 78, 162, 0.07), transparent 60%),
		var(--g-mist);
}

.garan-preview__label {
	width: min(100%, 420px);
	aspect-ratio: 269.29 / 283.46;
	background: #fff;
	box-shadow:
		0 1px 2px rgba(15, 23, 42, 0.06),
		0 24px 48px -24px rgba(15, 23, 42, 0.25);
}

.garan-preview__label svg,
.garan-preview__label img {
	display: block;
	width: 100%;
	height: auto;
}

/* Statický fallback, kým sa nenačíta šablóna. */
.garan-preview__label.is-live .garan-preview__fallback {
	display: none;
}

.garan-preview__legal {
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--g-muted);
}

.garan-preview__legal a {
	color: var(--g-accent);
}

/* ---- Výsledok a stiahnutie --------------------------------------------- */

.garan-result {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 20px;
	border: 1px solid #a7d7b8;
	border-radius: var(--g-radius);
	background: #f3faf6;
}

.garan-result__title {
	margin: 0;
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--g-success);
}

.garan-result__meta {
	margin: 0;
	font-size: 0.875rem;
	color: var(--g-muted);
}

.garan-downloads {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
}

.garan-downloads__item {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-surface);
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--g-text);
	text-decoration: none;
	transition: border-color 0.15s ease;
}

.garan-downloads__item:hover {
	border-color: var(--g-accent);
	color: var(--g-accent);
	text-decoration: none;
}

.garan-downloads__item.is-locked {
	color: var(--g-muted);
	background: var(--g-mist);
}

.garan-downloads__item.is-locked:hover {
	border-color: var(--g-border);
	color: var(--g-muted);
}

.garan-downloads__item.is-pending {
	opacity: 0.6;
}

.garan-downloads__tag {
	padding: 2px 6px;
	border-radius: 4px;
	background: var(--g-accent);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #fff;
}

.garan-result__links {
	margin: 0;
	font-size: 0.875rem;
	color: var(--g-muted);
}

.garan-result__links a {
	color: var(--g-accent);
	font-weight: 600;
}

.garan-generator.is-busy .garan-preview__label {
	opacity: 0.85;
}

/* ---- Účet: využitie plánu a tabuľka ----------------------------------- */

.garan-account,
.garan-account-summary,
.garan-notice {
	--g-text: var(--garan-text, #0f172a);
	--g-muted: var(--garan-muted, #64748b);
	--g-border: var(--garan-border, #e2e8f0);
	--g-surface: var(--garan-surface, #ffffff);
	--g-mist: var(--garan-mist, #f5f7fa);
	--g-accent: var(--garan-accent, #034ea2);
	--g-accent-dark: var(--garan-accent-dark, #023b7a);
	--g-success: var(--garan-success, #15803d);
	--g-radius: var(--garan-radius, 12px);
	--g-radius-sm: var(--garan-radius-sm, 8px);
}

.garan-account {
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.garan-usage {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 22px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
	background: var(--g-surface);
}

.garan-usage__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.garan-usage__title {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
}

.garan-usage__plan {
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--g-mist);
	font-size: 0.8125rem;
	font-weight: 600;
}

.garan-usage__count {
	margin: 0;
	font-size: 1.75rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	color: var(--g-muted);
}

.garan-usage__count strong {
	color: var(--g-text);
}

.garan-usage__bar {
	height: 8px;
	overflow: hidden;
	border-radius: 999px;
	background: var(--g-mist);
}

.garan-usage__bar span {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--g-accent);
	transition: width 0.3s ease;
}

.garan-usage__note {
	margin: 0;
	font-size: 0.875rem;
	color: var(--g-muted);
}

.garan-usage__note a,
.garan-account__empty a {
	color: var(--g-accent);
	font-weight: 600;
}

.garan-account-summary {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-block: 20px;
	padding: 18px 20px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
	background: var(--g-mist);
}

.garan-account-summary p {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.garan-table-wrap {
	overflow-x: auto;
}

.garan-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9375rem;
}

.garan-table th,
.garan-table td {
	padding: 12px 10px;
	border-bottom: 1px solid var(--g-border);
	text-align: left;
	vertical-align: middle;
}

.garan-table th {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--g-muted);
}

.garan-table code {
	font-size: 0.875em;
	padding: 2px 6px;
	border-radius: 4px;
	background: var(--g-mist);
}

.garan-table__downloads {
	white-space: nowrap;
}

.garan-table__downloads a,
.garan-table__downloads span {
	display: inline-block;
	margin-right: 10px;
	font-weight: 600;
}

.garan-table__downloads a {
	color: var(--g-accent);
}

.garan-table__downloads .is-locked {
	color: var(--g-muted);
	opacity: 0.6;
	cursor: not-allowed;
}

@media (max-width: 720px) {
	.garan-table thead {
		display: none;
	}

	.garan-table tr {
		display: block;
		padding-block: 10px;
		border-bottom: 1px solid var(--g-border);
	}

	.garan-table td {
		display: flex;
		justify-content: space-between;
		gap: 16px;
		padding: 6px 0;
		border: 0;
	}

	.garan-table td::before {
		content: attr(data-label);
		font-size: 0.75rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		color: var(--g-muted);
	}

	.garan-table__downloads {
		white-space: normal;
	}
}

/* ---- Oznámenie po objednávke ------------------------------------------ */

.garan-notice {
	margin: 0 0 24px;
	padding: 14px 18px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-mist);
}

.garan-notice--success {
	border-color: #a7d7b8;
	background: #f2faf5;
}

.garan-notice a {
	color: var(--g-accent);
	font-weight: 600;
}

/* ---- Varianty ----------------------------------------------------------- */

.garan-variants {
	margin: 0;
	padding: 0;
	border: 0;
	min-width: 0;
}

.garan-variants legend {
	padding: 0;
	margin-bottom: 6px;
}

.garan-variants__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.garan-variants__item {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0 14px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.garan-variants__item input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.garan-variants__item:has(input:checked) {
	border-color: var(--g-accent);
	background: rgba(3, 78, 162, 0.08);
	color: var(--g-accent);
}

.garan-variants__item:has(input:focus-visible) {
	outline: 2px solid var(--g-accent);
	outline-offset: 2px;
}

.garan-preview__label[data-variant="nested"] {
	aspect-ratio: 368.5 / 56.69;
	width: 100%;
	align-self: center;
}

/* ---- Hromadný import ---------------------------------------------------- */

.garan-bulk {
	margin-top: clamp(40px, 6vw, 72px);
	padding: clamp(20px, 3vw, 32px);
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
	background: var(--g-mist);
}

.garan-bulk__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.garan-bulk__eyebrow {
	margin: 0 0 6px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--g-accent);
}

.garan-bulk__title {
	margin: 0 0 8px;
	font-size: 1.375rem;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.garan-bulk__text {
	max-width: 720px;
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--g-muted);
}

.garan-bulk__text code {
	padding: 1px 6px;
	border-radius: 4px;
	background: var(--g-surface);
	border: 1px solid var(--g-border);
	font-size: 0.85em;
}

.garan-bulk__login {
	margin: 0;
	font-size: 0.9375rem;
}

.garan-bulk__login a {
	color: var(--g-accent);
	font-weight: 600;
}

.garan-bulk__form {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.garan-bulk__row {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 10px;
}

.garan-bulk__file {
	position: relative;
	display: inline-flex;
	align-items: center;
	flex: 1 1 260px;
	min-height: 48px;
	padding: 0 14px;
	border: 1px dashed var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-surface);
	font-size: 0.9375rem;
	color: var(--g-muted);
	cursor: pointer;
}

.garan-bulk__file input {
	position: absolute;
	inset: 0;
	opacity: 0;
	cursor: pointer;
}

.garan-bulk__file:has(input:focus-visible) {
	outline: 2px solid var(--g-accent);
}

.garan-bulk__variant {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 0.875rem;
	font-weight: 600;
}

.garan-bulk__variant select {
	min-height: 48px;
	padding: 0 12px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-surface);
	font: inherit;
}

.garan-bulk__progress {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 16px;
}

.garan-bulk__progress p {
	margin: 0;
	font-size: 0.875rem;
	color: var(--g-muted);
}

.garan-bulk__result {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-top: 16px;
	padding: 20px;
	border: 1px solid #a7d7b8;
	border-radius: var(--g-radius);
	background: #f3faf6;
}

.garan-bulk__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.garan-bulk .garan-form__message {
	margin-top: 12px;
}

/* ---- Klikateľný odkaz --------------------------------------------------- */

.garan-link {
	--g-text: var(--garan-text, #0f172a);
	--g-muted: var(--garan-muted, #64748b);
	--g-border: var(--garan-border, #e2e8f0);
	--g-surface: var(--garan-surface, #ffffff);
	--g-mist: var(--garan-mist, #f5f7fa);
	--g-accent: var(--garan-accent, #034ea2);
	--g-accent-dark: var(--garan-accent-dark, #023b7a);
	--g-radius: var(--garan-radius, 12px);
	--g-radius-sm: var(--garan-radius-sm, 8px);
	font-family: var(--garan-font, 'Inter', system-ui, sans-serif);
}

.garan-link__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 24px;
}

.garan-link__form,
.garan-link__output {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 24px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
	background: var(--g-surface);
}

.garan-link__target {
	display: block;
	padding: 10px 12px;
	border-radius: var(--g-radius-sm);
	background: var(--g-mist);
	font-size: 0.8125rem;
	word-break: break-all;
}

.garan-link__preview {
	margin: 0;
	padding: 14px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-mist);
}

.garan-link__preview a {
	color: var(--g-accent);
	text-decoration: underline;
}

.garan-link__code {
	margin: 0;
	padding: 14px;
	overflow: auto;
	border-radius: var(--g-radius-sm);
	background: #0f172a;
	color: #e2e8f0;
	font-size: 0.8125rem;
	line-height: 1.5;
	white-space: pre-wrap;
	word-break: break-all;
}

.garan-link__output .garan-btn {
	align-self: flex-start;
}

.garan-link .garan-field__label {
	margin: 0;
}

/* ---- Účet: varianty v tabuľke ----------------------------------------- */

.garan-table__variant {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 6px;
	margin-bottom: 4px;
}

.garan-table__variant-name {
	color: var(--g-muted);
	font-size: 0.8125rem;
	margin-right: 4px;
}

.garan-table__more {
	display: inline-block;
	margin-top: 2px;
	font-size: 0.8125rem;
	color: var(--g-muted) !important;
	font-weight: 500 !important;
}

.garan-usage__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 6px 0 0;
}

/* ---- Kroky formulára ---------------------------------------------------- */

.garan-steps {
	display: flex;
	gap: 6px;
	margin: 0 0 4px;
	padding: 0;
	list-style: none;
}

.garan-steps__item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 1 1 0;
	padding: 8px 10px;
	border-radius: var(--g-radius-sm);
	background: var(--g-mist);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--g-muted);
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.garan-steps__item span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 999px;
	background: var(--g-surface);
	font-size: 0.75rem;
	color: var(--g-muted);
}

.garan-steps__item.is-active {
	background: rgba(3, 78, 162, 0.1);
	color: var(--g-accent);
}

.garan-steps__item.is-active span,
.garan-steps__item.is-done span {
	background: var(--g-accent);
	color: #fff;
}

.garan-steps__item.is-done {
	color: var(--g-text);
}

.garan-step {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.garan-step__nav {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 4px;
}

.garan-step__nav .garan-btn--primary {
	flex: 1 1 auto;
}

.garan-variants__help {
	margin: 0;
	padding-left: 1.2em;
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--g-muted);
}

.garan-summary {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.garan-summary__list {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
	padding: 14px 16px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-mist);
}

.garan-summary__list > div {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	font-size: 0.9375rem;
}

.garan-summary__list > div[hidden] {
	display: none;
}

.garan-summary__list dt {
	color: var(--g-muted);
}

.garan-summary__list dd {
	margin: 0;
	font-weight: 600;
	text-align: right;
}

/* ---- Výber formátov ------------------------------------------------------ */

.garan-formats {
	margin: 0;
	padding: 0;
	border: 0;
	min-width: 0;
}

.garan-formats legend {
	padding: 0;
	margin-bottom: 6px;
}

.garan-formats__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.garan-formats__item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	padding: 0 12px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
}

.garan-formats__item input {
	accent-color: var(--g-accent);
}

.garan-formats__item:has(input:checked) {
	border-color: var(--g-accent);
	background: rgba(3, 78, 162, 0.08);
}

.garan-formats__item.is-locked {
	color: var(--g-muted);
	background: var(--g-mist);
	cursor: not-allowed;
}

.garan-formats__item em {
	padding: 1px 6px;
	border-radius: 4px;
	background: var(--g-accent);
	font-size: 0.6875rem;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #fff;
}

/* ---- Zvýraznenie poľa v náhľade ---------------------------------------- */

.garan-preview__label {
	position: relative;
}

.garan-preview__svg svg,
.garan-preview__svg img {
	display: block;
	width: 100%;
	height: auto;
}

.garan-spot {
	position: absolute;
	border: 2px solid var(--g-accent);
	border-radius: 6px;
	background: rgba(3, 78, 162, 0.08);
	box-shadow: 0 0 0 3px rgba(3, 78, 162, 0.12);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.15s ease;
}

.garan-spot span {
	position: absolute;
	top: -22px;
	left: -2px;
	padding: 2px 8px;
	border-radius: 4px;
	background: var(--g-accent);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #fff;
	white-space: nowrap;
}

.garan-spot--brand { left: 1.5%; top: 22.5%; width: 45%; height: 6.5%; }
.garan-spot--model { left: 71%; top: 22.5%; width: 27.5%; height: 6.5%; }
.garan-spot--years { left: 0.8%; top: 31.2%; width: 43.2%; height: 23.6%; }

.garan-preview__label[data-variant="nested"] .garan-spot--brand,
.garan-preview__label[data-variant="nested"] .garan-spot--model { display: none; }
.garan-preview__label[data-variant="nested"] .garan-spot--years { left: 2%; top: 24%; width: 16.5%; height: 62%; }

.garan-preview__label.is-focus-brand .garan-spot--brand,
.garan-preview__label.is-focus-model .garan-spot--model,
.garan-preview__label.is-focus-years .garan-spot--years {
	opacity: 1;
}

/* ---- História označení -------------------------------------------------- */

.garan-history {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.garan-history__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	margin-bottom: 6px;
}

.garan-history__title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
}

.garan-history__title span {
	margin-left: 6px;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--g-mist);
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--g-muted);
}

.garan-history__hint {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--g-muted);
}

.garan-history__row {
	display: grid;
	grid-template-columns: 1.1fr 1.2fr 0.9fr 0.9fr 2.4fr;
	gap: 16px;
	align-items: center;
	padding: 14px 18px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
	background: var(--g-surface);
}

.garan-history__row--head {
	padding: 0 18px;
	border: 0;
	background: transparent;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--g-muted);
}

.garan-history__cell {
	min-width: 0;
	font-size: 0.9375rem;
}

.garan-history__cell code {
	padding: 2px 6px;
	border-radius: 4px;
	background: var(--g-mist);
	font-size: 0.875em;
	white-space: nowrap;
}

.garan-history__downloads {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.garan-history__variant {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.garan-history__variant-name {
	min-width: 72px;
	font-size: 0.75rem;
	color: var(--g-muted);
}

.garan-history__links {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
}

.garan-dl {
	display: inline-flex;
	align-items: center;
	min-height: 30px;
	padding: 0 10px;
	border: 1px solid var(--g-border);
	border-radius: 6px;
	background: var(--g-surface);
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--g-accent);
	text-decoration: none !important;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.garan-dl:hover {
	border-color: var(--g-accent);
	background: rgba(3, 78, 162, 0.08);
}

.garan-dl.is-locked {
	color: var(--g-muted);
	background: var(--g-mist);
	cursor: not-allowed;
}

.garan-dl--prepare {
	color: var(--g-text);
}

.garan-history__more {
	font-size: 0.75rem;
	color: var(--g-muted) !important;
	font-weight: 500 !important;
}

@media (max-width: 860px) {
	.garan-history__row--head {
		display: none;
	}

	.garan-history__row {
		grid-template-columns: 1fr 1fr;
	}

	.garan-history__cell::before {
		content: attr(data-label);
		display: block;
		font-size: 0.6875rem;
		font-weight: 600;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		color: var(--g-muted);
	}

	.garan-history__downloads {
		grid-column: 1 / -1;
	}
}

/* ---- Menu účtu s ikonami ------------------------------------------------ */

.woocommerce-MyAccount-navigation a {
	display: flex !important;
	align-items: center;
	gap: 10px;
}

.woocommerce-MyAccount-navigation a::before {
	content: '';
	flex: none;
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: var(--garan-nav-icon) center / contain no-repeat;
	mask: var(--garan-nav-icon) center / contain no-repeat;
	opacity: 0.8;
}

.woocommerce-MyAccount-navigation-link--dashboard a { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='8' height='8' rx='2'/%3E%3Crect x='13' y='3' width='8' height='8' rx='2'/%3E%3Crect x='3' y='13' width='8' height='8' rx='2'/%3E%3Crect x='13' y='13' width='8' height='8' rx='2'/%3E%3C/svg%3E"); }
.woocommerce-MyAccount-navigation-link--moje-garan-oznacenia a { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 5-3.5 8.5-7 10-3.5-1.5-7-5-7-10V6l7-3z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E"); }
.woocommerce-MyAccount-navigation-link--balicky a { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4l8 4-8 4-8-4 8-4z'/%3E%3Cpath d='M4 12l8 4 8-4M4 16l8 4 8-4'/%3E%3C/svg%3E"); }
.woocommerce-MyAccount-navigation-link--prepojenie-eshopu a { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14a4 4 0 005.7 0l3-3a4 4 0 00-5.7-5.7l-1 1'/%3E%3Cpath d='M14 10a4 4 0 00-5.7 0l-3 3a4 4 0 005.7 5.7l1-1'/%3E%3C/svg%3E"); }
.woocommerce-MyAccount-navigation-link--orders a { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l5 5v13H6z'/%3E%3Cpath d='M14 3v5h5M9 13h6M9 17h6'/%3E%3C/svg%3E"); }
.woocommerce-MyAccount-navigation-link--edit-address a { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10l1.5-5h13L20 10M4 10v10h16V10M10 20v-6h4v6'/%3E%3C/svg%3E"); }
.woocommerce-MyAccount-navigation-link--edit-account a { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0116 0'/%3E%3C/svg%3E"); }
.woocommerce-MyAccount-navigation-link--customer-logout a { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 4H5v16h5M14 8l4 4-4 4M18 12H9'/%3E%3C/svg%3E"); }

/* ---- Balíčky ------------------------------------------------------------- */

.garan-plan-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 10px;
	margin: 4px 0 0;
	padding: 0;
	list-style: none;
}

.garan-plan-facts li {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 10px 12px;
	border-radius: var(--g-radius-sm);
	background: var(--g-mist);
	font-size: 0.875rem;
}

.garan-plan-facts span {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--g-muted);
}

.garan-plans {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 12px;
}

.garan-plans__item {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 18px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
	background: var(--g-surface);
}

.garan-plans__item.is-current {
	border-color: var(--g-accent);
	box-shadow: 0 0 0 1px var(--g-accent);
}

.garan-plans__name {
	margin: 0;
	font-weight: 700;
}

.garan-plans__price {
	margin: 0;
	font-size: 1.375rem;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.garan-plans__price span {
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--g-muted);
}

.garan-plans__list {
	margin: 0;
	padding-left: 1.1em;
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--g-muted);
}

.garan-plans__item .garan-btn {
	margin-top: auto;
}

.garan-steps-list {
	margin: 0;
	padding-left: 1.3em;
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--g-text);
}

.garan-steps-list li + li {
	margin-top: 6px;
}

.garan-steps-list a {
	color: var(--g-accent);
	font-weight: 600;
}

/* ---- API kľúč ------------------------------------------------------------ */

.garan-apikey {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	padding: 14px;
	border: 1px solid #a7d7b8;
	border-radius: var(--g-radius-sm);
	background: #f2faf5;
}

.garan-apikey .garan-field__label {
	width: 100%;
	margin: 0;
}

.garan-apikey__value {
	flex: 1 1 320px;
	padding: 10px 12px;
	border-radius: 6px;
	background: var(--g-surface);
	border: 1px solid var(--g-border);
	font-size: 0.9rem;
	word-break: break-all;
	user-select: all;
}

.garan-apikey__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 8px;
}

/* ---- Google ---------------------------------------------------------------- */

.garan-google {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 16px;
}

.garan-google__or {
	position: relative;
	text-align: center;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--g-muted, #64748b);
}

.garan-google__or::before,
.garan-google__or::after {
	content: '';
	position: absolute;
	top: 50%;
	width: calc(50% - 32px);
	height: 1px;
	background: var(--g-border, #e2e8f0);
}

.garan-google__or::before { left: 0; }
.garan-google__or::after { right: 0; }

.garan-google__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 46px;
	border: 1px solid var(--g-border, #e2e8f0);
	border-radius: 8px;
	background: #fff;
	font-weight: 600;
	color: var(--g-text, #0f172a) !important;
	text-decoration: none !important;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.garan-google__btn:hover {
	border-color: var(--g-accent, #034ea2);
	background: #f5f7fa;
}

/* ---- Kompaktný generátor -------------------------------------------------- */

.garan-form {
	gap: 14px;
	padding: 20px 22px;
}

.garan-step {
	gap: 14px;
}

.garan-field {
	gap: 4px;
}

.garan-field__input {
	min-height: 44px;
}

.garan-field__hint {
	font-size: 0.75rem;
}

.garan-preview__stage {
	padding: 18px;
}

.garan-preview__label {
	width: min(100%, 340px);
}

.garan-result {
	gap: 10px;
	padding: 14px 16px;
}

.garan-downloads {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.garan-downloads__item {
	min-height: 36px;
	padding: 0 12px;
	font-size: 0.8125rem;
	white-space: nowrap;
}

.garan-downloads__item[hidden] {
	display: none !important;
}

.garan-result__meta {
	font-size: 0.8125rem;
}

.garan-generator__grid {
	gap: clamp(20px, 3vw, 36px);
}

/* ---- Nástenka ------------------------------------------------------------- */

.garan-dash__hello {
	margin: 0 0 4px;
	font-size: 1.0625rem;
}

.garan-dash__tiles {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 12px;
}

.garan-dash__tile {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 18px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius);
	background: var(--g-surface);
	color: var(--g-text) !important;
	text-decoration: none !important;
	transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.garan-dash__tile:hover {
	border-color: var(--g-accent);
	transform: translateY(-2px);
	box-shadow: 0 10px 24px -18px rgba(3, 78, 162, 0.5);
}

.garan-dash__icon {
	width: 36px;
	height: 36px;
	margin-bottom: 8px;
	border-radius: 10px;
	background: var(--g-accent-soft, #e6effa);
	position: relative;
}

.garan-dash__icon::after {
	content: '';
	position: absolute;
	inset: 8px;
	background: var(--g-accent);
	-webkit-mask: var(--garan-nav-icon) center / contain no-repeat;
	mask: var(--garan-nav-icon) center / contain no-repeat;
}

.garan-dash__icon--plus { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }
.garan-dash__icon--shield { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 5-3.5 8.5-7 10-3.5-1.5-7-5-7-10V6l7-3z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E"); }
.garan-dash__icon--box { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4l8 4-8 4-8-4 8-4z'/%3E%3Cpath d='M4 12l8 4 8-4M4 16l8 4 8-4'/%3E%3C/svg%3E"); }
.garan-dash__icon--link { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14a4 4 0 005.7 0l3-3a4 4 0 00-5.7-5.7l-1 1'/%3E%3Cpath d='M14 10a4 4 0 00-5.7 0l-3 3a4 4 0 005.7 5.7l1-1'/%3E%3C/svg%3E"); }
.garan-dash__icon--doc { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l5 5v13H6z'/%3E%3Cpath d='M14 3v5h5M9 13h6M9 17h6'/%3E%3C/svg%3E"); }
.garan-dash__icon--building { --garan-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10l1.5-5h13L20 10M4 10v10h16V10M10 20v-6h4v6'/%3E%3C/svg%3E"); }

.garan-dash__tile-title {
	font-weight: 700;
}

.garan-dash__tile-text {
	font-size: 0.8125rem;
	color: var(--g-muted);
}

/* ---- Predplatné a faktúra ------------------------------------------------- */

.garan-subs {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.garan-subs__item,
.garan-invoice-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-surface);
}

.garan-invoice-box {
	margin: 20px 0;
}

.garan-subs__item span,
.garan-invoice-box span {
	font-size: 0.8125rem;
	color: var(--g-muted);
}

.garan-subs__actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.garan-btn--danger {
	border: 1px solid #e5b4b4;
	background: #fff5f5;
	color: #b91c1c !important;
}

.garan-btn--danger:hover {
	background: #fee2e2;
}

/* ---- API kľúče (zoznam) ---------------------------------------------------- */

.garan-keys {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 4px 0;
}

.garan-keys__row {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 2fr) auto;
	gap: 12px;
	align-items: center;
	padding: 12px 14px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-surface);
}

.garan-keys__main {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.garan-keys__main code {
	font-size: 0.8125rem;
	color: var(--g-muted);
}

.garan-keys__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
	font-size: 0.8125rem;
	color: var(--g-muted);
}

.garan-keys__revoke {
	margin: 0;
}

.garan-apikey__actions .garan-field__input {
	flex: 1 1 260px;
}

@media (max-width: 720px) {
	.garan-keys__row {
		grid-template-columns: 1fr;
	}
}

/* ---- Výber variantu a formátov (karty) ---------------------------------- */

.garan-variants__list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px;
}

.garan-variants__item .garan-choice__body {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
}

.garan-variants__item .garan-choice__title {
	flex: 0 0 150px;
}

.garan-variants__item .garan-choice__desc {
	flex: 1 1 200px;
}

.garan-choice {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	min-height: 0;
	padding: 12px 14px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-surface);
	font-weight: 600;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.garan-choice:hover {
	border-color: var(--g-accent);
}

.garan-choice input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	pointer-events: none;
}

.garan-choice__mark {
	flex: none;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	border: 2px solid var(--g-border);
	border-radius: 50%;
	background: var(--g-surface);
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.garan-choice--check .garan-choice__mark {
	border-radius: 5px;
	margin-top: 0;
}

.garan-choice__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.garan-choice__title {
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--g-text);
	line-height: 1.2;
}

.garan-choice__desc {
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1.4;
	color: var(--g-muted);
}

.garan-choice.is-selected,
.garan-choice:has(input:checked) {
	border-color: var(--g-accent);
	background: rgba(3, 78, 162, 0.06);
	box-shadow: 0 0 0 1px var(--g-accent);
}

.garan-choice.is-selected .garan-choice__mark,
.garan-choice:has(input:checked) .garan-choice__mark {
	border-color: var(--g-accent);
	background: var(--g-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center / 12px no-repeat;
}

.garan-choice.is-selected .garan-choice__title,
.garan-choice:has(input:checked) .garan-choice__title {
	color: var(--g-accent);
}

.garan-choice:has(input:focus-visible) {
	outline: 2px solid var(--g-accent);
	outline-offset: 2px;
}

.garan-formats__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.garan-formats__item.garan-choice {
	align-items: center;
	padding: 9px 12px;
	min-height: 42px;
}

.garan-formats__item.is-locked {
	border-style: dashed;
	background: var(--g-mist);
	cursor: not-allowed;
}

.garan-formats__item.is-locked .garan-choice__title {
	color: var(--g-muted);
}

.garan-formats__item.is-locked .garan-choice__mark {
	opacity: 0.5;
}

.garan-formats__item.is-locked:hover {
	border-color: var(--g-border);
}

/* ---- Navigácia kroku: Späť + hlavné tlačidlo v jednom riadku ------------- */

.garan-step__nav {
	display: flex;
	gap: 10px;
	align-items: stretch;
	margin-top: 4px;
}

.garan-step__nav .garan-btn {
	min-height: 52px;
}

.garan-step__nav .garan-btn--ghost {
	flex: 0 0 auto;
	min-width: 120px;
}

.garan-step__nav .garan-form__submit,
.garan-step__nav .garan-btn--primary {
	flex: 1 1 auto;
	width: auto;
}

@media (max-width: 560px) {
	.garan-variants__item .garan-choice__title {
		flex-basis: 100%;
	}
}

.garan-btn.is-static {
	cursor: default;
	opacity: 0.8;
	pointer-events: none;
}

.garan-plans__vat {
	font-size: 0.6875rem;
	font-weight: 500;
	color: var(--g-muted);
}

/* ---- Filter histórie ------------------------------------------------------ */

.garan-history__filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 4px 0 12px;
}

.garan-history__search {
	flex: 1 1 260px;
}

.garan-history__search input,
.garan-history__years select {
	width: 100%;
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--g-border);
	border-radius: var(--g-radius-sm);
	background: var(--g-surface);
	font: inherit;
	color: var(--g-text);
}

.garan-history__search input:focus,
.garan-history__years select:focus {
	outline: none;
	border-color: var(--g-accent);
	box-shadow: 0 0 0 3px rgba(3, 78, 162, 0.12);
}

.garan-history__years {
	flex: 0 1 220px;
}

.garan-history__status {
	margin: 8px 0;
	font-size: 0.875rem;
	color: var(--g-muted);
}

.garan-history__more-wrap {
	margin: 12px 0 0;
	text-align: center;
}