/* =========================================================================
   Sports Live Widgets — main stylesheet
   Contains 4 styles:
     .slw-style-modern_dark
     .slw-style-clean_light
     .slw-style-theme_adaptive
     .slw-style-compact_minimal
   ========================================================================= */

/* ----- CSS variables (defaults: Modern Dark) ----- */
.slw-widget {
    --slw-bg: #0f1419;
    --slw-bg-alt: #1a2129;
    --slw-bg-row-hover: #243040;
    --slw-fg: #e8eaed;
    --slw-fg-muted: #9aa0a6;
    --slw-border: #2a323d;
    --slw-accent: #00d084;
    --slw-accent-2: #00a8ff;
    --slw-danger: #ff5252;
    --slw-warning: #ffb547;
    --slw-zone-champions-bg: rgba(0, 208, 132, 0.12);
    --slw-zone-europa-bg: rgba(0, 168, 255, 0.12);
    --slw-zone-relegation-bg: rgba(255, 82, 82, 0.12);
    --slw-radius: 6px;
    --slw-font-size: 13px;
    /* Readable "Show more / Show less" link color for this style's background. */
    --slw-link: #4db2ff;
    --slw-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --slw-row-pad: 7px 9px;
    --slw-gap: 8px;

    background: var(--slw-bg);
    color: var(--slw-fg);
    font-family: var(--slw-font);
    font-size: var(--slw-font-size);
    border-radius: var(--slw-radius);
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.18);
    margin-bottom: 1.5em;

    /* Container queries let the widget adapt to the SIDEBAR width, not the
       viewport — sidebars are usually much narrower than the screen. */
    container-type: inline-size;
}

/* ----- Header / title bar (v1.9.3) -----
   TWO title sources must share ONE look:
   1. Plugin titles (shortcode + Gutenberg block): <h3 class="slw-widget-title">.
   2. THEME widget titles (sidebar widgets): WordPress injects the theme's
      before_title markup (e.g. <h2 class="widget-title">) as a direct child
      of .slw-widget — the plugin never styled it, so the theme's own padding
      (usually 0 at the top, designed for the theme's widget chrome) made the
      title text touch the TOP EDGE of our header box.
   The vertical metrics (margin / padding / line-height) are forced with
   !important at (0,3,0) specificity (doubled .slw-widget root class) so the
   title text keeps the SAME distance from the top and the bottom of the
   header box in every theme. Per-style overrides below run at (0,4,0). */
.slw-widget.slw-widget .slw-widget-title,
.slw-widget.slw-widget h3.slw-widget-title,
.slw-widget.slw-widget > h1,
.slw-widget.slw-widget > h2,
.slw-widget.slw-widget > h3,
.slw-widget.slw-widget > h4,
.slw-widget.slw-widget > h5,
.slw-widget.slw-widget > h6,
.slw-widget.slw-widget .widget-title,
.slw-widget.slw-widget .widgettitle {
    margin: 0 !important;
    padding: 12px 14px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    background: var(--slw-bg-alt) !important;
    border-bottom: 1px solid var(--slw-border) !important;
    color: var(--slw-fg) !important;
}
/* Themes that wrap the widget title in a link: the link keeps the title
   color instead of the theme's link color (e.g. #333 → invisible on dark). */
.slw-widget .slw-widget-title a,
.slw-widget .widget-title a,
.slw-widget .widgettitle a,
.slw-widget > h1 a, .slw-widget > h2 a, .slw-widget > h3 a,
.slw-widget > h4 a, .slw-widget > h5 a, .slw-widget > h6 a {
    color: inherit !important;
    text-decoration: none !important;
}

.slw-widget .slw-widget__body { padding: 8px; }

.slw-widget a { color: var(--slw-accent-2); text-decoration: none; }
.slw-widget a:hover { text-decoration: underline; }

.slw-widget img.slw-team-logo,
.slw-widget img.slw-league-badge,
.slw-widget img.slw-player-photo {
    width: 20px; height: 20px; object-fit: contain; vertical-align: middle; flex-shrink: 0;
}
.slw-widget img.slw-league-badge { width: 16px; height: 16px; opacity: 0.85; }

