@import 'common.css';

.page-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 0; }
.page-header h1 { font-family: var(--font-heading); font-size: 28px; font-weight: 600; color: var(--color-ink); }
.search-form { display: flex; gap: 12px; flex-wrap: wrap; }
.search-form input { padding: 12px 18px; border: 1px solid var(--light-border); border-radius: 14px; width: 220px; font-family: inherit; background: rgba(255, 255, 255, 0.65); backdrop-filter: blur(8px); }
.search-form select { padding: 12px 16px; border: 1px solid var(--light-border); border-radius: 14px; font-family: inherit; background: rgba(255, 255, 255, 0.65); backdrop-filter: blur(8px); }
.search-form button { padding: 12px 24px; background: linear-gradient(145deg, #d4728f, var(--color-primary)); color: #fff; border: none; border-radius: 14px; cursor: pointer; font-family: inherit; font-weight: 500; transition: opacity 0.2s, transform 0.2s; box-shadow: 0 4px 16px rgba(199, 91, 122, 0.25); }
.search-form button:hover { background: var(--color-primary-hover); }

.products-section { margin-bottom: 80px; }
.product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 22px; align-items: stretch; }
/* 空状态独占整行，按钮才能与兼职页一样横向排开 */
.product-grid > .empty-state-block {
    grid-column: 1 / -1;
    justify-self: stretch;
    max-width: 100%;
}
.product-card {
    position: relative;
    background: rgba(255, 252, 254, 0.55);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.75);
    transition: all 0.28s ease;
    color: inherit;
    box-shadow: 0 4px 24px rgba(199, 91, 122, 0.08);
}
.product-card-stretch { position: absolute; inset: 0; z-index: 1; }
.product-info .seller-link { pointer-events: auto; position: relative; z-index: 2; }
.product-card:hover {
    box-shadow: 0 14px 40px rgba(199, 91, 122, 0.14);
    border-color: rgba(255, 190, 210, 0.9);
    text-decoration: none;
    color: inherit;
    transform: translateY(-5px);
}
.product-image { height: 180px; background: linear-gradient(145deg, rgba(255, 248, 252, 0.95), rgba(255, 228, 240, 0.7)); display: flex; align-items: center; justify-content: center; overflow: hidden; pointer-events: none; }
.product-image span { color: var(--color-ink-muted); font-size: 14px; }
.product-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.35s; }
.product-card:hover .product-image img { transform: scale(1.06); }
.product-info { position: relative; padding: 16px 18px 14px; pointer-events: none; }
.product-info h4 { font-size: 15px; margin: 0 0 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-ink); line-height: 1.35; }
.product-info p { margin: 0; line-height: 1.45; }
.product-info .price { color: var(--color-price); font-weight: 700; font-size: 17px; }
.product-info .seller { color: var(--color-ink-muted); font-size: 13px; margin-top: 8px; }
.product-info .product-date { font-size: 12px; color: var(--color-ink-muted); margin-top: 6px; }