/*
 * webepc-animals-profile — cucciolata.css v1.0
 * Stessa filosofia di frontend.css: nessun colore hardcoded, eredita
 * tutto dal tema (font, colori) — solo struttura, spaziatura, focus.
 * WCAG AAA: focus-visible, target touch 44px, contrasto ereditato dal tema.
 */

.wap-cucc-scheda {
    max-width: 1100px;
    margin: 0 auto;
    padding: 2rem 1rem;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}
.wap-cucc-scheda *,
.wap-cucc-scheda *::before,
.wap-cucc-scheda *::after {
    box-sizing: border-box;
}

.wap-cucc-titolo {
    text-align: center;
    margin-bottom: 1.5rem;
}

/* Stato / disponibilità */
.wap-cucc-stato-box {
    text-align: center;
    margin-bottom: 2rem;
}
.wap-cucc-stato-badge {
    display: inline-block;
    font-weight: 700;
    font-size: .78em;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: .4em 1em;
    border-radius: 20px;
    border: 2px solid currentColor;
    margin-bottom: .5em;
}
.wap-cucc-stato-testo {
    font-style: italic;
    opacity: .85;
    margin: .5em 0 0;
}

/* Genitori */
.wap-cucc-genitori-grid {
    display: grid;
    grid-template-columns: repeat( auto-fit, minmax(280px, 1fr) );
    gap: 2rem;
    margin-bottom: 2rem;
}
.wap-cucc-genitore-card {
    border: 1px solid currentColor;
    border-color: color-mix( in srgb, currentColor 20%, transparent );
    border-radius: 6px;
    padding: 1.5rem;
    text-align: center;
}
.wap-cucc-genitore-label {
    display: inline-block;
    font-weight: 700;
    font-size: .78em;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: .65;
    margin-bottom: .5em;
}
.wap-cucc-genitore-nome {
    margin: 0 0 1em;
}
.wap-cucc-genitore-nome a {
    text-decoration: none;
}
.wap-cucc-genitore-nome a:hover,
.wap-cucc-genitore-nome a:focus-visible {
    text-decoration: underline;
}
.wap-cucc-genitore-foto {
    width: 100%;
    height: auto;
    border-radius: 4px;
    margin-bottom: 1em;
}
.wap-cucc-risultati-titolo {
    margin-top: 1.1em !important;
    padding-top: .85em !important;
    border-top: 1px solid color-mix( in srgb, currentColor 15%, transparent );
}
.wap-cucc-genitore-sanitari,
.wap-cucc-genitore-risultati {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left;
    font-size: .9em;
}
.wap-cucc-genitore-sanitari {
    padding-top: .75em;
    border-top: 1px solid color-mix( in srgb, currentColor 15%, transparent );
}
.wap-cucc-genitore-sanitari li,
.wap-cucc-genitore-risultati li {
    padding: .2em 0;
    opacity: .9;
}
.wap-cucc-risultato-icona {
    margin-right: .4em;
}
.wap-cucc-genitore-card .wap-pedigree-btn-wrap {
    margin-top: .75em;
}
.wap-cucc-card-link {
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
    font-weight: 700;
    text-decoration: none;
}
.wap-cucc-card-link:hover,
.wap-cucc-card-link:focus-visible {
    text-decoration: underline;
}

/* Variante "solo freccetta" (testo vuoto in Impostazioni): pulsante
   rotondo, sfondo colore configurabile (inline da PHP), freccetta bianca.
   Stessa resa della variante analoga in frontend.css per le schede animale. */
.wap-cucc-card-link--arrow-only {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    min-height: 44px;
    line-height: 1;
    padding: 0;
    border-radius: 50%;
    color: #fff;
}
.wap-cucc-card-link--arrow-only:hover,
.wap-cucc-card-link--arrow-only:focus-visible {
    filter: brightness(1.12);
    text-decoration: none;
}

/* Pedigree cucciolata */
.wap-cucc-pedigree-link {
    text-align: center;
    margin-bottom: 2rem;
}

/* Descrizione narrativa */
.wap-cucc-descrizione {
    line-height: 1.7;
    margin-bottom: 2.5rem;
}
.wap-cucc-descrizione p {
    margin-bottom: 1.2em;
}

/* Galleria */
.wap-cucc-galleria-front {
    margin-bottom: 2.5rem;
}
.wap-cucc-galleria-titolo {
    text-align: center;
    margin-bottom: 1rem;
}
.wap-cucc-galleria-figure {
    margin: 0;
}
.wap-cucc-galleria-figure figcaption {
    font-size: .85em;
    text-align: center;
    opacity: .8;
    margin-top: .4em;
}

/* Lista/preview cards nella pagina Cuccioli */
.wap-cucc-lista-titolo {
    text-align: center;
    margin-bottom: 1.5rem;
}
.wap-cucc-lista {
    display: grid;
    grid-template-columns: repeat( auto-fit, minmax(340px, 1fr) );
    gap: 1.5rem;
    max-width: 1100px;
    margin: 0 auto;
}
.wap-cucc-card {
    border: 1px solid color-mix( in srgb, currentColor 20%, transparent );
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.wap-cucc-card-img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

/* Immagine di anteprima "50/50": metà padre, metà madre, affiancate.
   Nessuna elaborazione server-side — solo due immagini fianco a fianco,
   ognuna al 50% di larghezza con crop centrale. Box più largo e più
   basso per un taglio rettangolare/orizzontale invece che quadrato. */
.wap-cucc-card-img--split {
    display: flex;
    height: 160px;
}
.wap-cucc-card-img--split img {
    width: 50%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Una sola cucciolata in elenco: card più stretta e centrata invece di
   allargarsi a riempire l'intera larghezza della griglia. */
.wap-cucc-lista--single {
    grid-template-columns: minmax( 0, 480px );
    justify-content: center;
}
.wap-cucc-card-body {
    padding: 1rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.wap-cucc-card-body h3 {
    margin: 0 0 .5em;
}
.wap-cucc-card-testo {
    opacity: .85;
    font-size: .9em;
    flex: 1;
}

@media (prefers-reduced-motion: no-preference) {
    .wap-cucc-genitore-card,
    .wap-cucc-card {
        transition: border-color .2s ease;
    }
}