.slw-team-badge--placeholder,
.slw-player-photo--placeholder {
    display: inline-flex; align-items: center; justify-content: center;
    width: 20px; height: 20px; border-radius: 50%;
    background: var(--slw-bg-alt); color: var(--slw-fg-muted);
    font-size: 10px; font-weight: 700;
}

.slw-error, .slw-empty {
    padding: 14px; text-align: center;
    color: var(--slw-fg-muted); font-style: italic;
}
.slw-error { color: var(--slw-danger); font-style: normal; }

/* ----- Standings -----
   FIXED table layout + explicit column widths so the table ALWAYS fits the
   sidebar. Default column set (v1.9.1, "extra columns" unchecked):
       #  Team  P  W  D  L  Pts
   — the position number and team name sit together on the left, the core
   numeric block (P W D L Pts) is contiguous right after the team, and the
   team name gets ALL the remaining width. The optional extended columns
   (GF GA GD | Form) are opt-in in the widget form and still auto-hide in
   narrow sidebars (container queries below). The scroll wrapper is a
   last-resort safety net for extremely narrow containers. */
.slw-standings-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.slw-standings-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: var(--slw-font-size);
}
/* Tighter horizontal padding than the rest of the widget: with 10 columns,
   every saved pixel goes to the team name. */
.slw-standings-table th,
.slw-standings-table td {
    box-sizing: border-box;
    padding: 6px 3px;
    text-align: left;
    border-bottom: 1px solid var(--slw-border);
}
.slw-standings-table th {
    color: var(--slw-fg-muted);
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    background: var(--slw-bg-alt);
    position: sticky; top: 0;
    white-space: nowrap;
}
.slw-standings-table tbody tr:hover { background: var(--slw-bg-row-hover); }
/* Numeric columns are deliberately NARROW (v1.9.1: 27→22px) and tightly
   padded so P W D L Pts sit close together and the team-name column keeps
   the maximum possible share of the sidebar width. */
.slw-standings-table th.slw-col-num,
.slw-standings-table td.slw-col-num {
    width: 22px;
    padding-left: 1px; padding-right: 2px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
}
.slw-standings-table th.slw-col-pts,
.slw-standings-table td.slw-col-pts {
    width: 30px;
}
.slw-standings-table .slw-col-pts { font-weight: 700; color: var(--slw-fg); }
.slw-standings-table th.slw-col-pos,
.slw-standings-table td.slw-col-pos {
    width: 24px;
    padding-left: 2px; padding-right: 0;
    text-align: center; font-weight: 600;
    position: relative;
}
.slw-standings-table th.slw-col-form,
.slw-standings-table td.slw-col-form { width: 100px; }
/* Team cell: flex so the name truncates with an ellipsis instead of
   stretching the table. */
