:root {
  --navy:#0b1f33; --navy-2:#12314d; --blue:#006fba; --blue-dark:#00558f;
  --cyan:#20a6d9; --ink:#172534; --muted:#657587; --line:#dbe3ea;
  --surface:#fff; --soft:#f4f7fa; --success:#178454; --danger:#b42318;
  --shadow:0 18px 50px rgba(10,31,51,.13); --radius:14px;
}
*{box-sizing:border-box}
html{background:#edf2f6}
body{margin:0!important;min-height:100vh!important;padding:38px 20px!important;color:var(--ink)!important;background:linear-gradient(180deg,#e8eef3 0,#f6f8fa 48%,#eef3f6 100%)!important;font-family:Inter,"Segoe UI",Arial,sans-serif!important;line-height:1.5}
body:before{content:"ONTIME NETWORKS";display:block;max-width:920px;margin:0 auto 18px;color:var(--navy);font-size:13px;font-weight:800;letter-spacing:.16em}
.container{width:100%!important;max-width:920px!important;margin:0 auto!important;padding:0!important;background:var(--surface)!important;border:1px solid rgba(11,31,51,.1)!important;border-radius:var(--radius)!important;box-shadow:var(--shadow)!important;overflow:hidden!important;text-align:left!important}
.header,.success-icon{padding:34px 42px!important;color:#fff!important;text-align:left!important;background:linear-gradient(115deg,var(--navy),var(--navy-2))!important}
.header:after{content:"";display:block;width:52px;height:3px;margin-top:18px;background:var(--cyan);border-radius:10px}
.header h1,.success-icon h1{margin:0 0 6px!important;color:#fff!important;font-size:30px!important;line-height:1.2!important;letter-spacing:-.02em}
.header p,.header .subtitle{margin:0!important;color:#d6e4ef!important;font-size:15px!important}
.content{padding:36px 42px!important}
h1,h2,h3{color:var(--navy)!important;letter-spacing:-.015em}
h2{font-size:21px!important;margin:0 0 16px!important} h3{font-size:16px!important}
p{color:var(--muted)!important}
.section,.selection-box,.booking-form,.booking-details,.info-box{margin:0 0 22px!important;padding:24px!important;background:var(--soft)!important;border:1px solid var(--line)!important;border-radius:11px!important;box-shadow:none!important}
.section{background:#fff!important}.section+.section{margin-top:22px!important}
.form-row{display:grid!important;grid-template-columns:1fr 1fr!important;gap:18px!important}
.form-group{margin-bottom:18px!important}.form-group label,label{display:block;margin:0 0 7px;color:var(--ink)!important;font-size:13px!important;font-weight:700!important}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],select,textarea{width:100%!important;padding:11px 12px!important;border:1px solid #becbd6!important;border-radius:8px!important;background:#fff!important;color:var(--ink)!important;font:inherit!important;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:0!important;border-color:var(--blue)!important;box-shadow:0 0 0 3px rgba(0,111,186,.13)!important}
.btn,button.btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;padding:11px 18px!important;border:0!important;border-radius:8px!important;background:var(--blue)!important;color:#fff!important;text-decoration:none!important;font-size:14px!important;font-weight:700!important;cursor:pointer!important;transition:.15s!important}
.btn:hover{background:var(--blue-dark)!important;transform:translateY(-1px)}.btn-full{width:100%!important}
.slots-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(105px,1fr))!important;gap:10px!important}
.slot-button{padding:11px!important;border:1px solid var(--blue)!important;border-radius:8px!important;background:#fff!important;color:var(--blue)!important;font-weight:700!important;cursor:pointer!important}
.slot-button:hover,.slot-button.selected{background:var(--blue)!important;color:#fff!important}
.error{padding:15px 18px!important;border:1px solid #f2b8b5!important;border-left:4px solid var(--danger)!important;border-radius:8px!important;background:#fff5f4!important;color:#7a271a!important}
.info-box,.success-box,.generated-link{padding:16px 18px!important;border:1px solid #b8dff0!important;border-left:4px solid var(--blue)!important;border-radius:8px!important;background:#f2f9fc!important;color:var(--navy)!important}
.success-box,.generated-link{border-color:#a9dec5!important;border-left-color:var(--success)!important;background:#f0faf5!important}
.checkbox-group{max-height:340px!important;overflow:auto!important;padding:8px!important;border:1px solid var(--line)!important;border-radius:9px!important;background:#fff!important}
.checkbox-item{padding:10px!important;border-radius:7px!important}.checkbox-item:hover{background:var(--soft)!important}.checkbox-item label{display:inline!important;font-weight:500!important}
.teams-option{display:flex;gap:11px;align-items:flex-start;padding:14px;border:1px solid var(--line);border-radius:9px;background:#fff}.teams-option input{margin-top:4px}.teams-option span{font-size:13px;color:var(--muted)}
.online-badge{display:inline-flex;align-items:center;gap:7px;margin-top:12px;padding:6px 10px;border-radius:99px;background:#e8f3fb;color:var(--blue);font-size:12px;font-weight:800}
.link-box{padding:12px!important;border:1px solid var(--line)!important;border-radius:8px!important;background:#fff!important;color:var(--navy)!important;font-family:ui-monospace,monospace!important;word-break:break-all}
.detail-row{display:grid!important;grid-template-columns:130px 1fr!important;gap:14px!important;padding:11px 0!important;border-bottom:1px solid var(--line)!important}.detail-label{font-weight:700!important;color:var(--muted)!important}
.icon{display:none!important}.ip-info{margin-top:10px;color:#b9ccda!important;font-size:11px!important}
.success-icon{padding:28px 42px!important}.success-icon svg{width:52px!important;height:52px!important}
code{padding:2px 5px;border-radius:4px;background:#e9eef2;color:var(--navy)}
@media(max-width:680px){body{padding:16px 10px!important}body:before{margin-left:6px}.header,.content,.success-icon{padding:25px 22px!important}.form-row{grid-template-columns:1fr!important}.detail-row{grid-template-columns:1fr!important;gap:2px!important}.container{border-radius:10px!important}}
