/* Small additions on top of playcross-accounts' pca-style.css. */

/* Lets one dashboard view out of .pca-dashboard's own 900px column and up
   to whatever the page's .pc-container allows -- the same width the site
   header uses, so the two line up instead of the content sitting visibly
   narrower than the bar above it.
   Opt-IN rather than raising the shared cap: 900px is a deliberate reading
   and form-filling width for everything else .pca-dashboard wraps, and a
   text input stretched across 1200px is worse, not better. Only wide data
   tables should ask for this. */
.pca-dashboard.tico-dashboard--wide {
	max-width: none;
}

.tico-category-group {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin: 0 0 1rem;
}

.tico-category-group label {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-weight: normal;
}

.tico-inline-form {
	display: inline;
}

/* Registrations view (organizer) — category quick-filter above the full table. */
.tico-reg-tab-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0 0 1rem;
}

.tico-reg-tab {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background: #f0f0f0;
	border: 1px solid #ccc;
	border-radius: 20px;
	padding: 6px 16px;
	font-weight: 600;
	cursor: pointer;
}

.tico-reg-tab.is-active {
	background: #1565c0;
	border-color: #1565c0;
	color: #fff;
}

/* Doubles category buttons only — green once every entry is a confirmed
   real-player link, red while at least one still needs one. */
.tico-reg-pairing-icon {
	display: inline-flex;
}

.tico-reg-pairing-icon.is-paired {
	color: #2e7d32;
}

.tico-reg-pairing-icon.is-unpaired {
	color: #c62828;
}

.pc-tab-panel[hidden] {
	display: none;
}

/* Organizer's "Add a player" search, above the category buttons -- now
   shares its own row with "Max players" (see .tico-reg-max-players below),
   pinned to the right edge of that SAME row rather than stacked underneath
   it (reported directly). Wraps to its own line first on a narrow viewport,
   same as .tico-reg-header-row already does elsewhere on this page. */
.tico-reg-add-player-row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.5rem 1rem;
	margin: 0.5rem 0 1rem;
}

.tico-reg-add-player-search {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.tico-reg-add-player-search input[type="text"] {
	padding: 8px 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
	min-width: 260px;
}

.tico-reg-add-player-search button {
	background: #1565c0;
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 8px 16px;
	cursor: pointer;
}

/* Quick standalone capacity control, right-aligned in the same row as the
   player search above -- own small form (see render_registrations()'s own
   POST handling) rather than requiring the full create/edit form just to
   set/change this one field. */
.tico-reg-max-players {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.tico-reg-max-players label {
	font-weight: 600;
	white-space: nowrap;
}

.tico-reg-max-players input[type="number"] {
	width: 5rem;
	padding: 8px 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
}

.tico-reg-max-players button {
	background: #1565c0;
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 8px 16px;
	cursor: pointer;
}

.tico-reg-add-player-matches {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
}

.tico-reg-add-player-matches li {
	padding: 0.3rem 0;
	border-bottom: 1px solid #e0e0e0;
}

/* Every "Back to ..." navigation link across the dashboard — exact same
   grey pill as the public "Entry Closed" badge (.pc-tournament-entry-badge
   .is-closed in tournaments.css). */
.tico-back-link {
	display: inline-block;
	padding: 0.4rem 1rem;
	border-radius: 999px;
	border: 1px solid var(--pc-light-border);
	font-family: var(--pc-font-heading);
	font-weight: 700;
	font-size: 0.8125rem;
	white-space: nowrap;
	text-decoration: none;
	color: var(--pc-light-text-muted);
}

/* "Unpublish" on Create a schedule is the first <button> (not <a>) to wear
   this class -- resets the browser's own default button chrome so it
   still reads as the same transparent grey pill instead of a boxy native
   button. */
button.tico-back-link {
	background: none;
	cursor: pointer;
}

/* Same fill-on-hover convention as the public badges (.is-open/.is-withdraw
   in tournaments.css) — solid with its own color, text turns white. */
.tico-back-link:hover,
.tico-back-link:focus-visible {
	background: var(--pc-light-text-muted);
	border-color: var(--pc-light-text-muted);
	color: var(--pc-light-surface);
}

/* Registrations view header — "Back to list" left, "Creating draws" pinned
   to the right edge of the same row instead of stacked on its own line. */
.tico-reg-header-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
}

.tico-reg-header-back {
	margin: 0;
}

.tico-reg-header-draws {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	text-align: right;
	gap: 0.25rem;
}

.tico-draws-hint {
	display: block;
}

/* "Creating draws" link on the Registrations view — grey/disabled until the
   entry deadline has passed and every doubles entry has a confirmed
   partner, green once the field is actually final and ready to draw. */
.tico-draws-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	border-radius: 20px;
	padding: 8px 20px;
	font-weight: 700;
	text-decoration: none;
}

