.form-page{
  background:#fff;
  color:#111;
}

.form-intro{
  padding:54px 0 26px;
  border-bottom:1px solid rgba(15,23,42,.10);
}

.form-intro h2{
  font-family:"Roboto",sans-serif;
  font-size:42px;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:1px;
  text-align:center;
  color:#0f172a;
}

.form-intro p{
  width:min(760px,100%);
  margin:14px auto 0;
  text-align:center;
  color:rgba(15,23,42,.72);
  line-height:1.7;
  font-size:14px;
}

.application-section{
  padding:40px 0 90px;
}

.application-form{
  width:min(1000px,100%);
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:34px;
}

.app-card{
  padding:0;
  background:#fff;
}

.app-card h3{
  font-family:"Roboto",sans-serif;
  font-size:14px;
  font-weight:700;
  color:#111827;
  background:var(--accent);
  padding:6px 12px;
  margin-bottom:18px;
}

.app-note{
  color:rgba(15,23,42,.70);
  font-size:14px;
  line-height:1.7;
  margin-bottom:16px;
}

.app-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.full{
  grid-column:1/-1;
}

.floating-field{
  position:relative;
}

.floating-field input,
.floating-field textarea{
  width:100%;
  border:1px solid rgba(15,23,42,.18);
  background:#fff;
  color:#111;
  padding:24px 14px 10px;
  font-size:14px;
  outline:none;
  border-radius:0;
}

.floating-field textarea{
  min-height:140px;
  resize:vertical;
}

.floating-field label{
  position:absolute;
  left:14px;
  top:18px;
  color:rgba(15,23,42,.55);
  font-size:14px;
  pointer-events:none;
  transition:.15s ease;
  background:#fff;
  padding:0 4px;
}

.floating-field input:focus,
.floating-field textarea:focus{
  border-color:rgba(210,173,99,.95);
}

.floating-field input:focus + label,
.floating-field input:not(:placeholder-shown) + label,
.floating-field textarea:focus + label,
.floating-field textarea:not(:placeholder-shown) + label{
  top:-8px;
  left:10px;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:1px;
  color:#0f172a;
}

