/**
 * Petoniki 0.27 homepage refinements.
 * Loaded after the legacy stylesheet and mega-menu compatibility layer.
 */

.xk-utility-bar .xk-language-dropdown__menu,
.xk-language-dropdown__menu { width: 176px; min-width: 176px; padding: 5px; }
.xk-utility-bar .xk-language-dropdown__menu a,
.xk-language-dropdown__menu a { display: grid; grid-template-columns: 27px max-content; justify-content: center; gap: 7px; box-sizing: border-box; min-height: 34px; padding: 5px 7px; border-radius: 7px; }
.xk-utility-bar .xk-language-dropdown__menu a > span:last-child,
.xk-language-dropdown__menu a > span:last-child { width: max-content; max-width: 120px; overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.xk-utility-bar .xk-language-dropdown__menu a:hover,
.xk-utility-bar .xk-language-dropdown__menu a:focus-visible,
.xk-language-dropdown__menu a:hover,
.xk-language-dropdown__menu a:focus-visible { background: #fff0bb; color: #075f61; box-shadow: inset 3px 0 #ff7622; transform: translateX(1px); }

.xk-legacy-selector.xk-pet-finder { padding: 18px; }
.xk-pet-finder__header { grid-template-columns: minmax(290px, 320px) minmax(0, 1fr); gap: 18px; padding: 0 2px 13px; }
.xk-pet-finder__viewport { padding: 3px 1px; }
.xk-pet-finder__species-button:hover,
.xk-pet-finder__species-button:focus-visible { border-color: #ff7622; box-shadow: inset 0 0 0 1px #ff7622, 0 4px 12px rgb(255 105 28 / 14%); transform: none; }
.xk-pet-finder__filters { margin: 0; border: 1px solid #f0d7bd; border-radius: 15px; background: rgb(255 255 255 / 82%); overflow: hidden; }
.xk-pet-finder__panel:not([hidden]) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.xk-pet-finder__filter-row { display: grid; grid-template-columns: 1fr; align-content: start; gap: 9px; min-width: 0; min-height: 91px; padding: 13px 15px; border-right: 1px solid #f4e8dc; border-bottom: 1px solid #f4e8dc; }
.xk-pet-finder__filter-row:nth-child(3n) { border-right: 0; }
.xk-pet-finder__filter-label { gap: 8px; }
.xk-pet-finder__filter-label span.dashicons { display: inline-grid; place-items: center; box-sizing: border-box; width: 28px; height: 28px; border-radius: 9px; background: #edf8f3; color: #1f8174; font-size: 17px; line-height: 28px; }
.xk-pet-finder__options { align-items: center; gap: 6px; }
.xk-pet-finder__options a { min-width: 0; min-height: 30px; padding: 5px 12px; }
.xk-pet-finder__more { grid-column: 1 / -1; justify-content: flex-end; padding: 10px 14px 12px; }

.xk-profile-grid--home .xk-profile-card { position: relative; box-sizing: border-box; border: 1px solid #eadcca; border-radius: 16px; background: #fff; box-shadow: 0 8px 22px rgb(62 43 25 / 8%); overflow: hidden; }
.xk-profile-grid--home .xk-profile-card__media { display: block; height: clamp(190px, 18vw, 250px); border-radius: 0; overflow: hidden; }
.xk-profile-grid--home .xk-profile-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.xk-profile-grid--home .xk-profile-card:hover .xk-profile-card__media img { transform: scale(1.035); }
.xk-profile-grid--home .xk-profile-card__shade { position: absolute; inset: 0 0 auto; z-index: 1; height: clamp(190px, 18vw, 250px); background: linear-gradient(180deg, rgb(17 20 16 / 25%), rgb(17 20 16 / 52%)); pointer-events: none; }
.xk-profile-grid--home .xk-profile-card__favorite { position: absolute; top: 10px; right: 10px; z-index: 4; }
.xk-profile-grid--home .xk-profile-card__favorite .xk-favorite-form { margin: 0; }
.xk-profile-grid--home .xk-profile-card__favorite .xk-favorite-button { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid rgb(255 255 255 / 80%); border-radius: 50%; background: rgb(16 24 18 / 25%); color: #fff; box-shadow: none; backdrop-filter: blur(3px); }
.xk-profile-grid--home .xk-profile-card__favorite .xk-favorite-button:hover,
.xk-profile-grid--home .xk-profile-card__favorite .xk-favorite-button:focus-visible,
.xk-profile-grid--home .xk-profile-card__favorite .xk-favorite-button.is-saved { background: #ff6b27; }
.xk-profile-grid--home .xk-profile-card__quick { position: absolute; top: clamp(64px, 6.8vw, 92px); right: 10px; bottom: auto; left: 10px; z-index: 3; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 0; background: transparent; opacity: 1; transform: none; }
.xk-profile-grid--home .xk-profile-card__quick a { display: flex; align-items: center; justify-content: flex-start; gap: 6px; min-width: 0; min-height: 41px; padding: 6px 10px; border: 1px solid rgb(255 255 255 / 86%); border-radius: 15px; background: rgb(28 32 25 / 18%); color: #fff; font-size: 11px; font-weight: 700; line-height: 1.15; text-shadow: 0 1px 3px rgb(0 0 0 / 50%); backdrop-filter: blur(2px); }
.xk-profile-grid--home .xk-profile-card__quick a:hover,
.xk-profile-grid--home .xk-profile-card__quick a:focus-visible { border-color: #fff; background: rgb(255 108 37 / 88%); }
.xk-profile-grid--home .xk-profile-card__quick b { flex: 0 0 20px; width: 20px; height: 20px; font-size: 18px; line-height: 20px; }
.xk-profile-grid--home .xk-profile-card__caption { display: grid; gap: 4px; min-height: 62px; padding: 10px 12px 12px; text-align: center; }
.xk-profile-grid--home .xk-profile-card h3 { margin: 0; }
.xk-profile-grid--home .xk-profile-card h3 a::before,
.xk-profile-grid--home .xk-profile-card h3 a::after { display: none; }
.xk-profile-grid--home .xk-profile-card__traits { margin: 0; overflow: hidden; color: #716b63; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.xk-profile-grid--home.xk-home-extra__profiles { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.xk-home-extra__profiles .xk-profile-card__media,
.xk-home-extra__profiles .xk-profile-card__shade { height: 142px; }
.xk-home-extra__profiles .xk-profile-card__quick { top: 46px; gap: 5px; }
.xk-home-extra__profiles .xk-profile-card__quick a { min-height: 34px; padding: 4px 6px; font-size: 9px; }
.xk-home-extra__profiles .xk-profile-card__caption { min-height: 53px; padding: 8px; }
.xk-home-extra__profiles .xk-profile-card h3 { font-size: 12px; }

@media (max-width: 1100px) {
	.xk-pet-finder__header { grid-template-columns: minmax(260px, 300px) minmax(0, 1fr); }
	.xk-pet-finder__panel:not([hidden]) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.xk-pet-finder__filter-row:nth-child(3n) { border-right: 1px solid #f4e8dc; }
	.xk-pet-finder__filter-row:nth-child(2n) { border-right: 0; }
	.xk-profile-grid--home.xk-home-extra__profiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.xk-utility-bar .xk-language-dropdown__menu { width: min(176px, calc(100vw - 24px)); min-width: 0; }
	.xk-legacy-selector.xk-pet-finder { padding: 15px 13px; }
	.xk-pet-finder__header { grid-template-columns: 1fr; }
	.xk-pet-finder__filters { margin: 0; }
	.xk-pet-finder__panel:not([hidden]) { grid-template-columns: 1fr; }
	.xk-pet-finder__filter-row,
	.xk-pet-finder__filter-row:nth-child(2n),
	.xk-pet-finder__filter-row:nth-child(3n) { border-right: 0; }
	.xk-profile-grid--home .xk-profile-card__media,
	.xk-profile-grid--home .xk-profile-card__shade { height: 215px; }
	.xk-profile-grid--home .xk-profile-card__quick { top: 72px; display: grid; }
	.xk-profile-grid--home.xk-home-extra__profiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
