/* =================================================================
   DishFlow — privacy.css
   Stili aggiuntivi per la pagina Informativa Privacy
   Importa termini.css come base
   ================================================================= */

/* ── HIGHLIGHT BOX (Titolare) ────────────────────────────────── */
.highlight-box {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 14px; padding: 20px 24px;
    display: flex; flex-direction: column; gap: 16px;
    margin-top: 16px;
    background-image: linear-gradient(135deg, rgba(201,168,76,.04) 0%, transparent 50%);
}
.hb-row {
    display: flex; align-items: flex-start; gap: 14px;
}
.hb-row svg { width: 18px; height: 18px; stroke: var(--gold); flex-shrink: 0; margin-top: 2px; }
.hb-row div { display: flex; flex-direction: column; gap: 3px; }
.hb-row strong { font-size: .88rem; color: var(--white); font-weight: 600; }
.hb-row span { font-size: .80rem; color: var(--gray); }
.hb-row a { font-size: .84rem; color: var(--gold); transition: opacity .2s; }
.hb-row a:hover { opacity: .75; }

/* ── TABELLA FINALITÀ ────────────────────────────────────────── */
.purpose-table {
    border: 1px solid var(--brd2);
    border-radius: 14px; overflow: hidden;
    margin-top: 16px;
}
.pt-row {
    display: grid; grid-template-columns: 1fr auto;
    gap: 16px; align-items: center;
    padding: 14px 20px;
    border-bottom: 1px solid var(--brd2);
}
.pt-row:last-child { border-bottom: none; }
.pt-head {
    background: rgba(255,255,255,.02);
    font-size: .68rem; font-weight: 800;
    text-transform: uppercase; letter-spacing: 1px;
    color: var(--gray2);
}
.pt-row:not(.pt-head) span:first-child {
    font-size: .84rem; color: rgba(255,255,255,.7);
}
.pt-tag {
    font-size: .62rem; font-weight: 800;
    text-transform: uppercase; letter-spacing: .5px;
    padding: 4px 10px; border-radius: 50px;
    white-space: nowrap;
}
.pt-tag--contract { background: rgba(59,130,246,.12); border: 1px solid rgba(59,130,246,.25); color: #60a5fa; }
.pt-tag--legal    { background: rgba(234,179,8,.10);  border: 1px solid rgba(234,179,8,.25);  color: #eab308; }
.pt-tag--interest { background: rgba(168,85,247,.10); border: 1px solid rgba(168,85,247,.25); color: #c084fc; }
.pt-tag--consent  { background: rgba(34,197,94,.10);  border: 1px solid rgba(34,197,94,.25);  color: #22c55e; }

/* ── TABELLA CONSERVAZIONE ───────────────────────────────────── */
.retention-table {
    border: 1px solid var(--brd2);
    border-radius: 14px; overflow: hidden;
    margin: 16px 0;
}
.rt-row {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 16px; align-items: center;
    padding: 13px 20px;
    border-bottom: 1px solid var(--brd2);
}
.rt-row:last-child { border-bottom: none; }
.rt-head {
    background: rgba(255,255,255,.02);
    font-size: .68rem; font-weight: 800;
    text-transform: uppercase; letter-spacing: 1px;
    color: var(--gray2);
}
.rt-row:not(.rt-head) span:first-child { font-size: .84rem; color: rgba(255,255,255,.7); }
.rt-row:not(.rt-head) span:last-child  { font-size: .82rem; color: var(--gray); }

/* ── RIGHTS GRID ─────────────────────────────────────────────── */
.rights-grid {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 12px; margin: 16px 0;
}
.right-item {
    display: flex; gap: 14px; align-items: flex-start;
    background: var(--card); border: 1px solid var(--brd2);
    border-radius: 13px; padding: 16px 18px;
    transition: border-color .25s, transform .25s;
}
.right-item:hover { border-color: rgba(201,168,76,.28); transform: translateY(-2px); }
.ri-icon {
    width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
    background: rgba(201,168,76,.08); border: 1px solid var(--border);
    display: flex; align-items: center; justify-content: center;
}
.ri-icon svg { width: 16px; height: 16px; stroke: var(--gold); }
.right-item > div { display: flex; flex-direction: column; gap: 4px; }
.right-item strong { font-size: .84rem; color: var(--white); font-weight: 600; }
.right-item p { font-size: .76rem; color: var(--gray); line-height: 1.6; margin: 0; }

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media (max-width: 700px) {
    .rights-grid { grid-template-columns: 1fr; }
    .pt-row, .rt-row { grid-template-columns: 1fr; }
    .pt-tag { width: fit-content; }
}