/* IDFW SERVICE CENTER V1 */

.idfw-service-open{
  border:
    1px solid rgba(88,221,181,.18) !important;

  background:
    rgba(88,221,181,.055) !important;

  color:#65dfb9 !important;
}


body.idfw-center-open{
  overflow:hidden;
}


.idfw-service-center{
  position:fixed;

  inset:0;

  z-index:300;
}


.idfw-service-center.hidden{
  display:none;
}


.idfw-service-center-backdrop{
  position:absolute;

  inset:0;

  background:
    rgba(0,0,0,.74);

  backdrop-filter:blur(7px);
}


.idfw-service-center-sheet{
  position:absolute;

  left:50%;
  top:50%;

  width:min(900px,calc(100vw - 30px));

  max-height:
    calc(100vh - 40px);

  overflow:auto;

  transform:
    translate(-50%,-50%);

  border-radius:24px;

  border:
    1px solid rgba(92,180,205,.16);

  background:
    linear-gradient(
      150deg,
      #091b2a,
      #05111d
    );

  box-shadow:
    0 30px 100px rgba(0,0,0,.50);
}


.idfw-center-grab{
  display:none;
}


.idfw-center-header{
  position:sticky;

  top:0;

  z-index:4;

  display:flex;

  justify-content:space-between;

  align-items:flex-start;

  padding:21px 22px;

  border-bottom:
    1px solid rgba(255,255,255,.055);

  background:
    rgba(7,21,33,.95);

  backdrop-filter:blur(15px);
}


.idfw-center-kicker,
.idfw-center-section-head span{
  color:#59ddb5;

  font-size:7px;

  font-weight:950;

  letter-spacing:.12em;
}


.idfw-center-header h2{
  margin:5px 0 2px;

  font-size:25px;
}


.idfw-center-header p{
  margin:0;

  color:#718e9d;

  font-size:10px;
}


.idfw-center-close{
  width:38px;
  height:38px;

  border:0;

  border-radius:12px;

  background:
    rgba(255,255,255,.05);

  color:#cbdce3;

  font-size:22px;

  cursor:pointer;
}


.idfw-center-body{
  padding:18px;
}


.idfw-center-loading{
  min-height:260px;

  display:flex;

  align-items:center;

  justify-content:center;

  gap:10px;

  color:#7995a3;
}


.idfw-center-loading>span{
  width:18px;
  height:18px;

  border:
    2px solid rgba(88,221,181,.15);

  border-top-color:#59ddb5;

  border-radius:50%;

  animation:
    idfwCenterSpin .8s linear infinite;
}


@keyframes idfwCenterSpin{
  to{
    transform:rotate(360deg);
  }
}


.idfw-center-summary{
  display:grid;

  grid-template-columns:1fr auto;

  gap:10px;

  margin-bottom:11px;
}


.idfw-center-alias,
.idfw-center-score{
  padding:14px;

  border-radius:14px;

  background:
    rgba(2,13,22,.55);

  border:
    1px solid rgba(255,255,255,.055);
}


.idfw-center-alias>small,
.idfw-center-score>small{
  display:block;

  margin-bottom:6px;

  color:#567585;

  font-size:7px;

  font-weight:900;
}


.idfw-center-alias>div{
  display:flex;

  align-items:center;

  gap:8px;
}


.idfw-center-alias code{
  flex:1;

  min-width:0;

  overflow:hidden;

  color:#65dfb9;

  text-overflow:ellipsis;

  white-space:nowrap;
}


.idfw-center-alias button{
  border:0;

  background:transparent;

  color:#85a0ad;

  cursor:pointer;
}


.idfw-center-score{
  min-width:110px;

  text-align:center;
}


.idfw-center-score b{
  color:#e0edf1;

  font-size:21px;
}


.idfw-center-section{
  margin-top:10px;

  padding:16px;

  border-radius:16px;

  border:
    1px solid rgba(255,255,255,.055);

  background:
    rgba(5,17,27,.48);
}


.idfw-center-section-head{
  display:flex;

  justify-content:space-between;

  gap:12px;

  align-items:center;

  margin-bottom:13px;
}


.idfw-center-section-head h3{
  margin:3px 0 0;

  font-size:16px;
}


.idfw-center-data-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:7px;
}


.idfw-center-data{
  display:flex;

  align-items:center;

  gap:9px;

  padding:9px;

  border-radius:11px;

  background:
    rgba(255,255,255,.025);
}


