/* ── Reset & Base ─────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 16px; color: #1a1a1a; background: #f5f5f5; line-height: 1.5; }
h1 { font-size: 1.8rem; margin-bottom: 1rem; }
h2 { font-size: 1.3rem; margin: 1.5rem 0 0.75rem; }
h3 { font-size: 1.1rem; margin: 1rem 0 0.5rem; }
a { color: #1a6b3c; text-decoration: none; }
a:hover { text-decoration: underline; }
p { margin-bottom: 0.75rem; }
ul, ol { padding-left: 1.5rem; margin-bottom: 0.75rem; }

/* ── Layout ───────────────────────────────────────────────────────────── */
.container { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem; }
.container-msg { max-width: 1100px; margin: 0.5rem auto 0; padding: 0 1rem; }
.two-col-layout { display: grid; grid-template-columns: 1fr 320px; gap: 1.5rem; }
.col-main { min-width: 0; }
.col-side { min-width: 0; }
@media (max-width: 768px) { .two-col-layout { grid-template-columns: 1fr; } }
.full-width { width: 100%; }
.page-header { margin-bottom: 1.5rem; }

/* ── Navbar ───────────────────────────────────────────────────────────── */
.navbar { background: #1a1a1a; padding: 0.75rem 1.5rem; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem; }
.brand { color: #fff; font-size: 1.2rem; font-weight: 700; text-decoration: none; }
.brand:hover { text-decoration: none; color: #fff; }
.nav-links { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.nav-links a { color: #ccc; font-size: 0.9rem; text-decoration: none; }
.nav-links a:hover { color: #fff; }
.nav-badge { background: #e74c3c; color: #fff !important; padding: 0.2rem 0.6rem; border-radius: 4px; font-size: 0.8rem; font-weight: 600; }
.nav-badge.super { background: #8e44ad; }

/* ── Alerts ───────────────────────────────────────────────────────────── */
.alert { padding: 0.85rem 1.2rem; border-radius: 6px; margin-bottom: 1rem; font-size: 0.95rem; }
.alert-success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.alert-error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
.alert-warning { background: #fff3cd; color: #856404; border: 1px solid #ffc107; }

/* ── Buttons ──────────────────────────────────────────────────────────── */
.btn-primary, .btn-secondary, .btn-danger, .btn-success, .btn-outline, .btn-sm, .btn-lg, .btn-nav, .btn { display: inline-block; padding: 0.5rem 1.1rem; border-radius: 6px; font-size: 0.9rem; font-weight: 600; cursor: pointer; border: none; text-decoration: none; transition: opacity 0.15s; }
.btn-primary   { background: #1a6b3c; color: #fff; }
.btn-secondary { background: #555; color: #fff; }
.btn-danger    { background: #e74c3c; color: #fff; }
.btn-success   { background: #27ae60; color: #fff; }
.btn-outline   { background: transparent; color: #1a6b3c; border: 2px solid #1a6b3c; }
.btn-outline-light { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,0.7); }
.btn-nav       { background: #1a6b3c; color: #fff; padding: 0.35rem 0.9rem; }
.btn-lg        { padding: 0.75rem 1.5rem; font-size: 1rem; }
.btn-sm, .btn-small { padding: 0.3rem 0.7rem; font-size: 0.8rem; }
.btn-full      { width: 100%; text-align: center; }
.btn-primary:hover, .btn-secondary:hover, .btn-danger:hover, .btn-success:hover, .btn-nav:hover { opacity: 0.88; text-decoration: none; color: #fff; }
.btn-outline:hover { background: #1a6b3c; color: #fff; }
.btn-danger-sm  { display: inline-block; padding: 0.25rem 0.6rem; font-size: 0.8rem; background: #e74c3c; color: #fff; border-radius: 4px; border: none; cursor: pointer; }
.btn-success-sm { display: inline-block; padding: 0.25rem 0.6rem; font-size: 0.8rem; background: #27ae60; color: #fff; border-radius: 4px; border: none; cursor: pointer; }

/* ── Cards ────────────────────────────────────────────────────────────── */
.card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1.25rem; margin-bottom: 1rem; }
.dashboard-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1.25rem; }
.stat-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1rem 1.25rem; text-align: center; }
.stat-number { font-size: 2rem; font-weight: 700; color: #1a6b3c; }
.stat-label  { font-size: 0.85rem; color: #666; margin-top: 0.2rem; }
.feature-card { background: #fff; border-radius: 8px; padding: 1.5rem; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.feature-icon { font-size: 2rem; margin-bottom: 0.5rem; }

/* ── Forms ────────────────────────────────────────────────────────────── */
.form-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1.5rem; max-width: 560px; }
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.3rem; color: #333; }
.form-group input, .form-group select, .form-group textarea { width: 100%; padding: 0.5rem 0.75rem; border: 1px solid #ccc; border-radius: 6px; font-size: 0.95rem; background: #fff; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: #1a6b3c; box-shadow: 0 0 0 2px rgba(26,107,60,.15); }
.form-group textarea { min-height: 100px; resize: vertical; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-group-inline { display: flex; align-items: center; gap: 0.5rem; }
.form-actions { margin-top: 1.25rem; display: flex; gap: 0.75rem; flex-wrap: wrap; }
.form-hint { font-size: 0.8rem; color: #777; margin-top: 0.25rem; }
.form-info { font-size: 0.85rem; color: #555; background: #f8f8f8; border-radius: 6px; padding: 0.6rem 0.9rem; margin-bottom: 1rem; }
.form-check { display: flex; align-items: center; gap: 0.5rem; }
.checkbox-label { font-size: 0.9rem; cursor: pointer; }
.field-error { color: #e74c3c; font-size: 0.82rem; margin-top: 0.2rem; }
.validation-summary { color: #e74c3c; font-size: 0.88rem; margin-bottom: 0.75rem; }
.form-section-header { font-weight: 700; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; color: #888; border-bottom: 1px solid #eee; padding-bottom: 0.4rem; margin: 1.25rem 0 0.75rem; }
.input-prefix { display: flex; align-items: center; }
.input-prefix span { background: #eee; padding: 0.5rem 0.75rem; border: 1px solid #ccc; border-right: none; border-radius: 6px 0 0 6px; font-size: 0.9rem; color: #555; }
.input-prefix input { border-radius: 0 6px 6px 0; }
.input-disabled { background: #f5f5f5 !important; color: #777; cursor: not-allowed; }
.optional { font-weight: 400; font-size: 0.8rem; color: #999; }

/* ── Auth pages ───────────────────────────────────────────────────────── */
.auth-page, .auth-page-wide { min-height: 80vh; display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; }
.auth-wrapper { width: 100%; max-width: 420px; }
.auth-logo { text-align: center; font-size: 2rem; margin-bottom: 0.5rem; }
.auth-card { background: #fff; border-radius: 10px; box-shadow: 0 2px 12px rgba(0,0,0,.12); padding: 2rem; }
.auth-form { display: flex; flex-direction: column; gap: 0.75rem; }
.auth-links { margin-top: 1rem; text-align: center; font-size: 0.88rem; color: #666; }
.auth-footer { text-align: center; margin-top: 1rem; font-size: 0.85rem; color: #888; }
.auth-note { font-size: 0.85rem; color: #666; background: #f8f8f8; padding: 0.6rem 0.9rem; border-radius: 6px; }
.auth-sub { text-align: center; color: #666; margin-bottom: 1.5rem; font-size: 0.9rem; }

/* ── Tables ───────────────────────────────────────────────────────────── */
table { width: 100%; border-collapse: collapse; }
th { text-align: left; padding: 0.6rem 0.75rem; font-size: 0.82rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: #555; background: #f8f8f8; border-bottom: 2px solid #e0e0e0; }
td { padding: 0.6rem 0.75rem; border-bottom: 1px solid #f0f0f0; font-size: 0.92rem; vertical-align: middle; }
tr:last-child td { border-bottom: none; }
tr:hover td { background: #fafafa; }
.admin-table { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.08); overflow: hidden; }
.data-table   { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.08); overflow: hidden; }
.events-table { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.08); overflow: hidden; }
.notable-table { background: #fff; border-radius: 8px; overflow: hidden; }

/* ── Leaderboard ──────────────────────────────────────────────────────── */
.leaderboard-wrapper { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); overflow: hidden; margin-bottom: 1.5rem; }
.leaderboard-table { width: 100%; }
.leaderboard-table .tag-num { font-weight: 700; font-size: 1.05rem; color: #1a6b3c; width: 64px; }
.leaderboard-scroll { overflow-x: auto; }
.leaderboard-table-wrap { overflow-x: auto; }
.tag-improved td { background: #edfbf0; }
.tag-declined td { background: #fff5f5; }
.defend-warn td   { background: #fffbea; }
.defend-urgent td { background: #fff0f0; }
.timed-out-header { background: #f8f8f8; padding: 0.6rem 0.75rem; font-size: 0.9rem; color: #888; border-top: 2px solid #eee; margin: 0; }
.timed-out-row td { color: #888; background: #fafafa; }
.timed-out-table .tag-num { color: #aaa; }

/* ── Season nav & switcher ────────────────────────────────────────────── */
.season-nav { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; padding: 0.75rem 0; margin-bottom: 1rem; border-bottom: 1px solid #eee; }
.season-badge { background: #1a6b3c; color: #fff; padding: 0.25rem 0.75rem; border-radius: 999px; font-size: 0.85rem; font-weight: 600; }
.last-event-note { font-size: 0.88rem; color: #666; }
.season-switcher { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.season-switcher span { font-size: 0.85rem; color: #666; }
.season-pill { padding: 0.2rem 0.7rem; border-radius: 999px; font-size: 0.82rem; border: 1px solid #ccc; color: #555; text-decoration: none; background: #fff; }
.season-pill:hover { background: #f0f0f0; text-decoration: none; }
.season-pill.active { background: #1a6b3c; color: #fff; border-color: #1a6b3c; font-weight: 600; }

/* ── Club pages ───────────────────────────────────────────────────────── */
.club-banner { color: #fff; padding: 2rem 1.5rem; border-radius: 8px; margin-bottom: 1.5rem; }
.club-banner h1 { margin-bottom: 0.25rem; }
.club-banner span { opacity: 0.85; font-size: 0.95rem; }
.club-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.club-grid.compact { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.club-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1.1rem; display: block; color: inherit; text-decoration: none; transition: box-shadow 0.15s; }
.club-card:hover { box-shadow: 0 3px 12px rgba(0,0,0,.15); text-decoration: none; }
.club-card-name { font-weight: 700; font-size: 1rem; margin-bottom: 0.25rem; }
.club-card-location { font-size: 0.82rem; color: #777; margin-bottom: 0.5rem; }
.club-card-stats { font-size: 0.82rem; color: #555; }
.club-card-footer { margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid #f0f0f0; font-size: 0.82rem; color: #888; }
.club-stats { display: flex; gap: 1.5rem; margin-top: 0.5rem; font-size: 0.9rem; color: #eee; }
.club-leaderboard-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); overflow: hidden; margin-bottom: 1.5rem; }
.club-switcher { display: flex; gap: 0.5rem; margin-bottom: 1rem; }
.club-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 0.4rem; }

/* ── Hero ─────────────────────────────────────────────────────────────── */
.hero { text-align: center; padding: 3rem 1rem; }
.hero h1 { font-size: 2.5rem; margin-bottom: 0.5rem; }
.hero-sub { font-size: 1.1rem; color: #555; margin-bottom: 2rem; }
.hero-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.features { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; margin: 2rem 0; }
.feature-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }

/* ── Event pages ──────────────────────────────────────────────────────── */
.event-header { margin-bottom: 1.5rem; }
.event-breadcrumb { font-size: 0.85rem; color: #888; margin-bottom: 0.5rem; }
.event-meta { display: flex; gap: 1rem; flex-wrap: wrap; font-size: 0.88rem; color: #666; margin-top: 0.5rem; }
.event-type-badge { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 4px; font-size: 0.78rem; font-weight: 600; background: #e8f5e9; color: #2e7d32; text-transform: uppercase; letter-spacing: 0.04em; }
.event-list { display: flex; flex-direction: column; gap: 0.5rem; }
.event-list-item { background: #fff; border-radius: 6px; padding: 0.75rem 1rem; display: flex; align-items: center; justify-content: space-between; box-shadow: 0 1px 3px rgba(0,0,0,.07); }
.event-chip { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 4px; font-size: 0.78rem; background: #f0f0f0; color: #555; }
.event-detail { margin-bottom: 1.5rem; }
.event-date { font-weight: 700; font-size: 1rem; }
.recent-events-section { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); overflow: hidden; margin-top: 1.5rem; padding: 1rem; }

/* ── Scorecard ────────────────────────────────────────────────────────── */
.scorecard-section { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1rem; margin-bottom: 1.5rem; overflow: hidden; }
.scorecard-scroll, .scorecard-wrap { overflow-x: auto; }
.scorecard-table { min-width: 700px; }
.scorecard-controls { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap; align-items: center; }
.score-row td { font-size: 0.85rem; }
.score-cell { text-align: center; }
.score-vpar { font-weight: 700; }
.par-row td { background: #f8f8f8; font-size: 0.8rem; color: #888; text-align: center; }
.par-cell { text-align: center; }
.header-row th { text-align: center; }
.hole-col { text-align: center; width: 36px; }
.hole-row th { text-align: center; font-size: 0.75rem; }
.player-cell { text-align: left; min-width: 140px; font-weight: 600; }
.subtotal { background: #f0f7f3; font-weight: 700; }
.subtotal-col { background: #f0f7f3; font-weight: 700; text-align: center; }
.total-col { background: #e8f5e9; font-weight: 700; text-align: center; }
.vs-par-col { text-align: center; }
.division-header-row th { background: #1a6b3c; color: #fff; font-size: 0.78rem; }
.division-cell { font-size: 0.78rem; }
.sticky-col { position: sticky; left: 0; background: #fff; z-index: 1; }
.player-entry-row:hover td { background: #f5fbf7; }

/* ── Tags & badges ────────────────────────────────────────────────────── */
.tag-num { font-weight: 700; color: #1a6b3c; }
.tag-number-display { font-size: 3rem; font-weight: 800; color: #1a6b3c; line-height: 1; }
.tag-display { font-size: 2rem; font-weight: 700; color: #1a6b3c; }
.tag-status { display: inline-block; padding: 0.2rem 0.6rem; border-radius: 4px; font-size: 0.78rem; font-weight: 600; }
.tag-status-timedout { background: #fee2e2; color: #b91c1c; }
.tag-status-warning  { background: #fef3c7; color: #92400e; }
.tag-status-ok       { background: #d1fae5; color: #065f46; }
.tag-cell { font-weight: 700; color: #1a6b3c; }
.tag-change-cell { font-size: 0.82rem; color: #888; }
.tag-after { font-weight: 700; color: #1a6b3c; }
.tag-actions { display: flex; gap: 0.5rem; align-items: center; }
.badge { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 4px; font-size: 0.78rem; font-weight: 600; }
.badge-new      { background: #d1fae5; color: #065f46; }
.badge-warning  { background: #fef3c7; color: #92400e; }
.badge-danger   { background: #fee2e2; color: #b91c1c; }
.badge-default  { background: #f0f0f0; color: #555; }
.badge-absent   { background: #f0f0f0; color: #888; }
.badge-timedout { background: #fee2e2; color: #b91c1c; }
.badge-udisc    { background: #e0f2fe; color: #0369a1; }
.badge-role     { background: #ede9fe; color: #6d28d9; }
.badge-private  { background: #fef3c7; color: #92400e; }
.badge-count    { background: #e5e7eb; color: #374151; border-radius: 999px; padding: 0.1rem 0.45rem; font-size: 0.75rem; }
.badge-league   { background: #d1fae5; color: #065f46; }
.badge-casual   { background: #e0f2fe; color: #0369a1; }

/* ── Admin pages ──────────────────────────────────────────────────────── */
.admin-page { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem; }
.admin-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 0.75rem; }
.admin-header-inner { display: flex; align-items: center; gap: 1rem; }
.admin-content { display: flex; flex-direction: column; gap: 1.5rem; }
.admin-stats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.admin-action-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.75rem; }
.admin-action-btn { display: block; background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1rem; text-align: center; color: inherit; text-decoration: none; transition: box-shadow 0.15s; }
.admin-action-btn:hover { box-shadow: 0 3px 10px rgba(0,0,0,.15); text-decoration: none; }
.admin-action-section { margin-bottom: 1.5rem; }
.admin-form-page { max-width: 600px; }
.dashboard-page { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem; }
.dashboard-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.dashboard-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 0.75rem; }
.pending-section { margin-bottom: 1.5rem; }
.actions-cell { white-space: nowrap; }
.status-cell { white-space: nowrap; }

/* ── Profile ──────────────────────────────────────────────────────────── */
.profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.profile-section { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1.25rem; }
.profile-form { max-width: 480px; }
.membership-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1rem 1.25rem; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; }
.membership-club { font-weight: 600; }
.membership-meta { font-size: 0.85rem; color: #666; }
.security-item { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.75rem 0; border-bottom: 1px solid #f0f0f0; }
.security-desc { font-size: 0.88rem; color: #666; }
@media (max-width: 640px) { .profile-grid { grid-template-columns: 1fr; } }

/* ── My tag / profile tag display ────────────────────────────────────── */
.my-tag-banner { background: #1a6b3c; color: #fff; border-radius: 8px; padding: 1.5rem; margin-bottom: 1.5rem; display: flex; align-items: center; gap: 1.5rem; }
.my-tag-number { font-size: 3.5rem; font-weight: 800; line-height: 1; }
.my-tag-info { flex: 1; }
.my-tag-primary { font-size: 1.1rem; font-weight: 600; }
.other-tag-number { font-size: 2rem; font-weight: 700; color: #1a6b3c; }
.tag-primary-club { font-weight: 600; }
.defend-cell { font-size: 0.82rem; }
.defend-by { font-size: 0.82rem; color: #888; }

/* ── Notable events ───────────────────────────────────────────────────── */
.notable-section { margin-bottom: 1.5rem; }
.notable-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
.notable-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.08); padding: 1rem; }
.notable-item { padding: 0.4rem 0; border-bottom: 1px solid #f0f0f0; font-size: 0.9rem; }
.notable-events-section { margin-bottom: 1.5rem; }
.notable-newmembers, .notable-timeouts, .notable-events { margin-bottom: 0.5rem; }
.section-sub { color: #888; font-size: 0.85rem; }

/* ── Full leaderboard ─────────────────────────────────────────────────── */
.full-leaderboard-section { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); overflow: hidden; margin-bottom: 1.5rem; }

/* ── Misc ─────────────────────────────────────────────────────────────── */
.empty-note  { color: #888; font-style: italic; padding: 1rem 0; }
.empty-state { text-align: center; padding: 3rem 1rem; color: #888; }
.back-link   { font-size: 0.88rem; color: #888; margin-bottom: 1rem; display: inline-block; }
.back-link:hover { color: #1a6b3c; }
.view-all-link { font-size: 0.85rem; color: #1a6b3c; }
.view-leaderboard-link { font-size: 0.85rem; }
.more-row td { text-align: center; color: #888; font-size: 0.85rem; background: #fafafa; }
.join-banner { background: #f0f7f3; border-radius: 8px; padding: 1.25rem; margin-bottom: 1.5rem; }
.join-card   { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); padding: 1.25rem; }
.info-icon   { font-size: 1.5rem; margin-bottom: 0.5rem; }
.error-icon  { font-size: 3rem; margin-bottom: 1rem; }
.error-page  { text-align: center; padding: 3rem 1rem; }
.success-icon    { font-size: 3rem; margin-bottom: 1rem; }
.success-actions { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; margin-top: 1rem; }
.tag-status-ok, .tag-status-warning, .tag-status-timedout { font-size: 0.78rem; }
.player-name { font-weight: 600; }
.prev { color: #888; font-size: 0.82rem; }
.compact td, .compact th { padding: 0.4rem 0.6rem; }
.update-tag-btn { font-size: 0.82rem; }
.timed-out { color: #888; }
.timed-out-details { font-size: 0.82rem; color: #888; }
.directory { max-width: 900px; margin: 0 auto; }
.superadmin-page, .super-admin-header { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem; }

/* ── NFC / tap to share ───────────────────────────────────────────────── */
.nfc-phone { text-align: center; padding: 2rem; }
.nfc-tag-number { font-size: 4rem; font-weight: 800; color: #1a6b3c; }
.nfc-club-name  { font-size: 1.1rem; color: #555; margin-top: 0.5rem; }
.nfc-animation  { position: relative; margin: 1rem auto; width: 120px; height: 120px; }
.nfc-ring { position: absolute; border-radius: 50%; border: 3px solid #1a6b3c; animation: nfc-pulse 2s infinite; }
.nfc-ring-1 { width: 40px; height: 40px; top: 40px; left: 40px; animation-delay: 0s; }
.nfc-ring-2 { width: 70px; height: 70px; top: 25px; left: 25px; animation-delay: 0.4s; }
.nfc-ring-3 { width: 100px; height: 100px; top: 10px; left: 10px; animation-delay: 0.8s; }
.nfc-progress { background: #f0f0f0; border-radius: 999px; height: 6px; margin: 1rem 0; }
.nfc-progress-bar { background: #1a6b3c; height: 100%; border-radius: 999px; transition: width 0.3s; }
@keyframes nfc-pulse { 0% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(1.3); } }

/* ── Responsive tweaks ────────────────────────────────────────────────── */
@media (max-width: 640px) {
    h1 { font-size: 1.4rem; }
    .form-row { grid-template-columns: 1fr; }
    .admin-stats-grid { grid-template-columns: 1fr 1fr; }
    .my-tag-banner { flex-direction: column; text-align: center; }
    .club-banner { padding: 1.25rem 1rem; }
}

/* ── CSS Custom Properties (Club Theming) ────────────────────────────── */
:root {
    --club-primary: #1a6b3c;
    --club-primary-light: color-mix(in srgb, var(--club-primary) 15%, white);
    --club-primary-border: color-mix(in srgb, var(--club-primary) 35%, white);
    --club-primary-text: var(--club-primary);
}

/* ── Page header breadcrumb bar ──────────────────────────────────────── */
.page-header {
    border-left: 5px solid var(--club-primary);
    padding: 0.4rem 0 0.4rem 1rem;
    margin-bottom: 1.1rem;
}
.page-header .page-header-crumbs { font-size: 0.8rem; color: #888; }
.page-header .page-header-crumbs a { color: #888; text-decoration: none; }
.page-header h1 { margin: 0.2rem 0 0; font-size: 1.3rem; }
.page-header .page-header-sub { font-size: 0.85rem; color: #555; margin-top: 0.2rem; }

/* ── Financial summary cards ─────────────────────────────────────────── */
.fin-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1.5rem; }
.fin-card { background: #fff; border: 1px solid var(--club-primary-border); border-radius: 8px; padding: 0.85rem 1rem; }
.fin-card-label { font-size: 0.68rem; font-weight: 700; color: #888; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.55rem; }
.fin-row { display: flex; justify-content: space-between; font-size: 0.82rem; padding: 0.12rem 0; color: #333; }
.fin-total { display: flex; justify-content: space-between; font-size: 0.85rem; font-weight: 700; border-top: 1px solid #ddd; margin-top: 0.4rem; padding-top: 0.4rem; }
.fin-net-pos { color: #2e7d32; }
.fin-net-neg { color: #c0392b; }
.fin-sub { font-size: 0.72rem; color: #999; margin-top: 0.3rem; }
.fin-section-divider { font-size: 0.67rem; font-weight: 700; color: #aaa; text-transform: uppercase; letter-spacing: 0.05em; border-top: 1px solid #eee; margin-top: 0.5rem; padding-top: 0.4rem; margin-bottom: 0.2rem; }
.fin-payout-div { margin-bottom: 0.5rem; }
.fin-payout-div-name { font-size: 0.8rem; font-weight: 700; color: #1a3a1a; margin-bottom: 0.15rem; }
.fin-payout-div-meta { font-size: 0.72rem; font-weight: 400; color: #888; margin-left: 0.3rem; }
.fin-payout-place { display: flex; justify-content: space-between; font-size: 0.78rem; color: #444; padding: 0.05rem 0 0.05rem 0.6rem; }

@media (max-width: 540px) { .fin-grid { grid-template-columns: 1fr; } }