@charset "UTF-8";
/*!
 * Stylesheet for CodiceFiscale.info
 * © 2026 GiDiNet®. All rights reserved.
 *
 * This stylesheet is part of the redesigned version of the CodiceFiscale.info website.
 * The original website has been online since 2005.
 *
 * Unauthorized reproduction, distribution, or modification of this file is strictly prohibited.
 */

:root{
  --accent:#1f5fbf;
  --accent-2:#184c99;
  --accent-soft:#eaf2ff;

  --text:#1b1f2a;
  --muted:#5a6476;

  --bg:#ffffff;
  --panel:#f5f7fb;
  --card:#ffffff;

  --border:#cfd6e4;
  --border-soft:#e3e8f3;

  --header-bg:#e8eef8;
  --shadow:0 2px 10px rgba(0,0,0,.08);
  --radius:12px;
}

*{box-sizing:border-box}

html, body {
    height: 100%;
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color: var(--text);
    background: var(--bg);
    line-height: 1.55;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 18px;
}

.site-header{
  background:var(--header-bg);
  border-bottom:1px solid var(--border);
}

.header-row{
  display:flex;
  align-items:center;
  gap:18px;
  padding:14px 0;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:inherit;
  min-width:260px;
}

.brand-mark{
  width:40px;
  height:40px;
  border-radius:12px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  box-shadow:var(--shadow);
}

.brand-text{display:flex; flex-direction:column}
.brand-name{
  font-weight:900;
  font-size:20px;
  letter-spacing:.2px;
}
.brand-subtitle{
  font-size:13px;
  color:var(--muted);
  margin-top:-2px;
}

.top-nav{
  display:flex;
  gap:10px;
  flex:1 1 auto;
  justify-content:flex-end;
}
.top-nav a{
  text-decoration:none;
  color:#0f1320;
  font-weight:700;
  padding:8px 10px;
  border-radius:10px;
}
.top-nav a:hover{
  background:rgba(31,95,191,.10);
  color:var(--accent-2);
}
.top-nav a.is-current{
  background:rgba(31,95,191,.14);
  color:var(--accent-2);
  border:1px solid rgba(31,95,191,.22);
}

.page-layout{
  display:flex;
  gap:18px;
  padding:18px 0 28px;
  align-items:flex-start;
}

.sidebar{
  width:310px;
  flex:0 0 310px;
}

.content{
  flex:1 1 auto;
  min-width:0;
}

.page-head{
  margin:6px 0 14px;
}
h1{
  margin:0 0 6px;
  font-size:28px;
  color:var(--accent-2);
}
.lead{
  margin:0;
  color:var(--muted);
}

.panel{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:14px;
  box-shadow:var(--shadow);
  margin-bottom:12px;
}
.panel.soft{
  background:#f8f9fd;
  border-color:var(--border-soft);
}
.panel h3{
  margin:0 0 10px;
  font-size:15px;
  letter-spacing:.2px;
}

.nav-list{
  list-style:none;
  padding:0;
  margin:0;
}
.nav-list li{margin:6px 0}
.nav-list a{
  display:flex;
  align-items:center;
  padding:8px 10px;
  border-radius:10px;
  text-decoration:none;
  color:#0f1320;
  font-weight:700;
}
.nav-list a:hover{
  background:rgba(31,95,191,.10);
  color:var(--accent-2);
}
.nav-list a.is-current{
  background:rgba(31,95,191,.14);
  color:var(--accent-2);
  border:1px solid rgba(31,95,191,.22);
}

.cta{
  background:linear-gradient(180deg, rgba(31,95,191,.10), rgba(31,95,191,.06));
  border-color:rgba(31,95,191,.22);
}
.cta p{
  margin:8px 0 12px;
  color:var(--muted);
}

.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:14px;
}

.card-head h2{
  margin:0 0 6px;
  font-size:18px;
  color:#0f1320;
}
.card-head p{
  margin:0 0 12px;
  color:var(--muted);
}

.grid-2{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:14px;
  align-items:start;
}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.field{display:block}
.label{
  display:block;
  font-size:13px;
  font-weight:800;
  color:#0f1320;
  margin:0 0 6px;
}
.input, .select{
  width:100%;
  padding:10px 10px;
  border:1px solid var(--border);
  border-radius:12px;
  font-size:14px;
  background:#fff;
  color:var(--text);
}
.input:focus, .select:focus{
  outline:none;
  border-color:rgba(31,95,191,.55);
  box-shadow:0 0 0 4px rgba(31,95,191,.12);
}

.inline{
  display:flex;
  gap:10px;
  align-items:center;
}

.actions{
  display:flex;
  gap:10px;
  margin-top:12px;
  align-items:center;
}