/* Exact same green as the public "Online Entry" badge (.pc-tournament-entry-badge.is-open in tournaments.css), not a plugin-local color. */
.tico-draws-link.is-ready {
	background: transparent;
	color: var(--pc-green);
	border: 1px solid var(--pc-green);
}

.tico-draws-link.is-ready:hover,
.tico-draws-link.is-ready:focus-visible {
	background: var(--pc-green);
	color: var(--pc-light-surface);
}

.tico-draws-link.is-not-ready {
	background: #f0f0f0;
	border: 1px solid #ccc;
	color: #757575;
	cursor: default;
}

/* "Creating draws" view — the big automatic-draw button + secondary manual link. */
.tico-draws-actions {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 0 0 1.5rem;
}

/* "Save draws"/"Create a schedule" -- pinned to the right of the same row
   as "Back to registrations" (.tico-reg-header-row, reused verbatim from
   the Registrations view). Both reuse .tico-draws-link's own is-ready/
   is-not-ready green-vs-grey convention (see the "Creating draws" link on
   Registrations) -- a <button> here gets the exact same look as the <a>
   there, since the classes don't care which tag they're applied to. */
.tico-draws-header-actions {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.tico-draws-header-actions form {
	display: inline;
}

.tico-draws-header-actions .tico-draws-link[aria-disabled] {
	cursor: default;
}

/* Status line sitting just ahead of Publish/Unpublish in the same row:
   "everything is placed" before publishing, "published <when>" after. Kept
   as plain text rather than another pill on purpose -- the pill next to it
   is the ACTION, and giving its neighbour the same weight would leave two
   things competing to be clicked. */
.tico-schedule-status {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.85em;
	font-weight: 600;
}

/* The `display` above is an author rule and outranks the browser's own
   lower-priority [hidden]{display:none}, so without this the completion
   note would stay on screen even while hidden. Same fix
   .tico-schedule-auto-actions and the theme's .pc-btn[hidden] carry. */
.tico-schedule-status[hidden] {
	display: none;
}

/* Same green the row already uses for "ready" (.tico-draws-link.is-ready),
   so finishing the schedule and being allowed to publish it read as one
   state rather than two unrelated colours. */
.tico-schedule-status.is-complete {
	color: var(--pc-green);
}

.tico-schedule-status.is-complete::before {
	content: "\2713"; /* Decorative tick -- the sentence carries the meaning on its own. */
	font-size: 1.1em;
	line-height: 1;
}

/* Factual, not celebratory: the schedule is already out, so this is just a
   record of when. Muted so it never competes with Unpublish beside it. */
.tico-schedule-status.is-published {
	color: var(--pc-light-text-muted);
	font-weight: 500;
}

/* Hover-preview of a drawn category's groups — shown on hovering anywhere
   over that category's row, anchored to the category cell so it doesn't
   disturb the table's own layout/row height. */
.tico-draws-category-cell {
	position: relative;
}

.tico-draws-preview {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 20;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
	padding: 12px 16px;
	min-width: 260px;
	max-width: 480px;
	max-height: 320px;
	overflow-y: auto;
	text-align: left;
	white-space: normal;
	font-weight: normal;
}

.pca-dashboard-table tbody tr:hover .tico-draws-preview {
	display: block;
}

/* Added by tico-draws-preview.js when the row is low enough on the page
   that opening downward would run off the bottom of the viewport. */
.tico-draws-preview.tico-draws-preview--above {
	top: auto;
	bottom: 100%;
}

.tico-draws-preview-group + .tico-draws-preview-group {
	margin-top: 10px;
}

.tico-draws-preview-group h4 {
	margin: 0 0 4px;
	font-size: 0.85em;
}

.tico-draws-preview table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.85em;
}

