/* boxes.css */

/* --- BOX CENTRALE E SCHEDE EVENTI IN STILE STEAMPUNK --- */
main .description-container,
.other-box,
.tab-content,
.tab-header {
    background-color: rgba(0, 0, 0, 0.85) !important; /* forzato e scuro */
    border: 5px solid #7c5a2e; /* bordo marrone */
    box-shadow: 0 0 25px rgba(255, 215, 0, 0.6), inset 0 0 15px #a07e43;
    border-radius: 12px;
    padding: 2rem;
    margin: 2rem auto; /* centrato con distacco */
    max-width: 900px; /* larghezza massima per non occupare tutto lo schermo */
    color: #fff;
    font-family: 'Cinzel Decorative', serif;
    line-height: 1.6;
}

/* Titoli principali */
.description-container h1,
.other-box h1 {
    text-align: center;
    color: #cd7f32;
    margin-bottom: 1rem;
    font-size: 2rem;
}

/* Sottotitoli */
.description-container .subtitle,
.other-box .subtitle {
    display: block;
    font-size: 1rem;
    color: #cd7f32;
    margin-top: 0.3rem;
    font-weight: normal;
}

/* Titoli sezioni */
.description-container .section-title,
.other-box .section-title {
    font-size: 1.5rem;
    margin-top: 2rem;
    margin-bottom: 0.5rem;
    color: #cd7f32;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: transform 0.5s ease;
    cursor: pointer;
}

.description-container .section-title:hover .gear-icon,
.other-box .section-title:hover .gear-icon {
    transform: rotate(20deg);
}

.description-container .gear-icon,
.other-box .gear-icon {
    display: inline-block;
    transition: transform 0.5s ease;
}

/* Evidenziazione testo */
.description-container .highlight,
.other-box .highlight {
    color: #cd7f32;
    font-weight: bold;
}

/* Paragrafi */
.description-container p,
.other-box p {
    margin-bottom: 1rem;
}

/* --- SEPARATORE DECORATIVO STEAMPUNK TRA GLI EVENTI --- */
.event-separator-decor {
    height: 3px;
    background: linear-gradient(90deg, #7c5a2e, #cd7f32, #7c5a2e);
    margin: 0.8rem 0;
    border-radius: 2px;
    box-shadow: 0 0 5px rgba(255, 215, 0, 0.4);
}