/* Integrate Alchemists/SportsPress styling with our base layout. * Aplikuje sa iba ak má triedu .has-sportspress. * Alchemists base components (alchemists-base.css) + sportspress-soccer.css * sa loadujú samostatne. Tu sú overrides + namespace fixes. */ body.has-sportspress { --sp-text: #31404b; --sp-muted: #9a9da2; --sp-accent: var(--accent); --sp-bg: #edeff4; --sp-card-bg: #fff; --sp-border: #e4e7ed; --sp-row-alt: #f5f7f9; background-color: var(--sp-bg); font-family: "Source Sans 3", "Open Sans", -apple-system, sans-serif; color: var(--sp-text); } body.has-sportspress main.wrap { max-width: 1200px; padding: 24px 16px 60px; } body.has-sportspress h1, body.has-sportspress h2, body.has-sportspress h3, body.has-sportspress h4 { font-family: "Roboto Condensed", "Source Sans 3", sans-serif; font-weight: 700; text-transform: uppercase; color: var(--sp-text); letter-spacing: 0.01em; } body.has-sportspress h1 { font-size: 36px; } body.has-sportspress h2 { font-size: 28px; } body.has-sportspress h3 { font-size: 22px; } body.has-sportspress h4 { font-size: 18px; text-transform: none; } /* Page heading hero (Alchemists style) */ .sp-page-heading { position: relative; margin: -24px -16px 24px; padding: 50px 24px 30px; background: linear-gradient(135deg, #1a2536 0%, #2c3e54 100%); color: #fff; overflow: hidden; } .sp-page-heading::before { content: ''; position: absolute; inset: 0; background-image: url('/static/sportspress/images/page-heading.jpg'); background-size: cover; background-position: center; opacity: 0.18; z-index: 0; } .sp-page-heading::after { content: ''; position: absolute; inset: 0; background-image: url('/static/sportspress/images/gridtile_4x4.gif'); opacity: 0.10; z-index: 1; } .sp-page-heading > * { position: relative; z-index: 2; } .sp-page-heading__title { margin: 0 0 6px; font-size: 36px; font-weight: 700; text-transform: uppercase; color: #fff; letter-spacing: 0.03em; } .sp-page-heading__crumbs { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.7; } .sp-page-heading__crumbs a { color: #fff; } .sp-page-heading__crumbs a:hover { color: var(--sp-accent); } /* Card overrides — Alchemists card design */ body.has-sportspress .card { background: var(--sp-card-bg); border: 1px solid var(--sp-border); border-radius: 4px; margin-bottom: 24px; box-shadow: 0 1px 2px rgba(0,0,0,0.04); } body.has-sportspress .card__header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 20px 24px; border-bottom: 1px solid var(--sp-border); } body.has-sportspress .card__header .sp-table-caption, body.has-sportspress .card__header h2, body.has-sportspress .card__header h3, body.has-sportspress .card__header h4 { margin: 0; font-size: 16px; text-transform: uppercase; font-weight: 700; } body.has-sportspress .card__content { padding: 0; } body.has-sportspress .card--has-table .card__content { padding: 0; } /* Tabuľky */ body.has-sportspress .table { width: 100%; margin-bottom: 0; border-collapse: collapse; font-size: 13px; color: var(--sp-text); } body.has-sportspress .table > thead > tr > th { padding: 12px 10px; background-color: #f5f7f9; border-bottom: 2px solid var(--sp-border); font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--sp-text); text-align: left; white-space: nowrap; } body.has-sportspress .table > tbody > tr > td { padding: 11px 10px; border-top: 1px solid var(--sp-border); vertical-align: middle; } body.has-sportspress .table > tbody > tr:hover { background-color: #fafbfd; } body.has-sportspress .table > tbody > tr.odd { background-color: #fff; } body.has-sportspress .table > tbody > tr.even { background-color: #fafbfd; } body.has-sportspress .table > thead > tr > th:first-child, body.has-sportspress .table > tbody > tr > td:first-child { padding-left: 24px; } body.has-sportspress .table > thead > tr > th:last-child, body.has-sportspress .table > tbody > tr > td:last-child { padding-right: 24px; } /* Table-standings stylish — pozícia + tím */ body.has-sportspress .table-standings .data-rank, body.has-sportspress .table-standings .data-pos { width: 36px; text-align: center; font-weight: 700; } body.has-sportspress .table-standings .data-name { text-align: left; font-weight: 600; } body.has-sportspress .table-standings .data-pts { font-weight: 700; color: var(--sp-text); } body.has-sportspress .table-standings tr.highlight { background-color: #fff8e1; } body.has-sportspress .team-logo, body.has-sportspress .player-photo { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-right: 10px; vertical-align: middle; } body.has-sportspress .team-logo img, body.has-sportspress .player-photo img { max-width: 100%; max-height: 100%; object-fit: contain; } body.has-sportspress .player-name { font-weight: 600; vertical-align: middle; } /* Section nav (subnav tabs) */ .sp-tabs { display: flex; gap: 0; margin-bottom: 16px; border: 1px solid var(--sp-border); border-radius: 4px; overflow: hidden; background: #fff; } .sp-tabs a { flex: 1; padding: 12px 16px; text-align: center; text-decoration: none; color: var(--sp-text); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; border-right: 1px solid var(--sp-border); transition: background 0.12s, color 0.12s; } .sp-tabs a:last-child { border-right: 0; } .sp-tabs a:hover { background: #f5f7f9; } .sp-tabs a.is-active { background: var(--sp-accent); color: #fff; } /* Season picker styled */ .sp-season-picker { display: flex; align-items: center; gap: 8px; } .sp-season-picker select { padding: 8px 12px; font-size: 13px; font-weight: 600; border: 1px solid var(--sp-border); border-radius: 4px; background: #fff; color: var(--sp-text); text-transform: uppercase; letter-spacing: 0.04em; } .sp-season-picker__label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--sp-muted); font-weight: 700; } /* Schedule (event cards) — vlastný layout */ .sp-schedule { display: flex; flex-direction: column; gap: 0; } .sp-event-row { display: grid; grid-template-columns: 110px 1fr; gap: 16px; padding: 16px 24px; background: #fff; border-bottom: 1px solid var(--sp-border); align-items: center; } .sp-event-row:hover { background: #fafbfd; } .sp-event-row__date { font-size: 12px; color: var(--sp-muted); text-transform: uppercase; letter-spacing: 0.05em; } .sp-event-row__date strong { display: block; color: var(--sp-text); font-size: 14px; font-weight: 700; } .sp-event-row__teams { display: grid; grid-template-columns: 1fr auto 1fr; gap: 16px; align-items: center; } .sp-event-row__team { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 14px; } .sp-event-row__team--home { justify-content: flex-end; text-align: right; } .sp-event-row__team--away { justify-content: flex-start; } .sp-event-row__logo { width: 32px; height: 32px; object-fit: contain; } .sp-event-row__score { min-width: 80px; text-align: center; font-weight: 700; font-size: 18px; font-family: "Roboto Condensed", sans-serif; } .sp-event-row__score .muted { font-size: 11px; font-weight: 600; } .sp-event-row__loc { grid-column: 2; font-size: 11px; color: var(--sp-muted); text-transform: uppercase; letter-spacing: 0.05em; } /* Bracket */ .sp-bracket { display: flex; flex-direction: column; gap: 32px; } .sp-bracket__phase-title { font-size: 18px; margin: 0 0 16px; padding-bottom: 8px; border-bottom: 2px solid var(--sp-accent); text-transform: uppercase; } .sp-bracket__encounters { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; } .sp-bracket-card { border: 1px solid var(--sp-border); border-radius: 4px; padding: 16px; background: #fff; } .sp-bracket-card--decided { background: #fff; border-color: var(--sp-accent); } .sp-bracket-card__title { font-weight: 700; font-size: 12px; text-transform: uppercase; margin-bottom: 12px; letter-spacing: 0.05em; color: var(--sp-muted); } .sp-bracket-card__team { display: grid; grid-template-columns: 32px 1fr 32px; gap: 10px; align-items: center; padding: 6px 0; font-size: 14px; border-bottom: 1px solid #f0f2f5; } .sp-bracket-card__team:last-of-type { border-bottom: 0; } .sp-bracket-card__team-name { font-weight: 600; } .sp-bracket-card__team-wins { font-weight: 700; font-size: 18px; text-align: right; font-family: "Roboto Condensed", sans-serif; } .sp-bracket-card__games { margin-top: 8px; padding-top: 8px; border-top: 1px solid #f0f2f5; font-size: 12px; } .sp-bracket-card__games summary { cursor: pointer; color: var(--sp-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700; font-size: 11px; } .sp-bracket-card__games ul { margin: 8px 0 0; padding-left: 16px; color: var(--sp-text); } .sp-bracket-card__games li { margin: 3px 0; } /* Ostatné drobnosti pre Alchemists feel */ body.has-sportspress .sp-source { margin-top: 16px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--sp-muted); text-align: right; } body.has-sportspress .sp-source a { color: var(--sp-muted); } body.has-sportspress .sp-source a:hover { color: var(--sp-accent); }