/* font */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&display=swap');

.lora-400 {
    font-family: "Lora", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

:root {
    --yellow: #FED620;
    --orange: #FED620;
    --black: #000;
    --white: #fff;
}

/* è qui perchè se no style-dd di redigo lo sovrascrive */
.theme-primary .btn-primary {
    color: var(--black) !important;
}

.theme-primary .btn-primary:hover,
.theme-primary .btn-primary:active,
.theme-primary .btn-primary:focus,
.theme-primary .btn-primary.active {
    color: var(--black) !important;
    background-color: var(--white) !important;
    border-color: var(--black) !important;
}

/* bottone mostra filtri */
#mostra_filtri {
    background-color: #fed620;
    display: none;
}

#mostra_filtri.cliccato {
    background-color: #fff;
    border: 1px solid black;
    color: #000;
}

#filtri button:hover,
#mostra_filtri:hover {
    opacity: 0.8 !important;
}

/* bottoni filtri */
#bottone_cerca {
    background-color: #fed620;
}

/* immagini */
#tg img {
    width: 70px;
    border: 2px #fed620 solid;
    border-radius: 100%;
}

/* testi grigi */
#tg span {
    color: #8d8d8dff;
    font-size: 14px;
}

/* font tabella */
#tg thead th.text-center {
    text-align: center !important;
    vertical-align: middle !important;
}

#tg td {
    font-size: 16px;
    height: 100px;
}

.dt-column-title {
    color: white !important;
    font-size: 17px !important;
}

/* arrotondamento tabella */
#tg thead tr th:first-child {
    border-top-left-radius: 8px;
}

#tg thead tr th:last-child {
    border-top-right-radius: 8px;
}

#tg tbody>tr:last-child>td:first-child {
    border-bottom-left-radius: 8px;
}

#tg tbody>tr:last-child>td:last-child {
    border-bottom-right-radius: 8px;
}

#tg>tbody>tr:hover>* {
    background-color: #fffffffa;
}

/* colonne */
#tg th[data-dt-column="0"],
#tg td[data-dt-column="0"] {
    width: 9% !important;
}

#tg th[data-dt-column="1"],
#tg td[data-dt-column="1"] {
    width: 15% !important;
}

#tg th[data-dt-column]:not([data-dt-column="0"]):not([data-dt-column="1"]):not([data-dt-column="2"]),
#tg td[data-dt-column]:not([data-dt-column="0"]):not([data-dt-column="1"]):not([data-dt-column="2"]) {
    width: 10% !important;
}

td.dt-empty {
    display: none;
}

div.dt-paging {
    margin: 5px !important;
    display: flex;
    justify-content: flex-end;
}

/* errore */
#nessun_elemento_trovato {
    font-size: 17px;
    display: none;
}

#filtri label {
    min-width: 5rem;
}

div.dt-container.dt-empty-footer tbody>tr:last-child>* {
    border-bottom: none;
}

#tg ::selection,
#filtri ::selection {
    background: #fed620;
    color: black;
}

@media screen and (max-width: 767px) {

    /* filtrei della tabella */
    #filtri {
        display: none;
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    #filtri.aperti {
        display: block;
    }

    #filtri span label {
        display: inline-block;
        width: 30%;
    }

    #filtri span {
        width: 100%;
        display: block;
        text-align: center;
        margin-bottom: 10px;
    }

    #filtri span input,
    select {
        width: 45%;
        margin-left: auto;
        margin-right: auto;
    }

    /* mostra filtri */
    #mostra_filtri {
        padding: 0 10px;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    #filtri span button {
        display: inline-block;
        margin-left: auto;
        margin-right: auto;
    }

    /* colonne tbella */
    #tg-wrap {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #tg {
        min-width: 1424px;
    }

    #tg col:nth-child(1) {
        width: 100px;
    }

    #tg col:nth-child(2) {
        width: 200px;
    }

    #tg col:nth-child(3) {
        width: 100px;
    }

    #tg col:nth-child(n+4) {
        width: 150px;
    }

    #filtri .bottoni {
        padding: 0 5rem;
    }
}

.sidebar-menu {
    padding-left: 2rem;
}

.sidebar-menu>li:hover,
.sidebar-menu>li:hover>a>span,
.sidebar-menu>li:hover>a>i {
    color: var(--yellow);
}

.dt-paging::selection,
.paging_numbers::selection,
.pagination::selection,
.dt-paging-button::selection,
.ellipsis::selection {
    background-color: #FED620 !important;
    color: #000 !important;
}

/* scollbar */
/* ::-webkit-scrollbar {
    width: 0;
    height: 0;
} */

#tg-wrap,
#tg {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.modal-footer {
    display: flex;
    justify-content: center;
}

/* Hall of fame — nome completato */
.hof-completed-name {
    background-color: #FED620 !important;
    font-weight: 700;
}

/* Completed hero */
.db-completed-hero {
    text-align: center;
    padding: 2.5rem 1rem;
    margin-bottom: 1.25rem;
    background: linear-gradient(160deg, #1a1a1a 0%, #2b2b2b 100%);
    border-radius: 16px;
    border: 2px solid #FED620;
}
.db-completed-hero__medal {
    max-width: 260px;
    width: 55%;
    display: block;
    margin: 0 auto 1.25rem;
    filter: drop-shadow(0 8px 24px rgba(254,214,32,0.35));
}
.db-completed-hero__title {
    font-size: 3rem;
    font-weight: 900;
    color: #FED620;
    letter-spacing: -1px;
    text-decoration: underline;
    text-decoration-color: #FED620;
    text-decoration-thickness: 4px;
    line-height: 1;
    margin-bottom: 0.6rem;
}
.db-completed-hero__sub {
    font-size: 1.1rem;
    color: #aaa;
}
@media (max-width: 576px) {
    .db-completed-hero__title { font-size: 2.2rem; }
    .db-completed-hero__medal { width: 70%; }
}