/*
 * Resgata Tema – base dos blocos do plugin Resgata WP: variáveis `--resgata-*` e as peças
 * que mais de um bloco usa (botões, selos, etiquetas, setas). Carrega junto com o CSS de
 * qualquer bloco do plugin. As cores vêm do theme.json, então acompanham o que a protetora
 * mudar no Editor do Site. Antes de criar uma regra, veja o guia de design (designer.md).
 */
.resgata-animals,
.resgata-animal,
.resgata-contact,
.resgata-adoption,
.resgata-sponsorship,
.resgata-sponsor-area,
.resgata-banners,
.resgata-impact,
.resgata-pix,
.resgata-donate,
.resgata-contact-compact {
	--resgata-primary: var(--wp--preset--color--accent-3);
	--resgata-primary-dark: var(--wp--preset--color--primary-dark);
	--resgata-primary-soft: var(--wp--preset--color--accent-2);
	--resgata-heading: var(--wp--preset--color--contrast);
	--resgata-text: var(--wp--preset--color--text);
	--resgata-muted: var(--wp--preset--color--accent-4);
	--resgata-line: var(--wp--preset--color--accent-6);
	--resgata-card: var(--wp--preset--color--surface);
	--resgata-field: var(--wp--preset--color--surface);
	--resgata-tile: var(--wp--preset--color--tile);
	--resgata-section: var(--wp--preset--color--accent-5);
	--resgata-banner-fade: var(--wp--preset--color--base);
	--resgata-info: var(--wp--preset--color--info);
	--resgata-help: var(--wp--preset--color--help);
	--resgata-help-dark: color-mix(in srgb, var(--wp--preset--color--help) 82%, #000);
	--resgata-help-soft: var(--wp--preset--color--help-soft);
	--resgata-danger: #b3261e;
	--resgata-danger-soft: #fdecea;
	--resgata-radius-sm: var(--wp--preset--border-radius--small);
	--resgata-radius: var(--wp--preset--border-radius--medium);
	--resgata-radius-lg: 16px;
	--resgata-radius-pill: var(--wp--preset--border-radius--pill);
	--resgata-shadow: var(--wp--preset--shadow--card);
	--resgata-shadow-float: var(--wp--preset--shadow--floating);
}

.resgata-button {
	cursor: pointer;
}

/* Selos de situação (cores do guia de design) */
.resgata-badge {
	background: #eef1f5;
	border-radius: var(--resgata-radius-pill);
	color: #3d4759;
	display: inline-block;
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.4;
	padding: 0.3rem 0.8rem;
}

.resgata-badge--available {
	background: #ddf0e3;
	color: #1f5c3d;
}

.resgata-badge--reserved {
	background: #e8f0fd;
	color: #1d4fa8;
}

.resgata-badge--treatment {
	background: #fcd98a;
	color: #5c3d00;
}

.resgata-badge--adopted {
	background: #d9ccfa;
	color: #3f1f99;
}

.resgata-badge .resgata-icon {
	fill: currentColor;
	height: 1em;
	width: 1em;
}

.resgata-empty {
	background: var(--resgata-tile);
	color: var(--resgata-muted);
	border-radius: var(--resgata-radius);
	padding: var(--wp--preset--spacing--50);
	text-align: center;
}

/* Listagem e página do animal */
.resgata-animals,
.resgata-animal--page {
	color: var(--resgata-text);
	font-size: 1rem;
}

:is(.resgata-animal, .resgata-banners) .screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

:is(.resgata-animal, .resgata-banners) .resgata-icon {
	flex: none;
	height: 1.25em;
	width: 1.25em;
}

:is(.resgata-animal, .resgata-banners) a:focus-visible,
:is(.resgata-animal, .resgata-banners) button:focus-visible,
:is(.resgata-animal, .resgata-banners) [tabindex]:focus-visible {
	outline: 2px solid var(--resgata-primary);
	outline-offset: 2px;
}

/* Setas dos carrosséis (fotos do animal e banners). */
.resgata-viewer__arrow {
	align-items: center;
	background: #fff;
	border: 0;
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(20, 33, 61, 0.18);
	color: #14213d;
	cursor: pointer;
	display: flex;
	height: 2.75rem;
	justify-content: center;
	padding: 0;
	position: absolute;
	top: calc(50% - 1.375rem);
	width: 2.75rem;
}

.resgata-viewer__arrow[hidden] {
	display: none;
}

.resgata-viewer__arrow:disabled {
	cursor: default;
	opacity: 0.45;
}

.resgata-viewer__arrow--prev {
	left: 0.75rem;
}

.resgata-viewer__arrow--next {
	right: 0.75rem;
}

/* Temperamento (cartão e página do animal). */
.resgata-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	margin: 1rem 0 0;
	padding: 0;
}

.resgata-tag {
	background: var(--resgata-tile);
	border-radius: var(--resgata-radius-pill);
	color: var(--resgata-text);
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1.4;
	margin: 0;
	padding: 0.3rem 0.85rem;
}

/* Botões da página do animal e dos banners. */
:is(.resgata-animal, .resgata-banners) .resgata-button {
	align-items: center;
	border-radius: var(--resgata-radius-sm);
	box-sizing: border-box;
	display: inline-flex;
	font-size: 1rem;
	font-weight: 600;
	gap: 0.5rem;
	justify-content: center;
	line-height: 1.2;
	min-height: 3rem;
	padding: 0.5rem 1.25rem;
	text-align: center;
	text-decoration: none;
}

:is(.resgata-animal, .resgata-banners) .resgata-button--outline {
	background: var(--resgata-card);
	border: 1px solid var(--resgata-primary);
	color: var(--resgata-primary);
}

/* Cores do guia: botões da listagem e da página do animal. */
:is(.resgata-animals, .resgata-animal, .resgata-banners, .resgata-pix) .resgata-button--primary,
:is(.resgata-animals, .resgata-animal, .resgata-banners, .resgata-pix) .resgata-button--primary:visited {
	background: var(--resgata-primary);
	border: 1px solid var(--resgata-primary);
	color: #fff;
}

:is(.resgata-animals, .resgata-animal, .resgata-banners, .resgata-pix) .resgata-button--primary:hover,
:is(.resgata-animals, .resgata-animal, .resgata-banners, .resgata-pix) .resgata-button--primary:focus-visible {
	background: var(--resgata-primary-dark);
	border-color: var(--resgata-primary-dark);
	color: #fff;
}

:is(.resgata-animal, .resgata-banners) .resgata-button--outline:hover,
:is(.resgata-animal, .resgata-banners) .resgata-button--outline:focus-visible {
	background: var(--resgata-primary-soft);
}