/* Golf Trip site styles. Everything is scoped under .gt so it sits inside any Joomla template. */

.gt {
  --gt-fairway: #1f4d3a;
  --gt-fairway-2: #2f6b52;
  --gt-rough: #e4ece5;
  --gt-paper: #ffffff;
  --gt-sheet: #f4f7f3;
  --gt-ink: #17201b;
  --gt-pencil: #5d6a62;
  --gt-line: #c9d6cc;
  --gt-red: #c8102e;
  --gt-flag: #f2c230;
  --gt-bogey: #3b4a8f;
  --gt-focus: #0b62d6;
  --gt-num: "Barlow Condensed", "Roboto Condensed", "Arial Narrow", sans-serif;
  --gt-text: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;

  font-family: var(--gt-text);
  color: var(--gt-ink);
  font-size: 1rem;
  line-height: 1.45;
  max-width: 64rem;
  margin: 0 auto;
}

@media (prefers-color-scheme: dark) {
  .gt.gt-auto-dark {
    --gt-paper: #142019;
    --gt-sheet: #0f1813;
    --gt-ink: #eef4ef;
    --gt-pencil: #a9b8ae;
    --gt-line: #2c3d33;
    --gt-rough: #1c2b22;
    --gt-red: #ff5a6e;
  }
}

.gt *, .gt *::before, .gt *::after { box-sizing: border-box; }
.gt a { color: var(--gt-fairway); }
.gt :focus-visible { outline: 3px solid var(--gt-focus); outline-offset: 2px; }
.gt .gt-num { font-family: var(--gt-num); font-variant-numeric: tabular-nums; }
.gt .gt-under { color: var(--gt-red); }
.gt .gt-muted { color: var(--gt-pencil); }
.gt [hidden] { display: none !important; }

