/* Animal add/edit modal — shared by classic + site-v2 (classic loads this file only) */
:root {
	--al-ink: #1a2221;
	--al-muted: #5f6b69;
	--al-line: #e8eeee;
	--al-teal: #12a89d;
}

.modal.alv2-animal-modal,
#addAnimal.modal,
#changeAnimal.modal,
body > .modal.alv2-animal-modal,
body > #addAnimal.modal,
body > #changeAnimal.modal {
	position: fixed !important;
	top: 0;
	left: 0;
	z-index: 14000 !important;
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	outline: 0;
}

body.modal-open .modal-backdrop {
	z-index: 13990 !important;
}

.modal.alv2-animal-modal .modal-dialog,
#addAnimal.modal .modal-dialog,
#changeAnimal.modal .modal-dialog {
	margin: 1.75rem auto;
	max-width: 640px;
	pointer-events: none;
}

.modal.alv2-animal-modal .modal-content,
#addAnimal.modal .modal-content,
#changeAnimal.modal .modal-content {
	pointer-events: auto;
}

.modal.alv2-animal-modal .modal-body,
.modal.alv2-animal-modal .modal-content,
#addAnimal.modal .modal-body,
#addAnimal.modal .modal-content {
	overflow: visible;
}

#addAnimal .select2-container:not(.alv2-breed-select2-container):not(.alv2-change-animal-select2-container),
#changeAnimal .select2-container:not(.alv2-breed-select2-container):not(.alv2-change-animal-select2-container),
.alv2-animal-modal .select2-container:not(.alv2-breed-select2-container):not(.alv2-change-animal-select2-container) {
	display: none !important;
}

#addAnimal select.alv2-breed-select-search[name="breed"] + .select2-container,
.alv2-animal-modal select.alv2-breed-select-search[name="breed"] + .select2-container,
#addAnimal .select2-container.alv2-breed-select2-container,
.alv2-animal-modal .select2-container.alv2-breed-select2-container,
#changeAnimal select.alv2-change-animal-select + .select2-container,
#changeAnimal .select2-container.alv2-change-animal-select2-container {
	display: block !important;
	width: 100% !important;
}

#addAnimal select.form-control:not(.alv2-breed-select-search),
.alv2-animal-modal select.form-control:not(.alv2-breed-select-search),
#changeAnimal select.form-control:not(.alv2-change-animal-select),
#addAnimal select.alv2-breed-select-search:not(.select2-hidden-accessible),
.alv2-animal-modal select.alv2-breed-select-search:not(.select2-hidden-accessible) {
	display: block !important;
	width: 100%;
	min-height: 48px;
	font-size: 16px;
}

#addAnimal select.alv2-breed-select-search.select2-hidden-accessible,
.alv2-animal-modal select.alv2-breed-select-search.select2-hidden-accessible,
#changeAnimal select.alv2-change-animal-select.select2-hidden-accessible {
	display: none !important;
}

.alv2-breed-select2-dropdown,
.alv2-change-animal-select2-dropdown {
	z-index: 14100 !important;
}

.select2-container.alv2-breed-select2-container .select2-selection--single,
.select2-container.alv2-change-animal-select2-container .select2-selection--single {
	min-height: 48px;
	border: 1px solid #d8dee8;
	border-radius: 8px;
	padding: 8px 12px;
	font-size: 16px;
}

.select2-container.alv2-breed-select2-container .select2-selection__rendered,
.select2-container.alv2-change-animal-select2-container .select2-selection__rendered {
	line-height: 30px;
	padding-left: 0;
}

.select2-container.alv2-breed-select2-container .select2-selection__arrow,
.select2-container.alv2-change-animal-select2-container .select2-selection__arrow {
	height: 100%;
	right: 8px;
}

.alv2-breed-select2-dropdown.select2-dropdown,
.alv2-change-animal-select2-dropdown.select2-dropdown {
	border: 1px solid var(--al-line);
	border-radius: 10px;
	box-shadow: 0 12px 32px rgba(15, 40, 36, 0.14);
	overflow: hidden;
}

.alv2-breed-select2-dropdown .select2-search--dropdown,
.alv2-change-animal-select2-dropdown .select2-search--dropdown {
	padding: 8px;
}

.alv2-breed-select2-dropdown .select2-search__field,
.alv2-change-animal-select2-dropdown .select2-search__field {
	border: 1px solid var(--al-line);
	border-radius: 8px;
	padding: 8px 10px;
	font-size: 16px;
}

.alv2-breed-select2-dropdown .select2-results__option,
.alv2-change-animal-select2-dropdown .select2-results__option {
	padding: 10px 12px;
	font-size: 15px;
}

.alv2-breed-select2-dropdown .select2-results__option--highlighted[aria-selected],
.alv2-change-animal-select2-dropdown .select2-results__option--highlighted[aria-selected] {
	background: var(--al-teal);
	color: #fff;
}

.alv2-animal-form-footer {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 12px;
}

.alv2-animal-review-step {
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
}

.alv2-animal-review-step[hidden],
.alv2-animal-form-step[hidden] {
	display: none !important;
}

