/*
 * FM Frequency List — additions on top of FM Station Profile's style.css.
 * Base look (fonts, colours, cards, table, zebra rows, right-aligned third
 * column) comes from that stylesheet via the shared classes
 * .fm-station-profile / .fm-sp-section / .fm-sp-card / .fm-sp-frequencies.
 * Everything here is scoped to .fm-frequency-list.
 */

/* Below its minimum width (set inline, computed from the column widths in
   the PHP file) the table scrolls sideways inside the card instead of
   overflowing the page, and the status dot + Site name stay put. */
.fm-frequency-list .fm-fl-scroll{
	overflow-x:auto;
	-webkit-overflow-scrolling:touch;
}
.fm-frequency-list .fm-fl-table{
	table-layout:fixed;
}
.fm-frequency-list .fm-fl-table td{
	overflow-wrap:anywhere; /* long values wrap instead of widening the table */
}

/* Column widths are fixed and set inline on the headings (see
   fm_fl_columns() in the PHP file); Station name takes what is left.
   Pol. is only 60px wide, so its cells get less padding to fit the heading. */
.fm-frequency-list .fm-fl-table th.fm-fl-col-pol,
.fm-frequency-list .fm-fl-table td.fm-fl-c-pol{padding-left:6px;padding-right:6px;}

/* Station name: text column, same font as Site name (the rest is mono). */
.fm-frequency-list .fm-fl-table td.fm-fl-station{
	font-family:'IBM Plex Sans', Arial, sans-serif;font-size:13px;
}

