/* =========================================================
   ADMIN AUDIT — MANUAL RUNTIME CONTROL
========================================================= */

.audit-runtime-section {

  position:
    relative;

  overflow:
    hidden;

  margin:
    6px 0 20px;

  border:
    1px solid
    rgba(
      99,
      151,
      255,
      0.24
    );

  border-left:
    4px solid
    rgba(
      77,
      141,
      255,
      0.82
    );

  border-radius:
    18px;

  background:
    linear-gradient(
      145deg,
      rgba(
        24,
        42,
        68,
        0.96
      ),
      rgba(
        12,
        28,
        49,
        0.98
      )
    );

  box-shadow:
    0 14px 34px
    rgba(
      0,
      0,
      0,
      0.16
    );

}

.audit-runtime-section::before {

  content:
    "";

  position:
    absolute;

  top:
    -140px;

  right:
    -90px;

  width:
    280px;

  height:
    280px;

  border-radius:
    999px;

  background:
    radial-gradient(
      circle,
      rgba(
        77,
        141,
        255,
        0.18
      ),
      transparent 68%
    );

  pointer-events:
    none;

}

.audit-runtime-section summary::-webkit-details-marker {

  display:
    none;

}

.audit-runtime-section-summary {

  position:
    relative;

  z-index:
    1;

  display:
    grid;

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

  align-items:
    center;

  gap:
    14px;

  min-height:
    76px;

  padding:
    16px 18px;

  cursor:
    pointer;

  list-style:
    none;

}

.audit-runtime-section-summary:hover {

  background:
    rgba(
      77,
      141,
      255,
      0.055
    );

}

.audit-runtime-step-number {

  display:
    grid;

  place-items:
    center;

  width:
    38px;

  height:
    38px;

  border:
    1px solid
    rgba(
      99,
      151,
      255,
      0.40
    );

  border-radius:
    13px;

  background:
    rgba(
      77,
      141,
      255,
      0.16
    );

  color:
    #d8e4ff;

  font-size:
    11px;

  font-weight:
    900;

  box-shadow:
    0 0 26px
    rgba(
      77,
      141,
      255,
      0.14
    );

}

.audit-runtime-section-copy {

  min-width:
    0;

}

.audit-runtime-section-copy strong {

  display:
    block;

  overflow:
    hidden;

  color:
    #ffffff;

  font-size:
    15px;

  font-weight:
    880;

  letter-spacing:
    -0.015em;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;

}

.audit-runtime-section-copy small {

  display:
    block;

  overflow:
    hidden;

  margin-top:
    5px;

  color:
    rgba(
      195,
      210,
      232,
      0.72
    );

  font-size:
    11px;

  line-height:
    1.45;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;

}

.audit-runtime-section-summary em {

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  min-height:
    28px;

  padding:
    6px 11px;

  border:
    1px solid
    rgba(
      148,
      176,
      213,
      0.20
    );

  border-radius:
    999px;

  background:
    rgba(
      255,
      255,
      255,
      0.045
    );

  color:
    rgba(
      184,
      204,
      236,
      0.76
    );

  font-size:
    9px;

  font-style:
    normal;

  font-weight:
    900;

  line-height:
    1;

  white-space:
    nowrap;

}

.audit-runtime-section-summary em.is-ready {

  border-color:
    rgba(
      79,
      211,
      155,
      0.34
    );

  background:
    rgba(
      79,
      211,
      155,
      0.11
    );

  color:
    #baf4d8;

}

.audit-runtime-section-summary em.is-locked {

  border-color:
    rgba(
      240,
      107,
      120,
      0.24
    );

  background:
    rgba(
      240,
      107,
      120,
      0.075
    );

  color:
    #ffc4ca;

}

.audit-runtime-section-body {

  position:
    relative;

  z-index:
    1;

  display:
    flex;

  flex-direction:
    column;

  gap:
    12px;

  padding:
    0 16px 16px;

}

.audit-runtime-status-grid {

  display:
    grid;

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

  gap:
    10px;

}

