/* sergeantslabs dev theme — bundled, do not edit here */

/* ==== dev.css ==== */
/* =============================================================================
   The dev button and its gate. These two rules are the only thing in this
   project that is NOT scoped to [data-theme="dev"] — the button has to be
   visible from the other three themes in order to be pressed.
   ============================================================================= */

#theme-picker #dev-btn { position: relative; }
#theme-picker #dev-btn::after {
  content: ""; position: absolute; top: 2px; right: 2px;
  width: 4px; height: 4px; background: #ff4a30; border-radius: 50%;
}
#theme-picker #dev-btn[aria-pressed="true"]::after { background: #6bf08a; }

.dev-gate {
  position: fixed; inset: 0; z-index: 1000; display: flex;
  align-items: flex-start; justify-content: center; overflow-y: auto;
  padding: 12vh 14px 6vh; background: rgba(4, 3, 10, .8);
  font-family: Verdana, Tahoma, sans-serif;
}
.dev-box {
  width: min(360px, 94vw); background: #14112a;
  border: 1px solid #000; outline: 1px solid #4a3f8a; outline-offset: -3px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .7); padding: 0 0 16px;
}
.dev-hd {
  background: linear-gradient(180deg, #3a2a72, #201646);
  color: #fff; font: bold 11px Verdana, sans-serif; letter-spacing: 4px;
  padding: 9px 14px; border-bottom: 1px solid #000; text-transform: uppercase;
}
.dev-p { font-size: 11px; line-height: 1.7; color: #8b83bb; padding: 14px 16px 10px; }
.dev-box input {
  display: block; width: calc(100% - 32px); margin: 0 16px;
  font: 13px Verdana, sans-serif; padding: 9px 10px;
  background: #05040c; color: #fff;
  border: 1px solid; border-color: #000 #4a3f8a #4a3f8a #000;
}
.dev-box input:focus { outline: 1px solid #ffd23f; outline-offset: -1px; }
.dev-acts { display: flex; gap: 6px; padding: 12px 16px 0; }
.dev-go, .dev-no {
  cursor: pointer; font: bold 11px Verdana, sans-serif; padding: 9px 16px;
  border: 2px solid; border-color: #7a6bb3 #000 #000 #7a6bb3;
}
.dev-go { background: #ff4a30; color: #fff; flex: 1; }
.dev-go:hover { background: #ffd23f; color: #14112a; }
.dev-no { background: #221c46; color: #8b83bb; }
.dev-no:hover { color: #fff; }
.dev-err { min-height: 14px; padding: 8px 16px 0; font: 11px Verdana, sans-serif; color: #ff6fae; }