.store-available-items { border-top: var(--border-width-thin) solid var(--color-border-light); padding-top: var(--spacing-md); } .store-available-items-header { display: flex; justify-content: space-between; gap: var(--spacing-md); align-items: flex-start; } .store-available-items-header h4 { margin: 0; color: var(--color-text-primary); font-size: var(--font-size-base); } .store-available-items-header p { margin: var(--spacing-xs) 0 0; color: var(--color-text-secondary); font-size: var(--font-size-sm); } .store-available-items-panel { margin-top: var(--spacing-md); display: flex; flex-direction: column; gap: var(--spacing-md); } .store-available-items-notice { margin: 0; padding: var(--spacing-sm) var(--spacing-md); border: var(--border-width-thin) solid var(--color-border-light); border-radius: var(--border-radius-md); background: var(--color-bg-surface); color: var(--color-text-secondary); } .store-available-items-toolbar { display: flex; gap: var(--spacing-sm); align-items: center; flex-wrap: wrap; } .store-available-items-search { flex: 1 1 240px; padding: var(--input-padding-y) var(--input-padding-x); border: var(--border-width-thin) solid var(--input-border-color); border-radius: var(--input-border-radius); background: var(--color-bg-surface); color: var(--color-text-primary); } .store-available-items-toolbar-actions { display: flex; gap: var(--spacing-sm); flex-wrap: wrap; } .store-available-items-list { display: flex; flex-direction: column; gap: var(--spacing-sm); } .store-available-items-card { display: flex; justify-content: space-between; gap: var(--spacing-sm); align-items: center; padding: var(--spacing-sm); border: var(--border-width-thin) solid var(--color-border-light); border-radius: var(--border-radius-md); background: var(--color-bg-surface); } .store-available-items-summary { display: flex; align-items: center; gap: var(--spacing-sm); min-width: 0; } .store-available-items-thumb { width: 48px; height: 48px; border-radius: var(--border-radius-md); object-fit: cover; background: var(--color-bg-muted); flex-shrink: 0; } .store-available-items-thumb-placeholder { display: inline-flex; align-items: center; justify-content: center; color: var(--color-text-secondary); font-weight: var(--font-weight-semibold); } .store-available-items-copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .store-available-items-copy strong { color: var(--color-text-primary); } .store-available-items-copy span { color: var(--color-text-secondary); font-size: var(--font-size-sm); } .store-available-items-actions { display: flex; gap: var(--spacing-xs); flex-wrap: wrap; } @media (max-width: 640px) { .store-available-items-header, .store-available-items-card, .store-available-items-toolbar { flex-direction: column; align-items: stretch; } .store-available-items-actions, .store-available-items-toolbar-actions { width: 100%; } .store-available-items-actions button, .store-available-items-toolbar-actions button { flex: 1; } }