/* =============================================================================
   監査ログ (admin-logs.php) 専用スタイル
   3軸分類:
     - side (自社/クライアント/システム) → 上部タブ + カード内バッジ
     - kind (操作カテゴリ) → カード内バッジ
     - severity (危険度) → カード左端の縦線色 + バッジ
   ============================================================================= */

.al-loading, .al-empty { text-align:center; color:var(--text-muted); padding:40px 16px; font-size:13px; }

/* =========================================================================
   現在のフィルタチップ (候補選択で絞り込み中であることを明示)
   ========================================================================= */
.al-filter-chip-host {
    display:flex; align-items:center; gap:10px; flex-wrap:wrap;
    padding:10px 14px; margin-bottom:12px;
    background:var(--brand-soft);
    border:1px solid var(--brand-soft-hover);
    border-radius:10px;
}
.al-chip-label {
    font-size:11.5px; color:var(--brand-hover); font-weight:700;
}
.al-chip {
    display:inline-flex; align-items:center; gap:6px;
    padding:5px 5px 5px 10px;
    background:var(--bg-card); border:1px solid var(--border);
    border-radius:999px;
    font-size:12.5px;
}
.al-chip__ic { font-size:14px; }
.al-chip__type {
    font-size:10px; font-weight:700;
    padding:1px 6px; border-radius:5px;
    background:var(--bg-subtle); color:var(--text-secondary);
    text-transform:uppercase; letter-spacing:.5px;
}
.al-chip--admin  .al-chip__type { background:#FEF3C7; color:#92400E; }
.al-chip--tenant .al-chip__type { background:#DBEAFE; color:#1E40AF; }
.al-chip__name { font-weight:700; color:var(--text); }
.al-chip__x {
    width:22px; height:22px; border:none; background:transparent;
    color:var(--text-tertiary); cursor:pointer; font-size:12px; line-height:1;
    border-radius:50%; padding:0;
    display:inline-flex; align-items:center; justify-content:center;
    transition:background .12s, color .12s;
}
.al-chip__x:hover { background:#FEE2E2; color:#B91C1C; }

/* =========================================================================
   ヘッダの検索バー
   ========================================================================= */
.al-search {
    position:relative; display:inline-flex; align-items:center;
}
.al-search__input {
    width:260px; padding:7px 30px 7px 30px;
    border:1px solid var(--border); border-radius:8px;
    background:var(--bg-input); color:var(--text);
    font-size:13px; font-family:inherit; outline:none;
    transition:border-color .12s, box-shadow .12s, width .15s;
    /* 検索アイコン (data URI でシンプルに左に埋める) */
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:8px center;
    background-size:14px 14px;
}
.al-search__input:focus {
    border-color:var(--brand); box-shadow:0 0 0 3px var(--border-focus);
    width:320px;
}
.al-search__input::placeholder { color:var(--text-tertiary); font-size:12.5px; }
.al-search__clear {
    position:absolute; right:6px; top:18px; transform:translateY(-50%);
    width:22px; height:22px; border:none; background:transparent;
    color:var(--text-tertiary); cursor:pointer; font-size:13px; line-height:1;
    border-radius:50%; padding:0;
    display:inline-flex; align-items:center; justify-content:center;
    z-index:2;
}
.al-search__clear:hover { background:var(--bg-hover); color:var(--text); }

/* ---------- オートサジェスト ドロップダウン ---------- */
.al-suggest {
    position:absolute; top:calc(100% + 4px); left:0; right:0;
    background:var(--bg-card); border:1px solid var(--border);
    border-radius:10px;
    box-shadow:0 8px 24px rgba(0,0,0,.12);
    max-height:320px; overflow-y:auto;
    z-index:50;
    opacity:0; pointer-events:none; transform:translateY(-4px);
    transition:opacity .12s ease, transform .12s ease;
}
.al-suggest.is-open {
    opacity:1; pointer-events:auto; transform:translateY(0);
}
.al-suggest__empty {
    padding:14px 14px; text-align:center;
    font-size:11.5px; color:var(--text-tertiary);
}
.al-suggest__hint {
    padding:8px 12px;
    font-size:11px; color:var(--text-tertiary);
    background:var(--bg-subtle); border-bottom:1px solid var(--border-subtle);
}
.al-suggest__item {
    display:flex; align-items:flex-start; gap:10px;
    width:100%; padding:9px 12px; border:none; background:transparent;
    cursor:pointer; text-align:left; font-family:inherit;
    border-bottom:1px solid var(--border-subtle);
    transition:background .1s;
}
.al-suggest__item:last-child { border-bottom:none; }
.al-suggest__item:hover, .al-suggest__item.is-active {
    background:var(--brand-soft);
}
.al-suggest__ic { font-size:16px; flex-shrink:0; padding-top:1px; }
.al-suggest__body { flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.al-suggest__type {
    font-size:10px; font-weight:700; color:var(--text-tertiary);
    text-transform:uppercase; letter-spacing:.5px;
}
.al-suggest__label {
    font-size:13px; font-weight:700; color:var(--text);
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.al-suggest__sub {
    font-size:11px; color:var(--text-tertiary);
    font-family:'JetBrains Mono','Inter',monospace;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* =========================================================================
   side タブ (上部)
   ========================================================================= */
.al-tabs {
    display:flex; gap:6px; flex-wrap:wrap;
    margin-bottom:16px;
    border-bottom:1px solid var(--border);
    padding-bottom:0;
}
.al-tab {
    display:inline-flex; align-items:center; gap:6px;
    padding:9px 14px; border:none; background:transparent;
    color:var(--text-secondary); cursor:pointer;
    font-size:13px; font-weight:600; font-family:inherit;
    border-bottom:2px solid transparent;
    margin-bottom:-1px;
    transition:color .12s, border-color .12s, background .12s;
    border-radius:6px 6px 0 0;
}
.al-tab:hover { color:var(--text); background:var(--bg-hover); }
.al-tab.is-active {
    color:var(--brand); border-bottom-color:var(--brand);
    background:transparent;
}
.al-tab__ic { font-size:14px; }
.al-tab__count {
    display:inline-flex; align-items:center; justify-content:center;
    min-width:22px; height:18px; padding:0 7px;
    background:var(--bg-subtle); color:var(--text-tertiary);
    border-radius:999px; font-size:11px; font-weight:700;
    margin-left:2px;
}
.al-tab.is-active .al-tab__count {
    background:var(--brand-soft); color:var(--brand);
}

/* =========================================================================
   ログカード
   ========================================================================= */
.al-list { display:flex; flex-direction:column; gap:8px; }

.al-row {
    display:grid; grid-template-columns:150px 1fr;
    gap:14px; padding:14px 16px;
    background:var(--bg-card); border:1px solid var(--border);
    border-left:4px solid var(--border-strong);
    border-radius:10px;
    transition:box-shadow .12s;
}
.al-row:hover { box-shadow:0 2px 6px rgba(0,0,0,.04); }
/* severity 別の左ボーダー色 */
.al-row--safe   { border-left-color:#16A34A; }
.al-row--notice { border-left-color:#D97706; }
.al-row--danger { border-left-color:#DC2626; background:rgba(220,38,38,.02); }

.al-row__time {
    font-size:11.5px; color:var(--text-tertiary);
    font-family:'JetBrains Mono','Inter',monospace;
    padding-top:2px; white-space:nowrap;
}

.al-row__main { display:flex; flex-direction:column; gap:6px; min-width:0; }

/* タグ行 (side / kind / severity) */
.al-row__tags {
    display:flex; flex-wrap:wrap; gap:6px;
    margin-bottom:2px;
}

.al-side, .al-kind, .al-sev {
    display:inline-flex; align-items:center; gap:4px;
    font-size:11px; font-weight:700;
    padding:2px 9px; border-radius:999px;
    white-space:nowrap;
}

/* side バッジ */
.al-side--galaxia { background:#FEF3C7; color:#92400E; }
.al-side--tenant  { background:#DBEAFE; color:#1E40AF; }
.al-side--system  { background:#E0E7FF; color:#3730A3; }

/* kind バッジ */
.al-kind--auth       { background:#F3E8FF; color:#6B21A8; }
.al-kind--account    { background:#D1FAE5; color:#047857; }
.al-kind--permission { background:#FED7AA; color:#9A3412; }
.al-kind--setting    { background:#E0E7FF; color:#3730A3; }
.al-kind--content    { background:#FCE7F3; color:#9D174D; }
.al-kind--theme      { background:#CFFAFE; color:#155E75; }
.al-kind--pairing    { background:#DBEAFE; color:#1E40AF; }
.al-kind--other      { background:var(--bg-subtle); color:var(--text-secondary); }

/* severity バッジ */
.al-sev--safe   { background:#D1FAE5; color:#047857; }
.al-sev--notice { background:#FEF3C7; color:#92400E; }
.al-sev--danger { background:#FEE2E2; color:#B91C1C; font-weight:800; }

/* メイン本文: 「ATDM Developer [管理者] が 管理者を新規発行しました」 */
.al-row__headline {
    display:flex; align-items:center; flex-wrap:wrap; gap:6px;
    font-size:13.5px; color:var(--text); line-height:1.5;
}
.al-row__icon { font-size:15px; flex-shrink:0; }
.al-actor-name { font-weight:700; color:var(--text); }
.al-row__verb { color:var(--text); }
/* テナント側ログでテナント名を強調表示 */
.al-tenant-name { font-weight:800; color:var(--brand-hover); }
.al-tenant-actor {
    color:var(--text-tertiary); font-weight:500; font-size:12px;
    font-family:'JetBrains Mono','Inter',monospace;
}

.al-actor-type {
    display:inline-block; font-size:10.5px; font-weight:700;
    padding:1px 7px; border-radius:5px; white-space:nowrap;
}
.al-actor-type--admin  { background:#FEF3C7; color:#92400E; }
.al-actor-type--tenant { background:#DBEAFE; color:#1E40AF; }
.al-actor-type--system { background:#E0E7FF; color:#3730A3; }
.al-actor-type--client { background:#D1FAE5; color:#047857; }

/* 対象: 管理者 #5 */
.al-target {
    font-size:12px; color:var(--text-secondary);
    padding-left:21px;
}

/* payload のチップ群 */
.al-payload {
    display:flex; flex-wrap:wrap; gap:6px;
    padding-left:21px;
}
.al-pl {
    display:inline-flex; align-items:center; gap:6px;
    background:var(--bg-subtle); border:1px solid var(--border-subtle);
    border-radius:6px; padding:3px 9px;
    font-size:11.5px; color:var(--text);
}
.al-pl__k { color:var(--text-tertiary); font-weight:600; }
.al-pl__v { color:var(--text); font-weight:500; word-break:break-all; }
.al-pl__v i { font-size:11px; }
.al-pl__chip {
    display:inline-block;
    background:var(--brand-soft); color:var(--brand);
    padding:1px 7px; border-radius:5px;
    font-size:10.5px; font-weight:600;
    margin-right:3px;
}
.al-pl__v code {
    background:var(--bg-card); padding:1px 5px; border-radius:4px;
    font-family:'JetBrains Mono','Inter',monospace; font-size:11px;
}

/* メタ行 (action コードと IP) */
.al-row__meta {
    display:flex; gap:14px; flex-wrap:wrap;
    padding-left:21px; margin-top:2px;
    font-size:10.5px; color:var(--text-tertiary);
    font-family:'JetBrains Mono','Inter',monospace;
}
.al-action-code { opacity:.8; }
.al-ip          { opacity:.8; }

/* ---------- スマホ ---------- */
@media (max-width: 820px) {
    .al-row { grid-template-columns:1fr; gap:6px; }
    .al-row__time { font-size:11px; }
    .al-target, .al-payload, .al-row__meta { padding-left:0; }
    .al-tabs { gap:2px; }
    .al-tab { padding:8px 10px; font-size:12px; }
    .al-search { width:100%; }
    .al-search__input, .al-search__input:focus { width:100%; }
}