.slw-standings-table td.slw-col-team {
    display: flex; align-items: center; gap: 4px;
    min-width: 0;
    padding-left: 3px; padding-right: 4px;
}
.slw-col-team .slw-team-logo { flex-shrink: 0; margin-right: 0; }
.slw-col-team .slw-team-name {
    flex: 1; min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.slw-zone-dot {
    display: inline-block; width: 4px; height: 14px;
    border-radius: 2px; margin-right: 4px; vertical-align: middle;
    background: transparent;
}
.slw-row-zone-champions .slw-zone-dot { background: var(--slw-accent); }
.slw-row-zone-europa .slw-zone-dot { background: var(--slw-accent-2); }
.slw-row-zone-relegation .slw-zone-dot { background: var(--slw-danger); }
.slw-row-zone-champions { background: var(--slw-zone-champions-bg); }
.slw-row-zone-europa { background: var(--slw-zone-europa-bg); }
.slw-row-zone-relegation { background: var(--slw-zone-relegation-bg); }

.slw-form { display: inline-flex; gap: 2px; }
.slw-form-pill {
    display: inline-block; min-width: 16px; height: 16px;
    line-height: 16px; text-align: center; border-radius: 3px;
    font-size: 10px; font-weight: 700; color: #fff;
}
.slw-form-win   { background: var(--slw-accent); }
.slw-form-draw  { background: var(--slw-fg-muted); }
.slw-form-loss  { background: var(--slw-danger); }

/* ----- Collapsible "See more" (all widget types) -----
   v1.9.2: a MINIMAL single-line link (~15px tall). Colors are forced with
   !important on EVERY interactive state because themes commonly ship rules
   like `button:hover { color:#fff }` or `button:focus { color:#fff }` — with
   a transparent background that made the label literally disappear on hover
   and after clicking (the button keeps focus once expanded). --slw-link is
   defined per widget style with values that are readable on that style's
   background. */
/* v1.9.4: base rule doubled to (0,2,0) — theme attacks like
   `.widget-slot button { padding:10px 20px !important; color:#fff !important }`
   are (0,1,1) and were inflating the toggle back to ~39px and whitening the
   label on aggressive themes (same attack class as the box repaint). */
.slw-toggle-more.slw-toggle-more {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin: 4px auto 0 !important;
    padding: 1px 4px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    border: 0 !important;
    border-radius: 3px;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--slw-link, #4db2ff) !important;
    font-family: inherit;
    font-size: 11px !important;
    font-weight: 600;
    line-height: 1.2 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-align: center;
    text-decoration: underline !important;
    text-underline-offset: 2px;
    cursor: pointer;
    transition: background 0.15s ease;
    -webkit-appearance: none;
    appearance: none;
}
/* Re-forced per state so nothing can flip the label to white/invisible.
   The doubled class raises specificity (0,3,0) above common theme rules
   like `.widget button:hover { color:#fff !important }` (0,2,1). */
.slw-toggle-more.slw-toggle-more:hover,
.slw-toggle-more.slw-toggle-more:focus,
.slw-toggle-more.slw-toggle-more:active,
.slw-toggle-more.slw-toggle-more:focus-visible,
.slw-toggle-more.slw-toggle-more[aria-expanded="true"] {
    background: transparent !important;
    border: 0 !important;
    color: var(--slw-link, #4db2ff) !important;
    text-decoration: underline !important;
}
/* Hover/focus feedback is a neutral tint (visible on light AND dark
   backgrounds) — the text color never changes, so it can't vanish. */
.slw-toggle-more.slw-toggle-more:hover,
.slw-toggle-more.slw-toggle-more:focus {
    background: rgba(127, 127, 127, 0.14) !important;
    outline: none;
}
.slw-toggle-more.slw-toggle-more:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 1px;
}
.slw-toggle-more.slw-toggle-more:active {
    background: rgba(127, 127, 127, 0.24) !important;
}
/* One chevron that rotates: ▾ points down while collapsed ("more below"),
   and flips 180° to ▴ while expanded ("click to fold back up"). */
.slw-toggle-more::after {
    content: "▾";
    display: inline-block;
    margin-left: 4px;
    font-size: 10px;
    line-height: 1;
    vertical-align: 0.5px;
    transition: transform 0.18s ease;
}
.slw-has-more:not(.slw-is-collapsed) .slw-toggle-more::after {
    transform: rotate(180deg);
}

/* Extra rows hide ONLY when JS marks the wrapper as collapsed — without
   JavaScript the full list stays visible (progressive enhancement).
   The JS sets the class, the [hidden] attribute AND an inline
   display:none!important (v1.9.2) — three locks. The extra .slw-widget
   ancestor raises the specificity to (0,4,0) so aggressive theme rules
   (e.g. `.sidebar .widget ul li { display:block!important }`) cannot
   un-hide collapsed rows. */
.slw-widget .slw-has-more.slw-is-collapsed .slw-row-extra,
.slw-widget .slw-has-more .slw-row-extra[hidden] {
    display: none !important;
}

/* ----- Sidebar-adaptive columns (container queries) -----
   Column priority: # Team P W D L Pts are ALWAYS visible; GF/GA/GD drop
   below 520px and Form below 640px so the team column stays as wide as
   possible and the table fits without horizontal scrolling in any real
   sidebar. Browsers without container-query support (pre-2023) fall back
   to the viewport media query at the bottom of this file. */
@container (max-width: 640px) {
    .slw-standings-table .slw-col-form,
    .slw-standings-table th.slw-col-form { display: none; }
}
@container (max-width: 520px) {
    .slw-standings-table .slw-col-gf,
    .slw-standings-table .slw-col-ga,
    .slw-standings-table .slw-col-gd,
    .slw-standings-table th.slw-col-gf,
    .slw-standings-table th.slw-col-ga,
    .slw-standings-table th.slw-col-gd { display: none; }
}
@container (max-width: 360px) {
    .slw-standings-table th,
    .slw-standings-table td { padding-top: 5px; padding-bottom: 5px; }
    .slw-standings-table th.slw-col-num,
    .slw-standings-table td.slw-col-num { width: 20px; }
    .slw-standings-table th.slw-col-pts,
    .slw-standings-table td.slw-col-pts { width: 28px; }
    .slw-standings-table th.slw-col-pos,
    .slw-standings-table td.slw-col-pos { width: 20px; }
}

/* ----- Fixtures / Results / Live lists ----- */
.slw-fixtures-list,
.slw-results-list,
.slw-live-list,
.slw-scorers-list {
    list-style: none; margin: 0; padding: 0;
}
.slw-fixtures-day { margin-bottom: 6px; }
.slw-results-day { margin-bottom: 6px; }
.slw-day-label {
    font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px;
    color: var(--slw-fg-muted); padding: 4px 6px; background: var(--slw-bg-alt);
    border-radius: 3px; margin-bottom: 4px;
}

.slw-match {
    display: flex; flex-direction: column;
    padding: var(--slw-row-pad);
    border-bottom: 1px solid var(--slw-border);
    gap: 4px;
}
.slw-match:last-child { border-bottom: none; }
.slw-match:hover { background: var(--slw-bg-row-hover); }

.slw-match-time,
.slw-match-meta {
    font-size: 11px; color: var(--slw-fg-muted);
}
.slw-match-meta--top { display: flex; align-items: center; gap: 6px; }

.slw-match-teams { display: flex; flex-direction: column; gap: 2px; }
.slw-match-teams--score .slw-team { flex-direction: row; justify-content: space-between; align-items: center; }
.slw-team { display: flex; align-items: center; gap: 6px; padding: 2px 0; }
.slw-team-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.slw-team-score {
    font-weight: 700; font-variant-numeric: tabular-nums;
    min-width: 24px; text-align: right;
}

.slw-match-status {
    display: flex; align-items: center; gap: 6px;
    font-size: 11px; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.5px;
}
.slw-status-text { color: var(--slw-fg-muted); }
.slw-match-live .slw-status-text,
.slw-status-live, .slw-status-1h, .slw-status-2h, .slw-status-ht, .slw-status-et, .slw-status-p {
    color: var(--slw-danger);
}
.slw-status-ft, .slw-status-aet, .slw-status-pen { color: var(--slw-fg-muted); }

.slw-live-dot {
    display: inline-block; width: 8px; height: 8px;
    border-radius: 50%; background: var(--slw-danger);
    animation: slw-pulse 1.4s ease-in-out infinite;
}
.slw-live-dot--idle { background: var(--slw-fg-muted); animation: none; }
@keyframes slw-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.85); }
}

