@import url('/sportsfoundry/assets/customer-refinement.css');
@import url('/sportsfoundry/assets/brand-shell.css');

/* Owner pages link this file synchronously in <head>. Keep the first paint close
 * to the final hydrated shell so the page never flashes the legacy light/flat
 * operational layout while site.js is still classifying the route. */
html { background: #070c10; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 82% 0%, rgba(242,180,95,.035), transparent 28%),
    #070c10;
  color: #f5f0e8;
  font-family: var(--sf-font-body, Inter, ui-sans-serif, system-ui, sans-serif);
}
body > [data-nav] {
  display: block;
  min-height: 78px;
  border-bottom: 1px solid rgba(245,240,232,.09);
  background: rgba(6,11,15,.90);
}

/* These selectors are intentionally more specific than the legacy inline owner
 * rules still embedded in the page files. They make the synchronous first paint
 * use the same geometry that the canonical customer shell applies after hydrate. */
.owner-shell.owner-shell {
  width: auto;
  max-width: 1180px;
  margin-left: 256px;
  margin-right: 32px;
  padding: 70px 0 94px;
}
.owner-shell .page-title {
  margin: 0;
  color: #f5f0e8;
  font-family: var(--sf-font-display, var(--display-serif, Georgia, serif));
  font-size: clamp(2.25rem, 4vw, 4rem);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.02;
}
.owner-shell > .eyebrow {
  margin-bottom: 10px;
  color: #f2b45f;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.owner-shell > .lede {
  max-width: 760px;
  margin-top: 14px;
  color: #9aa9b1;
  font-size: 1rem;
  line-height: 1.6;
}
.owner-shell .owner-nav {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 24px 0 30px;
  padding: 7px;
  border: 1px solid rgba(206,222,229,.10);
  border-radius: 14px;
  background: rgba(11,18,23,.70);
}
.owner-shell .owner-nav a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-radius: 9px;
  color: #94a2a9;
  background: transparent;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: none !important;
  touch-action: manipulation;
}
.owner-shell .owner-nav a:hover,
.owner-shell .owner-nav a:focus-visible {
  color: #f5f0e8;
  border-color: rgba(206,222,229,.16);
  background: rgba(245,240,232,.075);
  outline: none;
}
.owner-shell .owner-nav a:focus-visible {
  box-shadow: 0 0 0 2px rgba(242,180,95,.42);
}
.owner-shell .owner-nav a:active,
.owner-shell .owner-nav a.sf-nav-pressed {
  color: #fff9ef;
  border-color: rgba(242,180,95,.28);
  background: rgba(242,180,95,.11);
}
.owner-shell .owner-nav a.active,
.owner-shell .owner-nav a[aria-current="page"] {
  color: #1f1405;
  border-color: rgba(255,210,139,.72);
  background: linear-gradient(180deg,#ffd28b,#e9a84c);
  box-shadow: 0 8px 22px rgba(208,133,37,.14);
}
.owner-shell .owner-nav a.active:hover,
.owner-shell .owner-nav a.active:focus-visible,
.owner-shell .owner-nav a[aria-current="page"]:hover,
.owner-shell .owner-nav a[aria-current="page"]:focus-visible,
.owner-shell .owner-nav a.active:active,
.owner-shell .owner-nav a[aria-current="page"]:active {
  color: #140c02;
  border-color: rgba(255,225,176,.92);
  background: linear-gradient(180deg,#ffdc9e,#efb45f);
}
.owner-shell :is(.owner-panel,.panel2,.plan-panel) {
  border-color: rgba(206,222,229,.11);
  background: linear-gradient(180deg,rgba(17,27,33,.92),rgba(9,16,21,.90));
}
.owner-shell .metric {
  border-color: rgba(206,222,229,.10);
  background: linear-gradient(180deg,rgba(20,31,38,.88),rgba(12,20,26,.86));
}

/* Shared Owner controls/help. */
.owner-metric-label{display:flex;align-items:center;gap:6px;min-height:22px;flex-wrap:nowrap}.owner-panel h2{display:flex;align-items:baseline;gap:6px;flex-wrap:nowrap}.owner-panel h2>.owner-info{align-self:baseline}.owner-info{width:20px;height:20px;border:1px solid var(--line);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#0b141b;color:var(--muted);font:800 .72rem/1 system-ui;cursor:pointer;padding:0;flex:0 0 auto}.owner-info:hover,.owner-info:focus{color:#ffd28b;border-color:#f2b45f;outline:none}.owner-help-popover{position:fixed;z-index:1000;width:min(360px,calc(100vw - 24px));background:#071016;border:1px solid rgba(242,180,95,.20);border-radius:12px;padding:14px 38px 14px 14px;box-shadow:0 18px 48px rgba(0,0,0,.42)}.owner-help-popover[hidden]{display:none}.owner-help-popover h3{margin:0 0 7px;font-size:1rem}.owner-help-popover p{margin:6px 0;color:var(--muted);font-size:.9rem;line-height:1.45}.owner-help-popover .owner-help-impact{color:var(--text)}.owner-help-close{position:absolute;right:9px;top:9px;width:24px;height:24px;border:0;background:transparent;color:var(--muted);font-size:1.1rem;cursor:pointer}.owner-help-close:hover,.owner-help-close:focus{color:var(--text)}.owner-toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:12px 0}.owner-toolbar .actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.owner-cost-form{display:grid;grid-template-columns:1fr 1.4fr 1fr 1.25fr;gap:10px;align-items:end;margin:14px 0;padding:14px;border:1px solid rgba(206,222,229,.10);border-radius:10px;background:rgba(9,17,22,.72)}.owner-cost-form label{display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:.8rem;font-weight:700}.owner-cost-form input,.owner-cost-form select,.owner-cost-form textarea{width:100%;padding:9px 10px;border-radius:8px;border:1px solid rgba(206,222,229,.13);background:#081016;color:var(--text)}.owner-cost-form textarea{min-height:78px;resize:vertical}.owner-cost-form .wide{grid-column:span 2}.owner-cost-form .form-actions{grid-column:1/-1;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.owner-inline-actions{display:flex;gap:6px;flex-wrap:wrap}.owner-inline-actions button{white-space:nowrap}.owner-empty{padding:18px;text-align:center;color:var(--muted)}.owner-completeness{display:flex;gap:8px;align-items:flex-start;color:var(--muted);font-size:.9rem}.owner-completeness input{margin-top:3px}.owner-status{min-height:24px;color:var(--muted);font-size:.9rem}

@media(max-width:1100px){
  body > [data-nav]{min-height:72px}
  .owner-shell.owner-shell{max-width:none;margin-left:32px;margin-right:32px;padding-top:48px}
}
@media(max-width:900px){.owner-cost-form{grid-template-columns:1fr 1fr}.owner-cost-form .wide{grid-column:span 2}}
@media(max-width:620px){.owner-shell.owner-shell{margin-left:18px;margin-right:18px;padding-top:34px}.owner-cost-form{grid-template-columns:1fr}.owner-cost-form .wide{grid-column:span 1}.owner-help-popover{left:12px!important;right:12px!important;width:auto!important}}
