*
{
box-sizing: border-box;
}
html
{
min-height: 100%;
background: linear-gradient(135deg, #c9e8c5 0%, #d9f2d6 45%, #c3e3be 100%);
background-attachment: fixed;
}
body
{
min-height: 100vh;
margin: 0;
padding-top: 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
line-height: 1.5;
color: #172018;
background: linear-gradient(135deg, #c9e8c5 0%, #d9f2d6 45%, #c3e3be 100%);
background-attachment: fixed;
}
a
{
color: #176b2a;
}
a:hover
{
color: #25963a;
}
.base-shell
{
width: min(1480px, calc(100% - 40px));
margin: 0 auto 28px;
}
.base-header
{
margin-bottom: 24px;
}
.base-banner
{
display: block;
width: fit-content;
max-width: 100%;
margin: 0 auto 14px;
}
.base-banner img
{
display: block;
max-width: 100%;
height: auto;
border: 1px solid #a6cda0;
box-shadow: 0 2px 7px rgba(0, 0, 0, 0.10);
}
.base-nav
{
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 0;
border-top: 1px solid #b9d8b4;
border-bottom: 1px solid #9fc99a;
background: rgba(255, 255, 255, 0.55);
}
.base-nav a
{
padding: 8px 20px;
text-decoration: none;
font-weight: 600;
}
.base-nav a + a
{
border-left: 1px solid #d7e7d4;
}
.base-nav a:hover
{
background: #edf7eb;
text-decoration: none;
}
.base-main
{
min-width: 0;
}
.search-result-summary
{
margin: 6px 0 20px;
padding: 0;
text-align: left;
}
.search-result-summary h1
{
margin: 0;
font-size: 1.28rem;
font-weight: 600;
color: #162116;
}
.search-result-count,
.dog-title
{
color: #08752a;
}
.search-result-query
{
color: #00188F;
font-style: italic;
font-weight: 600;
}
.result-legend
{
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 14px 42px;
margin: 0 0 18px;
padding: 0 4px;
color: #4d5b4d;
font-size: 0.9rem;
}
.result-legend span
{
display: inline-flex;
align-items: center;
gap: 7px;
}
.result-legend img
{
display: block;
max-height: 23px;
width: auto;
}
.photo-legend-icons
{
gap: 4px !important;
}
.photo-legend-icons img + img
{
margin-right: 4px;
}
.results-table-wrap
{
overflow-x: auto;
}
.results-table
{
width: 100%;
min-width: 930px;
border-collapse: separate;
border-spacing: 0 7px;
}
.results-table th
{
padding: 5px 10px 7px;
color: #176b2a;
font-size: 0.88rem;
font-weight: 600;
text-align: left;
border-bottom: 1px solid #b9d8b4;
}
.results-table td
{
padding: 11px 10px;
vertical-align: middle;
background: rgba(255, 255, 255, 0.84);
border-top: 1px solid #c5ddc1;
border-bottom: 1px solid #c5ddc1;
}
.results-table td:nth-child(2),
.results-table td:nth-child(8)
{
border-left: 5px solid transparent;
background-clip: padding-box;
}
.results-table td:nth-child(3),
.results-table td:nth-child(4),
.results-table td:nth-child(5),
.results-table td:nth-child(6),
.results-table td:nth-child(7)
{
border-left: 1px solid #d3e4d0;
}
.results-table tbody tr:hover td
{
background: #e2f1df;
}
.results-table td:first-child
{
border-radius: 7px 0 0 7px;
}
.results-table td:last-child
{
border-radius: 0 7px 7px 0;
}
.result-dog
{
min-width: 270px;
}
.result-dog strong
{
font-size: 1rem;
color: #00188F;
}
.results-table td:nth-child(2),
.results-table td:nth-child(3),
.results-table td:nth-child(4),
.results-table td:nth-child(6)
{
color: #003399;
}
.result-death
{
color: #172018 !important;
}
.result-actions
{
white-space: nowrap;
min-width: 270px;
}
.result-icons
{
min-width: 72px;
}
.result-button
{
display: inline-block;
margin: 2px 5px 2px 0;
padding: 5px 9px;
border: 1px solid transparent;
border-radius: 3px;
color: #ffffff;
font-size: 0.82rem;
font-weight: 600;
line-height: 1.2;
text-decoration: none;
vertical-align: middle;
}
.result-button:hover
{
color: #ffffff;
text-decoration: none;
filter: brightness(0.88);
}
.result-button-pedigree
{
background: #1FA13A;
border-color: #178530;
}
.result-button-infos
{
background: #0F8F2F;
border-color: #0B7627;
}
.result-button-elevage
{
background: #4f8b33;
border-color: #42772a;
}
.result-icons
{
white-space: nowrap;
text-align: center;
min-width: 72px;
}
.result-icons img
{
vertical-align: middle;
margin: 0 3px;
max-height: 26px;
width: auto;
}
.result-empty
{
margin: 8px 0 24px;
padding: 18px 0;
border-top: 1px solid #b9d8b4;
border-bottom: 1px solid #b9d8b4;
text-align: center;
}
.result-empty h2
{
margin: 0 0 8px;
font-size: 1.2rem;
color: #176b2a;
}
.base-bottom-actions
{
margin: 22px 0 0;
text-align: left;
}
.base-button
{
display: inline-block;
padding: 8px 14px;
border: 1px solid #00188F;
border-radius: 4px;
background: #123FD0;
color: #ffffff;
font-weight: 700;
text-decoration: none;
}
.base-button:hover
{
background: #00188F;
color: #ffffff;
text-decoration: none;
}
.base-footer
{
margin-top: 30px;
padding-top: 12px;
border-top: 1px solid #b9d8b4;
color: #667066;
font-size: 0.82rem;
text-align: center;
}
.base-footer-nav
{
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 6px 18px;
margin-bottom: 9px;
}
.base-footer-nav a
{
font-weight: 600;
text-decoration: none;
}
.base-footer-meta div
{
margin: 2px 0;
}
@media (max-width: 700px)
{
.base-shell
{
width: calc(100% - 18px);
margin: 10px auto 18px;
}
.base-header
{
margin-bottom: 18px;
}
.base-nav
{
display: grid;
grid-template-columns: 1fr 1fr;
}
.base-nav a
{
padding: 8px 6px;
text-align: center;
border-left: 0 !important;
}
.base-nav a:nth-child(odd)
{
border-right: 1px solid #d7e7d4;
}
.base-nav a:nth-child(-n+2)
{
border-bottom: 1px solid #d7e7d4;
}
.search-result-summary
{
margin-bottom: 14px;
}
.search-result-summary h1
{
font-size: 1.1rem;
}
.result-legend
{
gap: 8px 18px;
margin-bottom: 14px;
}
.results-table-wrap
{
overflow: visible;
}
.results-table
{
display: block;
min-width: 0;
border-spacing: 0;
}
.results-table thead
{
display: none;
}
.results-table tbody,
.results-table tr,
.results-table td
{
display: block;
width: 100%;
}
.results-table td:nth-child(2),
.results-table td:nth-child(3),
.results-table td:nth-child(4),
.results-table td:nth-child(5),
.results-table td:nth-child(6),
.results-table td:nth-child(7),
.results-table td:nth-child(8)
{
border-left: 0;
}
.results-table tr
{
margin-bottom: 12px;
padding: 11px 12px;
border: 1px solid #b8d6b3;
border-radius: 6px;
background: rgba(255, 255, 255, 0.88);
}
.results-table td
{
padding: 3px 0;
border: 0;
background: transparent;
}
.results-table td + td
{
border-left: 0;
}
.results-table td:first-child,
.results-table td:last-child
{
border: 0;
border-radius: 0;
}
.results-table td[data-label]::before
{
content: attr(data-label) " : ";
font-weight: 600;
color: #536253;
}
.results-table .result-dog
{
min-width: 0;
padding-bottom: 7px;
margin-bottom: 4px;
border-bottom: 1px solid #e1ede0;
}
.results-table .result-dog::before,
.results-table .result-actions::before,
.results-table .result-icons::before
{
content: none;
}
.result-actions
{
min-width: 0;
padding-top: 7px !important;
white-space: normal;
}
.result-icons
{
min-width: 0;
text-align: left;
padding-top: 5px !important;
}
.base-bottom-actions
{
text-align: center;
}
}

.sr-only
{
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.breeder-sheet
{
max-width: 1180px;
margin: 0 auto;
}
.breeder-sheet-title
{
margin: 4px 0 18px;
font-size: 1.55rem;
}
.breeder-sheet-block
{
margin-bottom: 18px;
padding: 18px 20px;
border: 1px solid #b7d3b2;
border-radius: 7px;
background: rgba(255, 255, 255, 0.88);
}
.breeder-contact-block h2
{
margin: 0 0 10px;
color: #00188F;
font-size: 1.2rem;
}
.breeder-address
{
color: #003399;
}
.breeder-contact-buttons
{
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
margin-top: 14px;
}
.contact-image-button
{
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
height: 42px;
}
.contact-image-button img
{
display: block;
width: auto;
max-height: 39px;
}
.contact-tooltip
{
display: none;
position: absolute;
left: 100%;
top: 50%;
z-index: 20;
min-width: max-content;
margin-left: 8px;
padding: 7px 9px;
border: 1px solid #9fc99a;
border-radius: 4px;
background: #ffffff;
color: #172018;
font-size: 0.9rem;
line-height: 1.3;
box-shadow: 0 2px 7px rgba(0, 0, 0, 0.12);
transform: translateY(-50%);
}
.info:hover .contact-tooltip,
.info:focus .contact-tooltip
{
display: block;
}
.breeder-status-separator
{
margin: 18px 0 14px;
border-top: 1px solid #c7d9c4;
}
.breeder-status-info
{
max-width: 430px;
padding: 11px 16px;
border: 1px solid #4242a5;
border-radius: 5px;
background: linear-gradient(180deg, #4242f7 0%, #4242a5 100%);
color: #ffffff;
line-height: 1.45;
}
.breeder-status-info strong
{
display: block;
font-size: 1rem;
}
.breeder-varieties
{
margin-top: 7px;
color: #ffffff;
line-height: 1.5;
}
.breeder-history
{
color: #003399;
}
.breeder-dogs-summary h3
{
margin: 0;
font-size: 1.05rem;
}
.breeder-result-legend
{
margin-top: -4px;
}
.litter-block
{
margin: 0 0 18px;
}
.litter-header
{
padding: 10px 14px 7px;
border-radius: 7px 7px 0 0;
background: #b266ff;
color: #111111;
}
.litter-header .dog-title
{
color: #08752a;
}
.litter-meta
{
padding: 7px 14px 9px;
background: #ead8ff;
color: #1d1d1d;
font-size: 0.92rem;
}
.litter-table
{
width: 100%;
table-layout: fixed;
border-collapse: separate;
border-spacing: 0 1px;
}
.litter-table td
{
padding: 10px 11px;
vertical-align: middle;
color: #003399;
background: rgba(255, 255, 255, 0.88);
border-top: 1px solid #b7d3b2;
border-bottom: 1px solid #b7d3b2;
}
.litter-table td:first-child
{
border-radius: 7px 0 0 7px;
}
.litter-dog
{
width: 370px;
}
.litter-sex
{
width: 75px;
}
.litter-variety
{
width: 150px;
}
.litter-photo
{
width: 40px;
padding-left: 3px !important;
padding-right: 3px !important;
}
.litter-descendance
{
width: 40px;
padding-left: 3px !important;
padding-right: 3px !important;
}
.litter-book
{
width: auto;
}
.litter-table .result-death
{
width: 90px;
color: #172018 !important;
}
.litter-table td:last-child
{
border-radius: 0 7px 7px 0;
}
.litter-table td + td
{
border-left: 1px solid #d3e4d0;
}
.litter-table .result-dog a,
.litter-table .result-dog a strong
{
color: #172018 !important;
text-decoration: none;
}
.litter-table .result-dog a:hover
{
text-decoration: underline;
}
.litter-photo,
.litter-descendance
{
text-align: center;
white-space: nowrap;
}
.litter-photo img,
.litter-descendance img
{
vertical-align: middle;
max-height: 26px;
width: auto;
}
@media (max-width: 700px)
{
.litter-table,
.litter-table tbody,
.litter-table tr,
.litter-table td
{
display: block;
width: 100%;
}
.litter-table tr
{
margin-bottom: 10px;
padding: 10px 12px;
border: 1px solid #b8d6b3;
border-radius: 7px;
background: rgba(255, 255, 255, 0.88);
}
.litter-table td,
.litter-table td:first-child,
.litter-table td:last-child,
.litter-table td + td
{
width: 100%;
padding: 3px 0;
border: 0;
border-radius: 0;
background: transparent;
}
.litter-dog,
.litter-sex,
.litter-variety,
.litter-photo,
.litter-book,
.litter-descendance,
.litter-table .result-death
{
width: 100%;
}
}

.breeder-results-wrap
{
width: 100%;
max-width: 980px;
margin: 0 auto;
overflow-x: auto;
}
.breeder-results-table
{
width: 100%;
border-collapse: separate;
border-spacing: 0 7px;
}
.breeder-results-table td
{
padding: 12px 14px;
vertical-align: middle;
background: rgba(255, 255, 255, 0.84);
border-top: 1px solid #b7d3b2;
border-bottom: 1px solid #b7d3b2;
}
.breeder-results-table td:first-child
{
width: 50%;
border-radius: 7px 0 0 7px;
}
.breeder-results-table td:last-child
{
width: 50%;
border-left: 1px solid #d3e4d0;
border-radius: 0 7px 7px 0;
}
.breeder-results-table tbody tr:hover td
{
background: #e2f1df;
}
.breeder-name a
{
color: #00188F;
text-decoration: none;
}
.breeder-name a:hover
{
text-decoration: underline;
}
.breeder-holder
{
color: #003399;
}
@media (max-width: 700px)
{
.breeder-results-wrap
{
overflow: visible;
}
.breeder-results-table,
.breeder-results-table tbody,
.breeder-results-table tr,
.breeder-results-table td
{
display: block;
width: 100%;
}
.breeder-results-table tr
{
margin-bottom: 12px;
border: 1px solid #b8d6b3;
border-radius: 7px;
background: rgba(255, 255, 255, 0.88);
}
.breeder-results-table td
{
padding: 7px 12px;
border: 0;
background: transparent;
}
.breeder-results-table td:first-child,
.breeder-results-table td:last-child
{
width: 100%;
border: 0;
border-radius: 0;
}
.breeder-results-table td:first-child
{
padding-top: 11px;
}
.breeder-results-table td:last-child
{
padding-bottom: 11px;
}
}


/************************************************************
*   Fiche informations chien                               *
************************************************************/
.fiche-chien
{
max-width: 1360px;
margin: 0 auto;
}
.titre-fiche-chien
{
margin: 4px 0 18px;
font-size: 1.55rem;
}
.bloc-fiche-chien,
.bloc-genealogie
{
margin-bottom: 18px;
padding: 18px 20px;
border: 1px solid #b7d3b2;
border-radius: 7px;
background: rgba(255, 255, 255, 0.88);
}
.bloc-identite-chien
{
display: flex;
gap: 20px;
align-items: flex-start;
}
.photo-principale
{
flex: 0 0 auto;
}
.photo-principale img
{
display: block;
max-width: 260px;
max-height: 330px;
width: auto;
height: auto;
border-radius: 5px;
}
.infos-principales-chien
{
min-width: 0;
flex: 1;
}
.infos-principales-chien h2
{
margin: 0 0 12px;
font-size: 1.35rem;
color: #172018;
}
.titres-chien
{
color: #08752a;
}
.donnees-chien,
.donnees-parent,
.donnees-conjoint
{
color: #003399;
}
.date-deces
{
color: #172018;
}
.niveau
{
color: #00188F;
font-weight: 600;
}
.adn
{
color: #6b5f00;
}
.actions-fiche-chien
{
display: flex;
flex-wrap: wrap;
gap: 7px;
margin-top: 16px;
}
.fiche-perso-chien
{
color: #003399;
}
.bloc-galerie-photos
{
margin: 2px 0 20px;
}
.galerie-photos
{
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: center;
}
.miniature-photo
{
padding: 0;
border: 1px solid #b7d3b2;
border-radius: 5px;
background: #ffffff;
cursor: pointer;
overflow: hidden;
}
.miniature-photo img
{
display: block;
width: auto;
height: 120px;
max-width: 160px;
object-fit: cover;
}
.compteur-photos
{
margin-top: 9px;
color: #003399;
font-size: 0.9rem;
}
.visionneuse-photo[hidden]
{
display: none;
}
.visionneuse-photo
{
position: fixed;
inset: 0;
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
padding: 40px;
background: rgba(0, 0, 0, 0.84);
}
.visionneuse-photo img
{
display: block;
max-width: 92vw;
max-height: 90vh;
width: auto;
height: auto;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
}
.fermer-photo
{
position: fixed;
top: 14px;
right: 20px;
z-index: 1001;
padding: 2px 11px 5px;
border: 1px solid rgba(255, 255, 255, 0.65);
border-radius: 5px;
background: rgba(0, 0, 0, 0.45);
color: #ffffff;
font-size: 2rem;
line-height: 1;
cursor: pointer;
}
.photo-ouverte
{
overflow: hidden;
}
.titre-section-chien
{
margin: 0 0 14px;
color: #00188F;
font-size: 1.2rem;
}
.parents-chien
{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 14px;
}
.fiche-parent
{
padding: 14px;
border: 1px solid #b7d3b2;
border-radius: 7px;
text-align: center;
}
.nom-parent,
.nom-conjoint
{
font-size: 1rem;
font-weight: 600;
}
.nom-parent a,
.nom-conjoint a
{
color: #172018;
text-decoration: none;
}
.nom-parent a:hover,
.nom-conjoint a:hover
{
text-decoration: underline;
}
.grands-parents
{
margin-top: 4px;
color: #003399;
font-size: 0.9rem;
}
.photo-parent,
.photo-conjoint
{
margin: 12px auto 8px;
}
.photo-parent img
{
display: block;
max-width: 220px;
max-height: 280px;
width: auto;
height: auto;
margin: 0 auto;
border-radius: 5px;
}
.photo-conjoint img
{
display: block;
max-width: 180px;
max-height: 230px;
width: auto;
height: auto;
margin: 0 auto;
border-radius: 5px;
}
.parent-inconnu
{
padding: 30px 10px;
color: #003399;
font-weight: 600;
}
.bandeau-portee
{
margin-top: 9px;
padding: 7px 12px;
background: #ead8ff;
color: #172018;
font-weight: 600;
}
.tableau-chiens
{
width: 100%;
table-layout: fixed;
border-collapse: separate;
border-spacing: 0 1px;
}
.tableau-chiens td
{
padding: 7px 8px;
vertical-align: middle;
color: #003399;
background: rgba(255, 255, 255, 0.84);
border-top: 1px solid #b7d3b2;
border-bottom: 1px solid #b7d3b2;
}
.tableau-chiens td:first-child
{
border-radius: 6px 0 0 6px;
}
.tableau-chiens td:last-child
{
border-radius: 0 6px 6px 0;
}
.tableau-chiens td + td
{
border-left: 1px solid #d3e4d0;
}
.tableau-chiens .col-nom
{
width: 330px;
color: #172018;
}
.tableau-chiens .col-nom a,
.tableau-chiens .col-nom a strong
{
color: #172018;
text-decoration: none;
}
.tableau-chiens .col-nom a:hover
{
text-decoration: underline;
}
.tableau-chiens .col-sante
{
width: 34px;
padding-left: 3px;
padding-right: 3px;
text-align: center;
}
.tableau-chiens .col-sexe
{
width: 75px;
}
.tableau-chiens .col-variete
{
width: 150px;
}
.tableau-chiens .col-photo
{
width: 40px;
padding-left: 3px;
padding-right: 3px;
text-align: center;
}
.tableau-chiens .col-deces
{
width: 90px;
color: #172018;
}
.tableau-chiens .col-livre
{
width: auto;
}
.tableau-chiens .col-adn
{
width: 105px;
}
.tableau-chiens .col-descendance
{
width: 40px;
padding-left: 3px;
padding-right: 3px;
text-align: center;
}
.tableau-chiens .col-photo img,
.tableau-chiens .col-descendance img,
.tableau-chiens .col-sante img
{
max-height: 26px;
width: auto;
vertical-align: middle;
}
.entete-section-repliable
{
display: flex;
align-items: center;
justify-content: space-between;
gap: 15px;
}
.entete-section-repliable .titre-section-chien
{
margin-bottom: 0;
}
.bouton-repliable
{
padding: 6px 10px;
border: 1px solid #8ab884;
border-radius: 4px;
background: #eff8ed;
color: #176b2a;
font-weight: 600;
cursor: pointer;
}
.bouton-repliable:hover
{
background: #dcefd8;
}
.contenu-repliable
{
margin-top: 12px;
}
.resume-descendance
{
display: flex;
gap: 30px;
margin-bottom: 14px;
padding: 10px 12px;
border: 1px solid #b7d3b2;
border-radius: 6px;
background: rgba(255, 255, 255, 0.7);
color: #00188F;
}
.groupe-descendance
{
display: grid;
grid-template-columns: 230px minmax(0, 1fr);
gap: 14px;
margin-bottom: 11px;
padding-bottom: 11px;
border-bottom: 1px solid #9fc99a;
}
.groupe-descendance:last-child
{
margin-bottom: 0;
padding-bottom: 0;
border-bottom: 0;
}
.fiche-conjoint
{
padding: 12px;
border: 1px solid #b7d3b2;
border-radius: 7px;
background: rgba(255, 255, 255, 0.66);
}
.portees-descendance
{
min-width: 0;
}
.message-descendance
{
padding: 10px 0;
color: #003399;
}
@media (max-width: 900px)
{
.tableau-chiens .col-nom
{
width: 260px;
}
.groupe-descendance
{
grid-template-columns: 190px minmax(0, 1fr);
}
}
@media (max-width: 700px)
{
.bloc-identite-chien
{
display: block;
}
.photo-principale
{
margin-bottom: 14px;
}
.photo-principale img
{
max-width: 100%;
max-height: 360px;
}
.parents-chien
{
grid-template-columns: 1fr;
}
.galerie-photos
{
gap: 8px;
}
.miniature-photo img
{
height: 100px;
max-width: 130px;
}
.visionneuse-photo
{
padding: 20px;
}
.entete-section-repliable
{
align-items: flex-start;
flex-direction: column;
}
.groupe-descendance
{
grid-template-columns: 1fr;
}
.tableau-chiens,
.tableau-chiens tbody,
.tableau-chiens tr,
.tableau-chiens td
{
display: block;
width: 100%;
}
.tableau-chiens tr
{
margin-bottom: 8px;
padding: 9px 10px;
border: 1px solid #b8d6b3;
border-radius: 7px;
background: rgba(255, 255, 255, 0.88);
}
.tableau-chiens td,
.tableau-chiens td:first-child,
.tableau-chiens td:last-child,
.tableau-chiens td + td,
.tableau-chiens .col-nom,
.tableau-chiens .col-sante,
.tableau-chiens .col-sexe,
.tableau-chiens .col-variete,
.tableau-chiens .col-photo,
.tableau-chiens .col-deces,
.tableau-chiens .col-livre,
.tableau-chiens .col-adn,
.tableau-chiens .col-descendance
{
width: 100%;
padding: 3px 0;
border: 0;
border-radius: 0;
background: transparent;
text-align: left;
}
.tableau-chiens .col-sante,
.tableau-chiens .col-photo,
.tableau-chiens .col-descendance
{
display: inline-block;
width: auto;
margin-right: 8px;
}
.resume-descendance
{
flex-direction: column;
gap: 3px;
}
}


/************************************************************
*   Ajustements fiche chien V2                             *
************************************************************/
.tableau-chiens .col-nom,
.tableau-chiens .col-livre
{
white-space: normal;
overflow-wrap: anywhere;
word-break: normal;
}
.tableau-chiens .col-variete
{
white-space: normal;
}

/* Bloc parents : le titre reste sur fond blanc, les deux parents reposent directement sur le fond vert */
.bloc-parents-chien
{
padding: 0;
border: 0;
background: transparent;
}
.bloc-parents-chien > .titre-section-chien
{
margin: 0 0 12px;
padding: 14px 16px;
border: 1px solid #b7d3b2;
border-radius: 7px;
background: rgba(255, 255, 255, 0.88);
}
.bloc-parents-chien .fiche-parent
{
background: transparent;
}

/* Descendance : conserver la carte blanche du conjoint, mais alléger les lignes des chiots */
.bloc-descendance
{
padding: 0;
border: 0;
background: transparent;
}
.bloc-descendance > .titre-section-chien
{
margin: 0 0 12px;
padding: 14px 16px;
border: 1px solid #b7d3b2;
border-radius: 7px;
background: rgba(255, 255, 255, 0.88);
}
.bloc-descendance .resume-descendance
{
background: rgba(255, 255, 255, 0.74);
}
.bloc-descendance .tableau-chiens td
{
background: rgba(255, 255, 255, 0.48);
}
.bloc-descendance .tableau-chiens tr:hover td
{
background: rgba(255, 255, 255, 0.72);
}

/* Navigation dans la visionneuse de galerie */
.navigation-photo
{
position: fixed;
top: 50%;
z-index: 1001;
width: 48px;
height: 64px;
padding: 0;
border: 1px solid rgba(255, 255, 255, 0.55);
border-radius: 6px;
background: rgba(0, 0, 0, 0.38);
color: #ffffff;
font-size: 2.4rem;
line-height: 1;
cursor: pointer;
transform: translateY(-50%);
}
.navigation-photo:hover,
.navigation-photo:focus
{
background: rgba(0, 0, 0, 0.62);
}
.photo-precedente
{
left: 18px;
}
.photo-suivante
{
right: 18px;
}

@media (max-width: 900px)
{
.tableau-chiens .col-nom
{
width: 240px;
}
.tableau-chiens .col-variete
{
width: 135px;
}
.tableau-chiens .col-adn
{
width: 90px;
}
}

@media (max-width: 700px)
{
.navigation-photo
{
width: 40px;
height: 54px;
font-size: 2rem;
}
.photo-precedente
{
left: 6px;
}
.photo-suivante
{
right: 6px;
}
}


/************************************************************
*   Ajustements fiche chien V3                             *
************************************************************/

/* Parents : fond vert léger, titre centré et collé aux deux fiches */
.bloc-parents-chien > .titre-section-chien
{
margin: 0;
text-align: center;
border-radius: 7px 7px 0 0;
}
.bloc-parents-chien .parents-chien
{
gap: 0;
}
.bloc-parents-chien .fiche-parent
{
background: rgba(255, 255, 255, 0.48);
border-top: 0;
border-radius: 0;
}
.bloc-parents-chien .fiche-parent:first-child
{
border-radius: 0 0 0 7px;
}
.bloc-parents-chien .fiche-parent:last-child
{
border-left: 0;
border-radius: 0 0 7px 0;
}

/* Descendance : résumé directement dans la case du titre */
.bloc-descendance > .titre-section-chien
{
display: none;
}
.entete-descendance
{
display: flex;
align-items: baseline;
flex-wrap: wrap;
gap: 7px;
margin: 0 0 12px;
padding: 14px 16px;
border: 1px solid #b7d3b2;
border-radius: 7px;
background: rgba(255, 255, 255, 0.88);
}
.entete-descendance .titre-section-chien
{
margin: 0;
}
.resume-descendance-inline
{
color: #00188F;
}
.bloc-descendance .resume-descendance
{
display: none;
}
.message-descendance
{
display: none;
}

@media (max-width: 700px)
{
.bloc-parents-chien .parents-chien
{
gap: 0;
}
.bloc-parents-chien .fiche-parent
{
border-left: 1px solid #b7d3b2;
border-radius: 0;
}
.bloc-parents-chien .fiche-parent:first-child
{
border-radius: 0;
}
.bloc-parents-chien .fiche-parent:last-child
{
border-top: 0;
border-radius: 0 0 7px 7px;
}
.entete-descendance
{
align-items: flex-start;
flex-direction: column;
gap: 3px;
}
}


/************************************************************
*   Pied de page de la zone généalogie                     *
************************************************************/
.base-footer-recherche
{
margin: 2px 0 12px;
text-align: center;
}


/************************************************************
*   Responsive tableaux fiche chien V6                    *
************************************************************/
.defilement-tableau
{
width: 100%;
min-width: 0;
}

@media (max-width: 1150px)
{
.groupe-descendance
{
grid-template-columns: 1fr;
}
.fiche-conjoint
{
max-width: 360px;
}
.defilement-tableau
{
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.tableau-chiens
{
min-width: 900px;
}
}

@media (max-width: 700px)
{
.defilement-tableau
{
overflow: visible;
}
.tableau-chiens
{
min-width: 0;
}
.fiche-conjoint
{
max-width: none;
}
}


/************************************************************
*   Mise en valeur du chien principal                      *
************************************************************/
.bloc-identite-chien
{
border-color: #00b88a;
box-shadow: 0 0 0 1px rgba(0, 184, 138, 0.18);
}


/************************************************************
*   Ajustements fiche chien V8                             *
************************************************************/
.fiche-perso-chien
{
padding: 14px 16px;
border-left: 4px solid #7daf77;
background: rgba(255, 255, 255, 0.76);
}
.fratrie-vide
{
padding: 12px 16px;
}
.fratrie-vide .titre-section-chien
{
margin: 0;
font-size: 1.05rem;
}


/************************************************************
*   Création du pedigree virtuel                            *
************************************************************/
.page-creer-virtuel
{
max-width: 1180px;
margin: 0 auto;
}
.virtuel-page-title
{
margin: 0 0 18px;
font-size: 1.35rem;
font-weight: 600;
color: #172018;
}
.virtuel-etape
{
margin-bottom: 20px;
}
.virtuel-form-card,
.virtuel-chien-choisi
{
padding: 18px 20px;
border: 1px solid #b9d8b4;
border-radius: 7px;
background: rgba(255, 255, 255, 0.82);
}
.virtuel-form-card h2,
.virtuel-chien-choisi h2
{
margin: 0 0 12px;
font-size: 1.08rem;
}
.virtuel-chien-choisi h2 a
{
color: #00188F;
text-decoration: none;
}
.virtuel-chien-choisi h2 a:hover
{
text-decoration: underline;
}
.virtuel-choix-label
{
margin-bottom: 4px;
color: #176b2a;
font-weight: 600;
}
.virtuel-chien-infos
{
color: #003399;
}
.virtuel-origines
{
margin-top: 12px;
padding-top: 10px;
border-top: 1px solid #d7e7d4;
}
.virtuel-form
{
display: flex;
align-items: stretch;
gap: 10px;
}
.virtuel-form input[type="text"]
{
flex: 1 1 520px;
min-width: 0;
padding: 9px 11px;
border: 1px solid #9fc99a;
border-radius: 4px;
background: #ffffff;
color: #172018;
font: inherit;
}
.virtuel-form input[type="text"]:focus
{
outline: 2px solid #6ead67;
outline-offset: 1px;
}
.virtuel-recap-grid
{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
}
.virtuel-form-final
{
justify-content: center;
margin-top: 18px;
}
.virtuel-results-table
{
min-width: 900px;
}
.virtuel-results-table .result-dog
{
min-width: 260px;
}
.virtuel-results-table .result-dog strong
{
color: #00188F;
}
.virtuel-choisir-cell
{
width: 150px;
text-align: center;
}
.virtuel-button-choose
{
display: inline-block;
padding: 6px 10px;
border: 1px solid #0B7627;
border-radius: 3px;
background: #0F8F2F;
color: #ffffff;
font: inherit;
font-size: 0.82rem;
font-weight: 600;
line-height: 1.2;
cursor: pointer;
white-space: nowrap;
}
.virtuel-button-choose:hover
{
filter: brightness(0.88);
}
.virtuel-note
{
margin: 20px 0 4px;
padding: 12px 14px;
border-left: 4px solid #7daf77;
background: rgba(255, 255, 255, 0.55);
font-style: italic;
color: #4d5b4d;
}
.sr-only
{
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
@media (max-width: 760px)
{
.virtuel-form
{
display: block;
}
.virtuel-form input[type="text"]
{
width: 100%;
margin-bottom: 9px;
}
.virtuel-recap-grid
{
grid-template-columns: 1fr;
}
.virtuel-form-card,
.virtuel-chien-choisi
{
padding: 14px;
}
}


/************************************************************
*   Création pedigree virtuel V2                            *
************************************************************/

/* Couleur propre au processus de création du pedigree virtuel. */
.page-creer-virtuel .base-button,
.page-creer-virtuel .virtuel-button-choose
{
border-color: #7b5d1e;
background: #9a7426;
color: #ffffff;
}
.page-creer-virtuel .base-button:hover,
.page-creer-virtuel .virtuel-button-choose:hover
{
filter: brightness(0.9);
}

/* Libellés du récapitulatif hors des cartes. */
.virtuel-recap-label,
.virtuel-recap-et
{
color: #172018;
font-weight: 600;
}
.virtuel-recap-label
{
margin: 0 0 8px;
}
.virtuel-recap-et
{
margin: 8px 0;
text-align: center;
}

/* Répertoire final vertical. */
.virtuel-recap-stack
{
display: block;
}

/* Carte chien avec photo à droite. */
.virtuel-chien-choisi
{
display: flex;
align-items: stretch;
gap: 18px;
}
.virtuel-chien-contenu
{
flex: 1 1 auto;
min-width: 0;
}
.virtuel-chien-photo
{
flex: 0 0 auto;
order: 2;
display: flex;
align-items: center;
justify-content: center;
}
.virtuel-chien-photo img
{
display: block;
max-width: 170px;
max-height: 220px;
width: auto;
height: auto;
border-radius: 4px;
}
.virtuel-chien-choisi .titreschien
{
color: green;
}

/* Choix en première colonne. */
.virtuel-results-table .virtuel-choisir-cell
{
width: 150px;
}

/* Les boutons de recherche du formulaire utilisent la même couleur spécifique. */
.page-creer-virtuel .virtuel-form .base-button
{
background: #9a7426;
border-color: #7b5d1e;
}

@media (max-width: 760px)
{
.virtuel-chien-choisi
{
display: block;
}
.virtuel-chien-photo
{
margin-top: 14px;
justify-content: flex-start;
}
.virtuel-chien-photo img
{
max-width: 150px;
max-height: 200px;
}
}


/************************************************************
*   Création pedigree virtuel V3                            *
************************************************************/

/* Cartes chien : même accent que les fiches infos. */
.virtuel-chien-choisi
{
border-color: #00b88a;
box-shadow: 0 0 0 1px rgba(0, 184, 138, 0.16);
}
.virtuel-chien-choisi h2 a,
.virtuel-chien-choisi h2 a:hover
{
color: #000000;
}
.virtuel-date-deces
{
color: #000000;
}

/* Libellés du récapitulatif alignés à gauche et un peu plus présents. */
.virtuel-recap-label,
.virtuel-recap-et
{
font-size: 1.02rem;
font-weight: 600;
text-align: left;
}
.virtuel-recap-label
{
margin-bottom: 10px;
}
.virtuel-recap-et
{
margin: 16px 0 12px;
}

/* Boutons propres à ce parcours : beige doux avec texte sombre. */
.page-creer-virtuel .base-button,
.page-creer-virtuel .virtuel-button-choose,
.page-creer-virtuel .virtuel-form .base-button
{
border-color: #ae9665;
background: #d8c7a0;
color: #40351f;
}
.page-creer-virtuel .base-button:hover,
.page-creer-virtuel .virtuel-button-choose:hover,
.page-creer-virtuel .virtuel-form .base-button:hover
{
background: #ccb787;
color: #342b1a;
filter: none;
}


/************************************************************
*   Création pedigree virtuel V4                            *
************************************************************/

/* Espace entre la carte du chien choisi et la recherche suivante. */
.page-creer-virtuel .virtuel-chien-choisi + .virtuel-form-card
{
margin-top: 14px;
}

/* Variante plus beige crème pour les actions propres au pedigree virtuel. */
.page-creer-virtuel .base-button,
.page-creer-virtuel .virtuel-button-choose,
.page-creer-virtuel .virtuel-form .base-button
{
border-color: #c4b184;
background: #eee3c8;
color: #453b27;
}
.page-creer-virtuel .base-button:hover,
.page-creer-virtuel .virtuel-button-choose:hover,
.page-creer-virtuel .virtuel-form .base-button:hover
{
border-color: #b49d69;
background: #e3d4b1;
color: #392f20;
}


/************************************************************
*   Création pedigree virtuel V5                            *
************************************************************/

/* Livre d'origines en bleu, comme les autres données du chien. */
.virtuel-results-table tbody td:nth-child(8)
{
color: #003399;
}

/* Le bouton final suit l'alignement à gauche du récapitulatif. */
.virtuel-form-final
{
justify-content: flex-start;
}

/* Beige crème encore plus clair, bordure conservée. */
.page-creer-virtuel .base-button,
.page-creer-virtuel .virtuel-button-choose,
.page-creer-virtuel .virtuel-form .base-button
{
border-color: #c4b184;
background: #f6eedb;
color: #453b27;
}
.page-creer-virtuel .base-button:hover,
.page-creer-virtuel .virtuel-button-choose:hover,
.page-creer-virtuel .virtuel-form .base-button:hover
{
border-color: #c4b184;
background: #eadcbb;
color: #392f20;
}


/************************************************************
*   Création pedigree virtuel V6                            *
************************************************************/

/* Résultats des deux recherches :
   nom du chien noir, titres conservés en vert. */
.virtuel-results-table .result-dog strong
{
color: #000000;
}
.virtuel-results-table .result-dog .titreschien
{
color: green;
}


/************************************************************
*   Icônes communes                                        *
************************************************************/

/* Une seule image source par fonction ; la taille d'affichage
   est gérée par le CSS selon le contexte. */
.icone-galerie-grande
{
width: 60px;
height: 60px;
}
.icone-galerie-petite
{
width: 33px;
height: 33px;
}
.icone-photo-seule-petite
{
width: 25px;
height: 20px;
}
.icone-descendance
{
width: 28px;
height: 30px;
}
.icone-descendance-petite
{
width: 20px;
height: 21px;
}


/************************************************************
*   Fiche élevage - identité et statut                      *
************************************************************/

.breeder-contact-grid
{
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(280px, 38%);
gap: 28px;
align-items: stretch;
}
.breeder-contact-content
{
min-width: 0;
}
.breeder-status-separator
{
display: none;
}
.breeder-status-column
{
display: flex;
align-items: center;
justify-content: center;
padding-left: 28px;
border-left: 1px solid #c7d9c4;
}
.breeder-status-info
{
width: fit-content;
max-width: 100%;
text-align: left;
}
@media (max-width: 700px)
{
.breeder-contact-grid
{
grid-template-columns: 1fr;
gap: 18px;
}
.breeder-status-column
{
justify-content: flex-start;
padding-left: 0;
padding-top: 16px;
border-left: 0;
border-top: 1px solid #c7d9c4;
}
}


/************************************************************
*   Fiche élevage - boutons de contact                      *
************************************************************/

/* Boutons reconstruits en CSS autour des icônes historiques. */
.contact-button,
.contact-phone
{
display: inline-flex;
align-items: center;
gap: 7px;
min-height: 40px;
padding: 4px 10px 4px 6px;
border: 1px solid #79a879;
border-radius: 5px;
background: linear-gradient(180deg, #dff2d7 0%, #b8dcae 100%);
color: #194b20;
text-decoration: none;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}
.contact-button:hover,
.contact-button:focus
{
background: linear-gradient(180deg, #e8f7e3 0%, #c6e6bd 100%);
color: #0f3e17;
}
.contact-button img,
.contact-phone img
{
display: block;
flex: 0 0 auto;
width: auto;
max-width: 40px;
max-height: 38px;
}
.contact-button-label
{
font-weight: 700;
white-space: nowrap;
}
.contact-phone
{
align-items: center;
}
.contact-button-text
{
display: flex;
flex-direction: column;
gap: 1px;
}
.contact-button-text a
{
color: #194b20;
text-decoration: none;
white-space: nowrap;
}
.contact-button-text a:hover,
.contact-button-text a:focus
{
text-decoration: underline;
}

/* Les anciens textes manuscrits des boutons bleus. */
.breeder-status-info strong
{
font-family: "Freestyle Script", "Segoe Print", "Bradley Hand", cursive;
font-size: 1.45rem;
font-weight: 400;
line-height: 1.05;
}

/* Les anciennes images de boutons ne sont plus utilisées. */
.contact-image-button,
.contact-tooltip
{
display: none;
}


/************************************************************
*   Fiche élevage - ajustements contacts / statut           *
************************************************************/

.breeder-contact-buttons
{
display: flex;
flex-wrap: wrap;
align-items: flex-start;
gap: 8px;
}

.contact-phone
{
order: 3;
flex-basis: 100%;
width: fit-content;
}

.breeder-status-info strong
{
font-size: 1.85rem;
line-height: 1.08;
}





/************************************************************
*   Fiche élevage - ligne téléphone                         *
************************************************************/

.contact-line-break
{
flex: 0 0 100%;
height: 0;
}

.contact-phone
{
width: 230px;
max-width: 230px;
}


/************************************************************
*   Fiche élevage - finitions visuelles                     *
************************************************************/

/* Les boutons E-mail et Site web gardent une hauteur identique,
   même si leurs icônes n'ont pas exactement les mêmes proportions. */
.contact-button
{
min-height: 44px;
}

/* Légère augmentation du texte manuscrit du statut. */
.breeder-status-info strong
{
font-size: 2rem;
}


/************************************************************
*   Fiche élevage - espacement téléphone                    *
************************************************************/

.contact-phone
{
gap: 12px;
}