.alv2-animal-review {
	padding: 14px 16px;
	border: 1px solid var(--al-line);
	border-radius: 14px;
	background: #f7faf9;
}

.alv2-animal-review__list {
	margin: 0;
	display: grid;
	gap: 10px;
}

.alv2-animal-review__row {
	display: grid;
	grid-template-columns: minmax(0, 38%) minmax(0, 1fr);
	gap: 10px;
	align-items: start;
}

.alv2-animal-review__row dt {
	margin: 0;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--al-muted);
}

.alv2-animal-review__row dd {
	margin: 0;
	font-size: 0.92rem;
	font-weight: 600;
	color: var(--al-ink);
	word-break: break-word;
}

.alv2-animal-review__confirm {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	font-size: 0.92rem;
	font-weight: 600;
	color: var(--al-ink);
	cursor: pointer;
}

.alv2-animal-review__confirm input {
	margin-top: 3px;
	flex-shrink: 0;
}

.alv2-animal-review__actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
}

.alv2-animal-review-trigger,
.alv2-animal-review-submit {
	min-height: 46px;
}

.alv2-animal-review-trigger {
	width: 100%;
}

.alv2-animal-review-submit {
	display: none;
	min-width: 132px;
	margin-left: auto;
}

.alv2-animal-review-submit.is-ready {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.al-wheel-picker {
	position: fixed;
	inset: 0;
	z-index: 15000;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.18s ease;
}

.al-wheel-picker.is-open {
	pointer-events: auto;
	opacity: 1;
}

.al-wheel-picker__backdrop {
	position: absolute;
	inset: 0;
	border: 0;
	background: rgba(15, 23, 42, 0.45);
}

.al-wheel-picker__sheet {
	position: relative;
	width: min(100%, 480px);
	background: #fff;
	border-radius: 18px 18px 0 0;
	box-shadow: 0 -8px 32px rgba(15, 23, 42, 0.18);
	transform: translateY(100%);
	transition: transform 0.22s ease;
}

.al-wheel-picker.is-open .al-wheel-picker__sheet {
	transform: translateY(0);
}

.al-wheel-picker__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	border-bottom: 1px solid var(--al-line);
}

.al-wheel-picker__title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--al-ink);
}

.al-wheel-picker__btn {
	border: 0;
	background: transparent;
	font: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	padding: 8px 4px;
}

.al-wheel-picker__btn--ghost {
	color: var(--al-muted);
}

.al-wheel-picker__btn--primary {
	color: var(--al-teal);
}

.al-wheel-picker__wheels {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1.2fr 1fr;
	gap: 0;
	padding: 8px 0 20px;
	min-height: 220px;
}

.al-wheel-picker__highlight {
	position: absolute;
	left: 12px;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	height: 40px;
	border-radius: 10px;
	background: rgba(18, 168, 157, 0.1);
	border: 1px solid rgba(18, 168, 157, 0.18);
	pointer-events: none;
	z-index: 0;
}

.al-wheel-picker__col {
	position: relative;
	z-index: 1;
	min-width: 0;
}

.al-wheel-picker__list {
	height: 220px;
	overflow-y: auto;
	scroll-snap-type: y mandatory;
	scrollbar-width: none;
	margin: 0;
	padding: 90px 0;
	list-style: none;
}

.al-wheel-picker__list::-webkit-scrollbar {
	display: none;
}

.al-wheel-picker__item {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	scroll-snap-align: center;
	font-size: 1rem;
	color: var(--al-muted);
	cursor: pointer;
	user-select: none;
}

.al-wheel-picker__item.is-selected {
	color: #0f172a;
	font-weight: 600;
}

.al-wheel-date-input {
	cursor: pointer;
	caret-color: transparent;
}

.alapp-photo-upload {
	display: flex;
	align-items: center;
	gap: 16px;
}

.alapp-photo-upload__preview-wrap {
	position: relative;
	flex-shrink: 0;
	width: 72px;
	height: 72px;
}

.alapp-photo-upload__preview {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--al-line);
	background: #f7faf9;
}

.alapp-photo-upload__preview--empty {
	opacity: 0;
}

.alapp-photo-upload__placeholder {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: #f7faf9;
	color: var(--al-muted);
	border: 2px solid var(--al-line);
}

.alapp-photo-upload__placeholder svg {
	width: 32px;
	height: 32px;
	fill: currentColor;
}

.alapp-photo-upload__body {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	flex: 1;
}

.alapp-photo-upload__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: flex-start;
	min-height: 40px;
	padding: 0 16px;
	border: 1px solid var(--al-teal);
	border-radius: 999px;
	background: #e8f7f5;
	color: #0f766e;
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.alapp-photo-upload__hint,
.alapp-photo-upload__name {
	margin: 0;
	font-size: 12px;
	color: var(--al-muted);
	line-height: 1.35;
}

.alapp-photo-upload__name {
	font-weight: 500;
	color: var(--al-ink);
}

.alapp-photo-upload__input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	overflow: hidden;
}