/* Tennis calendar: deliberately scoped so the football hub keeps its styles. */
.livescore.tennis-calendar {
	container: tennis-calendar / inline-size;
	box-sizing: border-box;
	padding: 20px;
	border-radius: 20px;
	background: #eef2f7;
	color: #203342;
	font-family: inherit;
}
.tennis-calendar *, .tennis-calendar *::before, .tennis-calendar *::after { box-sizing: border-box; }
.tennis-calendar [hidden] { display: none !important; }
.tennis-calendar [data-tennis-group][id] { scroll-margin-top: 100px; }
.tennis-calendar [data-tennis-group][id]:focus-visible { outline: 2px solid #2456a6; outline-offset: 3px; }
/* The tournament navigation lives beside the board, inside the tennis sidebar. */
.sidebar-odds.sitis-tennis-sidebar .tennis-navigation { display: block; min-width: 0; padding: 4px; }
.sidebar-odds.sitis-tennis-sidebar .tennis-navigation[hidden] { display: none !important; }
.sidebar-odds.sitis-tennis-sidebar .tennis-navigation .odds-league-item {
	display: block; padding: 12px; border-radius: 3px; color: #fff; font-size: 14px; line-height: 1.4;
	text-decoration: none; overflow-wrap: anywhere;
}
.sidebar-odds.sitis-tennis-sidebar .tennis-navigation .odds-league-item::before { content: none; }
.sidebar-odds.sitis-tennis-sidebar .tennis-navigation .odds-league-item:hover,
.sidebar-odds.sitis-tennis-sidebar .tennis-navigation .odds-league-item[aria-current="location"] { background: #3b4b58; color: #ffd200; }
.sidebar-odds.sitis-tennis-sidebar .tennis-navigation .odds-league-item:focus-visible { outline: 2px solid #ffd200; outline-offset: -2px; }
@media (max-width: 1023px) {
	.sidebar-odds.sitis-tennis-sidebar .sidebar { display: block; position: static; height: auto; visibility: visible; min-width: 0; }
	.sidebar-odds.sitis-tennis-sidebar .tennis-navigation {
		display: flex; gap: 8px; height: 56px; width: 100%; max-width: 100%; padding: 0 14px 12px;
		box-sizing: border-box; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch;
	}
	.sidebar-odds.sitis-tennis-sidebar .tennis-navigation .odds-league-item {
		flex: 0 0 auto; height: 44px; padding: 12px; box-sizing: border-box; background: #192631;
		line-height: 20px; white-space: nowrap; overflow-wrap: normal;
	}
	/* Add the horizontal strip to the theme's 52px mobile category reserve. */
	.sidebar-odds.sitis-tennis-sidebar.mob-fixed:has(.tennis-navigation:not([hidden])) + .odds-container { padding-top: 108px; }
	.tennis-calendar [data-tennis-group][id] { scroll-margin-top: 180px; }
}
.tennis-calendar button { font-family: inherit; cursor: pointer; touch-action: manipulation; }
.tennis-calendar button:focus-visible { outline: 2px solid #2456a6; outline-offset: 3px; }
.tennis-calendar button:disabled { cursor: default; opacity: .4; }
.tennis-calendar .livescore-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; }
.tennis-calendar .livescore-datepill { position: relative; display: flex; align-items: center; gap: 8px; }
.tennis-calendar [data-tennis-prev], .tennis-calendar [data-tennis-next],
.tennis-calendar [data-tennis-month-prev], .tennis-calendar [data-tennis-month-next] {
	display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
	width: 34px; height: 34px; padding: 0; border: 1px solid #e2e8ef; border-radius: 50%;
	background: #fff; color: #56616b; font-size: 18px; line-height: 1;
}
.tennis-calendar [data-tennis-calendar-toggle] {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	min-height: 36px; padding: 8px 12px; border: 1px solid #e2e8ef; border-radius: 999px;
	background: #fff; color: #0e2a47; font-size: 13px; font-weight: 700; line-height: 1.4;
}
.tennis-calendar [data-tennis-date-label] { white-space: nowrap; }
/* These states must win even when the football theme stylesheet loads last. */
.livescore.tennis-calendar [data-tennis-calendar-panel] {
	display: block; position: absolute; left: 0; right: auto; top: calc(100% + 8px); z-index: 30;
	width: 288px; max-width: calc(100vw - 40px); padding: 14px;
	border: 1px solid #e2e8ef; border-radius: 12px; background: #fff;
	box-shadow: 0 8px 28px rgb(20 40 70 / 16%);
}
.tennis-calendar .livescore-calendar-head { display: flex; align-items: center; justify-content: space-between; gap: 4px; margin-bottom: 10px; font-size: 14px; font-weight: 800; }
.tennis-calendar [data-tennis-month-title] { text-align: center; }
.livescore.tennis-calendar [data-tennis-calendar-grid] { display: block; }
.tennis-calendar .tennis-calendar-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
.tennis-calendar [role="columnheader"] { padding: 4px 0; color: #687786; text-align: center; font-size: 11px; font-weight: 700; }
.tennis-calendar [data-tennis-day] {
	display: block; width: 100%; min-height: 32px; padding: 7px 0; border: 0; border-radius: 8px;
	background: transparent; color: #0e2a47; font-size: 13px; line-height: 1.4; text-align: center;
}
.tennis-calendar [data-tennis-day]:hover:not(:disabled) { background: #eaf0f8; }
.tennis-calendar [data-tennis-day].other-month { color: #65768a; }
.tennis-calendar [data-tennis-day][aria-current="date"] { font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.tennis-calendar [data-tennis-day].is-selected { background: #2456a6; color: #fff; font-weight: 800; }
.tennis-calendar [data-tennis-filters] { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: 0 0 14px; }
.tennis-calendar [data-tennis-filter] {
	display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 13px;
	border: 1px solid #e2e8ef; border-radius: 999px; background: #fff; color: #56616b;
	font-size: 13px; font-weight: 600; line-height: 1.4;
}
.tennis-calendar [data-tennis-filter]:hover { border-color: #2456a6; }
.tennis-calendar [data-tennis-filter][aria-pressed="true"] { border-color: #203342; background: #203342; color: #fff; }
.tennis-calendar [data-tennis-count] { font-size: 11px; font-weight: 700; opacity: .8; }
.tennis-calendar .chip-dot { color: #d92d20; }
.tennis-calendar [aria-pressed="true"] .chip-dot { color: inherit; }
.tennis-calendar [data-tennis-message] { margin: 0 0 12px; padding: 10px 12px; border-radius: 8px; background: #fff; color: #56616b; font-size: 13px; line-height: 1.5; }
.tennis-calendar [data-tennis-retry], .tennis-calendar [data-tennis-stats-retry] { padding: 3px 6px; border: 0; background: transparent; color: #2456a6; font-size: inherit; font-weight: 700; text-decoration: underline; }
.tennis-calendar .livescore-empty { padding: 32px 16px; border: 1px solid #e9edf1; border-radius: 12px; background: #fff; color: #56616b; font-size: 14px; text-align: center; }
.tennis-calendar .livescore-empty strong { display: block; margin-bottom: 5px; color: #203342; }
.tennis-calendar .livescore-competition { overflow: hidden; margin-bottom: 16px; border: 1px solid #e3e8ef; border-radius: 12px; background: #fff; box-shadow: 0 4px 13px rgb(71 81 93 / 16%); }
.tennis-calendar .livescore-competition-head { display: flex; padding: 12px 24px; border-bottom: 0; background: #203342; }
.tennis-calendar .livescore-competition-head > div { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; width: 100%; min-width: 0; }
.tennis-calendar .livescore-competition-name { color: #fff; font-size: 18px; font-weight: 800; line-height: 1.4; overflow-wrap: anywhere; }
.tennis-calendar .livescore-competition-info { display: block; color: #b9c4d0; font-size: 14px; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.tennis-calendar .livescore-match { border-bottom: 1px solid #e9edf1; }
.tennis-calendar .livescore-match:last-child { border-bottom: 0; }
.tennis-calendar .livescore-match-row.row-tennis {
	display: grid; grid-template-columns: 104px minmax(0, 1fr) auto auto; grid-template-rows: auto auto;
	column-gap: 16px; row-gap: 8px; align-items: center; padding: 14px 24px;
	color: inherit; cursor: default; text-decoration: none;
}
.tennis-calendar .row-tennis:hover { transform: none; }
.tennis-calendar .row-tennis .livescore-match-time { grid-column: 1; grid-row: 1 / 3; min-width: 0; color: #5b6775; font-size: 13px; font-weight: 800; line-height: 1.4; text-align: left; overflow-wrap: anywhere; }
.tennis-calendar .row-tennis .live-minutes { color: #d92d20; font-weight: 800; }
.tennis-calendar .row-tennis .live-minutes-dot { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: #d92d20; }
.tennis-calendar .status-suspended .livescore-match-time { color: #9b3d2e; }
.tennis-calendar .status-suspended .live-minutes-dot { display: none; animation: none; }
.tennis-calendar .livescore-match-status-note { display: block; margin-top: 3px; color: #5b6775; font-size: 12px; font-weight: 500; }
.tennis-calendar .row-tennis .livescore-match-players {
	grid-column: 2; grid-row: 1 / 3; display: grid; grid-template-rows: repeat(2, minmax(28px, 1fr));
	gap: 8px; align-self: stretch; min-width: 0;
}
.tennis-calendar .row-tennis .livescore-match-side.side-home,
.tennis-calendar .row-tennis .livescore-match-side.side-away {
	position: relative; display: flex; flex-wrap: wrap; align-content: center; align-items: center; justify-content: flex-start;
	gap: 3px 8px; height: auto; min-height: 28px; min-width: 0; padding-left: 16px;
}
.tennis-calendar .row-tennis .livescore-serve-dot { position: absolute; left: 0; top: calc(50% - 5px); width: 10px; height: 10px; border-radius: 50%; background: transparent; }
.tennis-calendar .row-tennis .side-serving .livescore-serve-dot { background: #29be80; }
.tennis-calendar .status-suspended .side-serving .livescore-serve-dot { background: transparent; }
.tennis-calendar .livescore-match-player { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; min-width: 0; }
.tennis-calendar .row-tennis ._flag2._bg.s { width: 20px; height: 14px; border-radius: 2px; flex: 0 0 auto; }
.tennis-calendar .row-tennis .livescore-player-name,
.tennis-calendar .row-tennis .livescore-team-name { min-width: 0; overflow: visible; color: #203342; font-size: 16px; font-weight: 700; line-height: 1.3; text-align: left; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
.tennis-calendar .livescore-player-rank { color: #5b6775; font-size: 11px; font-weight: 500; line-height: 1.4; white-space: nowrap; }
.tennis-calendar .row-tennis .side-loser .livescore-player-name { color: #5b6775; font-weight: 400; }
.tennis-calendar .livescore-winner-mark { margin-left: 2px; color: #0e7d5e; font-weight: 700; }
.livescore.tennis-calendar .livescore-outcome-mark {
	display: inline-block; flex: 0 0 auto; padding: 1px 5px; border-radius: 4px;
	background: #edf0f4; color: #5b6775; font-size: 12px; font-weight: 700; line-height: 1.5; white-space: nowrap;
}
.livescore.tennis-calendar .side-winner .livescore-outcome-mark { background: #e4f5ed; color: #0e624a; }
.tennis-calendar .row-tennis .livescore-match-sets { grid-column: 3; grid-row: 1 / 3; display: flex; align-self: stretch; gap: 4px; }
.tennis-calendar .row-tennis .livescore-set-column { display: grid; grid-template-rows: repeat(2, minmax(28px, 1fr)); gap: 8px; width: 32px; }
.tennis-calendar .row-tennis .livescore-set-score {
	position: relative; z-index: 0; display: flex; align-self: center; align-items: center; justify-content: center;
	width: 32px; height: 28px; border-radius: 0; background: transparent; color: #5b6775;
	font-size: 16px; font-weight: 600; line-height: 1; font-variant-numeric: tabular-nums;
}
.tennis-calendar .row-tennis .set-current .livescore-set-score { color: #203342; font-weight: 900; }
.tennis-calendar .row-tennis .set-current .livescore-set-score::before { content: ""; position: absolute; z-index: -1; inset: 1px 3px; border-radius: 6px; background: #eaf0f8; }
/* Game points use their own compact cells, separate from the current set games. */
.livescore.tennis-calendar .row-tennis .livescore-game-score {
	border: 1px solid #6cb49a; border-radius: 6px; background: #e4f5ed; color: #0e624a;
	font-size: 13px; font-weight: 800; white-space: nowrap;
}
.livescore.tennis-calendar .row-tennis .points-unavailable .livescore-game-score {
	border-color: #d5dce4; background: #f0f3f6; color: #687787; font-weight: 500;
}
.tennis-calendar .row-tennis .livescore-set-score sup { position: relative; top: -5px; margin-left: 1px; font-size: 11px; font-weight: 600; line-height: 1; }
.tennis-calendar .status-finished .row-tennis:has(.side-home.side-winner) .livescore-set-score:first-child,
.tennis-calendar .status-finished .row-tennis:has(.side-away.side-winner) .livescore-set-score:last-child { color: #203342; font-weight: 800; }
.tennis-calendar .row-tennis [data-tennis-detail-toggle] {
	grid-column: 4; grid-row: 1 / 3; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	width: auto; height: 40px; margin: 0; padding: 0 16px; border: 1px solid #c9ced6; border-radius: 999px;
	background: #fff; color: #203342; font-size: 14px; font-weight: 600; line-height: 1.4; white-space: nowrap;
}
.tennis-calendar .row-tennis [data-tennis-detail-toggle]:hover { border-color: #203342; }
.tennis-calendar .row-tennis [aria-expanded="true"] { color: #2456a6; }
.tennis-calendar .livescore-match-arrow-icon { font-size: 12px; line-height: 1; transition: transform .15s; }
.tennis-calendar [aria-expanded="true"] .livescore-match-arrow-icon { transform: rotate(180deg); }
.tennis-calendar .is-expanded .row-tennis { background: #f7f9fc; }
.livescore.tennis-calendar [data-tennis-detail] { display: block; padding: 15px 24px; border-top: 2px solid #fff; background: #f7f9fc; }
.tennis-calendar [data-tennis-stats] { color: #56616b; font-size: 13px; }
.tennis-calendar [data-tennis-stats] table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 13px; }
.tennis-calendar [data-tennis-stats] th, .tennis-calendar [data-tennis-stats] td { padding: 6px 4px; border-bottom: 1px solid #e3e8ef; text-align: center; overflow-wrap: anywhere; }
.tennis-calendar [data-tennis-stats] caption { margin-bottom: 6px; color: #203342; font-weight: 700; text-align: left; }
@supports (grid-template-rows: subgrid) {
	.tennis-calendar .row-tennis .livescore-match-players { grid-template-rows: subgrid; row-gap: inherit; }
	.tennis-calendar .row-tennis .livescore-match-sets { display: grid; grid-template-rows: subgrid; grid-auto-flow: column; grid-auto-columns: 32px; gap: inherit; column-gap: 4px; }
	.tennis-calendar .row-tennis .livescore-set-column { grid-row: 1 / 3; grid-template-rows: subgrid; gap: inherit; width: auto; }
}
@media (max-width: 599px) {
	.livescore.tennis-calendar { padding: 20px 8px 10px; }
}
/* The board can also be narrow beside the desktop navigation sidebar. */
@container tennis-calendar (max-width: 599px) {
	.tennis-calendar .livescore-competition-head { padding: 12px 16px; }
	.tennis-calendar .livescore-competition-head > div { flex-direction: column; gap: 2px; }
	.tennis-calendar .livescore-match-row.row-tennis { grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto auto; column-gap: 8px; row-gap: 6px; padding: 12px; }
	.tennis-calendar .row-tennis .livescore-match-time { grid-row: 1; grid-column: 1; justify-self: start; margin-bottom: 4px; }
	.tennis-calendar .row-tennis .livescore-match-status-note { display: inline; margin-left: 4px; }
	.tennis-calendar .row-tennis [data-tennis-detail-toggle] { grid-row: 1; grid-column: 2; justify-self: end; height: 30px; padding: 0; border: 0; background: transparent; color: #2456a6; font-size: 13px; }
	.tennis-calendar .row-tennis .livescore-match-players { grid-row: 2 / 4; grid-column: 1; gap: 6px; }
	.tennis-calendar .row-tennis .livescore-match-side.side-home, .tennis-calendar .row-tennis .livescore-match-side.side-away { min-height: 30px; column-gap: 6px; padding-left: 12px; }
	.tennis-calendar .row-tennis .livescore-serve-dot { width: 8px; height: 8px; top: calc(50% - 4px); }
	.tennis-calendar .row-tennis .livescore-match-sets { grid-row: 2 / 4; grid-column: 2; grid-auto-columns: 24px; gap: 6px 2px; }
	.tennis-calendar .row-tennis .livescore-set-column { width: 24px; gap: 6px; }
	.tennis-calendar .row-tennis .livescore-set-score { width: 24px; height: 30px; }
	.tennis-calendar .row-tennis .set-current .livescore-set-score::before { inset: 0; }
	.livescore.tennis-calendar [data-tennis-detail] { padding: 16px; }
	.tennis-calendar [data-tennis-filter] { gap: 4px; padding-inline: 9px; }
}
/* Five sets plus game points need room for whole surname words at phone widths. */
@container tennis-calendar (max-width: 399px) {
	.livescore.tennis-calendar .row-tennis:has(.livescore-set-column:nth-child(5):not(.livescore-game-column)) .livescore-match-sets { grid-auto-columns: 20px; column-gap: 1px; }
	.livescore.tennis-calendar .row-tennis:has(.livescore-set-column:nth-child(5):not(.livescore-game-column)) .livescore-set-column,
	.livescore.tennis-calendar .row-tennis:has(.livescore-set-column:nth-child(5):not(.livescore-game-column)) .livescore-set-score { width: 20px; }
	.livescore.tennis-calendar .row-tennis:has(.livescore-set-column:nth-child(5):not(.livescore-game-column)) .livescore-game-score { font-size: 12px; }
	.livescore.tennis-calendar .row-tennis:has(.livescore-set-column:nth-child(5):not(.livescore-game-column)) .livescore-match-player { flex-wrap: wrap; gap: 2px 3px; }
	.livescore.tennis-calendar .row-tennis:has(.livescore-set-column:nth-child(5):not(.livescore-game-column)) .livescore-player-name { min-width: min-content; overflow-wrap: normal; word-break: normal; }
}
/* Fallback for browsers without container queries. */
@supports not (container-type: inline-size) {
	@media (max-width: 599px) {
		.tennis-calendar .livescore-match-row.row-tennis { grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto auto; gap: 6px 8px; padding: 12px; }
		.tennis-calendar .row-tennis .livescore-match-time { grid-column: 1; grid-row: 1; }
		.tennis-calendar .row-tennis [data-tennis-detail-toggle] { grid-column: 2; grid-row: 1; padding: 0; border: 0; }
		.tennis-calendar .row-tennis .livescore-match-players { grid-column: 1; grid-row: 2 / 4; }
		.tennis-calendar .row-tennis .livescore-match-sets { grid-column: 2; grid-row: 2 / 4; grid-auto-columns: 24px; column-gap: 2px; }
		.tennis-calendar .row-tennis .livescore-set-column, .tennis-calendar .row-tennis .livescore-set-score { width: 24px; }
	}
}
@media (prefers-reduced-motion: reduce) {
	.tennis-calendar *, .tennis-calendar *::before, .tennis-calendar *::after { animation: none !important; transition: none !important; }
}
