/* AX Gen 2 — emulated booking / checkout panel (investor demo).
   Replaces the dead Digital-Trip knockout booking widget on tour pages.
   Scoped under .axbk to avoid clashing with eVolve / Bootstrap 3. */

.axbk{
  --pine:#00302B; --navy:#001D41; --green:#56AD6D; --green-d:#3f8f55;
  --ink:#11221f; --muted:#5d6b67; --line:#e3e8e6; --bg:#ffffff; --soft:#f5f7f6;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--bg);
  box-shadow:0 10px 30px rgba(0,29,65,.08);
  overflow:hidden;
  position:sticky; top:20px;
}
.axbk *{ box-sizing:border-box; }

/* header */
.axbk-head{ background:var(--pine); color:#fff; padding:18px 20px; }
.axbk-head .axbk-from{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; opacity:.7; font-weight:600; }
.axbk-head .axbk-price{ font-size:30px; font-weight:800; line-height:1.1; margin:2px 0 0; }
.axbk-head .axbk-price small{ font-size:13px; font-weight:500; opacity:.8; }
.axbk-head .axbk-sub{ font-size:12.5px; opacity:.8; margin-top:3px; }

/* stepper */
.axbk-steps{ display:flex; gap:6px; padding:14px 20px 0; }
.axbk-steps .s{ flex:1; text-align:center; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--muted); padding-bottom:10px; border-bottom:2px solid var(--line); transition:.2s; }
.axbk-steps .s.on{ color:var(--pine); border-bottom-color:var(--green); }
.axbk-steps .s.done{ color:var(--green-d); border-bottom-color:var(--green); }

/* body */
.axbk-body{ padding:18px 20px 20px; }
.axbk-pane{ display:none; }
.axbk-pane.on{ display:block; animation:axbkfade .25s ease; }
@keyframes axbkfade{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }

.axbk label.fld{ display:block; font-size:11px; letter-spacing:.06em; text-transform:uppercase; font-weight:700; color:var(--muted); margin:14px 0 6px; }
.axbk label.fld:first-child{ margin-top:0; }
.axbk select, .axbk input[type=text]{
  width:100%; height:44px; padding:0 12px; font-size:14px; font-family:inherit; color:var(--ink);
  border:1px solid var(--line); border-radius:9px; background:var(--bg); appearance:none; -webkit-appearance:none;
}
.axbk select{ background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' fill='none' stroke='%2300302B' stroke-width='1.6'/></svg>"); background-repeat:no-repeat; background-position:right 14px center; }
.axbk select:focus, .axbk input:focus{ outline:none; border-color:var(--green); box-shadow:0 0 0 3px rgba(86,173,109,.18); }

/* hotel class */
.axbk-class{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; }
.axbk-class .opt{ border:1px solid var(--line); border-radius:9px; padding:10px 6px; text-align:center; cursor:pointer; transition:.15s; }
.axbk-class .opt .t{ font-size:12.5px; font-weight:700; color:var(--pine); }
.axbk-class .opt .p{ font-size:11px; color:var(--muted); margin-top:2px; }
.axbk-class .opt.sel{ border-color:var(--green); background:rgba(86,173,109,.08); box-shadow:0 0 0 2px rgba(86,173,109,.25) inset; }

/* steppers */
.axbk-row{ display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line); }
.axbk-row:last-of-type{ border-bottom:none; }
.axbk-row .lab{ font-size:14px; font-weight:600; }
.axbk-row .lab small{ display:block; font-weight:400; font-size:11.5px; color:var(--muted); }
.axbk-step{ display:flex; align-items:center; gap:12px; }
.axbk-step button{ width:30px; height:30px; border-radius:50%; border:1px solid var(--line); background:var(--soft); font-size:18px; line-height:1; color:var(--pine); cursor:pointer; font-family:inherit; }
.axbk-step button:hover{ border-color:var(--green); color:var(--green-d); }
.axbk-step .n{ min-width:18px; text-align:center; font-weight:700; font-size:15px; }

