@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@500;600;700;800&display=swap');
:root{
--tpi-navy:#071d38;--tpi-deep:#092d59;--tpi-blue:#1268e8;--tpi-blue2:#2487ff;--tpi-sky:#55b4ff;
--tpi-gold:#d8af57;--tpi-bg:#f4f7fb;--tpi-card:#fff;--tpi-text:#102844;--tpi-muted:#74869a;
--tpi-line:#e4eaf2;--tpi-green:#17b978;--tpi-red:#e14c58;--tpi-shadow:0 18px 55px rgba(7,29,56,.09)
}
.tpi-app{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:
radial-gradient(circle at 85% 15%,rgba(36,135,255,.08),transparent 24%),linear-gradient(180deg,#f8fbff,#f3f6fa);
min-height:100vh;color:var(--tpi-text);position:relative;overflow:hidden;border-radius:18px}
.tpi-app:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-220px;top:230px;background:rgba(18,104,232,.055);animation:tpiDrift 10s ease-in-out infinite;pointer-events:none}
.tpi-app:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;left:-180px;bottom:160px;background:rgba(216,175,87,.055);animation:tpiDrift 12s ease-in-out infinite reverse;pointer-events:none}
@keyframes tpiDrift{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-22px,0)}}
.tpi-topbar{background:linear-gradient(112deg,#061a33,#0a2c59 62%,#0d55aa);min-height:82px;padding:16px clamp(20px,5%,70px);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:10;box-shadow:0 8px 28px rgba(3,22,48,.2)}
.tpi-top-brand{display:flex;align-items:center;gap:13px}.tpi-logo-text{font-family:Manrope,Inter,sans-serif;color:#fff;font-weight:800;letter-spacing:1.5px;font-size:15px}.tpi-subtitle{color:#a9c8ea;font-size:8px;letter-spacing:3px;margin-top:4px}
.tpi-mark{width:39px;height:39px;border:2px solid #1681ff;border-radius:50%;position:relative;box-shadow:0 0 22px rgba(20,119,255,.35)}.tpi-mark span{position:absolute;background:#fff;height:3px;border-radius:4px}.tpi-mark span:nth-child(1){width:21px;left:7px;top:18px}.tpi-mark span:nth-child(2){width:11px;left:19px;top:12px;transform:rotate(90deg)}.tpi-mark span:nth-child(3){width:7px;left:25px;top:22px;transform:rotate(45deg)}
.tpi-top-actions{display:flex;align-items:center;gap:13px}.tpi-user-chip{display:flex;align-items:center;gap:9px;color:#fff}.tpi-user-chip small{display:block;color:#9fb5cf;font-size:9px}.tpi-user-chip strong{display:block;font-size:12px}.tpi-user-dot{width:9px;height:9px;border-radius:50%;background:#28d991;box-shadow:0 0 0 5px rgba(40,217,145,.12),0 0 13px #28d991}
.tpi-outline,.tpi-btn,.tpi-icon-btn,.tpi-clear{cursor:pointer;border-radius:9px;font-weight:800;border:0;transition:all .22s ease}.tpi-outline{padding:10px 15px;background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.25)}.tpi-outline:hover{background:#fff;color:var(--tpi-navy);transform:translateY(-1px)}
.tpi-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:12px 19px;background:linear-gradient(135deg,#0d5fe0,#1680ff);color:#fff;box-shadow:0 10px 24px rgba(17,103,232,.24)}.tpi-btn:hover{transform:translateY(-2px);box-shadow:0 15px 30px rgba(17,103,232,.32)}.tpi-btn.compact{padding:10px 14px}
.tpi-app-body{padding:34px clamp(18px,5%,70px) 38px;position:relative;z-index:2}.tpi-dashboard-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:2px 0 27px;animation:tpiRise .55s ease both}.tpi-kicker{font-size:9px;font-weight:900;letter-spacing:2.3px;color:#3978ba;display:flex;align-items:center;gap:8px}.tpi-kicker span{width:25px;height:2px;background:var(--tpi-gold)}.tpi-dashboard-head h1{font-family:Manrope,Inter,sans-serif;font-size:clamp(28px,3.2vw,43px);line-height:1;margin:10px 0 10px;letter-spacing:-1.5px;color:var(--tpi-navy)}.tpi-dashboard-head h1 b{color:var(--tpi-blue)}.tpi-dashboard-head p{margin:0;color:#718398;font-size:13px;max-width:650px}.tpi-head-date{background:#fff;border:1px solid var(--tpi-line);border-radius:13px;padding:12px 15px;min-width:180px;box-shadow:0 10px 30px rgba(7,29,56,.055)}.tpi-head-date span{display:block;font-size:8px;letter-spacing:1.7px;color:#8798aa;font-weight:900}.tpi-head-date strong{display:flex;align-items:center;gap:8px;margin-top:5px;font-size:10px;color:#176c50}.tpi-head-date i{width:7px;height:7px;background:#17b978;border-radius:50%;box-shadow:0 0 0 5px #e6f8f0;animation:tpiPulse 1.8s infinite}@keyframes tpiPulse{50%{box-shadow:0 0 0 8px rgba(23,185,120,0)}}
.tpi-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.tpi-stat-card{background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border:1px solid rgba(220,228,238,.95);border-radius:16px;min-height:116px;padding:18px;display:flex;align-items:center;gap:14px;box-shadow:var(--tpi-shadow);position:relative;overflow:hidden;animation:tpiRise .6s both}.tpi-stat-card:nth-child(2){animation-delay:.07s}.tpi-stat-card:nth-child(3){animation-delay:.14s}.tpi-stat-card:nth-child(4){animation-delay:.21s}@keyframes tpiRise{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:none}}.tpi-stat-card:after{content:"";position:absolute;right:-35px;bottom:-55px;width:135px;height:135px;border-radius:50%;background:rgba(17,103,232,.05)}.tpi-stat-icon{width:45px;height:45px;border-radius:12px;display:grid;place-items:center;background:#eaf3ff;color:#0e62da;font-weight:900;font-size:13px}.tpi-stat-card.navy .tpi-stat-icon{background:#e9eff8;color:#082955}.tpi-stat-card.gold .tpi-stat-icon{background:#fff5df;color:#a77819}.tpi-stat-card span{font-size:10px;color:var(--tpi-muted);font-weight:700}.tpi-stat-card strong{display:block;color:var(--tpi-navy);font-family:Manrope,sans-serif;font-size:21px;margin-top:3px}.tpi-stat-card small{font-size:9px;color:#96a2b1}.tpi-stat-card i{position:absolute;right:15px;top:15px;width:7px;height:7px;border-radius:50%}.tpi-stat-card i.free{background:#1ec77f;box-shadow:0 0 0 5px #e8faf2}.tpi-stat-card i.busy{background:#e24b55;box-shadow:0 0 0 5px #ffeded}
.tpi-room-strip{padding:30px 0 25px}.tpi-section-title>span{font-size:9px;letter-spacing:2.2px;color:#3f7fc8;font-weight:900}.tpi-section-title h2{font-family:Manrope,Inter,sans-serif;font-size:21px;margin:3px 0 0;color:var(--tpi-navy)}.tpi-section-title{display:flex;flex-direction:column;margin-bottom:16px}.tpi-live{font-size:9px;color:#63809e;font-weight:900;letter-spacing:1.3px;display:flex;align-items:center;gap:7px}.tpi-live i{width:7px;height:7px;background:#1ec77f;border-radius:50%;box-shadow:0 0 0 4px #e5faf1;animation:tpiPulse 1.8s infinite}
.tpi-room-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.tpi-room-card{background:#fff;border:1px solid var(--tpi-line);border-radius:14px;padding:17px 19px;display:flex;align-items:center;gap:13px;box-shadow:0 8px 25px rgba(7,29,56,.055);transition:.25s}.tpi-room-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(7,29,56,.1)}.room-number{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:#edf5ff;color:#1768d8;font-weight:900}.tpi-room-card strong{display:block;color:var(--tpi-navy)}.tpi-room-card span{font-size:11px;color:#7a899c}.tpi-room-card b{margin-left:auto;font-size:9px;letter-spacing:1px;padding:7px 9px;border-radius:20px}.is-free b{color:#128155;background:#e9f8f1}.is-booked b{color:#b4363f;background:#ffeded}
.tpi-panel{background:#fff;border:1px solid var(--tpi-line);border-radius:17px;box-shadow:var(--tpi-shadow);overflow:hidden}.tpi-panel-head{padding:22px 22px 14px;display:flex;justify-content:space-between;align-items:flex-end}.tpi-panel-head .tpi-section-title{margin:0}.tpi-toolbar{padding:0 22px 13px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:8px}.tpi-search{display:flex;align-items:center;border:1px solid #dfe6ef;border-radius:9px;padding:0 11px;background:#fbfcfe}.tpi-search span{font-size:21px;color:#7790a9}.tpi-search input{border:0;outline:0;background:transparent;padding:11px;width:100%;min-width:0}.tpi-toolbar select,.tpi-toolbar>input{border:1px solid #dfe6ef;border-radius:9px;background:#fbfcfe;padding:10px;color:#3b526b;outline:none}.tpi-toolbar select:focus,.tpi-toolbar>input:focus,.tpi-search:focus-within{border-color:#65a8f8;box-shadow:0 0 0 3px #eaf4ff}.tpi-clear{background:#f0f4f8;color:#52677d;padding:0 13px}.tpi-results{padding:0 22px 12px;font-size:10px;color:#8a98a8}.tpi-results span{color:#1768d8;font-weight:900}.tpi-table-wrap{overflow:auto}.tpi-table{width:100%;border-collapse:collapse;min-width:950px}.tpi-table th{background:#f8faff;color:#72859b;font-size:9px;letter-spacing:1.2px;text-transform:uppercase;padding:12px 15px;text-align:left;border-top:1px solid #edf1f6;border-bottom:1px solid #e7edf4}.tpi-table td{padding:13px 15px;border-bottom:1px solid #edf1f6;vertical-align:middle}.tpi-table tbody tr{transition:.2s}.tpi-table tbody tr:hover{background:#f8fbff;box-shadow:inset 3px 0 #1477ff}.student-cell{display:flex;align-items:center;gap:10px}.avatar{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#1265df,#43a7ff);color:#fff;font-weight:900;font-size:13px}.student-cell strong,.schedule-cell strong{display:block;font-size:12px;color:#152d49}.student-cell span,.schedule-cell span,.contact-cell span{display:block;font-size:10px;color:#8593a4;margin-top:2px}.tpi-test-pill{display:inline-block;border-radius:20px;padding:6px 9px;font-size:9px;font-weight:900;background:#edf5ff;color:#1768d8;white-space:nowrap}.tpi-test-pill.duolingo{background:#e9f8ef;color:#168052}.tpi-test-pill.toeflibt{background:#fff2e2;color:#ad6815}.tpi-test-pill.languagecert{background:#f1ecff;color:#7045bc}.tpi-test-pill.oxfordellt{background:#eaf2ff;color:#275c9e}.tpi-room-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:20px;font-size:9px;font-weight:900;white-space:nowrap}.tpi-room-pill i{width:6px;height:6px;border-radius:50%}.tpi-room-pill.one{background:#eaf3ff;color:#1768d8}.tpi-room-pill.one i{background:#1768d8}.tpi-room-pill.two{background:#e9f8ef;color:#168052}.tpi-room-pill.two i{background:#168052}.row-actions{display:flex;gap:6px}.tpi-icon-btn{width:31px;height:31px;background:#eef4fb;color:#1b5eab}.tpi-icon-btn:hover{background:#1768d8;color:#fff;transform:translateY(-1px)}.tpi-icon-btn.danger:hover{background:#e24b55}.tpi-empty{padding:55px 20px;text-align:center;color:#8291a2}.tpi-empty div{font-size:34px;color:#1768d8}.tpi-empty strong,.tpi-empty span{display:block;margin-top:7px}.tpi-empty strong{color:#243d58}.tpi-footer{display:flex;justify-content:space-between;padding:25px 4px 5px;color:#8998aa;font-size:9px;letter-spacing:1px}
.tpi-modal{display:none;position:fixed;inset:0;z-index:999999}.tpi-modal.open{display:block}.tpi-modal-open{overflow:hidden}.tpi-backdrop{position:absolute;inset:0;background:rgba(3,16,32,.74);backdrop-filter:blur(6px);animation:tpiFade .2s}@keyframes tpiFade{from{opacity:0}to{opacity:1}}.tpi-modal-box{position:relative;z-index:2;width:min(720px,calc(100% - 28px));margin:4vh auto;background:#fff;border-radius:20px;padding:27px;max-height:92vh;overflow:auto;box-shadow:0 30px 90px rgba(0,0,0,.32);animation:tpiModal .3s cubic-bezier(.2,.8,.2,1)}@keyframes tpiModal{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}.tpi-x{position:absolute;right:15px;top:12px;border:0;background:#f0f4f8;color:#60768d;width:32px;height:32px;border-radius:50%;font-size:22px;cursor:pointer}.tpi-modal-head{display:flex;gap:12px;align-items:center;padding-right:30px;margin-bottom:22px}.tpi-modal-icon{width:43px;height:43px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#0d5fe0,#48aaff);color:#fff;font-weight:900;box-shadow:0 9px 22px rgba(17,103,232,.22)}.tpi-modal-head span{font-size:8px;letter-spacing:2px;color:#3978ba;font-weight:900}.tpi-modal-head h2{font-family:Manrope,Inter,sans-serif;margin:3px 0;color:var(--tpi-navy)}.tpi-modal-head p{margin:0;color:#8190a1;font-size:11px}.tpi-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 15px}.tpi-form-grid label{display:block;font-weight:800;color:#2b4058;font-size:11px;margin-bottom:13px}.tpi-form-grid label.wide{grid-column:1/-1}.tpi-form-grid input{width:100%;margin-top:6px;padding:11px 12px;border:1px solid #d9e2ec;border-radius:9px;min-height:44px;outline:none;background:#fbfcfe;color:#243b55}.tpi-form-grid input:focus{border-color:#3b96f7;box-shadow:0 0 0 3px #eaf4ff;background:#fff}
.tpi-native-select{
  display:block!important;
  position:relative!important;
  width:100%!important;
  height:46px!important;
  min-height:46px!important;
  margin-top:6px!important;
  padding:0 42px 0 13px!important;
  border:1px solid #d9e2ec!important;
  border-radius:10px!important;
  background-color:#fbfcfe!important;
  background-image:linear-gradient(45deg,transparent 50%,#71869d 50%),linear-gradient(135deg,#71869d 50%,transparent 50%)!important;
  background-position:calc(100% - 18px) 20px,calc(100% - 13px) 20px!important;
  background-size:5px 5px,5px 5px!important;
  background-repeat:no-repeat!important;
  color:#243b55!important;
  font:600 12px Inter,system-ui,sans-serif!important;
  line-height:46px!important;
  outline:none!important;
  cursor:pointer!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  -moz-appearance:none!important;
  box-sizing:border-box!important;
  opacity:1!important;
  visibility:visible!important;
}
.tpi-native-select:hover{
  border-color:#83b8ef!important;
  background-color:#fff!important;
}
.tpi-native-select:focus{
  border-color:#368ef2!important;
  box-shadow:0 0 0 4px #eaf4ff!important;
  background-color:#fff!important;
}
.tpi-native-select option{
  background:#fff!important;
  color:#243b55!important;
  font:500 13px Inter,system-ui,sans-serif!important;
  padding:10px!important;
}
.tpi-note{display:flex;gap:8px;background:linear-gradient(90deg,#f0f7ff,#f8fbff);border:1px solid #dcecff;border-left:4px solid #1768d8;padding:12px 13px;border-radius:9px;margin:4px 0 18px;color:#526b85;font-size:10px;line-height:1.5}.tpi-note strong{display:block;color:#155ba8;white-space:nowrap}.tpi-actions{display:flex;justify-content:flex-end;gap:9px}.tpi-message{display:none}.tpi-message.show{display:block}.tpi-message.ok{background:#e9f8ef;color:#177343}.tpi-message.bad{background:#fff0f0;color:#a51f2d}.tpi-login-box{width:min(430px,calc(100% - 30px));margin:30px auto;background:#fff;border-radius:20px;padding:38px;box-shadow:0 20px 60px rgba(0,0,0,.2);text-align:center}.tpi-login-box h2{color:var(--tpi-navy)}.tpi-login-box p{color:#6b7788}
@media(max-width:1050px){.tpi-stats{grid-template-columns:repeat(2,1fr)}.tpi-toolbar{grid-template-columns:2fr 1fr 1fr}.tpi-clear{min-height:42px}.tpi-filter-date{grid-column:1}.tpi-panel-head{align-items:flex-start}}
@media(max-width:700px){.tpi-topbar{padding:14px 16px}.tpi-top-actions{gap:8px}.tpi-user-chip{display:none}.tpi-topbar .tpi-outline{padding:8px 11px}.tpi-app-body{padding:25px 14px 32px}.tpi-dashboard-head{display:block}.tpi-head-date{margin-top:15px}.tpi-stats,.tpi-room-grid,.tpi-form-grid{grid-template-columns:1fr}.tpi-panel-head{display:block}.tpi-panel-head .tpi-btn{margin-top:12px}.tpi-toolbar{grid-template-columns:1fr 1fr;padding:0 14px 13px}.tpi-search{grid-column:1/-1}.tpi-results{padding-left:14px}.tpi-form-grid label.wide{grid-column:auto}.tpi-footer{display:block;line-height:2}.tpi-footer span{display:block}.tpi-modal-box{padding:22px}.tpi-note{display:block}.tpi-note strong{margin-bottom:4px}.tpi-actions{justify-content:stretch}.tpi-actions>*{flex:1}}


/* ===== TPI 2.4 FINAL BOOKING FORM FIX ===== */
body.tpi-modal-open{overflow:hidden!important}
.tpi-modal{overflow:hidden!important}
.tpi-modal-box{
  width:min(850px,calc(100vw - 28px))!important;
  height:min(610px,calc(100vh - 30px))!important;
  max-height:none!important;
  margin:15px auto!important;
  padding:22px 25px 20px!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
.tpi-modal-head{margin-bottom:12px!important;flex:0 0 auto!important}
.tpi-modal-head h2{font-size:22px!important;margin:2px 0!important}
.tpi-modal-head p{font-size:10px!important}
#tpi-msg{min-height:0!important;flex:0 0 auto!important}
.tpi-form-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:9px 12px!important;
  flex:0 0 auto!important;
}
.tpi-form-grid label{
  font-size:10px!important;
  margin-bottom:0!important;
}
.tpi-form-grid label.wide{grid-column:auto!important}
.tpi-form-grid input,
.tpi-native-select{
  height:40px!important;
  min-height:40px!important;
  margin-top:4px!important;
  padding-top:0!important;
  padding-bottom:0!important;
  font-size:11px!important;
}
.tpi-native-select{
  line-height:40px!important;
  background-position:calc(100% - 16px) 17px,calc(100% - 11px) 17px!important;
}
.tpi-note{
  margin:11px 0 10px!important;
  padding:9px 11px!important;
  min-height:0!important;
  font-size:9px!important;
  line-height:1.35!important;
  flex:0 0 auto!important;
}
.tpi-actions{
  margin-top:auto!important;
  flex:0 0 auto!important;
}
.tpi-actions .tpi-btn,.tpi-actions .tpi-outline{
  min-height:40px!important;
  padding:9px 17px!important;
}
.tpi-btn:disabled{
  opacity:.58!important;
  cursor:not-allowed!important;
  transform:none!important;
}
.tpi-spinner{
  width:12px;height:12px;border:2px solid rgba(255,255,255,.45);
  border-top-color:#fff;border-radius:50%;display:inline-block;
  animation:tpiSpin .65s linear infinite;vertical-align:-2px;margin-right:5px
}
@keyframes tpiSpin{to{transform:rotate(360deg)}}

/* Dedicated availability alert: one popup only, no duplicate form controls. */
.tpi-availability-pop{
  position:absolute!important;
  z-index:20!important;
  top:16px!important;
  right:16px!important;
  width:min(390px,calc(100% - 32px))!important;
  display:flex!important;
  align-items:flex-start!important;
  gap:11px!important;
  padding:13px 38px 13px 13px!important;
  border-radius:13px!important;
  background:#fff!important;
  border:1px solid #e2e9f1!important;
  box-shadow:0 18px 50px rgba(4,22,45,.25)!important;
  opacity:0!important;
  visibility:hidden!important;
  transform:translateY(-10px) scale(.98)!important;
  transition:opacity .2s ease,transform .2s ease,visibility .2s!important;
  pointer-events:none!important;
}
.tpi-availability-pop.show{
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  pointer-events:auto!important;
}
.tpi-availability-pop.danger{border-left:4px solid #e14955!important}
.tpi-availability-pop.success{border-left:4px solid #18b879!important}
.tpi-av-icon{
  width:30px;height:30px;min-width:30px;border-radius:9px;
  display:grid;place-items:center;font-weight:900;color:#fff;background:#e14955
}
.tpi-availability-pop.success .tpi-av-icon{background:#18b879}
.tpi-av-copy small{display:block;font-size:7px;letter-spacing:1.5px;font-weight:900;color:#7d8fa2}
.tpi-av-copy strong{display:block;margin-top:2px;color:#152d49;font-size:11px}
.tpi-av-copy p{margin:3px 0 0;color:#61758b;font-size:9px;line-height:1.4}
#tpi-av-close{
  position:absolute;right:8px;top:7px;border:0;background:transparent;
  color:#8291a2;font-size:19px;line-height:1;cursor:pointer
}
@media(max-width:760px){
  .tpi-modal-box{
    width:calc(100vw - 18px)!important;
    height:calc(100vh - 18px)!important;
    margin:9px auto!important;
    padding:17px!important;
  }
  .tpi-form-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .tpi-modal-head{padding-right:25px!important}
  .tpi-modal-head h2{font-size:18px!important}
  .tpi-form-grid label{font-size:9px!important}
  .tpi-form-grid input,.tpi-native-select{height:38px!important;min-height:38px!important}
  .tpi-note{font-size:8px!important}
}
@media(max-width:480px){
  .tpi-form-grid{grid-template-columns:1fr!important}
  .tpi-form-grid label.wide{grid-column:auto!important}
  .tpi-modal-box{overflow:hidden!important}
  .tpi-form-grid{gap:7px!important}
  .tpi-form-grid input,.tpi-native-select{height:36px!important;min-height:36px!important}
  .tpi-note{display:none!important}
}

/* ===== TPI 2.5 SINGLE VISIBLE DROPDOWNS ===== */
.tpi-dd{position:relative;width:100%;margin-top:4px}
.tpi-dd-native{
  position:absolute!important;
  width:1px!important;height:1px!important;
  min-width:1px!important;min-height:1px!important;
  padding:0!important;margin:0!important;
  border:0!important;opacity:0!important;
  pointer-events:none!important;clip:rect(0 0 0 0)!important;
  overflow:hidden!important;
}
.tpi-dd-toggle{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  width:100%!important;
  height:40px!important;
  min-height:40px!important;
  margin:0!important;
  padding:0 12px!important;
  border:1px solid #d9e2ec!important;
  border-radius:10px!important;
  background:#fbfcfe!important;
  color:#243b55!important;
  font:600 11px Inter,system-ui,sans-serif!important;
  line-height:1!important;
  text-align:left!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
.tpi-dd-toggle:hover,.tpi-dd.open .tpi-dd-toggle{
  border-color:#368ef2!important;
  background:#fff!important;
  box-shadow:0 0 0 3px #eaf4ff!important;
}
.tpi-dd-toggle span{color:#71869d;font-size:16px;line-height:1;transform:translateY(-2px)}
.tpi-dd-menu{
  position:absolute!important;
  z-index:99999!important;
  top:calc(100% + 5px)!important;
  left:0!important;
  width:100%!important;
  display:none!important;
  padding:5px!important;
  border:1px solid #dce6f0!important;
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:0 16px 40px rgba(12,43,78,.18)!important;
}
.tpi-dd.open .tpi-dd-menu{display:block!important;animation:tpiDropIn .14s ease-out}
.tpi-dd-menu button{
  display:block!important;
  width:100%!important;
  min-height:34px!important;
  padding:8px 10px!important;
  border:0!important;
  border-radius:7px!important;
  background:#fff!important;
  color:#243b55!important;
  font:600 11px Inter,system-ui,sans-serif!important;
  text-align:left!important;
  cursor:pointer!important;
}
.tpi-dd-menu button:hover,.tpi-dd-menu button.selected{
  background:#edf5ff!important;color:#1768d8!important;
}
@keyframes tpiDropIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

.tpi-server-notice{margin:0 0 14px;padding:12px 16px;border-radius:12px;font:700 12px Inter,system-ui,sans-serif;box-shadow:0 8px 24px rgba(15,45,80,.08)}
.tpi-server-notice.success{background:#ecfbf4;border:1px solid #bdebd4;color:#087f5b}
.tpi-server-notice.error{background:#fff1f2;border:1px solid #fecdd3;color:#b42318}


/* ===== TPI v3.1 SMART DURATION + LIVE STAFF ===== */
.tpi-head-tools{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.tpi-online-card{background:rgba(255,255,255,.97);border:1px solid var(--tpi-line);border-radius:13px;padding:11px 13px;min-width:230px;max-width:330px;box-shadow:0 10px 30px rgba(7,29,56,.055);animation:tpiRise .6s ease both}
.tpi-online-top{display:flex;align-items:center;gap:7px;color:#176c50;font-size:9px;letter-spacing:1px}
.tpi-online-dot{width:7px;height:7px;border-radius:50%;background:#17b978;box-shadow:0 0 0 5px #e6f8f0;animation:tpiPulse 1.8s infinite}
.tpi-online-names{margin-top:6px;color:#60758c;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tpi-dd-group-label{padding:7px 10px 4px;color:#3978ba;font-size:8px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase;border-top:1px solid #edf2f7;margin-top:3px}
.tpi-dd-menu button[data-value^="LanguageCert"]{padding-left:17px}
.tpi-test-pill.languagecertspeaking{background:#f1ecff;color:#7045bc}.tpi-test-pill.languagecertlrw{background:#eee9ff;color:#6338b2}
.tpi-test-pill.recordedinterview{background:#e9f8ef;color:#168052}.tpi-test-pill.embassyinterview{background:#fff2e2;color:#ad6815}.tpi-test-pill.liveinterview{background:#eaf3ff;color:#1768d8}
.tpi-note strong{white-space:nowrap}
.tpi-availability-pop.success .tpi-av-icon{background:#18b879}
@media(max-width:850px){.tpi-head-tools{justify-content:flex-start}.tpi-online-card{min-width:0;flex:1}.tpi-head-date{min-width:160px}}
@media(max-width:700px){.tpi-head-tools{display:grid;grid-template-columns:1fr}.tpi-online-card{max-width:none}.tpi-online-names{white-space:normal}}

.tpi-dd-parent{display:flex!important;align-items:center!important;justify-content:space-between!important;font-weight:800!important;color:#1768d8!important;background:#f4f8ff!important}
.tpi-dd-parent span{font-size:16px!important;color:#7a8ea4!important}
.tpi-dd-submenu{display:none;padding:4px 0 4px 8px;background:#fbfdff;border-left:2px solid #d8e9fb;margin:2px 4px 4px}
.tpi-dd.subopen .tpi-dd-submenu{display:block!important;animation:tpiDropIn .12s ease-out}
.tpi-dd-suboption{display:flex!important;align-items:center!important;justify-content:space-between!important;padding-left:12px!important}
.tpi-dd-suboption small{font-size:8px!important;color:#8798aa!important;font-weight:700!important}

.tpi-dd-menu button[role="option"]{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important}.tpi-dd-menu button[role="option"] small{font-size:8px!important;color:#8798aa!important;font-weight:700!important}.tpi-dd-menu button[role="option"].selected small{color:#5e88b8!important}

/* v3.1.1 — booking creator / entered-by indicator */
.tpi-table{min-width:1080px}
.entered-by-cell{display:flex;align-items:center;gap:8px;min-width:125px}
.entered-by-dot{width:8px;height:8px;min-width:8px;border-radius:50%;background:#1768d8;box-shadow:0 0 0 4px #eaf3ff}
.entered-by-cell strong{display:block;font-size:10px;color:#17324f;font-weight:800;line-height:1.2}
.entered-by-cell small{display:block;margin-top:2px;font-size:8px;color:#8291a2;line-height:1.2}
.entered-by-cell:hover .entered-by-dot{background:#18b879;box-shadow:0 0 0 4px #e8f8f1}