/* Status dot + Site name stay visible while the other columns scroll sideways. */
.fm-frequency-list .fm-fl-table .fm-fl-sticky{
	position:sticky;left:0;z-index:1;
}
/* Site name's offset (left) is set inline = the status column's real width. */
.fm-frequency-list .fm-fl-table thead th.fm-fl-sticky{background:#EFEFEB;}
.fm-frequency-list .fm-fl-table tbody td.fm-fl-sticky{background:var(--fm-surface);}
.fm-frequency-list .fm-fl-table tbody tr:nth-child(odd) td.fm-fl-sticky{background:var(--fm-row);}
.fm-frequency-list .fm-fl-table tbody tr:hover td.fm-fl-sticky{background:#EEF5F5;}

/* Phones: slightly tighter cells. */
@media (max-width:600px){
	.fm-frequency-list .fm-fl-table th,
	.fm-frequency-list .fm-fl-table td{padding-left:8px;padding-right:8px;}
	.fm-frequency-list .fm-fl-table td{font-size:12px;}
	.fm-frequency-list .fm-fl-table td.fm-fl-station{font-size:12.5px;}
}

/* --- Heading row: section title left, Active only / All radios right --- */
.fm-frequency-list .fm-fl-toolbar{
	display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
	gap:6px 20px;margin:0 0 10px;
}
.fm-frequency-list .fm-fl-toolbar .fm-sp-section{margin:0;}
.fm-frequency-list .fm-fl-status-filter{
	display:flex;align-items:center;gap:18px;
	margin:0 0 0 auto;padding:0;border:0;min-width:0;background:none;
}
.fm-frequency-list .fm-fl-radio{
	display:inline-flex;align-items:center;gap:7px;margin:0;padding:0;cursor:pointer;
	font-family:'IBM Plex Sans', Arial, sans-serif;font-size:13px;font-weight:500;
	line-height:1.2;color:var(--fm-ink);text-transform:none;letter-spacing:normal;
}
/* Own round radio, so the theme's form styling can't resize or restyle it. */
.fm-frequency-list .fm-fl-radio input[type="radio"]{
	-webkit-appearance:none;appearance:none;
	flex:0 0 auto;width:16px;height:16px;margin:0;padding:0;
	border:1.5px solid #B9BEC5;border-radius:50%;
	background:var(--fm-surface);box-shadow:none;cursor:pointer;
	position:relative;vertical-align:middle;
	transition:border-color .12s, background-color .12s, box-shadow .12s;
}
.fm-frequency-list .fm-fl-radio input[type="radio"]::before,
.fm-frequency-list .fm-fl-radio input[type="radio"]::after{content:none;display:none;}
.fm-frequency-list .fm-fl-radio input[type="radio"]:hover{border-color:var(--fm-teal);}
.fm-frequency-list .fm-fl-radio input[type="radio"]:checked{
	border-color:var(--fm-teal);background:var(--fm-teal);
	box-shadow:inset 0 0 0 3px var(--fm-surface);
}
.fm-frequency-list .fm-fl-radio input[type="radio"]:focus{outline:none;} /* theme's dotted ring on mouse click */
.fm-frequency-list .fm-fl-radio input[type="radio"]:focus-visible{
	outline:none;
	box-shadow:inset 0 0 0 3px var(--fm-surface), 0 0 0 3px rgba(14,124,134,.2);
}
.fm-frequency-list .fm-fl-apply{
	font:500 12px 'IBM Plex Sans', Arial, sans-serif;padding:4px 10px;
	border:1px solid var(--fm-line);border-radius:6px;background:var(--fm-surface);color:var(--fm-ink);cursor:pointer;
}

/* --- Sortable column headings --- */
.fm-frequency-list .fm-fl-sort:link,
.fm-frequency-list .fm-fl-sort:visited{
	display:inline-flex;align-items:center;gap:6px;
	color:var(--fm-ink);text-decoration:none;
}
.fm-frequency-list .fm-fl-sort:hover,
.fm-frequency-list .fm-fl-sort:focus-visible{
	color:var(--fm-teal-dark);text-decoration:none;
}
.fm-frequency-list .fm-fl-sort-icon{
	flex:0 0 auto;color:var(--fm-slate);
}
.fm-frequency-list th[aria-sort] .fm-fl-sort-icon{
	color:var(--fm-teal-dark);
}

/* --- Search fields above each column --- */
.fm-frequency-list .fm-fl-filters th{
	padding:0 6px 8px;
}
.fm-frequency-list .fm-fl-input{
	-webkit-appearance:none;appearance:none;
	display:block;width:100%;height:30px;margin:0;padding:4px 6px;
	box-sizing:border-box;
	font-family:'IBM Plex Sans', Arial, sans-serif;
	font-size:12.5px;font-weight:400;line-height:1.2;
	text-transform:none;letter-spacing:normal;
	color:var(--fm-ink);background:var(--fm-surface);
	border:1px solid #D5D5CF;border-radius:6px;box-shadow:none;
	transition:border-color .12s, box-shadow .12s;
}
/* The browser's built-in "×" takes up room even when empty — too much in narrow columns. */
.fm-frequency-list .fm-fl-input::-webkit-search-cancel-button{-webkit-appearance:none;display:none;}
.fm-frequency-list .fm-fl-input::placeholder{
	color:#9AA1AB;opacity:1;
}
.fm-frequency-list .fm-fl-input:focus{
	outline:none;border-color:var(--fm-teal);
	box-shadow:0 0 0 3px rgba(14,124,134,.15);
}

/* --- Rows --- */
.fm-frequency-list .fm-fl-table tbody tr:hover{
	background:#EEF5F5;
}
.fm-frequency-list .fm-fl-empty-row td{
	padding:14px 12px;
	font-family:'IBM Plex Sans', Arial, sans-serif;
	font-size:13px;color:var(--fm-slate);white-space:normal;
}
.fm-frequency-list .fm-fl-empty-row:hover{background:transparent;}

/* Loading: fade the rows while the next page / search result is fetched. */
.fm-frequency-list tbody{transition:opacity .15s;}
.fm-frequency-list.fm-fl-loading tbody{opacity:.45;}

/* --- Count + pager --- */
.fm-frequency-list .fm-fl-footer{
	display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
	gap:10px 16px;padding:10px 12px;
	border-top:1px solid var(--fm-line);
	font-size:12.5px;color:var(--fm-slate);
}
.fm-frequency-list .fm-fl-reset{margin-left:10px;}

.fm-frequency-list .fm-fl-pagination{
	display:flex;flex-wrap:wrap;align-items:center;gap:4px;
}
.fm-frequency-list .fm-fl-page{
	display:inline-flex;align-items:center;justify-content:center;
	min-width:30px;height:30px;padding:0 8px;box-sizing:border-box;
	font-family:'IBM Plex Mono', monospace;font-size:12px;line-height:1;
	color:var(--fm-ink);background:var(--fm-surface);
	border:1px solid var(--fm-line);border-radius:6px;
}
.fm-frequency-list a.fm-fl-page:link,
.fm-frequency-list a.fm-fl-page:visited{
	color:var(--fm-ink);text-decoration:none;
}
.fm-frequency-list a.fm-fl-page:hover,
.fm-frequency-list a.fm-fl-page:focus-visible{
	border-color:var(--fm-teal);color:var(--fm-teal-dark);text-decoration:none;
}
.fm-frequency-list .fm-fl-page.is-current{
	background:var(--fm-teal);border-color:var(--fm-teal);color:#fff;font-weight:500;
}
.fm-frequency-list .fm-fl-page.is-gap{
	border-color:transparent;background:transparent;min-width:18px;padding:0 2px;
}
.fm-frequency-list .fm-fl-page.is-disabled{opacity:.4;}
.fm-frequency-list .fm-fl-step{font-family:'IBM Plex Sans', Arial, sans-serif;font-size:15px;}

/* The search button only exists so Enter submits the form without JavaScript. */
.fm-frequency-list .fm-fl-sr-only{
	position:absolute!important;width:1px!important;height:1px!important;
	margin:-1px!important;padding:0!important;overflow:hidden!important;
	clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important;
}

.fm-frequency-list .fm-fl-form{margin:0;}