/* ── Travclicks Technologies Demo Form ───────────────────────────────────── */
/* Brand: Blue #1a56db / #1e429f  Accent: Pink #e91e8c / Green #2dc26e     */
.tcd-form-wrap {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 14px; color: #1f2937; line-height: 1.5;
    max-width: 960px; margin: 0 auto;
}

/* ── Success ─────────────────────────────────────────────────────────────── */
.tcd-success { background:#fff; border-radius:20px; padding:48px 40px; text-align:center; box-shadow:0 12px 48px rgba(26,86,219,.12); max-width:480px; margin:0 auto; }
.tcd-success-logo { margin-bottom:16px; }
.tcd-success-logo img { max-width:200px; height:auto; }
.tcd-success-check { font-size:52px; color:#1a56db; margin-bottom:10px; }
.tcd-success h2 { margin:0 0 8px; font-size:24px; color:#1a56db; }
.tcd-success p  { color:#6b7280; margin:6px 0; }
.tcd-success-time { background:#e8f0fe; border-radius:12px; display:inline-block; padding:10px 24px; font-weight:700; font-size:17px; color:#1a56db; margin:12px 0 16px; }
.tcd-success-note { font-size:13px !important; }
.tcd-success-list { background:#f9fafb; border-radius:12px; padding:16px; text-align:left; margin-top:16px; }
.tcd-success-item { font-size:13px; color:#374151; padding:4px 0; }

/* ── Progress ─────────────────────────────────────────────────────────────── */
.tcd-progress { display:flex; align-items:center; padding:18px 28px; background:linear-gradient(135deg,#1a56db,#1e429f); border-radius:16px 16px 0 0; }
.tcd-step { display:flex; align-items:center; gap:8px; }
.tcd-step-num { width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,.22); color:rgba(255,255,255,.65); display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; flex-shrink:0; transition:all .2s; }
.tcd-step-label { font-size:13px; color:rgba(255,255,255,.6); white-space:nowrap; transition:all .2s; }
.tcd-step-active .tcd-step-num   { background:#fff; color:#1a56db; }
.tcd-step-active .tcd-step-label { color:#fff; font-weight:600; }
.tcd-step-done .tcd-step-num     { background:#e91e8c; color:#fff; }
.tcd-step-done .tcd-step-label   { color:rgba(255,255,255,.7); }
.tcd-step-line { flex:1; height:1px; background:rgba(255,255,255,.2); margin:0 10px; }

/* ── Layout ──────────────────────────────────────────────────────────────── */
.tcd-booking { background:#fff; border-radius:16px; box-shadow:0 8px 40px rgba(26,86,219,.1); overflow:hidden; }
.tcd-layout  { display:flex; min-height:480px; }

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.tcd-sidebar { width:250px; flex-shrink:0; background:#f8f9ff; border-right:1px solid #e0e8ff; padding:28px 22px; }
.tcd-brand-logo { margin-bottom:18px; }
.tcd-brand-logo img { max-width:190px; width:100%; height:auto; display:block; }
.tcd-meeting-title { font-size:15px; font-weight:700; color:#1a56db; margin:0 0 10px; line-height:1.4; }
.tcd-meta { display:flex; align-items:center; gap:6px; font-size:13px; color:#6b7280; margin-bottom:6px; }
.tcd-meta-date, .tcd-meta-time { color:#1a56db; font-weight:600; }
.tcd-divider { border-top:1px solid #dde6ff; margin:16px 0; }
.tcd-about { font-size:12px; color:#6b7280; line-height:1.6; margin:0 0 14px; }
.tcd-tz-wrap { display:flex; align-items:flex-start; gap:5px; }
.tcd-tz-label { font-size:11px; color:#9ca3af; line-height:1.4; word-break:break-all; }

/* ── Main ────────────────────────────────────────────────────────────────── */
.tcd-main { flex:1; padding:28px; min-width:0; }
.tcd-panel-title { font-size:17px; font-weight:700; color:#1a56db; margin:0 0 6px; }

/* ── Calendar ────────────────────────────────────────────────────────────── */
.tcd-step1-layout { display:flex; gap:24px; flex-wrap:wrap; margin-top:16px; }
.tcd-calendar { background:#fff; border:1px solid #dde6ff; border-radius:12px; padding:18px; min-width:270px; }
.tcd-cal-nav { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.tcd-cal-nav button { width:30px; height:30px; border:1px solid #dde6ff; background:#fff; border-radius:7px; cursor:pointer; font-size:18px; color:#374151; padding:0; display:flex; align-items:center; justify-content:center; }
.tcd-cal-nav button:hover { background:#e8f0fe; border-color:#93b4f5; }
.tcd-cal-month-label { font-weight:600; font-size:14px; color:#1a56db; }
.tcd-cal-weekdays { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; margin-bottom:6px; }
.tcd-cal-weekdays span { text-align:center; font-size:11px; font-weight:600; color:#9ca3af; padding:3px 0; }
.tcd-cal-days { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.tcd-cal-day { aspect-ratio:1; display:flex; align-items:center; justify-content:center; border-radius:7px; font-size:13px; cursor:pointer; border:none; background:transparent; color:#374151; transition:all .15s; padding:0; }
.tcd-cal-day:hover:not(.disabled):not(.selected) { background:#e8f0fe; color:#1a56db; }
.tcd-cal-day.today    { background:#fff3fc; color:#e91e8c; font-weight:600; }
.tcd-cal-day.selected { background:#1a56db; color:#fff; font-weight:700; }
.tcd-cal-day.disabled { color:#d1d5db; cursor:not-allowed; }

/* ── Slots ───────────────────────────────────────────────────────────────── */
.tcd-timeslots-wrap  { flex:1; min-width:160px; }
.tcd-timeslots-title { font-weight:600; font-size:14px; color:#1a56db; margin-bottom:10px; }
.tcd-timeslots       { max-height:320px; overflow-y:auto; padding-right:4px; }
.tcd-timeslots::-webkit-scrollbar       { width:4px; }
.tcd-timeslots::-webkit-scrollbar-thumb { background:#93b4f5; border-radius:4px; }
.tcd-slot { display:block; width:100%; padding:9px 14px; margin-bottom:6px; border:1px solid #dde6ff; border-radius:8px; background:#fff; color:#374151; font-size:13px; cursor:pointer; text-align:center; transition:all .15s; font-family:inherit; }
.tcd-slot:hover { border-color:#93b4f5; background:#e8f0fe; color:#1a56db; }
.tcd-slot.tcd-slot-selected { border-color:#1a56db; background:#1a56db; color:#fff; font-weight:600; }
.tcd-slot.tcd-slot-booked { border-color:#e5e7eb; background:#f3f4f6; color:#9ca3af; cursor:not-allowed; display:flex; align-items:center; justify-content:space-between; padding:9px 12px 9px 14px; }
.tcd-slot-booked-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; background:#fee2e2; color:#dc2626; border-radius:4px; padding:2px 6px; }
.tcd-slots-loading { font-size:13px; color:#9ca3af; text-align:center; padding:24px 12px; margin:0; }
.tcd-no-slots { font-size:13px; color:#6b7280; text-align:center; padding:20px 12px; background:#f8f9ff; border:1px dashed #c7d7fd; border-radius:8px; line-height:1.6; margin:0; }

/* ── Form ────────────────────────────────────────────────────────────────── */
.tcd-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tcd-field { display:flex; flex-direction:column; gap:5px; }
.tcd-field label { font-size:12px; font-weight:600; color:#374151; }
.tcd-field .req  { color:#ef4444; }
.tcd-field input, .tcd-field select, .tcd-field textarea { padding:9px 12px; border:1px solid #dde6ff; border-radius:8px; font-size:13px; color:#1f2937; font-family:inherit; outline:none; transition:border .15s,box-shadow .15s; background:#fff; width:100%; box-sizing:border-box; }
.tcd-field input:focus, .tcd-field select:focus, .tcd-field textarea:focus { border-color:#93b4f5; box-shadow:0 0 0 3px rgba(26,86,219,.12); }
.tcd-field textarea { resize:vertical; }

/* ── Phone ───────────────────────────────────────────────────────────────── */
.tcd-field-phone-row { grid-column:span 2; }
.tcd-phone-wrap { display:flex; align-items:center; border:1px solid #dde6ff; border-radius:8px; background:#fff; position:relative; overflow:visible; transition:border-color .15s,box-shadow .15s; }
.tcd-phone-wrap:focus-within { border-color:#93b4f5; box-shadow:0 0 0 3px rgba(26,86,219,.12); }
.tcd-country-selector { position:relative; flex-shrink:0; border-right:1px solid #dde6ff; border-radius:8px 0 0 8px; background:#f0f4ff; cursor:pointer; user-select:none; z-index:10; }
.tcd-country-selected { display:flex; align-items:center; gap:4px; padding:9px 10px; min-width:86px; box-sizing:border-box; }
.tcd-country-selector:hover .tcd-country-selected { background:#e8f0fe; }
.tcd-flag    { font-size:18px; line-height:1; flex-shrink:0; }
.tcd-dialcode { font-size:13px; font-weight:600; color:#1a56db; }
.tcd-chevron  { font-size:9px; color:#9ca3af; margin-left:2px; }
.tcd-country-dropdown { position:absolute; top:calc(100% + 4px); left:0; z-index:99999; background:#fff; border:1px solid #dde6ff; border-radius:10px; box-shadow:0 8px 32px rgba(26,86,219,.15); width:280px; overflow:hidden; }
.tcd-country-search { display:block !important; width:100% !important; padding:10px 12px !important; border:none !important; border-bottom:1px solid #f0f0f0 !important; border-radius:0 !important; font-size:13px !important; box-shadow:none !important; outline:none !important; box-sizing:border-box !important; font-family:inherit !important; }
.tcd-country-list { max-height:220px; overflow-y:auto; }
.tcd-country-list::-webkit-scrollbar       { width:4px; }
.tcd-country-list::-webkit-scrollbar-thumb { background:#93b4f5; border-radius:4px; }
.tcd-country-option { display:flex; align-items:center; gap:8px; padding:9px 12px; cursor:pointer; font-size:13px; color:#374151; transition:background .1s; }
.tcd-country-option:hover { background:#f0f4ff; }
.co-flag { font-size:18px; flex-shrink:0; }
.co-name { flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:13px; }
.co-code { font-size:12px; color:#6b7280; font-weight:600; flex-shrink:0; }
.tcd-phone-input { flex:1; min-width:0; border:none !important; border-radius:0 8px 8px 0 !important; box-shadow:none !important; padding:9px 12px !important; font-size:13px !important; outline:none !important; background:transparent !important; width:100% !important; box-sizing:border-box !important; font-family:inherit !important; color:#1f2937 !important; }

/* ── Checkboxes ──────────────────────────────────────────────────────────── */
.tcd-checkboxes { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.tcd-check { display:flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid #dde6ff; border-radius:8px; cursor:pointer; font-size:12px; color:#374151; transition:all .15s; }
.tcd-check:hover { border-color:#93b4f5; background:#e8f0fe; }
.tcd-check input { width:15px; height:15px; accent-color:#1a56db; flex-shrink:0; cursor:pointer; }
.tcd-check input:checked + span { color:#1a56db; font-weight:600; }
.tcd-check:has(input:checked) { border-color:#1a56db; background:#e8f0fe; }

/* ── Review ──────────────────────────────────────────────────────────────── */
.tcd-review-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.tcd-review-item { background:#f8f9ff; border-radius:9px; padding:9px 13px; }
.tcd-review-full { grid-column:span 2; }
.tcd-review-label { font-size:10px; font-weight:700; color:#9ca3af; text-transform:uppercase; letter-spacing:.05em; margin-bottom:3px; }
.tcd-review-value { font-size:13px; color:#1f2937; font-weight:500; }
.tcd-review-notice { margin-top:14px; background:#fff8e8; border:1px solid #fde68a; border-radius:9px; padding:11px 14px; font-size:12px; color:#92400e; }

/* ── Buttons ─────────────────────────────────────────────────────────────── */
.tcd-step-nav { display:flex; align-items:center; justify-content:space-between; margin-top:24px; padding-top:18px; border-top:1px solid #f0f0f0; }
.tcd-btn-primary { background:linear-gradient(135deg,#1a56db,#1e429f) !important; color:#fff !important; border:none !important; border-radius:10px !important; padding:11px 26px !important; font-size:14px !important; font-weight:600 !important; cursor:pointer !important; transition:opacity .15s !important; font-family:inherit !important; }
.tcd-btn-primary:disabled { opacity:.4 !important; cursor:not-allowed !important; }
.tcd-btn-primary:hover:not(:disabled) { opacity:.87 !important; }
.tcd-btn-secondary { background:#fff !important; color:#374151 !important; border:1px solid #dde6ff !important; border-radius:10px !important; padding:10px 20px !important; font-size:14px !important; cursor:pointer !important; font-family:inherit !important; }
.tcd-btn-secondary:hover { background:#f8f9ff !important; }
.tcd-error-msg { background:#fee2e2; border:1px solid #fca5a5; border-radius:8px; padding:10px 14px; color:#991b1b; font-size:13px; margin-top:12px; }

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width:720px) {
    .tcd-layout { flex-direction:column; }
    .tcd-sidebar { width:auto; border-right:none; border-bottom:1px solid #e0e8ff; padding:20px 18px; }
    .tcd-main { padding:20px 16px; }
    .tcd-form-grid, .tcd-checkboxes, .tcd-review-grid { grid-template-columns:1fr; }
    .tcd-review-full { grid-column:span 1; }
    .tcd-step1-layout { flex-direction:column; }
    .tcd-progress { padding:14px 16px; border-radius:12px 12px 0 0; flex-wrap:wrap; gap:4px; }
    .tcd-step-line { display:none; }
    .tcd-field-phone-row { grid-column:span 1; }
    .tcd-country-dropdown { width:240px; }
    .tcd-brand-logo img { max-width:150px; }
}