/* Card search results — shared by the search page and the set-list live search */
.card-search-header {
    padding: 20px 0 12px;
}
.card-search-title {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--body-fg, #1b1f26);
    margin: 0 0 4px;
}
.card-search-meta {
    font-size: 0.9rem;
    color: var(--muted, #6b7280);
}
.card-search-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding: 16px 0 60px;
}
@media (max-width: 1024px) { .card-search-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .card-search-grid { grid-template-columns: repeat(2, 1fr); } }
.card-search-item {
    background: var(--card-bg, #fff);
    border-radius: 10px;
    border: 1px solid var(--border, #e5e7eb);
    overflow: hidden;
    transition: transform 0.15s, box-shadow 0.15s;
    display: flex;
    flex-direction: column;
}
.card-search-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.12);
}
.card-search-img-wrap {
    cursor: pointer;
    background: #f3f4f6;
    aspect-ratio: 2.5/3.5;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.card-search-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.card-search-info {
    padding: 8px 10px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.card-search-name {
    font-weight: 600;
    font-size: 0.82rem;
    color: var(--body-fg, #1b1f26);
    line-height: 1.3;
}
.card-search-number {
    font-size: 0.75rem;
    color: var(--muted, #6b7280);
}
.card-search-set-link {
    font-size: 0.72rem;
    font-weight: 600;
    color: #0d6efd;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.card-search-set-link:hover {
    text-decoration: underline;
}
.card-search-variants {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: auto;
    padding-top: 6px;
}
.card-search-banner {
    margin: 0 0 12px;
}
.card-search-banner img {
    display: block;
    width: 100%;
    height: auto;
}
.card-search-empty {
    text-align: center;
    padding: 60px 20px;
    color: var(--muted, #6b7280);
}
.card-search-empty svg {
    margin-bottom: 16px;
    opacity: 0.3;
}

/* Dark mode — token-driven so museum IPs (body.museum-ip) get the brown palette */
html.dark-mode .card-search-title { color: var(--ms-text-strong, #e5e7eb); }
html.dark-mode .card-search-meta  { color: var(--ms-text-muted, #9ca3af); }
html.dark-mode .card-search-item {
    background: var(--ms-bg-surface-alt, #1a2233);
    border-color: var(--ms-border-panel, #1f2937);
}
html.dark-mode .card-search-item:hover {
    box-shadow: 0 6px 20px rgba(0,0,0,0.4);
}
html.dark-mode .card-search-img-wrap { background: var(--ms-bg-image-ph, #0f1115); }
html.dark-mode .card-search-name     { color: var(--ms-text-strong, #e5e7eb); }
html.dark-mode .card-search-number   { color: var(--ms-text-muted, #9ca3af); }
html.dark-mode .card-search-set-link { color: var(--ms-link, #60a5fa); }
html.dark-mode .card-search-empty    { color: var(--ms-text-muted, #9ca3af); }

/* Ownership buttons — same look as the gallery (mirrors its stylesheet so this
   file stands alone on the set-list page) */
.card-search-variants .ms-own-btn {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.75em;
    font-weight: 500;
    background-color: #f0f0f0;
    color: #666;
    border: 1px solid #ddd;
    transition: all 0.15s ease;
}
.card-search-variants .ms-own-btn.ms-owned {
    background-color: #d4edda;
    color: #155724;
    border-color: #c3e6cb;
}
.card-search-variants .ms-own-btn:hover { opacity: 0.85; }
html.dark-mode .card-search-variants .ms-own-btn {
    background-color: var(--ms-bg-muted, #374151);
    color: var(--ms-text, #d1d5db);
    border-color: var(--ms-border-panel, #4b5563);
}
html.dark-mode .card-search-variants .ms-own-btn.ms-owned {
    background-color: #d4edda;
    color: #155724;
    border-color: #c3e6cb;
}