/* ---------- Header strip ---------- */
.gt-head {
  background: var(--gt-fairway);
  color: #fff;
  padding: 1rem 1.1rem 1.1rem;
  border-radius: 0 0 14px 14px;
  margin-bottom: 1rem;
}
.gt-head h1 {
  font-family: var(--gt-num);
  font-weight: 700;
  font-size: clamp(1.9rem, 6vw, 2.8rem);
  line-height: 1;
  margin: 0;
  letter-spacing: .01em;
  color: #fff;
}
.gt-head p { margin: .35rem 0 0; color: #d6e6dc; }
.gt-head a { color: #fff; }
.gt-head .gt-crumb { font-size: .9rem; margin: 0 0 .35rem; }
.gt-head .gt-crumb a { color: #cfe3d6; text-decoration: none; }

/* ---------- Buttons ---------- */
.gt .gt-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  min-height: 44px; padding: .55rem 1rem;
  border-radius: 10px; border: 2px solid var(--gt-fairway);
  background: var(--gt-fairway); color: #fff;
  font: 600 1rem var(--gt-text); text-decoration: none; cursor: pointer;
}
.gt .gt-btn:hover { background: var(--gt-fairway-2); border-color: var(--gt-fairway-2); color: #fff; }
.gt .gt-btn-ghost { background: transparent; color: var(--gt-fairway); }
.gt .gt-btn-ghost:hover { background: var(--gt-rough); color: var(--gt-fairway); }

/* ---------- Rounds list (trip page) ---------- */
.gt-rounds { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: .75rem; }
.gt-round {
  background: var(--gt-paper); border: 1px solid var(--gt-line); border-radius: 12px;
  padding: .9rem 1rem; display: grid; grid-template-columns: auto 1fr; gap: .25rem 1rem; align-items: center;
}
.gt-round-date { grid-row: span 2; text-align: center; font-family: var(--gt-num); line-height: 1; min-width: 3.2rem; }
.gt-round-date b { display: block; font-size: 2rem; }
.gt-round-date span { font-size: .95rem; color: var(--gt-pencil); }
.gt-round h2 { font: 700 1.35rem/1.1 var(--gt-num); margin: 0; }
.gt-round-meta { color: var(--gt-pencil); font-size: .95rem; }
.gt-round-actions { grid-column: 1 / -1; display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }
.gt-status { display: inline-block; font-size: .8rem; font-weight: 600; padding: .05rem .5rem; border-radius: 999px; background: var(--gt-rough); color: var(--gt-fairway); margin-left: .35rem; vertical-align: middle; }
.gt-status-live { background: var(--gt-red); color: #fff; }
.gt-status-final { background: var(--gt-ink); color: #fff; }

/* ---------- Tabs ---------- */
.gt-tabs { display: flex; gap: .25rem; overflow-x: auto; margin: 0 0 .5rem; padding-bottom: 2px; scrollbar-width: none; }
.gt-tabs button {
  flex: 0 0 auto; min-height: 44px; padding: .4rem .9rem; border: 0; border-bottom: 3px solid transparent;
  background: none; color: var(--gt-pencil); font: 600 1.05rem var(--gt-num); cursor: pointer; letter-spacing: .02em;
}
.gt-tabs button[aria-selected="true"] { color: var(--gt-fairway); border-bottom-color: var(--gt-fairway); }
.gt-section-title { font: 700 1.5rem/1.1 var(--gt-num); margin: 1.25rem 0 .5rem; }

/* ---------- Leaderboard ---------- */
.gt-board { width: 100%; table-layout: fixed; border-collapse: collapse; background: var(--gt-paper); border-radius: 12px; overflow: hidden; border: 1px solid var(--gt-line); }
.gt-board th:nth-child(1) { width: 2.9rem; }
.gt-board th:nth-child(3) { width: 3.4rem; }
.gt-board th:nth-child(4) { width: 3.2rem; }
.gt-board th:nth-child(5) { width: 4.2rem; }
.gt-board th { font: 600 .85rem var(--gt-text); color: var(--gt-pencil); text-align: left; padding: .5rem .6rem; background: var(--gt-sheet); border-bottom: 1px solid var(--gt-line); }
.gt-board td { padding: .55rem .6rem; border-bottom: 1px solid var(--gt-line); vertical-align: middle; }
.gt-board tr:last-child td { border-bottom: 0; }
.gt-board .gt-pos { width: 2.8rem; font: 700 1.15rem var(--gt-num); color: var(--gt-pencil); }
.gt-board .gt-name { font-weight: 600; }
.gt-board .gt-name small { display: block; font-weight: 400; color: var(--gt-pencil); }
.gt-board .gt-score { text-align: right; font: 700 1.6rem/1 var(--gt-num); font-variant-numeric: tabular-nums; width: 4.5rem; }
.gt-board .gt-thru { text-align: right; font: 500 1.05rem var(--gt-num); color: var(--gt-pencil); width: 3.5rem; }
.gt-board .gt-extra { text-align: right; font: 500 1.05rem var(--gt-num); color: var(--gt-pencil); width: 3.2rem; }
.gt-board tr.gt-leader .gt-pos { color: var(--gt-fairway); }
.gt-board tr[data-pid] { cursor: pointer; }
.gt-board tr[data-pid]:hover td { background: var(--gt-sheet); }
.gt-board tr.gt-me td { background: #fff8dc; }
.gt-board tr.gt-detail td { padding: 0; background: var(--gt-sheet); cursor: default; }
.gt-updated { font-size: .85rem; color: var(--gt-pencil); margin: .5rem 0 0; }

/* ---------- Hole-by-hole card ---------- */
.gt-card-wrap { overflow-x: auto; padding: .5rem; }
.gt-card { border-collapse: collapse; font-family: var(--gt-num); font-variant-numeric: tabular-nums; min-width: 100%; }
.gt-card th, .gt-card td { text-align: center; padding: .2rem .15rem; min-width: 1.9rem; font-size: 1rem; border: 1px solid var(--gt-line); background: var(--gt-paper); }
.gt-card th { font-weight: 600; color: var(--gt-pencil); background: var(--gt-sheet); }
.gt-card .gt-rowhead { text-align: left; padding-left: .4rem; min-width: 4.5rem; color: var(--gt-pencil); font-weight: 600; }
.gt-card .gt-tot { font-weight: 700; background: var(--gt-rough); }

/* Traditional scorecard marks: circles under par, squares over par */
.gt-mark { display: inline-flex; align-items: center; justify-content: center; width: 1.6em; height: 1.6em; line-height: 1; font-weight: 700; }
.gt-mark.m-1 { border: 1.5px solid var(--gt-red); border-radius: 50%; color: var(--gt-red); }
.gt-mark.m-2 { border: 1.5px solid var(--gt-red); border-radius: 50%; color: var(--gt-red); box-shadow: 0 0 0 2px var(--gt-paper), 0 0 0 3.5px var(--gt-red); }
.gt-mark.p1 { border: 1px solid var(--gt-bogey); color: var(--gt-bogey); }
.gt-mark.p2 { border: 1.5px solid var(--gt-bogey); color: var(--gt-bogey); box-shadow: 0 0 0 2px var(--gt-paper), 0 0 0 3.5px var(--gt-bogey); }
.gt-dots { display: block; font-size: .7rem; line-height: .6; color: var(--gt-fairway); letter-spacing: -.05em; height: .6rem; }

/* ---------- Skins ---------- */
.gt-skins-holes { display: grid; grid-template-columns: repeat(9, 1fr); gap: 4px; margin: .5rem 0 1rem; }
.gt-skin {
  border: 1px solid var(--gt-line); border-radius: 8px; background: var(--gt-paper);
  text-align: center; padding: .3rem .1rem; font-family: var(--gt-num); line-height: 1.1; min-height: 3.4rem;
}
.gt-skin b { display: block; font-size: .8rem; color: var(--gt-pencil); font-weight: 600; }
.gt-skin span { font-size: 1rem; font-weight: 700; }
.gt-skin.won { background: var(--gt-flag); border-color: #d9a90f; }
.gt-skin.carried span { color: var(--gt-pencil); font-weight: 500; }
.gt-skin.pending span { color: var(--gt-line); }
.gt-note { background: var(--gt-sheet); border-left: 4px solid var(--gt-fairway); padding: .6rem .8rem; border-radius: 0 8px 8px 0; margin: .75rem 0; }

/* ---------- Score entry ---------- */
.gt-entry { padding-bottom: 6rem; }
.gt-holebar {
  position: sticky; top: 0; z-index: 5;
  display: grid; grid-template-columns: 56px 1fr 56px; align-items: center;
  background: var(--gt-fairway); color: #fff; border-radius: 14px; padding: .4rem; margin-bottom: .75rem;
}
.gt-holebar button {
  height: 56px; border: 0; border-radius: 10px; background: rgba(255,255,255,.12); color: #fff;
  font: 700 1.8rem var(--gt-num); cursor: pointer;
}
.gt-holebar button:disabled { opacity: .3; }
.gt-holeinfo { text-align: center; line-height: 1; }
.gt-holeinfo .gt-holeno { font: 700 2.6rem/1 var(--gt-num); display: block; }
.gt-holeinfo .gt-holemeta { font: 500 1.05rem var(--gt-num); color: #cfe3d6; letter-spacing: .02em; }

.gt-players { display: grid; gap: .6rem; }
.gt-prow {
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .5rem;
  background: var(--gt-paper); border: 2px solid var(--gt-line); border-radius: 14px; padding: .6rem .6rem .6rem .9rem;
}
.gt-prow.has-score { border-color: var(--gt-fairway); }
.gt-prow.is-pending { border-style: dashed; }
.gt-pname { font-weight: 600; font-size: 1.1rem; line-height: 1.15; }
.gt-pinfo { font: 500 1rem var(--gt-num); color: var(--gt-pencil); letter-spacing: .01em; }
.gt-pinfo .gt-strokes { color: var(--gt-fairway); font-weight: 700; }
.gt-stepper { display: grid; grid-template-columns: 52px 64px 52px; align-items: center; gap: 4px; }
.gt-stepper button {
  height: 52px; border-radius: 12px; border: 2px solid var(--gt-fairway); background: var(--gt-paper);
  color: var(--gt-fairway); font: 700 1.9rem/1 var(--gt-num); cursor: pointer; touch-action: manipulation;
}
.gt-stepper button:active { background: var(--gt-rough); }
.gt-stepper output { text-align: center; font: 700 2.4rem/1 var(--gt-num); font-variant-numeric: tabular-nums; }
.gt-stepper output.empty { color: var(--gt-line); }
.gt-stepper output.pickup { font-size: 1.4rem; color: var(--gt-pencil); }
.gt-prow-tools { grid-column: 1 / -1; display: flex; gap: .5rem; justify-content: space-between; align-items: center; font-size: .9rem; }
.gt-prow-tools button { border: 0; background: none; color: var(--gt-pencil); text-decoration: underline; font: inherit; padding: .4rem 0; min-height: 36px; cursor: pointer; }
.gt-netline { font: 500 1rem var(--gt-num); color: var(--gt-pencil); }

.gt-strip { display: grid; grid-template-columns: repeat(9, 1fr); gap: 4px; margin: 1rem 0; }
.gt-strip button {
  height: 40px; border: 1px solid var(--gt-line); border-radius: 8px; background: var(--gt-paper);
  font: 600 1.05rem var(--gt-num); color: var(--gt-pencil); cursor: pointer;
}
.gt-strip button.done { background: var(--gt-rough); color: var(--gt-fairway); border-color: var(--gt-fairway); }
.gt-strip button.part { background: linear-gradient(90deg, var(--gt-rough) 50%, var(--gt-paper) 50%); }
.gt-strip button.current { outline: 3px solid var(--gt-flag); outline-offset: 1px; color: var(--gt-ink); }

.gt-syncbar {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: max(12px, env(safe-area-inset-bottom));
  z-index: 50; width: min(34rem, calc(100% - 24px));
  display: flex; gap: .75rem; align-items: center; justify-content: space-between;
  background: var(--gt-ink); color: #fff; border-radius: 14px; padding: .55rem .6rem .55rem 1rem;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .25); font-size: .98rem;
}
.gt-syncbar .gt-btn { min-height: 40px; padding: .35rem .8rem; background: #fff; color: var(--gt-ink); border-color: #fff; }
.gt-syncbar.warn { background: #8a5a00; }
.gt-syncbar.error { background: var(--gt-red); }
.gt-dot { width: .7rem; height: .7rem; border-radius: 50%; background: #5bd18b; display: inline-block; margin-right: .45rem; flex: 0 0 auto; }
.gt-syncbar.warn .gt-dot { background: var(--gt-flag); }
.gt-syncbar.error .gt-dot { background: #fff; }

.gt-groupsel { display: flex; gap: .4rem; flex-wrap: wrap; margin: 0 0 .75rem; align-items: center; }
.gt-groupsel button { min-height: 40px; padding: .3rem .8rem; border-radius: 999px; border: 2px solid var(--gt-fairway); background: var(--gt-paper); color: var(--gt-fairway); font-weight: 600; cursor: pointer; }
.gt-groupsel button[aria-pressed="true"] { background: var(--gt-fairway); color: #fff; }

/* ---------- Profile ---------- */
.gt-panel { background: var(--gt-paper); border: 1px solid var(--gt-line); border-radius: 14px; padding: 1.1rem; margin-bottom: 1rem; }
.gt-field { display: grid; gap: .3rem; margin-bottom: 1rem; max-width: 20rem; }
.gt-field label { font-weight: 600; }
.gt-field input { min-height: 48px; font: 700 1.6rem var(--gt-num); padding: .3rem .6rem; border: 2px solid var(--gt-line); border-radius: 10px; background: var(--gt-paper); color: var(--gt-ink); }
.gt-field input.gt-text-input { font: 500 1.1rem var(--gt-text); }
.gt-field small { color: var(--gt-pencil); }
.gt-bigindex { font: 700 4rem/1 var(--gt-num); color: var(--gt-fairway); }

@media (min-width: 48rem) {
  .gt-rounds { grid-template-columns: repeat(2, 1fr); }
  .gt-skins-holes { grid-template-columns: repeat(18, 1fr); }
  .gt-strip { grid-template-columns: repeat(18, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .gt * { transition: none !important; animation: none !important; }
}

/* ---------- Printable scorecards ---------- */
.gt-print { max-width: none; color: #000; }
.gt-print .gt-print-tools { margin: 1rem 0; display: flex; gap: .5rem; }
.gt-sc { page-break-inside: avoid; break-inside: avoid; margin: 0 0 1.2rem; border: 1.5px solid #000; padding: .5rem; }
.gt-sc header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .35rem; font-family: var(--gt-num); }
.gt-sc header h2 { font: 700 1.3rem var(--gt-num); margin: 0; }
.gt-sc table { width: 100%; border-collapse: collapse; font-family: var(--gt-num); font-variant-numeric: tabular-nums; table-layout: fixed; }
.gt-sc th, .gt-sc td { border: 1px solid #000; text-align: center; padding: 0; height: 1.65rem; font-size: .9rem; }
.gt-sc th { background: #e8efe9; font-weight: 600; }
.gt-sc .gt-sc-name { width: 8.5rem; text-align: left; padding-left: .3rem; font-family: var(--gt-text); font-size: .85rem; white-space: nowrap; overflow: hidden; }
.gt-sc .gt-sc-sum { width: 2.3rem; background: #f2f2f2; }
.gt-sc td.gt-sc-player { height: 2.6rem; position: relative; }
/* Dots are drawn with borders, not backgrounds, so they print even with background graphics turned off */
.gt-sc .gt-sc-dots { position: absolute; top: 3px; left: 3px; right: 3px; display: flex; flex-wrap: wrap; gap: 3px; line-height: 0; }
.gt-sc .gt-sc-dots i { display: block; width: 0; height: 0; border: 4px solid #000; border-radius: 50%; }
.gt-sc .gt-sc-dots i.gt-sc-plus { width: 8px; height: 8px; border-width: 1.5px; }
.gt-sc .gt-sc-cap { font-size: .75rem; color: #333; }
@media print {
  .gt-print .gt-print-tools { display: none; }
  .gt-sc { margin-bottom: 8mm; }
  .gt-sc:nth-of-type(2n) { page-break-after: always; break-after: page; }
  @page { size: letter landscape; margin: 10mm; }
}

/* Tables with other column layouts */
.gt .gt-board.gt-flex { table-layout: auto; }
.gt .gt-board.gt-flex th { width: auto; }
.gt .gt-board.gt-mini th:nth-child(1) { width: auto; }
.gt .gt-board.gt-mini th:nth-child(n+2) { width: 3.4rem; }