/* ----- Top scorers ----- */
.slw-scorers-list { counter-reset: slw-scorer; }
.slw-scorer {
    display: flex; align-items: center; gap: 8px;
    padding: var(--slw-row-pad);
    border-bottom: 1px solid var(--slw-border);
    counter-increment: slw-scorer;
}
.slw-scorer:last-child { border-bottom: none; }
.slw-scorer::before {
    content: counter(slw-scorer);
    width: 22px; height: 22px; line-height: 22px; text-align: center;
    background: var(--slw-bg-alt); color: var(--slw-fg-muted);
    border-radius: 50%; font-size: 11px; font-weight: 700; flex-shrink: 0;
}
.slw-scorer img.slw-player-photo,
.slw-scorer .slw-player-photo--placeholder { width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; }
.slw-scorer-info { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.slw-scorer-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.slw-scorer-team { font-size: 11px; color: var(--slw-fg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Stats column (v1.9.2): goals are the ONLY stat — rank, name, team and
   goals always fit, even in the narrowest sidebars. */
.slw-scorer-stats { display: flex; gap: 4px; flex-shrink: 0; }
.slw-stat {
    display: inline-flex; align-items: baseline; gap: 2px;
    padding: 2px 6px; border-radius: 4px;
    background: var(--slw-bg-alt); font-weight: 700;
    font-variant-numeric: tabular-nums; white-space: nowrap;
}
/* Stat numbers use the widget's foreground color instead of the accent —
   in Theme-Adaptive style the accent can map to a theme preset that is
   unreadable on the stat pill background. Suffix letters stay muted. */
.slw-stat small { font-size: 10px; color: var(--slw-fg-muted); font-weight: 400; }
.slw-stat-goals { color: var(--slw-fg); }
@container (max-width: 320px) {
    .slw-scorer img.slw-player-photo,
    .slw-scorer .slw-player-photo--placeholder { width: 22px; height: 22px; }
    .slw-scorer::before { width: 18px; height: 18px; line-height: 18px; font-size: 10px; }
    .slw-scorer { gap: 6px; }
}

.slw-loading {
    display: flex; align-items: center; justify-content: center;
    padding: 20px; color: var(--slw-fg-muted);
    font-style: italic; font-size: 12px;
}
.slw-loading::before {
    content: ''; display: inline-block;
    width: 14px; height: 14px; margin-right: 8px;
    border: 2px solid var(--slw-border);
    border-top-color: var(--slw-accent);
    border-radius: 50%;
    animation: slw-spin 0.8s linear infinite;
}
@keyframes slw-spin { to { transform: rotate(360deg); } }

/* =========================================================================
   Style: Clean Light
   ========================================================================= */
.slw-style-clean_light {
    --slw-bg: #ffffff;
    --slw-bg-alt: #f6f7f8;
    --slw-bg-row-hover: #f0f3f5;
    --slw-fg: #1a1a1a;
    --slw-fg-muted: #666;
    --slw-border: #e1e4e8;
    --slw-accent: #1b8200;
    --slw-accent-2: #0a5cb8;
    --slw-danger: #c8102e;
    --slw-warning: #c47f00;
    --slw-zone-champions-bg: rgba(27, 130, 0, 0.10);
    --slw-zone-europa-bg: rgba(10, 92, 184, 0.10);
    --slw-zone-relegation-bg: rgba(200, 16, 46, 0.10);
    --slw-link: #0a5cb8;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.slw-style-clean_light .slw-form-win { background: #1b8200; }
.slw-style-clean_light .slw-form-loss { background: #c8102e; }

/* =========================================================================
   Style: Theme-Adaptive — uses WP theme variables where possible
   ========================================================================= */
.slw-style-theme_adaptive {
    --slw-bg: var(--wp--preset--color--background, #ffffff);
    --slw-bg-alt: var(--wp--preset--color--surface, #f6f7f8);
    --slw-bg-row-hover: rgba(125, 125, 125, 0.10);
    --slw-fg: var(--wp--preset--color--foreground, #1a1a1a);
    --slw-fg-muted: var(--wp--preset--color--muted, #666);
    --slw-border: var(--wp--preset--color--border, #e1e4e8);
    --slw-accent: var(--wp--preset--color--primary, #008080);
    --slw-accent-2: var(--wp--preset--color--secondary, #0a5cb8);
    --slw-danger: var(--wp--preset--color--alert, #c8102e);
    --slw-zone-champions-bg: rgba(0, 128, 128, 0.10);
    --slw-zone-europa-bg: rgba(10, 92, 184, 0.10);
    --slw-zone-relegation-bg: rgba(200, 16, 46, 0.10);
    /* The theme's own foreground color is the ONLY hue guaranteed readable
       on the theme's background — presets like "secondary" can be white.
       Underline + chevron carry the link affordance. */
    --slw-link: var(--slw-fg);
    box-shadow: none;
    border: 1px solid var(--slw-border);
}
/* Title bar: transparent with an accent underline (v1.9.3 — covers THEME
   widget titles too, at (0,4,0) so it beats the forced base rule above). */
.slw-widget.slw-widget.slw-style-theme_adaptive .slw-widget-title,
.slw-widget.slw-widget.slw-style-theme_adaptive > h1,
.slw-widget.slw-widget.slw-style-theme_adaptive > h2,
.slw-widget.slw-widget.slw-style-theme_adaptive > h3,
.slw-widget.slw-widget.slw-style-theme_adaptive > h4,
.slw-widget.slw-widget.slw-style-theme_adaptive > h5,
.slw-widget.slw-widget.slw-style-theme_adaptive > h6,
.slw-widget.slw-widget.slw-style-theme_adaptive .widget-title,
.slw-widget.slw-widget.slw-style-theme_adaptive .widgettitle {
    background: transparent !important;
    border-bottom: 2px solid var(--slw-accent) !important;
}

/* =========================================================================
   Style: Compact / Minimal
   ========================================================================= */
.slw-style-compact_minimal {
    --slw-bg: #ffffff;
    --slw-bg-alt: #f9f9f9;
    --slw-bg-row-hover: #f0f0f0;
    --slw-fg: #222;
    --slw-fg-muted: #888;
    --slw-border: #eee;
    --slw-accent: #444;
    --slw-accent-2: #444;
    --slw-danger: #c00;
    --slw-zone-champions-bg: rgba(0, 128, 0, 0.06);
    --slw-zone-europa-bg: rgba(0, 0, 200, 0.06);
    --slw-zone-relegation-bg: rgba(200, 0, 0, 0.06);
    --slw-radius: 2px;
    --slw-font-size: 11px;
    --slw-link: #444;
    --slw-row-pad: 4px 6px;
    --slw-gap: 4px;
    box-shadow: none;
    border: 1px solid var(--slw-border);
}
/* Title bar: smaller + tighter, still symmetric (v1.9.3 — covers THEME
   widget titles too, at (0,4,0) so it beats the forced base rule above). */
.slw-widget.slw-widget.slw-style-compact_minimal .slw-widget-title,
.slw-widget.slw-widget.slw-style-compact_minimal > h1,
.slw-widget.slw-widget.slw-style-compact_minimal > h2,
.slw-widget.slw-widget.slw-style-compact_minimal > h3,
.slw-widget.slw-widget.slw-style-compact_minimal > h4,
.slw-widget.slw-widget.slw-style-compact_minimal > h5,
.slw-widget.slw-widget.slw-style-compact_minimal > h6,
.slw-widget.slw-widget.slw-style-compact_minimal .widget-title,
.slw-widget.slw-widget.slw-style-compact_minimal .widgettitle {
    font-size: 12px !important;
    padding: 6px 8px !important;
    background: transparent !important;
    border-bottom: 1px solid var(--slw-border) !important;
}
.slw-style-compact_minimal .slw-widget__body { padding: 4px; }
.slw-style-compact_minimal .slw-standings-table th { font-size: 9px; }
.slw-style-compact_minimal img.slw-team-logo,
.slw-style-compact_minimal img.slw-league-badge,
.slw-style-compact_minimal img.slw-player-photo { width: 14px; height: 14px; }
.slw-style-compact_minimal .slw-team-badge--placeholder,
.slw-style-compact_minimal .slw-player-photo--placeholder { width: 14px; height: 14px; font-size: 8px; }
.slw-style-compact_minimal .slw-form-pill { min-width: 12px; height: 12px; line-height: 12px; font-size: 8px; }

/* =========================================================================
   Responsive (viewport fallback for browsers without container queries)
   ========================================================================= */
@media (max-width: 480px) {
    .slw-widget { --slw-font-size: 12px; }
    .slw-standings-table .slw-col-form,
    .slw-standings-table th.slw-col-form,
    .slw-standings-table .slw-col-gf,
    .slw-standings-table .slw-col-ga,
    .slw-standings-table .slw-col-gd,
    .slw-standings-table th.slw-col-gf,
    .slw-standings-table th.slw-col-ga,
    .slw-standings-table th.slw-col-gd { display: none; }
}

/* =========================================================================
   v1.9.4 — BOX IDENTITY LOCK (theme-repaint defense)
   =========================================================================
   REPORTED BUG: switching the widget style (Modern Dark / Clean Light / …)
   changed NOTHING on sites with aggressive themes — the widgets kept the
   theme's colors and layout, and the v1.9.3 title fix was invisible too.

   ROOT CAUSE: v1.9.1–v1.9.3 hardened the title bar, the toggle button and
   the stat colors — but the widget BOX itself (background, text color,
   font, radius, shadow) sat at (0,1,0) with no !important. Any theme rule
   like `.sidebar .widget { background:#fff; color:#333 !important }`
   repainted the whole box, and since every style paints through the same
   `var(--slw-*)` variables, switching styles had no visible effect.

   DEFENSE (same pattern that already works for titles/toggles):
     - CSS lock: doubled root class (0,2,0)+!important for the box,
       (0,3,0)+!important for per-style shadow/border differences,
       (0,3,0)+!important for the lists, and a full !important pass over
       the standings table geometry (theme `.widget table td { padding:10px
       !important }` attacks were rewriting the whole layout).
     - JS lock: slw.js normalizeBoxes() applies inline !important to the
       box background/color/font/radius/shadow/border — inline !important
       beats even ID-selector !important theme rules
       (`#sidebar .widget { background:#fff !important }`), the one attack
       class CSS alone cannot defeat. */

/* A. The box itself. */
.slw-widget.slw-widget {
    background: var(--slw-bg) !important;
    color: var(--slw-fg) !important;
    font-family: var(--slw-font) !important;
    font-size: var(--slw-font-size) !important;
    line-height: 1.45 !important;
    box-sizing: border-box !important;
    border-radius: var(--slw-radius) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.18) !important;
    border: 0 !important;
    margin-bottom: 1.5em !important;
    overflow: hidden !important;
}

/* B. Per-style box corrections (shadow / border differ per style) at
   (0,3,0)+!important so they still beat the forced base above. */
.slw-widget.slw-widget.slw-style-clean_light {
    box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
}
.slw-widget.slw-widget.slw-style-theme_adaptive {
    box-shadow: none !important;
    border: 1px solid var(--slw-border) !important;
}
.slw-widget.slw-widget.slw-style-compact_minimal {
    box-shadow: none !important;
    border: 1px solid var(--slw-border) !important;
}

/* C. Lists: themes ship `.widget ul { padding-left:1.5em; margin:1em 0 }`
   and bullets that push the whole layout sideways. */
.slw-widget.slw-widget ul.slw-fixtures-list,
.slw-widget.slw-widget ul.slw-results-list,
.slw-widget.slw-widget ul.slw-live-list,
.slw-widget.slw-widget ul.slw-scorers-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.slw-widget.slw-widget .slw-fixtures-list li,
.slw-widget.slw-widget .slw-results-list li,
.slw-widget.slw-widget .slw-live-list li,
.slw-widget.slw-widget .slw-scorers-list li {
    list-style: none !important;
}

/* D. Standings table geometry: themes style `.widget table { … }` and
   `.widget table td { padding:10px; border:1px solid }` aggressively.
   Every structural property is re-asserted at (0,3,0)+!important. */
.slw-widget.slw-widget table.slw-standings-table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    font-size: var(--slw-font-size) !important;
}
.slw-widget.slw-widget .slw-standings-table th,
.slw-widget.slw-widget .slw-standings-table td {
    box-sizing: border-box !important;
    padding: 6px 3px !important;
    text-align: left !important;
    border: 0 !important;
    border-bottom: 1px solid var(--slw-border) !important;
    background: transparent !important;
}
.slw-widget.slw-widget .slw-standings-table th {
    color: var(--slw-fg-muted) !important;
    font-weight: 600 !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.2px !important;
    background: var(--slw-bg-alt) !important;
    white-space: nowrap !important;
}
.slw-widget.slw-widget .slw-standings-table tbody tr:hover {
    background: var(--slw-bg-row-hover) !important;
}
/* Zone tint rows keep their colors under attack. */
.slw-widget.slw-widget .slw-row-zone-champions { background: var(--slw-zone-champions-bg) !important; }
.slw-widget.slw-widget .slw-row-zone-europa    { background: var(--slw-zone-europa-bg) !important; }
.slw-widget.slw-widget .slw-row-zone-relegation{ background: var(--slw-zone-relegation-bg) !important; }

/* Column geometry — the same values as above, now !important, so theme
   `td { padding/text-align/width !important }` cannot reshape the table. */
.slw-widget.slw-widget .slw-standings-table th.slw-col-num,
.slw-widget.slw-widget .slw-standings-table td.slw-col-num {
    width: 22px !important;
    padding-left: 1px !important;
    padding-right: 2px !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}
.slw-widget.slw-widget .slw-standings-table th.slw-col-pts,
.slw-widget.slw-widget .slw-standings-table td.slw-col-pts {
    width: 30px !important;
}
.slw-widget.slw-widget .slw-standings-table .slw-col-pts {
    font-weight: 700 !important;
    color: var(--slw-fg) !important;
}
.slw-widget.slw-widget .slw-standings-table th.slw-col-pos,
.slw-widget.slw-widget .slw-standings-table td.slw-col-pos {
    width: 24px !important;
    padding-left: 2px !important;
    padding-right: 0 !important;
    text-align: center !important;
    font-weight: 600 !important;
}
.slw-widget.slw-widget .slw-standings-table td.slw-col-team {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    min-width: 0 !important;
    padding-left: 3px !important;
    padding-right: 4px !important;
    text-align: left !important;
}
.slw-widget.slw-widget .slw-standings-table th.slw-col-form,
.slw-widget.slw-widget .slw-standings-table td.slw-col-form { width: 100px !important; }

/* Container-query column hiding, !important so a theme
   `td { display:table-cell !important }` cannot resurrect hidden columns. */
@container (max-width: 640px) {
    .slw-standings-table .slw-col-form,
    .slw-standings-table th.slw-col-form { display: none !important; }
}
@container (max-width: 520px) {
    .slw-standings-table .slw-col-gf,
    .slw-standings-table .slw-col-ga,
    .slw-standings-table .slw-col-gd,
    .slw-standings-table th.slw-col-gf,
    .slw-standings-table th.slw-col-ga,
    .slw-standings-table th.slw-col-gd { display: none !important; }
}
@container (max-width: 360px) {
    .slw-standings-table th,
    .slw-standings-table td { padding-top: 5px !important; padding-bottom: 5px !important; }
    .slw-standings-table th.slw-col-num,
    .slw-standings-table td.slw-col-num { width: 20px !important; }
    .slw-standings-table th.slw-col-pts,
    .slw-standings-table td.slw-col-pts { width: 28px !important; }
    .slw-standings-table th.slw-col-pos,
    .slw-standings-table td.slw-col-pos { width: 20px !important; }
}

/* E. Compact / Minimal per-style table tweaks, kept winning at (0,3,0). */
.slw-widget.slw-widget.slw-style-compact_minimal .slw-standings-table th {
    font-size: 9px !important;
}