/*
 | Rete venditori: pagina "Lavora con noi" e area /venditori.
 | Si appoggia ai token e ai blocchi .vt-auth di brand.css.
 */

/* Campi che .vt-auth non copre: select, textarea, scelte multiple */
.vt-auth__field textarea,
.vt-auth__field select {
    width: 100%; min-height: 48px; padding: .7rem .9rem;
    border: 1px solid var(--border-strong); border-radius: 10px;
    font: inherit; color: var(--text-primary); background: #fff;
}
.vt-auth__field textarea { min-height: 96px; resize: vertical; }
.vt-auth__field textarea:focus,
.vt-auth__field select:focus,
.vt-auth__field input[type=file]:focus { outline: none; border-color: var(--brand-azure-ink); box-shadow: 0 0 0 3px var(--brand-azure-tint); }
.vt-auth__field input[type=file] { padding: .65rem .9rem; min-height: 0; }
.vt-auth__field .is-invalid { border-color: var(--brand-red); }
.vt-auth__field .vt-field-error { color: var(--brand-red); font-size: var(--fs-xs); font-weight: var(--fw-bold); }
.vt-auth__pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); align-items: end; }
/* Etichette che vanno a capo (Provincia (facoltativo)): i campi restano allineati */
.vt-auth__form .vt-auth__row { align-items: end; }
.vt-auth__legend { font-size: var(--fs-sm); font-weight: var(--fw-bold); color: var(--text-primary); margin: 0 0 .35rem; }
.vt-auth__group { border: 0; padding: 0; margin: 0; }
.vt-auth__section {
    font-size: var(--fs-xs); font-weight: var(--fw-extra); text-transform: uppercase; letter-spacing: .06em;
    color: var(--brand-azure-ink); margin: var(--space-2) 0 0; padding-top: var(--space-3); border-top: 1px solid var(--border);
}
.vt-auth__section:first-child { border-top: 0; padding-top: 0; margin-top: 0; }