.upload-field{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.upload-field label{
  font-size:13px;
  font-weight:700;
  color:#0f172a;
}

.upload-field input{
  width:100%;
  border:1px solid rgba(15,23,42,.18);
  background:#fff;
  padding:14px;
  font-size:14px;
}

.uploaded-files-wrap{
  margin-top:18px;
}

.uploaded-files-list{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:8px 18px;
}

.uploaded-file-item{
  display:grid;
  grid-template-columns:18px 1fr auto 20px;
  align-items:center;
  gap:8px;
  min-width:0;
  font-size:12px;
  color:#111827;
}

.uploaded-file-icon{
  color:#1e9bff;
  font-size:14px;
}

.uploaded-file-name{
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.uploaded-file-size{
  font-size:11px;
  color:rgba(15,23,42,.55);
  white-space:nowrap;
}

.uploaded-file-delete{
  border:0;
  background:transparent;
  color:#ef4444;
  font-size:16px;
  font-weight:900;
  cursor:pointer;
  padding:0;
}

.checkbox-grid{
  display:grid;
  grid-template-columns:repeat(4,max-content);
  gap:10px 24px;
}

.checkbox-grid label,
.yes-no-row label{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:13px;
  color:#111827;
  white-space:nowrap;
}

.checkbox-grid input,
.yes-no-row input{
  width:14px;
  height:14px;
  accent-color:var(--accent);
}

.yes-no-row{
  display:flex;
  gap:24px;
}

.prices-area{
  display:none;
  margin-top:16px;
}

.prices-area.open{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.price-input-row{
  display:grid;
  grid-template-columns:1fr 130px;
  gap:10px;
}

.price-input-row input{
  width:100%;
  border:1px solid rgba(15,23,42,.18);
  height:42px;
  padding:0 12px;
  font-size:13px;
  outline:none;
}

.price-input-row button,
#addPriceBtn{
  border:1px solid rgba(15,23,42,.18);
  background:#fff;
  color:#111;
  height:42px;
  padding:0 12px;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.8px;
  cursor:pointer;
}

.hours-two-column{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

.hours-column{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.business-hour-row{
  display:grid;
  grid-template-columns:82px 78px 96px 96px;
  gap:7px;
  align-items:center;
}

.day-name{
  font-size:12px;
  font-weight:700;
  color:#0f172a;
}

.business-hour-row select,
.business-hour-row input{
  width:100%;
  border:1px solid rgba(15,23,42,.18);
  background:#fff;
  height:32px;
  padding:0 7px;
  font-size:12px;
  outline:none;
  border-radius:0;
}

.business-hour-row select:focus,
.business-hour-row input:focus,
.price-input-row input:focus{
  border-color:rgba(210,173,99,.95);
}

.clock-only{
  position:relative;
  color:transparent;
  cursor:pointer;
}

.clock-only::-webkit-datetime-edit,
.clock-only::-webkit-datetime-edit-fields-wrapper{
  color:transparent;
}

.clock-only::-webkit-calendar-picker-indicator{
  opacity:1;
  cursor:pointer;
  width:16px;
  height:16px;
  padding:0;
}

.clock-only.has-time{
  color:#111827;
}

.clock-only.has-time::-webkit-datetime-edit,
.clock-only.has-time::-webkit-datetime-edit-fields-wrapper{
  color:#111827;
}

.application-submit{
  width:100%;
  border:1px solid rgba(15,23,42,.18);
  background:var(--accent);
  color:#111;
  padding:17px;
  font-size:14px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:1.4px;
  cursor:pointer;
}

.application-submit:disabled{
  opacity:.65;
  cursor:not-allowed;
}

.application-status{
  min-height:20px;
  text-align:center;
  font-size:14px;
  color:rgba(15,23,42,.70);
}

@media (max-width:1100px){
  .hours-two-column{
    grid-template-columns:1fr;
  }

  .business-hour-row{
    grid-template-columns:100px 90px 1fr 1fr;
  }

  .uploaded-files-list{
    grid-template-columns:repeat(3,1fr);
  }
}

@media (max-width:980px){
  .checkbox-grid{
    grid-template-columns:repeat(2,max-content);
  }
}

@media (max-width:720px){
  .form-intro h2{
    font-size:32px;
  }

  .app-card h3{
    font-size:13px;
  }

  .app-grid,
  .checkbox-grid,
  .price-input-row{
    grid-template-columns:1fr;
  }

  .uploaded-files-list{
    grid-template-columns:1fr;
  }

  .uploaded-file-item{
    grid-template-columns:18px 1fr auto 20px;
  }

  .hours-two-column{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    align-items:start;
  }

  .hours-column{
    display:flex;
    flex-direction:column;
    gap:12px;
    min-width:0;
  }

  .business-hour-row{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:5px;
    width:100%;
    min-width:0;
  }

  .day-name{
    font-size:12px;
    margin-bottom:1px;
  }

  .business-hour-row select,
  .business-hour-row input[type="time"]{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
    height:30px;
    padding:0 6px;
    font-size:11px;
    display:block;
  }

  .clock-only{
    text-align:center;
    padding:0;
  }

  .clock-only::-webkit-calendar-picker-indicator{
    opacity:1;
    display:block;
    visibility:visible;
    cursor:pointer;
    width:12px;
    height:12px;
    padding:0;
    margin:0 auto;
    transform:scale(.75);
  }

  .clock-only::-webkit-datetime-edit,
  .clock-only::-webkit-datetime-edit-fields-wrapper{
    color:transparent;
  }

  .clock-only.has-time::-webkit-datetime-edit,
  .clock-only.has-time::-webkit-datetime-edit-fields-wrapper{
    color:#111827;
    text-align:center;
  }
}

@media (max-width:720px){
  .hours-two-column{
    column-gap:18px;
  }

  .business-hour-row input[type="time"]{
    width:92%;
  }
}
