/* =========================
   VisionTV · /css/visiontv.css
   Tema DARK SCURO (OLED-friendly)
   Valido per: home + admin
   ========================= */

/* ---------- Design tokens (dark) ---------- */
:root{
  color-scheme: dark;

  /* Palette */
  --bg:#050507;           /* quasi-nero */
  --bg-soft:#08090d;      /* fondo sfumato */
  --surface-1:#0b0e13;    /* card/input */
  --surface-2:#0e1117;    /* superfici più chiare */
  --surface-3:#11161e;    /* hover table */

  --text:#e6e7ea;         /* testo primario */
  --muted:#9aa0a6;        /* testo secondario */

  --border:#1c2129;       /* bordi sottili */
  --primary:#ffffff;      /* bottoni principali */
  --focus:#60a5fa;        /* anello focus accessibile */

  --radius:14px;
}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans",sans-serif;
  background:
    radial-gradient(1200px 700px at 20% 0%, var(--bg-soft) 0%, var(--bg) 55%, #000 100%) fixed,
    #000;
  color:var(--text);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

::selection{background:#1f2937; color:#eaf2ff}

img{max-width:100%; height:auto; display:block}
a{color:#d8dee9; text-decoration:underline}
a:hover{color:#ffffff}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--focus); outline-offset:2px
}

.container{width:min(1140px,92%); margin-inline:auto}

/* ---------- Typography ---------- */
h1,h2,h3{color:#fff; line-height:1.25; margin:0 0 .5rem}
h1{font-size: clamp(1.8rem, 2.3vw + 1rem, 2.6rem)}
h2{font-size: clamp(1.4rem, 1.4vw + .9rem, 2rem)}
h3{font-size: clamp(1.1rem, .9vw + .9rem, 1.3rem)}
p{margin:.4rem 0 1rem}
.muted{color:var(--muted)}

/* ---------- Header minimal ---------- */
.page-head{
  padding:36px 0;
  border-bottom:1px solid var(--border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
}
.page-head__title{margin:0}
.page-head__subtitle{margin:.3rem 0 0; color:var(--muted)}

/* ---------- Sections / layout ---------- */
.section{padding:56px 0}
.grid-2{display:grid; grid-template-columns: 1.2fr .8fr; gap:32px}
@media (max-width: 900px){ .grid-2{grid-template-columns: 1fr} }

/* ---------- Card ---------- */
.card{
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:18px;
}
.card__title{margin-bottom:.5rem}
.list{margin:.4rem 0 0; padding-left:1.2rem}
.list li{margin:.25rem 0}

/* ---------- Apply / form area ---------- */
.section--apply{
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
  border-top:1px solid var(--border);
}
.apply-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px}

/* ---------- Form ---------- */
.form{margin-top:16px}
.form__grid{
  display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:16px;
}
@media (max-width:700px){ .form__grid{grid-template-columns:1fr} }

.field{display:flex; flex-direction:column; gap:6px}
.field--full{grid-column:1 / -1}
.field label{font-weight:600}
.field input[type="text"],
.field input[type="email"],
.field input[type="url"],
.field select,
.field textarea{
  background:var(--surface-1);
  color:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:10px 12px; font-size:15px;
}
.field input::placeholder, .field textarea::placeholder{color:#7b8694}
.field textarea{resize: vertical}
.checkbox label{display:flex; align-items:flex-start; gap:8px; font-weight:400}
.checkbox a{color:#e7edf9; text-decoration:underline}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  height:44px; padding:0 16px; border-radius:calc(var(--radius) - 2px);
  text-decoration:none; border:1px solid var(--border); cursor:pointer;
  background:var(--surface-2); color:#fff; font-weight:600;
}
.btn:hover{background:#141922}
.btn--primary{background:var(--primary); color:#000; border-color:transparent}
.btn--primary:hover{filter:brightness(.92)}
.btn:disabled{opacity:.6; cursor:not-allowed}

/* ---------- Alerts ---------- */
.alert{
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:12px 14px; margin:16px 0;
  background:rgba(16,185,129,.10); /* green */
}
.alert--error{background:rgba(239,68,68,.10)} /* red */

/* =========================
   Area Admin (lista candidature)
   ========================= */

/* Filtri */
.admin-filters{margin-bottom:16px}
.admin-filters__grid{
  display:grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr; gap:12px;
}
@media (max-width: 1000px){ .admin-filters__grid{grid-template-columns:1fr 1fr} }
.admin-filters__actions{margin-top:10px; display:flex; gap:10px}

/* Riepilogo */
.admin-summary{
  display:flex; gap:18px; align-items:center; margin:10px 0 6px; color:var(--muted);
}

/* Tabella */
.table-wrap{
  overflow:auto;
  border:1px solid var(--border);
  border-radius:12px;
  background:transparent;
}
.adm-table{
  width:100%;
  border-collapse:separate; border-spacing:0;
}
.adm-table th, .adm-table td{
  padding:10px 12px;
  border-bottom:1px solid var(--border);
  text-align:left; vertical-align:top; font-size:14.5px;
  background:transparent;
}
.adm-table thead th{
  position:sticky; top:0;
  background:rgba(8,10,14,.85); /* header più scuro */
  backdrop-filter: blur(6px);
}
.adm-table tr:hover td{
  background: var(--surface-3);
}
.th-sort{color:#fff; text-decoration:none; display:inline-flex; align-items:center; gap:6px}
.th-sort::after{content:"⇅"; opacity:.45; font-size:.9em}

/* Troncamenti utili per UA e messaggi lunghi */
.truncate{max-width:420px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

/* Paginazione */
.pager{display:flex; gap:6px; margin-top:12px; flex-wrap:wrap}
.pager__link{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:38px; height:38px; padding:0 10px;
  border:1px solid var(--border); border-radius:10px;
  color:#fff; text-decoration:none; background:var(--surface-1);
}
.pager__link:hover{background:#141922}
.pager__link.is-active{background:#fff; color:#000; border-color:transparent}
.pager__link.is-disabled{opacity:.5; pointer-events:none}

/* ---------- Utility ---------- */
.hidden{display:none !important}
.center{text-align:center}

/* ---------- Scrollbar dark (webkit) ---------- */
*::-webkit-scrollbar{width:10px; height:10px}
*::-webkit-scrollbar-thumb{background:#1b2330; border-radius:10px; border:2px solid #0a0d12}
*::-webkit-scrollbar-thumb:hover{background:#242f40}
*::-webkit-scrollbar-track{background:#0a0d12}

/* ---------- Form autofill (dark) ---------- */
input:-webkit-autofill,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill{
  -webkit-text-fill-color:#fff;
  -webkit-box-shadow:0 0 0 1000px var(--surface-1) inset;
  transition: background-color 5000s ease-in-out 0s;
}