/* =========================================================
   favorite_matches.css : étoile d'un match, page /favorite-matches/ et page de profil.
   Les cartes de match reprennent unfair.css (classes uf-*).
   ========================================================= */

.match-fav-btn { background: transparent; border: 0; cursor: pointer; color: #aaa; font-size: 1.35rem; line-height: 1; padding: 0 .3rem; vertical-align: middle; transition: transform .15s ease, color .15s ease; }
.match-fav-btn:hover { transform: scale(1.15); color: gold; }
.match-fav-btn.active { color: gold; text-shadow: 0 0 8px rgba(255, 215, 0, .6); }

/* Étoile retirant le favori, posée sur la carte (au-dessus du lien étiré) */
.fm-remove { position: absolute; right: .6rem; top: .35rem; z-index: 2; }

/* Pagination : même rendu que la page Fair Elo */
.fm-pagination { display: flex; flex-wrap: wrap; gap: .35rem; justify-content: center; margin-top: 1rem; }
.fm-pagination button { padding: .35rem .65rem; border: 0; border-radius: .4rem; cursor: pointer; font: inherit; background: rgba(255, 255, 255, .08); color: #cbd5e1; transition: all .2s ease; }
.fm-pagination button:hover { background: rgba(255, 255, 255, .15); color: #fff; }
.fm-pagination button.active { background: linear-gradient(135deg, var(--color-green), #16a34a); color: #fff; box-shadow: 0 0 8px rgba(34, 197, 94, .35); }
.fm-pagination span { color: var(--color-text-muted); padding: .35rem .25rem; align-self: center; }

.fm-kickoff { font-weight: 600; opacity: .85; padding: .15rem .5rem; }
.fm-note { text-align: center; opacity: .8; padding: 2rem 0; }
.fm-note a { color: var(--color-green); }

/* Profil */
.fm-profile-name { text-align: center; font-size: 1.8rem; font-weight: 600; margin: 0 0 1.5rem; word-break: break-word; }
.fm-section { margin: 0 0 2rem; }
.fm-section h2 { font-size: 1.15rem; font-weight: 600; color: var(--color-green); margin: 0 0 .75rem; }
.fm-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.fm-chips a { display: inline-block; padding: .35rem .8rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .04); color: inherit; text-decoration: none; font-size: .9rem; }
.fm-chips a:hover { border-color: rgba(74, 222, 128, .45); }
.fm-more { display: inline-block; margin-top: .75rem; color: var(--color-green); }

[data-theme="light"] .fm-pagination button { background: var(--lt-border-soft); color: var(--lt-text-2); }
[data-theme="light"] .fm-pagination button:hover { background: var(--lt-btn-bg-hover); color: var(--lt-text); }
[data-theme="light"] .fm-pagination button.active { background: linear-gradient(135deg, var(--color-green), var(--lt-green-hover)); color: #fff; box-shadow: none; }
[data-theme="light"] .fm-chips a { border-color: var(--lt-border); background: rgba(255, 255, 255, .35); }
[data-theme="light"] .fm-section h2, [data-theme="light"] .fm-more, [data-theme="light"] .fm-note a { color: #166534; }