/* ============================================================
   Camps and events: the booking form and the staff card.
   Scoped under .sm-ev and .sm-evs. Every control is stated in
   full, because the theme styles inputs and buttons site-wide.
   Colours read the dashboard tokens where the new hub gives
   them, with light values everywhere else.
   ============================================================ */

.sm-ev, .sm-evs{
  --ev-ink:var(--smd-ink,#16232c); --ev-muted:var(--smd-muted,#4a5761);
  --ev-line:var(--smd-line,#e1ddd2); --ev-card:var(--smd-card,#ffffff);
  --ev-soft:var(--smd-card-2,#f7f5ef); --ev-teal:#0a7f7f; --ev-teal-hi:#00b3b3; --ev-red:#b42318;
  font-size:16px; line-height:1.55; color:var(--ev-ink);
}

/* ---------- about ---------- */
.sm-ev-about p{margin:0 0 14px}
.sm-ev-facts{display:grid; grid-template-columns:max-content 1fr; gap:6px 18px; margin:0 0 20px}
.sm-ev-facts dt{font-weight:700; color:var(--ev-muted); font-size:14px; text-transform:uppercase; letter-spacing:.06em; padding-top:2px}
.sm-ev-facts dd{margin:0}

.sm-ev-done{margin:0 0 16px; padding:12px 14px; border-radius:6px; border-left:4px solid var(--ev-teal); background:rgba(0,179,179,.1)}
.sm-ev-error{margin:0 0 16px; padding:12px 14px; border-radius:6px; border-left:4px solid var(--ev-red); background:rgba(180,35,24,.08)}
.sm-ev-closed{margin:0; padding:14px; border:1px dashed var(--ev-line); border-radius:6px; color:var(--ev-muted)}
.sm-ev-admin{margin:8px 0 0; font-size:14px; color:var(--ev-red)}

.sm-ev-mine{margin:0 0 18px; padding:12px 14px; border:1px solid var(--ev-line); border-radius:6px; background:var(--ev-soft)}
.sm-ev-mine ul{margin:6px 0 0; padding-left:18px}
.sm-ev .sm-ev-mine a{color:var(--ev-teal); text-decoration:underline; font-weight:600}
.sm-ev .sm-ev-mine a:hover{color:var(--ev-teal-hi)}
.sm-ev-sub{margin:0; font-weight:700}
.sm-ev-tag{display:inline-block; margin-left:6px; padding:1px 9px; border-radius:999px; font-size:12px; font-weight:700; line-height:1.7; background:rgba(180,35,24,.1); color:var(--ev-red)}
.sm-ev-tag.is-ok{background:rgba(0,179,179,.14); color:var(--ev-teal)}

/* ---------- form ---------- */
.sm-ev-form{margin:0}
.sm-ev-set{margin:0 0 22px; padding:18px; border:1px solid var(--ev-line); border-radius:8px; background:var(--ev-card)}
/* The theme gives legends full width and a rule; a legend here sits in the border. */
.sm-ev .sm-ev-set legend{width:auto; float:none; margin:0; padding:0 8px; border:0; font-weight:800; font-size:17px; line-height:1.3}
.sm-ev-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 16px}
.sm-ev-field{display:block; margin:0 0 12px}
.sm-ev-label{display:block; margin:0 0 5px; font-weight:600; font-size:15px}
.sm-ev-hint{display:block; margin:4px 0 0; font-size:14px; color:var(--ev-muted)}

.sm-ev .sm-ev-field input,
.sm-ev .sm-ev-field textarea{
  display:block; width:100%; box-sizing:border-box; margin:0;
  min-height:44px; padding:10px 12px; line-height:1.5;
  font-family:inherit; font-size:16px; color:#16232c;
  background:#fff; border:1px solid #c9c4b8; border-radius:4px; box-shadow:none;
}
.sm-ev .sm-ev-field textarea{min-height:64px; resize:vertical}
.sm-ev .sm-ev-field input:focus,
.sm-ev .sm-ev-field textarea:focus{outline:none; border-color:var(--ev-teal); box-shadow:0 0 0 3px rgba(0,179,179,.2)}

.sm-ev-days{display:grid; gap:10px}
.sm-ev-day, .sm-ev-child{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:12px 14px; border:1px solid var(--ev-line); border-radius:6px; cursor:pointer; background:var(--ev-soft);
}
.sm-ev-day:has(input:checked), .sm-ev-child:has(input:checked){border-color:var(--ev-teal); box-shadow:inset 3px 0 0 var(--ev-teal)}
.sm-ev-day-name{font-weight:700}
.sm-ev-day-left{margin-left:auto; font-size:14px; color:var(--ev-muted)}
.sm-ev-day.is-full .sm-ev-day-left{color:var(--ev-red); font-weight:600}
.sm-ev-child .sm-ev-hint{margin:0 0 0 auto}
.sm-ev-tick{display:flex; align-items:flex-start; gap:10px; margin:0 0 10px; cursor:pointer}
.sm-ev input[type="checkbox"]{width:20px; height:20px; margin:2px 0 0; flex:none; accent-color:var(--ev-teal)}

.sm-ev-kid{padding:0 0 14px; margin:0 0 14px; border-bottom:1px solid var(--ev-line)}
.sm-ev-kid-head{display:flex; align-items:center; justify-content:space-between; margin:0 0 8px}

/* ---------- terms ---------- */
.sm-ev-terms{margin:0 0 16px}
.sm-ev-terms-title{margin:0 0 6px; font-weight:700}
.sm-ev-terms-scroll{
  max-height:260px; overflow-y:auto; padding:12px 16px;
  border:1px solid var(--ev-line); border-radius:6px; background:var(--ev-soft); font-size:14px; line-height:1.6;
}
.sm-ev-terms-scroll p{margin:0 0 10px}
/* The document's indented clauses and its definitions table, held to the
   box's own text so the theme's quote and table styles cannot restyle them. */
.sm-ev-terms .sm-ev-terms-scroll *{color:inherit; font-family:inherit}
.sm-ev-terms .sm-ev-terms-scroll p,
.sm-ev-terms .sm-ev-terms-scroll li{font-size:inherit; line-height:inherit; font-style:normal}
.sm-ev-terms .sm-ev-terms-scroll em{font-style:italic}
.sm-ev-terms .sm-ev-terms-indent{margin:0 0 10px; padding:0 0 0 18px; border:0; background:none; font-size:inherit; quotes:none}
.sm-ev-terms .sm-ev-terms-scroll table{width:100%; margin:0 0 12px; border-collapse:collapse; font-size:inherit; background:none}
.sm-ev-terms .sm-ev-terms-scroll td, .sm-ev-terms .sm-ev-terms-scroll th{padding:6px 8px; vertical-align:top; text-align:left; border:1px solid rgba(0,0,0,.14); background:none}
.sm-ev-terms-scroll ul, .sm-ev-terms-scroll ol{margin:0 0 10px; padding-left:20px}
.sm-ev-terms-accept{display:flex; align-items:flex-start; gap:10px; margin:10px 0 0; cursor:pointer}
.sm-ev-terms-hint{margin:6px 0 0; font-size:13px; color:var(--ev-muted)}

/* ---------- total and buttons ---------- */
.sm-ev-total{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; margin:0 0 16px; font-size:18px}
.sm-ev-total strong{font-size:22px}

.sm-ev .sm-ev-submit, .sm-ev .sm-ev-submit:hover, .sm-ev .sm-ev-submit:focus, .sm-ev .sm-ev-submit:active,
.sm-ev .sm-ev-add, .sm-ev .sm-ev-add:hover, .sm-ev .sm-ev-add:focus, .sm-ev .sm-ev-add:active,
.sm-ev .sm-ev-remove, .sm-ev .sm-ev-remove:hover, .sm-ev .sm-ev-remove:focus, .sm-ev .sm-ev-remove:active,
.sm-evs .sm-evs-btn, .sm-evs .sm-evs-btn:hover, .sm-evs .sm-evs-btn:focus, .sm-evs .sm-evs-btn:active{
  display:inline-block; margin:0; padding:10px 20px; min-height:44px; line-height:1.4;
  font-family:inherit; font-size:15px; font-weight:600; letter-spacing:normal; text-transform:none; text-decoration:none;
  border:1px solid var(--ev-teal); border-radius:3px; box-shadow:none; text-shadow:none; transform:none;
  background:var(--ev-teal); color:#fff; cursor:pointer;
}
.sm-ev .sm-ev-submit:hover, .sm-ev .sm-ev-submit:focus-visible,
.sm-evs .sm-evs-btn:hover, .sm-evs .sm-evs-btn:focus-visible{background:var(--ev-teal-hi); border-color:var(--ev-teal-hi)}
.sm-ev .sm-ev-add, .sm-ev .sm-ev-remove, .sm-evs .sm-evs-btn.is-quiet{background:transparent; color:var(--ev-teal)}
.sm-ev .sm-ev-remove{min-height:36px; padding:6px 12px; font-size:14px}
.sm-ev .sm-ev-add:hover, .sm-ev .sm-ev-remove:hover, .sm-evs .sm-evs-btn.is-quiet:hover{background:var(--ev-teal); color:#fff}
.sm-ev [disabled], .sm-evs [disabled]{opacity:.6; cursor:progress}

/* ---------- staff card ---------- */
.sm-evs-warn{margin:0 0 16px; padding:12px 14px; border-left:4px solid var(--ev-red); border-radius:6px; background:rgba(180,35,24,.08)}
.sm-evs-event{margin:0 0 24px}
.sm-evs .sm-evs-title{margin:0; font-size:18px; font-weight:800; line-height:1.3; color:var(--ev-ink)}
.sm-evs .sm-evs-meta{margin:2px 0 14px; color:var(--ev-muted)}
/* Switches stacked on the left; the fields and Save share one baseline. */
.sm-evs .sm-evs-controls{
  display:flex; flex-wrap:wrap; align-items:flex-end; gap:14px 20px; box-sizing:border-box;
  margin:0 0 18px; padding:16px; border:1px solid var(--ev-line); border-radius:8px; background:var(--ev-soft);
}
.sm-evs-switches{display:flex; flex-direction:column; gap:10px; margin-right:auto; align-self:center}
.sm-evs .sm-evs-switch{display:flex; align-items:center; gap:10px; margin:0; cursor:pointer; line-height:1.4}
.sm-evs input[type="checkbox"]{width:20px; height:20px; margin:0; accent-color:var(--ev-teal)}
.sm-evs-num{display:flex; flex-direction:column; gap:4px; font-size:14px; font-weight:600}
.sm-evs .sm-evs-num{margin:0}
.sm-evs .sm-evs-num input{
  height:44px; min-height:44px; padding:8px 10px; line-height:1.5; box-sizing:border-box; margin:0;
  font-family:inherit; font-size:15px; color:#16232c; background:#fff; border:1px solid #c9c4b8; border-radius:4px;
}
.sm-evs .sm-evs-num input[type="number"]{width:110px}
.sm-evs-day{margin:0 0 16px}
.sm-evs-day-head{display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin:0 0 8px}
/* Held at the right in every state: the button rules above reset margin on
   hover, which slid the button out from under the pointer. */
.sm-evs .sm-evs-day-head .sm-evs-btn,
.sm-evs .sm-evs-day-head .sm-evs-btn:hover,
.sm-evs .sm-evs-day-head .sm-evs-btn:focus,
.sm-evs .sm-evs-day-head .sm-evs-btn:active{margin-left:auto}
.sm-evs-wrap{overflow-x:auto}
.sm-evs-table{width:100%; border-collapse:collapse; font-size:15px}
.sm-evs-table th{text-align:left; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--ev-muted); padding:8px 10px; border-bottom:2px solid var(--ev-line)}
.sm-evs-table td{padding:10px; border-bottom:1px solid var(--ev-line)}
.sm-evs-pill{display:inline-flex; align-items:center; min-height:24px; padding:2px 10px; border-radius:999px; font-size:12px; font-weight:700; line-height:1.4; white-space:nowrap}
.sm-evs-pill.is-ok{background:rgba(0,179,179,.14); color:var(--ev-teal)}
.sm-evs-pill.is-wait{background:rgba(180,35,24,.1); color:var(--ev-red)}
.sm-evs .sm-evs-btn.is-small, .sm-evs .sm-evs-btn.is-small:hover{min-height:32px; padding:4px 12px; font-size:13px}
.sm-evs-empty{margin:0; color:var(--ev-muted)}
/* Move and Cancel side by side on a roster row */
.sm-evs-table td.sm-evs-acts{white-space:nowrap}
.sm-evs-acts-in{display:flex; gap:8px; align-items:center; justify-content:flex-end}
.sm-evs .sm-evs-move{min-height:32px; height:auto; padding:5px 28px 5px 10px; font-size:13px; line-height:1.5; border:1px solid var(--ev-teal); border-radius:6px; background-color:#fff; color:var(--ev-teal); font-weight:600; cursor:pointer; max-width:220px}
.sm-evs-admin .sm-evs-hint{flex:1 1 260px; align-self:center; font-size:14px; color:var(--ev-muted)}
.sm-evs-msg{margin:6px 0 0; min-height:1.5em; color:var(--ev-muted)}

@media (max-width:700px){
  .sm-ev-grid{grid-template-columns:1fr}
  .sm-ev-facts{grid-template-columns:1fr}
  .sm-ev-set{padding:14px}
  .sm-ev-day-left, .sm-ev-child .sm-ev-hint{margin-left:0; flex-basis:100%}
}

/* A button carrying the hidden attribute stays hidden, whatever the button rules above say. */
.sm-ev [hidden], .sm-evs [hidden]{display:none !important}

/* ---------- coordinator view: each child opens onto their details ---------- */
.sm-evs-view .sm-evs-event + .sm-evs-event{margin-top:28px}
.sm-evs-kids{display:flex; flex-direction:column; gap:8px}
.sm-evs-kid{border:1px solid var(--ev-line); border-radius:6px; background:var(--ev-card)}
.sm-evs-kid > summary{
  display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px;
  min-height:48px; padding:10px 14px; line-height:1.5; cursor:pointer; list-style:none;
}
.sm-evs-kid > summary::-webkit-details-marker{display:none}
.sm-evs-kid > summary::before{
  content:""; flex:none; width:8px; height:8px; margin-right:2px;
  border-right:2px solid var(--ev-muted); border-bottom:2px solid var(--ev-muted);
  transform:rotate(-45deg); transition:transform .2s ease;
}
.sm-evs-kid[open] > summary::before{transform:rotate(45deg)}
.sm-evs-kid > summary > span:not(.sm-evs-pill){color:var(--ev-muted); font-size:15px}
.sm-evs-kid > summary .sm-evs-kid-name{color:var(--ev-ink); font-weight:700; font-size:16px}
.sm-evs-kid > summary .sm-evs-pill{margin-left:auto}
.sm-evs-kid > summary:hover{background:var(--ev-soft)}
.sm-evs-facts{
  display:grid; grid-template-columns:max-content 1fr; gap:6px 18px;
  margin:0; padding:12px 14px 16px 36px; border-top:1px solid var(--ev-line);
}
.sm-evs-facts dt{font-weight:700; color:var(--ev-muted); font-size:13px; text-transform:uppercase; letter-spacing:.06em; padding-top:3px}
.sm-evs-facts dd{margin:0; overflow-wrap:anywhere}
@media (max-width:640px){
  .sm-evs-facts{grid-template-columns:1fr; padding-left:14px}
  .sm-evs-facts dd{margin-bottom:6px}
}

/* ---------- message families ---------- */
.sm-evs-compose{margin-top:18px; border:1px solid var(--ev-line); border-radius:6px; background:var(--ev-card)}
.sm-evs-compose > summary{
  display:flex; align-items:center; gap:10px; min-height:48px; padding:10px 14px;
  font-weight:700; line-height:1.5; cursor:pointer; list-style:none; color:var(--ev-teal);
}
.sm-evs-compose > summary::-webkit-details-marker{display:none}
.sm-evs-compose > summary::before{
  content:""; flex:none; width:8px; height:8px;
  border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(-45deg); transition:transform .2s ease;
}
.sm-evs-compose[open] > summary::before{transform:rotate(45deg)}
.sm-evs-compose-body{display:flex; flex-direction:column; gap:14px; padding:14px 16px 18px; border-top:1px solid var(--ev-line)}
.sm-evs-compose-row{display:flex; flex-direction:column; gap:6px; margin:0}
.sm-evs-label{font-weight:700; font-size:14px; color:var(--ev-muted)}
.sm-evs-checks{display:flex; flex-wrap:wrap; gap:8px 20px}
.sm-evs-check{display:inline-flex; align-items:center; gap:8px; min-height:32px; line-height:1.5}
.sm-evs-check input{width:18px; height:18px; margin:0; accent-color:var(--ev-teal)}
.sm-evs .sm-evs-input,
.sm-evs .sm-evs-input:focus{
  display:block; width:100%; min-height:44px; margin:0; padding:10px 12px;
  font-family:inherit; font-size:16px; line-height:1.5; color:var(--ev-ink);
  background:var(--ev-card); border:1px solid var(--ev-line); border-radius:4px; box-shadow:none;
}
.sm-evs select.sm-evs-input{height:auto; padding-right:36px}
.sm-evs textarea.sm-evs-input{min-height:240px; resize:vertical}
.sm-evs .sm-evs-input:focus{outline:2px solid var(--ev-teal-hi); outline-offset:1px}
.sm-evs-hint{margin:0; font-size:14px; color:var(--ev-muted)}
.sm-evs-compose-acts{display:flex; flex-wrap:wrap; align-items:center; gap:10px}
.sm-evs-msg-status{font-size:14px; color:var(--ev-muted)}
.sm-evs-preview{border:1px solid var(--ev-line); border-radius:6px; overflow:hidden; background:#f5e9d6}
.sm-evs-preview iframe{display:block; width:100%; height:720px; border:0; background:#fff}

/* Discount codes: one box per child, checked with Apply */
.sm-ev-child-row{margin-bottom:12px}
.sm-ev-child-row .sm-ev-child{margin-bottom:6px}
.sm-ev-code{margin:10px 0 0}
.sm-ev-code label{display:flex; flex-direction:column; gap:6px; max-width:320px}
.sm-ev-code label span{font-size:14px; font-weight:600; color:var(--ev-muted)}
.sm-ev .sm-ev-code input{
  display:block; width:100%; box-sizing:border-box; margin:0;
  min-height:44px; padding:10px 12px; line-height:1.5;
  font-family:inherit; font-size:16px; color:#16232c; text-transform:uppercase;
  background:#fff; border:1px solid #c9c4b8; border-radius:4px; box-shadow:none;
}
.sm-ev .sm-ev-code input:focus{outline:2px solid var(--ev-teal-hi); outline-offset:1px; border-color:var(--ev-teal)}
.sm-ev-code-msg{display:block; margin-top:6px; font-size:14px; color:var(--ev-muted)}
.sm-ev-code-msg:empty{display:none}
.sm-ev-code-msg.is-ok{color:var(--ev-teal); font-weight:600}
.sm-ev-code-msg.is-bad{color:var(--ev-red); font-weight:600}
.sm-ev-apply{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin:6px 0 14px}
.sm-ev-apply .sm-ev-hint{margin:0}