.tico-draws-preview th,
.tico-draws-preview td {
	padding: 2px 6px;
	text-align: left;
	border: none;
}

.tico-draws-big-button {
	background: #1565c0;
	color: #fff;
	border: none;
	border-radius: 6px;
	padding: 14px 28px;
	font-size: 1.1em;
	font-weight: 700;
	cursor: pointer;
}

/* ============================ Registrations list — dense row layout */

/* Rebuilt from <table> to CSS grid, to a supplied reference. Grid rather than
   a table because the doubles layout needs one ROW to hold two players
   stacked, which a table can only fake with rowspan -- and rowspan is exactly
   what made the old markup hard to read and impossible to restyle.
   Semantics are kept with role="table"/"row"/"cell" on the wrappers.

   The palette here is the reference's own, and it is the accounts-plugin blue
   family the rest of Tournament Builder already wears, not the public site's
   navy and red. This is the organizer's back office; it looks like one. */
.tico-reg-card {
	margin: 0 0 var(--pc-space-md, 1.5rem);
	border: 1px solid #dfe5e8;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 1px 2px rgba( 15, 43, 51, 0.05 );
	font-variant-numeric: tabular-nums;
}

.tico-reg-card-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
	padding: 10px 16px;
	border-bottom: 1px solid #e6ebed;
}

.tico-reg-card-title {
	margin: 0;
	font-size: 14px;
	font-weight: 700;
	color: #17323a;
}

/* The per-category summary. It sits with its own table rather than on the
   shared tab strip: the strip is one row for every category at once, and this
   count belongs to exactly one of them. */
.tico-reg-card-summary {
	margin: 0;
	font-size: 12.5px;
	color: #5d7078;
}

.tico-reg-card-summary strong {
	color: #17323a;
}

.tico-reg-foot {
	padding: 8px 16px;
	font-size: 12px;
	color: #5d7078;
}

/* ------------------------------------------------------------ The rows */

.tico-reg-row {
	display: grid;
	align-items: center;
	gap: 12px;
	padding: 7px 16px;
	/* The same hairline the Tournaments list draws (.pca-dashboard-table in
	   playcross-accounts), so the two tables in this back office separate
	   their rows identically. */
	border-bottom: 1px solid #e0e0e0;
	font-size: 13.5px;
}

/* The card already draws its own edge, so the final row keeps its line only
   where a foot line follows it. */
.tico-reg-body .tico-reg-row:last-child {
	border-bottom: 0;
}

/* Zebra banding, nth-of-type rather than nth-child so the "Without a
   confirmed partner" <p> divider does not shift the stripe pattern of the
   rows below it. Kept to a 1.5% tint: enough to follow a row across to the
   Status column, quiet enough that the seed badges stay the loudest thing. */
.tico-reg-body .tico-reg-row:nth-of-type( even ) {
	background: #f8fafb;
}

.tico-reg-body .tico-reg-row:hover,
.tico-reg-body .tico-reg-row:nth-of-type( even ):hover {
	background: #eef4f7;
}

.tico-reg-row--head {
	background: #fafbfc;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: #5d7078;
}

/* Three column sets, one per table this view renders. */
/* The Player/Pair column is sized to its own names rather than given the
   free space: Category reads as a property of the name it belongs to, so it
   follows it directly. The slack goes to Status instead, which keeps the
   pills and the Edit/Del pair anchored on the right edge. */
.tico-reg-row--singles {
	grid-template-columns: 30px 66px minmax( 230px, max-content ) 128px minmax( 84px, 1fr ) 62px;
}

.tico-reg-row--doubles {
	grid-template-columns: 30px 66px minmax( 300px, max-content ) 116px minmax( 84px, 1fr ) 62px;
}

.tico-reg-row--all {
	grid-template-columns: minmax( 200px, 1fr ) 150px minmax( 220px, 1.2fr ) 84px 62px;
}

