/* SPDX-License-Identifier: GPL-3.0-or-later — Ranking de calidad de los trenes (sprint 092) */
.ql-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 14px; margin: 16px 0 10px; }
.ql-tabs { display: inline-flex; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.ql-tabs button { border: 0; background: var(--panel-2); color: var(--text); font: inherit; font-weight: 700; padding: 9px 14px; cursor: pointer; }
.ql-tabs button[aria-selected=true] { background: var(--blue); color: var(--on-accent, #fff); }
.ql-sel { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; color: var(--muted); }
.ql-sel select { font: inherit; color: var(--text); background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; min-width: 130px; }
.ql-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 6px 0 12px; }
.ql-kpis div { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; background: var(--panel-2); }
.ql-kpis b { display: block; font-size: 22px; }
.ql-kpis span { font-size: 12.5px; color: var(--muted); }
.ql-list { list-style: none; margin: 0; padding: 0; counter-reset: ql; }
.ql-list > li { display: grid; grid-template-columns: 34px 1fr auto; gap: 4px 10px; align-items: center; padding: 10px 4px; border-top: 1px solid var(--line); }
.ql-list > li.ql-load, .ql-list > li.ql-empty { display: block; color: var(--muted); border-top: 0; }
.ql-n { font-weight: 800; font-size: 17px; color: var(--muted); text-align: right; }
.ql-t b { font-size: 15.5px; }
.ql-t small { display: block; color: var(--muted); font-size: 12.5px; }
.ql-t a { color: inherit; text-decoration: none; }
.ql-t a:hover b { text-decoration: underline; }
.ql-s { text-align: right; white-space: nowrap; }
.ql-s .fb-st { color: #f5b301; }
.ql-s b { font-size: 16px; }
.ql-s small { display: block; color: var(--muted); font-size: 12px; }
.ql-tags { grid-column: 2 / 4; display: flex; flex-wrap: wrap; gap: 4px; margin: 2px 0 0; padding: 0; list-style: none; }
.ql-tags li { border: 1px solid var(--line); border-radius: 999px; padding: 0 8px; font-size: 12px; }
.ql-tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.ql-tbl th, .ql-tbl td { text-align: left; padding: 7px 6px; border-top: 1px solid var(--line); }
.ql-tbl th { font-size: 12px; color: var(--muted); font-weight: 600; border-top: 0; }
.ql-tbl td.num, .ql-tbl th.num { text-align: right; }
.ql-note { color: var(--muted); font-size: 13.5px; line-height: 1.5; }
@media (max-width: 560px) { .ql-list > li { grid-template-columns: 26px 1fr auto; } .ql-tabs button { padding: 8px 10px; } }