/* Danipa admin console theme — 2026-05-13
   Brand source: docs/BRAND_STYLE_GUIDE.md (v3, 2026-04)

   Admin console is React + PatternFly. PatternFly exposes design tokens
   via CSS custom properties prefixed --pf-v5-global--. Overriding them
   here re-paints buttons, links, focus rings, navbar etc. without
   touching the React bundle.

   Scope is intentionally narrow — colour + logo only. Layout changes
   would require forking the upstream admin app, which isn't worth it
   for an internal operator UI. */

:root {
  /* Brand v3 palette (mirrors danipa-mobile-app/theme/colors.ts) */
  --danipa-navy:        #0A1930;
  --danipa-navy-deep:   #0A2540;
  --danipa-navy-light:  #1A3A5C;
  --danipa-orange:      #FF6B00;
  --danipa-orange-light:#FF8C33;
  --danipa-orange-deep: #E06000;
  --danipa-blue:        #2196F3;
  --danipa-blue-light:  #E3F2FD;
  --danipa-surface:     #F6F8FC;
  --danipa-card:        #FFFFFF;
  --danipa-input:       #EFF3FA;

  /* PatternFly v5 brand-color overrides — Keycloak admin v2 ships PFv5. */
  --pf-v5-global--primary-color--100:  var(--danipa-orange);
  --pf-v5-global--primary-color--200:  var(--danipa-orange-deep);
  --pf-v5-global--primary-color--light-100: var(--danipa-orange-light);
  --pf-v5-global--link--Color:         var(--danipa-blue);
  --pf-v5-global--link--Color--hover:  var(--danipa-orange);
  --pf-v5-global--active-color--100:   var(--danipa-orange);
  --pf-v5-global--BackgroundColor--dark-100: var(--danipa-navy);
  --pf-v5-global--BackgroundColor--dark-200: var(--danipa-navy-deep);
}

/* Top navigation / masthead — paint navy so the orange accents land
   the same way they do on the merchant + admin dashboards. */
.pf-v5-c-masthead,
header.pf-v5-c-masthead,
.pf-v5-c-page__header,
.pf-v5-c-page__header-tools {
  background-color: var(--danipa-navy) !important;
  color: #FFFFFF !important;
}

/* Sidebar nav — match navy chrome. */
.pf-v5-c-page__sidebar,
.pf-v5-c-nav__list .pf-v5-c-nav__link {
  background-color: var(--danipa-navy) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}
.pf-v5-c-nav__list .pf-v5-c-nav__link:hover {
  background-color: var(--danipa-navy-light) !important;
  color: #FFFFFF !important;
}
.pf-v5-c-nav__list .pf-v5-c-nav__link.pf-m-current,
.pf-v5-c-nav__list .pf-v5-c-nav__link[aria-current="page"] {
  background-color: var(--danipa-navy-light) !important;
  border-left: 3px solid var(--danipa-orange) !important;
  color: #FFFFFF !important;
}

/* Logo box — masthead reserves a fixed area; size the SVG to fit.
   `.keycloak__pageheader_brand` is the exact class Keycloak's admin v2
   React app puts on the <img>. The PatternFly masthead is ~72px tall
   with vertical padding, so 48px leaves a comfortable breathing room
   and matches the visual weight of "Keycloak Admin Console" lockups
   the upstream theme ships. */
.pf-v5-c-masthead__brand img,
.pf-v5-c-brand,
img.pf-v5-c-brand,
img.keycloak__pageheader_brand {
  max-height: 48px !important;
  width: auto !important;
}

/* Primary buttons — Keycloak primary action ("Save", "Create") in
   brand orange so action affordance matches the rest of the platform. */
.pf-v5-c-button.pf-m-primary {
  background-color: var(--danipa-orange) !important;
  border-color: var(--danipa-orange) !important;
}
.pf-v5-c-button.pf-m-primary:hover,
.pf-v5-c-button.pf-m-primary:focus {
  background-color: var(--danipa-orange-light) !important;
  border-color: var(--danipa-orange-light) !important;
}
.pf-v5-c-button.pf-m-primary:active {
  background-color: var(--danipa-orange-deep) !important;
  border-color: var(--danipa-orange-deep) !important;
}

/* Surface tints — page background gets the warm surface color so
   the admin doesn't look like raw white. */
body,
.pf-v5-c-page__main,
.pf-v5-c-page {
  background-color: var(--danipa-surface) !important;
}

/* Focus ring — keyboard navigation stays brand-blue (matches the
   focus ring on Pay / DP / MD). */
.pf-v5-c-button:focus-visible,
.pf-v5-c-form-control:focus-visible,
input:focus-visible,
button:focus-visible {
  outline: 2px solid var(--danipa-blue) !important;
  outline-offset: 2px !important;
}

/* Tables — header row gets a light navy tint instead of grey. */
.pf-v5-c-table thead {
  background-color: var(--danipa-input) !important;
}