.idfw-center-data>span{
  width:9px;
  height:9px;

  flex:0 0 9px;

  border-radius:50%;

  background:#647c89;
}


.idfw-center-data>span.protected{
  background:#59ddb5;
}


.idfw-center-data>span.real{
  background:#e79a6c;
}


.idfw-center-data>span.requested{
  background:#e3ba60;
}


.idfw-center-data b,
.idfw-center-data small{
  display:block;
}


.idfw-center-data b{
  font-size:10px;
}


.idfw-center-data small{
  margin-top:2px;

  color:#6d8794;

  font-size:8px;
}


.idfw-center-shields{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:7px;
}


.idfw-center-shields>div{
  display:flex;

  align-items:flex-start;

  gap:9px;

  padding:11px;

  border-radius:12px;

  background:
    rgba(255,255,255,.025);
}


.idfw-center-shields>div>span{
  color:#59ddb5;
}


.idfw-center-shields small,
.idfw-center-shields b,
.idfw-center-shields em{
  display:block;
}


.idfw-center-shields small{
  color:#66828f;

  font-size:7px;
}


.idfw-center-shields b{
  margin-top:3px;

  font-size:10px;
}


.idfw-center-shields em{
  margin-top:3px;

  color:#66818e;

  font-size:7px;

  font-style:normal;
}


.idfw-center-leak{
  margin-top:8px;

  padding:12px;

  border-radius:12px;

  border:
    1px solid rgba(224,116,105,.15);

  background:
    rgba(224,116,105,.045);
}


.idfw-center-leak-head{
  display:flex;

  justify-content:space-between;

  gap:10px;
}


.idfw-center-leak-head span{
  display:block;

  color:#dd8b82;

  font-size:7px;

  font-weight:900;
}


.idfw-center-leak-head b{
  display:block;

  margin-top:3px;
}


.idfw-center-leak-head>small{
  color:#718995;

  font-size:8px;
}


.idfw-center-leak p{
  color:#78919d;

  font-size:9px;
}


.idfw-center-overlap{
  display:flex;

  flex-wrap:wrap;

  align-items:center;

  gap:5px;

  margin-top:10px;
}


.idfw-center-overlap strong{
  width:100%;

  color:#d3a09a;

  font-size:8px;
}


.idfw-center-overlap span{
  padding:4px 7px;

  border-radius:999px;

  background:
    rgba(224,116,105,.09);

  color:#e6aaa4;

  font-size:7px;
}


.idfw-center-caveat{
  display:block;

  margin-top:10px;

  color:#607b88;

  font-size:7px;

  line-height:1.5;
}


.idfw-center-safe{
  display:flex;

  gap:10px;

  padding:13px;

  border-radius:12px;

  background:
    rgba(88,221,181,.04);
}


.idfw-center-safe>span{
  color:#59ddb5;

  font-weight:900;
}


.idfw-center-safe b{
  color:#c7e9df;
}


.idfw-center-safe p{
  margin:3px 0 0;

  color:#718e83;

  font-size:9px;
}


.idfw-center-actions{
  display:flex;

  flex-wrap:wrap;

  gap:8px;
}


.idfw-center-actions
.idfw-center-section-head{
  width:100%;
}


.idfw-center-empty{
  padding:15px;

  color:#718b98;

  text-align:center;

  border-radius:11px;

  background:
    rgba(255,255,255,.02);
}


@media(max-width:650px){

  .idfw-service-center-sheet{
    left:0;
    right:0;
    bottom:0;
    top:auto;

    width:100%;

    max-height:92vh;

    transform:none;

    border-radius:
      24px 24px 0 0;
  }


  .idfw-center-grab{
    display:block;

    width:42px;
    height:4px;

    margin:
      8px auto 0;

    border-radius:10px;

    background:#425965;
  }


  .idfw-center-header{
    padding:
      14px 15px;
  }


  .idfw-center-body{
    padding:
      12px 12px
      calc(
        25px
        + env(safe-area-inset-bottom)
      );
  }


  .idfw-center-summary,
  .idfw-center-data-grid,
  .idfw-center-shields{
    grid-template-columns:1fr;
  }


  .idfw-center-score{
    text-align:left;
  }


  .idfw-center-actions{
    flex-direction:column;
  }


  .idfw-center-actions>button{
    width:100%;
  }

}

/* END IDFW SERVICE CENTER V1 */