/* total */
.axbk-total{ background:var(--soft); border-radius:10px; padding:12px 14px; margin-top:16px; }
.axbk-total .l{ display:flex; justify-content:space-between; font-size:13px; color:var(--muted); padding:3px 0; }
.axbk-total .l.big{ font-size:17px; font-weight:800; color:var(--ink); border-top:1px solid var(--line); margin-top:6px; padding-top:9px; }
.axbk-total .l.big span:last-child{ color:var(--pine); }

/* buttons */
.axbk-btn{ display:block; width:100%; height:50px; margin-top:16px; border:none; border-radius:10px; background:var(--green); color:#fff; font-size:15px; font-weight:700; font-family:inherit; letter-spacing:.02em; cursor:pointer; transition:.15s; }
.axbk-btn:hover{ background:var(--green-d); }
.axbk-btn.alt{ background:transparent; color:var(--pine); height:auto; margin-top:10px; font-size:13px; font-weight:600; }
.axbk-btn.alt:hover{ text-decoration:underline; background:transparent; }
.axbk-btn:disabled{ opacity:.5; cursor:not-allowed; }

/* card grid */
.axbk-cardgrid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.axbk-cardgrid .full{ grid-column:1 / -1; }
.axbk-secure{ display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--muted); margin-top:12px; }
.axbk-secure svg{ flex:0 0 auto; }
.axbk-demo{ font-size:11px; color:var(--muted); text-align:center; margin-top:10px; font-style:italic; }

/* processing + confirmation */
.axbk-proc{ text-align:center; padding:30px 10px; }
.axbk-spin{ width:42px; height:42px; margin:0 auto 16px; border:3px solid var(--line); border-top-color:var(--green); border-radius:50%; animation:axbkspin .8s linear infinite; }
@keyframes axbkspin{ to{ transform:rotate(360deg); } }
.axbk-proc p{ font-size:14px; color:var(--muted); }

.axbk-done{ text-align:center; padding:8px 4px 4px; }
.axbk-check{ width:60px; height:60px; margin:0 auto 14px; border-radius:50%; background:var(--green); display:flex; align-items:center; justify-content:center; }
.axbk-done h3{ font-size:21px; font-weight:800; color:var(--pine); margin:0 0 6px; }
.axbk-done .ref{ display:inline-block; background:var(--soft); border:1px dashed var(--line); border-radius:8px; padding:6px 12px; font-size:13px; font-weight:700; letter-spacing:.05em; color:var(--ink); margin:6px 0 14px; }
.axbk-done .msg{ font-size:13.5px; color:var(--muted); line-height:1.55; }
.axbk-recap{ text-align:left; background:var(--soft); border-radius:10px; padding:12px 14px; margin:16px 0 0; font-size:13px; }
.axbk-recap .l{ display:flex; justify-content:space-between; gap:14px; padding:3px 0; color:var(--muted); }
.axbk-recap .l b{ color:var(--ink); font-weight:700; text-align:right; }
.axbk-recap .l.trip{ flex-direction:column; gap:2px; align-items:flex-start; padding-bottom:8px; margin-bottom:6px; border-bottom:1px solid var(--line); }
.axbk-recap .l.trip b{ text-align:left; }

/* optional extras */
.axbk-extras-wrap{margin-top:4px;}
.axbk-extras{display:flex;flex-direction:column;gap:7px;}
.axbk-xrow{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:.15s;font-size:13px;}
.axbk-xrow:hover{border-color:var(--green);background:rgba(86,173,109,.05);}
.axbk-xrow input{width:17px;height:17px;accent-color:var(--green);flex:0 0 auto;cursor:pointer;}
.axbk-xrow .xn{flex:1;font-weight:600;color:var(--ink);line-height:1.25;}
.axbk-xrow .xp{flex:0 0 auto;font-weight:700;color:var(--green-d);font-size:12.5px;}
.axbk-xrow:has(input:checked){border-color:var(--green);background:rgba(86,173,109,.08);box-shadow:0 0 0 1px var(--green) inset;}

/* extras grouped by itinerary day */
.axbk-xday{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--pine);margin:14px 0 7px;padding-bottom:5px;border-bottom:1px solid var(--line);}
.axbk-xday:first-child{margin-top:0;}
.axbk-xday span{color:var(--muted);font-weight:600;text-transform:none;letter-spacing:0;}