/* ============================================================
 *  page-castdb.css
 *  キャストDB ページ専用スタイル（page-castdb.php）
 * ============================================================ */


/* ─── Page backgrounds ────────────────────────────────────── */
.castdb-detail-bg { background: #f5f5f5; }
.castdb-list-bg   { background: #f4f5f7; }


/* ─── Detail: layout ──────────────────────────────────────── */
.castdb-wrap              { max-width: 780px; margin: 0 auto; }
.castdb-hero              { display: flex; gap: 2rem; align-items: flex-start; margin-bottom: 2.5rem; }
.castdb-hero-img          { flex-shrink: 0; width: 300px; position: relative; }
.castdb-hero-img img      { width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: .5rem; box-shadow: 0 4px 20px rgba(0,0,0,.12); cursor: pointer; }
.castdb-hero-img-placeholder { width: 300px; aspect-ratio: 3/4; background: #eee; border-radius: .5rem; display: flex; align-items: center; justify-content: center; }
.castdb-hero-info         { flex: 1; min-width: 0; }
.castdb-placeholder-icon  { font-size: 4rem; color: #ccc; }


/* ─── Detail: section cards ───────────────────────────────── */
.castdb-hero-card   { background: #fff; border-radius: .75rem; padding: 2rem; box-shadow: 0 2px 16px rgba(0,0,0,.06); margin-bottom: 1.5rem; }
.castdb-detail-card { background: #fff; border-radius: .75rem; padding: 2rem; box-shadow: 0 2px 16px rgba(0,0,0,.06); }


/* ─── Detail: name / kana ─────────────────────────────────── */
.castdb-name { font-size: 1.8rem; font-weight: 800; line-height: 1.2; margin-bottom: .2rem; }
.castdb-kana { font-size: .85rem; color: #888; margin-bottom: .75rem; letter-spacing: .08em; }


/* ─── Detail: badges ──────────────────────────────────────── */
.castdb-badges       { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.castdb-badge        { display: inline-flex; align-items: center; gap: .25rem; font-size: .78rem; font-weight: 600; padding: 3px 10px; border-radius: 6px; background: #f4f4f4; color: #555; border: 1px solid #e0e0e0; }
.castdb-badge.accent { background: #fef2f2; color: #dc3545; border-color: #fca5a5; }


/* ─── Detail: stat row ────────────────────────────────────── */
.castdb-stat-row   { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: .88rem; color: #444; margin-bottom: .75rem; }
.castdb-stat-item  { display: flex; align-items: center; gap: .3rem; }
.castdb-stat-label { color: #999; font-size: .78rem; }


/* ─── Detail: meta info (location / language / org) ──────── */
.castdb-meta-row  { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; font-size: .82rem; color: #888; margin-bottom: .5rem; }
.castdb-meta-item { display: flex; align-items: center; gap: .2rem; }
.castdb-meta-icon { font-size: 1rem; line-height: 1; flex-shrink: 0; }
.castdb-org-p     { font-size: .82rem; color: #888; margin-bottom: .4rem; display: flex; align-items: center; gap: .25rem; }
.castdb-org-row   { margin-top: 30px; }
.castdb-org-row .castdb-stat-item { align-items: flex-start; }
.castdb-org-row .castdb-stat-label { margin-top: 3px; }
.castdb-org-val   { display: flex; flex-direction: column; gap: .15rem; }
.castdb-org-row a { color: inherit; text-decoration: underline; text-decoration-style: dotted; }
.castdb-org-row a:hover { color: inherit; text-decoration-style: dotted; }
.castdb-org-ext-icon { font-size: 14px !important; vertical-align: middle; margin-left: .15rem; opacity: .6; }


/* ─── Detail: link block (url / movie / contact) ─────────── */
.castdb-link-block            { background: #f5f5f5; border-radius: 8px; padding: .45rem .75rem; text-align: left; font-size: .82rem; word-break: break-all; line-height: 1.8; display: flex; align-items: flex-start; gap: .35rem; }
.castdb-link-block + .castdb-link-block { margin-top: .3rem; }
.castdb-link-icon             { font-size: 1rem; line-height: 1.8; flex-shrink: 0; color: #888; }
.castdb-link-lines            { border-left: 2px solid #ddd; padding-left: .6rem; }


/* ─── Detail: section titles / table ─────────────────────── */
.castdb-section       { margin-bottom: 2rem; }
.castdb-section-title { font-size: .85rem; font-weight: 700; color: #888; letter-spacing: .06em; border-bottom: 2px solid #eee; padding-bottom: .4rem; margin-bottom: 1rem; display: flex; align-items: center; gap: .4rem; }
.castdb-section-title .material-symbols-rounded { font-size: 1rem; color: #dc3545; }
.castdb-table    { width: 100%; font-size: .88rem; }
.castdb-table tr { border-bottom: 1px solid #f0f0f0; }
.castdb-table th { width: 8rem; padding: .55rem .5rem .55rem 0; color: #999; font-weight: 500; vertical-align: top; white-space: nowrap; }
.castdb-table td { padding: .55rem .5rem; color: #333; vertical-align: top; white-space: pre-wrap; word-break: break-all; }
.castdb-table td a { color: inherit; text-decoration: underline; text-decoration-style: dotted; }
.castdb-table td a:hover { color: inherit; text-decoration-style: dotted; }
.castdb-sub-text { font-size: .85em; color: #666; }


/* ─── Detail: sub images ──────────────────────────────────── */
.castdb-sub-imgs     { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px,1fr)); gap: .75rem; margin-top: 1rem; }
.castdb-sub-imgs img { width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: .4rem; cursor: pointer; transition: opacity .2s; }
.castdb-sub-imgs img:hover { opacity: .85; }


/* ─── Detail: text blocks ─────────────────────────────────── */
.castdb-pr-text      { font-size: .92rem; line-height: 1.9; color: #333; white-space: pre-wrap; }
.castdb-history-text { font-size: .88rem; line-height: 1.9; color: #333; white-space: pre-wrap; }


/* ─── Detail: back link ───────────────────────────────────── */
.castdb-back-link { font-size: .82rem; color: #888; text-decoration: none; }


/* ─── Detail: linkify anchors ─────────────────────────────── */
.castdb-ext-link      { color: #dc3545; word-break: break-all; }
.castdb-ext-link-icon { font-size: .95em; vertical-align: middle; margin-right: .15em; }
.castdb-mail-link     { color: #dc3545; }


/* ─── Modal ───────────────────────────────────────────────── */
.castdb-modal      { display: none; position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,.88); align-items: center; justify-content: center; }
.castdb-modal-close { position: absolute; top: 1rem; right: 1.2rem; background: none; border: none; color: #fff; font-size: 2.5rem; cursor: pointer; line-height: 1; padding: 0; }
.castdb-modal-prev,
.castdb-modal-next  { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.15); border: none; color: #fff; font-size: 2rem; cursor: pointer; padding: .3rem .75rem; border-radius: .4rem; line-height: 1; }
.castdb-modal-prev  { left: .8rem; }
.castdb-modal-next  { right: .8rem; }
.castdb-modal-img   { max-width: 90vw; max-height: 90vh; object-fit: contain; border-radius: .4rem; box-shadow: 0 8px 40px rgba(0,0,0,.6); }


/* ─── Detail: responsive ──────────────────────────────────── */
@media (max-width: 600px) {
    .castdb-hero      { flex-direction: column; align-items: center; text-align: center; }
    .castdb-hero-img  { width: 100%; max-width: 360px; }
    .castdb-hero-info { width: 100%; }
    .castdb-badges, .castdb-stat-row { justify-content: center; }
    .castdb-hero-info > div:not(.castdb-link-block),
    .castdb-hero-info > p { justify-content: center; }
    .castdb-link-block { justify-content: flex-start; width: 100%; box-sizing: border-box; }
    .castdb-table th   { width: 6rem; }
}


/* ─── List: layout ────────────────────────────────────────── */
.castdb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px,1fr)); gap: 1.25rem; }


/* ─── List: tabs ──────────────────────────────────────────── */
.castdb-tab-bar  { padding-top: 1.5rem; }
.castdb-tab-bar--inline { padding-top: 0; }
.castdb-tab-bar-inner { display: flex; align-items: flex-end; justify-content: space-between; }
.castdb-tabs     { display: inline-flex; gap: 0; border-bottom: 2px solid rgba(0,0,0,.1); }
.castdb-tab      { background: none; border: none; border-bottom: 3px solid transparent; margin-bottom: -2px; padding: .65rem 1.2rem; font-size: .82rem; font-weight: 600; color: #888; cursor: pointer; display: flex; align-items: center; gap: .35rem; transition: color .15s, border-color .15s; text-decoration: none; }
.castdb-tab .material-symbols-rounded { font-size: 1rem; }
.castdb-tab:hover      { color: #555; }
.castdb-tab--active    { color: #dc3545 !important; border-bottom-color: #dc3545 !important; }
.castdb-fav-count      { display: inline-flex; align-items: center; justify-content: center; background: #dc3545; color: #fff; border-radius: 10px; font-size: .6rem; font-weight: 700; min-width: 16px; height: 16px; padding: 0 4px; line-height: 1; }


/* ─── List: favorite button ───────────────────────────────── */
.castdb-fav-btn        { position: absolute; top: -8px; right: -8px; z-index: 2; background: rgba(0,0,0,.5); border: none; border-radius: 4px; width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; cursor: pointer; backdrop-filter: blur(2px); transition: background .15s, transform .1s; padding: 0; }
.castdb-fav-btn:hover  { background: rgba(0,0,0,.7); transform: scale(1.1); }
.castdb-fav-btn .castdb-fav-icon          { font-size: .78rem !important; color: rgba(255,255,255,.75); font-variation-settings: 'FILL' 0; transition: color .15s, font-variation-settings .15s; }
.castdb-fav-btn--active .castdb-fav-icon  { color: #fbbf24; font-variation-settings: 'FILL' 1; }
/* お気に入りパネル内のみグレー × スタイル */
#castdb-favs-panel .castdb-card            { overflow: hidden; border-radius: .6rem; }
#castdb-favs-panel .castdb-card-img-wrap   { border-radius: 0; }
#castdb-favs-panel .castdb-fav-btn         { top: 4px; right: 4px; }
#castdb-favs-panel .castdb-fav-btn        { background: rgba(107,114,128,.8); }
#castdb-favs-panel .castdb-fav-btn:hover  { background: rgba(75,85,99,.95); }
#castdb-favs-panel .castdb-fav-btn .castdb-fav-icon          { color: #fff; font-variation-settings: 'FILL' 0; }
#castdb-favs-panel .castdb-fav-btn--active .castdb-fav-icon  { color: #fff; font-variation-settings: 'FILL' 0; }
/* 詳細ページ fav ボタン */
.castdb-detail-fav-btn { width: 30px; height: 30px; }
.castdb-detail-fav-btn .castdb-fav-icon { font-size: 1.05rem !important; }


/* ─── List: login modal ───────────────────────────────────── */
.castdb-login-modal     { display: none; position: fixed; inset: 0; z-index: 10000; background: rgba(0,0,0,.6); align-items: center; justify-content: center; }
.castdb-login-modal-box { background: #fff; border-radius: 12px; padding: 2rem 1.75rem; max-width: 340px; width: 90%; text-align: center; position: relative; box-shadow: 0 8px 40px rgba(0,0,0,.22); }
.castdb-login-modal-close { position: absolute; top: .6rem; right: .9rem; background: none; border: none; font-size: 1.6rem; color: #aaa; cursor: pointer; line-height: 1; padding: 0; }
.castdb-login-modal-close:hover { color: #555; }
.castdb-login-modal-icon  { font-size: 2.8rem; color: #fbbf24; font-variation-settings: 'FILL' 1; display: block; margin-bottom: .5rem; }
.castdb-login-modal-title { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; color: #1a1a2e; }
.castdb-login-modal-text  { font-size: .82rem; color: #666; margin-bottom: .75rem; line-height: 1.6; }
.castdb-login-modal-features { list-style: none; padding: 0; margin: 0 0 1.25rem; text-align: left; display: flex; flex-direction: column; gap: .35rem; }
.castdb-login-modal-features li { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: #555; }
.castdb-login-modal-features li .material-symbols-rounded { font-size: 1rem; color: #fbbf24; font-variation-settings: 'FILL' 1; flex-shrink: 0; }
.castdb-login-modal-btns  { display: flex; flex-direction: column; gap: .6rem; }
.castdb-login-modal-btn--login    { background: #1a1a2e; color: #fff; border-radius: 8px; font-size: .85rem; font-weight: 600; padding: .55rem; text-decoration: none; }
.castdb-login-modal-btn--login:hover    { background: #2d2d4e; color: #fff; text-decoration: none; }
.castdb-login-modal-btn--register { background: #dc3545; color: #fff; border-radius: 8px; font-size: .85rem; font-weight: 600; padding: .55rem; text-decoration: none; }
.castdb-login-modal-btn--register:hover { background: #b91c2c; color: #fff; text-decoration: none; }

/* ─── Favs: clear button ──────────────────────────────────── */
.castdb-favs-clear-btn { display: inline-flex; align-items: center; gap: .3rem; background: none; border: 1px solid #d1d5db; border-radius: 6px; font-size: .75rem; color: #888; padding: 3px 10px; cursor: pointer; transition: color .15s, border-color .15s; }
.castdb-favs-clear-btn .material-symbols-rounded { font-size: .95rem; }
.castdb-favs-clear-btn:hover { color: #dc3545; border-color: #dc3545; }

/* ─── Favs: drag hint ─────────────────────────────────────── */
.castdb-favs-hint { display: flex; align-items: center; gap: .3rem; font-size: .72rem; color: #aaa; padding: .5rem 0 0; }
.castdb-favs-hint-icon { font-size: .95rem; color: #bbb; }
/* お気に入りタブ表示時はカードグリッド上の余白を縮小 */
#castdb-favs-panel { margin-top: -.75rem; }

/* hint の直後のグリッド（favsPanel内）に上マージン */
#castdb-favs-panel .castdb-grid { margin-top: .4rem; grid-template-columns: repeat(auto-fill, minmax(110px,1fr)); gap: .5rem; }

/* ─── Favs: filter disabled state ────────────────────────── */
.castdb-filter--disabled { opacity: .4; pointer-events: none; user-select: none; }

/* ─── 仕訳エリア ─────────────────────────────────────────── */
#castdb-fav-sorter { margin-bottom: 1.25rem; }
.castdb-fav-sorter-header { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.castdb-fav-sorter-title { display: inline-flex; align-items: center; gap: .25rem; font-size: .78rem; font-weight: 600; color: #555; }
.castdb-fav-sorter-title .material-symbols-rounded { font-size: 1.05rem; color: #888; }
.castdb-add-group-btn { display: inline-flex; align-items: center; gap: .2rem; background: none; border: 1px dashed #c8cacd; border-radius: 6px; font-size: .72rem; color: #999; padding: 3px 10px; cursor: pointer; transition: color .15s, border-color .15s; }
.castdb-add-group-btn:hover { color: #555; border-color: #888; }
.castdb-add-group-btn .material-symbols-rounded { font-size: .9rem; }
#castdb-add-group-form { display: flex; align-items: center; gap: .4rem; }
#castdb-add-group-input { font-size: .8rem; border: 1px solid #d1d5db; border-radius: 6px; padding: 3px 8px; outline: none; width: 150px; }
#castdb-add-group-input:focus { border-color: #777; }
#castdb-add-group-ok { font-size: .72rem; background: #555; color: #fff; border: none; border-radius: 6px; padding: 3px 10px; cursor: pointer; }
#castdb-add-group-cancel { font-size: .72rem; background: none; border: 1px solid #d1d5db; border-radius: 6px; padding: 3px 8px; cursor: pointer; color: #888; }
/* グループボックス */
.castdb-fav-group { margin-bottom: 1.75rem; }
/* グループ並び替え */
.castdb-fav-group-header { display: flex; align-items: center; gap: .3rem; margin-bottom: .15rem; cursor: grab; }
.castdb-fav-group-header:active { cursor: grabbing; }
.castdb-fav-group--drag-ghost { opacity: .4; }
.castdb-fav-group--drag-chosen { box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.castdb-fav-group-icon { font-size: .9rem; color: #aaa; display: inline-flex; align-items: center; line-height: 1; }
.castdb-fav-group-label { font-size: .95rem; font-weight: 600; color: #444; flex: 1; }
.castdb-fav-group-rename-btn, .castdb-fav-group-delete-btn { background: none; border: none; cursor: pointer; padding: 3px; color: #aaa; display: inline-flex; align-items: center; transition: color .15s; border-radius: 4px; }
.castdb-fav-group-rename-btn:hover { color: #444; background: #f0f0f0; }
.castdb-fav-group-delete-btn:hover { color: #dc3545; background: #fff0f0; }
.castdb-fav-group-rename-btn .material-symbols-rounded, .castdb-fav-group-delete-btn .material-symbols-rounded { font-size: 1rem; }
.castdb-fav-group-rename-input { font-size: .78rem; font-weight: 600; color: #444; border: 1px solid #888; border-radius: 4px; padding: 1px 6px; outline: none; flex: 1; max-width: 180px; }
/* 開閉トグル */
.castdb-fav-group-toggle { background: #e8e8e8; border: none; cursor: pointer; padding: 2px; color: #888; display: inline-flex; align-items: center; transition: color .15s; border-radius: 4px; flex-shrink: 0; }
.castdb-fav-group-toggle:hover { color: #333; background: #d4d4d4; }
.castdb-fav-group-toggle .material-symbols-rounded { font-size: 1.1rem; transition: transform .2s; }
.castdb-fav-group--collapsed .castdb-fav-group-toggle .material-symbols-rounded { transform: rotate(-90deg); }
.castdb-fav-group--collapsed .castdb-fav-group-grid { display: none; }
.castdb-fav-group-grid { min-height: 72px; border: 2.5px dashed #b0b7c0; border-radius: .6rem; padding: .5rem; transition: border-color .15s, background .15s; }
.castdb-fav-group-grid.sortable-drag-over { border-color: #dc3545 !important; background: rgba(220,53,69,.04); }
.castdb-fav-group-dropzone { display: flex; align-items: center; justify-content: center; gap: .3rem; color: #ccc; font-size: .72rem; padding: 1.25rem; pointer-events: none; }
.castdb-fav-group-dropzone .material-symbols-rounded { font-size: .95rem; }
/* カードがある時はドロップゾーンを非表示 */
.castdb-fav-group-grid:has(.castdb-card) .castdb-fav-group-dropzone { display: none; }
/* 未分類グループの空メッセージ */
.castdb-group-empty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .4rem; font-size: .8rem; color: #bbb; padding: 1.5rem; margin: 0; pointer-events: none; text-align: center; line-height: 1.5; width: 100%; }
.castdb-group-empty .material-symbols-rounded { font-size: 1.6rem; color: #d4d4d4; font-variation-settings: 'FILL' 1; }


/* ─── List: cards ─────────────────────────────────────────── */
.castdb-card              { background: #fff; border-radius: .6rem; overflow: visible; box-shadow: 0 1px 6px rgba(0,0,0,.07); text-decoration: none; color: inherit; display: flex; flex-direction: column; transition: box-shadow .18s, transform .18s; position: relative; min-width: 0; }
.castdb-card:hover        { box-shadow: 0 4px 18px rgba(0,0,0,.13); transform: translateY(-2px); color: inherit; text-decoration: none; }
/* ドラッグ＆ドロップ */
.castdb-card--drag-ghost  { opacity: .35; border: 2px dashed #dc3545; border-radius: .6rem; }
.castdb-card--drag-chosen { cursor: grabbing; box-shadow: 0 8px 28px rgba(0,0,0,.22); transform: scale(1.03); }
.castdb-card--dragging    { opacity: .9; }
.castdb-card-link-overlay { position: absolute; inset: 0; z-index: 0; }
.castdb-card-img-wrap     { position: relative; overflow: hidden; border-radius: .6rem .6rem 0 0; cursor: grab; }
.castdb-card-img-wrap:active { cursor: grabbing; }
.castdb-card-img          { width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block; }
.castdb-card-img-placeholder { width: 100%; aspect-ratio: 3/4; background: #e9ecef; display: flex; align-items: center; justify-content: center; }
.castdb-card-placeholder-icon { font-size: 3.5rem; color: #ccc; }
.castdb-card-edit-btn     { position: absolute; bottom: .45rem; right: .45rem; background: rgba(0,0,0,.55); color: #fff; border: none; border-radius: 4px; font-size: .65rem; font-weight: 600; padding: 3px 9px; line-height: 1.6; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: .2rem; backdrop-filter: blur(2px); transition: background .15s; z-index: 1; }
.castdb-card-edit-btn:hover { background: rgba(220,53,69,.85); color: #fff; text-decoration: none; }
.castdb-card-edit-btn .material-symbols-rounded { font-size: .85rem; line-height: 1; }
.castdb-card-body         { padding: .65rem .75rem .75rem; flex: 1; display: flex; flex-direction: column; gap: .3rem; min-width: 0; overflow: hidden; }
.castdb-card-name         { font-weight: 700; font-size: .92rem; line-height: 1.3; color: #1a1a2e; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.castdb-card-kana         { font-size: .68rem; color: #999; letter-spacing: .05em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.castdb-card-badges       { display: flex; flex-wrap: wrap; gap: 3px; margin-top: .1rem; }
.castdb-card-badge        { font-size: .65rem; font-weight: 600; padding: 1px 6px; border-radius: 3px; line-height: 1.7; white-space: nowrap; }
.castdb-card-badge.accent { background: #fef2f2; color: #dc3545; border: 1px solid #fca5a5; }
.castdb-card-badge.grey   { background: #f3f4f6; color: #555; border: 1px solid #e5e7eb; }
.castdb-card-stats        { font-size: .7rem; color: #888; display: flex; flex-wrap: wrap; gap: 0 .6rem; margin-top: .15rem; overflow: hidden; }
.castdb-card-stats span   { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.castdb-card-area         { font-size: .68rem; color: #aaa; display: flex; align-items: center; gap: 2px; margin-top: auto; padding-top: .3rem; margin-left: -3px; overflow: hidden; flex-wrap: nowrap; min-width: 0; }
.castdb-card-area-text    { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex-shrink: 1; }
.castdb-card-area-lang    { margin-left: .4rem; padding-left: .4rem; border-left: 1px solid #ddd; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 1; min-width: 0; }
.castdb-card-area-icon    { font-size: .8rem; flex-shrink: 0; }
.castdb-card-org-icon     { font-size: 15px !important; vertical-align: middle; margin-right: .1rem; }


/* ─── List: page header ───────────────────────────────────── */
.castdb-list-header { background: linear-gradient(135deg, #f0f2f5 0%, #e8eaed 100%); }
.castdb-list-title  { font-size: 1.35rem; letter-spacing: .02em; color: #1a1a2e; }
.castdb-list-meta   { font-size: .82rem; color: #6b7280; }
.castdb-list-icon   { font-size: 1.4rem; vertical-align: -3px; color: #e63946; }
.castdb-list-count  { color: #1a1a2e; }


/* ─── List: filter bar ────────────────────────────────────── */
.castdb-filter-bar   { background: linear-gradient(135deg, #f0f2f5 0%, #e8eaed 100%); border-bottom: 1px solid #d1d5db; }
.castdb-filter-label { font-size: .7rem; color: #888; white-space: nowrap; min-width: 4em; }
.castdb-filter-btn          { font-size: .68rem !important; border-radius: 20px !important; padding: 2px 9px !important; }
.castdb-filter-btn--active  { background: #555555 !important; color: #fff !important; border-color: #555555 !important; }
.castdb-filter-btn--inactive{ background: #fff !important; color: #555 !important; border-color: #d1d5db !important; }


/* ─── List: area filter ───────────────────────────────────── */
.castdb-area-filter-wrap { background: #fff; border-bottom: 1px solid #e5e7eb; }
.castdb-tune-btn         { font-size: .75rem; color: #555; background: none; border: none; padding-left: 0 !important; margin-left: -3px; }
.castdb-tune-icon        { font-size: .95rem; color: #888; }
.castdb-filter-chevron   { font-size: .95rem; color: #aaa; transition: transform .2s; }
.castdb-area-label       { font-size: .72rem; color: #888; white-space: nowrap; flex: 0 0 8em; padding-top: 3px; }
.castdb-area-filter-btn           { font-size: .65rem !important; border-radius: 20px !important; padding: 1px 8px !important; }
.castdb-area-filter-btn--active   { background: #555555 !important; color: #fff !important; border-color: #555555 !important; }
.castdb-area-filter-btn--inactive { background: #f9fafb !important; color: #555 !important; border-color: #d1d5db !important; }
.castdb-country-display { font-size: .68rem; color: #555; background: #e5e7eb; border-radius: 4px; padding: 2px 8px; line-height: 1.7; }
.castdb-country-select  { font-size: .78rem; border: 1px solid #d1d5db; border-radius: 6px; padding: 3px 10px; color: #333; background: #fff; cursor: pointer; }
.castdb-country-toggle  { font-size: .68rem; color: #888; text-decoration: underline; text-underline-offset: 2px; margin-left: .5rem; }


/* ─── List: error / empty ─────────────────────────────────── */
.castdb-error-text { color: #dc3545; font-size: .8rem; margin-bottom: 1rem; }
.castdb-empty-text { color: #888; padding: 60px 0; text-align: center; }
.castdb-empty-icon { font-size: 2.5rem; color: #ccc; }


/* ─── List: pagination ────────────────────────────────────── */
.castdb-pagination .page-link           { border-radius: 8px !important; font-size: .82rem; }
.castdb-pagination .page-item.active .page-link { background-color: #dc3545 !important; border-color: #dc3545 !important; }
.castdb-page-icon { font-size: .9rem; }


/* ─── List: responsive ────────────────────────────────────── */
@media (max-width: 480px) {
    .castdb-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
}