/* Migrazione su un altro server (Impostazioni › Sicurezza e backup › Migrazione) e «Migra in cloud» nella Gestione
   tecnica. Regole del capo (polish.css): niente riquadri dietro caselle e pulsanti, righe sottili e spazio tra i gruppi,
   un solo arrotondamento, le barre in percentuale dell'aggiornamento (.upd-progress). */

/* i passi: un elenco sulla pagina, una riga sottile tra un passo e l'altro */
.mig-steps { list-style: none; margin: .4rem 0 .2rem; padding: 0; display: grid; }
.mig-step { display: grid; grid-template-columns: 1.9rem minmax(0, 1fr); gap: .1rem .75rem; align-items: start;
  padding: .6rem 0; border-top: 1px solid var(--line); }
.mig-step:first-child { border-top: 0; }
.mig-step > div { min-width: 0; display: grid; gap: .15rem; }
.mig-step b { font-weight: 600; color: var(--ink); }
.mig-step small { overflow-wrap: anywhere; }
.mig-step .upd-progress { margin: .35rem 0 .1rem; }
.mig-dot { width: 1.9rem; height: 1.9rem; border-radius: 50%; display: grid; place-items: center; font-size: var(--fs-sm);
  font-weight: 600; font-variant-numeric: tabular-nums; color: var(--muted); border: 1px solid var(--line-strong); }
.mig-dot svg { width: var(--ic-sm); height: var(--ic-sm); }
.mig-step.mig-s-ok .mig-dot { color: #12a56a; border-color: color-mix(in srgb, #12a56a 45%, var(--line)); }
.mig-step.mig-s-run .mig-dot { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); }
.mig-step.mig-s-run .mig-dot svg { animation: busy-spin 1.4s linear infinite; }
.mig-step.mig-s-ko .mig-dot { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 45%, var(--line)); }
.mig-step.mig-s-todo b { color: var(--ink-2); font-weight: 500; }
@media (prefers-reduced-motion: reduce) { .mig-step.mig-s-run .mig-dot svg { animation: none; } }

/* cosa viaggia: righe con l'icona, senza riquadri */
.mig-what { list-style: none; margin: .2rem 0 .4rem; padding: 0; display: grid; }
.mig-what li { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: .75rem; align-items: start; padding: .55rem 0;
  border-top: 1px solid var(--line); }
.mig-what li:first-child { border-top: 0; }
.mig-what li > svg { width: var(--ic-sm); height: var(--ic-sm); color: var(--accent); margin-top: .1rem; }
.mig-what span { display: grid; gap: .1rem; min-width: 0; }
.mig-what b { font-weight: 600; }

/* il primo passo: le tre cose da fare, il comando da copiare, l'indirizzo */
.mig-howto { display: grid; gap: .6rem; border-top: 1px solid var(--line); padding-top: .8rem; margin-top: .3rem; }
.mig-sub { margin: .2rem 0 0; }
.mig-list { margin: 0; padding-left: 1.2rem; display: grid; gap: .55rem; color: var(--ink-2); }
.mig-list li::marker { color: var(--accent); font-weight: 600; }
.mig-cmd { margin: .45rem 0 .1rem; }
.mig-addr { align-items: flex-end; }
.mig-addr .field { flex: 1 1 18rem; min-width: 0; }
.mig-lead { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: .65rem; align-items: start; margin: .4rem 0; }
.mig-lead > svg { width: var(--ic-sm); height: var(--ic-sm); color: #12a56a; margin-top: .15rem; }
.mig-lead b { color: var(--ink); }
.mig-note { display: grid; grid-template-columns: 1.1rem minmax(0, 1fr); gap: .55rem; align-items: start; color: var(--muted); }
.mig-note > svg { width: var(--ic-sm); height: var(--ic-sm); color: var(--accent); margin-top: .15rem; }
.mig-panel code, #mig-panel code { overflow-wrap: anywhere; }

/* i controlli della verifica */
.mig-checks { list-style: none; margin: .3rem 0 .4rem; padding: 0; display: grid; }
.mig-checks li { display: grid; grid-template-columns: 1.1rem minmax(0, 1fr); gap: .6rem; align-items: start; padding: .4rem 0;
  border-top: 1px solid var(--line); }
.mig-checks li:first-child { border-top: 0; }
.mig-checks li > svg { width: var(--ic-sm); height: var(--ic-sm); margin-top: .15rem; }
.mig-checks li.ok > svg { color: #12a56a; }
.mig-checks li.ko > svg { color: var(--danger); }
.mig-checks li.warn > svg { color: #f5b941; }
.mig-checks span { min-width: 0; overflow-wrap: anywhere; }
.mig-recv { margin-top: .4rem; }
.mig-recv .row { align-items: flex-end; }
.mig-recv .field { flex: 1 1 16rem; min-width: 0; }

/* lo stato in alto a destra: blu del brand mentre lavora, verde a posto, rosso da guardare (come il backup) */
#mig-panel .badge { background: var(--accent-soft); color: var(--accent); box-shadow: none; font-size: var(--fs-xs); }
#mig-panel .badge.ok { background: var(--t-green); color: var(--t-green-ink); }
#mig-panel .badge.ko { background: var(--t-red); color: var(--t-red-ink); }
#mig-panel .check { margin: .15rem 0; }
#mig-panel .btn-row { margin-top: .35rem; }

/* la fascia «sola lettura» in cima (stessa forma di quella dell'abbonamento, edition.css) */
.mig-band .btn { min-height: 2.1rem; padding: .3rem .8rem; font-size: var(--fs-sm); }

/* Gestione tecnica: lo stato della migrazione in cloud nella scheda del cliente */
.mig-gt { display: grid; gap: .3rem; margin: .2rem 0 .1rem; padding-top: .55rem; border-top: 1px solid var(--line); }
.mig-gt .upd-progress { margin: 0; }
.mig-gt .ko-text { margin: 0; font-size: var(--fs-sm); }
.mig-gt button { justify-self: start; }

@media (max-width: 860px) {
  .mig-addr > button, .mig-recv .row > button { width: 100%; }
}