/*
 Theme Name:   Astra Child
 Theme URI:    https://tuosito.com/
 Description:  Tema Child di Astra
 Author:       Il tuo nome
 Template:     astra
 Version:      1.0.0
*/

/* ================= PALETTE ================= */
:root {
    --color-primary: #1E3A8A;
    /* blu scuro */
    --color-accent: #3B82F6;
    /* blu acceso */
    --color-light: #E0F2FE;
    /* azzurro chiaro */
    --color-dark: #1F2937;
    /* grigio scurissimo */
    --color-gray: #F3F4F6;
    /* grigio chiaro */
    --color-white: #ffffff;
    /* bianco */
    --color-bone-white : #F9F6EE;
}

/* ================= HEADER ================= */
body .site-header,
body .main-header-bar {
    background-color: var(--color-primary) !important;
}

.site-title a {
    color: #fff !important;
    text-decoration: none;
}

/* body.home { */
body {
    background-color: rgba(30, 58, 138, 0.5) !important;
    /* blu primario con opacità */
} 


/* Desktop menu */
@media (min-width: 922px) {
    body .main-header-menu a {
        color: #fff !important;
    }

    body .main-header-menu a:hover {
        color: var(--color-accent) !important;
    }

    .site-title a:hover {
        color: var(--color-accent) !important;
    }
}

/* ================= MENU MOBILE ================= */
@media (max-width: 921px) {

    /* Sfondo drawer */
    .ast-mobile-popup-drawer,
    .ast-mobile-popup-inner {
        background-color: var(--color-primary) !important;
    }

    /* Voci del menu */
    .ast-mobile-popup-drawer ul#ast-hf-mobile-menu>li>a.menu-link {
        display: block;
        padding: 12px 20px;
        color: var(--color-dark) !important;
        /* blu navy */
        font-weight: bolder !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    /* Hover voci */
    .ast-mobile-popup-drawer ul#ast-hf-mobile-menu>li>a.menu-link:hover {
        background-color: rgba(255, 255, 255, 0.1) !important;
        color: #fff !important;
    }

    /* Icone hamburger e X */
    .menu-toggle,
    .menu-toggle .ast-mobile-svg,
    .ast-mobile-popup-drawer .ast-close-svg {
        color: #fff !important;
        fill: #fff !important;
    }
}

/* ================= FOOTER ================= */
#colophon {
    display: none !important;
}

/* ================= CAROSELLO ================= */

/* Testo caption (generico Bootstrap) */
.carousel-caption h5,
.carousel-caption p {
    color: #1F2937 !important;
    /* color: var(--color-bone-white) !important; */
    /* blu scurissimo */
    text-shadow: 0 1px 3px rgba(255, 255, 255, 0.8);
}

/* --- Versione Desktop: cover (uniforme ed elegante) --- */
#homepageCarousel .carousel-item img {
    height: 500px;
    object-fit: cover;
    width: 100%;
}

/* --- Mobile: contain (mostra tutta l’immagine senza taglio) --- */
@media (max-width: 768px) {
    #homepageCarousel .carousel-item {
        background: #000;
        /* sfondo nero se immagine non riempie */
        text-align: center;
    }

    #homepageCarousel .carousel-item img {
        max-height: 300px;
        width: auto;
        margin: 0 auto;
        object-fit: contain !important;
    }
}

/* Rimuovi bordi blu dalle frecce */
.carousel-control-prev,
.carousel-control-next {
    outline: none !important;
    box-shadow: none !important;
}

.carousel-control-prev:focus,
.carousel-control-next:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* Caption personalizzata (angolo in alto a sinistra) */
.carousel-caption-custom {
    position: absolute;
    top: 20px;
    left: 20px;
    background: rgba(255, 255, 255, 0.7);
    color: #1F2937;
    border-radius: 8px;
    max-width: 300px;
}

/* Titolo custom */
#curosel-title-custom {
    margin: 0;
    font-weight: bold;
    font-size: 1.5rem;
    white-space: nowrap;
    /* non andare a capo */
    overflow: hidden;
    /* nascondi il testo extra */
    text-overflow: ellipsis;
    /* mostra i tre puntini */
    display: block;
}

/* Dettagli custom */
#curosel-details-custom {
    margin: 0;
    font-size: 1rem;
    line-height: 1.3;
}

/* Mobile: titolo e dettagli più piccoli */
@media (max-width: 768px) {
    #curosel-title-custom {
        font-size: 0.7rem;
    }

    #curosel-details-custom {
        font-size: 0.7rem;
    }
}

/* Hover frecce custom */
.btn_curosel_custom:hover {
    background-color: transparent !important;
}

/* Forza immagini dentro il carosello a ridimensionarsi bene */
#homepageCarousel .carousel-item img {
    height: auto !important;
    max-height: 500px !important;
    width: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
    margin: 0 auto;
    display: block;
    background: #000;
    /* sfondo nero se l'immagine non riempie */
}

/* ================= INTRO SECTION ================= */
.homepage-intro {
    margin-top: 80px;
    margin-bottom: 80px;
}
.homepage-intro h1 {
    font-size: 2.2rem;
    color: var(--color-primary);
}
.homepage-intro p {
    font-size: 1.2rem;
    color: var(--color-dark);
}

/* ================= CATEGORY BUTTONS ================= */
.homepage-categories {
    margin-top: 100px;
    margin-bottom: 100px;
}
.btn-custom-category {
    /* background-color: var(--color-accent); */
    color: #fff !important;
    padding: 30px;
    border-radius: 12px;
    font-size: 1.5rem;
    font-weight: bold;
    transition: all 0.3s ease;
    text-transform: uppercase;
    border: 2px solid var(--color-primary);
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    background-color: rgba(30, 58, 138, 0.9) !important; /* sfondo più scuro */
}
.btn-custom-category:hover {
    background-color: var(--color-primary);
    color: #fff !important;
    box-shadow: 0 6px 15px rgba(0,0,0,0.3);
}

.psg-description,
.psg-content {
    text-align: left;
    max-width: 800px;
    width: 100%;                /* forza adattamento al contenitore */
    margin: 20px auto;
    line-height: 1.6;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    box-sizing: border-box;     /* padding incluso nella larghezza */
}
@media (max-width: 768px) {
    .psg-description,
    .psg-content {
        padding: 0 15px;        /* respiro laterale */
        font-size: 1rem;        /* testo leggibile e non enorme */
    }
}


.title_component_view {
    color: var(--color-bone-white) !important;
}