/* Book Appointment page, mirrors support-requests.css look. */
#appointments-page.page-section.active { justify-content: flex-start; align-items: stretch; }
#appointments-page .ap-tabs { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1rem; }
#appointments-page .ap-tab { background:#fff; border:2px solid #e0e0e0; color:#667eea; padding:.6rem 1.1rem; border-radius:25px; font-size:.9rem; font-weight:600; cursor:pointer; }
#appointments-page .ap-tab.active { background:linear-gradient(135deg,#667eea,#764ba2); border-color:transparent; color:#fff; }
#appointments-page .ap-panel { display:none; }
#appointments-page .ap-panel.active { display:block; }
#appointments-page .ap-card { background:#fff; border-radius:12px; padding:1rem; margin-bottom:.9rem; box-shadow:0 2px 10px rgba(0,0,0,.08); }
#appointments-page .ap-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:.5rem; margin-bottom:.4rem; }
#appointments-page .ap-h { font-size:1.05rem; font-weight:700; color:#333; margin:.8rem 0 .4rem; }
#appointments-page .ap-label { display:block; font-size:.85rem; font-weight:600; color:#555; margin:.7rem 0 .25rem; }
#appointments-page .ap-input { width:100%; box-sizing:border-box; padding:.6rem .75rem; border:1px solid #d5d5d5; border-radius:8px; font-size:.95rem; font-family:inherit; }
#appointments-page .ap-chips { display:flex; flex-wrap:wrap; gap:.4rem; }
#appointments-page .ap-chip { background:#fff; border:1.5px solid #cfd3f5; color:#667eea; padding:.4rem .8rem; border-radius:18px; font-size:.85rem; font-weight:600; cursor:pointer; }
#appointments-page .ap-chip.active, #appointments-page .ap-chip.selected { background:#667eea; color:#fff; border-color:#667eea; }
#appointments-page .ap-btn { background:linear-gradient(135deg,#667eea,#764ba2); color:#fff; border:none; padding:.65rem 1.2rem; border-radius:8px; font-weight:600; cursor:pointer; margin-top:.8rem; }
#appointments-page .ap-btn:disabled { opacity:.6; cursor:not-allowed; }
#appointments-page .ap-link { background:none; border:none; color:#667eea; font-weight:600; cursor:pointer; padding:.3rem .5rem; }
#appointments-page .ap-danger { color:#c0392b; }
#appointments-page .ap-note { background:#fff8e6; border-left:4px solid #f39c12; padding:.6rem .8rem; border-radius:6px; font-size:.85rem; color:#7a5a00; margin:.6rem 0; }
#appointments-page .ap-hint { font-size:.8rem; color:#888; }
#appointments-page .ap-empty { text-align:center; color:#888; padding:1.5rem; }
#appointments-page .ap-msg { margin-top:.6rem; font-size:.9rem; }
#appointments-page .ap-status { font-size:.75rem; font-weight:700; padding:.2rem .6rem; border-radius:12px; background:#eee; color:#555; text-transform:capitalize; white-space:nowrap; }
#appointments-page .ap-status-submitted { background:#fff3cd; color:#8a6d00; }
#appointments-page .ap-status-approved { background:#d4edda; color:#1e6b34; }
#appointments-page .ap-status-rejected, #appointments-page .ap-status-cancelled { background:#f8d7da; color:#8a1f2b; }
#appointments-page .ap-day { margin-bottom:.7rem; }
#appointments-page .ap-day-title { font-size:.85rem; font-weight:700; color:#555; margin-bottom:.3rem; }
#appointments-page .ap-actions { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.5rem; }
#appointments-page .ap-timeline { margin-top:.6rem; border-top:1px solid #eee; padding-top:.5rem; }
#appointments-page .ap-tl-row { font-size:.82rem; color:#555; padding:.2rem 0; }
#appointments-page .ap-rule { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; margin-bottom:.4rem; }

#appointments-page .ap-status-completed { background:#d1ecf1; color:#0c5460; }
#appointments-page .ap-status-no_show { background:#e2e3e5; color:#383d41; }
#appointments-page .ap-local { color:#777; font-size:.8rem; }