.admin-seller-management-page { display: flex; align-items: center; justify-content: center; min-height: 60vh; padding: var(--space-lg, 1.5rem); } .admin-seller-management-page__icon { display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; border-radius: var(--radius-full, 999px); background: color-mix(in srgb, var(--primary-color, #2f6e5d) 12%, transparent); color: var(--primary-color, #2f6e5d); margin-inline: auto; } .admin-seller-management-page__actions { display: flex; gap: var(--space-sm, 0.5rem); flex-wrap: wrap; justify-content: center; } .admin-seller-management-page__form { display: flex; flex-direction: column; gap: var(--space-md, 1rem); } .admin-seller-management-page__textarea { width: 100%; min-height: 96px; resize: vertical; border: 1px solid var(--border-color, #e4e4e7); border-radius: var(--radius-md, 6px); background: var(--bg-primary, #fff); color: var(--text-primary, #1f322d); font-family: inherit; font-size: var(--font-size-md, 0.9375rem); padding: var(--space-sm, 0.5rem) var(--space-md, 1rem); transition: border-color var(--transition-fast, 120ms ease), box-shadow var(--transition-fast, 120ms ease); &::placeholder { color: var(--text-secondary, #6b7280); } &:hover:not(:disabled) { border-color: var(--primary-color, #2f6e5d); } &:focus-visible { outline: none; border-color: var(--primary-color, #2f6e5d); box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color, #2f6e5d) 25%, transparent); } } .admin-seller-management-page__dialog-actions { display: flex; justify-content: flex-end; gap: var(--space-sm, 0.5rem); margin-top: var(--space-md, 1rem); } .admin-seller-management-page__feature-list { display: flex; flex-direction: column; gap: var(--space-xs, 0.375rem); margin: var(--space-md, 1rem) 0 0; padding-inline-start: var(--space-md, 1rem); color: var(--text-primary, #1f322d); font-size: var(--font-size-md, 0.9375rem); } @media (prefers-reduced-motion: reduce) { .admin-seller-management-page__textarea { transition: none; } } @media (max-width: 640px) { .admin-seller-management-page { min-height: auto; padding: var(--space-md, 1rem); } .admin-seller-management-page__actions { flex-direction: column; width: 100%; app-button { width: 100%; } } }