@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700&family=Orbitron:wght@400;700;900&family=Whisper&display=swap');



html, body{font-family:var(--font-sans);color: var(--text-main);margin: 0;}

* input, * select{
  font-family:var(--font-sans)
}

.mca_card{background:var(--color-card);border:1px solid var(--color-border);background: var(--color-card);border: 1px solid var(--color-border);border-radius: 26px;padding: 20px;box-shadow: 0 4px 20px rgba(0, 0, 0, .06);margin-top:12px}
.mca_output-card{background:var(--color-card);border:1px solid var(--color-border);}

.mca_btn{display:inline-block;margin-top:6px;font-size: 14px;background:var(--color-card);color:var(--color-text);border:none;border-radius:60px;padding: 8px 18px;text-decoration:none;cursor:pointer;font-weight: 600;border:1px solid var(--color-border);outline:none;margin-top: 0;}
.mca_btn.mca_secondary{background:#f3f4f6;color:var(--color-text);}
.mca_btn_submit{
    border: solid 1px var(--color-accent);
    color: var(--color-accent);
}

.mca_vault-ico{display:inline-flex;align-items:center;justify-content:center;width: 10px;height: 10px;border-radius:50%;font-size:16px;border: 0px solid var(--color-border);}
.mca_vault-red{background:var(--danger-bg);color:var(--danger-text);border-color:var(--danger-border);animation: fade 1s ease infinite alternate;}
.mca_vault-green{background:var(--success-bg);color:var(--success-text);border-color:var(--success-border)}
.mca_vault-install-link{color:#3b82f6;text-decoration:none;}
.mca_vault-help{margin-top: 15px;font-size:12px;color:var(--color-muted)}
.mca_vc-actions{display:flex;gap:8px;flex-wrap:wrap}
.mca_vc-state{display:flex;align-items:center;gap:8px;margin-bottom: 15px;}

.text-sec{color:var(--color-secondary);margin-top: 0;}
.text-muted{color:var(--color-muted)}
.text-sm{font-size:12px}
.text-xs{font-size:13px}
.text-right{text-align:right}

.flex{display:flex}
.items-center{align-items:center}
.justify-between{justify-content:space-between}
.gap-8{gap:8px}
.mt-8{margin-top:8px}
.mt-12{margin-top:12px}
.ml-8{margin-left:8px}
.hidden{display:none}

.janus-loader{position:fixed;inset:0;background: var(--bg-dark);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:9999;opacity:1;transition:opacity .5s ease}
.janus-loader.hidden{opacity:0;pointer-events:none;visibility:hidden;transition:opacity .5s ease, visibility 0s linear .5s;display:flex}
.janus-logo{font-family: 'Orbitron', monospace;font-size:32px;letter-spacing:8px;color: var(--accent);font-weight: 900;width: 100%;text-align: center;}
.janus-sub{font-family: 'Orbitron', monospace;font-size:16px;letter-spacing:4px;color: var(--accent);margin-top:8px;width: 100%;text-align: center;}
#janus_widget_mount{display:block}
#vault_modal.mca_modal-overlay{z-index:1001}
#mca_modal.mca_modal-overlay{z-index:1000}
#vault_success.mca_modal-overlay{z-index:1002}

.janus-toast{position:relative;background:var(--color-card);color:var(--color-text);border:1px solid var(--color-border);box-shadow:0 4px 20px rgba(0,0,0,.06);padding:10px 14px;border-radius: 26px;margin-top:10px;opacity:1;transition:opacity .3s ease, transform .3s ease;transform:translateY(0);font-size: 12px;cursor: default;pointer-events: none;animation: fadeIn .3s ease;}
.janus-toast.hide{opacity:0;transform:translateY(6px)}
.janus-toast.error{border-color: var(--color-border);color:var(--danger-text)}
.janus-toast.success{border-color:var(--success-border);color:var(--success-text)}
#janus_toast_root{position:fixed;right:20px;bottom:20px;z-index:1100;display:flex;flex-direction:column;align-items:flex-end}

@keyframes fade{
  0%{opacity:0}
  100%{opacity:1}
}
/* Evidenziazione riga nuova */
.row-new{background: var(--color-bg);}
.row-flash{animation: fade 2s ease-in-out 1;}

@keyframes vanish{0%{opacity:1}100%{opacity:0;transform:translateY(-4px)}}
.row-delete{animation: vanish .6s ease forwards}




mc-ico-parallel:after {
    content: '';
    position: absolute;
    padding: 0px 10px;
    border: solid 2px var(--button-color);
    margin-left: -13px;
    border: solid 1px transparent;
    margin-top: -8px;
    transition: all ease 0.33s;
    transform: rotate(150deg);
    height: 3px;
    background-color: var(--accent-dim-2);
    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    border-bottom: none;
    /* background-color: #212121; */
    transition: all ease 0.33s;
    box-shadow: 0px 0px 0px var(--white);
}

mc-ico-parallel:before {
    content: '';
    border-color: transparent;
    margin-top: 3px;
    margin-left: 14px;
    padding: 0;
    background-color: var(--accent);
    width: 6px;
    height: 6px;
    margin-top: 1px;
    margin-right: 3px;
    float: left;
    border-radius: 100%;
    transition: all ease 0.4s;
}

mc-ico {
    display: block;
    float: right;
    width: auto;
    padding-top: 10px;
    padding-right: 10px;
    margin-top: 25px;
    margin-left: 25px;
    transform: scale(0.7) translate(10px, -3px);
    transition: all ease 0.33s;
    position: relative;
    margin: 0 auto;
    float: left;
    /* width: 100%; */
    top: unset;
    opacity: 1;
    padding: 25px 15px;
    z-index: 100;
    padding-left: 0;
    transform: scale(0.7) translate(0px, 10px);
    margin-top: calc(var(--small-spacing) / 1.3);
    margin-top: 0;
    margin-bottom: 0;
    will-change: transform;
}

mc-ico.active {
    opacity: 1;
    width: 33px;
    transform: scale(1.5);
    top: calc(50vh - 167px);
}

mc-ico.active.check:before,
mc-ico.active.check:after,
mc-ico.active.check mc-ico-parallel:before,
mc-ico.active.check mc-ico-parallel:after {
    background-color: var(--green);
    opacity: 0;
}

mc-ico[back_mode] mc-ico-parallel:after {
    margin-top: -17px;
    padding: 0 16px;
    margin-left: -24px;
    height: 3px;
}

mc-ico[back_mode] mc-ico-parallel:before {
    display: none;
}

mc-ico[back_mode] mc-ico-parallel {
    float: left;
}

mc-ico[back_mode]:before {
    display: none;
}

mc-ico[back_mode]:after {
    margin-top: 4px;
    height: 4px;
    margin-left: -24px;
}

mc-ico:after {
    content: '';
    position: absolute;
    padding: 0px 16px;
    border: solid 2px var(--button-color);
    margin-left: -47px;
    border: solid 0px var(--bg-color);
    margin-top: -13px;
    transition: all ease 0.33s;
    transform: rotate(38deg) translate(0, 0);
    height: 5px;
    background-color: var(--accent-dim-2);
    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    border-top: none;
    /* background-color: #212121; */
    border-bottom: none;
    animation-iteration-count: 3;
}

mc-ico:before {
    content: ' ';
    line-height: 50px;
    border-color: transparent;
    margin-top: 3px;
    padding: 0;
    background-color: var(--net-blue-color);
    width: 10px;
    height: 10px;
    margin-top: 0px;
    float: left;
    border-radius: 100%;
    background-color: var(--accent);
    margin-right: -4px;
    transition: all ease 0.33s;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 2px;
    color: var(--net-color-1);
    animation: net-eye 3s 0.1s ease-in-out 1;
    /* box-shadow: 0px 3px 19px var(--net-color-4); */
}


 @keyframes net-eye { 
     0% { 
         box-shadow: 0px 3px 19px var(--net-color-4); 
     } 
     50% { 
         box-shadow: 0px 3px 0px var(--net-color-4); 
     } 
     100% { 
         box-shadow: 0px 3px 19px var(--net-color-4); 
     } 
 }

 @keyframes fadeIn {
   from {
    opacity:0
   }
   top {
    opacity:1
   }
}