/* Shared Dashboard form controls. Keep field behavior and styling here instead of late fix layers. */

.bmMarkupBuilder{
  grid-column:1 / -1;
  border:1px solid rgba(35,32,52,.10);
  border-radius:16px;
  background:#fbfafc;
  padding:12px;
}
.bmMarkupTitle{
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#8d8a9e;
  margin:0 0 8px;
}
.bmMarkupRows{display:grid;gap:8px}
.bmMarkupRow{display:grid;grid-template-columns:minmax(120px,220px) 1fr 36px;gap:8px;align-items:center}
.bmMarkupRow input{
  height:38px;
  border:1px solid rgba(35,32,52,.12);
  border-radius:12px;
  background:#fff;
  padding:0 12px;
  font:700 13px Manrope,system-ui,sans-serif;
  color:#17182c;
  box-sizing:border-box;
}
.bmMarkupRemove{
  height:34px;
  border:1px solid rgba(255,99,112,.22);
  border-radius:12px;
  background:#fff;
  color:#d13d4c;
  font-weight:900;
}
.bmMarkupAdd{
  margin-top:8px;
  height:34px;
  border:1px solid rgba(35,32,52,.12);
  border-radius:12px;
  background:#fff;
  color:#242139;
  font-weight:900;
  padding:0 12px;
}

select.bmHotelSelectNative{
  position:absolute!important;
  left:-99999px!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
.bmHotelSelectCombo{position:relative;width:100%;min-width:0;display:block}
.bmHotelSelectControl{position:relative;width:100%}
.bmHotelSelectInput{
  width:100%;
  height:46px;
  border:1px solid rgba(35,32,52,.14);
  border-radius:14px;
  background:#fff;
  color:#17182c;
  padding:0 42px 0 14px;
  box-sizing:border-box;
  font:700 14px Manrope,system-ui,sans-serif;
  box-shadow:none;
}
.bmHotelSelectInput:focus{
  outline:none;
  border-color:rgba(93,83,180,.38);
  box-shadow:0 0 0 4px rgba(93,83,180,.08);
}
.bmHotelSelectArrow{
  position:absolute;
  right:9px;
  top:50%;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#6f6a82;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}
.bmHotelSelectArrow::before{
  content:'';
  width:15px;
  height:15px;
  display:block;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236f6a82' stroke-width='2.35' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  transition:transform .14s ease;
}
.bmHotelSelectCombo.open .bmHotelSelectArrow::before{transform:rotate(180deg)}
.bmHotelSelectMenu{
  display:none;
  position:absolute;
  z-index:99999;
  left:0;
  right:0;
  top:calc(100% + 6px);
  max-height:280px;
  overflow:auto;
  background:#fff;
  border:1px solid rgba(35,32,52,.12);
  border-radius:16px;
  box-shadow:0 18px 45px rgba(31,29,46,.18);
  padding:6px;
  box-sizing:border-box;
}
.bmHotelSelectCombo.open .bmHotelSelectMenu{display:block}
.bmHotelSelectOption{
  width:100%;
  text-align:left;
  border:0;
  background:transparent;
  color:#17182c;
  border-radius:11px;
  padding:10px 12px;
  font:800 13px Manrope,system-ui,sans-serif;
  cursor:pointer;
  display:block;
}
.bmHotelSelectOption:hover,.bmHotelSelectOption:focus{outline:none;background:#f2f0fb}
.bmHotelSelectOption.selected{background:#eeeafa;color:#4f44a7}
.bmHotelSelectEmpty{padding:12px;color:#8d8a9e;font:800 13px Manrope,system-ui,sans-serif}

select.dbInput,select.dbInlineInput,select.bmDetailsFormInput{
  appearance:none;
  -webkit-appearance:none;
  padding-right:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236f6a82' stroke-width='2.35' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:15px 15px;
  background-position:right 16px center;
}

.dbContractCard > .bmDetailsMeta{display:none!important}
.dbDetailHeaderActions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;justify-content:flex-end!important}
.dbBtn.danger{border-color:rgba(179,38,54,.22)!important;background:#fff5f6!important;color:#b32636!important}
.dbBtn.danger:hover{background:#b32636!important;color:#fff!important;border-color:#b32636!important}
.bmDeleteHotelBtn{height:34px!important;border-radius:999px!important;padding:0 12px!important;font-size:12px!important}

.bmConfirmOverlay{
  position:fixed!important;
  inset:0!important;
  z-index:10150!important;
  background:rgba(18,19,30,.46)!important;
  backdrop-filter:blur(10px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:20px!important;
}
.bmConfirmDialog{
  width:min(460px,calc(100vw - 40px))!important;
  background:#fff!important;
  border:1px solid rgba(35,32,52,.12)!important;
  border-radius:24px!important;
  box-shadow:0 28px 80px rgba(15,17,29,.28)!important;
  padding:22px!important;
  position:relative!important;
  color:#17182c!important;
}
.bmConfirmDialog h3{margin:0 42px 10px 0!important;font-size:21px!important;line-height:1.15!important}
.bmConfirmDialog p{margin:0!important;color:#747083!important;font-size:14px!important;line-height:1.45!important}
.bmConfirmClose{
  position:absolute!important;
  right:14px!important;
  top:14px!important;
  width:36px!important;
  height:36px!important;
  border-radius:999px!important;
  border:1px solid rgba(35,32,52,.12)!important;
  background:#fff!important;
  color:#17182c!important;
  font-size:22px!important;
  cursor:pointer!important;
}
.bmConfirmActions{display:flex!important;justify-content:flex-end!important;gap:10px!important;margin-top:20px!important}

@media(max-width:640px){
  .bmMarkupRow{grid-template-columns:1fr}
}
