:root {
    --txtcolor: #23201F;
    --bgcolor: #FFFFFF;
    --txtimportant: #445D17;
    --borderbtn: #445D17;
    --txtdecoration: #70402B;
    --strongdecoration: #70402B;
    --txtwarning: #963428;
    --linkcolor: #2B7292;
}

@page {
    margin: 1.5cm;
    size: A4;
}

body {
    font-family: "Times New Roman", Times, serif;       /* Più leggibile su carta */
    font-size: 12pt;
    line-height: 1.5;
    width: 100%;
    min-height: 0;
    display: block;
}

#list-topbar {
    display: none;
}

#side-panel {
    display: none;
}

dialog {
    display: none;
}

body,
main,
section {
    width: 100%;
    max-width: 100%;
}

* {
    box-shadow: none;
    text-shadow: none;
}

#contenitore-header {
    display: block;
    text-align: center;
    width: 100%;
}

#link-logo {
    display: block;
    margin: 0 auto;
    width: fit-content;
    box-shadow: none;
}

header {
    margin: 0 auto;
    padding: 0;
}

header.scrolled {
    box-shadow: none;
}

header h1 {
    content: url("../Resources/Vectors/Logo-Dark.svg");
    margin: 0 auto;
    font-size: 50pt;
    justify-self: center;
}

#breadcrumb {
    margin: 0 auto;
}

#toast-not,
#btn-back-to-top,
#hamburger,
.header-btns,
#navbar {
    display: none;
}

.btn-link,
a[class*="btn-"],
button {
    display: none;
}

#google-maps,
.exp-freccia, /* Frecce delle FAQ */
.new-window { /* Icona nuova finestra */
    display: none;
}

footer nav,
#tit-link-utili,
#link-utili {
    display: none;
}

main, section, footer {
    width: 100%;
    margin: 0;
    padding: 0;
    display: block;
}

h1, h2, h3 {
    break-after: avoid;
}

img {
    break-inside: avoid;        /* Non tagliare le immagini a metà pagina */
}

section li {
    break-inside: avoid;
}

.dtl-animale {
    box-shadow: none;
    break-inside: avoid;
    display: block;
}

.dtl-animale > div {
    display: block;
    grid-template-rows: none;
    visibility: visible;
    opacity: 1;
    height: auto;
    overflow: visible;
}

details {
    box-shadow: none;
}

.faq-answer {
    break-inside: avoid;
    display: block;
}

.faq-answer > div {
    display: block;
    grid-template-rows: none;
    visibility: visible;
    opacity: 1;
    height: auto;
    overflow: visible;
}

summary {
    font-weight: bold;
    font-size: 14pt;
    list-style: none;       /* Nasconde il triangolino di default */
    border-bottom: 1pt solid var(--borderbtn);
}

blockquote {
    font-style: italic;
}

#slogan {
    font-size: 22pt;
    margin-top: 10pt;
}

#section-esperti ul {
    gap: 15pt;
}

#section-esperti ul li figure img {
    border-radius: 0.5rem;
    box-shadow: none;
    border: none;
}

#section-title,
#section-chi-siamo {
    margin-top: 1pt;
    margin-bottom: 1pt;
}

#section-chi-siamo {
    box-shadow: none;
    border: none;
    border-radius: 0pt;
    padding: 5pt 0;
}

#img-volontari {
    display: none;
}

#down-quote,
#up-quote {
    fill: var(--txtcolor);
}

#section-esperti,
#section-dati,
#section-faqs,
#section-contatti {
    margin: 0 auto;
}

#section-dati ul li {
    box-shadow: none;
}

#section-contatti div {
    text-align: center;
}

footer {
    margin-top: 10pt;
    padding-top: 10pt;
    border-top: 1pt solid var(--txtcolor);
    break-inside: avoid;
    box-shadow: none;
}

footer #dati-footer {
    display: block;
}

#contenitore-footer {
    padding: 0;
}

#dati-rifugio {
    margin: 0;
    margin-bottom: 20pt;
}

.titolo-footer {
    text-align: left;
}

#tbl-orari dd {
    margin-left: 0;
}

a[href^="http"]::after {
    content: " [" attr(href) "]";
    font-size: 10pt;
    font-style: italic;
    word-wrap: break-word;
}

#socials li a {
    display: inline-flex;
    width: auto;
    color: var(--linkcolor);
    text-decoration: underline;
}

#socials li a:visited {
    color: var(--txtcolor);
}

#socials a svg {
    fill: var(--txtcolor);
    width: 20pt;
    height: 20pt;
}

#benvenuto {
    display: block;
    text-align: center;
    margin: 50pt auto;
}

#dog-house {
    display: none;
}

#section-links {
    display: none;
}

#lst-vertical-panel {
    margin: 0;
}

#lst-animali {
    width: 100%;
    margin: 0;
}

.status-richieste {
    margin: 0;
}

.status-richieste::before {
    display: none;
}

.titolo-richieste::before {
    display: none;
}

.titolo {
    margin: 10pt auto;
}

#btns-flottanti {
    border: none;
    padding: 0;
    position: static;
}

#lbl-mese-corr {
    font-size: 18pt;
}

.linea {
    display: none;
}

.note-hidden.hidden {
    display: block;
}

.info {
    box-shadow: none;
}

.lista-settimana > li {
    break-inside: avoid;
}

.cnt-adozione,
.cnt-presa-adozione {
    break-inside: avoid;
}

.lista-settimana.hidden {
    display: block;
}

#section-step-porta-adozione ul li figure img {
    border-radius: 0.5rem;
    box-shadow: none;
    height: 11.5rem;
}

#section-step-porta-adozione ul li {
    max-width: 11.5rem;
    min-width: 11.5rem;
}

#section-form-porta-adozione {
    width:90%;
    justify-content: center;
    align-items: center;
    border: 2px;
}

#section-form-porta-adozione .field-error {
    display: none;
}

#razza-select-field {
    display: none;
}

#razza-input-field {
    display: flex;
}

input::placeholder,
textarea::placeholder {
    visibility: hidden;
}

.features ul li {
    color: var(--txtcolor);
}

#chiedi-visita{
    width:90%;
    justify-content: center;
    align-items: center;
}

#scheda-con-visita {
    padding: 0.5em;
    display: block; 
    box-sizing: border-box;  
    margin-top:0.5em;
    background: transparent;        
    box-shadow: none;               
    border-radius: 0;  
     
}

.animal-info{
    margin-bottom: 1em;
}

.animal-image {
    width: 100%;
    max-height: 18em;        
    min-height: 18em;        
    object-fit: cover;
    margin-bottom: 1em;
    display: block;  

}

.descriptions, .features{
    margin-bottom: 1em;
}

.visita-header {
    flex-direction: column;
    text-align: center;
    padding: 3em;
    gap: 1em;
}


.visita-header h3 {
    font-size: 1.3em;
    margin: 0;
    line-height: 1.4;
    word-wrap: break-word;
}

#appointment-form.active {
    opacity: 1;
    visibility: visible;
    padding: 1.5em;
}

.form-row {
    display: flex;  
    flex-direction: column;
    gap: 1em;
}

#appointment-form {
    max-height: none;
    opacity: 1 ;
    visibility: visible ;
}

.single-form-group textarea {
    width: 100%;
    min-height: 5em;
    padding: 0.5em;
}

.cfr-button {
    display: none;
}

.submite-bt {
    display: none; 
}

.form-intro {
    display: none; 
}