/* ============================================================================
   brand.css — 브랜드 오버라이드 훅 + 기관 로고 표시
   팔레트·타입 토큰의 원본은 css/apple.css 다. apple.css 다음에 로드할 것.

   ── 색을 바꾸는 방법은 두 가지다 ──────────────────────────────────────────
   1) 기관별(권장): 관리자 → Institutions 에서 주색상 하나만 고른다.
      js/theme.js 가 OKLCH 에서 hover/active/tint/텍스트 색을 파생하고
      WCAG AA 대비를 **자동 보장**한 뒤 <style id="org-theme"> 로 주입한다.
      이 파일보다 나중에 들어가므로 아래 :root 보다 우선한다.
   2) 전역 고정(비상용): 아래 주석을 풀어 값을 직접 박는다. 이때는 대비가
      자동 검증되지 않으므로 `node scripts/design-audit.cjs` 를 반드시 돌린다.

   :root{
     --ap-blue:#7d3cc9; --ap-blue-hover:#6a31ad; --ap-blue-active:#582892;
     --ap-blue-text:#6a31ad; --ap-blue-tint:#f2ebfb; --ap-blue-tint-strong:#e5d8f7;
     --ap-blue-ring:rgba(125,60,201,.32);
   }
   ============================================================================ */

/* 기관 원본 색 — theme.js 가 대비를 위해 어둡게 조정하기 **전** 값.
   대비가 문제되지 않는 장식(점·구분선)에만 쓴다. 스킨이 없으면 기본 파랑. */
:root{ --brand-raw:var(--ap-blue); --brand-on-fill:#fff; }

/* ── 기관 로고 ──────────────────────────────────────────────────────────────
   기관이 올리는 이미지는 비율·여백을 통제할 수 없다. 높이만 고정하고
   width:auto 로 두어 가로로 긴 로고도 잘리지 않게 한다. */
.brand-logo-img{
  display:block;height:22px;width:auto;max-width:180px;
  object-fit:contain;
}

/* 어두운 히어로 배경 위: 흰 칩에 얹어 어떤 색 로고든 읽히게 한다. */
.brand-logo-chip{
  display:inline-flex;align-items:center;
  padding:5px 9px;border-radius:var(--ap-r-sm,8px);
  background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.14);
}
.brand-logo-chip .brand-logo-img{height:20px;max-width:150px}