/* =====================================================
   File: update.css
   Stili specifici della sezione Update
   ===================================================== */


/* =====================================================
   ASPETTO GENERALE DELLA SEZIONE UPDATE
   ===================================================== */

#update-token{
  --accent:#fbbf24;
}

.update-card-title{
  color:#fbbf24;
  font-size:22px;
  letter-spacing:.4px;
}

/* =====================================================
   PULSANTI UPDATE
   ===================================================== */

.btn-upd-yellow{
  color:#fbbf24 !important;
  border-color:rgba(251,191,36,.55) !important;
}

.btn-upd-yellow:hover{
  box-shadow:0 0 0 3px rgba(251,191,36,.10);
}

#upd-clear-media{
  margin-top:12px;
  margin-bottom:12px;
}

/* Hover, focus e active dei pulsanti principali */

#btn-upd-generate-json:hover,
#btn-upd-generate-json:focus,
#btn-upd-generate-json:active,
#btn-upd-upload:hover,
#btn-upd-upload:focus,
#btn-upd-upload:active,
#btn-upd-onchain:hover,
#btn-upd-onchain:focus,
#btn-upd-onchain:active,
#btn-upd-open-token:hover,
#btn-upd-open-token:focus,
#btn-upd-open-token:active,
#btn-upd-verifica:hover,
#btn-upd-verifica:focus,
#btn-upd-verifica:active,
.btn-upd-yellow:hover,
.btn-upd-yellow:focus,
.btn-upd-yellow:active{
  color:#fbbf24 !important;
  border-color:rgba(251,191,36,.55) !important;
  box-shadow:0 0 0 3px rgba(251,191,36,.10) !important;
}


/* Hover, focus e active dei pulsanti secondari */

#btn-upd-download-json:hover,
#btn-upd-download-json:focus,
#btn-upd-download-json:active,
#btn-upd-download-cidgate:hover,
#btn-upd-download-cidgate:focus,
#btn-upd-download-cidgate:active,
.upd-hover-yellow:hover,
.upd-hover-yellow:focus,
.upd-hover-yellow:active{
  color:#fbbf24 !important;
  border-color:rgba(251,191,36,.55) !important;
  box-shadow:0 0 0 3px rgba(251,191,36,.10) !important;
}


/* =====================================================
   REPORT SOTTO I PULSANTI
   ===================================================== */

.upd-btn-report{
  display:block;
  width:100%;
  min-height:16px;
  margin-top:6px;
  font-size:12px;
  line-height:1.25;
  opacity:.95;
}

.upd-btn-report.ok{
  color:#2ee58f;
}

.upd-btn-report.warn{
  color:#fbbf24;
}

.upd-btn-report.err{
  color:#ef4444;
}


/* =====================================================
   WORKFLOW UPDATE — GENERALE
   PC + TABLET + MOBILE
   ===================================================== */

.button-row.upd-actions-row{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  margin-top:10px;
  gap:22px;
}

.button-row.upd-actions-row > .upd-btn-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  gap:0;
}

.button-row.upd-actions-row .btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:42px;
  margin:0 auto;
  padding:9px 16px;
  font-size:12px;
  text-align:center;
  white-space:normal;
}

#upd-reset{
  background:rgba(9,9,11,.96);
  color:var(--muted);
  border-color:rgba(148,163,253,.22);
}

#btn-upd-generate-json,
#btn-upd-upload,
#btn-upd-onchain,
#btn-upd-verifica{
  width:100%;
  background:rgba(9,9,11,.96);
  color:#fbbf24 !important;
  border-color:rgba(251,191,36,.65) !important;
}

.button-row.upd-actions-row > .upd-btn-wrap:last-child{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
}

#btn-upd-verifica{
  position:relative;
  margin-top:22px;
}

#btn-upd-verifica::before{
  content:"";
  position:absolute;
  top:-12px;
  left:8%;
  right:8%;
  height:1px;
  background:rgba(148,163,184,.28);
}

.button-row.upd-actions-row .upd-btn-report{
  width:100%;
  min-height:0;
  margin:0;
  padding:0 8px;
  font-size:13px;
  line-height:1.4;
  text-align:center;
  overflow-wrap:anywhere;
}

.button-row.upd-actions-row .upd-btn-report:empty{
  display:none;
}

.button-row.upd-actions-row .upd-btn-report:not(:empty){
  display:block;
  margin-top:8px;
}

.button-row.upd-actions-row .btn-step-badge{
  width:17px;
  height:17px;
  flex:0 0 17px;
  margin-right:3px;
  font-size:10px;
}

/* =====================================================
   WORKFLOW UPDATE — MOBILE
   ===================================================== */

@media (max-width:900px){

  /* Separatore tra Reset e Genera JSON */

  .button-row.upd-actions-row > .upd-btn-wrap:nth-child(2){
    position:relative;
  }

  .button-row.upd-actions-row > .upd-btn-wrap:nth-child(2)::before{
    content:"";
    position:absolute;
    top:-11px;
    left:10%;
    right:10%;
    height:1px;
    background:rgba(148,163,184,.28);
  }
}