/* 0FF THE PRINT — the calendar, shared between the homepage and /dates/.
   ⛔ SELF-CONTAINED ON PURPOSE. index.html does not load auth.css, so the sheet
   cannot borrow .btn / label / input from it. Every control the sheet needs is
   scoped under .sh here, which also stops it leaking into either page. */

/* ---------------- the month grid ----------------
   THE WINDOW (10/3). The month sits in the same silver frame the homepage rooms
   wear, the two nights that matter (FRI, SAT) are lit a shade warmer, today is
   the rose window, and every date carries the icon of what it is.
   ⛔ KIND STILL OWNS THE FILL. The icon is added on top of the colour, it does
      not replace it: a 10px chip is read by colour first. */
.cal-head{display:flex;align-items:center;gap:14px;margin-top:6px;flex-wrap:wrap}
.cal-head b{font-family:var(--f-display);font-style:italic;font-weight:900;
  text-transform:uppercase;font-size:24px;line-height:1;color:var(--ink)}
.cal-head .yr{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:var(--muted)}
.cal-nav{display:flex;gap:6px;margin-left:auto}
.cal-nav button{background:#0d0c11;border:1px solid rgba(244,238,242,.2);border-radius:0;color:var(--muted);
  width:36px;height:36px;cursor:pointer;font-size:15px;line-height:1;font-family:inherit}
.cal-nav button:hover{border-color:var(--pink-deep);color:var(--pink-glow)}
.cal-nav button.today{width:auto;padding:0 13px;font-family:var(--f-mono);font-size:10px;
  letter-spacing:.14em;text-transform:uppercase}

