/* =========================================================
   Elementor Tabella Obiettivi — eto-table.css  v1.1
   • Sfondo trasparente (eredita dalla pagina)
   • Bordi sottili come da design
   • Mobile: colonna 1 sticky + scroll orizzontale
   ========================================================= */



.eto-table-wrap table td, .eto-table-wrap table th {
    border: 0px;

}


table tbody>tr:nth-child(odd)>td, table tbody>tr:nth-child(odd)>th {
    background-color: #F0EFEB !important;
}


/* ── Wrapper ── */
.eto-table-wrap {
    font-family: Georgia, 'Times New Roman', serif;
    background: transparent;
    padding: 0;
    box-sizing: border-box;
    width: 100%;
}

/* ── Titolo ── */
.eto-table-title {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 1.3rem;
    font-weight: 400;
    color: #1a1a1a;
    margin: 0 0 24px 0;
    padding: 0;
    line-height: 1.3;
    letter-spacing: 0.01em;
}


.eto-tr:hover {
	 background-color: #F0EFEB !important;
}



.eto-table-wrap th {
	border-block-start-width:0 !important;	
}


.eto-th.eto-col-3 {
	border-right: 0px !important;
}

.eto-table-wrap table td,  .eto-table-wrap table th {
    border-left:0 !important;
}

 .eto-table-wrap table th {
	border-bottom: 0px ! important;
	border-right: 1px solid #000 !important;
}

.eto-table-wrap .eto-tr  td {
	border-top: 0px !important;
	border-bottom:1px solid #a2a2a2;
	border-right: 1px solid #a2a2a2;
}


.eto-td.eto-col-1 {
	font-weight:400 !important;
}

.eto-td.eto-col-3 {
	border-right: 0px !important;
}

.eto-table-wrap .eto-table tbody tr:last-child .eto-td {
    border-bottom: none !important;
}

/* ── Scroll container (attivo solo su mobile) ── */
.eto-table-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    /* Nasconde scrollbar su webkit ma mantiene funzionalità */
    scrollbar-width: thin;
    scrollbar-color: #ccc transparent;
}
.eto-table-scroll::-webkit-scrollbar {
    height: 4px;
}
.eto-table-scroll::-webkit-scrollbar-track {
    background: transparent;
}
.eto-table-scroll::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 2px;
}

/* ── Tabella ── */
.eto-table {
    width: 100%;
    min-width: 100%;
    border-collapse: collapse;
    background: transparent;
    /* Bordo esterno della tabella */
    border: 0px solid #c8c8c8;
    table-layout: fixed;
}

.eto-table  thead {
	border-bottom:1px solid #000;
}

/* ── Colgroup ── */
.eto-table .eto-col-1 { width: 40%; }
.eto-table .eto-col-2 { width: 46%; }
.eto-table .eto-col-3 { width: 14%; }

/* ══════════════════════════════════════════
   HEADER
   ══════════════════════════════════════════ */
.eto-th {
    font-family: inherit;
    font-size: 0.6rem;
    font-weight: 400;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #999;
    text-align: left;
    padding: 10px 16px;
    background: transparent;
    /* Solo bordo inferiore che separa header da body */
    border-bottom: 1px solid #c8c8c8;
    /* Separatori verticali tra le celle header */
    border-right: 1px solid #c8c8c8;
    vertical-align: middle;
    white-space: nowrap;
}
.eto-th:last-child {
    border-right: none;
}

/* ══════════════════════════════════════════
   CELLE CORPO
   ══════════════════════════════════════════ */
.eto-td {
    font-family: inherit;
    font-size: 0.82rem;
    line-height: 1.55;
    color: #1a1a1a;
    padding: 16px 16px;
    vertical-align: middle;
    background: transparent;
    /* Separatori: solo bordo superiore (riga) e destro (colonna) */
    border-top: 1px solid #e2e2e2;
    border-right: 1px solid #e2e2e2;
    word-break: break-word;
    hyphens: auto;
}
.eto-td:last-child {
    border-right: none;
}

/* Colonna 1 – Obiettivo: grassetto */
.eto-td.eto-col-1 {
    font-weight: 400;
    color: #1a1a1a;
	vertical-align: middle;
}

/* Colonna 2 – KPI: corsivo */
.eto-td.eto-col-2 {
    font-style: italic;
    font-weight: 400;
    color: #333;
    vertical-align: middle;
}

/* Colonna 3 – Anno Target: centrato */
.eto-td.eto-col-3 {
    text-align: center;
    vertical-align: middle;
    color: #888;
	font-style: italic !important;
    font-size: 0.78rem;
    line-height: 1.9;
    font-style: normal;
 
}



/* ══════════════════════════════════════════
   MOBILE — Sticky prima colonna
   ══════════════════════════════════════════ */
@media (max-width: 768px) {

    .eto-table-wrap {
        /* Serve per calcolare il bg sticky */
        position: relative;
    }

    .eto-table-scroll {
        overflow-x: auto;
    }

    /* Forza min-width così le colonne non si schiacciano */
    .eto-table {
        table-layout: auto;
        min-width: 560px; /* garantisce lo scroll */
        width: 100%;
    }

    /* Reset larghezze su mobile */
    .eto-table .eto-col-1 { width: 220px; min-width: 220px; }
    .eto-table .eto-col-2 { min-width: 200px; }
    .eto-table .eto-col-3 { min-width: 80px; }

    /* ─ Sticky: header col 1 ─ */
    .eto-th.eto-col-1 {
        /* Sfondo: usa la custom property impostata inline dal widget,
           con fallback a white. Il colore viene gestito dal controllo
           Elementor --eto-sticky-bg. */
        background: #F0EFEB;

    }

    /* ─ Sticky: celle corpo col 1 ─ */
    .eto-td.eto-col-1 {
        background:#F0EFEB;
    }

    .eto-td,
    .eto-th {
        font-size: 0.78rem;
        padding: 12px 12px;
    }
}

@media (max-width: 480px) {
    .eto-table .eto-col-1 { width: 240px; min-width: 240px; }
}


.eto-tr--spacer { pointer-events: none; }
.eto-td-spacer {
    padding: 0 !important;
    border: none !important;
    height: var(--eto-thead-gap, 0px);
    background: transparent !important;
    box-shadow: none !important;
}

.eto-td-spacer {
	border-bottom:0px !important;
}