.audit-runtime-status-pill {

  min-width:
    0;

  min-height:
    86px;

  padding:
    13px 14px;

  border:
    1px solid
    rgba(
      148,
      176,
      213,
      0.14
    );

  border-radius:
    14px;

  background:
    rgba(
      255,
      255,
      255,
      0.030
    );

}

.audit-runtime-status-pill span {

  display:
    block;

  overflow:
    hidden;

  color:
    rgba(
      176,
      194,
      221,
      0.70
    );

  font-size:
    9px;

  font-weight:
    850;

  letter-spacing:
    0.045em;

  text-overflow:
    ellipsis;

  text-transform:
    uppercase;

  white-space:
    nowrap;

}

.audit-runtime-status-pill strong {

  display:
    block;

  margin-top:
    8px;

  color:
    #ffffff;

  font-size:
    18px;

  font-weight:
    920;

  letter-spacing:
    -0.025em;

  line-height:
    1;

}

.audit-runtime-status-pill small {

  display:
    block;

  overflow:
    hidden;

  margin-top:
    8px;

  color:
    rgba(
      176,
      194,
      221,
      0.62
    );

  font-size:
    10px;

  line-height:
    1.35;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;

}

.audit-runtime-status-pill.is-safe {

  border-color:
    rgba(
      79,
      211,
      155,
      0.24
    );

  background:
    linear-gradient(
      145deg,
      rgba(
        79,
        211,
        155,
        0.09
      ),
      rgba(
        255,
        255,
        255,
        0.024
      )
    );

}

.audit-runtime-status-pill.is-safe strong {

  color:
    #baf4d8;

}

.audit-runtime-status-pill.is-locked {

  border-color:
    rgba(
      148,
      176,
      213,
      0.12
    );

  background:
    rgba(
      255,
      255,
      255,
      0.024
    );

}

.audit-runtime-status-pill.is-locked strong {

  color:
    rgba(
      196,
      213,
      238,
      0.78
    );

}

.audit-runtime-command-bar {

  display:
    grid;

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

  align-items:
    stretch;

  gap:
    14px;

  min-width:
    0;

  padding:
    15px;

  border:
    1px solid
    rgba(
      77,
      141,
      255,
      0.18
    );

  border-radius:
    15px;

  background:
    linear-gradient(
      145deg,
      rgba(
        77,
        141,
        255,
        0.085
      ),
      rgba(
        6,
        20,
        38,
        0.28
      )
    );

}

.audit-runtime-command-bar > div:first-child {

  min-width:
    0;

}

.audit-runtime-command-bar strong {

  display:
    block;

  color:
    #ffffff;

  font-size:
    12px;

  font-weight:
    860;

  line-height:
    1.35;

}

.audit-runtime-command-bar span {

  display:
    block;

  max-width:
    100%;

  margin-top:
    5px;

  color:
    rgba(
      176,
      194,
      221,
      0.72
    );

  font-size:
    10px;

  line-height:
    1.5;

  overflow-wrap:
    normal;

  word-break:
    normal;

}

.audit-runtime-command-actions {

  display:
    grid;

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

  align-items:
    stretch;

  gap:
    9px;

  width:
    100%;

  min-width:
    0;

}

.audit-runtime-command-actions .btn {

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    100%;

  min-width:
    0;

  min-height:
    42px;

  padding:
    9px 10px;

  border-radius:
    11px;

  font-size:
    10px;

  font-weight:
    850;

  line-height:
    1.2;

  text-align:
    center;

  white-space:
    nowrap;

  transition:
    transform 0.16s ease,
    border-color 0.16s ease,
    background 0.16s ease,
    box-shadow 0.16s ease,
    opacity 0.16s ease;

}

.audit-runtime-command-actions .btn:not(:disabled):hover {

  transform:
    translateY(
      -1px
    );

}

#manualRuntimePrepareBtn {

  border-color:
    rgba(
      148,
      176,
      213,
      0.28
    );

  background:
    rgba(
      255,
      255,
      255,
      0.065
    );

  color:
    #e2ebfb;

}

#manualRuntimePrepareBtn:not(:disabled):hover {

  border-color:
    rgba(
      148,
      176,
      213,
      0.48
    );

  background:
    rgba(
      255,
      255,
      255,
      0.10
    );

}

