/* Pitboard Studio 0.9.1: required display-resolution first step. */

.display-setup-step{
  position:relative;
  z-index:80;
  display:flex;
  align-items:flex-end;
}

.display-setup-step .profile-field{
  position:relative;
  min-width:245px;
  padding:7px 9px 8px;
  border:2px solid #ff9b35;
  border-radius:9px;
  background:linear-gradient(180deg,rgba(255,142,45,.18),rgba(42,24,10,.92));
  box-shadow:0 0 0 3px rgba(255,142,45,.08),0 0 24px rgba(255,133,34,.24);
}

.display-setup-step .profile-field>span{
  color:#ffb45f;
  font-size:10px;
  font-weight:950;
  letter-spacing:.12em;
}

.display-setup-step select{
  min-width:220px;
  border-color:#ff9b35!important;
  background:#0b0e12;
  color:#fff4e6;
  font-weight:850;
}

.display-setup-step.complete select{
  border-color:#49535f!important;
  background:#171b20;
  color:#f2f4f6;
  font-weight:700;
}

.display-setup-step.required .profile-field{
  animation:pbs-resolution-pulse 1.7s ease-in-out infinite;
}

.display-setup-step.complete .profile-field{
  min-width:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.display-setup-step.complete .profile-field>span{
  color:inherit;
}

.display-setup-prompt{
  position:absolute;
  left:0;
  top:calc(100% + 14px);
  width:310px;
  padding:13px 15px;
  border:1px solid #ff9c38;
  border-radius:10px;
  background:#261508;
  color:#ffe1bb;
  box-shadow:0 14px 34px rgba(0,0,0,.5),0 0 22px rgba(255,133,34,.16);
  pointer-events:none;
}

.display-setup-prompt::before{
  content:"";
  position:absolute;
  left:34px;
  top:-8px;
  width:14px;
  height:14px;
  border-left:1px solid #ff9c38;
  border-top:1px solid #ff9c38;
  background:#261508;
  transform:rotate(45deg);
}

.display-setup-prompt strong{
  display:block;
  margin-bottom:3px;
  color:#fff;
  font-size:13px;
}

.display-setup-prompt span{
  display:block;
  color:#e9bf90;
  font-size:11px;
  line-height:1.45;
}

.display-setup-step.complete .display-setup-prompt{
  display:none;
}

.pbs-resolution-locked .workspace,
.pbs-resolution-locked .ds-menu-row,
.pbs-resolution-locked .ds-build-row{
  pointer-events:none;
  user-select:none;
}

.pbs-resolution-locked .workspace,
.pbs-resolution-locked .ds-menu-row,
.pbs-resolution-locked .ds-build-row,
.pbs-resolution-locked .ds-action-row{
  filter:saturate(.35) brightness(.62);
}

.pbs-resolution-locked .ds-action-row button:not(#openProjectButton){
  pointer-events:none;
}

.pbs-resolution-locked #projectName,
.pbs-resolution-locked #previewButton,
.pbs-resolution-locked #toolboxSearch{
  pointer-events:none;
}

.pbs-resolution-locked #exportBuildButton{
  opacity:.42;
}

.resolution-gate-message{
  position:absolute;
  left:50%;
  top:28px;
  z-index:60;
  width:min(460px,calc(100% - 40px));
  transform:translateX(-50%);
  padding:15px 18px;
  border:1px solid #ff9b35;
  border-radius:11px;
  background:rgba(35,20,8,.96);
  box-shadow:0 14px 38px rgba(0,0,0,.52);
  text-align:center;
  pointer-events:none;
}

.resolution-gate-message strong{
  display:block;
  margin-bottom:4px;
  color:#fff;
  font-size:15px;
}

.resolution-gate-message span{
  color:#e1b781;
  font-size:11px;
  line-height:1.45;
}

body:not(.pbs-resolution-locked) .resolution-gate-message{
  display:none;
}

@keyframes pbs-resolution-pulse{
  0%,100%{box-shadow:0 0 0 3px rgba(255,142,45,.08),0 0 22px rgba(255,133,34,.20)}
  50%{box-shadow:0 0 0 5px rgba(255,142,45,.16),0 0 34px rgba(255,133,34,.42)}
}

@media(max-width:1100px){
  .display-setup-prompt{
    width:270px;
  }
}

@media(max-width:760px){
  .display-setup-step{
    width:100%;
  }
  .display-setup-step .profile-field{
    width:100%;
  }
  .display-setup-step select{
    width:100%;
  }
  .display-setup-prompt{
    position:static;
    width:100%;
    margin-top:8px;
  }
  .display-setup-prompt::before{
    display:none;
  }
}


/* Pitboard Studio 0.9.4: mandatory dashboard-name dialog before a new project begins. */
.pbs-name-modal{
  position:fixed;
  inset:0;
  z-index:500;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(5px);
}
.pbs-name-modal[hidden]{display:none}
.pbs-name-dialog{
  width:min(520px,100%);
  padding:28px;
  border:1px solid #4a5562;
  border-radius:16px;
  background:linear-gradient(180deg,#161b22,#0c1015);
  box-shadow:0 28px 80px rgba(0,0,0,.62);
}
.pbs-name-dialog h2{
  margin:7px 0 8px;
  color:#fff;
  font-size:30px;
}
.pbs-name-dialog p{
  margin:0 0 20px;
  color:#9eabb7;
  line-height:1.55;
}
.pbs-name-dialog form{
  display:grid;
  gap:10px;
}
.pbs-name-dialog label{
  color:#aeb9c4;
  font-size:11px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.pbs-name-dialog input{
  min-height:48px;
  padding:10px 12px;
  border:1px solid #52606d;
  border-radius:8px;
  background:#070a0e;
  color:#fff;
  font-size:17px;
}
.pbs-name-dialog input:focus{
  outline:none;
  border-color:#ff963b;
  box-shadow:0 0 0 3px rgba(255,150,59,.14);
}
.pbs-name-dialog button{
  min-height:46px;
  margin-top:4px;
  border:1px solid #ff8c2b;
  border-radius:8px;
  background:linear-gradient(180deg,#ff9238,#bd4e0a);
  color:#fff;
  font-weight:950;
}
.pbs-name-error{
  min-height:18px;
  color:#ff8e8e;
  font-size:12px;
  font-weight:750;
}

body.pbs-modal-open{overflow:hidden!important;overscroll-behavior:none}
body.pbs-modal-open .pbs-app{pointer-events:none}
.pbs-name-modal{
  position:fixed!important;
  left:0!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-width:0!important;
  min-height:0!important;
  overflow:auto!important;
  align-items:center!important;
  justify-items:center!important;
  z-index:2147483000!important;
}
.pbs-name-dialog{
  position:relative!important;
  margin:auto!important;
  max-height:calc(100dvh - 32px)!important;
  overflow:auto!important;
}
