/* Whole Business Engine — calendar appointment creation overlay */
.appointment-create-backdrop-v1{
  position:fixed;
  inset:0;
  z-index:9000;
  display:grid;
  place-items:center;
  padding:26px;
  overflow:auto;
  background:rgba(2,8,15,.78);
  backdrop-filter:blur(3px);
}
.appointment-create-modal-v1{
  width:min(1080px,calc(100vw - 44px));
  max-height:calc(100vh - 44px);
  overflow:auto;
  color:#f7f9fc;
  background:linear-gradient(145deg,#07121f 0%,#0a1827 56%,#07131f 100%);
  border:1px solid #49627b;
  border-radius:22px;
  box-shadow:0 28px 90px rgba(0,0,0,.68),0 0 42px rgba(13,184,255,.08);
}
.appointment-create-head-v1{
  position:sticky;
  top:0;
  z-index:4;
  display:grid;
  grid-template-columns:112px minmax(0,1fr) 54px;
  align-items:center;
  gap:22px;
  padding:24px 30px 22px;
  background:linear-gradient(180deg,rgba(8,20,33,.99),rgba(8,19,31,.96));
  border-bottom:1px solid #355069;
}
.appointment-create-mark-v1{
  width:94px;
  height:94px;
  display:grid;
  place-items:center;
  color:#fff;
  background:radial-gradient(circle at 50% 35%,#ff8a22,#ff5b0b 68%);
  border:2px solid #ffae37;
  border-radius:28px;
  box-shadow:0 0 26px rgba(255,108,15,.48);
}
.appointment-create-mark-v1 svg{width:54px;height:54px;stroke-width:1.8}
.appointment-create-head-v1 p{
  margin:0 0 5px;
  color:#ff8a1a;
  font-size:13px;
  font-weight:900;
  letter-spacing:.04em;
}
.appointment-create-head-v1 h2{
  margin:0;
  color:#f9fafc;
  font-size:40px;
  line-height:1.05;
  letter-spacing:-.035em;
}
.appointment-create-head-v1 span{
  display:block;
  margin-top:8px;
  color:#9eb7d2;
  font-size:17px;
}
.appointment-create-head-v1>button{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  color:#f4f7fa;
  background:#0b1927;
  border:1px solid #5b7086;
  border-radius:50%;
  cursor:pointer;
}
.appointment-create-head-v1>button:hover{border-color:#ff7a00;color:#ff9a3d}
.appointment-create-head-v1>button svg{width:25px;height:25px}
.appointment-create-grid-v1{
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
  gap:16px;
  padding:20px 22px 18px;
}
.appointment-create-panel-v1{
  min-width:0;
  padding:18px;
  background:linear-gradient(150deg,rgba(13,30,46,.95),rgba(8,21,34,.98));
  border:1px solid #38526b;
  border-radius:14px;
}
.appointment-create-panel-v1 h3{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 15px;
  color:#f4f7fb;
  font-size:19px;
}
.appointment-create-panel-v1 h3 svg{width:25px;height:25px;color:#20b5ff}
.appointment-contact-panel-v1{position:relative;grid-row:span 2}
.appointment-contact-search-v1{
  position:relative;
  display:grid;
  grid-template-columns:30px minmax(0,1fr) 22px;
  align-items:center;
  gap:8px;
  min-height:48px;
  padding:0 12px;
  background:#071521;
  border:1px solid #425b74;
  border-radius:10px;
}
.appointment-contact-search-v1:focus-within{
  border-color:#ff7a00;
  box-shadow:0 0 0 1px #ff7a00,0 0 18px rgba(255,122,0,.15);
}
.appointment-contact-search-v1>svg:first-child{color:#25d8f5;width:25px;height:25px}
.appointment-contact-search-v1>svg:last-child{color:#c8d2de;width:18px;height:18px}
.appointment-contact-search-v1 input{
  width:100%;
  min-width:0;
  height:46px;
  padding:0;
  color:#f5f7fa;
  font-size:16px;
  background:transparent;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.appointment-contact-results-v1{
  position:absolute;
  z-index:10;
  width:min(490px,calc(100vw - 100px));
  max-height:280px;
  overflow:auto;
  margin-top:6px;
  padding:7px;
  background:#07131f;
  border:1px solid #ff7a00;
  border-radius:12px;
  box-shadow:0 18px 42px rgba(0,0,0,.62);
}
.appointment-contact-results-v1[hidden],
.appointment-contact-results-v1 .appointment-contact-option-v1[hidden]{display:none!important}
.appointment-contact-option-v1,
.appointment-selected-contact-v1{
  width:100%;
  display:grid;
  grid-template-columns:50px minmax(0,1fr) 24px;
  align-items:center;
  gap:12px;
  min-height:72px;
  padding:10px 12px;
  color:#f5f7fa;
  text-align:left;
  background:#0b1d2c;
  border:1px solid #39536b;
  border-radius:10px;
}
.appointment-contact-option-v1{
  margin-bottom:6px;
  cursor:pointer;
}
.appointment-contact-option-v1:hover,
.appointment-contact-option-v1.selected{border-color:#ff7a00;background:#182116}
.appointment-contact-avatar-v1{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  color:#21dbf5;
  font-size:17px;
  font-weight:900;
  background:#07141f;
  border:1px solid #22dbee;
  border-radius:50%;
}
.appointment-contact-avatar-v1 svg{width:23px;height:23px}
.appointment-contact-option-v1 strong,
.appointment-selected-contact-v1 strong{display:block;font-size:16px;line-height:1.2}
.appointment-contact-option-v1 small,
.appointment-selected-contact-v1 small{display:block;margin-top:5px;color:#b5c3d1;font-size:13px;line-height:1.35}
.appointment-contact-option-v1 em{display:block;margin-top:3px;color:#69bfff;font-size:11px;font-style:normal}
.appointment-contact-option-v1>svg,
.appointment-selected-contact-v1>svg{width:21px;height:21px;color:#f7f9fb}
.appointment-no-contact-results-v1{display:none;padding:14px;color:#aebdcb}
.appointment-contact-results-v1.no-results .appointment-no-contact-results-v1{display:block}
.appointment-selected-contact-v1{
  margin-top:10px;
  border-color:#ff7a00;
  background:#111b1d;
  box-shadow:inset 4px 0 0 #ff7a00;
}
.appointment-selected-contact-v1 .appointment-contact-avatar-v1{
  color:#ff9a2e;
  border-color:#ff7a00;
}
.appointment-selected-contact-v1>svg{color:#ff8a1b}
.appointment-selected-contact-v1.empty{grid-template-columns:50px minmax(0,1fr);border-style:dashed}
.appointment-kind-grid-v1{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
  margin:15px 0;
}
.appointment-kind-v1{
  min-width:0;
  min-height:74px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:6px;
  color:#d8e1ea;
  background:#091725;
  border:1px solid #3b526a;
  border-radius:9px;
  cursor:pointer;
}
.appointment-kind-v1 svg{width:25px;height:25px;color:#27c7ff}
.appointment-kind-v1 span{font-size:12px;font-weight:800}
.appointment-kind-v1:hover,
.appointment-kind-v1.selected{color:#fff;border-color:#ff7a00;background:rgba(255,122,0,.10);box-shadow:inset 0 0 0 1px rgba(255,122,0,.25)}
.appointment-kind-v1.selected svg{color:#ff8a1b}
.appointment-field-v1{display:grid;gap:7px;min-width:0}
.appointment-field-v1>span,
.appointment-crew-picker-v1>span{color:#cbd5df;font-size:12px;font-weight:800}
.appointment-field-v1 input,
.appointment-field-v1 select,
.appointment-field-v1 textarea,
.appointment-crew-picker-v1>input{
  width:100%;
  min-width:0;
  color:#f7f9fb;
  background:#071521;
  border:1px solid #415a73;
  border-radius:9px;
  outline:0;
  accent-color:#ff7a00;
  color-scheme:dark;
}
.appointment-field-v1 input,
.appointment-field-v1 select,
.appointment-crew-picker-v1>input{height:45px;padding:0 12px}
.appointment-field-v1 textarea{min-height:78px;padding:12px;resize:vertical}
.appointment-field-v1 input:focus,
.appointment-field-v1 input:focus-visible,
.appointment-field-v1 select:focus,
.appointment-field-v1 select:focus-visible,
.appointment-field-v1 textarea:focus,
.appointment-field-v1 textarea:focus-visible,
.appointment-crew-picker-v1>input:focus,
.appointment-crew-picker-v1>input:focus-visible{
  border-color:#ff7a00!important;
  outline:2px solid #ff7a00!important;
  outline-offset:1px;
  box-shadow:none!important;
}
.appointment-field-v1 select option{color:#f7f9fb;background:#071521}
.appointment-field-v1 select option:checked{color:#080b0e;background:#ff7a00}
.appointment-field-grid-v1{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.appointment-crew-status-grid-v1{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:start}
.appointment-crew-picker-v1{display:grid;gap:9px}
.appointment-crew-picker-v1>div{display:flex;align-items:center;gap:8px}
.appointment-crew-v1,
.appointment-add-crew-v1{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  color:#d9e3ed;
  font-weight:900;
  background:#071521;
  border:1px solid #4b6178;
  border-radius:50%;
  cursor:pointer;
}
.appointment-crew-v1.tone-0{color:#39e586;border-color:#20bd68}
.appointment-crew-v1.tone-1{color:#58afff;border-color:#258df0}
.appointment-crew-v1.tone-2{color:#d27bff;border-color:#9b4cce}
.appointment-crew-v1:hover,
.appointment-crew-v1.selected,
.appointment-add-crew-v1:hover{background:#162718;border-color:#ff7a00;box-shadow:0 0 0 2px rgba(255,122,0,.18)}
.appointment-add-crew-v1 svg{width:20px;height:20px}
.appointment-conflict-v1{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:14px;
  padding:9px 11px;
  border-radius:8px;
  font-size:13px;
  font-weight:800;
}
.appointment-conflict-v1 svg{width:19px;height:19px}
.appointment-conflict-v1.available{color:#37dc7b;background:rgba(21,173,91,.08);border:1px solid rgba(43,208,111,.28)}
.appointment-conflict-v1.warning{color:#ffbb3e;background:rgba(255,157,0,.08);border:1px solid rgba(255,157,0,.38)}
.appointment-notes-panel-v1{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:minmax(150px,210px) minmax(0,1fr);
  align-items:center;
  gap:16px;
  padding:12px 16px;
}
.appointment-create-panel-v1.appointment-notes-panel-v1 h3{
  margin:0;
  font-size:17px!important;
  white-space:nowrap;
}
.appointment-notes-panel-v1 h3 svg{width:21px;height:21px}
.appointment-notes-panel-v1 .appointment-field-v1{gap:0}
.appointment-notes-panel-v1 textarea{
  min-height:52px;
  height:auto;
  max-height:132px;
  padding:10px 12px;
  line-height:1.45;
  field-sizing:content;
}
.appointment-create-footer-v1{
  position:sticky;
  bottom:0;
  z-index:4;
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:15px 22px;
  background:rgba(7,18,30,.98);
  border-top:1px solid #365069;
}
.appointment-create-footer-v1 .btn,
.appointment-save-v1{
  min-height:48px;
  padding:0 22px;
  font-size:15px;
  font-weight:900;
  border-radius:9px;
  cursor:pointer;
}
.appointment-create-footer-v1 .btn{color:#f4f7fa;background:#0d1c2b;border:1px solid #566c82}
.appointment-save-v1{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-width:240px;
  color:#ff9a34;
  background:rgba(255,122,0,.08);
  border:2px solid #ff7a00;
  box-shadow:0 0 20px rgba(255,122,0,.12);
}
.appointment-save-v1:hover{color:#091019;background:#ff7a00}
.appointment-save-v1 svg{width:23px;height:23px}

/* The appointment flow creates customers through the same shared CRM form. */
.appointment-add-customer-v1{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:13px;
  width:100%;
  min-height:70px;
  margin-top:10px;
  padding:10px 14px;
  color:#f7f9fb;
  text-align:left;
  background:#071521;
  border:1px solid #e20a78;
  border-radius:9px;
  cursor:pointer;
}
.appointment-add-customer-v1>span{
  display:grid;
  grid-row:1 / 3;
  place-items:center;
  width:46px;
  height:46px;
  color:#fff;
  background:#d70874;
  border-radius:50%;
}
.appointment-add-customer-v1>span svg{width:24px;height:24px}
.appointment-add-customer-v1 strong{font-size:16px;line-height:1.15}
.appointment-add-customer-v1 small{margin-top:4px;color:#aebdcc;font-size:12px}
.appointment-add-customer-v1:hover,
.appointment-add-customer-v1:focus-visible{
  outline:0;
  border-color:#ff7a00;
  box-shadow:inset 0 0 0 1px #ff7a00,0 0 18px rgba(255,122,0,.12);
}
.customer-edit-modal-v7.appointment-customer-create-v1{
  z-index:9300;
  background:rgba(2,8,14,.88);
}
.customer-edit-modal-v7.appointment-customer-create-v1 .customer-edit-dialog-v7{
  box-shadow:0 30px 90px rgba(0,0,0,.7);
}
@media(max-width:820px){
  .appointment-create-backdrop-v1{padding:10px}
  .appointment-create-modal-v1{width:100%;max-height:calc(100vh - 20px)}
  .appointment-create-head-v1{grid-template-columns:68px 1fr 44px;padding:17px}
  .appointment-create-mark-v1{width:62px;height:62px;border-radius:19px}
  .appointment-create-mark-v1 svg{width:36px;height:36px}
  .appointment-create-head-v1 h2{font-size:27px}
  .appointment-create-head-v1 span{font-size:14px}
  .appointment-create-grid-v1{grid-template-columns:1fr;padding:12px}
  .appointment-contact-panel-v1{grid-row:auto}
  .appointment-notes-panel-v1{
    grid-column:auto;
    grid-template-columns:1fr;
    align-items:stretch;
    gap:8px;
    padding:12px;
  }
  .appointment-create-panel-v1.appointment-notes-panel-v1 h3{font-size:17px!important}
  .appointment-notes-panel-v1 textarea{min-height:60px}
}
@media(max-width:560px){
  .appointment-kind-grid-v1{grid-template-columns:repeat(3,1fr)}
  .appointment-field-grid-v1,
  .appointment-crew-status-grid-v1{grid-template-columns:1fr}
  .appointment-create-footer-v1{align-items:stretch}
  .appointment-save-v1{min-width:0;flex:1}
}

/* Existing appointment editor: intentional modal instead of a broken right column. */
.premium-app .ironflow-calendar-page{
  max-width:100%;
  overflow-x:hidden;
}
.premium-app .ironflow-calendar-page .calendar-shell .appointment-editor-redesign{
  position:fixed!important;
  z-index:9200!important;
  top:76px!important;
  right:auto!important;
  bottom:22px!important;
  left:50%!important;
  width:min(900px,calc(100vw - 64px))!important;
  min-width:0!important;
  max-width:900px!important;
  height:auto!important;
  max-height:calc(100vh - 98px)!important;
  margin:0!important;
  padding:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  transform:translateX(-50%)!important;
  color:#f7f9fb!important;
  background:#06121e!important;
  border:1px solid #42617a!important;
  border-radius:16px!important;
  box-shadow:0 0 0 100vmax rgba(1,7,12,.78),0 30px 90px rgba(0,0,0,.68)!important;
}
.premium-app .ironflow-calendar-page .appointment-editor-redesign>.appointment-editor-head{
  position:sticky!important;
  top:0!important;
  z-index:4!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:start!important;
  gap:18px!important;
  padding:20px 22px!important;
  background:#081521!important;
  border-bottom:1px solid #35516a!important;
}
.premium-app .ironflow-calendar-page .appointment-editor-head h2{
  max-width:none!important;
  color:#fff!important;
  font-size:25px!important;
  line-height:1.2!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.premium-app .ironflow-calendar-page .appointment-editor-head .muted{
  max-width:680px!important;
  margin:6px 0 0!important;
  color:#b7c6d4!important;
  font-size:14px!important;
  line-height:1.45!important;
}
.premium-app .ironflow-calendar-page .appointment-editor-head>[data-cancel-appt-edit]{
  min-width:92px!important;
  border-color:#f58216!important;
  color:#ff9a32!important;
}
.premium-app .ironflow-calendar-page .appointment-editor-redesign>.body{
  padding:18px!important;
  overflow:visible!important;
}
.premium-app .ironflow-calendar-page .appointment-editor-redesign .appointment-section{
  background:#0b1a27!important;
  border-color:#35516a!important;
}
.premium-app .ironflow-calendar-page .appointment-editor-redesign .appointment-actions{
  z-index:3!important;
  padding:12px 0 2px!important;
  background:linear-gradient(180deg,rgba(6,18,30,.72),#06121e 38%)!important;
}
@media(max-width:760px){
  .premium-app .ironflow-calendar-page .calendar-shell .appointment-editor-redesign{
    top:10px!important;
    right:10px!important;
    bottom:10px!important;
    left:10px!important;
    width:auto!important;
    max-width:none!important;
    max-height:none!important;
    transform:none!important;
    border-radius:12px!important;
  }
  .premium-app .ironflow-calendar-page .appointment-editor-redesign>.appointment-editor-head{
    padding:16px!important;
  }
  .premium-app .ironflow-calendar-page .appointment-editor-head h2{
    font-size:21px!important;
  }
  .premium-app .ironflow-calendar-page .appointment-editor-redesign>.body{
    padding:12px!important;
  }
  .premium-app .ironflow-calendar-page .appointment-editor-redesign .appointment-field-grid,
  .premium-app .ironflow-calendar-page .appointment-editor-redesign .appointment-actions{
    grid-template-columns:1fr!important;
  }
}