.vt-slots { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.vt-slot { position: relative; }
.vt-slot input { position: absolute; opacity: 0; inset: 0; }
.vt-slot span {
    display: flex; align-items: center; gap: .5rem; min-height: 48px; padding: .55rem .8rem;
    border: 1px solid var(--border-strong); border-radius: 10px; font-size: var(--fs-sm); cursor: pointer;
    transition: border-color var(--transition), background var(--transition);
}
.vt-slot span::before {
    content: ""; flex: none; width: 18px; height: 18px; border: 2px solid var(--border-strong); border-radius: 5px; background: #fff;
}
.vt-slot input:checked + span { border-color: var(--brand-blue); background: var(--brand-azure-tint); font-weight: var(--fw-bold); }
.vt-slot input:checked + span::before { background: var(--brand-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' d='M3 8.5l3 3 7-7'/%3E%3C/svg%3E") center/12px no-repeat; border-color: var(--brand-blue); }
.vt-slot input:focus-visible + span { box-shadow: 0 0 0 3px var(--brand-azure-tint); border-color: var(--brand-azure-ink); }

.vt-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Colonna "come funziona" della candidatura */
.vt-steps { list-style: none; margin: var(--space-4) 0 0; padding: 0; counter-reset: step; display: grid; gap: var(--space-3); }
.vt-steps li { counter-increment: step; display: grid; grid-template-columns: 2rem 1fr; gap: .75rem; }
.vt-steps li::before {
    content: counter(step); display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%;
    background: var(--brand-yellow); color: var(--brand-blue); font-weight: var(--fw-black);
}
.vt-steps strong { display: block; color: #fff; }
.vt-steps span { color: rgba(255, 255, 255, .85); font-size: var(--fs-sm); }
.vt-auth__aside .vt-auth__note { margin: var(--space-4) 0 0; font-size: var(--fs-xs); color: rgba(255, 255, 255, .75); }

.vt-done { text-align: center; padding: var(--space-3) 0; }
.vt-done i { font-size: 2.5rem; color: var(--brand-green); margin-bottom: var(--space-3); }

/* Area venditore */
.vt-seller { padding: var(--space-5) 0 var(--space-9); background: var(--background-sunk); min-height: 70vh; }
.vt-seller__wrap { max-width: 1040px; margin: 0 auto; }
.vt-seller__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-4); }
.vt-seller__hello { margin: 0; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); font-weight: var(--fw-black); letter-spacing: -.02em; color: var(--text-primary); }
.vt-seller__hello small { display: block; font-size: var(--fs-sm); font-weight: var(--fw-regular); color: var(--text-secondary); letter-spacing: 0; }
.vt-seller__nav { display: flex; flex-wrap: wrap; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.vt-seller__nav a, .vt-seller__nav button {
    display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: 0 .9rem; border-radius: 999px;
    font-size: var(--fs-sm); font-weight: var(--fw-bold); color: var(--text-secondary); text-decoration: none; background: transparent; border: 0;
}
.vt-seller__nav a:hover, .vt-seller__nav button:hover { color: var(--brand-blue); background: #fff; }
.vt-seller__nav a[aria-current=page] { background: var(--brand-blue); color: #fff; }

.vt-panel { background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: clamp(1.25rem, 1rem + 1vw, 2rem); box-shadow: var(--shadow); margin-bottom: var(--space-4); }
.vt-panel__title { margin: 0 0 .25rem; font-size: 1.15rem; font-weight: var(--fw-black); color: var(--text-primary); }
.vt-panel__lead { margin: 0 0 var(--space-3); color: var(--text-secondary); font-size: var(--fs-sm); }

.vt-link-panel { background: var(--brand-blue); color: #fff; border: 0; }
.vt-link-panel .vt-panel__title { color: #fff; }
.vt-link-panel .vt-panel__lead { color: rgba(255, 255, 255, .85); }
.vt-copy { display: flex; gap: .5rem; flex-wrap: wrap; }
.vt-copy input {
    flex: 1 1 260px; min-width: 0; min-height: 48px; padding: 0 .9rem; border-radius: 10px; border: 0;
    font: inherit; font-weight: var(--fw-bold); color: var(--brand-blue); background: #fff;
}
.vt-copy .vt-btn { min-height: 48px; }
.vt-link-panel .vt-code { display: inline-block; margin-top: var(--space-3); font-size: var(--fs-sm); color: rgba(255, 255, 255, .85); }
.vt-link-panel .vt-code strong { color: var(--brand-yellow); letter-spacing: .12em; font-size: 1.05rem; }
.vt-link-maker { margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid rgba(255, 255, 255, .18); }
.vt-link-maker label { display: block; font-size: var(--fs-sm); font-weight: var(--fw-bold); margin-bottom: .35rem; }

.vt-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); margin-bottom: var(--space-4); }
.vt-stat { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: var(--space-3); }
.vt-stat__label { font-size: var(--fs-xs); color: var(--text-secondary); font-weight: var(--fw-bold); }
.vt-stat__value { font-size: 1.6rem; font-weight: var(--fw-black); color: var(--text-primary); font-variant-numeric: tabular-nums; }

.vt-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.vt-table th { text-align: left; font-size: var(--fs-xs); color: var(--text-secondary); font-weight: var(--fw-bold); padding: .5rem .5rem; border-bottom: 1px solid var(--border); }
.vt-table td { padding: .7rem .5rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.vt-table td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.vt-table .muted { color: var(--text-secondary); font-size: var(--fs-xs); }
.vt-pill { display: inline-block; padding: .15rem .6rem; border-radius: 999px; font-size: var(--fs-xs); font-weight: var(--fw-bold); white-space: nowrap; }
.vt-pill--open { background: var(--brand-azure-tint); color: var(--brand-azure-ink); }
.vt-pill--won { background: var(--brand-green-soft); color: var(--brand-green); }
.vt-pill--lost { background: var(--background-sunk); color: var(--text-secondary); }
.vt-empty { text-align: center; color: var(--text-secondary); padding: var(--space-5) var(--space-3); }

.vt-contract { max-height: 420px; overflow: auto; padding: var(--space-3) var(--space-4); border: 1px solid var(--border); border-radius: 12px; background: var(--background-sunk); font-size: var(--fs-sm); line-height: 1.6; }
.vt-contract h3 { font-size: 1rem; font-weight: var(--fw-black); margin: var(--space-3) 0 .35rem; color: var(--text-primary); }
.vt-contract h3:first-child { margin-top: 0; }
.vt-contract p, .vt-contract li { color: var(--text-primary); }

/* Contatti da chiamare e posizione in classifica */
.vt-work__list { list-style: none; margin: 0; padding: 0; }
.vt-work__list li { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: .65rem 0; border-top: 1px solid var(--border); }
.vt-work__list li:first-child { border-top: 0; }
.vt-work__list a { display: grid; gap: .1rem; min-height: 44px; align-content: center; text-decoration: none; color: var(--text-primary); }
.vt-work__list .muted { color: var(--text-secondary); font-size: var(--fs-xs); }
.vt-pill--due { background: var(--brand-yellow); color: var(--brand-blue); }
.vt-rank { display: flex; align-items: center; gap: .5rem; margin: calc(-1 * var(--space-2)) 0 var(--space-4); color: var(--text-secondary); font-size: var(--fs-sm); }
.vt-rank i { color: var(--brand-yellow); }
.vt-rank strong { color: var(--text-primary); }

@media (max-width: 767.98px) {
    .vt-auth__pair, .vt-slots { grid-template-columns: 1fr; }
    .vt-stats { grid-template-columns: 1fr 1fr; }
    .vt-table thead { display: none; }
    .vt-table tr { display: grid; grid-template-columns: 1fr auto; gap: .15rem .75rem; padding: .7rem 0; border-bottom: 1px solid var(--border); }
    .vt-table td { padding: 0; border: 0; }
    .vt-table td.num { grid-column: 2; grid-row: 1; }
}
