/* TeamLix Web UI: shared across /app. Roles and page interactions stay in their own modules. */
@import url('/app/assets/vendor/fonts/inter.css');
:root {
 --ui-accent:var(--club-primary,#2563eb);--ui-accent-ink:var(--club-ink,#fff);
 --ui-nav:var(--club-secondary,#0f172a);--ui-nav-ink:var(--club-secondary-ink,#f8fafc);
 --ui-bg:#f6f8fc;--ui-surface:#fff;--ui-ink:#172033;--ui-muted:#64748b;--ui-line:#e2e8f0;
 --ui-soft:color-mix(in srgb,var(--ui-accent) 8%,white);--ui-shadow:0 4px 18px #0f172a06;
 --ui-radius:16px;--ui-control-radius:10px;--ui-page-width:1400px;
}
html[data-teamlix-ui] {color-scheme:light;scroll-padding-top:80px}
html[data-teamlix-ui] body {
 font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
 color:var(--ui-ink);background:var(--ui-bg)!important;-webkit-font-smoothing:antialiased;
 --primary:var(--ui-accent);--primary-dark:var(--ui-accent);--primary-500:var(--ui-accent);--primary-600:var(--ui-accent);
 --parent-purple:var(--ui-accent);--parent-purple-dark:var(--ui-accent);--parent-blue:var(--ui-accent);
 --parent-ink:var(--ui-ink);--parent-muted:var(--ui-muted);--parent-line:var(--ui-line);--parent-shadow:var(--ui-shadow);
 --player-accent:var(--ui-accent);--player-accent-soft:var(--ui-soft);--player-background:var(--ui-bg);--player-line:var(--ui-line);
 --career-purple:var(--ui-accent);--career-purple-dark:var(--ui-accent);--career-line:var(--ui-line);--career-shadow:var(--ui-shadow);
 --dashboard-blue:var(--ui-accent);--dashboard-indigo:var(--ui-accent);--dashboard-line:var(--ui-line);
}
html[data-teamlix-ui] *,html[data-teamlix-ui] *::before,html[data-teamlix-ui] *::after{box-sizing:border-box}
html[data-teamlix-ui] :is(button,input,select,textarea){font-family:inherit}
html[data-teamlix-ui] :is(h1,h2,h3,h4){font-family:inherit;letter-spacing:-.025em;overflow-wrap:anywhere}
html[data-teamlix-ui] h1{line-height:1.2;font-weight:750}
html[data-teamlix-ui] :is(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--ui-accent)!important;outline-offset:3px}
html[data-teamlix-ui] :is(button,input,select,textarea):disabled{cursor:not-allowed}
html[data-teamlix-ui] :is(button,a){-webkit-tap-highlight-color:transparent}
/* Hidden form steps, permissions and conditional banners must remain hidden. */
html[data-teamlix-ui] .ui-page{min-width:0;width:100%;max-width:var(--ui-page-width);margin-inline:auto;padding:28px 32px 48px}
html[data-teamlix-ui] :is(.dashboard-page,#player-content,.career-family .career-dashboard-page,#parents-main){max-width:var(--ui-page-width);padding:28px 32px 48px}
html[data-teamlix-ui] :is(.dashboard-hero,#player-hero,.parent-topbar,.career-family .career-hero){
 background:var(--ui-nav)!important;color:var(--ui-nav-ink)!important;border:1px solid #ffffff14!important;
 border-radius:20px!important;box-shadow:var(--ui-shadow)!important;
}
html[data-teamlix-ui] :is(.dashboard-hero,#player-hero,.parent-topbar,.career-hero) :is(h1,h2){color:inherit!important}
html[data-teamlix-ui] :is(.dashboard-hero,#player-hero,.parent-topbar,.career-hero)::before,
html[data-teamlix-ui] :is(.dashboard-hero,#player-hero,.parent-topbar,.career-hero)::after{display:none}
html[data-teamlix-ui] :is(.parent-brand-kicker,.player-eyebrow,.dashboard-eyebrow){color:inherit;opacity:.8}
html[data-teamlix-ui] :is(.card,.stat-card,.feature-card,.career-card,.career-stat,.parent-overview,.parent-training-card,.dashboard-card,.team-card,.invitation-card){
 border-color:var(--ui-line)!important;border-radius:var(--ui-radius)!important;box-shadow:var(--ui-shadow)!important;
}
html[data-teamlix-ui] :is(.card,.stat-card,.career-card,.career-stat,.parent-overview,.parent-training-card,.dashboard-card){background:var(--ui-surface)!important}
html[data-teamlix-ui] :is(.parent-main-nav,.player-quick-nav,.settings-tabs){border-radius:var(--ui-radius);border-color:var(--ui-line);background:var(--ui-surface)}
html[data-teamlix-ui] :is(.tab-button.active,.portal-main-nav-item.active,.tabs .active){color:var(--ui-accent)!important;background:var(--ui-soft)!important}
html[data-teamlix-ui] :is(.btn-primary,.btn-submit,.submit-btn,.login-btn,.register-btn,button.primary,.career-family .career-primary,.career-button.primary){
 background:var(--ui-accent)!important;color:var(--ui-accent-ink)!important;border-color:var(--ui-accent)!important;
 border-radius:var(--ui-control-radius)!important;font-weight:650;box-shadow:none!important;
}
html[data-teamlix-ui] :is(button,a):is(.bg-blue-600,.bg-purple-600,.bg-indigo-600,.bg-blue-700,.bg-purple-700){
 background:var(--ui-accent)!important;color:var(--ui-accent-ink)!important;border-radius:var(--ui-control-radius);box-shadow:none!important;
}
html[data-teamlix-ui] :is(.btn,.btn-outline,.btn-secondary,.career-button){border-radius:var(--ui-control-radius)}
html[data-teamlix-ui] :is(.btn,.btn-primary,.btn-secondary,.btn-outline,.btn-submit,.submit-btn,.login-btn,.register-btn){min-height:44px}
html[data-teamlix-ui] :is(input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],input[type=tel],input[type=url],input[type=date],input[type=time],input[type=datetime-local],select,textarea){
 border-radius:var(--ui-control-radius)!important;border-color:var(--ui-line);max-width:100%;
}
html[data-teamlix-ui] :is(input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],input[type=tel],input[type=url],input[type=date],input[type=time],input[type=datetime-local],select){min-height:44px}
html[data-teamlix-ui] :is(input[type=checkbox],input[type=radio]){accent-color:var(--ui-accent)}
html[data-teamlix-ui] :is(.form-group label,.form-label){font-size:13px;font-weight:650;color:var(--ui-ink)}
html[data-teamlix-ui] :is(.text-blue-600,.text-purple-600,.text-indigo-600):not(.fa-exclamation-triangle){color:var(--ui-accent)!important}
html[data-teamlix-ui] :is(.bg-blue-50,.bg-purple-50,.bg-indigo-50){background-color:var(--ui-soft)!important}
html[data-teamlix-ui] :is(.table-container,.table-wrapper){border-radius:var(--ui-radius);border-color:var(--ui-line)}
html[data-teamlix-ui] thead{background:var(--ui-bg)}
html[data-teamlix-ui] :is(th,td){border-color:var(--ui-line)}
html[data-teamlix-ui] :is(.modal-content,.modal-box,dialog){border-radius:20px;border-color:var(--ui-line);box-shadow:0 24px 80px #0f172a26}
html[data-teamlix-ui] dialog::backdrop{background:#0f172a80}
/* Standard application shell. Branding's existing, more specific rules keep priority. */
html[data-teamlix-ui]:not([data-club-brand]) #teamlix-sidebar{background:var(--ui-nav)!important}
html[data-teamlix-ui] :is(.tl-logo-icon,.tl-avatar,.tl-topbar-avatar){background:var(--ui-accent);color:var(--ui-accent-ink)}
html[data-teamlix-ui] .tl-nav-item.active{background:var(--ui-accent)!important;color:var(--ui-accent-ink)!important}
html[data-teamlix-ui] .tl-nav-item.active>i{background:#ffffff1f!important;color:inherit!important;box-shadow:none!important}
html[data-teamlix-ui] #teamlix-topbar{background:var(--ui-surface);border-color:var(--ui-line)}
/* Older management screens and platform administration use the same visual shell. */
html[data-teamlix-ui][data-ui-kind=legacy] :is(.sidebar,aside.sidebar){background:var(--ui-nav)!important;color:var(--ui-nav-ink);border-right:1px solid #ffffff14}
html[data-teamlix-ui][data-ui-kind=legacy] :is(.sidebar .logo-text,.sidebar h1,.sidebar .user-name){color:var(--ui-nav-ink)!important}
html[data-teamlix-ui][data-ui-kind=legacy] .sidebar :is(.nav-item,.nav-link){border-radius:10px;margin:3px 10px;color:#cbd5e1}
html[data-teamlix-ui][data-ui-kind=legacy] .sidebar :is(.nav-item.active,.nav-link.active){background:var(--ui-accent)!important;color:var(--ui-accent-ink)!important}
html[data-teamlix-ui][data-ui-kind=legacy] :is(.logo-icon,.sidebar .logo-icon){background:var(--ui-accent)!important;color:var(--ui-accent-ink)!important;border-radius:12px}
html[data-teamlix-ui][data-ui-kind=legacy] .main-content{min-width:0}
/* Shared compact header for focused family/club tools without a sidebar. */
.ui-tool-header{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;padding:16px 24px;background:var(--ui-surface);border-bottom:1px solid var(--ui-line);color:var(--ui-ink)}
.ui-tool-header>a:first-child{display:inline-flex;align-items:center;gap:10px;color:var(--ui-ink);text-decoration:none;font-size:18px;font-weight:800}
.ui-tool-mark{display:grid;place-items:center;width:36px;height:36px;background:var(--ui-accent);color:var(--ui-accent-ink);border-radius:10px;font-size:16px}
.ui-tool-header>a:last-child{color:var(--ui-accent);font-size:13px;font-weight:650;text-decoration:none;min-height:44px;display:flex;align-items:center}
html[data-teamlix-ui][data-ui-kind=tool] main{width:100%;max-width:1100px;margin:0 auto;padding:28px 24px 48px}
html[data-teamlix-ui][data-ui-kind=tool] main>h1{font-size:clamp(24px,3vw,30px)}
html[data-teamlix-ui][data-ui-kind=tool] :is(main>form,main>article){border:1px solid var(--ui-line);border-radius:var(--ui-radius);background:var(--ui-surface);box-shadow:var(--ui-shadow)}
/* Account pages share the product's typography, light background and white forms. */
html[data-teamlix-ui][data-ui-kind=account] body{background:var(--ui-bg)!important}
html[data-teamlix-ui][data-ui-kind=account] :is(.login-container,.register-container,.card,.auth-container,.reset-container,.form-container){border:1px solid var(--ui-line);border-radius:20px!important;box-shadow:0 12px 40px #0f172a0a!important}
html[data-teamlix-ui][data-ui-kind=account] :is(.login-header,.register-header){background:var(--ui-nav)!important;color:var(--ui-nav-ink)}
html[data-teamlix-ui][data-ui-kind=account] :is(.logo-text,.subtitle){color:var(--ui-ink)}
/* Public information remains readable without showing privileged navigation. */
html[data-teamlix-ui][data-ui-kind=public] body{--secondary:var(--ui-accent)}
html[data-teamlix-ui][data-ui-kind=public] :is(.page-hero,.hero,.blog-hero){background:var(--ui-nav)!important;color:var(--ui-nav-ink)!important}
html[data-teamlix-ui][data-ui-kind=public] :is(.page-hero,.hero,.blog-hero) :is(h1,h2){color:inherit}
html[data-teamlix-ui][data-ui-kind=public] :is(.nav-cta,.cta-button,.btn-cta){background:var(--ui-accent)!important;color:var(--ui-accent-ink)!important;border-radius:var(--ui-control-radius)}
@media(max-width:767px){
 html[data-teamlix-ui] :is(.dashboard-page,#player-content,.career-family .career-dashboard-page,#parents-main,.ui-page){padding:18px 16px 32px}
 html[data-teamlix-ui] :is(.dashboard-hero,#player-hero,.parent-topbar,.career-family .career-hero){border-radius:16px!important}
 html[data-teamlix-ui] :is(input[type=text],input[type=email],input[type=password],input[type=search],select,textarea){font-size:16px}
 .ui-tool-header{padding:12px 16px;gap:10px}.ui-tool-header>a:last-child{max-width:55%;text-align:right}
 html[data-teamlix-ui][data-ui-kind=tool] main{padding:20px 16px 32px}
}
@media(prefers-reduced-motion:reduce){html[data-teamlix-ui]{scroll-behavior:auto}html[data-teamlix-ui] :is(button,a,input,select,textarea){transition:none!important}}
@media print{.ui-tool-header{display:none}html[data-teamlix-ui] body{background:white!important}}
/* Normalize legacy component names as well as the current utility-based screens. */
html[data-teamlix-ui] :is(.login-button,.submit-button,.btn-save,.save-button,.nav-cta),
html[data-teamlix-ui][data-ui-kind=tool] button[type=submit]{background:var(--ui-accent)!important;color:var(--ui-accent-ink)!important;border-color:var(--ui-accent)!important;border-radius:var(--ui-control-radius)!important;min-height:44px;box-shadow:none!important}
html[data-teamlix-ui] .bg-white:is(.rounded-xl,.rounded-2xl){border-radius:var(--ui-radius);box-shadow:var(--ui-shadow)}
html[data-teamlix-ui][data-ui-kind=workspace] main h1,
html[data-teamlix-ui][data-ui-kind=legacy] .main-content h1{font-size:clamp(24px,3vw,30px)}
html[data-teamlix-ui][data-ui-kind=public] :is(.page-hero,.hero,.blog-hero) :is(p,.subtitle){color:var(--ui-nav-ink)!important;opacity:.84}
html[data-teamlix-ui][data-ui-kind=tool] main>a{color:var(--ui-accent)}
html[data-teamlix-ui] .parent-brand-mark{background:#ffffff16;border-color:#ffffff33;color:inherit}
html[data-teamlix-ui] .portal-main-nav-item.active .portal-nav-icon,
html[data-teamlix-ui] .player-quick-icon{background:var(--ui-soft);color:var(--ui-accent)}