.btn{
  display:inline-block;
  text-decoration:none;
  padding:10px 12px;
  border-radius:12px;
  background:var(--accent);
  color:#fff;
  font-weight:900;
  border:1px solid var(--accent-2);
  cursor:pointer;
}
.btn:hover{background:var(--accent-2)}
.btn:active{transform:translateY(1px)}

.btn-ghost{
  background:#fff;
  color:var(--accent-2);
  border:1px solid rgba(31,95,191,.35);
}
.btn-ghost:hover{
  background:rgba(31,95,191,.08);
}

.btn-small{
  padding:8px 10px;
  border-radius:10px;
  font-size:13px;
}

.note{
  margin-top:12px;
  padding:12px 12px;
  background:var(--accent-soft);
  border:1px solid rgba(31,95,191,.25);
  border-left:6px solid var(--accent);
  border-radius:var(--radius);
  color:#24324a;
}

.callout{
  margin-top:12px;
  padding:12px 12px;
  border:1px solid var(--border);
  border-left:6px solid var(--accent-2);
  border-radius:var(--radius);
  background:#f7f9ff;
}
.callout.warn{
  border-left-color:#c07a00;
  background:#fff7e6;
}

.result-box{
  border:1px solid var(--border-soft);
  border-radius:var(--radius);
  padding:12px;
  background:#fbfcff;
}
.result-label{
  font-size:13px;
  font-weight:900;
  color:var(--muted);
  margin-bottom:6px;
}
.result-value{
  font-size:22px;
  font-weight:1000;
  letter-spacing:.6px;
  color:#0f1320;
  padding:10px 10px;
  border-radius:12px;
  background:#fff;
  border:1px solid var(--border);
}
.result-actions{
  display:flex;
  gap:10px;
  margin-top:10px;
  flex-wrap:wrap;
}

.kv{
  margin-top:12px;
  border:1px solid var(--border-soft);
  border-radius:var(--radius);
  overflow:hidden;
  background:#fff;
}
.kv-row{
  display:flex;
  gap:10px;
  padding:10px 12px;
  border-bottom:1px solid var(--border-soft);
}
.kv-row:last-child{border-bottom:none}
.kv-k{
  width:48%;
  color:var(--muted);
  font-weight:800;
}
.kv-v{
  width:52%;
  color:#0f1320;
  font-weight:800;
}

.mini-links{
  margin-top:12px;
  font-size:13px;
  color:var(--muted);
}
.mini-links a{
  color:var(--accent-2);
  text-decoration:none;
  font-weight:800;
}
.mini-links a:hover{text-decoration:underline}
.sep{margin:0 8px; color:var(--border)}

.info-card{
  margin-top:14px;
}
.guide-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
}
.guide-item{
  border:1px solid var(--border-soft);
  border-radius:var(--radius);
  padding:12px;
  background:#fff;
}
.guide-item h3{
  margin:0 0 6px;
  font-size:15px;
  color:#0f1320;
}
.guide-item p{
  margin:0;
  color:var(--muted);
}

a{color:var(--accent-2)}
a:hover{color:var(--accent)}

.site-main {
    flex: 1 0 auto;
}

.site-footer {
    border-top: 1px solid var(--border);
    background: #f7f9fc;
    flex-shrink: 0;
}

.footer-row{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:16px 0;
  color:var(--muted);
  font-size:13px;
}
.footer-title{font-weight:1000; color:#0f1320}
.footer-sub{margin-top:2px}
.footer-links{
  display:flex;
  gap:12px;
  align-items:center;
}
.footer-links a{
  text-decoration:none;
  color:var(--muted);
  font-weight:800;
}
.footer-links a:hover{color:var(--accent-2)}

.footer-legal {
    display: block;
    padding: 16px 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.45;
}

    .footer-legal a {
        color: var(--muted);
        text-decoration: none;
        font-weight: 800;
    }

        .footer-legal a:hover {
            color: var(--accent-2);
            text-decoration: underline;
        }

.table-wrap {
    overflow: auto;
    border-radius: var(--radius);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    background: #fff;
}

table {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
}

th, td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border-soft);
    text-align: left;
    vertical-align: top;
}

th {
    background: linear-gradient(180deg, rgba(31,95,191,.16), rgba(31,95,191,.10));
    color: #0d234a;
    font-weight: 900;
}

tr:last-child td {
    border-bottom: none
}

@media (max-width: 1020px){
  .top-nav{display:none}
  .grid-2{grid-template-columns:1fr}
  .sidebar{width:100%; flex:0 0 auto}
  .page-layout{flex-direction:column}
  table {
      min-width: 0
  }
}

@media (max-width: 720px){
  .form-grid{grid-template-columns:1fr}
  .guide-grid{grid-template-columns:1fr}
  .brand{min-width:auto}
}