/* Dundas Indoor Golf — clean, light, golf look. Phone-first. */
:root {
  --green: #1d4d2b;
  --green-dark: #14361e;
  --cream: #faf7ef;
  --gold: #c9a227;
  --ink: #22281f;
  --line: #ddd6c4;
  --red: #b3261e;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background: var(--cream); color: var(--ink); }
a { color: var(--green); }
.wrap { max-width: 720px; margin: 0 auto; padding: 16px; }
.wrap-wide { max-width: 1100px; margin: 0 auto; padding: 16px; }
.site-header { background: var(--green-dark); color: #fff; }
.header-inner { max-width: 1100px; margin: 0 auto; padding: 14px 16px; display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; }
.brand { color: #fff; font-weight: 700; font-size: 20px; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.header-contact { color: #fff; font-size: 13px; font-weight: 700; }
.header-contact a { color: #fff; font-weight: 700; text-decoration: none; }
.header-nav { display: flex; gap: 14px; }
.header-nav a { color: #fff; font-size: 14px; font-weight: 600; text-decoration: none; }
.header-nav a:hover { text-decoration: underline; }

/* Gift cards */
.gc-presets { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 10px; }
.gc-presets .check { font-weight: 600; }
.gc-code { font-size: 26px; font-weight: 700; letter-spacing: 2px; text-align: center; background: var(--paper, #f6f3ec); border: 1px dashed var(--line, #d8d2c4); border-radius: 10px; padding: 14px 10px; }
.site-footer { text-align: center; color: #77705d; font-size: 12px; padding: 22px 12px; }
h1 { font-size: 24px; margin: 8px 0 6px; }
h2 { font-size: 19px; }
h3 { margin: 16px 0 8px; }
.lede { color: #55503f; margin: 0 0 12px; }
.empty-day { background: #fff; border: 1px solid var(--line); border-radius: 10px; color: #55503f; padding: 22px 16px; text-align: center; font-size: 16px; }
.fineprint { color: #77705d; font-size: 12px; }
.hidden { display: none; }
.warn { color: var(--red); font-weight: 600; }

/* Buttons */
.btn { display: inline-block; background: #fff; border: 1px solid var(--green); color: var(--green); padding: 9px 14px; border-radius: 8px; font-size: 15px; cursor: pointer; text-decoration: none; }
.btn-primary { background: var(--green); color: #fff; border-color: var(--green); font-weight: 600; }
.btn-ghost { border-color: var(--line); color: var(--ink); }
.btn-danger { background: #fff; border-color: var(--red); color: var(--red); }
.btn-small { padding: 5px 9px; font-size: 13px; }
button:disabled { opacity: .45; }

/* Calendar */
.cal-nav, .day-nav { display: flex; align-items: center; gap: 10px; margin: 10px 0; flex-wrap: wrap; }
.cal-nav h2 { margin: 0; flex: 1; text-align: center; }
.calendar { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.cal-cell { border: 1px solid var(--line); border-radius: 10px; background: #fff; padding: 8px 6px; min-height: 74px; display: flex; flex-direction: column; gap: 2px; text-decoration: none; color: var(--ink); }
.cal-cell.open { border-color: var(--green); background: #eef5ee; }
.cal-cell.today { outline: 2px solid var(--gold); }
.cal-cell.closed { background: #f6e8e6; color: #8a4a44; }
.cal-cell.past, .cal-cell.future { opacity: .45; }
.cal-dow { font-size: 11px; text-transform: uppercase; color: #77705d; }
.cal-num { font-size: 19px; font-weight: 700; }
.cal-state { font-size: 12px; color: var(--green); font-weight: 600; }

/* Tee sheet grid */
.grid-scroll { overflow-x: auto; }
.tee-grid { border-collapse: collapse; width: 100%; background: #fff; }
.tee-grid th, .tee-grid td { border: 1px solid var(--line); padding: 6px 5px; text-align: center; font-size: 13px; }
.tee-grid thead th { background: var(--green); color: #fff; overflow-wrap: break-word; }
.time-col { white-space: nowrap; font-weight: 600; background: #f2eee1; font-size: 12px !important; vertical-align: top; }
.cell a.cell-link { display: block; text-decoration: none; color: inherit; padding: 4px 2px; }
.cell.free { background: #f4f9f2; }
.cell.special { background: #e7f2e2; }
.cell.special s { color: #999; font-weight: 400; }
.cell.booked { background: #efe9dc; color: #6b6250; font-weight: 700; }
.cell.blocked { background: repeating-linear-gradient(45deg, #f6e8e6, #f6e8e6 8px, #efdcd9 8px, #efdcd9 16px); color: #8a4a44; font-weight: 600; }
.cell.past { color: #bbb; }
.cell.phone { background: #fdf3d8; color: #7a6414; font-weight: 600; }
.cell.place-target { background: #e2ecff; }
/* Owner tee sheet: larger, easier-to-read slots on a computer. Scoped to
   .admin-body so the customer grid is untouched. Free slots link to the
   book-for-a-client form; the hover shade signals they are clickable. */
.admin-body .tee-grid th, .admin-body .tee-grid td { padding: 12px 8px; font-size: 16px; }
.admin-body .tee-grid .time-col { font-size: 14px !important; }
.admin-body .tee-grid td.free:hover { background: #dcefd8; }
/* Customer day grid: open green, booked red, closed grey. Scoped to
   .public-grid so the admin grid keeps its booking-type colours. The
   "Phone to book" (amber) and past cells are deliberately untouched. */
.public-grid .cell.free { background: #2e7d32; color: #fff; font-weight: 600; }
.public-grid .cell.special { background: #43a047; color: #fff; }
.public-grid .cell.special s { color: #d7ecd7; }
.public-grid .cell.booked { background: #c62828; color: #fff; }
.public-grid .cell.blocked { background: #e2e2e0; color: #55534c; }
.day-legend { background: #fdf3d8; border: 1px solid var(--gold); border-radius: 10px; padding: 10px 12px; margin: 10px 0; display: flex; flex-wrap: wrap; gap: 16px; font-size: 13px; }
.swatch { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.swatch-open { background: #2e7d32; }
.swatch-booked { background: #c62828; }
.swatch-closed { background: #e2e2e0; border: 1px solid #bdbcb6; }
.cell-chip { display: block; color: #fff; border-radius: 5px; padding: 2px 4px; font-size: 12px; overflow: hidden; }
.cell.merged { padding: 0; vertical-align: top; }
.cell.merged a.cell-link { height: 100%; padding: 0; }
.cell-chip.cell-block { height: 100%; border-radius: 0; display: flex; flex-direction: column; justify-content: flex-start; }
.specials-banner { background: #fdf3d8; border: 1px solid var(--gold); border-radius: 10px; padding: 10px 12px; margin: 10px 0; }

/* Forms */
.form-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px; margin: 12px 0; }
.form-card label { display: block; margin: 10px 0; font-size: 14px; font-weight: 600; }
.form-card input, .form-card select, .form-card textarea { display: block; width: 100%; margin-top: 4px; padding: 10px; font-size: 16px; border: 1px solid var(--line); border-radius: 8px; font-weight: 400; }
.form-card label.check { font-weight: 400; display: flex; gap: 8px; align-items: flex-start; }
.form-card label.check input { width: auto; margin-top: 3px; }
fieldset { border: 1px solid var(--line); border-radius: 8px; margin: 10px 0; }
label.check.inline { display: inline-flex; margin: 4px 8px 4px 0; }
.booking-time { font-weight: 700; color: var(--green); }
.breakdown { background: #f7f4ea; border-radius: 10px; padding: 12px; margin: 14px 0; }
.breakdown > div { display: flex; justify-content: space-between; padding: 3px 0; }
.breakdown > div.promo-error { display: block; color: #b3261e; font-size: 14px; }
.bd-total { border-top: 1px solid var(--line); margin-top: 6px; padding-top: 8px !important; font-size: 17px; }
.terms { background: #f7f4ea; border-radius: 10px; padding: 12px; font-size: 13px; margin: 14px 0; }
.sim-card { border: 1px dashed var(--gold); border-radius: 10px; padding: 12px; background: #fffdf4; }
.sim-badge { color: #7a6414; font-weight: 700; margin: 0 0 8px; }
.sim-row { display: flex; gap: 10px; }
.alert { background: #fbeae8; border: 1px solid var(--red); color: var(--red); border-radius: 10px; padding: 10px 12px; margin: 10px 0; }
.notice { background: #e7f2e2; border: 1px solid var(--green); color: var(--green-dark); border-radius: 10px; padding: 10px 12px; margin: 10px 0; }
.success-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 20px; margin-top: 14px; }

/* Summary tables & lists */
table.summary, table.list-table { width: 100%; border-collapse: collapse; background: #fff; margin: 12px 0; }
.summary th, .summary td, .list-table th, .list-table td { border: 1px solid var(--line); padding: 8px; text-align: left; font-size: 14px; vertical-align: top; }
.summary th { width: 34%; background: #f2eee1; }
.summary tr.total td, .summary tr.total th { font-size: 16px; background: #eef5ee; }
.list-table thead th { background: var(--green); color: #fff; }
.row-actions { white-space: nowrap; }
.row-actions form { display: inline; }

/* Admin */
.admin-tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 2px solid var(--green); margin-bottom: 12px; align-items: center; }
.admin-tabs a { padding: 9px 12px; text-decoration: none; border-radius: 8px 8px 0 0; color: var(--ink); font-weight: 600; }
.admin-tabs a.active { background: var(--green); color: #fff; }
.admin-user { margin-left: auto; font-size: 13px; color: #55503f; }
.admin-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; }
.stats-bar { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 4px; }
.stat { flex: 1 1 150px; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; text-decoration: none; color: var(--ink); display: flex; flex-direction: column; }
.stat-label { font-size: 12px; text-transform: uppercase; color: #77705d; }
.stat-main { font-size: 16px; font-weight: 700; color: var(--green-dark); }
.capacity { color: #55503f; font-size: 13px; margin: 4px 0 10px; }
.date-jump { color: inherit; text-decoration: none; }
.date-jump:hover { text-decoration: underline; }
.date-jump-caret { font-size: 18px; color: var(--green); }
.admin-cal { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 6px 12px 12px; margin: 10px 0; }
.admin-cal .cal-nav { margin: 6px 0 10px; }
.admin-cal .cal-cell { min-height: 54px; padding: 6px 5px; }
.admin-cal .cal-num { font-size: 16px; }
.admin-cal .cal-cell:hover { border-color: var(--green); background: #eef5ee; }
.cal-cell.viewing { outline: 2px solid var(--green-dark); }
.legend { display: flex; flex-wrap: wrap; gap: 12px; margin: 8px 0; font-size: 13px; }
.legend-item { display: inline-flex; align-items: center; gap: 5px; }
.dot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }
.type-chip { color: #fff; border-radius: 5px; padding: 2px 7px; font-size: 12px; text-transform: capitalize; }
.search-row { display: flex; gap: 8px; margin: 10px 0; }
.search-row input { flex: 1; padding: 10px; font-size: 16px; border: 1px solid var(--line); border-radius: 8px; }
.holding-panel { background: #f0ead9; border: 1px dashed var(--gold); border-radius: 12px; padding: 12px; margin: 14px 0; }
.held-row { background: repeating-linear-gradient(45deg, #fff, #fff 10px, #f7f2df 10px, #f7f2df 20px); border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; margin: 6px 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.held-row.selected { outline: 2px solid var(--green); }
.action-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.cols { display: grid; grid-template-columns: 1fr; gap: 0 16px; }
@media (min-width: 800px) { .cols { grid-template-columns: 1fr 1fr; } }

/* Charts */
.chart { display: flex; align-items: flex-end; gap: 4px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px 10px 10px; overflow-x: auto; min-height: 240px; }
.bar-wrap { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; min-width: 34px; flex: 1; }
.bar { width: 70%; background: var(--green); border-radius: 4px 4px 0 0; min-height: 2px; }
.bar-val { font-size: 11px; color: var(--green-dark); font-weight: 700; }
.bar-label { font-size: 11px; color: #55503f; margin-top: 4px; }
.bar-count { font-size: 11px; color: #999; }