#manualRuntimeRunBtn,
#controlledAutoRunBtn {

  border-color:
    rgba(
      82,
      146,
      255,
      0.52
    );

  background:
    linear-gradient(
      135deg,
      rgba(
        70,
        129,
        255,
        0.94
      ),
      rgba(
        49,
        99,
        219,
        0.94
      )
    );

  color:
    #ffffff;

  box-shadow:
    0 8px 20px
    rgba(
      40,
      91,
      214,
      0.22
    );

}

#manualRuntimeRunBtn:not(:disabled):hover,
#controlledAutoRunBtn:not(:disabled):hover {

  border-color:
    rgba(
      118,
      171,
      255,
      0.76
    );

  box-shadow:
    0 10px 26px
    rgba(
      40,
      91,
      214,
      0.30
    );

}

#controlledAutoArmBtn {

  border-color:
    rgba(
      239,
      184,
      88,
      0.42
    );

  background:
    linear-gradient(
      135deg,
      rgba(
        169,
        111,
        33,
        0.64
      ),
      rgba(
        116,
        75,
        25,
        0.64
      )
    );

  color:
    #ffe7b1;

}

#controlledAutoArmBtn:not(:disabled):hover {

  border-color:
    rgba(
      249,
      200,
      111,
      0.68
    );

  background:
    linear-gradient(
      135deg,
      rgba(
        190,
        127,
        38,
        0.76
      ),
      rgba(
        134,
        85,
        27,
        0.76
      )
    );

}

#manualRuntimeStopBtn,
#controlledAutoKillBtn {

  border-color:
    rgba(
      240,
      107,
      120,
      0.40
    );

  background:
    linear-gradient(
      135deg,
      rgba(
        164,
        58,
        72,
        0.72
      ),
      rgba(
        111,
        37,
        50,
        0.72
      )
    );

  color:
    #ffd0d5;

}

#manualRuntimeStopBtn:not(:disabled):hover,
#controlledAutoKillBtn:not(:disabled):hover {

  border-color:
    rgba(
      255,
      132,
      145,
      0.68
    );

  background:
    linear-gradient(
      135deg,
      rgba(
        187,
        66,
        82,
        0.84
      ),
      rgba(
        130,
        42,
        56,
        0.84
      )
    );

}

.audit-runtime-command-actions .btn:disabled,
.audit-runtime-prepare-btn:disabled,
.audit-runtime-run-btn:disabled,
.audit-runtime-stop-btn:disabled {

  opacity:
    0.38;

  cursor:
    not-allowed;

  transform:
    none;

  box-shadow:
    none;

  filter:
    saturate(
      0.55
    );

}

#controlledAutoRuntimeSection {

  border-left-color:
    rgba(
      124,
      100,
      255,
      0.82
    );

}

#controlledAutoRuntimeSection::before {

  background:
    radial-gradient(
      circle,
      rgba(
        124,
        100,
        255,
        0.20
      ),
      transparent 68%
    );

}

#controlledAutoRuntimeSection
.audit-runtime-step-number {

  border-color:
    rgba(
      124,
      100,
      255,
      0.42
    );

  background:
    rgba(
      124,
      100,
      255,
      0.16
    );

  color:
    #e0dcff;

}

@media (
  max-width:
  1100px
) {

  .audit-runtime-section-body {

    padding:
      0 14px 14px;

  }

  .audit-runtime-status-grid {

    grid-template-columns:
      1fr;

  }

  .audit-runtime-command-actions {

    grid-template-columns:
      1fr;

  }

}

@media (
  max-width:
  720px
) {

  .audit-runtime-section-summary {

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

  }

  .audit-runtime-section-summary em {

    grid-column:
      1 / -1;

    justify-self:
      flex-start;

  }

  .audit-runtime-section-copy strong,
  .audit-runtime-section-copy small {

    white-space:
      normal;

  }

  .audit-runtime-command-actions {

    grid-template-columns:
      1fr;

  }

  .audit-runtime-command-actions .btn {

    width:
      100%;

  }

}