/* =====================================================
   File: public> css> maintenance.css
   Stili specifici della sezione maintenance
   ===================================================== */


/* =====================================================
   STATI MAINTENANCE
   ===================================================== */

#notar-file-status.ok,
#notar-text-status.ok{
  color:rgba(52,211,153,.95);
}

#notar-file-status .btn.link,
#notar-text-status .btn.link{
  margin-left:8px;
  color:#fff;
  border-color:rgba(255,255,255,.25);
  text-decoration:none;
}


/* =====================================================
   RISULTATO VERIFICA
   ===================================================== */

.verify-output{
  min-height:80px;
  font-size:11px;
  line-height:1.5;
  white-space:normal;
}

.verify-output code{
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    "Liberation Mono",
    "Courier New",
    monospace;
  font-size:10px;
}


/* =====================================================
   ATTESTAZIONE
   ===================================================== */

.verify-attestation{
  margin-top:8px;
  padding:8px 10px;
  border-radius:0;
  background:transparent;
  border:0;
}

.verify-attestation-title{
  margin-bottom:4px;
  font-size:11px;
  font-weight:600;
}

.verify-attestation-row{
  color:var(--muted);
  font-size:10px;
}

.verify-attestation-row a{
  color:var(--accent);
  text-decoration:none;
}

.verify-attestation-row a:hover{
  text-decoration:underline;
}


/* =====================================================
   PULSANTE VERIFICA FILE
   ===================================================== */

#verify-file-btn{
  margin-top:8px;
}

/* Maintenance: link bianchi senza bordo */
.linkWhite{
  background: transparent;
  border: none;
  color: #fff;
  padding: 0;
  margin: 0;
  font-weight: 700;
  text-decoration: none;
  display: inline-block;
}

.linkWhite:hover{
  opacity: .9;
  text-decoration: underline;
}
/* =========================================================
   MAINTENANCE - TOKEN CHECK STATUS
   ========================================================= */

#maintenance-token-status{
  transition:
    background .25s ease,
    border-color .25s ease,
    color .25s ease;
}

/* VERIFICA IN CORSO */

#maintenance-token-status.warn{
  background: rgba(245, 158, 11, .10);
  border-color: rgba(245, 158, 11, .42);
  color: #fbbf24;
}

.maintenance-loading{
  display: flex;
  align-items: center;
  gap: 10px;
}

.maintenance-spinner{
  width: 16px;
  height: 16px;
  flex: 0 0 16px;

  border: 2px solid rgba(251, 191, 36, .28);
  border-top-color: currentColor;
  border-radius: 50%;

  animation: maintenance-spin .75s linear infinite;
}

@keyframes maintenance-spin{
  to{
    transform: rotate(360deg);
  }
}

/* TOKEN TROVATO */

#maintenance-token-status.ok{
  background: rgba(34, 197, 94, .10);
  border-color: rgba(34, 197, 94, .42);
  color: #86efac;
}

.maintenance-token-ok{
  display: flex;
  align-items: center;
  gap: 8px;
}

.maintenance-check{
  font-size: 18px;
  font-weight: 900;
}

.maintenance-token-detail{
  margin-top: 5px;
  opacity: .86;
  font-size: .88rem;
}

/* TOKEN NON TROVATO */

#maintenance-token-status.err{
  background: rgba(239, 68, 68, .10);
  border-color: rgba(239, 68, 68, .42);
  color: #fca5a5;
}

.maintenance-token-error{
  display: flex;
  align-items: center;
  gap: 8px;
}

/* =========================================================
   MAINTENANCE - REGISTRAZIONE POLYGON
   ========================================================= */

#notar-file-status{
  transition:
    background .25s ease,
    border-color .25s ease,
    color .25s ease;
}

/* IN CORSO - GIALLO */
#notar-file-status.warn{
  background: rgba(245, 158, 11, .10);
  border-color: rgba(245, 158, 11, .42);
  color: #fbbf24;
}

/* CONFERMATO - VERDE */
#notar-file-status.ok{
  background: rgba(34, 197, 94, .10);
  border-color: rgba(34, 197, 94, .42);
  color: #86efac;
}

/* ERRORE - ROSSO */
#notar-file-status.err{
  background: rgba(239, 68, 68, .10);
  border-color: rgba(239, 68, 68, .42);
  color: #fca5a5;
}