/* ====================================================================
   管理画面の追加CSS。Tabler（/static/vendor/tabler/）の後に読む。
   瀬戸内市場の admin.css から、記事エディタの部分を除いて移植（2026-10-04）

   ==================================================================== */

:root {
  /* Tabler の既定は Inter。日本語の管理画面なのでシステムの和文に寄せる */
  --tblr-font-sans-serif: -apple-system, BlinkMacSystemFont, "Hiragino Sans",
    "Noto Sans JP", "Segoe UI", Roboto, sans-serif;
  /* 主色は公開側の「ポン」の濃い赤紫 rgb(85,25,55)。白文字が読める */
  --tblr-primary: #551937;
  --tblr-primary-rgb: 85, 25, 55;
  --tblr-primary-darken: #40122a;
  --tblr-primary-fg: #fff;
}

/* 押せるカードはホバーでわずかに浮く */
.card-link { transition: transform .12s ease, box-shadow .12s ease; }
.card-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 2px 4px rgba(16, 24, 40, .07), 0 12px 28px rgba(16, 24, 40, .12);
}

/* カードとアラートにごく薄い影。色の付いた背景の上で紙のように浮かせる */
.card, .page-body .alert {
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 6px 18px rgba(16, 24, 40, .08);
}
/* 角丸は公開側のカードと同じ 10px。card-table の行背景が
   角からはみ出して欠けて見えるので、中身ごと角で切り落とす */
.card {
  --tblr-card-border-radius: 10px;
  --tblr-card-inner-border-radius: 9px;
  overflow: hidden;
}
.page-body .alert { border-radius: 10px; }

/* Tabler の .alert は display:flex（アイコン併記用）。アイコンを使わない
   この管理画面では、<strong> や <br> 混じりの文が横に割れるので縦に戻す */
.alert { flex-direction: column; gap: .25rem; }

/* 背景に直接載る場所（見出し・注記）のリンクは下線＋濃色で立てる */
.page-header a:not(.btn), .page-body > .container-xl > p a,
.page-body > .container-xl > .text-secondary a {
  color: var(--tblr-body-color); text-decoration: underline;
}

/* 本体の背景は主色（濃い赤紫）をごく薄くした色。カードの白が浮くように */
.page { background: #f4eef1; }
[data-bs-theme=dark] .page { background: #1e1419; }

/* サイドバーの頭のロゴ */
.navbar-vertical .brand-logo { width: 150px; display: block; margin: 0 auto; }
/* ロゴ下の「管理画面」札。ロゴと間を空け、角丸の罫線で囲う */
.navbar-vertical .brand-tag { display: inline-block; margin-top: 14px;
  padding: 3px 14px; border: 1px solid #c6cdd5; border-radius: 999px;
  font-size: 12px; color: #667382; }
[data-bs-theme=dark] .navbar-vertical .brand-logo {
  /* 黒文字ロゴをダークで白抜きに */
  filter: invert(1) hue-rotate(180deg);
}
.navbar-vertical .letter-sp { letter-spacing: .35em; text-indent: .35em; }

/* 金額・数値の列。表の中で桁を揃える */
.num { text-align: right; font-variant-numeric: tabular-nums; }
th.num { text-align: right; }

/* サイドバーの下端に置く操作者の表示 */
.navbar-vertical .actor-box {
  margin-top: auto;
  padding: .75rem 1rem .5rem;
  border-top: 1px solid var(--tblr-border-color);
  font-size: .78rem;
  color: var(--tblr-secondary);
  overflow-wrap: anywhere;
}
.navbar-vertical .actor-box .caps { margin-top: .15rem; }

/* 一覧の小さな写真。Tabler の img 既定（max-width:100%; height:auto）に負けないよう幅と高さを固定 */
.table .thumb { width: 48px; height: 48px; max-width: none; object-fit: cover; }