/* Six columns, because unofficial entries carry the fields no other panel
   needs: a guest has no account to look any of them up from. */
.tico-reg-row--unofficial {
	grid-template-columns: minmax( 170px, 1fr ) 150px 104px minmax( 180px, 1fr ) 74px 128px;
}

/* ----------------------------------------------------------- The cells */

/* Alignment split out from colour on purpose: the PTS column header needs to
   sit over its own digits, but it must keep the muted grey the other headers
   wear rather than picking up the darker ink of the numbers below it. */
.tico-reg-num {
	text-align: right;
}

.tico-reg-pts {
	color: #3d5259;
}

.tico-reg-player-name {
	font-weight: 600;
	color: #17323a;
}

/* A player ID is a code, read digit by digit when someone is checking they
   have the right person -- quiet, but never decorative. #5d7078 measures well
   past the floor at this size where the reference's own #9aa9af does not. */
.tico-reg-player-id {
	margin-left: 5px;
	font-size: 11.5px;
	color: #5d7078;
}

/* block, so a pair's two players stack. Inline spans put them side by side on
   one line, which is the whole thing this layout exists to stop. */
.tico-reg-pair-line {
	display: block;
}

.tico-reg-pair-line + .tico-reg-pair-line {
	margin-top: 2px;
}

.tico-reg-cat {
	color: #3d5259;
}

.tico-reg-note {
	margin-left: 6px;
	font-style: italic;
	color: #8a6410;
}

.tico-reg-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	font-size: 12px;
	white-space: nowrap;
}

.tico-reg-actions a {
	color: #1266cc;
}

.tico-reg-actions .tico-reg-del {
	color: #b3403a;
}

/* --------------------------------------------------------- Seed badge */

.tico-reg-seed {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 26px;
	height: 22px;
	padding: 0 5px;
	border-radius: 5px;
	font-size: 12px;
	font-weight: 700;
}

.tico-reg-seed.is-seeded {
	background: #1266cc;
	color: #fff;
}

.tico-reg-seed.is-unseeded {
	background: #f1f4f5;
	color: #5d7078;
}

/* -------------------------------------------------------- Status pill */

/* Two states, because two is all the product has: a registration is either
   published or withdrawn. The reference also drew a "Waiting" pill, but
   nothing in this codebase ever puts anybody on a waiting list -- max_players
   is a note on the tournament, not a gate -- so it is not drawn here either. */
.tico-reg-status {
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 11.5px;
	font-weight: 600;
	white-space: nowrap;
}

.tico-reg-status.is-active {
	background: #e9f6ee;
	color: #14663c;
}

.tico-reg-status.is-withdrawn {
	background: #f1f4f5;
	color: #5d7078;
}

/* ------------------------------------------------- "Without a partner" */

/* Unpaired entries are not interleaved with the pairs -- they are the
   organizer's to-do list, and a list is easier to work through when it is one
   block rather than scattered between finished rows. */
.tico-reg-divider {
	padding: 6px 16px;
	border-bottom: 1px solid #f1f4f5;
	background: #fffaf2;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #7a5a0e;
}

@media ( max-width: 900px ) {
	.tico-reg-card {
		overflow-x: auto;
	}

	.tico-reg-row {
		min-width: 760px;
	}
}

/* Title and the search/Max-players pair on one line, so the controls stop
   occupying a block of their own halfway down the page. */
/* Sits directly under the title row, above the category panels, so it is read
   before the seed numbers it qualifies rather than after them. */
.tico-reg-frozen-note {
	margin: -6px 0 14px;
	font-size: 13px;
	line-height: 1.45;
}

.tico-reg-title-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 20px;
	margin: 0 0 14px;
}

.tico-reg-title {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
	color: #17323a;
}

/* The tournament's own name, quieter than the word Registrations in front of
   it, and the first thing to give way when the row runs out of room. */
.tico-reg-title-name {
	font-size: 13px;
	font-weight: 400;
	color: #5d7078;
}

.tico-reg-title-row .tico-reg-add-player-row {
	flex: 0 0 auto;
	margin: 0;
}

.tico-reg-guest-open {
	font-size: 12.5px;
}
