/* ==========================================================================
   DEFAULT PAGES (page.php, index.php, 404) + stint planner styles
   ========================================================================== */
:root {
  --gm-ticker-h: 0px;
  --font-head: var(--gm-font-head); --font-body: var(--gm-font-body);
  --color-text-primary: var(--gm-white); --color-text-secondary: var(--gm-gray); --color-text-tertiary: rgba(136,136,170,.45);
  --color-background-primary: var(--gm-dark); --color-background-secondary: var(--gm-dark-3);
  --color-border-primary: rgba(255,107,26,.35); --color-border-secondary: var(--gm-border-white); --color-border-tertiary: rgba(255,255,255,.04);
  --sp-focus-ring: var(--gm-orange-tint-08); --sp-radius-lg: 5px; --sp-radius-cell: 4px; --sp-radius-pill: 20px;
  --sp-card-line: rgba(255,107,26,.2); --sp-card-line-hover: rgba(255,107,26,.5);
  --sp-active-tint: rgba(100,200,80,.15); --sp-neutral-tint: rgba(136,136,170,.12);
  --sp-success: #96e6a1; --sp-success-tint: rgba(100,200,150,.15); --sp-success-cell: rgba(100,200,150,.2); --sp-success-line: rgba(100,200,150,.4);
  --sp-warning: #f7dc6f; --sp-warning-tint: rgba(250,180,80,.15); --sp-warning-cell: rgba(250,180,80,.2); --sp-warning-line: rgba(250,180,80,.4); --sp-warning-note: rgba(250,180,80,.12);
  --sp-danger: #f09595; --sp-danger-tint: rgba(220,80,80,.15); --sp-danger-cell: rgba(220,80,80,.2); --sp-danger-line: rgba(220,80,80,.4); --sp-danger-btn-line: rgba(243,100,100,.5); --sp-danger-btn-hover: rgba(243,100,100,.12);
  --sp-cat-tpc: #7aabff; --sp-cat-tpc-tint: rgba(100,150,255,.15); --sp-cat-gazelle-tint: rgba(255,107,26,.2);
  --sp-driver-1: #ff6b6b; --sp-driver-2: #4ecdc4; --sp-driver-3: #45b7d1; --sp-driver-4: #96e6a1; --sp-driver-5: #f7dc6f; --sp-driver-6: #bb8fce;
}
.gm-page-wrap { padding: calc(var(--gm-top-offset) + var(--gm-nav-h) + 72px) var(--gm-space-gutter) var(--gm-space-section); min-height: 70vh; }
.gm-page-wrap--wide .gm-container { max-width: var(--gm-header-max); }
.gm-page-title { font-size: clamp(2.6rem, 7vw, 5.4rem); line-height: .9; letter-spacing: -.02em; margin: 0 0 2rem; }
.gm-entry { max-width: 760px; }
.gm-page-wrap--wide .gm-entry { max-width: none; }
.gm-entry h2 { font-size: clamp(1.8rem, 3.6vw, 2.6rem); margin: 2.2rem 0 1rem; }
.gm-entry h3 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); margin: 1.8rem 0 .8rem; }
.gm-entry a { border-bottom: 1px solid var(--gm-orange-line-28); }
.gm-entry ul, .gm-entry ol { color: var(--gm-gray); padding-left: 1.2rem; }
.gm-entry blockquote { margin: 1.6rem 0; padding: 18px 22px; background: var(--gm-dark-3); border-left: 2px solid var(--gm-orange); color: var(--gm-gray-light); }
.gm-entry img { height: auto; border-radius: var(--gm-radius); }
.gm-entry input[type="text"], .gm-entry input[type="email"], .gm-entry input[type="password"], .gm-entry textarea, .gm-entry select {
  width: 100%; background: var(--gm-dark-3); border: 1px solid var(--gm-border-white); border-radius: var(--gm-radius); color: var(--gm-white); font-family: var(--gm-font-body); font-size: 1rem; padding: 12px 16px; outline: none; transition: border-color .2s;
}
.gm-entry input:focus, .gm-entry textarea:focus, .gm-entry select:focus { border-color: var(--gm-orange); }
.gm-entry label { font-size: 13px; color: var(--gm-gray); letter-spacing: .06em; text-transform: uppercase; margin-bottom: 6px; display: block; }
.gm-entry input[type="submit"], .gm-entry button[type="submit"] { display: inline-flex; align-items: center; padding: 13px 30px; border-radius: var(--gm-radius); font-family: var(--gm-font-head); font-size: 1rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; border: 2px solid var(--gm-orange); background: var(--gm-orange); color: #fff; cursor: pointer; }
.gm-posts { display: grid; gap: 12px; }
.gm-post-row { display: block; padding: 20px 22px; background: var(--gm-dark-2); border: 1px solid var(--gm-border-white); border-radius: var(--gm-radius); color: inherit; transition: border-color .2s; }
.gm-post-row:hover { border-color: var(--gm-border); color: inherit; }
.gm-post-row h2 { font-size: 1.5rem; margin: 0 0 .3rem; }
.gm-post-row time { font-size: 13px; color: var(--gm-gray); }
.gm-nf { text-align: left; }
.gm-nf .gm-btn-row { margin-top: 1.6rem; }
@media (max-width: 768px) { .gm-page-wrap { padding-left: var(--gm-space-gutter-md); padding-right: var(--gm-space-gutter-md); padding-bottom: var(--gm-space-section-md); } }

/* ─────────────────────────────────────────────────────────────
   STINT PLANNER — ported from the planner page, scoped under .sp-wrapper
   (the original stylesheet targets bare elements; scoping keeps it off the site's forms)
───────────────────────────────────────────────────────────── */
.sp-wrapper { font-family: var(--font-body); font-size: 14px; line-height: 1.5; color: var(--color-text-primary); }
.sp-wrapper .tabs { display:flex; border-bottom:0.5px solid var(--color-border-tertiary); background:var(--color-background-primary); }
.sp-wrapper .tab { padding:10px 18px; font-family:inherit; font-size:13px; cursor:pointer; border:none; background:none; color:var(--color-text-secondary); border-bottom:2px solid transparent; transition:all .15s; }
.sp-wrapper .tab.active { color:var(--color-text-primary); border-bottom-color:var(--gm-orange); font-weight:500; }
.sp-wrapper .tab:hover:not(.active) { color:var(--color-text-primary); background:var(--color-background-secondary); }
.sp-wrapper .panel { display:flex; padding:20px; flex-direction:column; gap:16px; }

.sp-wrapper label { font-size:12px; color:var(--color-text-secondary); display:block; margin-bottom:4px; text-transform:none; letter-spacing:0; }
.sp-wrapper input, .sp-wrapper select {
  width:100%; border:0.5px solid var(--color-border-secondary); border-radius:var(--gm-radius);
  padding:7px 10px; font-family:inherit; font-size:13px; background:var(--color-background-primary); color:var(--color-text-primary);
}
.sp-wrapper input:focus, .sp-wrapper select:focus, .sp-wrapper .is-focus { outline:none; border-color:var(--color-border-primary); box-shadow:0 0 0 2px var(--sp-focus-ring); }
.sp-wrapper .grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sp-wrapper .grid3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }

