/* Hameldon Bookings - manager page */
.hb-manage{
  --a:var(--accent,var(--hb-accent,#B8933F));
  --i:var(--ink,var(--hb-ink,#1C1814));
  --c:var(--cream,var(--hb-cream,#FBF8F2));
  --line:var(--line,#E7DFD1);
  --body:var(--body,#4A423A);
  --muted:var(--muted,#8A8073);
  max-width:820px; margin:0 auto;
  font-family:var(--font-body,'Figtree',sans-serif); color:var(--body);
}
.hb-manage--gate{ max-width:420px; background:#fff; border:1px solid var(--line); border-radius:20px; padding:32px; box-shadow:0 16px 36px rgba(28,24,20,.08); }
.hb-manage--gate h3{ font-family:var(--font-head,serif); color:var(--i); margin:0 0 18px; }

.hb-manage-head{ display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.hb-manage-head h3{ font-family:var(--font-head,serif); font-weight:500; color:var(--i); margin:0; }
.hb-manage-count{ background:var(--a); color:var(--i); font-weight:600; font-size:.8rem; border-radius:999px; padding:3px 11px; }
.hb-manage-empty{ color:var(--muted); }

.hb-manage-list{ display:flex; flex-direction:column; gap:12px; }
.hb-bk{ display:grid; grid-template-columns:120px 1fr auto; gap:16px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 18px; box-shadow:0 1px 2px rgba(28,24,20,.04); }
.hb-bk.is-cancelled{ opacity:.55; }
.hb-bk-when strong{ display:block; font-family:var(--font-head,serif); color:var(--i); font-size:1.05rem; }
.hb-bk-when span{ color:var(--muted); font-size:.9rem; }
.hb-bk-who{ display:flex; flex-direction:column; gap:2px; }
.hb-bk-who strong{ color:var(--i); }
.hb-bk-who span{ color:var(--muted); font-size:.88rem; }
.hb-bk-cf{ color:var(--body)!important; }
.hb-bk-cancel{ background:none; border:1.5px solid var(--line); color:var(--i); border-radius:999px; padding:8px 16px; font:inherit; font-weight:600; font-size:.85rem; cursor:pointer; transition:border-color .2s ease,color .2s ease; }
.hb-bk-cancel:hover{ border-color:#b23b3b; color:#b23b3b; }
.hb-bk-tag{ color:#b23b3b; font-size:.82rem; font-weight:600; }
.hb-error{ color:#b23b3b; }

@media (max-width:600px){
  .hb-bk{ grid-template-columns:1fr; gap:8px; }
  .hb-bk-actions{ justify-self:start; }
}

.hb-clear-cancelled{
  margin-left:auto; background:none; border:1.5px solid var(--line,#E7DFD1);
  color:var(--muted,#8A8073); border-radius:999px; padding:7px 15px;
  font:inherit; font-weight:600; font-size:.82rem; cursor:pointer;
  transition:border-color .2s ease,color .2s ease;
}
.hb-clear-cancelled:hover{ border-color:#b23b3b; color:#b23b3b; }

/* ---- v1.4 front-end management ---- */
.hb-add-booking{ margin-left:auto; background:var(--a,#B8933F); color:#fff; border:0; border-radius:999px; padding:9px 18px; font:inherit; font-weight:600; font-size:.9rem; cursor:pointer; }
.hb-add-booking:hover{ filter:brightness(.94); }
.hb-manage-head .hb-clear-cancelled{ margin-left:10px; }
.hb-manage-msg{ background:#eef7f0; border:1px solid #cfe6d6; color:#2f6b45; border-radius:10px; padding:10px 14px; margin-bottom:14px; font-size:.92rem; }

/* card tweaks */
.hb-bk{ position:relative; }
.hb-bk-type{ display:inline-flex; align-items:center; gap:6px; font-size:.78rem; font-weight:600; color:var(--muted,#8A8073); margin-bottom:2px; }
.hb-bk-type::before{ content:""; width:9px; height:9px; border-radius:50%; background:var(--dot,#B8933F); }
.hb-bk-contact{ font-size:.88rem; color:var(--muted,#8A8073); }
.hb-bk-note{ font-style:italic; color:var(--muted,#8A8073); font-size:.86rem; }
.hb-bk--cancelled,.hb-bk--no-show{ opacity:.6; }

/* status badge */
.hb-bk-status{ font-size:.72rem; font-weight:600; padding:3px 9px; border-radius:999px; color:#fff; }
.hb-bk-status--confirmed{ background:#2271b1; }
.hb-bk-status--completed{ background:#3f8f5f; }
.hb-bk-status--no-show{ background:#b23b3b; }
.hb-bk-status--cancelled{ background:#8a8a8a; }

/* actions menu */
.hb-bk-actions{ display:flex; align-items:center; gap:10px; position:relative; }
.hb-bk-menu-btn{ background:none; border:0; font-size:1.3rem; line-height:1; cursor:pointer; color:var(--i,#1C1814); padding:4px 8px; border-radius:8px; }
.hb-bk-menu-btn:hover{ background:var(--c,#F0E9DA); }
.hb-bk-menu{ position:absolute; top:100%; right:0; z-index:20; background:#fff; border:1px solid var(--line,#E7DFD1); border-radius:12px; box-shadow:0 12px 30px rgba(28,24,20,.22); min-width:200px; padding:6px; }
/* when body-mounted (open), JS sets position:fixed + top/left inline */
body > .hb-bk-menu{ position:fixed !important; z-index:100000 !important; }
.hb-bk-menu button{ display:block; width:100%; text-align:left; background:none; border:0; padding:10px 12px; border-radius:8px; font:inherit; font-size:.9rem; color:var(--i,#1C1814); cursor:pointer; }
.hb-bk-menu button:hover{ background:var(--c,#F0E9DA); }

/* modal */
.hb-modal{ position:fixed !important; inset:0 !important; z-index:100000 !important; background:rgba(28,24,20,.55); display:flex; align-items:flex-start; justify-content:center; padding:24px 16px; overflow-y:auto; }
.hb-modal[hidden]{ display:none !important; }
.hb-modal-card{ background:#fff; border-radius:18px; width:100%; max-width:480px; box-shadow:0 30px 70px rgba(28,24,20,.3); margin:auto; }
.hb-modal-head{ display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border-bottom:1px solid var(--line,#E7DFD1); }
.hb-modal-head h3{ margin:0; font-family:var(--font-head,serif); font-weight:500; color:var(--i,#1C1814); }
.hb-modal-close{ background:none; border:0; font-size:1.6rem; line-height:1; cursor:pointer; color:var(--muted,#8A8073); }
.hb-modal-form{ padding:20px 22px; }
.hb-mf{ display:block; font-weight:600; color:var(--i,#1C1814); font-size:.86rem; margin-bottom:14px; }
.hb-mf input,.hb-mf select,.hb-mf textarea{ display:block; width:100%; box-sizing:border-box; margin-top:6px; font:inherit; font-size:1rem; font-weight:400; color:var(--i,#1C1814); background:var(--c,#FBF8F2); border:1.5px solid var(--line,#E7DFD1); border-radius:10px; padding:12px 14px; }
.hb-mf input:focus,.hb-mf select:focus,.hb-mf textarea:focus{ outline:none; border-color:var(--a,#B8933F); box-shadow:0 0 0 3px rgba(184,147,63,.15); }
.hb-mf-row{ display:flex; gap:12px; }
.hb-mf-row .hb-mf{ flex:1; }
.hb-mf-check{ display:flex; align-items:center; gap:8px; font-size:.9rem; margin:4px 0 16px; }
.hb-modal-error{ color:#b23b3b; font-size:.9rem; margin:0 0 12px; }
.hb-modal-actions{ display:flex; gap:12px; justify-content:flex-end; }
.hb-modal-cancel{ background:none; border:1.5px solid var(--line,#E7DFD1); color:var(--i,#1C1814); border-radius:999px; padding:12px 20px; font:inherit; font-weight:600; cursor:pointer; }
.hb-modal-save{ background:var(--i,#1C1814); color:#fff; border:0; border-radius:999px; padding:12px 24px; font:inherit; font-weight:600; cursor:pointer; }
.hb-modal-save:disabled{ opacity:.6; }

@media (max-width:600px){
  .hb-manage-head{ flex-wrap:wrap; }
  .hb-add-booking{ margin-left:0; }
  .hb-mf-row{ flex-direction:column; gap:0; }
}

/* quick cancel / reopen button on card */
.hb-bk-quick{ background:none; border:1.5px solid var(--line,#E7DFD1); border-radius:999px; padding:7px 15px; font:inherit; font-weight:600; font-size:.82rem; cursor:pointer; transition:border-color .2s ease,color .2s ease,background .2s ease; }
.hb-bk-quick--cancel{ color:#b23b3b; }
.hb-bk-quick--cancel:hover{ background:#b23b3b; border-color:#b23b3b; color:#fff; }
.hb-bk-quick--reopen{ color:#2271b1; }
.hb-bk-quick--reopen:hover{ background:#2271b1; border-color:#2271b1; color:#fff; }