/* ===========================================================================
   Ceiling Cat account console — layered on keycloak.v3 (PatternFly v5 / React).
   Navy app-shell (masthead + nav) on warm paper content, petrol accents, Inter.
   Tokens shared with the login theme / kaburay.
   =========================================================================== */

:root {
  --ccat-bg:          oklch(0.962 0.013 78);
  --ccat-surface:     oklch(0.974 0.010 78);
  --ccat-sunken:      oklch(0.928 0.018 75);
  --ccat-ink:         oklch(0.272 0.058 250);
  --ccat-soft:        oklch(0.428 0.062 247);
  --ccat-muted:       oklch(0.535 0.058 247);
  --ccat-border:      oklch(0.836 0.014 75);
  --ccat-petrol:      oklch(0.529 0.064 195);
  --ccat-petrol-deep: oklch(0.460 0.062 195);
  --ccat-petrol-tint: oklch(0.867 0.022 195);
  --ccat-on-ink:      oklch(0.972 0.011 80);
  --ccat-radius-sm:   9px;
  --ccat-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

body,
.pf-v5-c-page {
  font-family: var(--ccat-font);
  color: var(--ccat-ink);
  background-color: var(--ccat-bg);
}

/* ---- masthead (top bar) → navy ----------------------------------------- */
.pf-v5-c-masthead {
  --pf-v5-c-masthead--BackgroundColor: var(--ccat-ink);
  background-color: var(--ccat-ink);
  color: var(--ccat-on-ink);
  border-bottom: 1px solid oklch(0.272 0.058 250);
}
.pf-v5-c-masthead a,
.pf-v5-c-masthead .pf-v5-c-button,
.pf-v5-c-masthead .pf-v5-c-dropdown__toggle,
.pf-v5-c-masthead svg { color: var(--ccat-on-ink); fill: var(--ccat-on-ink); }
.pf-v5-c-masthead__brand img,
.pf-v5-c-brand img { height: 40px; width: auto; }

/* ---- sidebar nav → navy ------------------------------------------------ */
.pf-v5-c-page__sidebar {
  --pf-v5-c-page__sidebar--BackgroundColor: var(--ccat-ink);
  background-color: var(--ccat-ink);
}
.pf-v5-c-page__sidebar .pf-v5-c-nav__link {
  color: color-mix(in oklch, var(--ccat-on-ink) 78%, transparent);
}
.pf-v5-c-page__sidebar .pf-v5-c-nav__link:hover {
  color: var(--ccat-on-ink);
  background-color: oklch(1 0 0 / 0.06);
}
.pf-v5-c-page__sidebar .pf-v5-c-nav__link.pf-m-current,
.pf-v5-c-page__sidebar .pf-v5-c-nav__item.pf-m-current > .pf-v5-c-nav__link {
  color: var(--ccat-on-ink);
  background-color: oklch(1 0 0 / 0.10);
  --pf-v5-c-nav__link--m-current--BorderColor: var(--ccat-petrol);
}
.pf-v5-c-page__sidebar .pf-v5-c-nav__link.pf-m-current::before {
  border-inline-start-color: var(--ccat-petrol);
}

/* ---- content → warm paper ---------------------------------------------- */
.pf-v5-c-page__main,
.pf-v5-c-page__main-section,
.pf-v5-c-page__main-section.pf-m-light { background-color: var(--ccat-bg); }
.pf-v5-c-title, h1, h2, h3 { color: var(--ccat-ink); }
.pf-v5-c-card { background-color: var(--ccat-surface); }

/* ---- accents: buttons + links → petrol --------------------------------- */
.pf-v5-c-button.pf-m-primary {
  --pf-v5-c-button--m-primary--BackgroundColor: var(--ccat-petrol);
  --pf-v5-c-button--m-primary--hover--BackgroundColor: var(--ccat-petrol-deep);
  background-color: var(--ccat-petrol);
  color: var(--ccat-on-ink);
  border-radius: var(--ccat-radius-sm);
}
.pf-v5-c-button.pf-m-primary:hover { background-color: var(--ccat-petrol-deep); }
.pf-v5-c-button.pf-m-secondary {
  color: var(--ccat-ink);
  background: transparent;
  border: 1px solid var(--ccat-border);
  border-radius: var(--ccat-radius-sm);
}
.pf-v5-c-button.pf-m-secondary::after { display: none; }   /* PF draws blue border here */
.pf-v5-c-button.pf-m-secondary:hover {
  color: var(--ccat-ink);
  background-color: var(--ccat-petrol-tint);
  border-color: var(--ccat-ink);
}
.pf-v5-c-button.pf-m-link,
a { color: var(--ccat-petrol-deep); }

/* ---- inputs (match login) ---------------------------------------------- */
.pf-v5-c-form-control {
  background-color: var(--ccat-surface);
  border: 1px solid var(--ccat-border);
  border-radius: var(--ccat-radius-sm);
}
.pf-v5-c-form-control::before,
.pf-v5-c-form-control::after { display: none; }
.pf-v5-c-form-control:focus-within {
  border-color: var(--ccat-ink);
  box-shadow: 0 0 0 3px var(--ccat-petrol-tint);
}
.pf-v5-c-form-control > input { outline: none; }