.cal-grid{position:relative;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;
  background:#1c1a23;border:1px solid rgba(244,238,242,.2);padding:8px;margin-top:12px}
.cal-grid::after{content:'';position:absolute;inset:0;pointer-events:none;border:11px solid transparent;
  border-image:url('../cathedral/frame-panel.webp') 112 / 38px / 0 stretch}
.cal-dow{background:#0d0c11;padding:9px 0;text-align:center;font-family:var(--f-mono);
  font-size:9px;letter-spacing:.16em;color:var(--muted);text-transform:uppercase}
.cal-dow:nth-child(7n+6),.cal-dow:nth-child(7n){color:var(--pink-glow)}
.cal-cell{background:#0a0a0d;min-height:94px;padding:6px 6px 9px;min-width:0}
.cal-cell:nth-child(7n+6),.cal-cell:nth-child(7n){background:#0f0b11}
.cal-cell.out,.cal-cell.out:nth-child(n){background:#08080b}
.cal-cell.out .cal-num{color:#3a3744}
.cal-cell.past .cal-num{color:#625d6d}
.cal-cell.past .cal-ev{opacity:.6}
.cal-cell.has{background-image:linear-gradient(180deg,rgba(255,121,198,.1),rgba(255,121,198,0) 72%)}
.cal-cell.today{background-image:radial-gradient(120% 90% at 50% 0,rgba(255,121,198,.24),rgba(255,121,198,0) 70%);
  box-shadow:inset 0 0 0 1px var(--pink-glow),inset 0 0 20px rgba(255,121,198,.22)}
.cal-num{font-family:var(--f-mono);font-size:10.5px;color:var(--muted);display:block}
.cal-cell.has .cal-num{color:var(--ink)}
.cal-cell.today .cal-num{display:inline-block;background:var(--pink-glow);color:#1a0a14;font-weight:500;
  padding:1px 7px;border-radius:999px}
/* two lines, not one: with the icon in, a one-line chip showed "Austin City ..." and nothing else */
.cal-ev{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;width:100%;margin-top:4px;
  font-size:10px;line-height:1.3;padding:3px 5px 3px 23px;border-radius:0;text-align:left;cursor:pointer;font-family:inherit;
  background:rgba(255,121,198,.13) url('../cathedral/k/show.webp') 4px 4px/15px 15px no-repeat;
  border:1px solid rgba(255,121,198,.32);color:var(--ink);overflow:hidden;overflow-wrap:anywhere}
.cal-ev:hover{background-color:rgba(255,121,198,.24)}
.cal-ev.festival{background-color:rgba(255,212,121,.12);border-color:rgba(255,212,121,.34);background-image:url('../cathedral/k/festival.webp')}
.cal-ev.drop,.cal-ev.release{background-color:rgba(47,107,255,.14);border-color:rgba(47,107,255,.36)}
.cal-ev.drop{background-image:url('../cathedral/k/drop.webp')}
.cal-ev.release{background-image:url('../cathedral/k/release.webp')}
.cal-ev.booth{background-image:url('../cathedral/k/booth.webp')}
.cal-ev.other{background-image:url('../cathedral/k/other.webp')}
.cal-ev.pulled{opacity:.45}
/* THE EXCHANGE. A left edge, not a colour swap: kind already owns the fill and
   two colour systems on one 10px chip is mud. */
.cal-ev.asking{border-left:3px solid rgba(255,212,121,.75)}
.cal-ev.onlist{border-left:3px solid var(--pink-deep)}
.cal-ev.shot{border-left:3px solid #6ee7a8}
.cal-more{font-family:var(--f-mono);font-size:9px;color:var(--pink-glow);margin-top:3px;
  background:none;border:0;cursor:pointer;padding:0}

/* ⛔ The grid is HIDDEN under 640px. Seven day-columns on a phone gives each one
   about 50px, which is not a calendar, it is confetti. Both pages fall back to
   a list at that width, and the homepage keeps its rail for exactly this. */
.cal-wrap{display:block}
@media (max-width:640px){ .cal-wrap{display:none} }

/* ---------------- the add / edit sheet ---------------- */
.sh-back{position:fixed;inset:0;background:rgba(6,5,9,.8);z-index:400;display:flex;
  align-items:flex-end;justify-content:center;backdrop-filter:blur(3px)}
.sh{background:var(--panel,#121218);border:1px solid var(--line);border-bottom:0;
  border-radius:20px 20px 0 0;width:100%;max-width:560px;max-height:92vh;overflow-y:auto;
  padding:20px 20px calc(24px + env(safe-area-inset-bottom));
  font-family:var(--f-body,'Inter',system-ui,sans-serif);color:var(--ink)}
@media(min-width:640px){.sh-back{align-items:center;padding:24px}
  .sh{border-radius:18px;border-bottom:1px solid var(--line)}}
.sh h3{font-family:var(--f-display);font-style:italic;font-weight:900;text-transform:uppercase;
  font-size:25px;color:var(--pink);margin:0}
.sh .note{font-family:var(--f-mono);font-size:11px;color:var(--muted);margin-top:10px;line-height:1.7}
.sh label{display:block;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted);margin:14px 0 6px}
/* ⛔ 16px, NOT 15px, and for the same reason auth.css:51 says so. iOS Safari
   zooms the whole page in on focus for any control under 16px. These are the
   SHEET controls, and calendar.css is loaded by index.html, dates/index.html
   and my/index.html, so this is the box a member types their own date into on
   a phone. The auth.css fix alone did not cover it: that file styles /join/ and
   /reset/, this one styles every sheet on the three member-facing pages. */
.sh input,.sh select,.sh textarea{width:100%;background:#0d0c11;border:1px solid var(--line);
  border-radius:8px;color:var(--ink);font-family:var(--f-body,'Inter',system-ui,sans-serif);
  font-size:16px;padding:11px 13px;outline:none}
.sh textarea{resize:vertical;min-height:80px;line-height:1.5}
.sh input:focus,.sh select:focus,.sh textarea:focus{border-color:var(--pink-deep);
  box-shadow:0 0 0 3px rgba(244,143,200,.13)}
.sh .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:520px){.sh .two{grid-template-columns:1fr}}
.sh .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;
  background:linear-gradient(180deg,var(--pink-deep),#d4589f);color:#1a0a14;border:0;
  border-radius:999px;font-family:var(--f-display);font-style:italic;font-weight:900;
  font-size:18px;letter-spacing:.03em;text-transform:uppercase;padding:12px 20px;cursor:pointer}
.sh .btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.sh .btn.bad{background:transparent;border:1px solid rgba(255,93,126,.5);color:var(--bad,#ff5d7e)}
.sh .btn:disabled{opacity:.5;cursor:not-allowed}
.sh .say{font-family:var(--f-mono);font-size:11px;color:var(--pink-glow);margin-top:12px;min-height:15px}
.sh .say.bad{color:var(--bad,#ff5d7e)}
.sh .foot{display:flex;gap:8px;margin-top:18px}
.sh .foot .btn{flex:1}


/* ---------------- the exchange, inside the sheet ----------------
   ⛔ .sh label is display:block and .sh input is width:100%, so the tick box
   has to undo both or it renders as a full width bar with a caption under it. */
.sh label.ck{display:flex;gap:11px;align-items:flex-start;margin:18px 0 0;padding:13px;
  border:1px solid var(--line);border-radius:11px;background:rgba(255,121,198,.05);
  font-family:var(--f-body,'Inter',system-ui,sans-serif);font-size:14px;letter-spacing:0;
  text-transform:none;color:var(--ink);cursor:pointer;line-height:1.45}
.sh label.ck:hover{border-color:var(--pink-deep)}
.sh label.ck input{width:19px;height:19px;flex:none;margin-top:1px;padding:0;accent-color:var(--pink-deep)}
.sh label.ck b{display:block;font-weight:600}
.sh label.ck em{display:block;margin-top:5px;font-style:normal;font-size:12.5px;
  color:var(--muted);line-height:1.6}

/* The desk's half. Boxed off so it never reads as something a member typed. */
.sh .desk-half{margin-top:18px;padding:4px 14px 14px;border:1px dashed var(--line);
  border-radius:11px;background:rgba(47,107,255,.05)}
.sh .desk-half .dh-h{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.2em;
  text-transform:uppercase;color:#9db9ff;margin-top:12px}
.sh .desk-half .note{margin-top:8px}
