/* SecureLog SSO 계정 관리 테마 (keycloak.v3 / PatternFly v5 위에 CSS만 덮어쓴다)
   - 메뉴 구조는 Keycloak 기본 유지. 색·로고·글꼴·간격만 변경.
   - 상단 바: 검정 + 크림슨 밑줄 / 좌측 메뉴: 흰 배경, 선택 메뉴만 크림슨 / 본문: 회색 바탕 위 흰 카드 */

@font-face {
  font-family: "SL Noto Sans KR";
  src: url("../fonts/noto-sans-kr-vf-ksx1001.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --sl-crimson: #7A2425;
  --sl-crimson-light: #A23332;
  --sl-crimson-deep: #5C272A;
  --sl-tint: #FBF3F3;
  --sl-ink: #1A1A1A;
  --sl-text: #333333;
  --sl-muted: #495057;
  --sl-line: #D5D5DA;
  --sl-line-soft: #E6E6EA;
  --sl-bg: #F7F7F8;
  --sl-surface: #fff;
  --sl-hover: #F4F4F6;
  --sl-badge: #F2F2F4;
  --sl-accent: var(--sl-crimson);
  --sl-link: var(--sl-crimson-light);
  --sl-link-hover: var(--sl-crimson);
  --sl-danger: #B42318;
  --sl-danger-line: #E8B9B4;
  --sl-focus: rgba(122, 36, 37, .12);
  --sl-dark: #121212;
  --sl-font: "SL Noto Sans KR", "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;

  --pf-v5-global--FontFamily--text: var(--sl-font);
  --pf-v5-global--FontFamily--heading: var(--sl-font);
  --pf-v5-global--FontFamily--sans-serif: var(--sl-font);
  --pf-v5-global--FontFamily--heading--sans-serif: var(--sl-font);
  --pf-v5-global--primary-color--100: var(--sl-crimson);
  --pf-v5-global--primary-color--200: var(--sl-crimson-deep);
  --pf-v5-global--primary-color--dark-100: var(--sl-crimson-light);
  --pf-v5-global--link--Color: var(--sl-crimson-light);
  --pf-v5-global--link--Color--hover: var(--sl-crimson);
  --pf-v5-global--link--Color--dark: #C24A46;
  --pf-v5-global--active-color--100: var(--sl-crimson);
  --pf-v5-global--active-color--300: var(--sl-crimson-light);
}

/* Keycloak의 다크 클래스와 기본 컴포넌트 팔레트를 함께 따른다. */
.pf-v5-theme-dark {
  color-scheme: dark;
  --sl-bg: var(--pf-v5-global--BackgroundColor--200);
  --sl-surface: var(--pf-v5-global--BackgroundColor--100);
  --sl-hover: var(--pf-v5-global--BackgroundColor--300);
  --sl-badge: var(--pf-v5-global--BackgroundColor--300);
  --sl-ink: var(--pf-v5-global--Color--100);
  --sl-text: var(--pf-v5-global--Color--100);
  --sl-muted: var(--pf-v5-global--Color--200);
  --sl-line: var(--pf-v5-global--BorderColor--100);
  --sl-line-soft: #383B3F;
  --sl-tint: #352527;
  --sl-accent: #F0A6A6;
  --sl-link: #F0A6A6;
  --sl-link-hover: #FFD0D0;
  --sl-danger: #FFB4AB;
  --sl-danger-line: #985F5B;
  --sl-focus: rgba(240, 166, 166, .24);
  --pf-v5-global--link--Color: var(--sl-link);
  --pf-v5-global--link--Color--hover: var(--sl-link-hover);
  --pf-v5-global--link--Color--dark: var(--sl-link);
  --pf-v5-global--active-color--100: var(--sl-accent);
  --pf-v5-global--active-color--300: var(--sl-accent);
}
.pf-v5-theme-dark .pf-v5-c-page__main-section.pf-m-light {
  color: var(--sl-text);
  --pf-v5-global--Color--100: #E0E0E0;
  --pf-v5-global--Color--200: #AAABAC;
}
.pf-v5-theme-dark .pf-v5-c-form-control > input,
.pf-v5-theme-dark .pf-v5-c-form-control > select,
.pf-v5-theme-dark .pf-v5-c-page__main .pf-v5-c-menu-toggle.pf-m-full-width {
  color: var(--sl-text);
}
.pf-v5-theme-dark .pf-v5-c-form-control > input:disabled,
.pf-v5-theme-dark .pf-v5-c-form-control > input[readonly] {
  color: var(--sl-muted);
  -webkit-text-fill-color: var(--sl-muted);
}

body, .pf-v5-c-page { font-family: var(--sl-font); -webkit-font-smoothing: antialiased; }
.pf-v5-c-page { --pf-v5-c-page--BackgroundColor: var(--sl-bg); background: var(--sl-bg); }

/* ── 상단 바 ───────────────────────────── */
.pf-v5-c-masthead {
  --pf-v5-c-masthead--BackgroundColor: var(--sl-dark);
  background: var(--sl-dark);
  border-bottom: 2px solid var(--sl-crimson);
}
.pf-v5-c-masthead .pf-v5-c-button.pf-m-plain { color: #E0E0E0; }
.pf-v5-c-masthead .pf-v5-c-menu-toggle {
  --pf-v5-c-menu-toggle--BackgroundColor: transparent;
  color: #E0E0E0;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 6px;
  font-size: 13px;
}
.pf-v5-c-masthead .pf-v5-c-menu-toggle::before { border: 0; }
.pf-v5-c-masthead .pf-v5-c-menu-toggle:hover { border-color: rgba(255, 255, 255, .5); }
.pf-v5-c-masthead .pf-v5-c-menu-toggle__text { color: #E0E0E0; }
.pf-v5-c-masthead .pf-v5-c-avatar { border: 2px solid var(--sl-crimson); }
/* 관리 콘솔 바로가기(권한자에게만 표시) */
#sso-admin-console-link {
  background: transparent;
  color: #E0E0E0;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 6px;
  font-size: 13px;
}
#sso-admin-console-link::after { border: 0; }
#sso-admin-console-link:hover { border-color: var(--sl-link); color: #fff; }

/* ── 좌측 메뉴 ─────────────────────────── */
.pf-v5-c-page__sidebar {
  --pf-v5-c-page__sidebar--BackgroundColor: var(--sl-surface);
  background: var(--sl-surface);
  border-right: 1px solid var(--sl-line-soft);
  box-shadow: none;
}
.pf-v5-c-page__sidebar-body { padding-top: 14px; }
.pf-v5-c-page__sidebar .pf-v5-c-nav {
  --pf-v5-c-nav__link--Color: var(--sl-text);
  --pf-v5-c-nav__link--hover--Color: var(--sl-accent);
  --pf-v5-c-nav__link--focus--Color: var(--sl-accent);
  --pf-v5-c-nav__link--active--Color: var(--sl-accent);
  --pf-v5-c-nav__link--m-current--Color: var(--sl-accent);
  --pf-v5-c-nav__link--BackgroundColor: transparent;
  --pf-v5-c-nav__link--hover--BackgroundColor: var(--sl-hover);
  --pf-v5-c-nav__link--focus--BackgroundColor: var(--sl-hover);
  --pf-v5-c-nav__link--active--BackgroundColor: var(--sl-tint);
  --pf-v5-c-nav__link--m-current--BackgroundColor: var(--sl-tint);
  --pf-v5-c-nav__link--before--BorderColor: transparent;
  --pf-v5-c-nav__link--after--BorderColor: transparent;
  --pf-v5-c-nav__link--m-current--after--BorderColor: var(--sl-accent);
  --pf-v5-c-nav__link--hover--after--BorderColor: transparent;
  --pf-v5-c-nav__item--before--BorderColor: transparent;
  --pf-v5-c-nav__toggle--Color: #9A9AA0;
  --pf-v5-c-nav__subnav--BackgroundColor: transparent;
  background: transparent;
}
.pf-v5-c-page__sidebar .pf-v5-c-nav__item::before { border: 0; display: none; }
.pf-v5-c-page__sidebar .pf-v5-c-nav__link {
  color: var(--sl-text);
  font-size: 14px;
  padding-top: 11px;
  padding-bottom: 11px;
}
.pf-v5-c-page__sidebar .pf-v5-c-nav__link:hover { background: var(--sl-hover); color: var(--sl-accent); }
.pf-v5-c-page__sidebar .pf-v5-c-nav__link.pf-m-current,
.pf-v5-c-page__sidebar .pf-v5-c-nav__link.pf-m-current:hover {
  background: var(--sl-tint);
  color: var(--sl-accent);
  font-weight: 700;
  box-shadow: inset 3px 0 0 var(--sl-accent);
}
.pf-v5-c-page__sidebar .pf-v5-c-nav__link::after,
.pf-v5-c-page__sidebar .pf-v5-c-nav__link::before { border: 0; }
/* 하위 메뉴(계정 보안 > 로그인·기기 활동)는 들여쓰기 */
.pf-v5-c-page__sidebar .pf-v5-c-nav__subnav .pf-v5-c-nav__link { padding-left: 40px; font-size: 13.5px; }
.pf-v5-c-page__sidebar .pf-v5-c-nav__item.pf-m-expandable > .pf-v5-c-nav__link { font-weight: 600; }

/* ── 본문 ─────────────────────────────── */
.pf-v5-c-page__main { background: var(--sl-bg); }
.pf-v5-c-page__main > .pf-v5-c-page__main-section.pf-m-light:first-child,
.pf-v5-c-page__main-section.pf-m-light:has(> .pf-v5-c-content > h1) {
  background: transparent;
  padding: 30px 36px 16px;
}
.pf-v5-c-page__main-section.pf-m-light:has(> .pf-v5-c-content > h1) h1,
.pf-v5-c-page__main .pf-v5-c-title.pf-m-2xl {
  color: var(--sl-ink);
  font-size: 24px;
  font-weight: 800;
}
.pf-v5-c-page__main-section.pf-m-light:has(> .pf-v5-c-content > h1) p { color: var(--sl-muted); font-size: 14px; }
/* 제목 다음 본문 영역은 흰 카드 */
.pf-v5-c-page__main > .pf-v5-c-page__main-section + .pf-v5-c-page__main-section {
  background: var(--sl-surface);
  margin: 0 36px 36px;
  padding: 26px 28px;
  border: 1px solid var(--sl-line-soft);
  border-radius: 10px;
}
.pf-v5-c-page__main .pf-v5-c-title.pf-m-xl { color: var(--sl-ink); font-size: 17px; font-weight: 700; }

/* 폼 */
.pf-v5-c-form__label-text { color: var(--sl-text); font-weight: 600; }
.pf-v5-c-form__label-required { color: var(--sl-link); }
.pf-v5-c-form-control,
.pf-v5-c-page__main .pf-v5-c-menu-toggle.pf-m-full-width {
  --pf-v5-c-form-control--before--BorderStyle: none;
  --pf-v5-c-form-control--after--BorderStyle: none;
  border: 1px solid var(--sl-line);
  border-radius: 8px;
  background: var(--sl-surface);
  min-height: 42px;
}
.pf-v5-c-form-control::before, .pf-v5-c-form-control::after,
.pf-v5-c-page__main .pf-v5-c-menu-toggle.pf-m-full-width::before { border: 0; }
.pf-v5-c-form-control:focus-within {
  border-color: var(--sl-accent);
  box-shadow: 0 0 0 3px var(--sl-focus);
}
.pf-v5-c-form-control.pf-m-disabled,
.pf-v5-c-form-control.pf-m-readonly { background: var(--sl-hover); color: var(--sl-muted); }
.pf-v5-c-form-control > input,
.pf-v5-c-form-control > select {
  height: 40px;
  padding-top: 0;
  padding-bottom: 0;
  font-size: 14px;
}
.pf-v5-c-page__main .pf-v5-c-menu-toggle.pf-m-full-width::before,
.pf-v5-c-page__main .pf-v5-c-menu-toggle.pf-m-full-width::after { border: 0 !important; }

/* 버튼 */
.pf-v5-c-button { border-radius: 8px; font-family: var(--sl-font); }
.pf-v5-c-button.pf-m-primary { background-color: var(--sl-crimson); font-weight: 700; }
.pf-v5-c-button.pf-m-primary:hover,
.pf-v5-c-button.pf-m-primary:focus { background-color: var(--sl-crimson-deep); }
.pf-v5-c-button.pf-m-secondary { color: var(--sl-accent); }
.pf-v5-c-button.pf-m-secondary::after { border-color: var(--sl-line); border-radius: 8px; }
.pf-v5-c-button.pf-m-secondary:hover::after { border-color: var(--sl-accent); }
.pf-v5-c-button.pf-m-link { color: var(--sl-link); }
.pf-v5-c-button.pf-m-link:hover { color: var(--sl-link-hover); }
a { color: var(--sl-link); }
a:hover { color: var(--sl-link-hover); }

/* 섹션 바로가기·탭 강조색 */
.pf-v5-c-jump-links__item.pf-m-current .pf-v5-c-jump-links__link::before { border-color: var(--sl-accent); }
.pf-v5-c-jump-links__item.pf-m-current .pf-v5-c-jump-links__link-text { color: var(--sl-accent); }
.pf-v5-c-tabs__link::after { --pf-v5-c-tabs__link--after--BorderColor: var(--sl-accent); }

/* 기존 v2 규칙 유지: 역할 확인된 관리 콘솔 링크만 남기고 referrer 로 나오는 관리 콘솔 링크는 숨김 */
header a[data-testid="referrer-link"][href*="/admin/"][href*="/console"] { display: none !important; }

/* 상단 바의 더보기(⋮) 버튼은 테두리 없는 아이콘 버튼으로 */
.pf-v5-c-masthead .pf-v5-c-menu-toggle.pf-m-plain {
  border: 0;
  color: #E0E0E0;
  padding-left: 10px;
  padding-right: 10px;
}
.pf-v5-c-masthead .pf-v5-c-menu-toggle.pf-m-plain:hover { color: #fff; background: rgba(255, 255, 255, .08); }

/* 상단 바 배치: 모든 화면 너비에서 같은 구조로 고정한다.
   [메뉴 버튼] [로고] ……… [관리 콘솔·이름(또는 ⋮)·프로필] 한 줄, 높이 60px.
   PatternFly 기본은 너비 구간마다 2줄 배치·가운데 정렬·높이가 달라져 일관되지 않다. */
.pf-v5-c-masthead {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: center;
  column-gap: 12px;
  row-gap: 0;
  height: 60px;
  min-height: 60px;
  padding: 0 16px 0 8px;
}
.pf-v5-c-masthead__toggle { grid-column: 1; grid-row: 1; margin: 0; }
.pf-v5-c-masthead__brand { grid-column: 2; grid-row: 1; min-width: 0; margin: 0; }
.pf-v5-c-masthead__brand img { height: 24px; width: auto; max-width: 170px; display: block; }
.pf-v5-c-masthead__content { grid-column: 3; grid-row: 1; min-width: 0; min-height: 0; margin: 0; }
.pf-v5-c-masthead__content .pf-v5-c-toolbar,
.pf-v5-c-masthead__content .pf-v5-c-toolbar__content { width: 100%; padding: 0; background: transparent; }
.pf-v5-c-masthead__content .pf-v5-c-toolbar__content-section {
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: 10px;
}
.pf-v5-c-masthead .pf-v5-c-toolbar__item { margin: 0 !important; }
.pf-v5-c-masthead .pf-v5-c-toolbar__item:empty { display: none; }
.pf-v5-c-masthead .pf-v5-c-menu-toggle:not(.pf-m-plain) { height: 34px; }
.pf-v5-c-masthead .pf-v5-c-avatar { width: 34px; height: 34px; }

/* ── 모바일(768px 이하) ─────────────────────
   PatternFly 기본 모바일 배치(굵은 회색 구분 띠, 표 머리글이 세로로 쌓임, 넓은 들여쓰기)를
   목록형 카드 배치로 바꾼다. PC 배치는 위 규칙 그대로다. */
@media (max-width: 768px) {
  /* 상단 바: 관리 콘솔은 아이콘 버튼으로 줄여 프로필이 밀려나지 않게 한다 */
  .pf-v5-c-masthead { column-gap: 8px; padding: 0 10px 0 4px; height: 56px; min-height: 56px; }
  .pf-v5-c-masthead__brand img { height: 21px; max-width: 132px; }
  .pf-v5-c-masthead__content .pf-v5-c-toolbar__content-section { gap: 4px; }
  .pf-v5-c-masthead .pf-v5-c-avatar { width: 32px; height: 32px; }
  #sso-admin-console-link {
    width: 36px; height: 36px; padding: 0;
    font-size: 0; border-color: transparent;
    display: inline-flex; align-items: center; justify-content: center;
  }
  #sso-admin-console-link::before {
    content: ""; width: 20px; height: 20px; background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  #sso-admin-console-link:hover { background: rgba(255, 255, 255, .08); }

  /* 제목·카드 여백 */
  .pf-v5-c-page__main > .pf-v5-c-page__main-section.pf-m-light:first-child,
  .pf-v5-c-page__main-section.pf-m-light:has(> .pf-v5-c-content > h1) { padding: 20px 16px 12px; }
  .pf-v5-c-page__main-section.pf-m-light:has(> .pf-v5-c-content > h1) h1,
  .pf-v5-c-page__main .pf-v5-c-title.pf-m-2xl { font-size: 21px; }
  .pf-v5-c-page__main-section.pf-m-light:has(> .pf-v5-c-content > h1) p { font-size: 13px; margin-top: 2px; }
  .pf-v5-c-page__main > .pf-v5-c-page__main-section + .pf-v5-c-page__main-section {
    margin: 0 12px 20px; padding: 4px 16px 8px; border-radius: 12px;
    flex: 0 0 auto;
  }
  .pf-v5-c-page__main .pf-v5-c-title.pf-m-xl { font-size: 16px; }

  /* 목록 공통: 굵은 회색 띠 대신 얇은 구분선 */
  .pf-v5-c-page__main .pf-v5-c-data-list {
    --pf-v5-c-data-list--BorderTopWidth: 0;
    --pf-v5-c-data-list__item--BorderBottomWidth: 1px;
    --pf-v5-c-data-list__item--BorderBottomColor: var(--sl-line-soft);
    --pf-v5-c-data-list__item--sm--BorderTopWidth: 0;
    --pf-v5-c-data-list__item--sm--BorderTopColor: transparent;
    border-top: 0;
    margin-bottom: 0 !important;
  }
  .pf-v5-c-page__main .pf-v5-c-data-list__item { border-top: 0; border-bottom: 1px solid var(--sl-line-soft); }
  .pf-v5-c-page__main .pf-v5-c-data-list__item:last-child { border-bottom: 0; }
  .pf-v5-c-page__main .pf-v5-c-data-list__item-row { padding-left: 0; padding-right: 0; }
  .pf-v5-c-page__main .pf-v5-c-data-list__cell { padding-top: 0; padding-bottom: 0; }

  /* 개인 정보: 바로가기 목록은 모바일에서 숨기고 입력란 간격을 줄인다 */
  .pf-v5-l-grid__item:has(> .pf-v5-c-page__main-section > .pf-v5-c-jump-links) { display: none; }
  .pf-v5-c-form section > h1.pf-v5-c-title.pf-m-xl { margin: 16px 0 4px; }
  .pf-v5-c-page__main .pf-v5-c-form { --pf-v5-c-form--GridGap: 14px; }
  .pf-v5-c-page__main .pf-v5-c-form__group-label { padding-bottom: 6px; }
  .pf-v5-c-page__main .pf-v5-c-form__label-text { font-size: 13.5px; }
  .pf-v5-c-page__main .pf-v5-c-form__group.pf-m-action { margin-top: 6px; padding-bottom: 8px; }
  .pf-v5-c-page__main .pf-v5-c-form__actions { flex-wrap: nowrap; gap: 8px; margin: 0; }
  .pf-v5-c-page__main .pf-v5-c-form__actions > .pf-v5-c-button { margin: 0; }
  .pf-v5-c-page__main .pf-v5-c-form__actions > .pf-v5-c-button.pf-m-primary { flex: 1; min-height: 44px; }

  /* 로그인 수단: 분류별 머리말 */
  .pf-v5-c-page__main-section.pf-v5-u-px-0 { padding-top: 16px; padding-bottom: 8px; }
  .pf-v5-c-page__main-section.pf-v5-u-px-0 + .pf-v5-c-page__main-section.pf-v5-u-px-0 { border-top: 1px solid var(--sl-line-soft); }
  .pf-v5-c-page__main-section.pf-v5-u-px-0 > .pf-v5-l-split { margin-top: 10px !important; margin-bottom: 6px !important; align-items: flex-start; }
  .pf-v5-c-page__main-section.pf-v5-u-px-0 > .pf-v5-l-split h3 { margin-bottom: 2px !important; font-size: 14.5px; }
  [data-testid$="/help-text"] { font-size: 13px; color: var(--sl-muted); }

  /* 로그인 수단: 항목 한 줄 = [아이콘] 이름·생성일·연결 방식 [버튼] */
  [data-testid$="/credential-list"] .pf-v5-c-data-list__item-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "label action" "created action" "warn warn";
    column-gap: 12px; row-gap: 3px;
    align-items: center;
    padding: 12px 0 !important;
  }
  [data-testid$="/credential-list"] .pf-v5-c-data-list__item-content:has([data-testrole="icon"]) {
    grid-template-columns: 36px minmax(0, 1fr) auto;
    grid-template-areas: "icon label action" "icon created action" "icon warn warn";
  }
  [data-testid$="/credential-list"] .pf-v5-c-data-list__cell { margin: 0; padding: 0 !important; min-width: 0; }
  [data-testid$="/credential-list"] [data-testrole="icon"] { grid-area: icon; align-self: start; padding-top: 2px !important; }
  [data-testid$="/credential-list"] [data-testrole="icon"] .pf-v5-c-icon { width: 32px; height: 32px; }
  [data-testid$="/credential-list"] [data-testrole="icon"] img { width: 32px; height: 32px; object-fit: contain; }
  [data-testid$="/credential-list"] [data-testrole="label"] { grid-area: label; font-size: 14.5px; font-weight: 600; color: var(--sl-ink); overflow-wrap: anywhere; }
  [data-testid$="/credential-list"] [data-testrole="label"] div + div { font-size: 12.5px; font-weight: 400; color: var(--sl-muted); }
  [data-testid$="/credential-list"] [data-testrole="created-at"] { grid-area: created; font-size: 12.5px; color: var(--sl-muted); }
  [data-testid$="/credential-list"] [data-testrole="created-at"] strong { font-weight: 600; margin-right: 6px !important; }
  [data-testid$="/credential-list"] [data-testrole="warning-message"] { grid-area: warn; font-size: 12.5px; color: var(--sl-muted); }
  [data-testid$="/credential-list"] [data-testrole="warning-message"] > .pf-v5-l-split { margin: 0 !important; align-items: center; gap: 4px; }
  [data-testid$="/credential-list"] [data-testrole="warning-message"] svg { width: 12px; height: 12px; }
  [data-testid$="/credential-list"] [data-testrole="warning-message"] .pf-v5-c-description-list { --pf-v5-c-description-list--RowGap: 0; display: block; }
  [data-testid$="/credential-list"] [data-testrole="warning-message"] .pf-v5-c-description-list__group { display: flex; gap: 6px; }
  [data-testid$="/credential-list"] [data-testrole="warning-message"] .pf-v5-c-description-list__term,
  [data-testid$="/credential-list"] [data-testrole="warning-message"] .pf-v5-c-description-list__description { font-size: 12.5px; font-weight: 400; color: var(--sl-muted); }
  [data-testid$="/credential-list"] .pf-v5-c-data-list__item-action { grid-area: action; margin: 0; padding: 0; align-self: center; }
  [data-testid$="/credential-list"] .pf-v5-c-data-list__item-action .pf-v5-c-button { font-size: 13px; padding: 5px 12px; }
  [data-testid$="/credential-list"] .pf-v5-c-button.pf-m-danger {
    background: var(--sl-surface); color: var(--sl-danger); border: 1px solid var(--sl-danger-line); font-weight: 600;
  }
  [data-testid$="/credential-list"] [data-testid$="/not-set-up"] { font-size: 13px; color: var(--sl-muted); text-align: left !important; justify-content: flex-start !important; }
  [data-testid$="/credential-list"] .pf-v5-c-data-list__item-content:has([data-testid$="/not-set-up"]) { display: block; padding: 8px 0 12px !important; }
  [data-testid$="/credential-list"] .pf-v5-c-data-list__item:has([data-testid$="/not-set-up"]) { align-items: stretch !important; }

  /* 기기 활동 */
  .pf-v5-c-page__main-section > .pf-v5-l-split.pf-m-gutter:has(#refresh-page) { flex-wrap: wrap; row-gap: 8px; margin: 14px 0 6px !important; align-items: center; }
  .pf-v5-l-split:has(#refresh-page) h2 { white-space: nowrap; }
  .pf-v5-l-split:has(#refresh-page) .pf-v5-c-button { font-size: 13px; padding-left: 8px; padding-right: 8px; }
  .pf-v5-c-data-list__item-row[data-testid^="row-"] .pf-v5-c-data-list__expandable-content-body { padding: 12px 0; }
  .pf-v5-c-data-list__item-row[data-testid^="row-"] .pf-v5-l-grid { row-gap: 8px; column-gap: 8px; align-items: center; }
  .pf-v5-c-data-list__item-row[data-testid^="row-"] .pf-v5-l-grid__item.pf-m-10-col { font-size: 14.5px; font-weight: 600; color: var(--sl-ink); }
  .pf-v5-c-data-list__item-row[data-testid^="row-"] .pf-v5-l-grid__item.pf-m-11-col { grid-column: 1 / -1; }
  .pf-v5-c-data-list__item-row[data-testid^="row-"] .pf-v5-c-description-list { display: grid; row-gap: 4px; }
  .pf-v5-c-data-list__item-row[data-testid^="row-"] .pf-v5-c-description-list__group { display: grid; grid-template-columns: 76px minmax(0, 1fr); column-gap: 8px; }
  .pf-v5-c-data-list__item-row[data-testid^="row-"] .pf-v5-c-description-list__term { font-size: 12.5px; font-weight: 400; color: var(--sl-muted); }
  .pf-v5-c-data-list__item-row[data-testid^="row-"] .pf-v5-c-description-list__description { font-size: 13px; overflow-wrap: anywhere; }

  /* 애플리케이션: 머리글 행은 숨기고 이름 아래 유형·상태를 작은 표지로 */
  #applications-list-header { display: none; }
  #applications-list .pf-v5-c-data-list__item-row { align-items: flex-start !important; padding: 12px 0; }
  #applications-list .pf-v5-c-data-list__item-control { margin-right: 6px; padding-top: 2px; }
  #applications-list .pf-v5-c-data-list__item-content { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 !important; align-items: center !important; }
  #applications-list .pf-v5-c-data-list__cell { flex: 0 0 auto; margin: 0; padding: 0 !important; }
  #applications-list .pf-v5-c-data-list__cell:first-child { flex: 1 0 100%; font-size: 14.5px; font-weight: 600; }
  #applications-list .pf-v5-c-data-list__cell:first-child .pf-v5-c-button { padding: 0; font-weight: 600; text-align: left; white-space: normal; }
  #applications-list .pf-v5-c-data-list__cell:not(:first-child) {
    font-size: 12px; color: var(--sl-muted); background: var(--sl-badge); border-radius: 999px; padding: 2px 9px !important;
  }
  #applications-list .pf-v5-c-data-list__expandable-content { padding-left: 34px !important; }
  #applications-list .pf-v5-c-data-list__expandable-content-body { padding: 0 0 12px; }
  #applications-list .pf-v5-c-description-list { row-gap: 4px; }
  #applications-list .pf-v5-c-description-list__group { display: grid; grid-template-columns: 76px minmax(0, 1fr); column-gap: 8px; }
  #applications-list .pf-v5-c-description-list__term { font-size: 12.5px; font-weight: 400; color: var(--sl-muted); }
  #applications-list .pf-v5-c-description-list__description { font-size: 13px; overflow-wrap: anywhere; }

  /* 그룹: [이름 / 경로] [직접 소속] 두 칸 */
  #groups-list .pf-v5-c-data-list__item-row { padding: 10px 0; }
  #groups-list .pf-v5-c-data-list__item-content {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; row-gap: 1px; align-items: center; padding: 0 !important;
  }
  #groups-list .pf-v5-c-data-list__cell { margin: 0; padding: 0 !important; }
  #groups-list-header .pf-v5-c-data-list__item-content { display: block; }
  #groups-list-header .pf-v5-c-check__label { font-size: 13px; }
  #groups-list-columns-names .pf-v5-c-data-list__cell:nth-child(2) { display: none; }
  #groups-list-columns-names strong { font-size: 12px; color: var(--sl-muted); font-weight: 600; }
  #groups-list-columns-names .pf-v5-c-data-list__item-row { padding: 6px 0; }
  #groups-list [data-testid$="].name"] { grid-column: 1; grid-row: 1; font-size: 14.5px; font-weight: 600; color: var(--sl-ink); overflow-wrap: anywhere; }
  #groups-list [id$="-group-path"] { grid-column: 1; grid-row: 2; font-size: 12.5px; color: var(--sl-muted); overflow-wrap: anywhere; }
  #groups-list [id$="-group-directMembership"] { grid-column: 2; grid-row: 1 / span 2; justify-self: center; }
  #groups-list-columns-names .pf-v5-c-data-list__cell:nth-child(1) { grid-column: 1; grid-row: 1; }
  #groups-list-columns-names .pf-v5-c-data-list__cell:nth-child(3) { grid-column: 2; grid-row: 1; justify-self: end; }
}