.sp-wrapper .card { background:var(--color-background-secondary); border:0.5px solid var(--color-border-tertiary); border-radius:var(--sp-radius-lg); padding:14px 16px; }
.sp-wrapper .card-title { font-size:11px; color:var(--color-text-secondary); margin-bottom:8px; text-transform:uppercase; letter-spacing:.04em; }
.sp-wrapper .metric { font-size:22px; font-weight:500; color:var(--color-text-primary); }
.sp-wrapper .metric-sub { font-size:12px; color:var(--color-text-secondary); margin-top:2px; }

.sp-wrapper .btn { padding:8px 16px; border-radius:var(--gm-radius); border:0.5px solid var(--color-border-secondary); background:var(--color-background-primary); color:var(--color-text-primary); cursor:pointer; font-family:inherit; font-size:13px; transition:all .15s; }
.sp-wrapper .btn:hover { background:var(--color-background-secondary); }
.sp-wrapper .btn:active { transform:scale(0.98); }
.sp-wrapper .btn-primary { background:var(--gm-orange); color:#fff; border-color:var(--gm-orange); }
.sp-wrapper .btn-primary:hover { background:var(--gm-orange-dark); border-color:var(--gm-orange-dark); }
.sp-wrapper .btn-sm { padding:4px 10px; font-size:12px; }
.sp-wrapper .btn-danger { border-color:var(--sp-danger-btn-line); color:var(--sp-danger); }
.sp-wrapper .btn-danger:hover { background:var(--sp-danger-btn-hover); }

.sp-wrapper table { width:100%; border-collapse:collapse; font-size:13px; }
.sp-wrapper th { text-align:left; padding:7px 10px; font-size:11px; color:var(--color-text-secondary); border-bottom:0.5px solid var(--color-border-tertiary); font-weight:500; white-space:nowrap; }
.sp-wrapper td { padding:7px 10px; border-bottom:0.5px solid var(--color-border-tertiary); vertical-align:middle; white-space:nowrap; }
.sp-wrapper tr:last-child td { border-bottom:none; }
.sp-wrapper tr:hover td { background:var(--color-background-secondary); }
.sp-wrapper .scroll-wrap { overflow-x:auto; border-radius:var(--sp-radius-lg); border:0.5px solid var(--color-border-tertiary); }
.sp-wrapper select.strat-select, .sp-wrapper select.driver-select { padding:4px 6px; font-size:12px; width:auto; }
.sp-wrapper .stint-row.buiten td { opacity:.35; }
.sp-wrapper .muted { color:var(--color-text-secondary); font-size:12px; }
.sp-wrapper .faint { color:var(--color-text-tertiary); }

.sp-wrapper .badge { display:inline-block; padding:2px 8px; border-radius:var(--sp-radius-pill); font-size:11px; font-weight:500; }
.sp-wrapper .badge-actief      { background:var(--sp-active-tint);  color:var(--sp-success); }
.sp-wrapper .badge-buiten      { background:var(--sp-neutral-tint); color:var(--gm-gray); }
.sp-wrapper .badge-beschikbaar { background:var(--sp-success-tint); color:var(--sp-success); }
.sp-wrapper .badge-geblokkeerd { background:var(--sp-danger-tint);  color:var(--sp-danger); }
.sp-wrapper .badge-tentative   { background:var(--sp-warning-tint); color:var(--sp-warning); }
.sp-wrapper .driver-dot { width:12px; height:12px; border-radius:50%; display:inline-block; margin-right:6px; vertical-align:middle; flex-shrink:0; }
.sp-wrapper .d1 { background:var(--sp-driver-1); } .sp-wrapper .d2 { background:var(--sp-driver-2); } .sp-wrapper .d3 { background:var(--sp-driver-3); }
.sp-wrapper .d4 { background:var(--sp-driver-4); } .sp-wrapper .d5 { background:var(--sp-driver-5); } .sp-wrapper .d6 { background:var(--sp-driver-6); }

.sp-wrapper .section-title { font-size:13px; font-weight:500; color:var(--color-text-primary); }
.sp-wrapper .hint { font-size:12px; color:var(--color-text-secondary); padding:10px 0; }
.sp-wrapper .avail-cell { padding:4px 6px; border-radius:var(--sp-radius-cell); text-align:center; cursor:pointer; border:0.5px solid var(--color-border-tertiary); background:var(--color-background-secondary); transition:all .1s; user-select:none; font-size:12px; width:110px; }
.sp-wrapper .avail-cell.beschikbaar { background:var(--sp-success-cell); border-color:var(--sp-success-line); color:var(--sp-success); }
.sp-wrapper .avail-cell.tentative   { background:var(--sp-warning-cell); border-color:var(--sp-warning-line); color:var(--sp-warning); }
.sp-wrapper .avail-cell.geblokkeerd { background:var(--sp-danger-cell);  border-color:var(--sp-danger-line);  color:var(--sp-danger); }
.sp-wrapper .avail-local { font-size:10px; color:var(--color-text-secondary); margin-top:2px; line-height:1.2; }
.sp-wrapper .avail-cell.beschikbaar .avail-local, .sp-wrapper .avail-cell.tentative .avail-local, .sp-wrapper .avail-cell.geblokkeerd .avail-local { color:inherit; opacity:.75; }

.sp-wrapper .progress-bar { height:6px; border-radius:var(--gm-radius); background:var(--color-background-secondary); overflow:hidden; margin-top:4px; }
.sp-wrapper .progress-fill { height:100%; border-radius:var(--gm-radius); transition:width .3s; }
.sp-wrapper .warn { background:var(--sp-warning-note); border:0.5px solid var(--sp-warning-line); border-radius:var(--gm-radius); padding:8px 12px; font-size:12px; color:var(--sp-warning); }

.sp-wrapper .sp-hub-header { display:flex; justify-content:space-between; align-items:center; padding:24px 24px 16px; border-bottom:0.5px solid var(--color-border-tertiary); }
.sp-wrapper .sp-hub-title { font-family:var(--font-head); font-size:26px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.sp-wrapper .sp-hub-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; padding:24px; }
.sp-wrapper .sp-planner-card { background:var(--color-background-secondary); border:0.5px solid var(--sp-card-line); border-radius:var(--sp-radius-lg); padding:16px; cursor:pointer; transition:border-color .15s; }
.sp-wrapper .sp-planner-card:hover { border-color:var(--sp-card-line-hover); }
.sp-wrapper .sp-card-name { font-family:var(--font-head); font-size:18px; font-weight:600; color:var(--color-text-primary); margin-bottom:10px; }
.sp-wrapper .sp-card-meta { font-size:12px; color:var(--color-text-secondary); display:flex; flex-direction:column; gap:4px; margin-bottom:14px; }
.sp-wrapper .sp-cat-badge { display:inline-block; padding:1px 7px; border-radius:var(--sp-radius-pill); font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.sp-wrapper .sp-cat-gazelle { background:var(--sp-cat-gazelle-tint); color:var(--gm-orange); }
.sp-wrapper .sp-cat-tpc     { background:var(--sp-cat-tpc-tint); color:var(--sp-cat-tpc); }
.sp-wrapper .sp-cat-kion    { background:var(--sp-success-tint); color:var(--sp-success); }
.sp-wrapper .sp-cat-none    { background:var(--sp-neutral-tint); color:var(--gm-gray); }
.sp-wrapper .sp-filter-bar { display:flex; gap:8px; flex-wrap:wrap; padding:0 24px 16px; }
.sp-wrapper .sp-filter-btn { padding:4px 14px; border-radius:var(--sp-radius-pill); border:0.5px solid var(--color-border-secondary); background:none; color:var(--color-text-secondary); cursor:pointer; font-family:inherit; font-size:12px; transition:all .15s; }
.sp-wrapper .sp-filter-btn.active { border-color:var(--gm-orange); color:var(--gm-orange); background:var(--gm-orange-tint-08); }
.sp-wrapper .sp-back-bar { display:flex; align-items:center; gap:12px; padding:10px 16px; border-bottom:0.5px solid var(--color-border-tertiary); background:var(--color-background-primary); }
.sp-wrapper .sp-save-status { font-size:12px; color:var(--color-text-secondary); margin-left:auto; }
.sp-wrapper .sp-save-status.saving { color:var(--sp-warning); }
.sp-wrapper .sp-save-status.saved  { color:var(--sp-success); }
.sp-wrapper .sp-save-status.error  { color:var(--sp-danger); }


/* App pages (stint planner): full width, tighter top spacing */
.gm-page-wrap--app { padding-top: calc(var(--gm-top-offset) + var(--gm-nav-h) + 16px); padding-bottom: 64px; }
.gm-page-wrap--app .gm-container { max-width: var(--gm-header-max); }
@media (max-width: 768px) { .gm-page-wrap--app { padding-left: 16px; padding-right: 16px; } }