/* Leak Test Shared Styles */
.test-card{
text-align:center;
padding:32px var(--gap);
margin:var(--gap) 0;
border-radius:var(--br1);
border:var(--bt2) solid var(--bd2);
background:var(--crd);
}
.test-status{
display:flex;
align-items:center;
justify-content:center;
gap:12px;
font-size:1.4rem;
font-weight:600;
color:var(--tx1);
}
.status-icon{
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
font-size:1.5rem;
}
.status-icon.pending{color:var(--tx2);}
.status-icon.running{color:var(--cl1);animation:lt-pulse 1.5s ease-in-out infinite;}
.status-icon.pass{color:var(--cl1);}
.status-icon.fail{color:var(--err);}
@keyframes lt-pulse{
0%,100%{opacity:1;}
50%{opacity:0.3;}
}
.test-btn{
font-family:'Dosis',sans-serif;
font-size:1.2rem;
font-weight:600;
padding:14px 36px;
border-radius:8px;
border:var(--bt2) solid var(--cl1);
background:transparent;
cursor:pointer;
touch-action:manipulation;
color:var(--cl1);
letter-spacing:0.5px;
transition:background .15s ease,transform .1s ease;
}
.test-btn:active{transform:scale(0.97);}
.test-btn:disabled{opacity:0.4;cursor:default;transform:none;}
@media(hover:hover){
.test-btn:hover:not(:disabled){background:var(--crd);}
}
.test-progress{
display:none;
margin-top:20px;
}
.test-progress.active{display:block;}
.progress-bar{
height:4px;
border-radius:2px;
background:var(--bg2);
overflow:hidden;
margin-bottom:10px;
}
.progress-fill{
height:100%;
width:0%;
border-radius:2px;
background:var(--cl1);
transition:width .3s ease;
}
.progress-label{
font-size:var(--fz1);
color:var(--tx2);
}
.test-results{margin-top:var(--gap);}
.result-row{
display:flex;
align-items:baseline;
gap:12px;
font-size:1.25rem;
padding:6px 8px;
margin:0 -8px;
border-radius:6px;
transition:background .15s ease;
}
.result-row:hover{background:rgba(0,0,0,.15);}
.result-label{
color:var(--tx2);
font-weight:500;
min-width:110px;
text-align:right;
flex-shrink:0;
font-size:1rem;
text-transform:uppercase;
letter-spacing:0.8px;
}
.result-value{
color:var(--cl1);
font-weight:500;
overflow-wrap:break-word;
word-break:normal;
font-family:'Dosis',sans-serif;
font-size:1.15rem;
}
.result-value.muted{color:var(--tx2);}
.test-verdict{
text-align:center;
padding:24px var(--gap);
margin:var(--gap) 0;
border-radius:var(--br1);
font-size:1.5rem;
font-weight:700;
letter-spacing:0.5px;
}
.test-verdict.pass{
border:var(--bt2) solid var(--cl1);
color:var(--cl1);
background:var(--crd);
}
.test-verdict.fail{
border:var(--bt2) solid var(--err);
color:var(--err);
background:rgba(255,68,68,0.08);
}
.test-verdict.neutral{
border:var(--bt2) solid var(--tx2);
color:var(--tx2);
background:var(--crd);
}
.ip-badge{
display:inline-block;
padding:2px 10px;
border-radius:4px;
font-size:0.85rem;
font-weight:600;
text-transform:uppercase;
letter-spacing:0.5px;
vertical-align:middle;
margin-left:8px;
}
.ip-badge.safe{background:var(--crd);color:var(--cl1);border:1px solid var(--cl1);}
.ip-badge.leak{background:rgba(255,68,68,0.12);color:var(--err);border:1px solid var(--err);}
.ip-badge.private{color:var(--tx2);background:transparent;border:1px solid var(--tx2);}
.ip-badge.muted{color:var(--tx2);background:transparent;border:1px solid var(--tx2);}
.server-card{
border-radius:var(--br1);
padding:var(--gap);
margin-bottom:12px;
border:var(--bt2) solid var(--bd2);
background:var(--crd);
}
.server-card.mismatch{
border-color:var(--err);
background:rgba(255,68,68,0.05);
}
.server-card .server-header{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:8px;
}
.server-card .server-ip{
font-family:'Dosis',sans-serif;
font-size:1.3rem;
font-weight:600;
color:var(--cl1);
}
.server-card.mismatch .server-ip{color:var(--err);}
.server-card .server-detail{
font-size:1rem;
color:var(--tx2);
line-height:1.6;
}
.test-rerun{
display:inline-block;
margin-top:12px;
font-size:1rem;
font-weight:500;
color:var(--cl1);
cursor:pointer;
background:none;
border:none;
font-family:inherit;
letter-spacing:0.3px;
}
.test-rerun:hover{text-decoration:underline;}
@media(max-width:600px){
.test-card{padding:24px 16px;}
.result-row{flex-direction:column;gap:2px;}
.result-label{text-align:left;min-width:auto;}
.test-verdict{font-size:1.2rem;padding:20px 16px;}
.server-card .server-header{flex-direction:column;align-items:flex-start;gap:6px;}
.ip-badge{margin-left:0;}
}