/**
 * Cookie notice (inc/consent.php): a card at the bottom of the screen until
 * the visitor chooses. Phones: text above full-width buttons. Wider: the
 * buttons beside the text.
 */

.consent {
	position: fixed;
	z-index: 40;
	right: var(--space-3);
	bottom: var(--space-3);
	left: var(--space-3);
	max-width: 48rem;
	margin-inline: auto;
	padding: var(--space-5);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-card);
	background: var(--color-surface);
	box-shadow: 0 24px 48px -12px rgb(4 52 100 / 35%);
	color: var(--color-text);
	font-size: var(--step--1);
}

.consent[hidden] {
	display: none;
}

.consent__title {
	margin: 0 0 var(--space-1);
	font-size: var(--step-0);
}

.consent__text p {
	margin: 0;
}

.consent__actions {
	display: flex;
	gap: var(--space-2);
	margin-top: var(--space-4);
}

.consent__actions .button {
	flex: 1;
}

@media (min-width: 40rem) {

	.consent {
		right: var(--space-6);
		bottom: var(--space-6);
		left: var(--space-6);
		display: flex;
		gap: var(--space-6);
		align-items: center;
		padding: var(--space-6);
	}

	.consent__actions {
		flex: none;
		margin-top: 0;
	}
}

/* Footer, "Pomoć" column: "Podešavanja kolačića", a button that reads like
   the links around it (footer.css). */
.site-footer__consent {
	min-height: 36px;
	text-align: start;
	padding: 0;
	border: 0;
	background: none;
	color: var(--color-text-inverse);
	font: inherit;
	cursor: pointer;
}

.site-footer__consent:hover {
	color: var(--color-focus-inverse);
	text-decoration: underline;
}
