/* -----------------------------------
   GLOBAL STYLES
   Migrated as-is from the legacy /css/golf.css. The only substantive change is that image
   references now point at /assets/img/ instead of /img/ (three of them: the public-page
   background, the navbar background, and the GroupMe mask icon). Appearance is unchanged.
----------------------------------- */
:root {--bs-abcblue:#25408f;--bs-abcred:#d2232a;--bs-golfgreen:#355E3B;--bs-golfgreen-rgb:rgb(53,94,59);}

body{font-family: Arial, sans-serif;font-size: 10pt;color: #333;background-color:#DCDCDC;overflow-x: hidden;margin: 0;padding: 0;}
.bg-golf{background-color:var(--bs-golfgreen);}
a {color:var(--bs-golfgreen);}

/* -----------------------------------
   PUBLIC PAGE STYLES (Login, Forgot, Register)
----------------------------------- */
body.public-page{background: url('/assets/img/bg.webp') no-repeat center center fixed;background-size: cover;}
.logo{width: clamp(35%, 15vw, 50%);}

/* Legacy geometry, unchanged: fixed 400px card, 100px top margin, 30px padding. Scoped to the
   signed-out pages so signed-in pages get Bootstrap's own responsive .container - the legacy
   sheet overrode .container globally, which happened to be harmless because every signed-in
   page uses .container-fluid. */
body.public-page .container{max-width: 400px;margin: 100px auto;background: rgba(255, 255, 255, 0.9);padding: 30px;border-radius: 10px;box-shadow: 0px 0px 10px rgba(0,0,0,0.2);}

input[type="text"],input[type="email"],input[type="password"]{width: 100%;padding: 10px;margin: 5px 0;border: 1px solid #ccc;border-radius: 5px;}
/* Selects and the remaining input types have to match those dimensions exactly, or a form with
   a mix of the two shows fields of two different heights. Bootstrap's own padding on
   .form-select / .form-control is smaller than the 10px this site uses. */
select.form-select, select.form-control,
input[type="tel"], input[type="number"], input[type="date"], input[type="file"], textarea.form-control{
	width: 100%;padding: 10px;margin: 5px 0;border: 1px solid #ccc;border-radius: 5px;line-height: 1.2;height: auto;
}
/* An input inside a Bootstrap .input-group must not carry the standalone margin, or the
   append button sits misaligned against it. */
.input-group input[type="text"],.input-group input[type="email"],.input-group input[type="password"],
.input-group input[type="number"],.input-group input[type="tel"],.input-group select{margin:0;}
.form-select{font-size: inherit !important;}
/* -----------------------------------
   BUTTONS & ALERTS
----------------------------------- */
.btn-green{background-color:var(--bs-golfgreen);color: white;padding: 10px;border: none;border-radius: 5px;cursor: pointer;}
.btn-green:hover{background-color:rgba(18,97,18,0.75);}

.alert{padding: 10px;margin-bottom: 10px;border-radius: 5px;text-align: center;}
.alert-danger{background: #ffcccc;color: #990000;}
.alert-success{background: #ccffcc;color: #006600;}

.form-control{border-radius: 5px;padding: 10px;}

.form-container{max-width: 550px;/*margin: 5vh auto;*/}
.form-group{display: flex;align-items: center;justify-content: space-between;flex-wrap: nowrap;}
.form-group label{flex: 1;text-align: left;font-weight: bold;margin-right: 10px;white-space: nowrap;font-size: 14px;}
.form-group .text{flex: 2;min-width: 200px;font-size: 14px;}
.form-group input[type=checkbox]{flex: 2;font-size: 20px;margin-left: -10vw;}
.form-check-input:checked{background-color:#228B22 !important;border-color:#228B22 !important;}
/* -----------------------------------
   FIXED NAVBAR BACKGROUND
----------------------------------- */
.navbar{background: url('/assets/img/navbar-bg.webp') center/cover no-repeat;background-size: cover;background-position: center;padding: 10px;border-bottom: .5em groove maroon;}
.navbar-brand img{width: clamp(20%, 12vw, 35%);}
.navbar-nav .nav-link{color: #ffffff;padding: 8px 15px;font-weight: bold;}
.navbar-nav .nav-link:hover{color: #f8f9fa;text-decoration: underline;}
/* Current page. Bootstrap's own .active only changes the text colour, which against the dark
   green nav is close to invisible - so the current item is marked with the same amber used on
   the Tabulator column headers, with black text. */
.navbar-nav .nav-link.active{background-color:#ffc107;color:#212529;border-radius:4px;}
.navbar-nav .nav-link.active:hover{background-color:#ffc107;color:#212529;text-decoration:none;}
/* An open dropdown toggle gets the same treatment. Bootstrap sets a focus/show colour on the
   toggle when the menu opens, which darkened the text and the caret but left the background
   untouched - so it read as broken rather than selected. .show covers the open state and
   :focus covers the click itself. */
.navbar-nav .nav-link.dropdown-toggle.show,
.navbar-nav .nav-link.dropdown-toggle:focus,
.navbar-nav .nav-item.dropdown.show > .nav-link{background-color:#ffc107;color:#212529;border-radius:4px;text-decoration:none;}
/* The caret is drawn with border colours that follow currentColor, so it follows the text. */
.navbar-nav .nav-link.dropdown-toggle.show::after{color:#212529;}
/* The current item inside the Admin dropdown. Bootstrap's own .dropdown-item.active is its
   theme blue, which does not belong here. */
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active{background-color:#ffc107;color:#212529;}
.navbar h1{color:#FFF;-webkit-text-stroke: .03em maroon;text-shadow: 4px 4px 10px rgba(255, 255, 255, 0.5);font-weight:bold;}

/* Logout is a form button now rather than an anchor, so it needs the anchor's own styling
   neutralised - otherwise the browser's default button chrome shows through the navbar. */
.navbar-nav .nav-link.btn{border:0;font-family:inherit;font-size:inherit;line-height:inherit;}

/* -----------------------------------
   DASHBOARD LAYOUT
----------------------------------- */
/* Dashboard Wrapper */
.dashboard-wrapper{background-color: #ffffff;min-height: 100vh;padding-top: 70px;}

/* Leaderboard */
.leaderboard{display: flex;flex-direction: column;gap: 8px;}
.leaderboard-item{display: flex;justify-content: space-between;padding: 10px;border-bottom: 1px solid #ddd;}
.leaderboard-item .rank{font-weight: bold;}
.leaderboard-item .player{flex-grow: 1;margin-left: 10px;}
.leaderboard-item .points{font-weight: bold;color: #007bff;}

/* Upcoming Games */
.upcoming-games{display: flex;flex-direction: column;gap: 10px;}
.game-item{display: flex;justify-content: space-between;align-items: center;padding: 10px;border-bottom: 1px solid #ddd;}
.game-details{display: flex;gap: 15px;align-items: center;}
.date{font-weight: bold;color: #007bff;}
.course{font-style: italic;}
.format{color: #666;font-size: 14px;}

/* -----------------------------------
   WIDGETS & MASONRY LAYOUT
----------------------------------- */
.card-header{background-color:var(--bs-golfgreen);color:#fff;}

/*Profile Card 3*/
.dboard-card {
   font-family: "Open Sans", Arial, sans-serif;
   position: relative;
   overflow: hidden;
   width: 100%;
   text-align: center;
   border: 1px solid var(--bs-golfgreen);
}

.dboard-card .background-block {
   float: left;
   width: 100%;
   height: 200px;
   overflow: hidden;
}

.dboard-card .background-block .background {
   width: 100%;
   vertical-align: top;
   opacity: 0.9;
   -webkit-filter: blur(0.5px);
   filter: blur(0.5px);
}

.dboard-card .card-content {
   width: 100%;
   padding: 15px 25px;
   color: #232323;
   float: left;
   background: #efefef;
   height: 50%;
   border-radius: 0 0 5px 5px;
   position: relative;
   z-index: 3;
}

.dboard-card .card-content::before {
   content: "";
   background: #efefef;
   width: 120%;
   height: 100%;
   left: 11px;
   bottom: 51px;
   position: absolute;
   z-index: -1;
   transform: rotate(-13deg);
}
.dboard-card h2 {
   margin: 0 0 5px;
   font-weight: 600;
   font-size: 25px;
}

.dboard-card h2 small {
   display: block;
   font-size: 15px;
   margin-top: 10px;
}

.dboard-card i {display: inline-block;font-size: 16px;color:var(--bs-golfgreen);text-align: center;border: 1px solid var(--bs-golfgreen);width: 30px;height: 30px;line-height: 30px;border-radius:50%;margin: 0 5px;}
.dboard-card .icon-block {float: left;width: 100%;margin-top: 15px;}
.dboard-card .icon-block a {text-decoration: none;}
.dboard-card i:hover {background-color:var(--bs-golfgreen);color: #fff;text-decoration: none;}
/***********************************************/
#leaders-list {
    column-count: 3;
    column-gap: 20px; /* Adjust gap between columns as needed */
    padding-left: 1.5em; /* Ensure the numbers have enough room */
	list-style-type: none;
  }
.profile-img-container {position: absolute;bottom:38%;left:50%;transform: translate(-50%, 0%);width:clamp(24%,6vw,25%);height: auto;z-index:4;}
.profile-img-container .profile-img {display: block;width: 100%;height: auto;border-radius: 50%;box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.5);border: .3em solid var(--bs-golfgreen);}
.profile-img-container h6 {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);margin: 0;font-size: calc(1rem + 1vw);font-weight: bold;color:#FFF;z-index: 2;-webkit-text-stroke: .03em maroon;text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);}
.profile-img-container h6 small{font-style:italic;}
.profile-img-container button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  font-size: calc(0.5rem + 0.5vw);
  font-weight: bold;
  z-index: 2;
  width: auto; /* Let width adjust to content */
  padding: 0.5em 1em; /* Add padding for spacing */
  height: auto;
  box-shadow: 0 0 0 1px #f0ad4e inset, 
              0 0 0 2px rgba(255,255,255,0.15) inset, 
              0 8px 0 0 #eea236, 
              0 8px 0 1px rgba(0,0,0,0.4), 
              0 8px 8px 1px rgba(0,0,0,0.5);
  transition: all 0.08s linear;
  outline: none;
  border: 0;
  color: maroon;
  -webkit-text-stroke: 0.01em #FFF;
  white-space: nowrap;
  max-width: 100%; /* Prevent overflowing its container */
}
.profile-img-container button:hover{color:#FFF;-webkit-text-stroke: .01em maroon;}
.profile-img-container button:active, .profile-img-container button.active{box-shadow: 0 2px 0 #b39c00;transform: translateY(-.75em) translateX(-2.25em);color:maroon !important;-webkit-text-stroke: .01em #FFF !important;}
/***********************************************/
/******************** News Ticker ****************/
.news-container {position: fixed;top: 0;left: 0;right: 0;font-family: "Roboto", sans-serif;box-shadow: 0 4px 8px -4px rgba(0, 0, 0, 0.3);z-index: 100;background-color: rgba(53,94,59,.50);}
.news-container .title {position: absolute;background-color:rgba(var(--bs-warning-rgb),.85);height: 100%;display: flex;align-items: center;padding: 0 24px;color: maroon;font-weight: bold;z-index:101;}
.news-container ul {display: flex;list-style: none;margin: 0;animation: scroll 25s infinite linear;}.news-container ul li {white-space: nowrap;padding: 10px 24px;color: #fff;text-shadow: 2px 2px 2px rgba(0,0,0,0.1);position: relative;}
.news-container ul li::after {content: " \f450 ";width: 1px;height: 100%;position: absolute;top: 25%;right: 0;font-family: "Font Awesome 6 Free";font-weight: 900;margin: 0 8px;}
.news-container ul li:last-child::after {display: none;}
@keyframes scroll {from {transform: translateX(100%);}to {transform: translateX(-1083px);}}
/***********************************************/

/* -----------------------------------
   GroupMe Chat Box
----------------------------------- */
.groupme-card-wrap{
	height:340px;
	overflow:hidden;
	background:#fff;
}

.groupme-status{
	height:78px;
	padding:8px 10px 6px 10px;
	color:#6c757d;
	border-bottom:1px solid #e9ecef;
	background:#f8f9fa;
	display:flex;
	flex-direction:column;
	justify-content:center;
	gap:6px;
}

.groupme-app-links{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	flex-wrap:nowrap;
	white-space:nowrap;
	overflow:hidden;
}

.groupme-app-label{
	font-size:.78rem;
	font-weight:600;
	color:#6c757d;
	line-height:1;
	margin:0;
	flex:0 0 auto;
}

.groupme-store-link{
	display:inline-block;
	line-height:1;
	text-decoration:none;
	flex:0 0 auto;
}

.groupme-store-link img{
	display:block;
	height:95px;
	width:auto;
	max-width:none;
}

.groupme-status-text{
	text-align:center;
	font-size:.75rem;
	color:#6c757d;
	line-height:1.2;
}

.groupme-chat-box{
	height:calc(340px - 92px);
	overflow-y:auto;
	overflow-x:hidden;
	padding:10px;
	background:#ffffff;
}
.groupme-msg{
	display:flex;
	align-items:flex-start;
	margin-bottom:10px;
}

.groupme-avatar,
.groupme-avatar-placeholder{
	width:34px;
	height:34px;
	border-radius:50%;
	flex:0 0 34px;
	margin-right:8px;
}

.groupme-avatar{
	object-fit:cover;
	background:#dee2e6;
}

.groupme-avatar-placeholder{
	background:#6c757d;
	color:#fff;
	font-size:.8rem;
	font-weight:700;
	display:flex;
	align-items:center;
	justify-content:center;
}

.groupme-bubble{
	flex:1;
	background:#f8f9fa;
	border:1px solid #e9ecef;
	border-radius:10px;
	padding:7px 9px;
	line-height:1.3;
}

.groupme-meta{
	margin-bottom:3px;
	font-size:.75rem;
	color:#6c757d;
}

.groupme-name{
	font-weight:700;
	color:#212529;
	margin-right:6px;
}

.groupme-text{
	font-size:.9rem;
	color:#212529;
	white-space:pre-wrap;
	word-break:break-word;
}

.groupme-empty,
.groupme-error{
	padding:12px;
	font-size:.9rem;
	color:#6c757d;
	text-align:center;
}

.groupme-error{
	color:#842029;
	background:#f8d7da;
	border:1px solid #f5c2c7;
	border-radius:6px;
}
.groupmeicon {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask: url('/assets/img/groupmeicon.svg') no-repeat center / contain;
  mask: url('/assets/img/groupmeicon.svg') no-repeat center / contain;
}
/* -----------------------------------
   TABLE STYLING (Leaderboard, Schedule)
----------------------------------- */
.table th,.table td{border: 1px solid #ddd;padding: 10px;text-align: left;
	/* Bootstrap 5 defaults .table cells to vertical-align:top, which top-aligns text in any row
	   that is taller than one line - a wrapped cell, or a row containing a button or select.
	   Everything on this site reads better centred. */
	vertical-align: middle;}
.table th{font-weight: bold;}
.table tr:nth-child(even){background-color: #f2f2f2;}
/* The schedule calendar is the one place that genuinely wants top alignment: the day number
   sits at the top of a tall cell with the event badges beneath it. Higher specificity than the
   .table rule above so it is not overridden. */
.cal-table td.cal-cell, .cal-table td.cal-cell-empty {vertical-align: top;}
/* Tabulator. The legacy rules were written against 5.5.0; the shared library is 6.5.2, whose
   Bootstrap 5 theme sets its own font size, padding and pagination button styling. These bring
   it back to the legacy appearance: amber headers with dark text, amber current page, and type
   sized to the site's 10pt body rather than Bootstrap's 1rem. */
.tabulator {font-size:inherit;}
.tabulator .tabulator-header {background-color:#ffc107;color:#212529;font-weight:bold;}
.tabulator .tabulator-header .tabulator-col {background-color:#ffc107;color:#212529;font-weight:bold;text-align:center;}
.tabulator .tabulator-header .tabulator-col .tabulator-col-content {padding:6px 8px;}
.tabulator .tabulator-header .tabulator-col .tabulator-col-title {font-size:inherit;}
/* Row height is driven by the tallest cell (usually the one holding the Edit button), so the
   row itself is a flex container and every cell centres against it. Setting this on the cell
   alone was not enough - an inline-flex cell still sizes to its own content, not the row. */
.tabulator .tabulator-tableholder .tabulator-table .tabulator-row {display:flex;align-items:stretch;}
.tabulator .tabulator-row .tabulator-cell {padding:5px 8px;font-size:inherit;
	display:flex;align-items:center;
	/* The 6.5.2 theme removes vertical rules entirely (border-right:none), leaving only row
	   lines. Column separators are put back. */
	border-right:1px solid #dee2e6;}
.tabulator .tabulator-row .tabulator-cell:last-of-type {border-right:none;}
.tabulator .tabulator-header .tabulator-col {border-right:1px solid #dee2e6;}
.tabulator .tabulator-header .tabulator-col:last-of-type {border-right:none;}
.tabulator .tabulator-row:nth-child(even) {background-color: #f8f9fa;}
.tabulator .tabulator-row:hover {background-color: #e9ecef;}
.tabulator .tabulator-footer {background-color:#f8f9fa;border-top: 1px solid #dee2e6;font-size:inherit;padding:4px;}
.tabulator .tabulator-footer .tabulator-paginator {background-color: #f8f9fa;border-top: 1px solid #dee2e6;color:#212529;}
.tabulator .tabulator-footer .tabulator-page {background-color:#ffffff;border: 1px solid #dee2e6;color:#212529;font-size:inherit;padding:2px 8px;margin:0 2px;}
.tabulator .tabulator-footer .tabulator-page.active {background-color:#ffc107;color:#212529;border-color:#ffc107;}
.tabulator .tabulator-footer .tabulator-page:not(.disabled):hover {background-color:#e9ecef;color:#212529;}
.tabulator .tabulator-footer .tabulator-page-size {font-size:inherit;padding:2px 6px;}

/* Admin scorecard (scoreentryadmin). Styled to match the Tabulator tables: amber headers with
   dark text, site-sized type, tight padding, and column rules. */
.scorecard-table {font-size:inherit;}
.scorecard-table thead th {background-color:#ffc107;color:#212529;font-weight:bold;text-align:center;
	border:1px solid #dee2e6;padding:6px 8px;vertical-align:middle;}
.scorecard-table tbody th, .scorecard-table tbody td {border:1px solid #dee2e6;padding:5px 8px;
	vertical-align:middle;}
/* Every value cell is centred both ways - the par and handicap rows, the per-nine subtotals and
   the grand total. Only the row label (the leading th) stays left-aligned. */
.scorecard-table tbody td {text-align:center;}
.scorecard-table tbody th {text-align:left;}
.scorecard-table tbody tr:nth-child(even) {background-color:#f8f9fa;}
.scorecard-table tbody tr:hover {background-color:#e9ecef;}
/* Score pickers inside the grid are compact - the standalone field padding is far too big for
   a cell holding a single digit. */
.scorecard-table select.form-control {padding:2px 4px;margin:0;font-size:inherit;text-align:center;
	text-align-last:center;min-width:3.25rem;}
/* A thin rule between TEAMS, so a team reads as one block. Not between individual players. */
.scorecard-table tr.team-sep td {padding:0;height:6px;background-color:var(--bs-golfgreen);
	border:none;}

/* Player admin: the Active checkbox, sized against the other fields rather than the browser
   default, which is tiny beside a 10px-padded input. */
.active-check {padding-left:0;display:flex;align-items:center;gap:.5rem;margin:5px 0;}
.active-check .form-check-input {float:none;margin:0;width:1.75rem;height:1.75rem;border-radius:4px;
	border:1px solid #ccc;}
.active-check .form-check-label {font-weight:bold;font-size:14px;}

#scorecard, #finalesc {width:100%;border-collapse:collapse;}
#scorecard th, #finalesc th {background:var(--bs-warning);text-align:center;border:1px solid #8F6B01;padding:.5rem;vertical-align:middle;}
#scorecard td, #finalesc td {text-align:center;border:1px solid #ccc;padding:.5rem;vertical-align:middle;}
#scorecard .playerscore {text-align:left;white-space: nowrap;}
#scorecard tr.parrow, #scorecard tr.hcprow, #finalesc tr.parrow {background-color:rgba(53,94,59,.35);}
#scorecard .parrow td, #scorecard .hcprow td, #finalesc .parrow td {border:1px solid var(--bs-golfgreen);}

.birdie {border: 1px solid #000;border-radius: 50%;padding: 6px;}
.bogey {border: 1px solid #000;padding: 6px;}
.eagle {border: 3px double #000;border-radius: 50%;padding: 6px;}
.double-bogey {border: 3px double #000;padding: 6px;}
.albatross {position: relative;border: 3px double #000;border-radius: 50%;padding: 6px;}
.albatross::before {content: "";position: absolute;border-radius: 50%;top: -5px;right: -5px;bottom: -5px;left: -5px;border: 1px solid #000;}
.triple-bogey {position: relative;border: 3px double #000;padding: 6px;}
.triple-bogey::before {content: "";position: absolute;top: -5px;right: -5px;bottom: -5px;left: -5px;border: 1px solid #000;}

.payment-qr{width: 100px;height: 100px;object-fit: cover;border-radius: 8px;box-shadow: 0 4px 8px rgba(0,0,0,0.1);}

.scorecard th, .scorecard td{padding: 8px;text-align: center;border: 1px solid #ddd;}
.scorecard th{background-color: #228B22;color: white;font-weight: bold;}
.scorecard input{width: 100%;text-align: center;}
.circle {border-radius: 50%;border: 2px solid #4caf50;}
.square {border: 2px solid #ff5722;}

/* The legacy #dbmsg toast is replaced by Bootstrap alerts rendered from Core\Flash. The
   positioning rule is kept and retargeted so flash messages still float below the navbar
   instead of pushing the page content down. */
.flash-stack {position: fixed;top: 56px;left: 50%;transform: translateX(-50%);z-index: 1000;max-width: 90vw;}
.flash-stack .alert {box-shadow: 0 4px 12px rgba(0,0,0,.15);}

/* Dashboard bits that were inline style attributes in the legacy markup. Same appearance. */
.hcp-note {color:red;}
/* Events played. Amber - the accent already used across this site for table headers and the
   active nav item - so it reads as part of the theme and is instantly distinguishable from the
   red handicap beside it. Darkened slightly from #ffc107 so it stays legible as text on white. */
.played-note {color:#b8860b;font-weight:bold;}
/* The divider between the two values, and between the two labels in the key. Black, so it
   belongs to neither value. */
.key-sep {color:#000;margin:0 .35em;}
.next-event-header {color:maroon;}
.event-modal-link {text-decoration:none;color:maroon;}
.gh-thumb {cursor:pointer;}
.gh-thumb-sm {max-width:20%;height:auto;}
/* The week's money taker - called out so it is readable at a glance on a phone. */
.gh-taker {font-size:1.25rem;font-weight:bold;}

/* Card header title sizing, previously an inline style on each auth page. */
.card-title-sm {font-size:14pt;margin-top:.5em;}
.register-header {background-color:#228B22;color:#fff;}

/* A .btn-link is a button that has to read as a link. Bootstrap gives it the button font size
   (1rem) and the Bootstrap link colour, so next to a real anchor it renders larger and blue
   against the site's Arial 10pt golf-green links. This matches it to the surrounding text. */
.btn-link {font-family:inherit;font-size:inherit;line-height:inherit;color:var(--bs-golfgreen);vertical-align:baseline;}
.btn-link:hover, .btn-link:focus {color:rgba(18,97,18,0.75);}

/* Password strength meter track. Short so it reads as a hint, not a progress bar. */
.pw-meter-track {height:6px;}

/* One-time code entry - spaced out and large enough to read on a phone. */
.otp-input {letter-spacing:.4em;font-size:1.4rem;}

/* Tiebreak highlighting and medal colours for the results scorecard. The legacy include
   emitted these as inline style attributes on every <td>; same colours, now as classes. */
.tb-yellow {background-color:yellow;}
.tb-red {background-color:red;}
.medal-gold {background-color:#FFD700;}
.medal-silver {background-color:#C0C0C0;}
.medal-bronze {background-color:#CD7F32;}

/* Score-entry autosave status line (assets/js/scoreentry.js writes here). Kept separate from
   the server's flash messages so an autosave cannot overwrite a real server message. */
.score-save-status {min-height:1.5em;font-weight:bold;}
.score-save-status.saving {color:#6c757d;}
.score-save-status.ok {color:#006600;}
.score-save-status.err {color:#990000;}

.score-input {text-align: center;text-align-last: center;}
.score-input option {text-align: center;}
.desktop-table th, .desktop-table td, .mobile-table th, .mobile-table td {vertical-align: middle;}
.desktop-table th, .desktop-table td, .mobile-table th, .mobile-table td {text-align: center;}
#inTotalCell,#outTotalCell,#totalScoreCell{font-weight:bold;font-size:2em;}
.desktop-table { display: table; }
.mobile-table { display: none; }
.mobile-th, .mobile-td {width:25%;}
/* Schedule calendar cells. The legacy page repeated these as inline style attributes on every
   <td> of every month. Same dimensions. */
.cal-table {table-layout:fixed;}
.cal-cell {width:calc(100%/7);height:8vh;vertical-align:top;padding:0.25rem;}
.cal-cell-empty {width:calc(100%/7);height:8vh;}

.calcoursename {font-size: .75rem;}
.calgamename {font-size:.65rem;}
#pgaleaders th {background-color:var(--bs-warning);text-align: center;}
#pgaleaders td {text-align: center;}
#pgaleaders td:nth-child(2) {text-align: left;}



/* On screens 768px wide or less, hide the desktop version and show the mobile version */
@media screen and (max-width: 768px) {
	.calcoursename {font-size: .5rem;}
	.calgamename {font-size:.35rem;}
    .desktop-table { display: none; }
    .mobile-table { display: table; }
	.form-group input[type=checkbox]{margin-left: -46vw;}
}
#countdown{width:65%;magin:auto;}
.countdown-item {font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; font-weight: 300;text-shadow: 2px 2px 2px rgba(0,0,0,0.1);}
.countdown-number {
	font-size: 3.5rem;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.1);
}
@media (min-width: 992px) {
	.countdown-number {
		font-size: 7.5rem;
		line-height: 1;
	}
}
.countdown-text{font-size: calc(1.275rem + .3vw);margin-top: 0;margin-bottom: .5rem;font-family: inherit;line-height: 1.2;}
@media (min-width: 1200px) {
	.countdown-text {
		font-size: 1.5rem
	}
}

/* -----------------------------------
   TOURNAMENT BRACKET
   Ported from the ~130 lines of embedded <style> in the legacy standalone bracket.php.
   Same visual design; the custom colour variables it declared are folded into the existing
   golf palette, and the page now renders inside the normal site shell.
----------------------------------- */
:root{
	--br-dark:#1a4731;--br-mid:#2d6a4f;--br-light:#52b788;--br-tint:#f0faf4;
	--br-blue:#1a3a5c;--br-gold:#c9a84c;--br-goldb:#f0d080;
	--br-cream:#f8f5ee;--br-gray:#e8e4db;--br-champ:#8B6914;
}

.bracket-head{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:.5rem;
	background:var(--br-dark);color:#fff;padding:.8rem 1rem;border-bottom:3px solid var(--br-gold);border-radius:6px 6px 0 0;}
.bracket-head h1{font-weight:700;}
.bracket-meta{font-size:.74rem;color:var(--br-goldb);margin-top:.15rem;}
.live-badge{background:#dc3545;color:#fff;font-size:.62rem;font-weight:700;padding:2px 8px;border-radius:20px;
	letter-spacing:.06em;vertical-align:middle;animation:brpulse 1.8s ease-in-out infinite;}
@keyframes brpulse{0%,100%{opacity:1;}50%{opacity:.55;}}

/* Bootstrap tabs restyled to the bracket palette, so they stay keyboard accessible. */
.bracket-tabs{background:var(--br-dark);border-bottom:2px solid var(--br-gold);flex-wrap:nowrap;overflow-x:auto;
	-webkit-overflow-scrolling:touch;}
.bracket-tabs .nav-link{color:rgba(255,255,255,.65);background:transparent;border:0;border-bottom:3px solid transparent;
	font-size:.82rem;font-weight:600;padding:.6rem 1rem;white-space:nowrap;border-radius:0;}
.bracket-tabs .nav-link:hover{color:#fff;}
.bracket-tabs .nav-link.active{color:#fff;background:transparent;border-bottom-color:var(--br-gold);}
.zbadge{background:var(--br-gold);color:#000;font-size:.58rem;font-weight:700;border-radius:10px;padding:1px 5px;vertical-align:middle;}

.bscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:1rem .25rem 2rem;}
.brows{display:flex;align-items:flex-start;gap:0;min-width:max-content;}
.rcol{display:flex;flex-direction:column;min-width:200px;max-width:220px;}
.rlabel{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#999;text-align:center;padding:.3rem 0 .5rem;}

.mc{background:#fff;border:1.5px solid var(--br-gray);border-radius:8px;margin:.3rem .4rem;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.07);}
.mc.active{border-color:var(--br-gold);}
.mc.complete{border-color:var(--br-light);}
.mhdr{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff;padding:3px 8px;text-align:center;line-height:1.4;}
.zone-W .mhdr{background:var(--br-dark);}
.zone-L .mhdr{background:var(--br-blue);}
.zone-C .mhdr{background:var(--br-champ);}
.mnum{opacity:.6;font-size:.55rem;margin-left:4px;}
.playin-label{background:#f0ad4e;color:#000;font-size:.55rem;font-weight:700;padding:1px 6px;border-radius:10px;margin-left:4px;vertical-align:middle;}
.playin-label.bye{background:var(--br-dark);color:#fff;}

.tslot{display:flex;align-items:center;padding:.42rem .6rem;font-size:.8rem;border-bottom:1px solid var(--br-gray);min-height:38px;}
.tslot:last-of-type{border-bottom:none;}
.tslot.won{background:var(--br-tint);font-weight:700;color:var(--br-dark);}
.tslot.lost{color:#bbb;text-decoration:line-through;}
.sbadge{font-size:.62rem;font-weight:700;color:#aaa;min-width:22px;margin-right:.3rem;}
.tname{flex:1;line-height:1.2;word-break:break-word;}
.hbadge{font-size:.62rem;color:#aaa;margin-left:.3rem;}
.src-label{color:#aaa;font-style:italic;font-size:.73rem;}

.mact{padding:.4rem .6rem;background:#fafafa;border-top:1px solid var(--br-gray);}
/* Tall enough to be a comfortable thumb target on a phone. */
.btn-win{font-size:.72rem;padding:8px;border-radius:20px;font-weight:600;width:100%;margin-bottom:.25rem;text-align:left;}
.btn-win:last-child{margin-bottom:0;}
.mstatus{text-align:center;font-size:.7rem;padding:.35rem;background:#fafafa;border-top:1px solid var(--br-gray);color:#aaa;}
.mstatus.done{color:var(--br-mid);font-weight:700;}
.cadv{background:#fffbea;border:1px solid var(--br-gold);border-radius:5px;font-size:.7rem;padding:3px 8px;margin:.3rem .6rem 0;text-align:center;color:var(--br-champ);font-weight:600;}
.champ-wrap{max-width:320px;margin:1.5rem auto;}

.sw{padding:1rem .25rem;}
.sc{background:#fff;border:1.5px solid var(--br-gray);border-radius:8px;overflow:hidden;}
.sh{background:var(--br-dark);color:#fff;font-size:.8rem;font-weight:700;padding:.5rem .75rem;}
.sr{display:flex;align-items:center;padding:.38rem .75rem;border-bottom:1px solid var(--br-gray);font-size:.8rem;}
.sr:last-child{border-bottom:none;}
.sr.out{color:#bbb;text-decoration:line-through;}
.sseed{font-size:.7rem;color:#aaa;min-width:22px;}
.sname{flex:1;margin-left:.3rem;}
.sout{font-size:.68rem;color:#dc3545;font-weight:700;margin:0 .3rem;}
.pips{display:flex;gap:3px;margin-left:auto;}
.pip{width:11px;height:11px;border-radius:50%;background:var(--br-gray);border:1.5px solid #ccc;}
.pip.on{background:#dc3545;border-color:#b02a37;}

.cbanner{background:linear-gradient(135deg,var(--br-dark),var(--br-mid));color:#fff;text-align:center;padding:1.5rem 1rem;border-bottom:3px solid var(--br-gold);}
.cbanner .trophy{font-size:2.5rem;color:var(--br-goldb);}
.cbanner h2{font-size:1rem;font-weight:700;color:var(--br-goldb);margin:.4rem 0 .2rem;}
.cbanner .cname{font-size:1.25rem;font-weight:700;}
.cbanner .cmeta{font-size:.8rem;margin-top:.4rem;color:var(--br-goldb);}

@media(max-width:575px){
	.rcol{min-width:170px;}
	.tslot{font-size:.75rem;}
	.bracket-head h1{font-size:1rem;}
}