/* ============================================================
   CLASSIFICA DETTAGLIO — PAGINA BIANCA PREMIUM
============================================================ */

.page-classifica-dettaglio {
    background: #f5f7f9;
}

/* HERO */
.page-hero {
    padding: 35px 0 25px;
    background: #e6eef1;
    text-align: center;
    border-bottom: 3px solid #4d798b20;
    border-top: 2px solid #d3dde2;
}

.page-title {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 12px;
    color: #355866;
}

.page-subtitle {
    font-size: 1rem;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

/* CONTAINER */
.page-container {
    width: 90%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 20px;
}

/* WRAPPER */
.classifica-wrapper {
    padding: 0 0 40px;
}

/* BOX */
.classifica-box {
    background: #ffffff;
    border-radius: 22px;
    padding: 40px;
    box-shadow:
        0 6px 14px rgba(0, 0, 0, 0.10),
        0 18px 38px rgba(0, 0, 0, 0.14),
        0 32px 65px rgba(0, 0, 0, 0.18);
}

/* TITOLO SEZIONE */
.classifica-heading {
    font-size: 1.8rem;
    font-weight: 700;
    color: #355866;
    margin-bottom: 25px;
    text-align: center;
}

/* TABELLA */
.classifica-table-container {
    overflow-x: auto;
    padding-bottom: 10px;
}

/* Stile tabella */
.classifica-table-container table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
    background: #fff;
}

.classifica-table-container th {
    background: #355866;
    color: #fff;
    padding: 10px;
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
}

.classifica-table-container td {
    padding: 8px 10px;
    border-bottom: 1px solid #e0e6ea;
    white-space: nowrap;
}

.classifica-table-container tr:nth-child(even) {
    background: #f3f6f8;
}

.classifica-table-container tr:hover {
    background: #e8eff2;
}

/* IMMAGINE CLASSIFICA */
.classifica-image {
    text-align: center;
    margin-bottom: 30px;
}

.classifica-image img {
    max-width: 100%;
    border-radius: 12px;
    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.12),
        0 12px 28px rgba(0, 0, 0, 0.18);
}

.classifica-image {
    text-align: center;
    margin-bottom: 30px;
}

.classifica-image img {
    max-width: 100%;
    border-radius: 12px;
    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.12),
        0 12px 28px rgba(0, 0, 0, 0.18);
}

.no-table {
    text-align: center;
    padding: 20px;
    font-size: 1rem;
    color: #355866;
    opacity: 0.8;
}

/* MOBILE */
@media (max-width: 768px) {
    .classifica-box {
        padding: 25px;
    }

    .classifica-heading {
        font-size: 1.5rem;
    }

    .classifica-table-container {
        overflow-x: scroll;
    }
}